From 5d5e722ca7acb6a8562d021fadf89bd7a4516641 Mon Sep 17 00:00:00 2001 From: Aaryan Khandelwal Date: Tue, 2 Dec 2025 17:56:10 +0530 Subject: [PATCH] chore: init tailwind v4 --- apps/web/package.json | 1 + apps/web/postcss.config.cjs | 3 - apps/web/postcss.config.js | 3 + apps/web/styles/globals.css | 590 +++----------- apps/web/tailwind.config.cjs | 8 - packages/tailwind-config/animations.css | 14 + packages/tailwind-config/colors.css | 479 +++++++++++ packages/tailwind-config/global.css | 833 -------------------- packages/tailwind-config/index.css | 401 ++++++++++ packages/tailwind-config/package.json | 16 +- packages/tailwind-config/postcss.config.js | 7 +- packages/tailwind-config/spacing.css | 39 + packages/tailwind-config/tailwind.config.js | 492 ------------ packages/tailwind-config/typography.css | 400 ++++++++++ pnpm-lock.yaml | 646 +++++++++------ 15 files changed, 1834 insertions(+), 2098 deletions(-) delete mode 100644 apps/web/postcss.config.cjs create mode 100644 apps/web/postcss.config.js delete mode 100644 apps/web/tailwind.config.cjs create mode 100644 packages/tailwind-config/animations.css create mode 100644 packages/tailwind-config/colors.css delete mode 100644 packages/tailwind-config/global.css create mode 100644 packages/tailwind-config/index.css create mode 100644 packages/tailwind-config/spacing.css delete mode 100644 packages/tailwind-config/tailwind.config.js create mode 100644 packages/tailwind-config/typography.css diff --git a/apps/web/package.json b/apps/web/package.json index 01a3e360bd..a9f2578c36 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -81,6 +81,7 @@ "@plane/typescript-config": "workspace:*", "@prettier/plugin-oxc": "0.0.4", "@react-router/dev": "catalog:", + "@tailwindcss/typography": "0.5.19", "@types/lodash-es": "catalog:", "@types/node": "catalog:", "@types/react": "catalog:", diff --git a/apps/web/postcss.config.cjs b/apps/web/postcss.config.cjs deleted file mode 100644 index 3764bc499b..0000000000 --- a/apps/web/postcss.config.cjs +++ /dev/null @@ -1,3 +0,0 @@ -// eslint-disable-next-line @typescript-eslint/no-require-imports -module.exports = require("@plane/tailwind-config/postcss.config.js"); - diff --git a/apps/web/postcss.config.js b/apps/web/postcss.config.js new file mode 100644 index 0000000000..55c305d0c2 --- /dev/null +++ b/apps/web/postcss.config.js @@ -0,0 +1,3 @@ +import postcss from "@plane/tailwind-config/postcss.config.js"; + +export default postcss; diff --git a/apps/web/styles/globals.css b/apps/web/styles/globals.css index 509910022c..93c027bd37 100644 --- a/apps/web/styles/globals.css +++ b/apps/web/styles/globals.css @@ -1,507 +1,115 @@ +@import "@plane/tailwind-config/index.css"; @import "@plane/propel/styles/fonts"; @import "@plane/editor/styles"; -@tailwind base; -@tailwind components; -@tailwind utilities; +@plugin "@tailwindcss/typography"; -@layer components { - .text-1\.5xl { - font-size: 1.375rem; - line-height: 1.875rem; - } - - .text-2\.5xl { - font-size: 1.75rem; - line-height: 2.25rem; - } +html { + font-family: "Inter", sans-serif; } -@layer utilities { - @keyframes slide-up { - from { - transform: translateY(10px); - opacity: 0; - } - to { - transform: translateY(0); - opacity: 1; - } - } +:root { + /* Plane subscriptions */ + --color-subscription-free-200: 69, 80, 104; + --color-subscription-free-400: 51, 59, 77; - .animate-slide-up { - animation: slide-up 0.3s ease-out forwards; - } + --color-subscription-one-200: 101, 42, 14; + --color-subscription-one-400: 90, 37, 12; + + --color-subscription-pro-200: 32, 128, 138; + --color-subscription-pro-400: 24, 96, 104; + + --color-subscription-business-200: 142, 33, 87; + --color-subscription-business-400: 103, 24, 63; + + --color-subscription-enterprise-200: 86, 5, 145; + --color-subscription-enterprise-400: 73, 4, 123; } -@layer base { - html { - font-family: "Inter", sans-serif; - } +[data-theme="light"], +[data-theme="light-contrast"] { + /* Plane subscriptions */ + --color-subscription-free-200: 69, 80, 104; + --color-subscription-free-400: 51, 59, 77; + + --color-subscription-one-200: 101, 42, 14; + --color-subscription-one-400: 90, 37, 12; + + --color-subscription-pro-200: 32, 128, 138; + --color-subscription-pro-400: 24, 96, 104; + + --color-subscription-business-200: 142, 33, 87; + --color-subscription-business-400: 103, 24, 63; + + --color-subscription-enterprise-200: 86, 5, 145; + --color-subscription-enterprise-400: 73, 4, 123; +} + +[data-theme="dark"], +[data-theme="dark-contrast"] { + /* Plane subscriptions */ + --color-subscription-free-200: 206, 213, 232; + --color-subscription-free-400: 152, 166, 206; + + --color-subscription-one-200: 255, 148, 153; + --color-subscription-one-400: 200, 118, 121; + + --color-subscription-pro-200: 12, 170, 192; + --color-subscription-pro-400: 9, 130, 154; + + --color-subscription-business-200: 206, 34, 119; + --color-subscription-business-400: 140, 23, 81; + + --color-subscription-enterprise-200: 182, 71, 255; + --color-subscription-enterprise-400: 134, 11, 203; +} + +/* stickies and editor colors */ +:root { + /* text colors */ + --editor-colors-gray-text: #5c5e63; + --editor-colors-peach-text: #ff5b59; + --editor-colors-pink-text: #f65385; + --editor-colors-orange-text: #fd9038; + --editor-colors-green-text: #0fc27b; + --editor-colors-light-blue-text: #17bee9; + --editor-colors-dark-blue-text: #266df0; + --editor-colors-purple-text: #9162f9; + /* end text colors */ - :root { - color-scheme: light !important; - - --color-primary-10: 229, 243, 250; - --color-primary-20: 216, 237, 248; - --color-primary-30: 199, 229, 244; - --color-primary-40: 169, 214, 239; - --color-primary-50: 144, 202, 234; - --color-primary-60: 109, 186, 227; - --color-primary-70: 75, 170, 221; - --color-primary-80: 41, 154, 214; - --color-primary-90: 34, 129, 180; - --color-primary-100: 0, 99, 153; - --color-primary-200: 0, 92, 143; - --color-primary-300: 0, 86, 133; - --color-primary-400: 0, 77, 117; - --color-primary-500: 0, 66, 102; - --color-primary-600: 0, 53, 82; - --color-primary-700: 0, 43, 66; - --color-primary-800: 0, 33, 51; - --color-primary-900: 0, 23, 36; - - --color-error-10: 255 252 252; - --color-error-20: 255 247 247; - --color-error-30: 255, 219, 220; - --color-error-100: 244 170 170; - --color-error-200: 220 62 62; - --color-error-500: 140 51 58; - - --color-background-100: 255, 255, 255; /* primary bg */ - --color-background-90: 247, 247, 247; /* secondary bg */ - --color-background-80: 232, 232, 232; /* tertiary bg */ - - --color-background-primary: var(--color-primary-10); - --color-background-error: var(--color-error-20); - - --color-text-100: 23, 23, 23; /* primary text */ - --color-text-200: 58, 58, 58; /* secondary text */ - --color-text-300: 82, 82, 82; /* tertiary text */ - --color-text-350: 130, 130, 130; - --color-text-400: 163, 163, 163; /* placeholder text */ - - --color-text-primary: var(--color-primary-100); - --color-text-error: var(--color-error-200); - - --color-scrollbar: 163, 163, 163; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - - --color-border-primary: var(--color-primary-40); - --color-border-error: var(--color-error-100); - - --color-shadow-2xs: - 0px 0px 1px 0px rgba(23, 23, 23, 0.06), 0px 1px 2px 0px rgba(23, 23, 23, 0.06), - 0px 1px 2px 0px rgba(23, 23, 23, 0.14); - --color-shadow-xs: - 0px 1px 2px 0px rgba(0, 0, 0, 0.16), 0px 2px 4px 0px rgba(16, 24, 40, 0.12), - 0px 1px 8px -1px rgba(16, 24, 40, 0.1); - --color-shadow-sm: - 0px 1px 4px 0px rgba(0, 0, 0, 0.01), 0px 4px 8px 0px rgba(0, 0, 0, 0.02), 0px 1px 12px 0px rgba(0, 0, 0, 0.12); - --color-shadow-rg: - 0px 3px 6px 0px rgba(0, 0, 0, 0.1), 0px 4px 4px 0px rgba(16, 24, 40, 0.08), - 0px 1px 12px 0px rgba(16, 24, 40, 0.04); - --color-shadow-md: - 0px 4px 8px 0px rgba(0, 0, 0, 0.12), 0px 6px 12px 0px rgba(16, 24, 40, 0.12), - 0px 1px 16px 0px rgba(16, 24, 40, 0.12); - --color-shadow-lg: - 0px 6px 12px 0px rgba(0, 0, 0, 0.12), 0px 8px 16px 0px rgba(0, 0, 0, 0.12), - 0px 1px 24px 0px rgba(16, 24, 40, 0.12); - --color-shadow-xl: - 0px 0px 18px 0px rgba(0, 0, 0, 0.16), 0px 0px 24px 0px rgba(16, 24, 40, 0.16), - 0px 0px 52px 0px rgba(16, 24, 40, 0.16); - --color-shadow-2xl: - 0px 8px 16px 0px rgba(0, 0, 0, 0.12), 0px 12px 24px 0px rgba(16, 24, 40, 0.12), - 0px 1px 32px 0px rgba(16, 24, 40, 0.12); - --color-shadow-3xl: - 0px 12px 24px 0px rgba(0, 0, 0, 0.12), 0px 16px 32px 0px rgba(0, 0, 0, 0.12), - 0px 1px 48px 0px rgba(16, 24, 40, 0.12); - --color-shadow-4xl: 0px 8px 40px 0px rgba(0, 0, 61, 0.05), 0px 12px 32px -16px rgba(0, 0, 0, 0.05); - --color-shadow-custom: 2px 2px 8px 2px rgba(234, 231, 250, 0.3); - - --color-sidebar-background-100: var(--color-background-100); /* primary sidebar bg */ - --color-sidebar-background-90: var(--color-background-90); /* secondary sidebar bg */ - --color-sidebar-background-80: var(--color-background-80); /* tertiary sidebar bg */ - - --color-sidebar-text-100: var(--color-text-100); /* primary sidebar text */ - --color-sidebar-text-200: var(--color-text-200); /* secondary sidebar text */ - --color-sidebar-text-300: var(--color-text-300); /* tertiary sidebar text */ - --color-sidebar-text-400: var(--color-text-400); /* sidebar placeholder text */ - - --color-sidebar-border-100: var(--color-border-100); /* subtle sidebar border= 1 */ - --color-sidebar-border-200: var(--color-border-100); /* subtle sidebar border- 2 */ - --color-sidebar-border-300: var(--color-border-100); /* strong sidebar border- 1 */ - --color-sidebar-border-400: var(--color-border-100); /* strong sidebar border- 2 */ - - --color-sidebar-shadow-2xs: var(--color-shadow-2xs); - --color-sidebar-shadow-xs: var(--color-shadow-xs); - --color-sidebar-shadow-sm: var(--color-shadow-sm); - --color-sidebar-shadow-rg: var(--color-shadow-rg); - --color-sidebar-shadow-md: var(--color-shadow-md); - --color-sidebar-shadow-lg: var(--color-shadow-lg); - --color-sidebar-shadow-xl: var(--color-shadow-xl); - --color-sidebar-shadow-2xl: var(--color-shadow-2xl); - --color-sidebar-shadow-3xl: var(--color-shadow-3xl); - --color-sidebar-shadow-4xl: var(--color-shadow-4xl); - - /* pi */ - --color-pi-50: var(--color-background-90); - --color-pi-100: var(--color-background-90); - --color-pi-200: var(--color-primary-200); - --color-pi-300: var(--color-primary-200); - --color-pi-400: var(--color-primary-200); - --color-pi-500: var(--color-primary-200); - --color-pi-600: 151, 150, 246; - --color-pi-700: var(--color-primary-100); - --color-pi-800: 57, 56, 149; - --color-pi-900: 30, 29, 78; - --color-pi-950: 14, 14, 37; - - /* Plane subscriptions */ - --color-subscription-free-200: 69, 80, 104; - --color-subscription-free-400: 51, 59, 77; - - --color-subscription-one-200: 101, 42, 14; - --color-subscription-one-400: 90, 37, 12; - - --color-subscription-pro-200: 32, 128, 138; - --color-subscription-pro-400: 24, 96, 104; - - --color-subscription-business-200: 142, 33, 87; - --color-subscription-business-400: 103, 24, 63; - - --color-subscription-enterprise-200: 86, 5, 145; - --color-subscription-enterprise-400: 73, 4, 123; - - /* toast theme */ - --color-toast-success-text: 178, 221, 181; - --color-toast-error-text: 206, 44, 49; - --color-toast-warning-text: 255, 186, 24; - --color-toast-info-text: 141, 164, 239; - --color-toast-loading-text: 255, 255, 255; - --color-toast-secondary-text: 185, 187, 198; - --color-toast-tertiary-text: 139, 141, 152; - - --color-toast-success-background: 46, 46, 46; - --color-toast-error-background: 46, 46, 46; - --color-toast-warning-background: 46, 46, 46; - --color-toast-info-background: 46, 46, 46; - --color-toast-loading-background: 46, 46, 46; - - --color-toast-success-border: 42, 126, 59; - --color-toast-error-border: 100, 23, 35; - --color-toast-warning-border: 79, 52, 34; - --color-toast-info-border: 58, 91, 199; - --color-toast-loading-border: 96, 100, 108; - } - - [data-theme="light"], - [data-theme="light-contrast"] { - color-scheme: light !important; - - --color-background-100: 255, 255, 255; /* primary bg */ - --color-background-90: 247, 247, 247; /* secondary bg */ - --color-background-80: 232, 232, 232; /* tertiary bg */ - - /* pi */ - --color-pi-50: var(--color-background-90); - --color-pi-100: var(--color-background-90); - --color-pi-200: var(--color-primary-200); - --color-pi-300: var(--color-primary-200); - --color-pi-400: var(--color-primary-200); - --color-pi-500: var(--color-primary-200); - --color-pi-600: 151, 150, 246; - --color-pi-700: var(--color-primary-100); - --color-pi-800: 57, 56, 149; - --color-pi-900: 30, 29, 78; - --color-pi-950: 14, 14, 37; - - /* Plane subscriptions */ - --color-subscription-free-200: 69, 80, 104; - --color-subscription-free-400: 51, 59, 77; - - --color-subscription-one-200: 101, 42, 14; - --color-subscription-one-400: 90, 37, 12; - - --color-subscription-pro-200: 32, 128, 138; - --color-subscription-pro-400: 24, 96, 104; - - --color-subscription-business-200: 142, 33, 87; - --color-subscription-business-400: 103, 24, 63; - - --color-subscription-enterprise-200: 86, 5, 145; - --color-subscription-enterprise-400: 73, 4, 123; - } - - [data-theme="light"] { - --color-text-100: 23, 23, 23; /* primary text */ - --color-text-200: 58, 58, 58; /* secondary text */ - --color-text-300: 82, 82, 82; /* tertiary text */ - --color-text-350: 130, 130, 130; - --color-text-400: 163, 163, 163; /* placeholder text */ - - --color-scrollbar: 163, 163, 163; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - - /* onboarding colors */ - --gradient-onboarding-100: linear-gradient(106deg, #f2f6ff 29.8%, #e1eaff 99.34%); - --gradient-onboarding-200: linear-gradient(129deg, rgba(255, 255, 255, 0) -22.23%, rgba(255, 255, 255, 0.8) 62.98%); - --gradient-onboarding-300: linear-gradient(164deg, #fff 4.25%, rgba(255, 255, 255, 0.06) 93.5%); - --gradient-onboarding-400: linear-gradient(129deg, rgba(255, 255, 255, 0) -22.23%, rgba(255, 255, 255, 0.8) 62.98%); - - --color-onboarding-text-100: 23, 23, 23; - --color-onboarding-text-200: 58, 58, 58; - --color-onboarding-text-300: 82, 82, 82; - --color-onboarding-text-400: 163, 163, 163; - - --color-onboarding-background-100: 236, 241, 255; - --color-onboarding-background-200: 255, 255, 255; - --color-onboarding-background-300: 236, 241, 255; - --color-onboarding-background-400: 177, 206, 250; - - --color-onboarding-border-100: 229, 229, 229; - --color-onboarding-border-200: 217, 228, 255; - --color-onboarding-border-300: 229, 229, 229, 0.5; - - --color-onboarding-shadow-sm: 0px 4px 20px 0px rgba(126, 139, 171, 0.1); - - /* toast theme */ - --color-toast-success-text: 62, 155, 79; - --color-toast-error-text: var(--color-error-200); - --color-toast-warning-text: 255, 186, 24; - --color-toast-info-text: 51, 88, 212; - --color-toast-loading-text: 28, 32, 36; - --color-toast-secondary-text: 128, 131, 141; - --color-toast-tertiary-text: 96, 100, 108; - - --color-toast-success-background: 253, 253, 254; - --color-toast-error-background: var(--color-error-10); - --color-toast-warning-background: 254, 253, 251; - --color-toast-info-background: 253, 253, 254; - --color-toast-loading-background: 253, 253, 254; - - --color-toast-success-border: 218, 241, 219; - --color-toast-error-border: var(--color-error-30); - --color-toast-warning-border: 255, 247, 194; - --color-toast-info-border: 210, 222, 255; - --color-toast-loading-border: 224, 225, 230; - } - - [data-theme="light-contrast"] { - --color-text-100: 11, 11, 11; /* primary text */ - --color-text-200: 38, 38, 38; /* secondary text */ - --color-text-300: 58, 58, 58; /* tertiary text */ - --color-text-350: 80, 80, 80; - --color-text-400: 115, 115, 115; /* placeholder text */ - - --color-scrollbar: 115, 115, 115; /* scrollbar thumb */ - - --color-border-100: 34, 34, 34; /* subtle border= 1 */ - --color-border-200: 38, 38, 38; /* subtle border- 2 */ - --color-border-300: 46, 46, 46; /* strong border- 1 */ - --color-border-400: 58, 58, 58; /* strong border- 2 */ - } - - [data-theme="dark"], - [data-theme="dark-contrast"] { - color-scheme: dark !important; - - --color-primary-10: 8, 31, 43; - --color-primary-20: 10, 37, 51; - --color-primary-30: 13, 49, 69; - --color-primary-40: 16, 58, 81; - --color-primary-50: 18, 68, 94; - --color-primary-60: 23, 86, 120; - --color-primary-70: 28, 104, 146; - --color-primary-80: 31, 116, 163; - --color-primary-90: 34, 129, 180; - --color-primary-100: 40, 146, 204; - --color-primary-200: 41, 154, 214; - --color-primary-300: 75, 170, 221; - --color-primary-400: 109, 186, 227; - --color-primary-500: 144, 202, 234; - --color-primary-600: 169, 214, 239; - --color-primary-700: 199, 229, 244; - --color-primary-800: 216, 237, 248; - --color-primary-900: 229, 243, 250; - - --color-background-100: 25, 25, 25; /* primary bg */ - --color-background-90: 32, 32, 32; /* secondary bg */ - --color-background-80: 44, 44, 44; /* tertiary bg */ - - --color-background-primary: var(--color-background-90); - --color-background-error: var(--color-background-90); - - --color-text-primary: var(--color-primary-40); - --color-text-error: var(--color-error-100); - - --color-border-primary: var(--color-primary-200); - --color-border-error: var(--color-error-500); - - --color-shadow-2xs: 0px 0px 1px 0px rgba(0, 0, 0, 0.15), 0px 1px 3px 0px rgba(0, 0, 0, 0.5); - --color-shadow-xs: 0px 0px 2px 0px rgba(0, 0, 0, 0.2), 0px 2px 4px 0px rgba(0, 0, 0, 0.5); - --color-shadow-sm: 0px 0px 4px 0px rgba(0, 0, 0, 0.2), 0px 2px 6px 0px rgba(0, 0, 0, 0.5); - --color-shadow-rg: 0px 0px 6px 0px rgba(0, 0, 0, 0.2), 0px 4px 6px 0px rgba(0, 0, 0, 0.5); - --color-shadow-md: 0px 2px 8px 0px rgba(0, 0, 0, 0.2), 0px 4px 8px 0px rgba(0, 0, 0, 0.5); - --color-shadow-lg: 0px 4px 12px 0px rgba(0, 0, 0, 0.25), 0px 4px 10px 0px rgba(0, 0, 0, 0.55); - --color-shadow-xl: 0px 0px 14px 0px rgba(0, 0, 0, 0.25), 0px 6px 10px 0px rgba(0, 0, 0, 0.55); - --color-shadow-2xl: 0px 0px 18px 0px rgba(0, 0, 0, 0.25), 0px 8px 12px 0px rgba(0, 0, 0, 0.6); - --color-shadow-3xl: 0px 4px 24px 0px rgba(0, 0, 0, 0.3), 0px 12px 40px 0px rgba(0, 0, 0, 0.65); - - /* pi */ - --color-pi-50: var(--color-background-90); - --color-pi-100: var(--color-background-90); - --color-pi-200: var(--color-primary-200); - --color-pi-300: var(--color-primary-200); - --color-pi-400: var(--color-primary-200); - --color-pi-500: var(--color-primary-200); - --color-pi-600: 151, 150, 246; - --color-pi-700: var(--color-primary-100); - --color-pi-800: 57, 56, 149; - --color-pi-900: 30, 29, 78; - --color-pi-950: 14, 14, 37; - - /* Plane subscriptions */ - --color-subscription-free-200: 206, 213, 232; - --color-subscription-free-400: 152, 166, 206; - - --color-subscription-one-200: 255, 148, 153; - --color-subscription-one-400: 200, 118, 121; - - --color-subscription-pro-200: 12, 170, 192; - --color-subscription-pro-400: 9, 130, 154; - - --color-subscription-business-200: 206, 34, 119; - --color-subscription-business-400: 140, 23, 81; - - --color-subscription-enterprise-200: 182, 71, 255; - --color-subscription-enterprise-400: 134, 11, 203; - } - - [data-theme="dark"] { - --color-text-100: 229, 229, 229; /* primary text */ - --color-text-200: 163, 163, 163; /* secondary text */ - --color-text-300: 115, 115, 115; /* tertiary text */ - --color-text-350: 130, 130, 130; - --color-text-400: 82, 82, 82; /* placeholder text */ - - --color-scrollbar: 82, 82, 82; /* scrollbar thumb */ - - --color-border-100: 34, 34, 34; /* subtle border= 1 */ - --color-border-200: 38, 38, 38; /* subtle border- 2 */ - --color-border-300: 46, 46, 46; /* strong border- 1 */ - --color-border-400: 58, 58, 58; /* strong border- 2 */ - - /* onboarding colors */ - --gradient-onboarding-100: linear-gradient(106deg, #18191b 25.17%, #18191b 99.34%); - --gradient-onboarding-200: linear-gradient(129deg, rgba(47, 49, 53, 0.8) -22.23%, rgba(33, 34, 37, 0.8) 62.98%); - --gradient-onboarding-300: linear-gradient(167deg, rgba(47, 49, 53, 0.45) 19.22%, #212225 98.48%); - - --color-onboarding-text-100: 237, 238, 240; - --color-onboarding-text-200: 176, 180, 187; - --color-onboarding-text-300: 118, 123, 132; - --color-onboarding-text-400: 105, 110, 119; - - --color-onboarding-background-100: 54, 58, 64; - --color-onboarding-background-200: 40, 42, 45; - --color-onboarding-background-300: 40, 42, 45; - --color-onboarding-background-400: 67, 72, 79; - - --color-onboarding-border-100: 54, 58, 64; - --color-onboarding-border-200: 54, 58, 64; - --color-onboarding-border-300: 34, 35, 38, 0.5; - - --color-onboarding-shadow-sm: 0px 4px 20px 0px rgba(39, 44, 56, 0.1); - } - - [data-theme="dark-contrast"] { - --color-text-100: 250, 250, 250; /* primary text */ - --color-text-200: 241, 241, 241; /* secondary text */ - --color-text-300: 212, 212, 212; /* tertiary text */ - --color-text-350: 190, 190, 190 --color-text-400: 115, 115, 115; /* placeholder text */ - - --color-scrollbar: 115, 115, 115; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - } - - [data-theme="light"], - [data-theme="dark"], - [data-theme="light-contrast"], - [data-theme="dark-contrast"] { - --color-sidebar-background-100: var(--color-background-100); /* primary sidebar bg */ - --color-sidebar-background-90: var(--color-background-90); /* secondary sidebar bg */ - --color-sidebar-background-80: var(--color-background-80); /* tertiary sidebar bg */ - - --color-sidebar-text-100: var(--color-text-100); /* primary sidebar text */ - --color-sidebar-text-200: var(--color-text-200); /* secondary sidebar text */ - --color-sidebar-text-300: var(--color-text-300); /* tertiary sidebar text */ - --color-sidebar-text-400: var(--color-text-400); /* sidebar placeholder text */ - - --color-sidebar-border-100: var(--color-border-100); /* subtle sidebar border= 1 */ - --color-sidebar-border-200: var(--color-border-200); /* subtle sidebar border- 2 */ - --color-sidebar-border-300: var(--color-border-300); /* strong sidebar border- 1 */ - --color-sidebar-border-400: var(--color-border-400); /* strong sidebar border- 2 */ - } - - /* stickies and editor colors */ - :root { - /* text colors */ - --editor-colors-gray-text: #5c5e63; - --editor-colors-peach-text: #ff5b59; - --editor-colors-pink-text: #f65385; - --editor-colors-orange-text: #fd9038; - --editor-colors-green-text: #0fc27b; - --editor-colors-light-blue-text: #17bee9; - --editor-colors-dark-blue-text: #266df0; - --editor-colors-purple-text: #9162f9; - /* end text colors */ - - /* background colors */ - --editor-colors-gray-background: #d6d6d8; - --editor-colors-peach-background: #ffd5d7; - --editor-colors-pink-background: #fdd4e3; - --editor-colors-orange-background: #ffe3cd; - --editor-colors-green-background: #c3f0de; - --editor-colors-light-blue-background: #c5eff9; - --editor-colors-dark-blue-background: #c9dafb; - --editor-colors-purple-background: #e3d8fd; - /* end background colors */ - } /* background colors */ - [data-theme*="light"] { - --editor-colors-gray-background: #d6d6d8; - --editor-colors-peach-background: #ffd5d7; - --editor-colors-pink-background: #fdd4e3; - --editor-colors-orange-background: #ffe3cd; - --editor-colors-green-background: #c3f0de; - --editor-colors-light-blue-background: #c5eff9; - --editor-colors-dark-blue-background: #c9dafb; - --editor-colors-purple-background: #e3d8fd; - } - [data-theme*="dark"] { - --editor-colors-gray-background: #404144; - --editor-colors-peach-background: #593032; - --editor-colors-pink-background: #562e3d; - --editor-colors-orange-background: #583e2a; - --editor-colors-green-background: #1d4a3b; - --editor-colors-light-blue-background: #1f495c; - --editor-colors-dark-blue-background: #223558; - --editor-colors-purple-background: #3d325a; - } + --editor-colors-gray-background: #d6d6d8; + --editor-colors-peach-background: #ffd5d7; + --editor-colors-pink-background: #fdd4e3; + --editor-colors-orange-background: #ffe3cd; + --editor-colors-green-background: #c3f0de; + --editor-colors-light-blue-background: #c5eff9; + --editor-colors-dark-blue-background: #c9dafb; + --editor-colors-purple-background: #e3d8fd; /* end background colors */ } +/* background colors */ +[data-theme*="light"] { + --editor-colors-gray-background: #d6d6d8; + --editor-colors-peach-background: #ffd5d7; + --editor-colors-pink-background: #fdd4e3; + --editor-colors-orange-background: #ffe3cd; + --editor-colors-green-background: #c3f0de; + --editor-colors-light-blue-background: #c5eff9; + --editor-colors-dark-blue-background: #c9dafb; + --editor-colors-purple-background: #e3d8fd; +} +[data-theme*="dark"] { + --editor-colors-gray-background: #404144; + --editor-colors-peach-background: #593032; + --editor-colors-pink-background: #562e3d; + --editor-colors-orange-background: #583e2a; + --editor-colors-green-background: #1d4a3b; + --editor-colors-light-blue-background: #1f495c; + --editor-colors-dark-blue-background: #223558; + --editor-colors-purple-background: #3d325a; +} +/* end background colors */ * { margin: 0; diff --git a/apps/web/tailwind.config.cjs b/apps/web/tailwind.config.cjs deleted file mode 100644 index d1f2e7f4c7..0000000000 --- a/apps/web/tailwind.config.cjs +++ /dev/null @@ -1,8 +0,0 @@ -/* eslint-disable @typescript-eslint/no-var-requires */ -// eslint-disable-next-line @typescript-eslint/no-require-imports -const sharedConfig = require("@plane/tailwind-config/tailwind.config.js"); - -module.exports = { - presets: [sharedConfig], -}; - diff --git a/packages/tailwind-config/animations.css b/packages/tailwind-config/animations.css new file mode 100644 index 0000000000..c5468e7da1 --- /dev/null +++ b/packages/tailwind-config/animations.css @@ -0,0 +1,14 @@ +@theme { + --animate-slide-up: slide-up 0.3s ease-out forwards; + + @keyframes slide-up { + from { + transform: translateY(10px); + opacity: 0; + } + to { + transform: translateY(0); + opacity: 1; + } + } +} diff --git a/packages/tailwind-config/colors.css b/packages/tailwind-config/colors.css new file mode 100644 index 0000000000..7e05f43392 --- /dev/null +++ b/packages/tailwind-config/colors.css @@ -0,0 +1,479 @@ +@theme { + --color-*: initial; + + /* White with opacity */ + --color-alpha-white-0: oklch(1 0 0 / 0%); + --color-alpha-white-100: oklch(1 0 0 / 5%); + --color-alpha-white-200: oklch(1 0 0 / 10%); + --color-alpha-white-300: oklch(1 0 0 / 15%); + --color-alpha-white-400: oklch(1 0 0 / 20%); + --color-alpha-white-500: oklch(1 0 0 / 30%); + --color-alpha-white-600: oklch(1 0 0 / 40%); + --color-alpha-white-700: oklch(1 0 0 / 50%); + --color-alpha-white-800: oklch(1 0 0 / 60%); + --color-alpha-white-900: oklch(1 0 0 / 70%); + --color-alpha-white-1000: oklch(1 0 0 / 80%); + --color-alpha-white-1100: oklch(1 0 0 / 90%); + --color-alpha-white-1200: oklch(1 0 0 / 95%); + + /* Black with opacity */ + --color-alpha-black-0: oklch(0.1482 0.0034 196.79 / 0%); + --color-alpha-black-100: oklch(0.1482 0.0034 196.79 / 5%); + --color-alpha-black-200: oklch(0.1482 0.0034 196.79 / 10%); + --color-alpha-black-300: oklch(0.1482 0.0034 196.79 / 15%); + --color-alpha-black-400: oklch(0.1482 0.0034 196.79 / 20%); + --color-alpha-black-500: oklch(0.1482 0.0034 196.79 / 30%); + --color-alpha-black-600: oklch(0.1482 0.0034 196.79 / 40%); + --color-alpha-black-700: oklch(0.1482 0.0034 196.79 / 50%); + --color-alpha-black-800: oklch(0.1482 0.0034 196.79 / 60%); + --color-alpha-black-900: oklch(0.1482 0.0034 196.79 / 70%); + --color-alpha-black-1000: oklch(0.1482 0.0034 196.79 / 80%); + --color-alpha-black-1100: oklch(0.1482 0.0034 196.79 / 90%); + --color-alpha-black-1200: oklch(0.1482 0.0034 196.79 / 95%); +} + +/* ---------- Light mode color tokens ---------- */ +@theme { + /* Neutral colors */ + --color-neutral-white: oklch(1 0 0); + --color-neutral-100: oklch(0.9851 0 129.63); + --color-neutral-200: oklch(0.9694 0.0011 197.14); + --color-neutral-300: oklch(0.9544 0.0011 197.14); + --color-neutral-400: oklch(0.9393 0.0011 197.14); + --color-neutral-500: oklch(0.9237 0.0026 228.79); + --color-neutral-600: oklch(0.8932 0.0026 228.79); + --color-neutral-700: oklch(0.8617 0.0036 219.54); + --color-neutral-800: oklch(0.6994 0.0072 233.69); + --color-neutral-900: oklch(0.616 0.0084 228.93); + --color-neutral-1000: oklch(0.5279 0.0078 233.75); + --color-neutral-1100: oklch(0.4384 0.0072 223.57); + --color-neutral-1200: oklch(0.2376 0.0036 228.95); + --color-neutral-black: oklch(0.1472 0.0034 196.79); + + /* Brand colors */ + --color-brand-100: oklch(0.9847 0.0083 236.56); + --color-brand-200: oklch(0.9715 0.0167 230.9); + --color-brand-300: oklch(0.9428 0.0341 230.22); + --color-brand-400: oklch(0.9008 0.0587 232); + --color-brand-500: oklch(0.8414 0.0947 233.08); + --color-brand-600: oklch(0.7649 0.1392 236.3); + --color-brand-700: oklch(0.6766 0.1665 243.91); + --color-brand-900: oklch(0.4347 0.104093 242.4823); + --color-brand-1000: oklch(0.3399 0.0783 240.32); + --color-brand-1100: oklch(0.2626 0.0578 237.5); + --color-brand-1200: oklch(0.2093 0.0438 234.02); + --color-brand-default: oklch(0.4799 0.1158 242.91); + + /* Green/Success colors */ + --color-green-100: oklch(0.9819 0.0181 155.83); + --color-green-200: oklch(0.9624 0.0434 156.74); + --color-green-300: oklch(0.9258 0.0845 155.86); + --color-green-400: oklch(0.8704 0.149 154.62); + --color-green-500: oklch(0.7914 0.2091 151.66); + --color-green-600: oklch(0.7289 0.2119 147.82); + --color-green-700: oklch(0.632 0.185972 147.3695); + --color-green-800: oklch(0.5296 0.149485 148.9899); + --color-green-900: oklch(0.4468 0.1187 151.4); + --color-green-1000: oklch(0.3935 0.0957 152.28); + --color-green-1100: oklch(0.2654 0.0651 152.77); + + /* Amber/Warning colors */ + --color-amber-100: oklch(0.9869 0.0214 95.28); + --color-amber-200: oklch(0.9617 0.0592 95.89); + --color-amber-300: oklch(0.9244 0.1203 95.85); + --color-amber-400: oklch(0.8781 0.1688 91.86); + --color-amber-500: oklch(0.829 0.1712 81.04); + --color-amber-600: oklch(0.7724 0.172798 65.367); + --color-amber-700: oklch(0.6671 0.1685 53.38); + --color-amber-800: oklch(0.557 0.158291 45.3594); + --color-amber-900: oklch(0.4747 0.135757 44.9806); + --color-amber-1000: oklch(0.4149 0.1126 45.88); + --color-amber-1100: oklch(0.279 0.0773 45.6); + + /* Red/Danger colors */ + --color-red-100: oklch(0.9705 0.0129 17.38); + --color-red-200: oklch(0.9365 0.032 17.74); + --color-red-300: oklch(0.8834 0.0616 18.39); + --color-red-400: oklch(0.8053 0.1109 19.78); + --color-red-500: oklch(0.7022 0.1892 22.23); + --color-red-600: oklch(0.6378 0.2373 25.44); + --color-red-700: oklch(0.583 0.238666 28.4765); + --color-red-800: oklch(0.5095 0.208583 28.513); + --color-red-900: oklch(0.4446 0.1774 26.79); + --color-red-1000: oklch(0.3967 0.1408 25.71); + --color-red-1100: oklch(0.3493 0.1215 25.21); +} + +/* -------------------- Light mode custom(derived) colors -------------------- */ +@theme inline { + /* Background colors */ + --background-color-canvas: var(--color-neutral-300); + --background-color-surface-1: var(--color-neutral-white); + --background-color-surface-2: var(--color-neutral-100); + --background-color-layer-1: var(--color-neutral-200); + --background-color-layer-1-hover: var(--color-alpha-black-100); + --background-color-layer-1-active: var(--color-alpha-black-200); + --background-color-layer-1-selected: var(--color-alpha-black-300); + --background-color-layer-2: var(--color-neutral-white); + --background-color-layer-2-hover: var(--color-alpha-black-100); + --background-color-layer-2-active: var(--color-alpha-black-200); + --background-color-layer-2-selected: var(--color-alpha-black-300); + --background-color-layer-3: var(--color-neutral-200); + --background-color-layer-3-hover: var(--color-alpha-black-100); + --background-color-layer-3-active: var(--color-alpha-black-200); + --background-color-layer-3-selected: var(--color-alpha-black-300); + --background-color-layer-transparent: var(--color-alpha-white-0); + --background-color-layer-transparent-hover: var(--color-alpha-black-100); + --background-color-layer-transparent-active: var(--color-alpha-black-200); + --background-color-layer-transparent-selected: var(--color-alpha-black-300); + --background-color-layer-disabled: var(--color-neutral-400); + --background-color-accent-primary: var(--color-brand-default); + --background-color-accent-primary-hover: var(--color-brand-900); + --background-color-accent-primary-active: var(--color-brand-1000); + --background-color-accent-subtle: var(--color-brand-100); + --background-color-accent-subtle-hover: var(--color-brand-200); + --background-color-accent-subtle-active: var(--color-brand-300); + --background-color-success-primary: var(--color-green-700); + --background-color-success-subtle: var(--color-green-100); + --background-color-success-subtle-1: var(--color-green-200); + --background-color-warning-primary: var(--color-amber-600); + --background-color-warning-subtle: var(--color-amber-100); + --background-color-danger-primary: var(--color-red-700); + --background-color-danger-primary-hover: var(--color-red-800); + --background-color-danger-primary-active: var(--color-red-900); + --background-color-danger-primary-selected: var(--color-red-900); + --background-color-danger-subtle: var(--color-red-100); + --background-color-danger-subtle-hover: var(--color-red-200); + --background-color-danger-subtle-active: var(--color-red-300); + --background-color-danger-subtle-selected: var(--color-red-300); + --background-color-danger-transparent: var(--color-red-100); + --background-color-danger-transparent-hover: var(--color-red-100); + --background-color-danger-transparent-active: var(--color-red-100); + --background-color-danger-transparent-selected: var(--color-red-100); + + /* Border colors */ + --border-color-subtle: var(--color-neutral-400); + --border-color-subtle-1: var(--color-neutral-500); + --border-color-strong: var(--color-neutral-600); + --border-color-strong-1: var(--color-neutral-700); + --border-color-inverse: var(--color-neutral-white); + --border-color-disabled: var(--color-neutral-300); + --border-color-accent-strong: var(--color-brand-default); + --border-color-accent-subtle: var(--color-brand-300); + --border-color-success-strong: var(--color-green-700); + --border-color-success-subtle: var(--color-green-300); + --border-color-warning-strong: var(--color-amber-700); + --border-color-warning-subtle: var(--color-amber-400); + --border-color-danger-strong: var(--color-red-700); + --border-color-danger-subtle: var(--color-red-400); + + /* Text colors */ + --text-color-primary: var(--color-neutral-1200); + --text-color-secondary: var(--color-neutral-1100); + --text-color-tertiary: var(--color-neutral-1000); + --text-color-placeholder: var(--color-neutral-900); + --text-color-disabled: var(--color-neutral-800); + --text-color-accent-primary: var(--color-brand-default); + --text-color-on-color: var(--color-neutral-100); + --text-color-accent-secondary: var(--color-brand-700); + --text-color-on-color-disabled: hsla(201, 7%, 18%, 0.25); + --text-color-inverse: var(--color-neutral-white); + --text-color-success: var(--color-green-700); + --text-color-success-primary: var(--color-green-900); + --text-color-success-secondary: var(--color-green-700); + --text-color-warning: var(--color-amber-700); + --text-color-warning-primary: var(--color-amber-900); + --text-color-warning-secondary: var(--color-amber-700); + --text-color-danger: var(--color-red-700); + --text-color-danger-primary: var(--color-red-900); + --text-color-danger-secondary: var(--color-red-700); + + /* Icon colors */ + --text-color-icon-primary: var(--color-neutral-1200); + --text-color-icon-accent-subtle: var(--color-brand-500); + --text-color-icon-accent-primary: var(--color-brand-default); + --text-color-icon-danger-primary: var(--color-red-900); + --text-color-icon-danger-secondary: var(--color-red-700); + --text-color-icon-success-primary: var(--color-green-900); + --text-color-icon-success-secondary: var(--color-green-700); + --text-color-icon-warning-primary: var(--color-amber-900); + --text-color-icon-warning-secondary: var(--color-amber-700); + --text-color-icon-accent-primary-inverse: var(--color-brand-900); + --text-color-icon-accent-secondary: var(--color-brand-1200); + --text-color-icon-secondary: var(--color-neutral-1100); + --text-color-icon-tertiary: var(--color-neutral-900); + --text-color-icon-placeholder: var(--color-neutral-800); + --text-color-icon-disabled: var(--color-neutral-700); + --text-color-icon-danger: var(--color-red-700); + --text-color-icon-on-color: var(--color-neutral-white); + --text-color-icon-on-color-disabled: hsla(201, 7%, 18%, 0.25); + --text-color-icon-inverse: var(--color-neutral-white); + + /* Link colors */ + --text-color-link-primary: var(--color-brand-default); + --text-color-link-primary-hover: var(--color-brand-900); + --text-color-link-secondary: var(--color-neutral-900); + + /* Label colors */ + --label-indigo-bg: var(--extended-palette-indigo-100); + --label-indigo-bg-strong: var(--extended-palette-indigo-700); + --label-indigo-hover: var(--extended-palette-indigo-300); + --label-indigo-icon: var(--extended-palette-indigo-700); + --label-indigo-text: var(--extended-palette-indigo-700); + --label-indigo-border: hsla(0, 0%, 100%, 0); + --label-indigo-focus: var(--extended-palette-indigo-500); + --label-emerald-bg: var(--extended-palette-emerald-50); + --label-emerald-bg-strong: var(--extended-palette-emerald-600); + --label-emerald-hover: var(--extended-palette-emerald-200); + --label-emerald-icon: var(--extended-palette-emerald-600); + --label-emerald-text: var(--extended-palette-emerald-800); + --label-emerald-border: hsla(0, 0%, 100%, 0); + --label-emerald-focus: var(--extended-palette-emerald-700); + --label-grey-bg: var(--extended-palette-grey-50); + --label-grey-bg-strong: var(--extended-palette-grey-700); + --label-grey-hover: var(--extended-palette-grey-100); + --label-grey-icon: var(--extended-palette-grey-700); + --label-grey-text: var(--extended-palette-grey-700); + --label-grey-border: hsla(0, 0%, 100%, 0); + --label-grey-focus: var(--extended-palette-grey-500); + --label-crimson-bg: var(--extended-palette-crimson-50); + --label-crimson-bg-strong: var(--extended-palette-crimson-700); + --label-crimson-hover: var(--extended-palette-crimson-100); + --label-crimson-icon: var(--extended-palette-crimson-700); + --label-crimson-text: var(--extended-palette-crimson-700); + --label-crimson-border: hsla(0, 0%, 100%, 0); + --label-crimson-focus: var(--extended-palette-crimson-500); + + /* Illustration colors */ + --illustration-fill-white: var(--color-neutral-white); + --illustration-fill-1: var(--color-neutral-200); + --illustration-fill-2: var(--color-neutral-400); + --illustration-fill-3: var(--color-neutral-700); + --illustration-stroke-1: var(--color-neutral-700); + --illustration-stroke-2: var(--color-neutral-800); + --illustration-stroke-3: var(--color-neutral-1200); +} + +html[data-theme*="dark"] { + /* ---------- Dark mode color tokens ---------- */ + @theme { + /* Neutral colors */ + --color-neutral-black: oklch(0.1689 0.0021 286.18); + --color-neutral-100: oklch(0.2039 0.0025 247.95); + --color-neutral-200: oklch(0.216 0.0037 228.98); + --color-neutral-300: oklch(0.2376 0.0036 228.95); + --color-neutral-400: oklch(0.2586 0.0035 228.93); + --color-neutral-500: oklch(0.302 0.0067 229.06); + --color-neutral-600: oklch(0.3421 0.0045 219.61); + --color-neutral-700: oklch(0.3996 0.0052 236.62); + --color-neutral-800: oklch(0.6994 0.0072 233.69); + --color-neutral-900: oklch(0.7485 0.0063 239.85); + --color-neutral-1000: oklch(0.7966 0.0044 236.51); + --color-neutral-1100: oklch(0.8463 0.0036 219.54); + --color-neutral-1200: oklch(0.9237 0.0026 228.79); + --color-neutral-white: oklch(0.9702 0 0); + + /* Brand colors */ + --color-brand-100: oklch(0.2029 0.03 232.24); + --color-brand-200: oklch(0.2513 0.0418 234.6); + --color-brand-300: oklch(0.3208 0.05806 236.44); + --color-brand-400: oklch(0.4088 0.077702 237.13); + --color-brand-500: oklch(0.4511 0.087024 237.37); + --color-brand-700: oklch(0.7408 0.100309 233.89); + --color-brand-800: oklch(0.8318 0.065614 232.07); + --color-brand-900: oklch(0.8969 0.040089 231.35); + --color-brand-1000: oklch(0.9409 0.022883 231.01); + --color-brand-1100: oklch(0.9704 0.011421 230.82); + --color-brand-1200: oklch(0.9856 0.005 228.82); + --color-brand-default: oklch(0.6311 0.126281 238.01); + + /* Green colors */ + --color-green-100: oklch(0.2721 0.067322 152.52); + --color-green-200: oklch(0.3935 0.0957 152.28); + --color-green-300: oklch(0.4468 0.1187 151.4); + --color-green-400: oklch(0.5296 0.149485 148.9899); + --color-green-500: oklch(0.632 0.185972 147.3695); + --color-green-600: oklch(0.7289 0.2119 147.82); + --color-green-700: oklch(0.7914 0.2091 151.66); + --color-green-800: oklch(0.8704 0.149 154.62); + --color-green-900: oklch(0.9258 0.0845 155.86); + --color-green-1000: oklch(0.9624 0.0434 156.74); + --color-green-1100: oklch(0.9819 0.0181 155.83); + + /* Amber colors */ + --color-amber-100: oklch(0.3042 0.0853 45.16); + --color-amber-200: oklch(0.4149 0.1126 45.88); + --color-amber-300: oklch(0.4747 0.135757 44.9806); + --color-amber-400: oklch(0.557 0.158291 45.3594); + --color-amber-500: oklch(0.6671 0.1685 53.38); + --color-amber-600: oklch(0.7724 0.172798 65.367); + --color-amber-700: oklch(0.829 0.1712 81.04); + --color-amber-800: oklch(0.8781 0.1688 91.86); + --color-amber-900: oklch(0.9244 0.1203 95.85); + --color-amber-1000: oklch(0.9617 0.0592 95.89); + --color-amber-1100: oklch(0.9869 0.0214 95.28); + + /* Red colors */ + --color-red-100: oklch(0.2615 0.085 24.41); + --color-red-200: oklch(0.3967 0.1408 25.71); + --color-red-300: oklch(0.4446 0.1774 26.79); + --color-red-400: oklch(0.5095 0.208583 28.513); + --color-red-500: oklch(0.583 0.238666 28.4765); + --color-red-600: oklch(0.6378 0.2373 25.44); + --color-red-700: oklch(0.7022 0.1892 22.23); + --color-red-800: oklch(0.8053 0.1109 19.78); + --color-red-900: oklch(0.8834 0.0616 18.39); + --color-red-1000: oklch(0.9365 0.032 17.74); + --color-red-1100: oklch(0.9705 0.0129 17.38); + } + + /* -------------------- Dark mode custom(derived) colors -------------------- */ + @theme inline { + /* Background colors */ + --background-color-canvas: var(--color-neutral-black); + --background-color-surface-1: var(--color-neutral-100); + --background-color-surface-2: var(--color-neutral-100); + --background-color-layer-1: var(--color-neutral-200); + --background-color-layer-1-hover: var(--color-alpha-white-100); + --background-color-layer-1-active: var(--color-alpha-white-200); + --background-color-layer-1-selected: var(--color-alpha-white-300); + --background-color-layer-2: var(--color-neutral-300); + --background-color-layer-2-hover: var(--color-alpha-white-100); + --background-color-layer-2-active: var(--color-alpha-white-200); + --background-color-layer-2-selected: var(--color-alpha-white-300); + --background-color-layer-3: var(--color-neutral-400); + --background-color-layer-3-hover: var(--color-alpha-white-100); + --background-color-layer-3-active: var(--color-alpha-white-200); + --background-color-layer-3-selected: var(--color-alpha-white-300); + --background-color-layer-transparent: var(--alpha-black-0); + --background-color-layer-transparent-hover: var(--color-alpha-white-100); + --background-color-layer-transparent-active: var(--color-alpha-white-200); + --background-color-layer-transparent-selected: var(--color-alpha-white-300); + --background-color-layer-disabled: var(--color-neutral-700); + --background-color-accent-primary: var(--color-brand-default); + --background-color-accent-primary-hover: var(--color-brand-500); + --background-color-accent-primary-active: var(--color-brand-400); + --background-color-accent-subtle: var(--color-brand-100); + --background-color-accent-subtle-hover: var(--color-brand-200); + --background-color-accent-subtle-active: var(--color-brand-300); + --background-color-success-primary: var(--color-green-700); + --background-color-success-subtle: var(--color-green-100); + --background-color-success-subtle-1: var(--color-green-100); + --background-color-warning-primary: hsla(201, 100%, 48%, 1); + --background-color-warning-subtle: var(--color-amber-100); + --background-color-danger-primary: var(--color-red-300); + --background-color-danger-primary-hover: var(--color-red-400); + --background-color-danger-primary-active: var(--color-red-500); + --background-color-danger-primary-selected: var(--color-red-500); + --background-color-danger-subtle: var(--color-red-100); + --background-color-danger-subtle-hover: var(--color-red-200); + --background-color-danger-subtle-active: var(--color-red-300); + --background-color-danger-subtle-selected: var(--color-red-300); + --background-color-danger-transparent: var(--color-red-100); + --background-color-danger-transparent-hover: var(--color-red-100); + --background-color-danger-transparent-active: var(--color-red-100); + --background-color-danger-transparent-selected: var(--color-red-100); + + /* Border colors */ + --border-color-subtle: var(--color-neutral-400); + --border-color-subtle-1: var(--color-neutral-500); + --border-color-strong: var(--color-neutral-600); + --border-color-strong-1: var(--color-neutral-700); + --border-color-inverse: var(--color-neutral-100); + --border-color-disabled: var(--color-neutral-300); + --border-color-accent-strong: var(--color-brand-default); + --border-color-accent-subtle: var(--color-brand-300); + --border-color-success-strong: var(--color-green-400); + --border-color-success-subtle: var(--color-green-200); + --border-color-warning-strong: var(--color-amber-400); + --border-color-warning-subtle: var(--color-amber-200); + --border-color-danger-strong: var(--color-red-400); + --border-color-danger-subtle: var(--color-red-200); + + /* Text colors */ + --text-color-primary: var(--color-neutral-1200); + --text-color-secondary: var(--color-neutral-1100); + --text-color-tertiary: var(--color-neutral-1000); + --text-color-placeholder: var(--color-neutral-900); + --text-color-disabled: var(--color-neutral-800); + --text-color-accent-primary: var(--color-brand-default); + --text-color-on-color: var(--color-neutral-1200); + --text-color-accent-secondary: var(--color-brand-700); + --text-color-on-color-disabled: hsla(201, 7%, 92%, 0.25); + --text-color-inverse: var(--color-neutral-black); + --text-color-success: var(--color-green-700); + --text-color-success-primary: var(--color-green-900); + --text-color-success-secondary: var(--color-green-700); + --text-color-warning: var(--color-amber-700); + --text-color-warning-primary: var(--color-amber-900); + --text-color-warning-secondary: var(--color-amber-700); + --text-color-danger: var(--color-red-700); + --text-color-danger-primary: var(--color-red-900); + --text-color-danger-secondary: var(--color-red-700); + + /* Icon colors */ + --text-color-icon-primary: var(--color-neutral-1200); + --text-color-icon-accent-subtle: var(--brand-light-500); + --text-color-icon-accent-primary: var(--color-brand-default); + --text-color-icon-danger-primary: var(--color-red-900); + --text-color-icon-danger-secondary: var(--color-red-700); + --text-color-icon-success-primary: var(--color-green-900); + --text-color-icon-success-secondary: var(--color-green-700); + --text-color-icon-warning-primary: var(--color-amber-900); + --text-color-icon-warning-secondary: var(--color-amber-700); + --text-color-icon-accent-primary-inverse: var(--color-brand-900); + --text-color-icon-accent-secondary: var(--color-brand-1200); + --text-color-icon-secondary: var(--color-neutral-1100); + --text-color-icon-tertiary: var(--color-neutral-1000); + --text-color-icon-placeholder: var(--color-neutral-800); + --text-color-icon-disabled: var(--color-neutral-700); + --text-color-icon-danger: var(--color-red-700); + --text-color-icon-on-color: var(--color-neutral-white); + --text-color-icon-on-color-disabled: hsla(201, 7%, 92%, 0.25); + --text-color-icon-inverse: var(--color-neutral-black); + + /* Link colors */ + --text-color-link-primary: var(--color-brand-default); + --text-color-link-primary-hover: var(--brand-light-600); + --text-color-link-secondary: var(--color-neutral-1100); + + /* Label colors */ + --label-indigo-bg: var(--extended-palette-indigo-800); + --label-indigo-bg-strong: var(--extended-palette-indigo-500); + --label-indigo-hover: var(--extended-palette-indigo-700); + --label-indigo-icon: var(--extended-palette-indigo-500); + --label-indigo-text: var(--extended-palette-indigo-500); + --label-indigo-border: hsla(0, 0%, 100%, 0); + --label-indigo-focus: var(--extended-palette-indigo-400); + --label-emerald-bg: var(--extended-palette-emerald-700); + --label-emerald-bg-strong: var(--extended-palette-emerald-600); + --label-emerald-hover: var(--extended-palette-emerald-800); + --label-emerald-icon: var(--extended-palette-emerald-600); + --label-emerald-text: var(--extended-palette-emerald-400); + --label-emerald-border: hsla(0, 0%, 100%, 0); + --label-emerald-focus: var(--extended-palette-emerald-700); + --label-grey-bg: var(--extended-palette-grey-800); + --label-grey-bg-strong: var(--extended-palette-grey-500); + --label-grey-hover: var(--extended-palette-grey-700); + --label-grey-icon: var(--extended-palette-grey-500); + --label-grey-text: var(--extended-palette-grey-500); + --label-grey-border: hsla(0, 0%, 100%, 0); + --label-grey-focus: var(--extended-palette-grey-400); + --label-crimson-bg: var(--extended-palette-crimson-800); + --label-crimson-bg-strong: var(--extended-palette-crimson-500); + --label-crimson-hover: var(--extended-palette-crimson-700); + --label-crimson-icon: var(--extended-palette-crimson-500); + --label-crimson-text: var(--extended-palette-crimson-500); + --label-crimson-border: hsla(0, 0%, 100%, 0); + --label-crimson-focus: var(--extended-palette-crimson-400); + + /* Illustration colors */ + --illustration-fill-white: var(--color-neutral-400); + --illustration-fill-1: var(--color-neutral-500); + --illustration-fill-2: var(--color-neutral-700); + --illustration-fill-3: var(--color-neutral-700); + --illustration-stroke-1: var(--color-neutral-700); + --illustration-stroke-2: var(--color-neutral-800); + --illustration-stroke-3: var(--color-neutral-1000); + } +} diff --git a/packages/tailwind-config/global.css b/packages/tailwind-config/global.css deleted file mode 100644 index 95a3b70c7a..0000000000 --- a/packages/tailwind-config/global.css +++ /dev/null @@ -1,833 +0,0 @@ -@tailwind base; -@tailwind components; -@tailwind utilities; - -@layer components { - .text-1\.5xl { - font-size: 1.375rem; - line-height: 1.875rem; - } - - .text-2\.5xl { - font-size: 1.75rem; - line-height: 2.25rem; - } -} - -@layer base { - html { - font-family: "Inter", sans-serif; - } - - :root { - color-scheme: light !important; - - --color-primary-10: 229, 243, 250; - --color-primary-20: 216, 237, 248; - --color-primary-30: 199, 229, 244; - --color-primary-40: 169, 214, 239; - --color-primary-50: 144, 202, 234; - --color-primary-60: 109, 186, 227; - --color-primary-70: 75, 170, 221; - --color-primary-80: 41, 154, 214; - --color-primary-90: 34, 129, 180; - --color-primary-100: 0, 99, 153; - --color-primary-200: 0, 92, 143; - --color-primary-300: 0, 86, 133; - --color-primary-400: 0, 77, 117; - --color-primary-500: 0, 66, 102; - --color-primary-600: 0, 53, 82; - --color-primary-700: 0, 43, 66; - --color-primary-800: 0, 33, 51; - --color-primary-900: 0, 23, 36; - - --color-background-100: 255, 255, 255; /* primary bg */ - --color-background-90: 247, 247, 247; /* secondary bg */ - --color-background-80: 232, 232, 232; /* tertiary bg */ - - --color-text-100: 23, 23, 23; /* primary text */ - --color-text-200: 58, 58, 58; /* secondary text */ - --color-text-300: 82, 82, 82; /* tertiary text */ - --color-text-400: 163, 163, 163; /* placeholder text */ - - --color-scrollbar: 163, 163, 163; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - - --color-shadow-2xs: - 0px 0px 1px 0px rgba(23, 23, 23, 0.06), - 0px 1px 2px 0px rgba(23, 23, 23, 0.06), - 0px 1px 2px 0px rgba(23, 23, 23, 0.14); - --color-shadow-xs: - 0px 1px 2px 0px rgba(0, 0, 0, 0.16), - 0px 2px 4px 0px rgba(16, 24, 40, 0.12), - 0px 1px 8px -1px rgba(16, 24, 40, 0.1); - --color-shadow-sm: - 0px 1px 4px 0px rgba(0, 0, 0, 0.01), 0px 4px 8px 0px rgba(0, 0, 0, 0.02), - 0px 1px 12px 0px rgba(0, 0, 0, 0.12); - --color-shadow-rg: - 0px 3px 6px 0px rgba(0, 0, 0, 0.1), - 0px 4px 4px 0px rgba(16, 24, 40, 0.08), - 0px 1px 12px 0px rgba(16, 24, 40, 0.04); - --color-shadow-md: - 0px 4px 8px 0px rgba(0, 0, 0, 0.12), - 0px 6px 12px 0px rgba(16, 24, 40, 0.12), - 0px 1px 16px 0px rgba(16, 24, 40, 0.12); - --color-shadow-lg: - 0px 6px 12px 0px rgba(0, 0, 0, 0.12), - 0px 8px 16px 0px rgba(0, 0, 0, 0.12), - 0px 1px 24px 0px rgba(16, 24, 40, 0.12); - --color-shadow-xl: - 0px 0px 18px 0px rgba(0, 0, 0, 0.16), - 0px 0px 24px 0px rgba(16, 24, 40, 0.16), - 0px 0px 52px 0px rgba(16, 24, 40, 0.16); - --color-shadow-2xl: - 0px 8px 16px 0px rgba(0, 0, 0, 0.12), - 0px 12px 24px 0px rgba(16, 24, 40, 0.12), - 0px 1px 32px 0px rgba(16, 24, 40, 0.12); - --color-shadow-3xl: - 0px 12px 24px 0px rgba(0, 0, 0, 0.12), - 0px 16px 32px 0px rgba(0, 0, 0, 0.12), - 0px 1px 48px 0px rgba(16, 24, 40, 0.12); - --color-shadow-4xl: - 0px 8px 40px 0px rgba(0, 0, 61, 0.05), - 0px 12px 32px -16px rgba(0, 0, 0, 0.05); - - --color-sidebar-background-100: var( - --color-background-100 - ); /* primary sidebar bg */ - --color-sidebar-background-90: var( - --color-background-90 - ); /* secondary sidebar bg */ - --color-sidebar-background-80: var( - --color-background-80 - ); /* tertiary sidebar bg */ - - --color-sidebar-text-100: var(--color-text-100); /* primary sidebar text */ - --color-sidebar-text-200: var( - --color-text-200 - ); /* secondary sidebar text */ - --color-sidebar-text-300: var(--color-text-300); /* tertiary sidebar text */ - --color-sidebar-text-400: var( - --color-text-400 - ); /* sidebar placeholder text */ - - --color-sidebar-border-100: var( - --color-border-100 - ); /* subtle sidebar border= 1 */ - --color-sidebar-border-200: var( - --color-border-100 - ); /* subtle sidebar border- 2 */ - --color-sidebar-border-300: var( - --color-border-100 - ); /* strong sidebar border- 1 */ - --color-sidebar-border-400: var( - --color-border-100 - ); /* strong sidebar border- 2 */ - - --color-sidebar-shadow-2xs: var(--color-shadow-2xs); - --color-sidebar-shadow-xs: var(--color-shadow-xs); - --color-sidebar-shadow-sm: var(--color-shadow-sm); - --color-sidebar-shadow-rg: var(--color-shadow-rg); - --color-sidebar-shadow-md: var(--color-shadow-md); - --color-sidebar-shadow-lg: var(--color-shadow-lg); - --color-sidebar-shadow-xl: var(--color-shadow-xl); - --color-sidebar-shadow-2xl: var(--color-shadow-2xl); - --color-sidebar-shadow-3xl: var(--color-shadow-3xl); - --color-sidebar-shadow-4xl: var(--color-shadow-4xl); - - /* pi */ - --color-pi-50: var(--color-background-90); - --color-pi-100: var(--color-background-90); - --color-pi-200: var(--color-primary-200); - --color-pi-300: var(--color-primary-200); - --color-pi-400: var(--color-primary-200); - --color-pi-500: var(--color-primary-200); - --color-pi-600: 151, 150, 246; - --color-pi-700: var(--color-primary-100); - --color-pi-800: 57, 56, 149; - --color-pi-900: 30, 29, 78; - --color-pi-950: 14, 14, 37; - } - - [data-theme="light"], - [data-theme="light-contrast"] { - color-scheme: light !important; - - --color-background-100: 255, 255, 255; /* primary bg */ - --color-background-90: 247, 247, 247; /* secondary bg */ - --color-background-80: 232, 232, 232; /* tertiary bg */ - - /* pi */ - --color-pi-50: var(--color-background-90); - --color-pi-100: var(--color-background-90); - --color-pi-200: var(--color-primary-200); - --color-pi-300: var(--color-primary-200); - --color-pi-400: var(--color-primary-200); - --color-pi-500: var(--color-primary-200); - --color-pi-600: 151, 150, 246; - --color-pi-700: var(--color-primary-100); - --color-pi-800: 57, 56, 149; - --color-pi-900: 30, 29, 78; - --color-pi-950: 14, 14, 37; - } - - [data-theme="light"] { - --color-text-100: 23, 23, 23; /* primary text */ - --color-text-200: 58, 58, 58; /* secondary text */ - --color-text-300: 82, 82, 82; /* tertiary text */ - --color-text-400: 163, 163, 163; /* placeholder text */ - - --color-scrollbar: 163, 163, 163; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - - /* onboarding colors */ - --gradient-onboarding-100: linear-gradient( - 106deg, - #f2f6ff 29.8%, - #e1eaff 99.34% - ); - --gradient-onboarding-200: linear-gradient( - 129deg, - rgba(255, 255, 255, 0) -22.23%, - rgba(255, 255, 255, 0.8) 62.98% - ); - --gradient-onboarding-300: linear-gradient( - 164deg, - #fff 4.25%, - rgba(255, 255, 255, 0.06) 93.5% - ); - --gradient-onboarding-400: linear-gradient( - 129deg, - rgba(255, 255, 255, 0) -22.23%, - rgba(255, 255, 255, 0.8) 62.98% - ); - - --color-onboarding-text-100: 23, 23, 23; - --color-onboarding-text-200: 58, 58, 58; - --color-onboarding-text-300: 82, 82, 82; - --color-onboarding-text-400: 163, 163, 163; - - --color-onboarding-background-100: 236, 241, 255; - --color-onboarding-background-200: 255, 255, 255; - --color-onboarding-background-300: 236, 241, 255; - --color-onboarding-background-400: 177, 206, 250; - - --color-onboarding-border-100: 229, 229, 229; - --color-onboarding-border-200: 217, 228, 255; - --color-onboarding-border-300: 229, 229, 229, 0.5; - - --color-onboarding-shadow-sm: 0px 4px 20px 0px rgba(126, 139, 171, 0.1); - - /* toast theme */ - --color-toast-success-text: 62, 155, 79; - --color-toast-error-text: 220, 62, 66; - --color-toast-warning-text: 255, 186, 24; - --color-toast-info-text: 51, 88, 212; - --color-toast-loading-text: 28, 32, 36; - --color-toast-secondary-text: 128, 131, 141; - --color-toast-tertiary-text: 96, 100, 108; - - --color-toast-success-background: 253, 253, 254; - --color-toast-error-background: 255, 252, 252; - --color-toast-warning-background: 254, 253, 251; - --color-toast-info-background: 253, 253, 254; - --color-toast-loading-background: 253, 253, 254; - - --color-toast-success-border: 218, 241, 219; - --color-toast-error-border: 255, 219, 220; - --color-toast-warning-border: 255, 247, 194; - --color-toast-info-border: 210, 222, 255; - --color-toast-loading-border: 224, 225, 230; - } - - [data-theme="light-contrast"] { - --color-text-100: 11, 11, 11; /* primary text */ - --color-text-200: 38, 38, 38; /* secondary text */ - --color-text-300: 58, 58, 58; /* tertiary text */ - --color-text-400: 115, 115, 115; /* placeholder text */ - - --color-scrollbar: 115, 115, 115; /* scrollbar thumb */ - - --color-border-100: 34, 34, 34; /* subtle border= 1 */ - --color-border-200: 38, 38, 38; /* subtle border- 2 */ - --color-border-300: 46, 46, 46; /* strong border- 1 */ - --color-border-400: 58, 58, 58; /* strong border- 2 */ - } - - [data-theme="dark"], - [data-theme="dark-contrast"] { - color-scheme: dark !important; - - --color-primary-10: 8, 31, 43; - --color-primary-20: 10, 37, 51; - --color-primary-30: 13, 49, 69; - --color-primary-40: 16, 58, 81; - --color-primary-50: 18, 68, 94; - --color-primary-60: 23, 86, 120; - --color-primary-70: 28, 104, 146; - --color-primary-80: 31, 116, 163; - --color-primary-90: 34, 129, 180; - --color-primary-100: 40, 146, 204; - --color-primary-200: 41, 154, 214; - --color-primary-300: 75, 170, 221; - --color-primary-400: 109, 186, 227; - --color-primary-500: 144, 202, 234; - --color-primary-600: 169, 214, 239; - --color-primary-700: 199, 229, 244; - --color-primary-800: 216, 237, 248; - --color-primary-900: 229, 243, 250; - - --color-background-100: 25, 25, 25; /* primary bg */ - --color-background-90: 32, 32, 32; /* secondary bg */ - --color-background-80: 44, 44, 44; /* tertiary bg */ - - --color-shadow-2xs: - 0px 0px 1px 0px rgba(0, 0, 0, 0.15), 0px 1px 3px 0px rgba(0, 0, 0, 0.5); - --color-shadow-xs: - 0px 0px 2px 0px rgba(0, 0, 0, 0.2), 0px 2px 4px 0px rgba(0, 0, 0, 0.5); - --color-shadow-sm: - 0px 0px 4px 0px rgba(0, 0, 0, 0.2), 0px 2px 6px 0px rgba(0, 0, 0, 0.5); - --color-shadow-rg: - 0px 0px 6px 0px rgba(0, 0, 0, 0.2), 0px 4px 6px 0px rgba(0, 0, 0, 0.5); - --color-shadow-md: - 0px 2px 8px 0px rgba(0, 0, 0, 0.2), 0px 4px 8px 0px rgba(0, 0, 0, 0.5); - --color-shadow-lg: - 0px 4px 12px 0px rgba(0, 0, 0, 0.25), 0px 4px 10px 0px rgba(0, 0, 0, 0.55); - --color-shadow-xl: - 0px 0px 14px 0px rgba(0, 0, 0, 0.25), 0px 6px 10px 0px rgba(0, 0, 0, 0.55); - --color-shadow-2xl: - 0px 0px 18px 0px rgba(0, 0, 0, 0.25), 0px 8px 12px 0px rgba(0, 0, 0, 0.6); - --color-shadow-3xl: - 0px 4px 24px 0px rgba(0, 0, 0, 0.3), 0px 12px 40px 0px rgba(0, 0, 0, 0.65); - /* pi */ - --color-pi-50: var(--color-background-90); - --color-pi-100: var(--color-background-90); - --color-pi-200: var(--color-primary-200); - --color-pi-300: var(--color-primary-200); - --color-pi-400: var(--color-primary-200); - --color-pi-500: var(--color-primary-200); - --color-pi-600: 151, 150, 246; - --color-pi-700: var(--color-primary-100); - --color-pi-800: 57, 56, 149; - --color-pi-900: 30, 29, 78; - --color-pi-950: 14, 14, 37; - } - - [data-theme="dark"] { - --color-text-100: 229, 229, 229; /* primary text */ - --color-text-200: 163, 163, 163; /* secondary text */ - --color-text-300: 115, 115, 115; /* tertiary text */ - --color-text-400: 82, 82, 82; /* placeholder text */ - - --color-scrollbar: 82, 82, 82; /* scrollbar thumb */ - - --color-border-100: 34, 34, 34; /* subtle border= 1 */ - --color-border-200: 38, 38, 38; /* subtle border- 2 */ - --color-border-300: 46, 46, 46; /* strong border- 1 */ - --color-border-400: 58, 58, 58; /* strong border- 2 */ - - /* onboarding colors */ - --gradient-onboarding-100: linear-gradient( - 106deg, - #18191b 25.17%, - #18191b 99.34% - ); - --gradient-onboarding-200: linear-gradient( - 129deg, - rgba(47, 49, 53, 0.8) -22.23%, - rgba(33, 34, 37, 0.8) 62.98% - ); - --gradient-onboarding-300: linear-gradient( - 167deg, - rgba(47, 49, 53, 0.45) 19.22%, - #212225 98.48% - ); - - --color-onboarding-text-100: 237, 238, 240; - --color-onboarding-text-200: 176, 180, 187; - --color-onboarding-text-300: 118, 123, 132; - --color-onboarding-text-400: 105, 110, 119; - - --color-onboarding-background-100: 54, 58, 64; - --color-onboarding-background-200: 40, 42, 45; - --color-onboarding-background-300: 40, 42, 45; - --color-onboarding-background-400: 67, 72, 79; - - --color-onboarding-border-100: 54, 58, 64; - --color-onboarding-border-200: 54, 58, 64; - --color-onboarding-border-300: 34, 35, 38, 0.5; - - --color-onboarding-shadow-sm: 0px 4px 20px 0px rgba(39, 44, 56, 0.1); - - /* toast theme */ - --color-toast-success-text: 178, 221, 181; - --color-toast-error-text: 206, 44, 49; - --color-toast-warning-text: 255, 186, 24; - --color-toast-info-text: 141, 164, 239; - --color-toast-loading-text: 255, 255, 255; - --color-toast-secondary-text: 185, 187, 198; - --color-toast-tertiary-text: 139, 141, 152; - - --color-toast-success-background: 46, 46, 46; - --color-toast-error-background: 46, 46, 46; - --color-toast-warning-background: 46, 46, 46; - --color-toast-info-background: 46, 46, 46; - --color-toast-loading-background: 46, 46, 46; - - --color-toast-success-border: 42, 126, 59; - --color-toast-error-border: 100, 23, 35; - --color-toast-warning-border: 79, 52, 34; - --color-toast-info-border: 58, 91, 199; - --color-toast-loading-border: 96, 100, 108; - } - - [data-theme="dark-contrast"] { - --color-text-100: 250, 250, 250; /* primary text */ - --color-text-200: 241, 241, 241; /* secondary text */ - --color-text-300: 212, 212, 212; /* tertiary text */ - --color-text-400: 115, 115, 115; /* placeholder text */ - - --color-scrollbar: 115, 115, 115; /* scrollbar thumb */ - - --color-border-100: 245, 245, 245; /* subtle border= 1 */ - --color-border-200: 229, 229, 229; /* subtle border- 2 */ - --color-border-300: 212, 212, 212; /* strong border- 1 */ - --color-border-400: 185, 185, 185; /* strong border- 2 */ - } - - [data-theme="light"], - [data-theme="dark"], - [data-theme="light-contrast"], - [data-theme="dark-contrast"] { - --color-sidebar-background-100: var( - --color-background-100 - ); /* primary sidebar bg */ - --color-sidebar-background-90: var( - --color-background-90 - ); /* secondary sidebar bg */ - --color-sidebar-background-80: var( - --color-background-80 - ); /* tertiary sidebar bg */ - - --color-sidebar-text-100: var(--color-text-100); /* primary sidebar text */ - --color-sidebar-text-200: var( - --color-text-200 - ); /* secondary sidebar text */ - --color-sidebar-text-300: var(--color-text-300); /* tertiary sidebar text */ - --color-sidebar-text-400: var( - --color-text-400 - ); /* sidebar placeholder text */ - - --color-sidebar-border-100: var( - --color-border-100 - ); /* subtle sidebar border= 1 */ - --color-sidebar-border-200: var( - --color-border-200 - ); /* subtle sidebar border- 2 */ - --color-sidebar-border-300: var( - --color-border-300 - ); /* strong sidebar border- 1 */ - --color-sidebar-border-400: var( - --color-border-400 - ); /* strong sidebar border- 2 */ - } -} - -* { - margin: 0; - padding: 0; - box-sizing: border-box; - -webkit-text-size-adjust: 100%; - -ms-text-size-adjust: 100%; - font-variant-ligatures: none; - -webkit-font-variant-ligatures: none; - text-rendering: optimizeLegibility; - -moz-osx-font-smoothing: grayscale; - -webkit-font-smoothing: antialiased; -} - -body { - color: rgba(var(--color-text-100)); -} - -/* scrollbar style */ -::-webkit-scrollbar { - display: none; -} - -.tags-input-container { - border: 2px solid #000; - padding: 0.5em; - border-radius: 3px; - width: min(80vw, 600px); - margin-top: 1em; - display: flex; - align-items: center; - flex-wrap: wrap; - gap: 0.5em; -} - -.tag-item { - background-color: rgb(218, 216, 216); - display: inline-block; - padding: 0.5em 0.75em; - border-radius: 20px; -} -.tag-item .close { - height: 20px; - width: 20px; - background-color: rgb(48, 48, 48); - color: #fff; - border-radius: 50%; - display: inline-flex; - justify-content: center; - align-items: center; - margin-left: 0.5em; - font-size: 18px; - cursor: pointer; -} - -.tags-input { - flex-grow: 1; - padding: 0.5em 0; - border: none; - outline: none; -} - -/* emoji icon picker */ -.conical-gradient { - background: conic-gradient( - from 180deg at 50% 50%, - #ff6b00 0deg, - #f7ae59 70.5deg, - #3f76ff 151.12deg, - #05c3ff 213deg, - #18914f 289.87deg, - #f6f172 329.25deg, - #ff6b00 360deg - ); -} - -/* progress bar */ -.progress-bar { - fill: currentColor; - color: rgba(var(--color-sidebar-background-100)); -} - -/* lineclamp */ -.lineclamp { - overflow: hidden; - display: -webkit-box; - -webkit-box-orient: vertical; - -webkit-line-clamp: 1; -} - -/* popover2 styling */ -.bp4-popover2-transition-container { - z-index: 1 !important; -} - -::-webkit-input-placeholder, -::placeholder, -:-ms-input-placeholder { - color: rgb(var(--color-text-400)); -} - -.bp4-overlay-content { - z-index: 555 !important; -} - -.disable-scroll { - overflow: hidden !important; -} - -.vertical-lr { - writing-mode: vertical-lr; - -webkit-writing-mode: vertical-lr; - -ms-writing-mode: vertical-lr; - width: fit-content; -} - -div.web-view-spinner { - position: relative; - width: 54px; - height: 54px; - display: inline-block; - margin-left: 50%; - margin-right: 50%; - padding: 10px; - border-radius: 10px; -} - -div.web-view-spinner div { - width: 6%; - height: 16%; - background: rgb(var(--color-text-400)); - position: absolute; - left: 49%; - top: 43%; - opacity: 0; - border-radius: 50px; - -webkit-border-radius: 50px; - box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); - -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); - animation: fade 1s linear infinite; - -webkit-animation: fade 1s linear infinite; -} - -@keyframes fade { - from { - opacity: 1; - } - to { - opacity: 0.25; - } -} -@-webkit-keyframes fade { - from { - opacity: 1; - } - to { - opacity: 0.25; - } -} - -div.web-view-spinner div.bar1 { - transform: rotate(0deg) translate(0, -130%); - -webkit-transform: rotate(0deg) translate(0, -130%); - animation-delay: 0s; - -webkit-animation-delay: 0s; -} - -div.web-view-spinner div.bar2 { - transform: rotate(30deg) translate(0, -130%); - -webkit-transform: rotate(30deg) translate(0, -130%); - animation-delay: -0.9167s; - -webkit-animation-delay: -0.9167s; -} - -div.web-view-spinner div.bar3 { - transform: rotate(60deg) translate(0, -130%); - -webkit-transform: rotate(60deg) translate(0, -130%); - animation-delay: -0.833s; - -webkit-animation-delay: -0.833s; -} -div.web-view-spinner div.bar4 { - transform: rotate(90deg) translate(0, -130%); - -webkit-transform: rotate(90deg) translate(0, -130%); - animation-delay: -0.7497s; - -webkit-animation-delay: -0.7497s; -} -div.web-view-spinner div.bar5 { - transform: rotate(120deg) translate(0, -130%); - -webkit-transform: rotate(120deg) translate(0, -130%); - animation-delay: -0.667s; - -webkit-animation-delay: -0.667s; -} -div.web-view-spinner div.bar6 { - transform: rotate(150deg) translate(0, -130%); - -webkit-transform: rotate(150deg) translate(0, -130%); - animation-delay: -0.5837s; - -webkit-animation-delay: -0.5837s; -} -div.web-view-spinner div.bar7 { - transform: rotate(180deg) translate(0, -130%); - -webkit-transform: rotate(180deg) translate(0, -130%); - animation-delay: -0.5s; - -webkit-animation-delay: -0.5s; -} -div.web-view-spinner div.bar8 { - transform: rotate(210deg) translate(0, -130%); - -webkit-transform: rotate(210deg) translate(0, -130%); - animation-delay: -0.4167s; - -webkit-animation-delay: -0.4167s; -} -div.web-view-spinner div.bar9 { - transform: rotate(240deg) translate(0, -130%); - -webkit-transform: rotate(240deg) translate(0, -130%); - animation-delay: -0.333s; - -webkit-animation-delay: -0.333s; -} -div.web-view-spinner div.bar10 { - transform: rotate(270deg) translate(0, -130%); - -webkit-transform: rotate(270deg) translate(0, -130%); - animation-delay: -0.2497s; - -webkit-animation-delay: -0.2497s; -} -div.web-view-spinner div.bar11 { - transform: rotate(300deg) translate(0, -130%); - -webkit-transform: rotate(300deg) translate(0, -130%); - animation-delay: -0.167s; - -webkit-animation-delay: -0.167s; -} -div.web-view-spinner div.bar12 { - transform: rotate(330deg) translate(0, -130%); - -webkit-transform: rotate(330deg) translate(0, -130%); - animation-delay: -0.0833s; - -webkit-animation-delay: -0.0833s; -} - -@-moz-document url-prefix() { - * { - scrollbar-width: none; - } - .vertical-scrollbar, - .horizontal-scrollbar { - scrollbar-width: initial; - scrollbar-color: rgba(96, 100, 108, 0.1) transparent; - } - .vertical-scrollbar:hover, - .horizontal-scrollbar:hover { - scrollbar-color: rgba(96, 100, 108, 0.25) transparent; - } - .vertical-scrollbar:active, - .horizontal-scrollbar:active { - scrollbar-color: rgba(96, 100, 108, 0.7) transparent; - } -} - -.vertical-scrollbar { - overflow-y: auto; -} -.horizontal-scrollbar { - overflow-x: auto; -} -.vertical-scrollbar::-webkit-scrollbar, -.horizontal-scrollbar::-webkit-scrollbar { - display: block; -} -.vertical-scrollbar::-webkit-scrollbar-track, -.horizontal-scrollbar::-webkit-scrollbar-track { - background-color: transparent; - border-radius: 9999px; -} -.vertical-scrollbar::-webkit-scrollbar-thumb, -.horizontal-scrollbar::-webkit-scrollbar-thumb { - background-clip: padding-box; - background-color: rgba(96, 100, 108, 0.1); - border-radius: 9999px; -} -.vertical-scrollbar:hover::-webkit-scrollbar-thumb, -.horizontal-scrollbar:hover::-webkit-scrollbar-thumb { - background-color: rgba(96, 100, 108, 0.25); -} -.vertical-scrollbar::-webkit-scrollbar-thumb:hover, -.horizontal-scrollbar::-webkit-scrollbar-thumb:hover { - background-color: rgba(96, 100, 108, 0.5); -} -.vertical-scrollbar::-webkit-scrollbar-thumb:active, -.horizontal-scrollbar::-webkit-scrollbar-thumb:active { - background-color: rgba(96, 100, 108, 0.7); -} -.vertical-scrollbar::-webkit-scrollbar-corner, -.horizontal-scrollbar::-webkit-scrollbar-corner { - background-color: transparent; -} -.vertical-scrollbar-margin-top-md::-webkit-scrollbar-track { - margin-top: 44px; -} - -/* scrollbar sm size */ -.scrollbar-sm::-webkit-scrollbar { - height: 12px; - width: 12px; -} -.scrollbar-sm::-webkit-scrollbar-thumb { - border: 3px solid rgba(0, 0, 0, 0); -} -/* scrollbar md size */ -.scrollbar-md::-webkit-scrollbar { - height: 14px; - width: 14px; -} -.scrollbar-md::-webkit-scrollbar-thumb { - border: 3px solid rgba(0, 0, 0, 0); -} -/* scrollbar lg size */ - -.scrollbar-lg::-webkit-scrollbar { - height: 16px; - width: 16px; -} -.scrollbar-lg::-webkit-scrollbar-thumb { - border: 4px solid rgba(0, 0, 0, 0); -} - -/* highlight class */ -.highlight { - border: 1px solid rgb(var(--color-primary-100)) !important; -} -.highlight-with-line { - border-left: 5px solid rgb(var(--color-primary-100)) !important; - background: rgb(var(--color-background-80)); -} - -/* By applying below class, the autofilled text in form fields will not have the default autofill background color and styles applied by WebKit browsers */ - -.disable-autofill-style:-webkit-autofill, -.disable-autofill-style:-webkit-autofill:hover, -.disable-autofill-style:-webkit-autofill:focus, -.disable-autofill-style:-webkit-autofill:active { - -webkit-background-clip: text; -} - -@keyframes slideInFromBottom { - 0% { - transform: translateY(100%); - opacity: 0; - } - 100% { - transform: translateY(0); - opacity: 1; - } -} - -@keyframes slideInFromTop { - 0% { - transform: translateY(-100%); - opacity: 0; - } - 100% { - transform: translateY(0); - opacity: 1; - } -} - -@keyframes slideOut { - 0% { - transform: translateY(0); - opacity: 1; - } - 100% { - transform: translateY(-100%); - opacity: 0; - } -} - -@keyframes slideOutDown { - 0% { - transform: translateY(0); - opacity: 1; - } - 100% { - transform: translateY(100%); - opacity: 0; - } -} - -@keyframes fadeOut { - 0% { - opacity: 1; - } - 100% { - opacity: 0; - } -} diff --git a/packages/tailwind-config/index.css b/packages/tailwind-config/index.css new file mode 100644 index 0000000000..9cb02f5e94 --- /dev/null +++ b/packages/tailwind-config/index.css @@ -0,0 +1,401 @@ +@import "tailwindcss"; + +@import "./colors.css"; +@import "./spacing.css"; +@import "./typography.css"; +@import "./animations.css"; + +html { + font-family: "Inter", sans-serif; +} + +* { + margin: 0; + padding: 0; + box-sizing: border-box; + -webkit-text-size-adjust: 100%; + -ms-text-size-adjust: 100%; + font-variant-ligatures: none; + -webkit-font-variant-ligatures: none; + text-rendering: optimizeLegibility; + -moz-osx-font-smoothing: grayscale; + -webkit-font-smoothing: antialiased; +} + +body { + color: rgba(var(--color-text-100)); +} + +/* scrollbar style */ +::-webkit-scrollbar { + display: none; +} + +.tags-input-container { + border: 2px solid #000; + padding: 0.5em; + border-radius: 3px; + width: min(80vw, 600px); + margin-top: 1em; + display: flex; + align-items: center; + flex-wrap: wrap; + gap: 0.5em; +} + +.tag-item { + background-color: rgb(218, 216, 216); + display: inline-block; + padding: 0.5em 0.75em; + border-radius: 20px; +} +.tag-item .close { + height: 20px; + width: 20px; + background-color: rgb(48, 48, 48); + color: #fff; + border-radius: 50%; + display: inline-flex; + justify-content: center; + align-items: center; + margin-left: 0.5em; + font-size: 18px; + cursor: pointer; +} + +.tags-input { + flex-grow: 1; + padding: 0.5em 0; + border: none; + outline: none; +} + +/* emoji icon picker */ +.conical-gradient { + background: conic-gradient( + from 180deg at 50% 50%, + #ff6b00 0deg, + #f7ae59 70.5deg, + #3f76ff 151.12deg, + #05c3ff 213deg, + #18914f 289.87deg, + #f6f172 329.25deg, + #ff6b00 360deg + ); +} + +/* progress bar */ +.progress-bar { + fill: currentColor; + color: rgba(var(--color-sidebar-background-100)); +} + +/* lineclamp */ +.lineclamp { + overflow: hidden; + display: -webkit-box; + -webkit-box-orient: vertical; + -webkit-line-clamp: 1; +} + +/* popover2 styling */ +.bp4-popover2-transition-container { + z-index: 1 !important; +} + +::-webkit-input-placeholder, +::placeholder, +:-ms-input-placeholder { + color: rgb(var(--color-text-400)); +} + +.bp4-overlay-content { + z-index: 555 !important; +} + +.disable-scroll { + overflow: hidden !important; +} + +.vertical-lr { + writing-mode: vertical-lr; + -webkit-writing-mode: vertical-lr; + -ms-writing-mode: vertical-lr; + width: fit-content; +} + +div.web-view-spinner { + position: relative; + width: 54px; + height: 54px; + display: inline-block; + margin-left: 50%; + margin-right: 50%; + padding: 10px; + border-radius: 10px; +} + +div.web-view-spinner div { + width: 6%; + height: 16%; + background: rgb(var(--color-text-400)); + position: absolute; + left: 49%; + top: 43%; + opacity: 0; + border-radius: 50px; + -webkit-border-radius: 50px; + box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); + -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.2); + animation: fade 1s linear infinite; + -webkit-animation: fade 1s linear infinite; +} + +@keyframes fade { + from { + opacity: 1; + } + to { + opacity: 0.25; + } +} +@-webkit-keyframes fade { + from { + opacity: 1; + } + to { + opacity: 0.25; + } +} + +div.web-view-spinner div.bar1 { + transform: rotate(0deg) translate(0, -130%); + -webkit-transform: rotate(0deg) translate(0, -130%); + animation-delay: 0s; + -webkit-animation-delay: 0s; +} + +div.web-view-spinner div.bar2 { + transform: rotate(30deg) translate(0, -130%); + -webkit-transform: rotate(30deg) translate(0, -130%); + animation-delay: -0.9167s; + -webkit-animation-delay: -0.9167s; +} + +div.web-view-spinner div.bar3 { + transform: rotate(60deg) translate(0, -130%); + -webkit-transform: rotate(60deg) translate(0, -130%); + animation-delay: -0.833s; + -webkit-animation-delay: -0.833s; +} +div.web-view-spinner div.bar4 { + transform: rotate(90deg) translate(0, -130%); + -webkit-transform: rotate(90deg) translate(0, -130%); + animation-delay: -0.7497s; + -webkit-animation-delay: -0.7497s; +} +div.web-view-spinner div.bar5 { + transform: rotate(120deg) translate(0, -130%); + -webkit-transform: rotate(120deg) translate(0, -130%); + animation-delay: -0.667s; + -webkit-animation-delay: -0.667s; +} +div.web-view-spinner div.bar6 { + transform: rotate(150deg) translate(0, -130%); + -webkit-transform: rotate(150deg) translate(0, -130%); + animation-delay: -0.5837s; + -webkit-animation-delay: -0.5837s; +} +div.web-view-spinner div.bar7 { + transform: rotate(180deg) translate(0, -130%); + -webkit-transform: rotate(180deg) translate(0, -130%); + animation-delay: -0.5s; + -webkit-animation-delay: -0.5s; +} +div.web-view-spinner div.bar8 { + transform: rotate(210deg) translate(0, -130%); + -webkit-transform: rotate(210deg) translate(0, -130%); + animation-delay: -0.4167s; + -webkit-animation-delay: -0.4167s; +} +div.web-view-spinner div.bar9 { + transform: rotate(240deg) translate(0, -130%); + -webkit-transform: rotate(240deg) translate(0, -130%); + animation-delay: -0.333s; + -webkit-animation-delay: -0.333s; +} +div.web-view-spinner div.bar10 { + transform: rotate(270deg) translate(0, -130%); + -webkit-transform: rotate(270deg) translate(0, -130%); + animation-delay: -0.2497s; + -webkit-animation-delay: -0.2497s; +} +div.web-view-spinner div.bar11 { + transform: rotate(300deg) translate(0, -130%); + -webkit-transform: rotate(300deg) translate(0, -130%); + animation-delay: -0.167s; + -webkit-animation-delay: -0.167s; +} +div.web-view-spinner div.bar12 { + transform: rotate(330deg) translate(0, -130%); + -webkit-transform: rotate(330deg) translate(0, -130%); + animation-delay: -0.0833s; + -webkit-animation-delay: -0.0833s; +} + +@-moz-document url-prefix() { + * { + scrollbar-width: none; + } + .vertical-scrollbar, + .horizontal-scrollbar { + scrollbar-width: initial; + scrollbar-color: rgba(96, 100, 108, 0.1) transparent; + } + .vertical-scrollbar:hover, + .horizontal-scrollbar:hover { + scrollbar-color: rgba(96, 100, 108, 0.25) transparent; + } + .vertical-scrollbar:active, + .horizontal-scrollbar:active { + scrollbar-color: rgba(96, 100, 108, 0.7) transparent; + } +} + +.vertical-scrollbar { + overflow-y: auto; +} +.horizontal-scrollbar { + overflow-x: auto; +} +.vertical-scrollbar::-webkit-scrollbar, +.horizontal-scrollbar::-webkit-scrollbar { + display: block; +} +.vertical-scrollbar::-webkit-scrollbar-track, +.horizontal-scrollbar::-webkit-scrollbar-track { + background-color: transparent; + border-radius: 9999px; +} +.vertical-scrollbar::-webkit-scrollbar-thumb, +.horizontal-scrollbar::-webkit-scrollbar-thumb { + background-clip: padding-box; + background-color: rgba(96, 100, 108, 0.1); + border-radius: 9999px; +} +.vertical-scrollbar:hover::-webkit-scrollbar-thumb, +.horizontal-scrollbar:hover::-webkit-scrollbar-thumb { + background-color: rgba(96, 100, 108, 0.25); +} +.vertical-scrollbar::-webkit-scrollbar-thumb:hover, +.horizontal-scrollbar::-webkit-scrollbar-thumb:hover { + background-color: rgba(96, 100, 108, 0.5); +} +.vertical-scrollbar::-webkit-scrollbar-thumb:active, +.horizontal-scrollbar::-webkit-scrollbar-thumb:active { + background-color: rgba(96, 100, 108, 0.7); +} +.vertical-scrollbar::-webkit-scrollbar-corner, +.horizontal-scrollbar::-webkit-scrollbar-corner { + background-color: transparent; +} +.vertical-scrollbar-margin-top-md::-webkit-scrollbar-track { + margin-top: 44px; +} + +/* scrollbar sm size */ +.scrollbar-sm::-webkit-scrollbar { + height: 12px; + width: 12px; +} +.scrollbar-sm::-webkit-scrollbar-thumb { + border: 3px solid rgba(0, 0, 0, 0); +} +/* scrollbar md size */ +.scrollbar-md::-webkit-scrollbar { + height: 14px; + width: 14px; +} +.scrollbar-md::-webkit-scrollbar-thumb { + border: 3px solid rgba(0, 0, 0, 0); +} +/* scrollbar lg size */ + +.scrollbar-lg::-webkit-scrollbar { + height: 16px; + width: 16px; +} +.scrollbar-lg::-webkit-scrollbar-thumb { + border: 4px solid rgba(0, 0, 0, 0); +} + +/* highlight class */ +.highlight { + border: 1px solid rgb(var(--color-primary-100)) !important; +} +.highlight-with-line { + border-left: 5px solid rgb(var(--color-primary-100)) !important; + background: rgb(var(--color-background-80)); +} + +/* By applying below class, the autofilled text in form fields will not have the default autofill background color and styles applied by WebKit browsers */ + +.disable-autofill-style:-webkit-autofill, +.disable-autofill-style:-webkit-autofill:hover, +.disable-autofill-style:-webkit-autofill:focus, +.disable-autofill-style:-webkit-autofill:active { + -webkit-background-clip: text; +} + +@keyframes slideInFromBottom { + 0% { + transform: translateY(100%); + opacity: 0; + } + 100% { + transform: translateY(0); + opacity: 1; + } +} + +@keyframes slideInFromTop { + 0% { + transform: translateY(-100%); + opacity: 0; + } + 100% { + transform: translateY(0); + opacity: 1; + } +} + +@keyframes slideOut { + 0% { + transform: translateY(0); + opacity: 1; + } + 100% { + transform: translateY(-100%); + opacity: 0; + } +} + +@keyframes slideOutDown { + 0% { + transform: translateY(0); + opacity: 1; + } + 100% { + transform: translateY(100%); + opacity: 0; + } +} + +@keyframes fadeOut { + 0% { + opacity: 1; + } + 100% { + opacity: 0; + } +} diff --git a/packages/tailwind-config/package.json b/packages/tailwind-config/package.json index ada4cc5e81..1068430ef8 100644 --- a/packages/tailwind-config/package.json +++ b/packages/tailwind-config/package.json @@ -5,12 +5,16 @@ "description": "common tailwind configuration across monorepo", "main": "tailwind.config.js", "private": true, + "sideEffects": [ + "**/*.css" + ], "devDependencies": { - "@tailwindcss/container-queries": "^0.1.1", - "@tailwindcss/typography": "^0.5.9", - "autoprefixer": "^10.4.14", - "postcss": "^8.4.38", - "tailwindcss": "^3.4.17", - "tailwindcss-animate": "^1.0.6" + "@tailwindcss/postcss": "4.1.13", + "postcss": "8.5.6", + "tailwindcss": "4.1.17" + }, + "exports": { + "./index.css": "./index.css", + "./postcss.config.js": "./postcss.config.js" } } diff --git a/packages/tailwind-config/postcss.config.js b/packages/tailwind-config/postcss.config.js index cbfea5ea20..48431249a5 100644 --- a/packages/tailwind-config/postcss.config.js +++ b/packages/tailwind-config/postcss.config.js @@ -1,7 +1,6 @@ -module.exports = { +export default { plugins: { - "tailwindcss/nesting": {}, - tailwindcss: {}, - autoprefixer: {}, + // "tailwindcss/nesting": {}, + "@tailwindcss/postcss": {}, }, }; diff --git a/packages/tailwind-config/spacing.css b/packages/tailwind-config/spacing.css new file mode 100644 index 0000000000..d4b0ec1e70 --- /dev/null +++ b/packages/tailwind-config/spacing.css @@ -0,0 +1,39 @@ +/* Spacing - Mode 1 */ +@theme { + --spacing-*: initial; + --spacing-0: 0; + --spacing-25: 0.0625rem; + --spacing-50: 0.125rem; + --spacing-100: 0.25rem; + --spacing-150: 0.375rem; + --spacing-200: 0.5rem; + --spacing-300: 0.75rem; + --spacing-400: 1rem; + --spacing-500: 1.25rem; + --spacing-600: 1.5rem; + --spacing-700: 1.75rem; + --spacing-800: 2rem; + --spacing-900: 2.25rem; + --spacing-1000: 2.5rem; + --spacing-1100: 2.75rem; + --spacing-1200: 3rem; + + /* Borders radius */ + --radius-*: initial; + --radius-none: 0; + --radius-xs: 0.125rem; + --radius-sm: 0.25rem; + --radius-md: 0.375rem; + --radius-lg: 0.5rem; + --radius-xl: 0.75rem; + --radius-xxl: 1rem; + --radius-rounded: 9999px; + + /* Border width */ + --border-width-*: initial; + --border-width-sm: 1px; + --border-width-md: 1.5px; + --border-width-lg: 2px; + --border-width-xl: 2.5px; + --default-border-width: 1px; +} diff --git a/packages/tailwind-config/tailwind.config.js b/packages/tailwind-config/tailwind.config.js deleted file mode 100644 index cc8c113922..0000000000 --- a/packages/tailwind-config/tailwind.config.js +++ /dev/null @@ -1,492 +0,0 @@ -const convertToRGB = (variableName) => `rgba(var(${variableName}))`; -const convertToRGBA = (variableName, alpha) => - `rgba(var(${variableName}), ${alpha})`; - -/** @type {import('tailwindcss').Config} */ -module.exports = { - darkMode: "class", - content: { - relative: true, - files: [ - "./app/**/*.{js,ts,jsx,tsx}", - "./core/**/*.{js,ts,jsx,tsx}", - "./ce/**/*.{js,ts,jsx,tsx}", - "./ee/**/*.{js,ts,jsx,tsx}", - "./components/**/*.tsx", - "./constants/**/*.{js,ts,jsx,tsx}", - "./layouts/**/*.tsx", - "./pages/**/*.tsx", - "./app/**/*.tsx", - "./ui/**/*.tsx", - "../../packages/ui/src/**/*.{js,ts,jsx,tsx}", - "../../packages/propel/src/**/*.{js,ts,jsx,tsx}", - "../../packages/editor/src/**/*.{js,ts,jsx,tsx}", - "!../../packages/ui/**/*.stories{js,ts,jsx,tsx}", - ], - }, - theme: { - extend: { - boxShadow: { - "custom-shadow": "var(--color-shadow-custom)", - "custom-shadow-2xs": "var(--color-shadow-2xs)", - "custom-shadow-xs": "var(--color-shadow-xs)", - "custom-shadow-sm": "var(--color-shadow-sm)", - "custom-shadow-rg": "var(--color-shadow-rg)", - "custom-shadow-md": "var(--color-shadow-md)", - "custom-shadow-lg": "var(--color-shadow-lg)", - "custom-shadow-xl": "var(--color-shadow-xl)", - "custom-shadow-2xl": "var(--color-shadow-2xl)", - "custom-shadow-3xl": "var(--color-shadow-3xl)", - "custom-shadow-4xl": "var(--color-shadow-4xl)", - "custom-sidebar-shadow-2xs": "var(--color-sidebar-shadow-2xs)", - "custom-sidebar-shadow-xs": "var(--color-sidebar-shadow-xs)", - "custom-sidebar-shadow-sm": "var(--color-sidebar-shadow-sm)", - "custom-sidebar-shadow-rg": "var(--color-sidebar-shadow-rg)", - "custom-sidebar-shadow-md": "var(--color-sidebar-shadow-md)", - "custom-sidebar-shadow-lg": "var(--color-sidebar-shadow-lg)", - "custom-sidebar-shadow-xl": "var(--color-sidebar-shadow-xl)", - "custom-sidebar-shadow-2xl": "var(--color-sidebar-shadow-2xl)", - "custom-sidebar-shadow-3xl": "var(--color-sidebar-shadow-3xl)", - "custom-sidebar-shadow-4xl": "var(--color-sidebar-shadow-4xl)", - }, - colors: { - custom: { - primary: { - 0: "rgb(255, 255, 255)", - 10: convertToRGB("--color-primary-10"), - 20: convertToRGB("--color-primary-20"), - 30: convertToRGB("--color-primary-30"), - 40: convertToRGB("--color-primary-40"), - 50: convertToRGB("--color-primary-50"), - 60: convertToRGB("--color-primary-60"), - 70: convertToRGB("--color-primary-70"), - 80: convertToRGB("--color-primary-80"), - 90: convertToRGB("--color-primary-90"), - 100: convertToRGB("--color-primary-100"), - 200: convertToRGB("--color-primary-200"), - 300: convertToRGB("--color-primary-300"), - 400: convertToRGB("--color-primary-400"), - 500: convertToRGB("--color-primary-500"), - 600: convertToRGB("--color-primary-600"), - 700: convertToRGB("--color-primary-700"), - 800: convertToRGB("--color-primary-800"), - 900: convertToRGB("--color-primary-900"), - 1000: "rgb(0, 0, 0)", - DEFAULT: convertToRGB("--color-primary-100"), - }, - background: { - 0: "rgb(255, 255, 255)", - 10: convertToRGB("--color-background-10"), - 20: convertToRGB("--color-background-20"), - 30: convertToRGB("--color-background-30"), - 40: convertToRGB("--color-background-40"), - 50: convertToRGB("--color-background-50"), - 60: convertToRGB("--color-background-60"), - 70: convertToRGB("--color-background-70"), - 80: convertToRGB("--color-background-80"), - 90: convertToRGB("--color-background-90"), - 100: convertToRGB("--color-background-100"), - 200: convertToRGB("--color-background-200"), - 300: convertToRGB("--color-background-300"), - 400: convertToRGB("--color-background-400"), - 500: convertToRGB("--color-background-500"), - 600: convertToRGB("--color-background-600"), - 700: convertToRGB("--color-background-700"), - 800: convertToRGB("--color-background-800"), - 900: convertToRGB("--color-background-900"), - 1000: "rgb(0, 0, 0)", - overlay: convertToRGBA("--color-background-80", 0.95), - primary: convertToRGB(" --color-background-primary"), - error: convertToRGB(" --color-background-error"), - DEFAULT: convertToRGB("--color-background-100"), - }, - text: { - 0: "rgb(255, 255, 255)", - 10: convertToRGB("--color-text-10"), - 20: convertToRGB("--color-text-20"), - 30: convertToRGB("--color-text-30"), - 40: convertToRGB("--color-text-40"), - 50: convertToRGB("--color-text-50"), - 60: convertToRGB("--color-text-60"), - 70: convertToRGB("--color-text-70"), - 80: convertToRGB("--color-text-80"), - 90: convertToRGB("--color-text-90"), - 100: convertToRGB("--color-text-100"), - 200: convertToRGB("--color-text-200"), - 300: convertToRGB("--color-text-300"), - 350: convertToRGB("--color-text-350"), - 400: convertToRGB("--color-text-400"), - 500: convertToRGB("--color-text-500"), - 600: convertToRGB("--color-text-600"), - 700: convertToRGB("--color-text-700"), - 800: convertToRGB("--color-text-800"), - 900: convertToRGB("--color-text-900"), - 1000: "rgb(0, 0, 0)", - primary: convertToRGB("--color-text-primary"), - error: convertToRGB("--color-text-error"), - DEFAULT: convertToRGB("--color-text-100"), - }, - border: { - 0: "rgb(255, 255, 255)", - 100: convertToRGB("--color-border-100"), - 200: convertToRGB("--color-border-200"), - 300: convertToRGB("--color-border-300"), - 400: convertToRGB("--color-border-400"), - 1000: "rgb(0, 0, 0)", - primary: convertToRGB("--color-border-primary"), - error: convertToRGB("--color-border-error"), - DEFAULT: convertToRGB("--color-border-200"), - }, - error: { - 10: convertToRGB("--color-error-10"), - 20: convertToRGB("--color-error-20"), - 30: convertToRGB("--color-error-30"), - 100: convertToRGB("--color-error-100"), - 200: convertToRGB("--color-error-200"), - 500: convertToRGB("--color-error-500"), - }, - sidebar: { - background: { - 0: "rgb(255, 255, 255)", - 10: convertToRGB("--color-sidebar-background-10"), - 20: convertToRGB("--color-sidebar-background-20"), - 30: convertToRGB("--color-sidebar-background-30"), - 40: convertToRGB("--color-sidebar-background-40"), - 50: convertToRGB("--color-sidebar-background-50"), - 60: convertToRGB("--color-sidebar-background-60"), - 70: convertToRGB("--color-sidebar-background-70"), - 80: convertToRGB("--color-sidebar-background-80"), - 90: convertToRGB("--color-sidebar-background-90"), - 100: convertToRGB("--color-sidebar-background-100"), - 200: convertToRGB("--color-sidebar-background-200"), - 300: convertToRGB("--color-sidebar-background-300"), - 400: convertToRGB("--color-sidebar-background-400"), - 500: convertToRGB("--color-sidebar-background-500"), - 600: convertToRGB("--color-sidebar-background-600"), - 700: convertToRGB("--color-sidebar-background-700"), - 800: convertToRGB("--color-sidebar-background-800"), - 900: convertToRGB("--color-sidebar-background-900"), - 1000: "rgb(0, 0, 0)", - DEFAULT: convertToRGB("--color-sidebar-background-100"), - }, - text: { - 0: "rgb(255, 255, 255)", - 10: convertToRGB("--color-sidebar-text-10"), - 20: convertToRGB("--color-sidebar-text-20"), - 30: convertToRGB("--color-sidebar-text-30"), - 40: convertToRGB("--color-sidebar-text-40"), - 50: convertToRGB("--color-sidebar-text-50"), - 60: convertToRGB("--color-sidebar-text-60"), - 70: convertToRGB("--color-sidebar-text-70"), - 80: convertToRGB("--color-sidebar-text-80"), - 90: convertToRGB("--color-sidebar-text-90"), - 100: convertToRGB("--color-sidebar-text-100"), - 200: convertToRGB("--color-sidebar-text-200"), - 300: convertToRGB("--color-sidebar-text-300"), - 400: convertToRGB("--color-sidebar-text-400"), - 500: convertToRGB("--color-sidebar-text-500"), - 600: convertToRGB("--color-sidebar-text-600"), - 700: convertToRGB("--color-sidebar-text-700"), - 800: convertToRGB("--color-sidebar-text-800"), - 900: convertToRGB("--color-sidebar-text-900"), - 1000: "rgb(0, 0, 0)", - DEFAULT: convertToRGB("--color-sidebar-text-100"), - }, - border: { - 0: "rgb(255, 255, 255)", - 100: convertToRGB("--color-sidebar-border-100"), - 200: convertToRGB("--color-sidebar-border-200"), - 300: convertToRGB("--color-sidebar-border-300"), - 400: convertToRGB("--color-sidebar-border-400"), - 1000: "rgb(0, 0, 0)", - DEFAULT: convertToRGB("--color-sidebar-border-200"), - }, - }, - backdrop: "rgba(0, 0, 0, 0.25)", - scrollbar: { - neutral: "rgba(96, 100, 108, 0.1)", - hover: "rgba(96, 100, 108, 0.25)", - active: "rgba(96, 100, 108, 0.7)", - }, - subscription: { - free: { - 200: convertToRGB("--color-subscription-free-200"), - 400: convertToRGB("--color-subscription-free-400"), - }, - one: { - 200: convertToRGB("--color-subscription-one-200"), - 400: convertToRGB("--color-subscription-one-400"), - }, - pro: { - 200: convertToRGB("--color-subscription-pro-200"), - 400: convertToRGB("--color-subscription-pro-400"), - }, - business: { - 200: convertToRGB("--color-subscription-business-200"), - 400: convertToRGB("--color-subscription-business-400"), - }, - enterprise: { - 200: convertToRGB("--color-subscription-enterprise-200"), - 400: convertToRGB("--color-subscription-enterprise-400"), - }, - }, - }, - toast: { - text: { - success: convertToRGB("--color-toast-success-text"), - error: convertToRGB("--color-toast-error-text"), - warning: convertToRGB("--color-toast-warning-text"), - info: convertToRGB("--color-toast-info-text"), - loading: convertToRGB("--color-toast-loading-text"), - secondary: convertToRGB("--color-toast-secondary-text"), - tertiary: convertToRGB("--color-toast-tertiary-text"), - }, - background: { - success: convertToRGB("--color-toast-success-background"), - error: convertToRGB("--color-toast-error-background"), - warning: convertToRGB("--color-toast-warning-background"), - info: convertToRGB("--color-toast-info-background"), - loading: convertToRGB("--color-toast-loading-background"), - }, - border: { - success: convertToRGB("--color-toast-success-border"), - error: convertToRGB("--color-toast-error-border"), - warning: convertToRGB("--color-toast-warning-border"), - info: convertToRGB("--color-toast-info-border"), - loading: convertToRGB("--color-toast-loading-border"), - }, - }, - }, - keyframes: { - leftToaster: { - "0%": { left: "-20rem" }, - "100%": { left: "0" }, - }, - rightToaster: { - "0%": { right: "-20rem" }, - "100%": { right: "0" }, - }, - "bar-loader": { - from: { left: "-100%" }, - to: { left: "100%" }, - }, - }, - typography: () => ({ - brand: { - css: { - "--tw-prose-body": convertToRGB("--color-text-100"), - "--tw-prose-p": convertToRGB("--color-text-100"), - "--tw-prose-headings": convertToRGB("--color-text-100"), - "--tw-prose-lead": convertToRGB("--color-text-100"), - "--tw-prose-links": convertToRGB("--color-primary-100"), - "--tw-prose-bold": "inherit", - "--tw-prose-counters": convertToRGB("--color-text-100"), - "--tw-prose-bullets": convertToRGB("--color-text-100"), - "--tw-prose-hr": convertToRGB("--color-text-100"), - "--tw-prose-quotes": convertToRGB("--color-text-100"), - "--tw-prose-quote-borders": convertToRGB("--color-border-200"), - "--tw-prose-code": convertToRGB("--color-text-100"), - "--tw-prose-pre-code": convertToRGB("--color-text-100"), - "--tw-prose-pre-bg": convertToRGB("--color-background-100"), - "--tw-prose-th-borders": convertToRGB("--color-border-200"), - "--tw-prose-td-borders": convertToRGB("--color-border-200"), - }, - }, - }), - screens: { - "3xl": "1792px", - }, - // scale down font sizes to 90% of default - fontSize: { - "2xs": "0.5625rem", - xs: "0.675rem", - sm: "0.7875rem", - base: "0.9rem", - lg: "1.0125rem", - xl: "1.125rem", - "2xl": "1.35rem", - "3xl": "1.6875rem", - "4xl": "2.25rem", - "5xl": "2.7rem", - "6xl": "3.375rem", - "7xl": "4.05rem", - "8xl": "5.4rem", - "9xl": "7.2rem", - }, - // scale down spacing to 90% of default - padding: { - 0: "0", - 0.5: "0.1125rem", - 1: "0.225rem", - 1.5: "0.3375rem", - 2: "0.45rem", - 2.5: "0.5625rem", - 3: "0.675rem", - 3.5: "0.7875rem", - 4: "0.9rem", - 5: "1.125rem", - 6: "1.35rem", - 7: "1.575rem", - 8: "1.8rem", - 9: "2.025rem", - 10: "2.25rem", - 11: "2.475rem", - 12: "2.7rem", - 16: "3.6rem", - 20: "4.5rem", - 24: "5.4rem", - 32: "7.2rem", - 40: "9rem", - 48: "10.8rem", - 56: "12.6rem", - 64: "14.4rem", - 72: "16.2rem", - 80: "18rem", - 96: "21.6rem", - "page-x": "1.35rem", - "page-y": "1.35rem", - }, - margin: { - 0: "0", - 0.5: "0.1125rem", - 1: "0.225rem", - 1.5: "0.3375rem", - 2: "0.45rem", - 2.5: "0.5625rem", - 3: "0.675rem", - 3.5: "0.7875rem", - 4: "0.9rem", - 5: "1.125rem", - 6: "1.35rem", - 7: "1.575rem", - 8: "1.8rem", - 9: "2.025rem", - 10: "2.25rem", - 11: "2.475rem", - 12: "2.7rem", - 16: "3.6rem", - 20: "4.5rem", - 24: "5.4rem", - 32: "7.2rem", - 40: "9rem", - 48: "10.8rem", - 56: "12.6rem", - 64: "14.4rem", - 72: "16.2rem", - 80: "18rem", - 96: "21.6rem", - }, - height: { - header: "3.25rem", - }, - space: { - 0: "0", - 0.5: "0.1125rem", - 1: "0.225rem", - 1.5: "0.3375rem", - 2: "0.45rem", - 2.5: "0.5625rem", - 3: "0.675rem", - 3.5: "0.7875rem", - 4: "0.9rem", - 5: "1.125rem", - 6: "1.35rem", - 7: "1.575rem", - 8: "1.8rem", - 9: "2.025rem", - 10: "2.25rem", - 11: "2.475rem", - 12: "2.7rem", - 16: "3.6rem", - 20: "4.5rem", - 24: "5.4rem", - 32: "7.2rem", - 40: "9rem", - 48: "10.8rem", - 56: "12.6rem", - 64: "14.4rem", - 72: "16.2rem", - 80: "18rem", - 96: "21.6rem", - }, - gap: { - 0: "0", - 0.5: "0.1125rem", - 1: "0.225rem", - 1.5: "0.3375rem", - 2: "0.45rem", - 2.5: "0.5625rem", - 3: "0.675rem", - 3.5: "0.7875rem", - 4: "0.9rem", - 5: "1.125rem", - 6: "1.35rem", - 7: "1.575rem", - 8: "1.8rem", - 9: "2.025rem", - 10: "2.25rem", - 11: "2.475rem", - 12: "2.7rem", - 16: "3.6rem", - 20: "4.5rem", - 24: "5.4rem", - 32: "7.2rem", - 40: "9rem", - 48: "10.8rem", - 56: "12.6rem", - 64: "14.4rem", - 72: "16.2rem", - 80: "18rem", - 96: "21.6rem", - }, - fontFamily: { - custom: ["Inter", "sans-serif"], - }, - zIndex: { - base: 0 /* default content */, - header: 10 /* sticky headers, navbars */, - sidebar: 20 /* sidebars, drawers */, - dropdown: 30 /* dropdowns, select menus */, - popover: 40 /* popovers, hovercards */, - tooltip: 50 /* tooltips, hints */, - sticky: 60 /* sticky UI */, - backdrop: 90 /* backdrop / overlay */, - modal: 100 /* dialogs, modals */, - toast: 110 /* toast, alerts */, - loader: 120 /* blocking loader/spinner */, - max: 9999 /* emergency override (rare use) */, - }, - }, - }, - plugins: [ - require("tailwindcss-animate"), - require("@tailwindcss/typography"), - require("@tailwindcss/container-queries"), - function ({ addUtilities }) { - const newUtilities = { - // Mobile screens - ".px-page-x": { - paddingLeft: "1.25rem", - paddingRight: "1.25rem", - }, - // Medium screens (768px and up) - "@media (min-width: 768px)": { - ".px-page-x": { - paddingLeft: "1.35rem", - paddingRight: "1.35rem", - }, - }, - // Hide scrollbar but keep functionality - ".scrollbar-hide": { - "-ms-overflow-style": "none" /* IE and Edge */, - "scrollbar-width": "none" /* Firefox */, - "&::-webkit-scrollbar": { - display: "none" /* Chrome, Safari and Opera */, - }, - }, - }; - - addUtilities(newUtilities, ["responsive"]); - }, - ], -}; diff --git a/packages/tailwind-config/typography.css b/packages/tailwind-config/typography.css new file mode 100644 index 0000000000..847732f6b6 --- /dev/null +++ b/packages/tailwind-config/typography.css @@ -0,0 +1,400 @@ +@theme { + /* Font family */ + --font-family-*: initial; + --font-family-heading: Inter; + --font-family-body: Inter; + --font-family-code: IBM Mono; + + /* Font weight */ + --font-weight-*: initial; + --font-weight-light: Light; + --font-weight-regular: 400; + --font-weight-medium: medium; + --font-weight-semi-bold: semi bold; + --font-weight-bold: bold; + --font-weight-heavy: heavy; + + /* Font size */ + --text-*: initial; + --text-9: 0.5625rem; + --text-10: 0.625rem; + --text-11: 0.6875rem; + --text-12: 0.75rem; + --text-13: 0.8125rem; + --text-14: 0.875rem; + --text-16: 1rem; + --text-18: 1.125rem; + --text-20: 1.25rem; + --text-24: 1.5rem; + --text-28: 1.75rem; + --text-32: 2rem; + --text-40: 2.5rem; + + /* Letter spacing */ + --tracking-*: initial; + --tracking-extra-tight: -0.025rem; + --tracking-tight: -0.05rem; + --tracking-default: 0; + --tracking-wide: 0.05rem; +} + +/* Text Styles */ +.font-h1-regular { + font-family: Inter; + font-size: 32px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 400; +} + +.font-h1-medium { + font-family: Inter; + font-size: 32px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 500; +} + +.font-h1-semibold { + font-family: Inter; + font-size: 32px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 600; +} + +.font-h1-bold { + font-family: Inter; + font-size: 32px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 700; +} + +.font-h2-regular { + font-family: Inter; + font-size: 28px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 400; +} + +.font-h2-medium { + font-family: Inter; + font-size: 28px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 500; +} + +.font-h2-semibold { + font-family: Inter; + font-size: 28px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 600; +} + +.font-h2-bold { + font-family: Inter; + font-size: 28px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 700; +} + +.font-h3-regular { + font-family: Inter; + font-size: 24px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 400; +} + +.font-h3-medium { + font-family: Inter; + font-size: 24px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 500; +} + +.font-h3-semibold { + font-family: Inter; + font-size: 24px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 600; +} + +.font-h3-bold { + font-family: Inter; + font-size: 24px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 700; +} + +.font-h4-regular { + font-family: Inter; + font-size: 20px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 400; +} + +.font-h4-medium { + font-family: Inter; + font-size: 20px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 500; +} + +.font-h4-semibold { + font-family: Inter; + font-size: 20px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 600; +} + +.font-h4-bold { + font-family: Inter; + font-size: 20px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 700; +} + +.font-h5-regular { + font-family: Inter; + font-size: 16px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 400; +} + +.font-h5-medium { + font-family: Inter; + font-size: 16px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 500; +} + +.font-h5-semibold { + font-family: Inter; + font-size: 16px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 600; +} + +.font-h5-bold { + font-family: Inter; + font-size: 16px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 700; +} + +.font-h6-regular { + font-family: Inter; + font-size: 14px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 400; +} + +.font-h6-medium { + font-family: Inter; + font-size: 14px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 500; +} + +.font-h6-semibold { + font-family: Inter; + font-size: 14px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 600; +} + +.font-h6-bold { + font-family: Inter; + font-size: 14px; + line-height: 120%; + letter-spacing: 0%; + font-weight: 700; +} + +.font-body-md-light { + font-family: Inter; + font-size: 16px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 300; +} + +.font-body-md-regular { + font-family: Inter; + font-size: 16px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 400; +} + +.font-body-md-medium { + font-family: Inter; + font-size: 16px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 500; +} + +.font-body-md-semibold { + font-family: Inter; + font-size: 16px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 600; +} + +.font-body-sm-light { + font-family: Inter; + font-size: 14px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 300; +} + +.font-body-sm-regular { + font-family: Inter; + font-size: 14px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 400; +} + +.font-body-sm-medium { + font-family: Inter; + font-size: 14px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 500; +} + +.font-body-sm-semibold { + font-family: Inter; + font-size: 14px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 600; +} + +.font-body-xs-light { + font-family: Inter; + font-size: 13px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 300; +} + +.font-body-xs-regular { + font-family: Inter; + font-size: 13px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 400; +} + +.font-body-xs-medium { + font-family: Inter; + font-size: 13px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 500; +} + +.font-body-xs-semibold { + font-family: Inter; + font-size: 13px; + line-height: 140%; + letter-spacing: 1%; + font-weight: 600; +} + +.font-caption-md-regular { + font-family: Inter; + font-size: 12px; + line-height: 110%; + letter-spacing: 0%; + font-weight: 400; +} + +.font-caption-md-medium { + font-family: Inter; + font-size: 12px; + line-height: 110%; + letter-spacing: 0%; + font-weight: 500; +} + +.font-caption-md-semibold { + font-family: Inter; + font-size: 12px; + line-height: 110%; + letter-spacing: 0%; + font-weight: 600; +} + +.font-caption-sm-regular { + font-family: Inter; + font-size: 11px; + line-height: 110%; + letter-spacing: 0%; + font-weight: 400; +} + +.font-caption-sm-medium { + font-family: Inter; + font-size: 11px; + line-height: 110%; + letter-spacing: 0%; + font-weight: 500; +} + +.font-caption-sm-semibold { + font-family: Inter; + font-size: 11px; + line-height: 110%; + letter-spacing: 0%; + font-weight: 600; +} + +.font-caption-xs-regular { + font-family: Inter; + font-size: 10px; + line-height: 100%; + letter-spacing: 1%; + font-weight: 400; +} + +.font-caption-xs-medium { + font-family: Inter; + font-size: 10px; + line-height: 100%; + letter-spacing: 1%; + font-weight: 500; +} + +.font-caption-xs-semibold { + font-family: Inter; + font-size: 10px; + line-height: 100%; + letter-spacing: 1%; + font-weight: 600; +} diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 75212c86ba..726e21eadb 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -226,7 +226,7 @@ importers: version: 0.0.4 '@react-router/dev': specifier: 'catalog:' - version: 7.9.5(@react-router/serve@7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1) + version: 7.9.5(@react-router/serve@7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(lightningcss@1.30.1)(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1) '@types/lodash-es': specifier: 'catalog:' version: 4.17.12 @@ -247,10 +247,10 @@ importers: version: 5.8.3 vite: specifier: 7.1.11 - version: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + version: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) vite-tsconfig-paths: specifier: ^5.1.4 - version: 5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + version: 5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) apps/live: dependencies: @@ -489,7 +489,7 @@ importers: version: 0.0.4 '@react-router/dev': specifier: 'catalog:' - version: 7.9.5(@react-router/serve@7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1) + version: 7.9.5(@react-router/serve@7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(lightningcss@1.30.1)(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1) '@types/lodash-es': specifier: 'catalog:' version: 4.17.12 @@ -510,10 +510,10 @@ importers: version: 5.8.3 vite: specifier: 7.1.11 - version: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + version: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) vite-tsconfig-paths: specifier: ^5.1.4 - version: 5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + version: 5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) apps/web: dependencies: @@ -703,7 +703,10 @@ importers: version: 0.0.4 '@react-router/dev': specifier: 'catalog:' - version: 7.9.5(@react-router/serve@7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1) + version: 7.9.5(@react-router/serve@7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(lightningcss@1.30.1)(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1) + '@tailwindcss/typography': + specifier: 0.5.19 + version: 0.5.19 '@types/lodash-es': specifier: 'catalog:' version: 4.17.12 @@ -730,10 +733,10 @@ importers: version: 5.8.3 vite: specifier: 7.1.11 - version: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + version: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) vite-tsconfig-paths: specifier: ^5.1.4 - version: 5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + version: 5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) packages/codemods: devDependencies: @@ -751,7 +754,7 @@ importers: version: 17.3.0 vitest: specifier: ^4.0.8 - version: 4.0.8(@types/debug@4.1.12)(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + version: 4.0.8(@types/debug@4.1.12)(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) packages/constants: dependencies: @@ -1192,13 +1195,13 @@ importers: version: 0.0.4 '@storybook/addon-designs': specifier: 10.0.2 - version: 10.0.2(@storybook/addon-docs@9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))) + version: 10.0.2(@storybook/addon-docs@9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))) '@storybook/addon-docs': specifier: 9.1.10 - version: 9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))) + version: 9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))) '@storybook/react-vite': specifier: 9.1.10 - version: 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(rollup@4.52.4)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + version: 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(rollup@4.52.4)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) '@types/react': specifier: 'catalog:' version: 18.3.11 @@ -1207,10 +1210,10 @@ importers: version: 18.3.1 eslint-plugin-storybook: specifier: 9.1.10 - version: 9.1.10(eslint@8.57.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3) + version: 9.1.10(eslint@8.57.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3) storybook: specifier: 9.1.10 - version: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + version: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) tsdown: specifier: 'catalog:' version: 0.16.0(typescript@5.8.3) @@ -1297,24 +1300,15 @@ importers: packages/tailwind-config: devDependencies: - '@tailwindcss/container-queries': - specifier: ^0.1.1 - version: 0.1.1(tailwindcss@3.4.17) - '@tailwindcss/typography': - specifier: ^0.5.9 - version: 0.5.16(tailwindcss@3.4.17) - autoprefixer: - specifier: ^10.4.14 - version: 10.4.21(postcss@8.5.6) + '@tailwindcss/postcss': + specifier: 4.1.13 + version: 4.1.13 postcss: - specifier: ^8.4.38 + specifier: 8.5.6 version: 8.5.6 tailwindcss: - specifier: ^3.4.17 - version: 3.4.17 - tailwindcss-animate: - specifier: ^1.0.6 - version: 1.0.7(tailwindcss@3.4.17) + specifier: 4.1.17 + version: 4.1.17 packages/types: dependencies: @@ -2182,6 +2176,10 @@ packages: resolution: {integrity: sha512-O8jcjabXaleOG9DQ0+ARXWZBTfnP4WNAqzuiJK7ll44AmxGKv/J2M4TPjxjY3znBCfvBXFzucm1twdyFybFqEA==} engines: {node: '>=12'} + '@isaacs/fs-minipass@4.0.1': + resolution: {integrity: sha512-wgm9Ehl2jpeqP3zw/7mo3kRHFp5MEDhqAdwy1fTGkHAwnkGOVsgpvQhL8B5n1qlb01jV3n/bI0ZfZp5lWA1k4w==} + engines: {node: '>=18.0.0'} + '@joshwooding/vite-plugin-react-docgen-typescript@0.6.1': resolution: {integrity: sha512-J4BaTocTOYFkMHIra1JDWrMWpNmBl4EkplIwHEsV8aeUOtdWjwSnln9U7twjMFTAEB7mptNtSKyVi1Y2W9sDJw==} peerDependencies: @@ -3656,13 +3654,96 @@ packages: '@swc/types@0.1.24': resolution: {integrity: sha512-tjTMh3V4vAORHtdTprLlfoMptu1WfTZG9Rsca6yOKyNYsRr+MUXutKmliB17orgSZk5DpnDxs8GUdd/qwYxOng==} - '@tailwindcss/container-queries@0.1.1': - resolution: {integrity: sha512-p18dswChx6WnTSaJCSGx6lTmrGzNNvm2FtXmiO6AuA1V4U5REyoqwmT6kgAsIMdjo07QdAfYXHJ4hnMtfHzWgA==} - peerDependencies: - tailwindcss: '>=3.2.0' + '@tailwindcss/node@4.1.13': + resolution: {integrity: sha512-eq3ouolC1oEFOAvOMOBAmfCIqZBJuvWvvYWh5h5iOYfe1HFC6+GZ6EIL0JdM3/niGRJmnrOc+8gl9/HGUaaptw==} - '@tailwindcss/typography@0.5.16': - resolution: {integrity: sha512-0wDLwCVF5V3x3b1SGXPCDcdsbDHMBe+lkFzBRaHeLvNi+nrrnZ1lA18u+OTWO8iSWU2GxUOCvlXtDuqftc1oiA==} + '@tailwindcss/oxide-android-arm64@4.1.13': + resolution: {integrity: sha512-BrpTrVYyejbgGo57yc8ieE+D6VT9GOgnNdmh5Sac6+t0m+v+sKQevpFVpwX3pBrM2qKrQwJ0c5eDbtjouY/+ew==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [android] + + '@tailwindcss/oxide-darwin-arm64@4.1.13': + resolution: {integrity: sha512-YP+Jksc4U0KHcu76UhRDHq9bx4qtBftp9ShK/7UGfq0wpaP96YVnnjFnj3ZFrUAjc5iECzODl/Ts0AN7ZPOANQ==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [darwin] + + '@tailwindcss/oxide-darwin-x64@4.1.13': + resolution: {integrity: sha512-aAJ3bbwrn/PQHDxCto9sxwQfT30PzyYJFG0u/BWZGeVXi5Hx6uuUOQEI2Fa43qvmUjTRQNZnGqe9t0Zntexeuw==} + engines: {node: '>= 10'} + cpu: [x64] + os: [darwin] + + '@tailwindcss/oxide-freebsd-x64@4.1.13': + resolution: {integrity: sha512-Wt8KvASHwSXhKE/dJLCCWcTSVmBj3xhVhp/aF3RpAhGeZ3sVo7+NTfgiN8Vey/Fi8prRClDs6/f0KXPDTZE6nQ==} + engines: {node: '>= 10'} + cpu: [x64] + os: [freebsd] + + '@tailwindcss/oxide-linux-arm-gnueabihf@4.1.13': + resolution: {integrity: sha512-mbVbcAsW3Gkm2MGwA93eLtWrwajz91aXZCNSkGTx/R5eb6KpKD5q8Ueckkh9YNboU8RH7jiv+ol/I7ZyQ9H7Bw==} + engines: {node: '>= 10'} + cpu: [arm] + os: [linux] + + '@tailwindcss/oxide-linux-arm64-gnu@4.1.13': + resolution: {integrity: sha512-wdtfkmpXiwej/yoAkrCP2DNzRXCALq9NVLgLELgLim1QpSfhQM5+ZxQQF8fkOiEpuNoKLp4nKZ6RC4kmeFH0HQ==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [linux] + + '@tailwindcss/oxide-linux-arm64-musl@4.1.13': + resolution: {integrity: sha512-hZQrmtLdhyqzXHB7mkXfq0IYbxegaqTmfa1p9MBj72WPoDD3oNOh1Lnxf6xZLY9C3OV6qiCYkO1i/LrzEdW2mg==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [linux] + + '@tailwindcss/oxide-linux-x64-gnu@4.1.13': + resolution: {integrity: sha512-uaZTYWxSXyMWDJZNY1Ul7XkJTCBRFZ5Fo6wtjrgBKzZLoJNrG+WderJwAjPzuNZOnmdrVg260DKwXCFtJ/hWRQ==} + engines: {node: '>= 10'} + cpu: [x64] + os: [linux] + + '@tailwindcss/oxide-linux-x64-musl@4.1.13': + resolution: {integrity: sha512-oXiPj5mi4Hdn50v5RdnuuIms0PVPI/EG4fxAfFiIKQh5TgQgX7oSuDWntHW7WNIi/yVLAiS+CRGW4RkoGSSgVQ==} + engines: {node: '>= 10'} + cpu: [x64] + os: [linux] + + '@tailwindcss/oxide-wasm32-wasi@4.1.13': + resolution: {integrity: sha512-+LC2nNtPovtrDwBc/nqnIKYh/W2+R69FA0hgoeOn64BdCX522u19ryLh3Vf3F8W49XBcMIxSe665kwy21FkhvA==} + engines: {node: '>=14.0.0'} + cpu: [wasm32] + bundledDependencies: + - '@napi-rs/wasm-runtime' + - '@emnapi/core' + - '@emnapi/runtime' + - '@tybys/wasm-util' + - '@emnapi/wasi-threads' + - tslib + + '@tailwindcss/oxide-win32-arm64-msvc@4.1.13': + resolution: {integrity: sha512-dziTNeQXtoQ2KBXmrjCxsuPk3F3CQ/yb7ZNZNA+UkNTeiTGgfeh+gH5Pi7mRncVgcPD2xgHvkFCh/MhZWSgyQg==} + engines: {node: '>= 10'} + cpu: [arm64] + os: [win32] + + '@tailwindcss/oxide-win32-x64-msvc@4.1.13': + resolution: {integrity: sha512-3+LKesjXydTkHk5zXX01b5KMzLV1xl2mcktBJkje7rhFUpUlYJy7IMOLqjIRQncLTa1WZZiFY/foAeB5nmaiTw==} + engines: {node: '>= 10'} + cpu: [x64] + os: [win32] + + '@tailwindcss/oxide@4.1.13': + resolution: {integrity: sha512-CPgsM1IpGRa880sMbYmG1s4xhAy3xEt1QULgTJGQmZUeNgXFR7s1YxYygmJyBGtou4SyEosGAGEeYqY7R53bIA==} + engines: {node: '>= 10'} + + '@tailwindcss/postcss@4.1.13': + resolution: {integrity: sha512-HLgx6YSFKJT7rJqh9oJs/TkBFhxuMOfUKSBEPYwV+t78POOBsdQ7crhZLzwcH3T0UyUuOzU/GK5pk5eKr3wCiQ==} + + '@tailwindcss/typography@0.5.19': + resolution: {integrity: sha512-w31dd8HOx3k9vPtcQh5QHP9GwKcgbMp87j58qi6xgiBnFFtKEAgCWnDw4qUT8aHwkCp8bKvb/KGKWWHedP0AAg==} peerDependencies: tailwindcss: '>=3.0.0 || insiders || >=4.0.0-alpha.20 || >=4.0.0-beta.1' @@ -4527,9 +4608,6 @@ packages: resolution: {integrity: sha512-HqZ5rWlFjGiV0tDm3UxxgNRqsOTniqoKZu0pIAfh7TZQMGuZK+hH0drySty0si0QXj1ieop4+SkSfPZBPPkHig==} engines: {node: '>=14'} - any-promise@1.3.0: - resolution: {integrity: sha512-7UvmKalWRt1wgjL1RrGxoSJW/0QZFIegpeGvZG9kjp8vrRu55XTHbwnqq2GpXm9uLbcuhxm3IqX9OB4MZR1b2A==} - anymatch@3.1.3: resolution: {integrity: sha512-KMReFUr0B4t+D+OBkjR3KYqvocp2XaSzO55UcB6mgQMd3KbcE+mWTyvVV7D/zsdEbNnV6acZUutkiHQXvTr1Rw==} engines: {node: '>= 8'} @@ -4771,10 +4849,6 @@ packages: camel-case@4.1.2: resolution: {integrity: sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==} - camelcase-css@2.0.1: - resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==} - engines: {node: '>= 6'} - camelcase@7.0.1: resolution: {integrity: sha512-xlx1yCK2Oc1APsPXDL2LdlNP6+uu8OCDdhOBSVT279M/S+y75O30C2VuD8T2ogdePBBl7PfPF4504tnLgX3zfw==} engines: {node: '>=14.16'} @@ -4840,6 +4914,10 @@ packages: resolution: {integrity: sha512-7VT13fmjotKpGipCW9JEQAusEPE+Ei8nl6/g4FBAmIm0GOOLMua9NDDo/DWp0ZAxCr3cPq5ZpBqmPAQgDda2Pw==} engines: {node: '>= 8.10.0'} + chownr@3.0.0: + resolution: {integrity: sha512-+IxzY9BZOQd/XuYPRmrvEVjF/nqj5kgT4kEq7VofrDoM1MxoRjEWkrCC3EtLi59TVawxTAn+orJwFQcrqEN1+g==} + engines: {node: '>=18'} + chromatic@11.29.0: resolution: {integrity: sha512-yisBlntp9hHVj19lIQdpTlcYIXuU9H/DbFuu6tyWHmj6hWT2EtukCCcxYXL78XdQt1vm2GfIrtgtKpj/Rzmo4A==} hasBin: true @@ -4948,10 +5026,6 @@ packages: commander@2.20.3: resolution: {integrity: sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==} - commander@4.1.1: - resolution: {integrity: sha512-NOKm8xhkzAjzFx8B2v5OAHT+u5pRQc2UCa2Vq9jYL/31o2wi9mxBA7LIFs3sV5VSC49z6pEhfbMULvShKj26WA==} - engines: {node: '>= 6'} - commander@8.3.0: resolution: {integrity: sha512-OkTL9umf+He2DZkUq8f8J9of7yL6RJKI24dVITBmNfZBmri9zYZQrKkuXiKhyfPSu8tUhnVBB1iKXevvnlR4Ww==} engines: {node: '>= 12'} @@ -5254,9 +5328,6 @@ packages: dfa@1.2.0: resolution: {integrity: sha512-ED3jP8saaweFTjeGX8HQPjeC1YYyZs98jGNZx6IiBvxW7JG5v492kamAQB3m2wop07CvU/RQmzcKr6bgcC5D/Q==} - didyoumean@1.2.2: - resolution: {integrity: sha512-gxtyfqMg7GKyhQmb056K7M3xszy/myH8w+B4RT+QXBQsvAOdc3XymqDDPHx1BgPgsdAA5SIifona89YtRATDzw==} - diff@5.2.0: resolution: {integrity: sha512-uIFDxqpRZGZ6ThOk84hEfqWoHx2devRFvpTZcTHur85vImfaxUbTW9Ryh4CpCuDnToOP1CEtXKIgytHBPVff5A==} engines: {node: '>=0.3.1'} @@ -5265,9 +5336,6 @@ packages: resolution: {integrity: sha512-sSuxWU5j5SR9QQji/o2qMvqRNYRDOcBTgsJ/DeCf4iSN4gW+gNMXM7wFIP+fdXZxoNiAnHUTGjCr+TSWXdRDKg==} engines: {node: '>=0.3.1'} - dlv@1.1.3: - resolution: {integrity: sha512-+HlytyjlPKnIG8XuRG8WvmBP8xs8P71y+SKKS6ZXWoEgLuePxtDoUEiH7WkdePWrQ5JBpE6aoVqfZfJUQkjXwA==} - doctrine@2.1.0: resolution: {integrity: sha512-35mSku4ZXK0vfCuHEDAwt55dg2jNajHZ1odvF+8SSr82EsZY4QmXfuWso8oEd8zRhVObSN18aM0CjSdoBX7zIw==} engines: {node: '>=0.10.0'} @@ -6409,10 +6477,6 @@ packages: resolution: {integrity: sha512-7vuh85V5cdDofPyxn58nrPjBktZo0u9x1g8WtjQol+jZDaE+fhN+cIvTj11GndBnMnyfrUOG1sZQxCdjKh+DKg==} engines: {node: '>= 10.13.0'} - jiti@1.21.7: - resolution: {integrity: sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==} - hasBin: true - jiti@2.5.1: resolution: {integrity: sha512-twQoecYPiVA5K/h6SxtORw/Bs3ar+mLUtoPSc7iMXzQzK8d7eJ/R09wmTwAjiamETn1cXYPGfNnu7DMoHgu12w==} hasBin: true @@ -6516,6 +6580,70 @@ packages: engines: {node: '>=16'} hasBin: true + lightningcss-darwin-arm64@1.30.1: + resolution: {integrity: sha512-c8JK7hyE65X1MHMN+Viq9n11RRC7hgin3HhYKhrMyaXflk5GVplZ60IxyoVtzILeKr+xAJwg6zK6sjTBJ0FKYQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [darwin] + + lightningcss-darwin-x64@1.30.1: + resolution: {integrity: sha512-k1EvjakfumAQoTfcXUcHQZhSpLlkAuEkdMBsI/ivWw9hL+7FtilQc0Cy3hrx0AAQrVtQAbMI7YjCgYgvn37PzA==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [darwin] + + lightningcss-freebsd-x64@1.30.1: + resolution: {integrity: sha512-kmW6UGCGg2PcyUE59K5r0kWfKPAVy4SltVeut+umLCFoJ53RdCUWxcRDzO1eTaxf/7Q2H7LTquFHPL5R+Gjyig==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [freebsd] + + lightningcss-linux-arm-gnueabihf@1.30.1: + resolution: {integrity: sha512-MjxUShl1v8pit+6D/zSPq9S9dQ2NPFSQwGvxBCYaBYLPlCWuPh9/t1MRS8iUaR8i+a6w7aps+B4N0S1TYP/R+Q==} + engines: {node: '>= 12.0.0'} + cpu: [arm] + os: [linux] + + lightningcss-linux-arm64-gnu@1.30.1: + resolution: {integrity: sha512-gB72maP8rmrKsnKYy8XUuXi/4OctJiuQjcuqWNlJQ6jZiWqtPvqFziskH3hnajfvKB27ynbVCucKSm2rkQp4Bw==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + + lightningcss-linux-arm64-musl@1.30.1: + resolution: {integrity: sha512-jmUQVx4331m6LIX+0wUhBbmMX7TCfjF5FoOH6SD1CttzuYlGNVpA7QnrmLxrsub43ClTINfGSYyHe2HWeLl5CQ==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [linux] + + lightningcss-linux-x64-gnu@1.30.1: + resolution: {integrity: sha512-piWx3z4wN8J8z3+O5kO74+yr6ze/dKmPnI7vLqfSqI8bccaTGY5xiSGVIJBDd5K5BHlvVLpUB3S2YCfelyJ1bw==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + + lightningcss-linux-x64-musl@1.30.1: + resolution: {integrity: sha512-rRomAK7eIkL+tHY0YPxbc5Dra2gXlI63HL+v1Pdi1a3sC+tJTcFrHX+E86sulgAXeI7rSzDYhPSeHHjqFhqfeQ==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [linux] + + lightningcss-win32-arm64-msvc@1.30.1: + resolution: {integrity: sha512-mSL4rqPi4iXq5YVqzSsJgMVFENoa4nGTT/GjO2c0Yl9OuQfPsIfncvLrEW6RbbB24WtZ3xP/2CCmI3tNkNV4oA==} + engines: {node: '>= 12.0.0'} + cpu: [arm64] + os: [win32] + + lightningcss-win32-x64-msvc@1.30.1: + resolution: {integrity: sha512-PVqXh48wh4T53F/1CCu8PIPCxLzWyCnn/9T5W1Jpmdy5h9Cwd+0YQS6/LwhHXSafuc61/xg9Lv5OrCby6a++jg==} + engines: {node: '>= 12.0.0'} + cpu: [x64] + os: [win32] + + lightningcss@1.30.1: + resolution: {integrity: sha512-xi6IyHML+c9+Q3W0S4fCQJOym42pyurFiJUHEcEyHS0CeKzia4yZDEsLlqOFykxOdHpNy0NmvVO31vcSqAxJCg==} + engines: {node: '>= 12.0.0'} + lilconfig@3.1.3: resolution: {integrity: sha512-/vlFKAoH5Cgt3Ie+JLhRbwOsCQePABiU3tJ1egGvyQ+33R/vcwM2Zl2QR/LzjsBeItPt3oSVXapn+m4nQDvpzw==} engines: {node: '>=14'} @@ -6564,9 +6692,6 @@ packages: lodash-es@4.17.21: resolution: {integrity: sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==} - lodash.castarray@4.4.0: - resolution: {integrity: sha512-aVx8ztPv7/2ULbArGJ2Y42bG1mEQ5mGjpdvrbJcJFU3TbYybe+QlLS4pst9zV52ymy2in1KpFPiZnAOATxD4+Q==} - lodash.debounce@4.0.8: resolution: {integrity: sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==} @@ -6579,9 +6704,6 @@ packages: lodash.isarguments@3.1.0: resolution: {integrity: sha512-chi4NHZlZqZD18a0imDHnZPrDeBbTtVN7GXMwuGdRH9qotxAjYs3aVLKc7zNOG9eddR5Ksd8rvFEBc9SsggPpg==} - lodash.isplainobject@4.0.6: - resolution: {integrity: sha512-oSXzaWypCMHkPC3NvBEaPHf0KsA5mvPrOPgQWDsbg8n7orZ290M0BmC/jgRZ4vcJ6DTAhjrsSYgdsW/F+MFOBA==} - lodash.merge@4.6.2: resolution: {integrity: sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==} @@ -6954,6 +7076,10 @@ packages: resolution: {integrity: sha512-qOOzS1cBTWYF4BH8fVePDBOO9iptMnGUEZwNc/cMWnTV2nVLZ7VoNWEPHkYczZA0pdoA7dl6e7FL659nX9S2aw==} engines: {node: '>=16 || 14 >=14.17'} + minizlib@3.1.0: + resolution: {integrity: sha512-KZxYo1BUkWD2TVFLr0MQoM8vUUigWD3LlD83a/75BqC+4qE0Hb1Vo5v1FgcfaNXvfXzr+5EhQ6ing/CaBijTlw==} + engines: {node: '>= 18'} + mobx-react-lite@4.1.0: resolution: {integrity: sha512-QEP10dpHHBeQNv1pks3WnHRCem2Zp636lq54M2nKO2Sarr13pL4u6diQXf65yzXUn0mkk18SyIDCm9UOJYTi1w==} peerDependencies: @@ -7011,9 +7137,6 @@ packages: ms@2.1.3: resolution: {integrity: sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==} - mz@2.7.0: - resolution: {integrity: sha512-z81GNO7nnYMEhrGh9LeymoE4+Yr0Wn5McHIZMK5cfQCl+NDX08sCZgUc9/6MHni9IWuFLm1Z3HTCXu2z9fN62Q==} - nanoid@3.3.8: resolution: {integrity: sha512-WNLf5Sd8oZxOm+TzppcYk8gVOgP+l58xNy58D0nbUnOxOWRWvlcCV4kUF7ltmI6PsrLl/BgKEyS4mqsGChFN0w==} engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1} @@ -7133,10 +7256,6 @@ packages: resolution: {integrity: sha512-rJgTQnkUnH1sFw8yT6VSU3zD3sWmu6sZhIseY8VX+GRu3P6F7Fu+JNDoXfklElbLJSnc3FUQHVe4cU5hj+BcUg==} engines: {node: '>=0.10.0'} - object-hash@3.0.0: - resolution: {integrity: sha512-RSn9F68PjH9HqtltsSnqYC1XXoWe9Bju5+213R98cNGttag9q9yAOTzdbsqvIa7aNm5WffBZFpWYr2aWrklWAw==} - engines: {node: '>= 6'} - object-inspect@1.13.4: resolution: {integrity: sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==} engines: {node: '>= 0.4'} @@ -7406,30 +7525,6 @@ packages: peerDependencies: postcss: ^8.0.0 - postcss-import@15.1.0: - resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==} - engines: {node: '>=14.0.0'} - peerDependencies: - postcss: ^8.0.0 - - postcss-js@4.0.1: - resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==} - engines: {node: ^12 || ^14 || >= 16} - peerDependencies: - postcss: ^8.4.21 - - postcss-load-config@4.0.2: - resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==} - engines: {node: '>= 14'} - peerDependencies: - postcss: '>=8.0.9' - ts-node: '>=9.0.0' - peerDependenciesMeta: - postcss: - optional: true - ts-node: - optional: true - postcss-load-config@5.1.0: resolution: {integrity: sha512-G5AJ+IX0aD0dygOE0yFZQ/huFFMSNneyfp0e3/bT05a8OfPC5FUoZRPfGijUdGOJNMewJiwzcHJXFafFzeKFVA==} engines: {node: '>= 18'} @@ -8362,11 +8457,6 @@ packages: babel-plugin-macros: optional: true - sucrase@3.35.0: - resolution: {integrity: sha512-8EbVDiu9iN/nESwxeSxDKe0dunta1GOlHufmSSXxMD2z2/tMZpDMpvXQGsc+ajGo8y2uYUmixaSRUc/QPoQ0GA==} - engines: {node: '>=16 || 14 >=14.17'} - hasBin: true - supports-color@5.5.0: resolution: {integrity: sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==} engines: {node: '>=4'} @@ -8406,20 +8496,20 @@ packages: tailwind-merge@3.3.1: resolution: {integrity: sha512-gBXpgUm/3rp1lMZZrM/w7D8GKqshif0zAymAhbCyIt8KMe+0v9DQ7cdYLR4FHH/cKpdTXb+A/tKKU3eolfsI+g==} - tailwindcss-animate@1.0.7: - resolution: {integrity: sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==} - peerDependencies: - tailwindcss: '>=3.0.0 || insiders' + tailwindcss@4.1.13: + resolution: {integrity: sha512-i+zidfmTqtwquj4hMEwdjshYYgMbOrPzb9a0M3ZgNa0JMoZeFC6bxZvO8yr8ozS6ix2SDz0+mvryPeBs2TFE+w==} - tailwindcss@3.4.17: - resolution: {integrity: sha512-w33E2aCvSDP0tW9RZuNXadXlkHXqFzSkQew/aIa2i/Sj8fThxwovwlXHSPXTbAHwEIhBFXAedUhP2tueAKP8Og==} - engines: {node: '>=14.0.0'} - hasBin: true + tailwindcss@4.1.17: + resolution: {integrity: sha512-j9Ee2YjuQqYT9bbRTfTZht9W/ytp5H+jJpZKiYdP/bpnXARAuELt9ofP0lPnmHjbga7SNQIxdTAXCmtKVYjN+Q==} tapable@2.3.0: resolution: {integrity: sha512-g9ljZiwki/LfxmQADO3dEY1CbpmXT5Hm2fJ+QaGKwSXUylMybePR7/67YW7jOrrvjEgL1Fmz5kzyAjWVWLlucg==} engines: {node: '>=6'} + tar@7.5.1: + resolution: {integrity: sha512-nlGpxf+hv0v7GkWBK2V9spgactGOp0qvfWRxUMjqHyzrt3SgwE48DIv/FhqPHJYLHpgW1opq3nERbz5Anq7n1g==} + engines: {node: '>=18'} + terser-webpack-plugin@5.3.14: resolution: {integrity: sha512-vkZjpUjb6OMS7dhV+tILUW6BhpDR7P2L/aQSAv+Uwk+m8KATX9EccViHTJR2qDtACKPIYndLGCyl3FMo+r2LMw==} engines: {node: '>= 10.13.0'} @@ -8450,13 +8540,6 @@ packages: thenby@1.3.4: resolution: {integrity: sha512-89Gi5raiWA3QZ4b2ePcEwswC3me9JIg+ToSgtE0JWeCynLnLxNr/f9G+xfo9K+Oj4AFdom8YNJjibIARTJmapQ==} - thenify-all@1.6.0: - resolution: {integrity: sha512-RNxQH/qI8/t3thXJDwcstUO4zeqo64+Uy/+sNVRBx4Xn2OX+OZ9oP+iJnNFqplFra2ZUVeKCSa2oVWi3T4uVmA==} - engines: {node: '>=0.8'} - - thenify@3.3.1: - resolution: {integrity: sha512-RVZSIV5IG10Hk3enotrhvz0T9em6cyHBLkH/YAZuKqd8hRkKhSfCGIcP2KUY0EPxndzANBmNllzWPwak+bheSw==} - tiny-inflate@1.0.3: resolution: {integrity: sha512-pkY1fj1cKHb2seWDy0B16HeWyczlJA9/WW3u3c4z/NiWDsO3DOU5D7nhTLE9CF0yXv/QZFY7sEJmj24dK+Rrqw==} @@ -8553,9 +8636,6 @@ packages: resolution: {integrity: sha512-q5W7tVM71e2xjHZTlgfTDoPF/SmqKG5hddq9SzR49CH2hayqRKJtQ4mtRlSxKaJlR/+9rEM+mnBHf7I2/BQcpQ==} engines: {node: '>=6.10'} - ts-interface-checker@0.1.13: - resolution: {integrity: sha512-Y/arvbn+rrz3JCKl9C4kVNfTfSm2/mEp5FSz5EsZSANGPSlQrpRI5M4PKF+mJnE52jOO90PnPSc3Ur3bTQw0gA==} - tsconfck@3.1.6: resolution: {integrity: sha512-ks6Vjr/jEw0P1gmOVwutM3B7fWxoWBL2KRDb1JfqGVawBmO5UsvmWOQFGHBPl5yxYz4eERr19E6L7NMv+Fej4w==} engines: {node: ^18 || >=20} @@ -9156,6 +9236,10 @@ packages: yallist@3.1.1: resolution: {integrity: sha512-a4UGQaWPH59mOXUYnAG2ewncQS4i4F43Tv3JoAM+s2VDAmS9NsK8GpDMLrCHPksFT7h3K6TOoUNn2pb7RoXx4g==} + yallist@5.0.0: + resolution: {integrity: sha512-YgvUTfwqyc7UXVMrB+SImsVYSmTS8X/tSrtdNZMImM+n7+QTriRXyXim0mBrTXNeqzVF0KWGgHPeiyViFFrNDw==} + engines: {node: '>=18'} + yaml@1.10.2: resolution: {integrity: sha512-r3vXyErRCYJ7wg28yvBY5VSoAF8ZvlcW9/BwUzEtUsjvX/DKs24dIkuwjtuprwJJHsbyUbLApepYTR1BN4uHrg==} engines: {node: '>= 6'} @@ -9893,12 +9977,16 @@ snapshots: wrap-ansi: 8.1.0 wrap-ansi-cjs: wrap-ansi@7.0.0 - '@joshwooding/vite-plugin-react-docgen-typescript@0.6.1(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))': + '@isaacs/fs-minipass@4.0.1': + dependencies: + minipass: 7.1.2 + + '@joshwooding/vite-plugin-react-docgen-typescript@0.6.1(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))': dependencies: glob: 11.1.0 magic-string: 0.30.21 react-docgen-typescript: 2.4.0(typescript@5.8.3) - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) optionalDependencies: typescript: 5.8.3 @@ -10664,7 +10752,7 @@ snapshots: '@react-pdf/primitives': 4.1.1 '@react-pdf/stylesheet': 6.1.0 - '@react-router/dev@7.9.5(@react-router/serve@7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1)': + '@react-router/dev@7.9.5(@react-router/serve@7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3))(@types/node@22.12.0)(babel-plugin-macros@3.1.0)(jiti@2.5.1)(lightningcss@1.30.1)(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(terser@5.43.1)(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))(yaml@2.8.1)': dependencies: '@babel/core': 7.28.4 '@babel/generator': 7.28.5 @@ -10694,8 +10782,8 @@ snapshots: semver: 7.7.3 tinyglobby: 0.2.15 valibot: 1.2.0(typescript@5.8.3) - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) - vite-node: 3.2.4(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) + vite-node: 3.2.4(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) optionalDependencies: '@react-router/serve': 7.9.5(react-router@7.9.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(typescript@5.8.3) typescript: 5.8.3 @@ -11099,12 +11187,12 @@ snapshots: storybook: 8.6.14(prettier@3.6.2) ts-dedent: 2.2.0 - '@storybook/addon-designs@10.0.2(@storybook/addon-docs@9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))': + '@storybook/addon-designs@10.0.2(@storybook/addon-docs@9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))))(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))': dependencies: '@figspec/react': 1.0.4(react@18.3.1) - storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) optionalDependencies: - '@storybook/addon-docs': 9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))) + '@storybook/addon-docs': 9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))) react: 18.3.1 react-dom: 18.3.1(react@18.3.1) @@ -11121,15 +11209,15 @@ snapshots: transitivePeerDependencies: - '@types/react' - '@storybook/addon-docs@9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))': + '@storybook/addon-docs@9.1.10(@types/react@18.3.11)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))': dependencies: '@mdx-js/react': 3.1.0(@types/react@18.3.11)(react@18.3.1) - '@storybook/csf-plugin': 9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))) + '@storybook/csf-plugin': 9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))) '@storybook/icons': 1.4.0(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - '@storybook/react-dom-shim': 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))) + '@storybook/react-dom-shim': 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))) react: 18.3.1 react-dom: 18.3.1(react@18.3.1) - storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) ts-dedent: 2.2.0 transitivePeerDependencies: - '@types/react' @@ -11221,12 +11309,12 @@ snapshots: react: 18.3.1 react-dom: 18.3.1(react@18.3.1) - '@storybook/builder-vite@9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))': + '@storybook/builder-vite@9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))': dependencies: - '@storybook/csf-plugin': 9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))) - storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + '@storybook/csf-plugin': 9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))) + storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) ts-dedent: 2.2.0 - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) '@storybook/builder-webpack5@8.6.14(@swc/core@1.13.5(@swc/helpers@0.5.17))(esbuild@0.25.0)(storybook@8.6.14(prettier@3.6.2))(typescript@5.8.3)': dependencies: @@ -11299,9 +11387,9 @@ snapshots: storybook: 8.6.14(prettier@3.6.2) unplugin: 1.16.1 - '@storybook/csf-plugin@9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))': + '@storybook/csf-plugin@9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))': dependencies: - storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) unplugin: 1.16.1 '@storybook/global@5.0.0': {} @@ -11375,27 +11463,27 @@ snapshots: react-dom: 18.3.1(react@18.3.1) storybook: 8.6.14(prettier@3.6.2) - '@storybook/react-dom-shim@9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))': + '@storybook/react-dom-shim@9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))': dependencies: react: 18.3.1 react-dom: 18.3.1(react@18.3.1) - storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) - '@storybook/react-vite@9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(rollup@4.52.4)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))': + '@storybook/react-vite@9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(rollup@4.52.4)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))': dependencies: - '@joshwooding/vite-plugin-react-docgen-typescript': 0.6.1(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + '@joshwooding/vite-plugin-react-docgen-typescript': 0.6.1(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) '@rollup/pluginutils': 5.2.0(rollup@4.52.4) - '@storybook/builder-vite': 9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) - '@storybook/react': 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3) + '@storybook/builder-vite': 9.1.10(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) + '@storybook/react': 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3) find-up: 7.0.0 magic-string: 0.30.21 react: 18.3.1 react-docgen: 8.0.1 react-dom: 18.3.1(react@18.3.1) resolve: 1.22.10 - storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) tsconfig-paths: 4.2.0 - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) transitivePeerDependencies: - rollup - supports-color @@ -11435,13 +11523,13 @@ snapshots: '@storybook/test': 8.6.14(storybook@8.6.14(prettier@3.6.2)) typescript: 5.8.3 - '@storybook/react@9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3)': + '@storybook/react@9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3)': dependencies: '@storybook/global': 5.0.0 - '@storybook/react-dom-shim': 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))) + '@storybook/react-dom-shim': 9.1.10(react-dom@18.3.1(react@18.3.1))(react@18.3.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))) react: 18.3.1 react-dom: 18.3.1(react@18.3.1) - storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) optionalDependencies: typescript: 5.8.3 @@ -11522,17 +11610,81 @@ snapshots: dependencies: '@swc/counter': 0.1.3 - '@tailwindcss/container-queries@0.1.1(tailwindcss@3.4.17)': + '@tailwindcss/node@4.1.13': dependencies: - tailwindcss: 3.4.17 + '@jridgewell/remapping': 2.3.5 + enhanced-resolve: 5.18.3 + jiti: 2.5.1 + lightningcss: 1.30.1 + magic-string: 0.30.21 + source-map-js: 1.2.1 + tailwindcss: 4.1.13 - '@tailwindcss/typography@0.5.16(tailwindcss@3.4.17)': + '@tailwindcss/oxide-android-arm64@4.1.13': + optional: true + + '@tailwindcss/oxide-darwin-arm64@4.1.13': + optional: true + + '@tailwindcss/oxide-darwin-x64@4.1.13': + optional: true + + '@tailwindcss/oxide-freebsd-x64@4.1.13': + optional: true + + '@tailwindcss/oxide-linux-arm-gnueabihf@4.1.13': + optional: true + + '@tailwindcss/oxide-linux-arm64-gnu@4.1.13': + optional: true + + '@tailwindcss/oxide-linux-arm64-musl@4.1.13': + optional: true + + '@tailwindcss/oxide-linux-x64-gnu@4.1.13': + optional: true + + '@tailwindcss/oxide-linux-x64-musl@4.1.13': + optional: true + + '@tailwindcss/oxide-wasm32-wasi@4.1.13': + optional: true + + '@tailwindcss/oxide-win32-arm64-msvc@4.1.13': + optional: true + + '@tailwindcss/oxide-win32-x64-msvc@4.1.13': + optional: true + + '@tailwindcss/oxide@4.1.13': + dependencies: + detect-libc: 2.1.0 + tar: 7.5.1 + optionalDependencies: + '@tailwindcss/oxide-android-arm64': 4.1.13 + '@tailwindcss/oxide-darwin-arm64': 4.1.13 + '@tailwindcss/oxide-darwin-x64': 4.1.13 + '@tailwindcss/oxide-freebsd-x64': 4.1.13 + '@tailwindcss/oxide-linux-arm-gnueabihf': 4.1.13 + '@tailwindcss/oxide-linux-arm64-gnu': 4.1.13 + '@tailwindcss/oxide-linux-arm64-musl': 4.1.13 + '@tailwindcss/oxide-linux-x64-gnu': 4.1.13 + '@tailwindcss/oxide-linux-x64-musl': 4.1.13 + '@tailwindcss/oxide-wasm32-wasi': 4.1.13 + '@tailwindcss/oxide-win32-arm64-msvc': 4.1.13 + '@tailwindcss/oxide-win32-x64-msvc': 4.1.13 + + '@tailwindcss/postcss@4.1.13': + dependencies: + '@alloc/quick-lru': 5.2.0 + '@tailwindcss/node': 4.1.13 + '@tailwindcss/oxide': 4.1.13 + postcss: 8.5.6 + tailwindcss: 4.1.13 + + '@tailwindcss/typography@0.5.19': dependencies: - lodash.castarray: 4.4.0 - lodash.isplainobject: 4.0.6 - lodash.merge: 4.6.2 postcss-selector-parser: 6.0.10 - tailwindcss: 3.4.17 '@tanstack/react-table@8.21.3(react-dom@18.3.1(react@18.3.1))(react@18.3.1)': dependencies: @@ -12287,21 +12439,21 @@ snapshots: chai: 6.2.0 tinyrainbow: 3.0.3 - '@vitest/mocker@3.2.4(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))': + '@vitest/mocker@3.2.4(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))': dependencies: '@vitest/spy': 3.2.4 estree-walker: 3.0.3 magic-string: 0.30.21 optionalDependencies: - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) - '@vitest/mocker@4.0.8(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1))': + '@vitest/mocker@4.0.8(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1))': dependencies: '@vitest/spy': 4.0.8 estree-walker: 3.0.3 magic-string: 0.30.21 optionalDependencies: - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) '@vitest/pretty-format@2.0.5': dependencies: @@ -12531,8 +12683,6 @@ snapshots: ansis@4.2.0: {} - any-promise@1.3.0: {} - anymatch@3.1.3: dependencies: normalize-path: 3.0.0 @@ -12821,8 +12971,6 @@ snapshots: pascal-case: 3.1.2 tslib: 2.8.1 - camelcase-css@2.0.1: {} - camelcase@7.0.1: {} caniuse-lite@1.0.30001743: {} @@ -12904,6 +13052,8 @@ snapshots: optionalDependencies: fsevents: 2.3.3 + chownr@3.0.0: {} + chromatic@11.29.0: {} chrome-trace-event@1.0.4: {} @@ -13001,8 +13151,6 @@ snapshots: commander@2.20.3: {} - commander@4.1.1: {} - commander@8.3.0: {} commondir@1.0.1: {} @@ -13274,14 +13422,10 @@ snapshots: dfa@1.2.0: {} - didyoumean@1.2.2: {} - diff@5.2.0: {} diff@8.0.2: {} - dlv@1.1.3: {} - doctrine@2.1.0: dependencies: esutils: 2.0.3 @@ -13725,11 +13869,11 @@ snapshots: string.prototype.matchall: 4.0.12 string.prototype.repeat: 1.0.0 - eslint-plugin-storybook@9.1.10(eslint@8.57.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3): + eslint-plugin-storybook@9.1.10(eslint@8.57.1)(storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)))(typescript@5.8.3): dependencies: '@typescript-eslint/utils': 8.45.0(eslint@8.57.1)(typescript@5.8.3) eslint: 8.57.1 - storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + storybook: 9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) transitivePeerDependencies: - supports-color - typescript @@ -14687,8 +14831,6 @@ snapshots: merge-stream: 2.0.0 supports-color: 8.1.1 - jiti@1.21.7: {} - jiti@2.5.1: {} js-tokens@4.0.0: {} @@ -14786,6 +14928,51 @@ snapshots: dependencies: isomorphic.js: 0.2.5 + lightningcss-darwin-arm64@1.30.1: + optional: true + + lightningcss-darwin-x64@1.30.1: + optional: true + + lightningcss-freebsd-x64@1.30.1: + optional: true + + lightningcss-linux-arm-gnueabihf@1.30.1: + optional: true + + lightningcss-linux-arm64-gnu@1.30.1: + optional: true + + lightningcss-linux-arm64-musl@1.30.1: + optional: true + + lightningcss-linux-x64-gnu@1.30.1: + optional: true + + lightningcss-linux-x64-musl@1.30.1: + optional: true + + lightningcss-win32-arm64-msvc@1.30.1: + optional: true + + lightningcss-win32-x64-msvc@1.30.1: + optional: true + + lightningcss@1.30.1: + dependencies: + detect-libc: 2.1.0 + optionalDependencies: + lightningcss-darwin-arm64: 1.30.1 + lightningcss-darwin-x64: 1.30.1 + lightningcss-freebsd-x64: 1.30.1 + lightningcss-linux-arm-gnueabihf: 1.30.1 + lightningcss-linux-arm64-gnu: 1.30.1 + lightningcss-linux-arm64-musl: 1.30.1 + lightningcss-linux-x64-gnu: 1.30.1 + lightningcss-linux-x64-musl: 1.30.1 + lightningcss-win32-arm64-msvc: 1.30.1 + lightningcss-win32-x64-msvc: 1.30.1 + lilconfig@3.1.3: {} linebreak@1.1.0: @@ -14838,8 +15025,6 @@ snapshots: lodash-es@4.17.21: {} - lodash.castarray@4.4.0: {} - lodash.debounce@4.0.8: {} lodash.defaults@4.2.0: {} @@ -14848,8 +15033,6 @@ snapshots: lodash.isarguments@3.1.0: {} - lodash.isplainobject@4.0.6: {} - lodash.merge@4.6.2: {} lodash@4.17.21: {} @@ -15479,6 +15662,10 @@ snapshots: minipass@7.1.2: {} + minizlib@3.1.0: + dependencies: + minipass: 7.1.2 + mobx-react-lite@4.1.0(mobx@6.12.0)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): dependencies: mobx: 6.12.0 @@ -15525,12 +15712,6 @@ snapshots: ms@2.1.3: {} - mz@2.7.0: - dependencies: - any-promise: 1.3.0 - object-assign: 4.1.1 - thenify-all: 1.6.0 - nanoid@3.3.8: {} napi-postinstall@0.3.3: {} @@ -15644,8 +15825,6 @@ snapshots: object-assign@4.1.1: {} - object-hash@3.0.0: {} - object-inspect@1.13.4: {} object-is@1.1.6: @@ -15927,25 +16106,6 @@ snapshots: - jiti - tsx - postcss-import@15.1.0(postcss@8.5.6): - dependencies: - postcss: 8.5.6 - postcss-value-parser: 4.2.0 - read-cache: 1.0.0 - resolve: 1.22.10 - - postcss-js@4.0.1(postcss@8.5.6): - dependencies: - camelcase-css: 2.0.1 - postcss: 8.5.6 - - postcss-load-config@4.0.2(postcss@8.5.6): - dependencies: - lilconfig: 3.1.3 - yaml: 2.8.1 - optionalDependencies: - postcss: 8.5.6 - postcss-load-config@5.1.0(jiti@2.5.1)(postcss@8.5.6): dependencies: lilconfig: 3.1.3 @@ -16976,13 +17136,13 @@ snapshots: - supports-color - utf-8-validate - storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)): + storybook@9.1.10(@testing-library/dom@10.4.0)(prettier@3.6.2)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)): dependencies: '@storybook/global': 5.0.0 '@testing-library/jest-dom': 6.9.1 '@testing-library/user-event': 14.6.1(@testing-library/dom@10.4.0) '@vitest/expect': 3.2.4 - '@vitest/mocker': 3.2.4(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + '@vitest/mocker': 3.2.4(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) '@vitest/spy': 3.2.4 better-opn: 3.0.2 esbuild: 0.25.0 @@ -17115,16 +17275,6 @@ snapshots: '@babel/core': 7.28.4 babel-plugin-macros: 3.1.0 - sucrase@3.35.0: - dependencies: - '@jridgewell/gen-mapping': 0.3.13 - commander: 4.1.1 - glob: 11.1.0 - lines-and-columns: 1.2.4 - mz: 2.7.0 - pirates: 4.0.7 - ts-interface-checker: 0.1.13 - supports-color@5.5.0: dependencies: has-flag: 3.0.0 @@ -17159,39 +17309,20 @@ snapshots: tailwind-merge@3.3.1: {} - tailwindcss-animate@1.0.7(tailwindcss@3.4.17): - dependencies: - tailwindcss: 3.4.17 + tailwindcss@4.1.13: {} - tailwindcss@3.4.17: - dependencies: - '@alloc/quick-lru': 5.2.0 - arg: 5.0.2 - chokidar: 3.6.0 - didyoumean: 1.2.2 - dlv: 1.1.3 - fast-glob: 3.3.3 - glob-parent: 6.0.2 - is-glob: 4.0.3 - jiti: 1.21.7 - lilconfig: 3.1.3 - micromatch: 4.0.8 - normalize-path: 3.0.0 - object-hash: 3.0.0 - picocolors: 1.1.1 - postcss: 8.5.6 - postcss-import: 15.1.0(postcss@8.5.6) - postcss-js: 4.0.1(postcss@8.5.6) - postcss-load-config: 4.0.2(postcss@8.5.6) - postcss-nested: 6.2.0(postcss@8.5.6) - postcss-selector-parser: 6.1.2 - resolve: 1.22.10 - sucrase: 3.35.0 - transitivePeerDependencies: - - ts-node + tailwindcss@4.1.17: {} tapable@2.3.0: {} + tar@7.5.1: + dependencies: + '@isaacs/fs-minipass': 4.0.1 + chownr: 3.0.0 + minipass: 7.1.2 + minizlib: 3.1.0 + yallist: 5.0.0 + terser-webpack-plugin@5.3.14(@swc/core@1.13.5(@swc/helpers@0.5.17))(esbuild@0.25.0)(webpack@5.101.3(@swc/core@1.13.5(@swc/helpers@0.5.17))(esbuild@0.25.0)): dependencies: '@jridgewell/trace-mapping': 0.3.31 @@ -17217,14 +17348,6 @@ snapshots: thenby@1.3.4: {} - thenify-all@1.6.0: - dependencies: - thenify: 3.3.1 - - thenify@3.3.1: - dependencies: - any-promise: 1.3.0 - tiny-inflate@1.0.3: {} tiny-invariant@1.3.3: {} @@ -17296,8 +17419,6 @@ snapshots: ts-dedent@2.2.0: {} - ts-interface-checker@0.1.13: {} - tsconfck@3.1.6(typescript@5.8.3): optionalDependencies: typescript: 5.8.3 @@ -17710,13 +17831,13 @@ snapshots: string_decoder: 1.3.0 util-deprecate: 1.0.2 - vite-node@3.2.4(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1): + vite-node@3.2.4(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1): dependencies: cac: 6.7.14 debug: 4.4.3 es-module-lexer: 1.7.0 pathe: 2.0.3 - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) transitivePeerDependencies: - '@types/node' - jiti @@ -17731,18 +17852,18 @@ snapshots: - tsx - yaml - vite-tsconfig-paths@5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)): + vite-tsconfig-paths@5.1.4(typescript@5.8.3)(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)): dependencies: debug: 4.4.3 globrex: 0.1.2 tsconfck: 3.1.6(typescript@5.8.3) optionalDependencies: - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) transitivePeerDependencies: - supports-color - typescript - vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1): + vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1): dependencies: esbuild: 0.25.0 fdir: 6.5.0(picomatch@4.0.3) @@ -17754,13 +17875,14 @@ snapshots: '@types/node': 22.12.0 fsevents: 2.3.3 jiti: 2.5.1 + lightningcss: 1.30.1 terser: 5.43.1 yaml: 2.8.1 - vitest@4.0.8(@types/debug@4.1.12)(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1): + vitest@4.0.8(@types/debug@4.1.12)(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1): dependencies: '@vitest/expect': 4.0.8 - '@vitest/mocker': 4.0.8(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1)) + '@vitest/mocker': 4.0.8(vite@7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1)) '@vitest/pretty-format': 4.0.8 '@vitest/runner': 4.0.8 '@vitest/snapshot': 4.0.8 @@ -17777,7 +17899,7 @@ snapshots: tinyexec: 0.3.2 tinyglobby: 0.2.15 tinyrainbow: 3.0.3 - vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(terser@5.43.1)(yaml@2.8.1) + vite: 7.1.11(@types/node@22.12.0)(jiti@2.5.1)(lightningcss@1.30.1)(terser@5.43.1)(yaml@2.8.1) why-is-node-running: 2.3.0 optionalDependencies: '@types/debug': 4.1.12 @@ -18002,6 +18124,8 @@ snapshots: yallist@3.1.1: {} + yallist@5.0.0: {} + yaml@1.10.2: {} yaml@2.8.1: {}