gib/GibSend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: migrate workspace to Tailwind CSS v4 (#377)

Browse Source 
* feat: migrate workspace to Tailwind CSS v4

* refactor: move Tailwind v4 setup to CSS directives
This commit is contained in:
KM Koushik
2026-03-15 07:10:37 +11:00
committed by GitHub
parent d7b196c0e3
commit 9a306b1d59
28 changed files with 543 additions and 382 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/marketing/package.json
+2 -2
View File
@@ -23,6 +23,7 @@
},
"devDependencies": {
"@next/eslint-plugin-next": "^15.3.1",
"@tailwindcss/postcss": "^4.1.0",
"@types/eslint": "^9.6.1",
"@types/node": "^22.15.2",
"@types/react": "^19.1.2",
@@ -30,14 +31,13 @@
"@typescript-eslint/eslint-plugin": "^8.31.0",
"@typescript-eslint/parser": "^8.31.0",
"@usesend/eslint-config": "workspace:*",
"@usesend/tailwind-config": "workspace:*",
"@usesend/typescript-config": "workspace:*",
"eslint": "^8.57.1",
"eslint-config-next": "^15.3.1",
"postcss": "^8.5.3",
"prettier": "^3.5.3",
"prettier-plugin-tailwindcss": "^0.6.11",
"tailwindcss": "^3.4.1",
"tailwindcss": "^4.1.0",
"typescript": "^5.8.3"
}
}
apps/marketing/postcss.config.cjs
+1 -2
View File
@@ -1,8 +1,7 @@
const config = {
plugins: {
tailwindcss: {},
"@tailwindcss/postcss": {},
},
};
module.exports = config;
apps/marketing/src/app/globals.css
+7
View File
@@ -0,0 +1,7 @@
@import "tailwindcss";
@source "../**/*.{js,jsx,ts,tsx,mdx}";
@source "../../../../packages/ui/src/**/*.{js,jsx,ts,tsx,mdx}";
@source "../../../../packages/email-editor/src/**/*.{js,jsx,ts,tsx,mdx}";
@import "@usesend/ui/styles/globals.css";
apps/marketing/src/app/layout.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import "@usesend/ui/styles/globals.css";
import "./globals.css";
import { Inter } from "next/font/google";
import { JetBrains_Mono } from "next/font/google";
apps/marketing/tailwind.config.ts
-13
View File
@@ -1,13 +0,0 @@
import { type Config } from "tailwindcss";
import sharedConfig from "@usesend/tailwind-config/tailwind.config";
import path from "path";
export default {
...sharedConfig,
content: [
"./src/**/*.tsx",
`${path.join(require.resolve("@usesend/ui"), "..")}/**/*.{ts,tsx}`,
`${path.join(require.resolve("@usesend/email-editor"), "..")}/**/*.{ts,tsx}`,
],
} satisfies Config;
apps/web/package.json
+2 -2
View File
@@ -89,6 +89,7 @@
},
"devDependencies": {
"@next/eslint-plugin-next": "^15.3.1",
"@tailwindcss/postcss": "^4.1.0",
"@types/eslint": "^9.6.1",
"@types/html-to-text": "^9.0.4",
"@types/mime-types": "^2.1.4",
@@ -100,14 +101,13 @@
"@typescript-eslint/eslint-plugin": "^8.31.0",
"@typescript-eslint/parser": "^8.31.0",
"@usesend/eslint-config": "workspace:*",
"@usesend/tailwind-config": "workspace:*",
"@usesend/typescript-config": "workspace:*",
"eslint": "^8.57.1",
"eslint-config-next": "^15.3.1",
"postcss": "^8.5.3",
"prettier": "^3.5.3",
"prettier-plugin-tailwindcss": "^0.6.11",
"tailwindcss": "^3.4.1",
"tailwindcss": "^4.1.0",
"typescript": "^5.8.3",
"vite-tsconfig-paths": "^5.1.4",
"vitest": "^3.2.4",
apps/web/postcss.config.cjs
+1 -1
View File
@@ -1,6 +1,6 @@
const config = {
plugins: {
tailwindcss: {},
"@tailwindcss/postcss": {},
},
};
apps/web/src/app/(dashboard)/dasboard-layout.tsx
+24 -3
View File
@@ -1,19 +1,40 @@
"use client";
import { AppSidebar } from "~/components/AppSideBar";
import { SidebarInset, SidebarProvider, SidebarTrigger } from "@usesend/ui/src/sidebar";
import {
SidebarInset,
SidebarProvider,
SidebarTrigger,
} from "@usesend/ui/src/sidebar";
import { useIsMobile } from "@usesend/ui/src/hooks/use-mobile";
import { UpgradeModal } from "~/components/payments/UpgradeModal";
import { usePathname } from "next/navigation";
import { useEffect, useRef } from "react";
export function DashboardLayout({ children }: { children: React.ReactNode }) {
const isMobile = useIsMobile();
const pathname = usePathname();
const mainRef = useRef<HTMLElement>(null);
useEffect(() => {
if (mainRef.current) {
mainRef.current.scrollLeft = 0;
}
window.scrollTo({ left: 0 });
document.documentElement.scrollLeft = 0;
document.body.scrollLeft = 0;
}, [pathname]);
return (
<div className="h-full bg-sidebar-background">
<SidebarProvider>
<AppSidebar />
<SidebarInset>
<main className="flex-1 overflow-auto h-full p-4 xl:px-40">
<SidebarInset className="min-w-0">
<main
ref={mainRef}
className="h-full flex-1 overflow-y-auto overflow-x-hidden p-4 xl:px-40"
>
{isMobile ? (
<SidebarTrigger className="h-5 w-5 text-muted-foreground" />
) : null}
apps/web/src/app/(dashboard)/webhooks/add-webhook.tsx
+2 -2
View File
@@ -267,7 +267,7 @@ export function AddWebhook() {
<ChevronDown className="ml-2 h-4 w-4 shrink-0" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="w-[--radix-dropdown-menu-trigger-width] h-[30vh] ">
<DropdownMenuContent className="h-[30vh] w-[var(--radix-dropdown-menu-trigger-width)]">
<div className="space-y-3">
<DropdownMenuCheckboxItem
checked={allEventsSelected}
@@ -362,7 +362,7 @@ export function AddWebhook() {
<ChevronDown className="ml-2 h-4 w-4 shrink-0" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="max-h-[30vh] w-[--radix-dropdown-menu-trigger-width] overflow-y-auto">
<DropdownMenuContent className="max-h-[30vh] w-[var(--radix-dropdown-menu-trigger-width)] overflow-y-auto">
<div className="space-y-3">
<DropdownMenuCheckboxItem
checked={selectedDomainIds.length === 0}
apps/web/src/app/(dashboard)/webhooks/webhook-update-dialog.tsx
+2 -2
View File
@@ -260,7 +260,7 @@ export function EditWebhookDialog({
<ChevronDown className="ml-2 h-4 w-4 shrink-0" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="w-[--radix-dropdown-menu-trigger-width] h-[30vh]">
<DropdownMenuContent className="h-[30vh] w-[var(--radix-dropdown-menu-trigger-width)]">
<div className="space-y-3">
<DropdownMenuCheckboxItem
checked={allEventsSelected}
@@ -355,7 +355,7 @@ export function EditWebhookDialog({
<ChevronDown className="ml-2 h-4 w-4 shrink-0" />
</Button>
</DropdownMenuTrigger>
<DropdownMenuContent className="max-h-[30vh] w-[--radix-dropdown-menu-trigger-width] overflow-y-auto">
<DropdownMenuContent className="max-h-[30vh] w-[var(--radix-dropdown-menu-trigger-width)] overflow-y-auto">
<div className="space-y-3">
<DropdownMenuCheckboxItem
checked={selectedDomainIds.length === 0}
apps/web/src/app/globals.css
+8
View File
@@ -0,0 +1,8 @@
@import "tailwindcss";
@source "../**/*.{js,jsx,ts,tsx,mdx}";
@source "../../../../packages/ui/src/**/*.{js,jsx,ts,tsx,mdx}";
@source "../../../../packages/email-editor/src/**/*.{js,jsx,ts,tsx,mdx}";
@source "../../../../packages/lib/src/**/*.{js,jsx,ts,tsx,mdx}";
@import "@usesend/ui/styles/globals.css";
apps/web/src/app/layout.tsx
+1 -1
View File
@@ -1,4 +1,4 @@
import "@usesend/ui/styles/globals.css";
import "./globals.css";
import { Inter } from "next/font/google";
import { JetBrains_Mono } from "next/font/google";
apps/web/src/components/AppSideBar.tsx
+1 -1
View File
@@ -323,7 +323,7 @@ export function NavUser({
</SidebarMenuButton>
</DropdownMenuTrigger>
<DropdownMenuContent
className="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-xl"
className="w-[var(--radix-dropdown-menu-trigger-width)] min-w-56 rounded-xl"
side={isMobile ? "bottom" : "top"}
sideOffset={4}
>
apps/web/tailwind.config.ts
-16
View File
@@ -1,16 +0,0 @@
import { type Config } from "tailwindcss";
import sharedConfig from "@usesend/tailwind-config/tailwind.config";
import path from "path";
import { fileURLToPath } from "url";
const here = path.dirname(fileURLToPath(import.meta.url));
export default {
...sharedConfig,
content: [
"./src/**/*.tsx",
path.join(here, "../../packages/ui/src/**/*.{ts,tsx}"),
path.join(here, "../../packages/email-editor/src/**/*.{ts,tsx}"),
path.join(here, "../../packages/lib/src/**/*.{ts,tsx}"),
],
} satisfies Config;
packages/email-editor/package.json
+2 -2
View File
@@ -18,17 +18,17 @@
"author": "",
"license": "ISC",
"devDependencies": {
"@tailwindcss/postcss": "^4.1.0",
"@types/eslint": "^9.6.1",
"@types/react": "^19.1.2",
"@usesend/eslint-config": "workspace:*",
"@usesend/tailwind-config": "workspace:*",
"@usesend/typescript-config": "workspace:*",
"@usesend/ui": "workspace:*",
"postcss": "^8.5.3",
"prettier": "^3.5.3",
"prettier-plugin-tailwindcss": "^0.6.11",
"react": "^19.1.0",
"tailwindcss": "^3.4.1",
"tailwindcss": "^4.1.0",
"tsup": "^8.4.0",
"typescript": "^5.8.3"
},
packages/email-editor/postcss.config.cjs
+1 -1
View File
@@ -1,6 +1,6 @@
const config = {
plugins: {
tailwindcss: {},
"@tailwindcss/postcss": {},
},
};
packages/email-editor/src/styles/index.css
+2
View File
@@ -1,3 +1,5 @@
@reference "tailwindcss";
.unsend-editor .unsend-prose p:where([class~="text-sm"]) {
font-size: 16px;
}
packages/email-editor/tailwind.config.ts
-7
View File
@@ -1,7 +0,0 @@
import { type Config } from "tailwindcss";
import sharedConfig from "@usesend/tailwind-config/tailwind.config";
export default {
...sharedConfig,
content: ["./src/**/*.tsx", "./src/**/*.ts"],
} satisfies Config;
packages/tailwind-config/package.json
-22
View File
@@ -1,22 +0,0 @@
{
"name": "@usesend/tailwind-config",
"version": "1.0.0",
"description": "",
"main": "index.js",
"type": "module",
"scripts": {
"test": "echo \"Error: no test specified\" && exit 1"
},
"keywords": [],
"author": "",
"license": "ISC",
"dependencies": {
"tailwindcss-animate": "^1.0.7"
},
"devDependencies": {
"@types/node": "^22.15.2",
"autoprefixer": "^10.4.21",
"postcss": "^8.5.3",
"tailwindcss": "^3.4.1"
}
}
packages/tailwind-config/tailwind.config.ts
-138
View File
@@ -1,138 +0,0 @@
import type { Config } from "tailwindcss";
const config = {
darkMode: ["class"],
content: ["./src/**/*.{ts,tsx}"],
prefix: "",
theme: {
fontFamily: {
sans: [
"Inter",
"ui-sans-serif",
"system-ui",
"sans-serif",
"Apple Color Emoji",
"Segoe UI Emoji",
"Segoe UI Symbol",
"Noto Color Emoji",
],
mono: [
"JetBrains Mono",
"Menlo",
"ui-monospace",
"SFMono-Regular",
"Menlo",
"Monaco",
"Consolas",
"Liberation Mono",
"Courier New",
"monospace",
],
},
container: {
center: true,
padding: "2rem",
screens: {
"2xl": "1400px",
},
},
extend: {
colors: {
border: "hsl(var(--border))",
input: "hsl(var(--input))",
ring: "hsl(var(--ring))",
background: "hsl(var(--background))",
foreground: "hsl(var(--foreground))",
primary: {
DEFAULT: "hsl(var(--primary))",
foreground: "hsl(var(--primary-foreground))",
},
secondary: {
DEFAULT: "hsl(var(--secondary))",
foreground: "hsl(var(--secondary-foreground))",
},
destructive: {
DEFAULT: "hsl(var(--destructive))",
foreground: "hsl(var(--destructive-foreground))",
},
muted: {
DEFAULT: "hsl(var(--muted))",
foreground: "hsl(var(--muted-foreground))",
},
accent: {
DEFAULT: "hsl(var(--accent))",
foreground: "hsl(var(--accent-foreground))",
},
popover: {
DEFAULT: "hsl(var(--popover))",
foreground: "hsl(var(--popover-foreground))",
},
card: {
DEFAULT: "hsl(var(--card))",
foreground: "hsl(var(--card-foreground))",
},
sidebar: {
DEFAULT: "hsl(var(--sidebar-background))",
foreground: "hsl(var(--sidebar-foreground))",
primary: "hsl(var(--sidebar-primary))",
"primary-foreground": "hsl(var(--sidebar-primary-foreground))",
accent: "hsl(var(--sidebar-accent))",
"accent-foreground": "hsl(var(--sidebar-accent-foreground))",
border: "hsl(var(--sidebar-border))",
ring: "hsl(var(--sidebar-ring))",
},
success: {
DEFAULT: "hsl(var(--success))",
foreground: "hsl(var(--success-foreground))",
},
warning: {
DEFAULT: "hsl(var(--warning))",
foreground: "hsl(var(--warning-foreground))",
},
green: {
DEFAULT: "hsl(var(--green))",
},
red: {
DEFAULT: "hsl(var(--red))",
},
blue: {
DEFAULT: "hsl(var(--blue))",
},
purple: {
DEFAULT: "hsl(var(--purple))",
},
yellow: {
DEFAULT: "hsl(var(--yellow))",
},
gray: {
DEFAULT: "hsl(var(--gray))",
},
"primary-light": {
DEFAULT: "hsl(var(--primary-light))",
},
},
borderRadius: {
lg: "var(--radius)",
md: "calc(var(--radius) - 2px)",
sm: "calc(var(--radius) - 4px)",
},
keyframes: {
"accordion-down": {
from: { height: "0" },
to: { height: "var(--radix-accordion-content-height)" },
},
"accordion-up": {
from: { height: "var(--radix-accordion-content-height)" },
to: { height: "0" },
},
},
animation: {
"accordion-down": "accordion-down 0.4s ease-out",
"accordion-up": "accordion-up 0.4s ease-out",
},
},
},
plugins: [require("tailwindcss-animate")],
} satisfies Config;
export default config;
packages/tailwind-config/tsconfig.json
-9
View File
@@ -1,9 +0,0 @@
{
"extends": "@usesend/typescript-config/base.json",
"compilerOptions": {
"allowJs": true,
"noEmit": true
},
"include": ["tailwind.config.ts"],
"exclude": ["node_modules", "dist"]
}
packages/ui/package.json
+1 -2
View File
@@ -17,14 +17,13 @@
"@types/react": "^19.1.2",
"@types/react-dom": "^19.1.2",
"@usesend/eslint-config": "workspace:*",
"@usesend/tailwind-config": "workspace:*",
"@usesend/typescript-config": "workspace:*",
"eslint": "^8.57.1",
"postcss": "^8.5.3",
"prettier": "^3.5.3",
"prettier-plugin-tailwindcss": "^0.6.11",
"react": "19.1.0",
"tailwindcss": "^3.4.1",
"tailwindcss": "^4.1.0",
"typescript": "^5.8.3"
},
"dependencies": {
packages/ui/src/charts.tsx
+15 -15
View File
@@ -53,7 +53,7 @@ const ChartContainer = React.forwardRef<
ref={ref}
className={cn(
"flex aspect-video justify-center text-xs [&_.recharts-cartesian-axis-tick_text]:fill-muted-foreground [&_.recharts-cartesian-grid_line[stroke='#ccc']]:stroke-border/50 [&_.recharts-curve.recharts-tooltip-cursor]:stroke-border [&_.recharts-dot[stroke='#fff']]:stroke-transparent [&_.recharts-layer]:outline-none [&_.recharts-polar-grid_[stroke='#ccc']]:stroke-border [&_.recharts-radial-bar-background-sector]:fill-muted [&_.recharts-rectangle.recharts-tooltip-cursor]:fill-muted [&_.recharts-reference-line_[stroke='#ccc']]:stroke-border [&_.recharts-sector[stroke='#fff']]:stroke-transparent [&_.recharts-sector]:outline-none [&_.recharts-surface]:outline-none",
className
className,
)}
{...props}
>
@@ -69,7 +69,7 @@ ChartContainer.displayName = "Chart";
const ChartStyle = ({ id, config }: { id: string; config: ChartConfig }) => {
const colorConfig = Object.entries(config).filter(
([_, config]) => config.theme || config.color
([_, config]) => config.theme || config.color,
);
if (!colorConfig.length) {
@@ -92,7 +92,7 @@ ${colorConfig
})
.join("\n")}
}
`
`,
)
.join("\n"),
}}
@@ -129,7 +129,7 @@ const ChartTooltipContent = React.forwardRef<
nameKey,
labelKey,
},
ref
ref,
) => {
const { config } = useChart();
@@ -180,7 +180,7 @@ const ChartTooltipContent = React.forwardRef<
ref={ref}
className={cn(
"grid min-w-[8rem] items-start gap-1.5 rounded-lg border border-border/50 bg-background px-2.5 py-1.5 text-xs shadow-xl",
className
className,
)}
>
{!nestLabel ? tooltipLabel : null}
@@ -195,7 +195,7 @@ const ChartTooltipContent = React.forwardRef<
key={item.dataKey}
className={cn(
"flex w-full flex-wrap items-stretch gap-2 [&>svg]:h-2.5 [&>svg]:w-2.5 [&>svg]:text-muted-foreground",
indicator === "dot" && "items-center"
indicator === "dot" && "items-center",
)}
>
{formatter && item?.value !== undefined && item.name ? (
@@ -208,14 +208,14 @@ const ChartTooltipContent = React.forwardRef<
!hideIndicator && (
<div
className={cn(
"shrink-0 rounded-[2px] border-[--color-border] bg-[--color-bg]",
"shrink-0 rounded-[2px] border-[var(--color-border)] bg-[var(--color-bg)]",
{
"h-2.5 w-2.5": indicator === "dot",
"w-1": indicator === "line",
"w-0 border-[1.5px] border-dashed bg-transparent":
indicator === "dashed",
"my-0.5": nestLabel && indicator === "dashed",
}
},
)}
style={
{
@@ -229,7 +229,7 @@ const ChartTooltipContent = React.forwardRef<
<div
className={cn(
"flex flex-1 justify-between leading-none",
nestLabel ? "items-end" : "items-center"
nestLabel ? "items-end" : "items-center",
)}
>
<div className="grid gap-1.5">
@@ -252,7 +252,7 @@ const ChartTooltipContent = React.forwardRef<
</div>
</div>
);
}
},
);
ChartTooltipContent.displayName = "ChartTooltip";
@@ -268,7 +268,7 @@ const ChartLegendContent = React.forwardRef<
>(
(
{ className, hideIcon = false, payload, verticalAlign = "bottom", nameKey },
ref
ref,
) => {
const { config } = useChart();
@@ -282,7 +282,7 @@ const ChartLegendContent = React.forwardRef<
className={cn(
"flex items-center justify-center gap-4",
verticalAlign === "top" ? "pb-3" : "pt-3",
className
className,
)}
>
{payload.map((item) => {
@@ -293,7 +293,7 @@ const ChartLegendContent = React.forwardRef<
<div
key={item.value}
className={cn(
"flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground"
"flex items-center gap-1.5 [&>svg]:h-3 [&>svg]:w-3 [&>svg]:text-muted-foreground",
)}
>
{itemConfig?.icon && !hideIcon ? (
@@ -312,7 +312,7 @@ const ChartLegendContent = React.forwardRef<
})}
</div>
);
}
},
);
ChartLegendContent.displayName = "ChartLegend";
@@ -320,7 +320,7 @@ ChartLegendContent.displayName = "ChartLegend";
function getPayloadConfigFromPayload(
config: ChartConfig,
payload: unknown,
key: string
key: string,
) {
if (typeof payload !== "object" || payload === null) {
return undefined;
packages/ui/src/dropdown-menu.tsx
+2 -2
View File
@@ -47,7 +47,7 @@ const DropdownMenuSubContent = React.forwardRef<
<DropdownMenuPrimitive.SubContent
ref={ref}
className={cn(
"z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
"z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[var(--radix-dropdown-menu-content-transform-origin)]",
className,
)}
{...props}
@@ -65,7 +65,7 @@ const DropdownMenuContent = React.forwardRef<
ref={ref}
sideOffset={sideOffset}
className={cn(
"z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-xl border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[--radix-dropdown-menu-content-transform-origin]",
"z-50 max-h-[var(--radix-dropdown-menu-content-available-height)] min-w-[8rem] overflow-y-auto overflow-x-hidden rounded-xl border bg-popover p-1 text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 origin-[var(--radix-dropdown-menu-content-transform-origin)]",
className,
)}
{...props}
packages/ui/src/sidebar.tsx
+39 -31
View File
@@ -71,7 +71,7 @@ const SidebarProvider = React.forwardRef<
children,
...props
},
ref
ref,
) => {
const isMobile = useIsMobile();
const [openMobile, setOpenMobile] = React.useState(false);
@@ -92,7 +92,7 @@ const SidebarProvider = React.forwardRef<
// This sets the cookie to keep the sidebar state.
document.cookie = `${SIDEBAR_COOKIE_NAME}=${openState}; path=/; max-age=${SIDEBAR_COOKIE_MAX_AGE}`;
},
[setOpenProp, open]
[setOpenProp, open],
);
// Helper to toggle the sidebar.
@@ -132,7 +132,15 @@ const SidebarProvider = React.forwardRef<
setOpenMobile,
toggleSidebar,
}),
[state, open, setOpen, isMobile, openMobile, setOpenMobile, toggleSidebar]
[
state,
open,
setOpen,
isMobile,
openMobile,
setOpenMobile,
toggleSidebar,
],
);
return (
@@ -147,8 +155,8 @@ const SidebarProvider = React.forwardRef<
} as React.CSSProperties
}
className={cn(
"group/sidebar-wrapper flex min-h-svh w-full has-[[data-variant=inset]]:bg-sidebar",
className
"group/sidebar-wrapper flex min-h-svh w-full min-w-0 overflow-x-hidden has-[[data-variant=inset]]:bg-sidebar",
className,
)}
ref={ref}
{...props}
@@ -158,7 +166,7 @@ const SidebarProvider = React.forwardRef<
</TooltipProvider>
</SidebarContext.Provider>
);
}
},
);
SidebarProvider.displayName = "SidebarProvider";
@@ -179,7 +187,7 @@ const Sidebar = React.forwardRef<
children,
...props
},
ref
ref,
) => {
const { isMobile, state, openMobile, setOpenMobile } = useSidebar();
@@ -187,8 +195,8 @@ const Sidebar = React.forwardRef<
return (
<div
className={cn(
"flex h-full w-[--sidebar-width] flex-col bg-sidebar text-sidebar-foreground",
className
"flex h-full w-[var(--sidebar-width)] flex-col bg-sidebar text-sidebar-foreground",
className,
)}
ref={ref}
{...props}
@@ -204,7 +212,7 @@ const Sidebar = React.forwardRef<
<SheetContent
data-sidebar="sidebar"
data-mobile="true"
className="w-[--sidebar-width] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden"
className="w-[var(--sidebar-width)] bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden"
style={
{
"--sidebar-width": SIDEBAR_WIDTH_MOBILE,
@@ -234,25 +242,25 @@ const Sidebar = React.forwardRef<
{/* This is what handles the sidebar gap on desktop */}
<div
className={cn(
"relative w-[--sidebar-width] bg-transparent transition-[width] duration-200 ease-linear",
"relative w-[var(--sidebar-width)] bg-transparent transition-[width] duration-200 ease-linear",
"group-data-[collapsible=offcanvas]:w-0",
"group-data-[side=right]:rotate-180",
variant === "floating" || variant === "inset"
? "group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4))]"
: "group-data-[collapsible=icon]:w-[--sidebar-width-icon]"
: "group-data-[collapsible=icon]:w-[var(--sidebar-width-icon)]",
)}
/>
<div
className={cn(
"fixed inset-y-0 z-10 hidden h-svh w-[--sidebar-width] transition-[left,right,width] duration-200 ease-linear md:flex",
"fixed inset-y-0 z-10 hidden h-svh w-[var(--sidebar-width)] transition-[left,right,width] duration-200 ease-linear md:flex",
side === "left"
? "left-0 group-data-[collapsible=offcanvas]:left-[calc(var(--sidebar-width)*-1)]"
: "right-0 group-data-[collapsible=offcanvas]:right-[calc(var(--sidebar-width)*-1)]",
// Adjust the padding for floating and inset variants.
variant === "floating" || variant === "inset"
? "p-2 group-data-[collapsible=icon]:w-[calc(var(--sidebar-width-icon)_+_theme(spacing.4)_+2px)]"
: "group-data-[collapsible=icon]:w-[--sidebar-width-icon] group-data-[side=left]:border-r group-data-[side=right]:border-l",
className
: "group-data-[collapsible=icon]:w-[var(--sidebar-width-icon)] group-data-[side=left]:border-r group-data-[side=right]:border-l",
className,
)}
{...props}
>
@@ -265,7 +273,7 @@ const Sidebar = React.forwardRef<
</div>
</div>
);
}
},
);
Sidebar.displayName = "Sidebar";
@@ -316,7 +324,7 @@ const SidebarRail = React.forwardRef<
"group-data-[collapsible=offcanvas]:translate-x-0 group-data-[collapsible=offcanvas]:after:left-full group-data-[collapsible=offcanvas]:hover:bg-sidebar",
"[[data-side=left][data-collapsible=offcanvas]_&]:-right-2",
"[[data-side=right][data-collapsible=offcanvas]_&]:-left-2",
className
className,
)}
{...props}
/>
@@ -332,9 +340,9 @@ const SidebarInset = React.forwardRef<
<main
ref={ref}
className={cn(
"relative flex w-full flex-1 flex-col bg-background",
"relative flex min-w-0 flex-1 flex-col bg-background",
"md:peer-data-[variant=inset]:m-2 md:peer-data-[state=collapsed]:peer-data-[variant=inset]:ml-2 md:peer-data-[variant=inset]:ml-0 md:peer-data-[variant=inset]:rounded-xl md:peer-data-[variant=inset]:shadow",
className
className,
)}
{...props}
/>
@@ -352,7 +360,7 @@ const SidebarInput = React.forwardRef<
data-sidebar="input"
className={cn(
"h-8 w-full bg-background shadow-none focus-visible:ring-2 focus-visible:ring-sidebar-ring",
className
className,
)}
{...props}
/>
@@ -415,7 +423,7 @@ const SidebarContent = React.forwardRef<
data-sidebar="content"
className={cn(
"flex min-h-0 flex-1 flex-col gap-2 overflow-auto group-data-[collapsible=icon]:overflow-hidden",
className
className,
)}
{...props}
/>
@@ -451,7 +459,7 @@ const SidebarGroupLabel = React.forwardRef<
className={cn(
"flex h-8 shrink-0 items-center rounded-md px-2 text-xs font-medium text-sidebar-foreground/70 outline-none ring-sidebar-ring transition-[margin,opacity] duration-200 ease-linear focus-visible:ring-2 [&>svg]:size-4 [&>svg]:shrink-0",
"group-data-[collapsible=icon]:-mt-8 group-data-[collapsible=icon]:opacity-0",
className
className,
)}
{...props}
/>
@@ -474,7 +482,7 @@ const SidebarGroupAction = React.forwardRef<
// Increases the hit area of the button on mobile.
"after:absolute after:-inset-2 after:md:hidden",
"group-data-[collapsible=icon]:hidden",
className
className,
)}
{...props}
/>
@@ -540,7 +548,7 @@ const sidebarMenuButtonVariants = cva(
variant: "default",
size: "default",
},
}
},
);
const SidebarMenuButton = React.forwardRef<
@@ -561,7 +569,7 @@ const SidebarMenuButton = React.forwardRef<
className,
...props
},
ref
ref,
) => {
const Comp = asChild ? Slot : "button";
const { isMobile, state } = useSidebar();
@@ -598,7 +606,7 @@ const SidebarMenuButton = React.forwardRef<
/>
</Tooltip>
);
}
},
);
SidebarMenuButton.displayName = "SidebarMenuButton";
@@ -625,7 +633,7 @@ const SidebarMenuAction = React.forwardRef<
"group-data-[collapsible=icon]:hidden",
showOnHover &&
"group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground md:opacity-0",
className
className,
)}
{...props}
/>
@@ -647,7 +655,7 @@ const SidebarMenuBadge = React.forwardRef<
"peer-data-[size=default]/menu-button:top-1.5",
"peer-data-[size=lg]/menu-button:top-2.5",
"group-data-[collapsible=icon]:hidden",
className
className,
)}
{...props}
/>
@@ -679,7 +687,7 @@ const SidebarMenuSkeleton = React.forwardRef<
/>
)}
<Skeleton
className="h-4 max-w-[--skeleton-width] flex-1"
className="h-4 max-w-[var(--skeleton-width)] flex-1"
data-sidebar="menu-skeleton-text"
style={
{
@@ -702,7 +710,7 @@ const SidebarMenuSub = React.forwardRef<
className={cn(
"mx-3.5 flex min-w-0 translate-x-px flex-col gap-1 border-l border-sidebar-border px-2.5 py-0.5",
"group-data-[collapsible=icon]:hidden",
className
className,
)}
{...props}
/>
@@ -737,7 +745,7 @@ const SidebarMenuSubButton = React.forwardRef<
size === "sm" && "text-xs",
size === "md" && "text-sm",
"group-data-[collapsible=icon]:hidden",
className
className,
)}
{...props}
/>
packages/ui/styles/globals.css
+89 -3
View File
@@ -1,6 +1,81 @@
@tailwind base;
@tailwind components;
@tailwind utilities;
@custom-variant dark (&:is(.dark *));
@plugin "tailwindcss-animate";
@theme inline {
--font-sans:
Inter, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
"Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
--font-mono:
"JetBrains Mono", Menlo, ui-monospace, SFMono-Regular, Monaco, Consolas,
"Liberation Mono", "Courier New", monospace;
--color-border: hsl(var(--border));
--color-input: hsl(var(--input));
--color-ring: hsl(var(--ring));
--color-background: hsl(var(--background));
--color-foreground: hsl(var(--foreground));
--color-primary: hsl(var(--primary));
--color-primary-foreground: hsl(var(--primary-foreground));
--color-secondary: hsl(var(--secondary));
--color-secondary-foreground: hsl(var(--secondary-foreground));
--color-destructive: hsl(var(--destructive));
--color-destructive-foreground: hsl(var(--destructive-foreground));
--color-muted: hsl(var(--muted));
--color-muted-foreground: hsl(var(--muted-foreground));
--color-accent: hsl(var(--accent));
--color-accent-foreground: hsl(var(--accent-foreground));
--color-popover: hsl(var(--popover));
--color-popover-foreground: hsl(var(--popover-foreground));
--color-card: hsl(var(--card));
--color-card-foreground: hsl(var(--card-foreground));
--color-sidebar: hsl(var(--sidebar-background));
--color-sidebar-foreground: hsl(var(--sidebar-foreground));
--color-sidebar-primary: hsl(var(--sidebar-primary));
--color-sidebar-primary-foreground: hsl(var(--sidebar-primary-foreground));
--color-sidebar-accent: hsl(var(--sidebar-accent));
--color-sidebar-accent-foreground: hsl(var(--sidebar-accent-foreground));
--color-sidebar-border: hsl(var(--sidebar-border));
--color-sidebar-ring: hsl(var(--sidebar-ring));
--color-success: hsl(var(--success));
--color-success-foreground: hsl(var(--success-foreground));
--color-warning: hsl(var(--warning));
--color-warning-foreground: hsl(var(--warning-foreground));
--color-green: hsl(var(--green));
--color-red: hsl(var(--red));
--color-blue: hsl(var(--blue));
--color-purple: hsl(var(--purple));
--color-yellow: hsl(var(--yellow));
--color-gray: hsl(var(--gray));
--color-primary-light: hsl(var(--primary-light));
--radius-sm: calc(var(--radius) - 4px);
--radius-md: calc(var(--radius) - 2px);
--radius-lg: var(--radius);
--animate-accordion-down: accordion-down 0.4s ease-out;
--animate-accordion-up: accordion-up 0.4s ease-out;
}
@keyframes accordion-down {
from {
height: 0;
}
to {
height: var(--radix-accordion-content-height);
}
}
@keyframes accordion-up {
from {
height: var(--radix-accordion-content-height);
}
to {
height: 0;
}
}
@layer base {
:root,
@@ -155,6 +230,17 @@
}
@layer utilities {
.container {
margin-inline: auto;
padding-inline: 2rem;
}
@media (min-width: 1400px) {
.container {
max-width: 1400px;
}
}
/* Hide scrollbars but preserve scroll behavior */
.no-scrollbar::-webkit-scrollbar {
display: none;
packages/ui/tailwind.config.ts
-7
View File
@@ -1,7 +0,0 @@
import { type Config } from "tailwindcss";
import sharedConfig from "@usesend/tailwind-config/tailwind.config";
export default {
...sharedConfig,
content: ["./src/**/*.tsx"],
} satisfies Config;
pnpm-lock.yaml
Generated
+339 -96
View File
@@ -67,6 +67,9 @@ importers:
'@next/eslint-plugin-next':
specifier: ^15.3.1
version: 15.3.1
'@tailwindcss/postcss':
specifier: ^4.1.0
version: 4.2.1
'@types/eslint':
specifier: ^9.6.1
version: 9.6.1
@@ -88,9 +91,6 @@ importers:
'@usesend/eslint-config':
specifier: workspace:*
version: link:../../packages/eslint-config
'@usesend/tailwind-config':
specifier: workspace:*
version: link:../../packages/tailwind-config
'@usesend/typescript-config':
specifier: workspace:*
version: link:../../packages/typescript-config
@@ -110,8 +110,8 @@ importers:
specifier: ^0.6.11
version: 0.6.11(prettier@3.5.3)
tailwindcss:
specifier: ^3.4.1
version: 3.4.15
specifier: ^4.1.0
version: 4.2.1
typescript:
specifier: ^5.8.3
version: 5.8.3
@@ -318,6 +318,9 @@ importers:
'@next/eslint-plugin-next':
specifier: ^15.3.1
version: 15.3.1
'@tailwindcss/postcss':
specifier: ^4.1.0
version: 4.2.1
'@types/eslint':
specifier: ^9.6.1
version: 9.6.1
@@ -351,9 +354,6 @@ importers:
'@usesend/eslint-config':
specifier: workspace:*
version: link:../../packages/eslint-config
'@usesend/tailwind-config':
specifier: workspace:*
version: link:../../packages/tailwind-config
'@usesend/typescript-config':
specifier: workspace:*
version: link:../../packages/typescript-config
@@ -376,8 +376,8 @@ importers:
specifier: ^0.6.11
version: 0.6.11(prettier@3.5.3)
tailwindcss:
specifier: ^3.4.1
version: 3.4.15
specifier: ^4.1.0
version: 4.2.1
typescript:
specifier: ^5.8.3
version: 5.8.3
@@ -463,6 +463,9 @@ importers:
specifier: ^0.1.18
version: 0.1.18
devDependencies:
'@tailwindcss/postcss':
specifier: ^4.1.0
version: 4.2.1
'@types/eslint':
specifier: ^9.6.1
version: 9.6.1
@@ -472,9 +475,6 @@ importers:
'@usesend/eslint-config':
specifier: workspace:*
version: link:../eslint-config
'@usesend/tailwind-config':
specifier: workspace:*
version: link:../tailwind-config
'@usesend/typescript-config':
specifier: workspace:*
version: link:../typescript-config
@@ -494,8 +494,8 @@ importers:
specifier: ^19.1.0
version: 19.1.0
tailwindcss:
specifier: ^3.4.1
version: 3.4.15
specifier: ^4.1.0
version: 4.2.1
tsup:
specifier: ^8.4.0
version: 8.4.0(postcss@8.5.3)(typescript@5.8.3)
@@ -585,25 +585,6 @@ importers:
specifier: ^5.8.3
version: 5.8.3
packages/tailwind-config:
dependencies:
tailwindcss-animate:
specifier: ^1.0.7
version: 1.0.7(tailwindcss@3.4.15)
devDependencies:
'@types/node':
specifier: ^22.15.2
version: 22.15.2
autoprefixer:
specifier: ^10.4.21
version: 10.4.21(postcss@8.5.3)
postcss:
specifier: ^8.5.3
version: 8.5.3
tailwindcss:
specifier: ^3.4.1
version: 3.4.15
packages/typescript-config: {}
packages/ui:
@@ -703,7 +684,7 @@ importers:
version: 3.2.0
tailwindcss-animate:
specifier: ^1.0.7
version: 1.0.7(tailwindcss@3.4.15)
version: 1.0.7(tailwindcss@4.2.1)
zod:
specifier: ^3.24.3
version: 3.24.3
@@ -723,9 +704,6 @@ importers:
'@usesend/eslint-config':
specifier: workspace:*
version: link:../eslint-config
'@usesend/tailwind-config':
specifier: workspace:*
version: link:../tailwind-config
'@usesend/typescript-config':
specifier: workspace:*
version: link:../typescript-config
@@ -745,8 +723,8 @@ importers:
specifier: 19.1.0
version: 19.1.0
tailwindcss:
specifier: ^3.4.1
version: 3.4.15
specifier: ^4.1.0
version: 4.2.1
typescript:
specifier: ^5.8.3
version: 5.8.3
@@ -3625,6 +3603,13 @@ packages:
'@jridgewell/sourcemap-codec': 1.5.0
'@jridgewell/trace-mapping': 0.3.25
/@jridgewell/remapping@2.3.5:
resolution: {integrity: sha512-LI9u/+laYG4Ds1TDKSJW2YPrIlcVYOwi2fUC6xB43lueCjgxV4lffOCZCtYFiH6TNOX+tQKXx97T4IKHbhyHEQ==}
dependencies:
'@jridgewell/gen-mapping': 0.3.8
'@jridgewell/trace-mapping': 0.3.31
dev: true
/@jridgewell/resolve-uri@3.1.2:
resolution: {integrity: sha512-bRISgCIjP20/tbWSPWMEi54QVPRZExkuD9lJL+UIxUKtwVJA8wW1Trb1jMs1RFXo1CBTNZ/5hpC9QvmKWdopKw==}
engines: {node: '>=6.0.0'}
@@ -3636,6 +3621,10 @@ packages:
/@jridgewell/sourcemap-codec@1.5.0:
resolution: {integrity: sha512-gv3ZRaISU3fjPAgNsriBRqGWQL6quFx04YMPW/zD8XMLsU32mhCCbfbO6KZFLjvYpCZ8zyDEgqsgf+PwPaM7GQ==}
/@jridgewell/sourcemap-codec@1.5.5:
resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
dev: true
/@jridgewell/trace-mapping@0.3.25:
resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==}
dependencies:
@@ -7701,6 +7690,160 @@ packages:
- arktype
dev: false
/@tailwindcss/node@4.2.1:
resolution: {integrity: sha512-jlx6sLk4EOwO6hHe1oCGm1Q4AN/s0rSrTTPBGPM0/RQ6Uylwq17FuU8IeJJKEjtc6K6O07zsvP+gDO6MMWo7pg==}
dependencies:
'@jridgewell/remapping': 2.3.5
enhanced-resolve: 5.20.0
jiti: 2.6.1
lightningcss: 1.31.1
magic-string: 0.30.21
source-map-js: 1.2.1
tailwindcss: 4.2.1
dev: true
/@tailwindcss/oxide-android-arm64@4.2.1:
resolution: {integrity: sha512-eZ7G1Zm5EC8OOKaesIKuw77jw++QJ2lL9N+dDpdQiAB/c/B2wDh0QPFHbkBVrXnwNugvrbJFk1gK2SsVjwWReg==}
engines: {node: '>= 20'}
cpu: [arm64]
os: [android]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-darwin-arm64@4.2.1:
resolution: {integrity: sha512-q/LHkOstoJ7pI1J0q6djesLzRvQSIfEto148ppAd+BVQK0JYjQIFSK3JgYZJa+Yzi0DDa52ZsQx2rqytBnf8Hw==}
engines: {node: '>= 20'}
cpu: [arm64]
os: [darwin]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-darwin-x64@4.2.1:
resolution: {integrity: sha512-/f/ozlaXGY6QLbpvd/kFTro2l18f7dHKpB+ieXz+Cijl4Mt9AI2rTrpq7V+t04nK+j9XBQHnSMdeQRhbGyt6fw==}
engines: {node: '>= 20'}
cpu: [x64]
os: [darwin]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-freebsd-x64@4.2.1:
resolution: {integrity: sha512-5e/AkgYJT/cpbkys/OU2Ei2jdETCLlifwm7ogMC7/hksI2fC3iiq6OcXwjibcIjPung0kRtR3TxEITkqgn0TcA==}
engines: {node: '>= 20'}
cpu: [x64]
os: [freebsd]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-linux-arm-gnueabihf@4.2.1:
resolution: {integrity: sha512-Uny1EcVTTmerCKt/1ZuKTkb0x8ZaiuYucg2/kImO5A5Y/kBz41/+j0gxUZl+hTF3xkWpDmHX+TaWhOtba2Fyuw==}
engines: {node: '>= 20'}
cpu: [arm]
os: [linux]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-linux-arm64-gnu@4.2.1:
resolution: {integrity: sha512-CTrwomI+c7n6aSSQlsPL0roRiNMDQ/YzMD9EjcR+H4f0I1SQ8QqIuPnsVp7QgMkC1Qi8rtkekLkOFjo7OlEFRQ==}
engines: {node: '>= 20'}
cpu: [arm64]
os: [linux]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-linux-arm64-musl@4.2.1:
resolution: {integrity: sha512-WZA0CHRL/SP1TRbA5mp9htsppSEkWuQ4KsSUumYQnyl8ZdT39ntwqmz4IUHGN6p4XdSlYfJwM4rRzZLShHsGAQ==}
engines: {node: '>= 20'}
cpu: [arm64]
os: [linux]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-linux-x64-gnu@4.2.1:
resolution: {integrity: sha512-qMFzxI2YlBOLW5PhblzuSWlWfwLHaneBE0xHzLrBgNtqN6mWfs+qYbhryGSXQjFYB1Dzf5w+LN5qbUTPhW7Y5g==}
engines: {node: '>= 20'}
cpu: [x64]
os: [linux]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-linux-x64-musl@4.2.1:
resolution: {integrity: sha512-5r1X2FKnCMUPlXTWRYpHdPYUY6a1Ar/t7P24OuiEdEOmms5lyqjDRvVY1yy9Rmioh+AunQ0rWiOTPE8F9A3v5g==}
engines: {node: '>= 20'}
cpu: [x64]
os: [linux]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-wasm32-wasi@4.2.1:
resolution: {integrity: sha512-MGFB5cVPvshR85MTJkEvqDUnuNoysrsRxd6vnk1Lf2tbiqNlXpHYZqkqOQalydienEWOHHFyyuTSYRsLfxFJ2Q==}
engines: {node: '>=14.0.0'}
cpu: [wasm32]
requiresBuild: true
dev: true
optional: true
bundledDependencies:
- '@napi-rs/wasm-runtime'
- '@emnapi/core'
- '@emnapi/runtime'
- '@tybys/wasm-util'
- '@emnapi/wasi-threads'
- tslib
/@tailwindcss/oxide-win32-arm64-msvc@4.2.1:
resolution: {integrity: sha512-YlUEHRHBGnCMh4Nj4GnqQyBtsshUPdiNroZj8VPkvTZSoHsilRCwXcVKnG9kyi0ZFAS/3u+qKHBdDc81SADTRA==}
engines: {node: '>= 20'}
cpu: [arm64]
os: [win32]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide-win32-x64-msvc@4.2.1:
resolution: {integrity: sha512-rbO34G5sMWWyrN/idLeVxAZgAKWrn5LiR3/I90Q9MkA67s6T1oB0xtTe+0heoBvHSpbU9Mk7i6uwJnpo4u21XQ==}
engines: {node: '>= 20'}
cpu: [x64]
os: [win32]
requiresBuild: true
dev: true
optional: true
/@tailwindcss/oxide@4.2.1:
resolution: {integrity: sha512-yv9jeEFWnjKCI6/T3Oq50yQEOqmpmpfzG1hcZsAOaXFQPfzWprWrlHSdGPEF3WQTi8zu8ohC9Mh9J470nT5pUw==}
engines: {node: '>= 20'}
optionalDependencies:
'@tailwindcss/oxide-android-arm64': 4.2.1
'@tailwindcss/oxide-darwin-arm64': 4.2.1
'@tailwindcss/oxide-darwin-x64': 4.2.1
'@tailwindcss/oxide-freebsd-x64': 4.2.1
'@tailwindcss/oxide-linux-arm-gnueabihf': 4.2.1
'@tailwindcss/oxide-linux-arm64-gnu': 4.2.1
'@tailwindcss/oxide-linux-arm64-musl': 4.2.1
'@tailwindcss/oxide-linux-x64-gnu': 4.2.1
'@tailwindcss/oxide-linux-x64-musl': 4.2.1
'@tailwindcss/oxide-wasm32-wasi': 4.2.1
'@tailwindcss/oxide-win32-arm64-msvc': 4.2.1
'@tailwindcss/oxide-win32-x64-msvc': 4.2.1
dev: true
/@tailwindcss/postcss@4.2.1:
resolution: {integrity: sha512-OEwGIBnXnj7zJeonOh6ZG9woofIjGrd2BORfvE5p9USYKDCZoQmfqLcfNiRWoJlRWLdNPn2IgVZuWAOM4iTYMw==}
dependencies:
'@alloc/quick-lru': 5.2.0
'@tailwindcss/node': 4.2.1
'@tailwindcss/oxide': 4.2.1
postcss: 8.5.6
tailwindcss: 4.2.1
dev: true
/@tanstack/query-core@5.74.4:
resolution: {integrity: sha512-YuG0A0+3i9b2Gfo9fkmNnkUWh5+5cFhWBN0pJAHkHilTx6A0nv8kepkk4T4GRt4e5ahbtFj2eTtkiPcVU1xO4A==}
dev: false
@@ -9492,6 +9635,7 @@ packages:
picocolors: 1.1.1
postcss: 8.5.3
postcss-value-parser: 4.2.0
dev: false
/available-typed-arrays@1.0.7:
resolution: {integrity: sha512-wvUjBtSGN7+7SjNpq/9M2Tg350UZD3q62IFZLbRAR1bSMlCo1ZaeW+BJ+D090e4hIIZLBcTDWe4Mh4jvUDajzQ==}
@@ -10785,6 +10929,14 @@ packages:
- utf-8-validate
dev: true
/enhanced-resolve@5.20.0:
resolution: {integrity: sha512-/ce7+jQ1PQ6rVXwe+jKEg5hW5ciicHwIQUagZkp6IufBoY3YDgdTTY1azVs0qoRgVmvsNB+rbjLJxDAeHHtwsQ==}
engines: {node: '>=10.13.0'}
dependencies:
graceful-fs: 4.2.11
tapable: 2.3.0
dev: true
/entities@4.5.0:
resolution: {integrity: sha512-V0hjH4dGPh9Ao5p0MoRY6BVqtwCjhz6vI5LT8AJ55H+4g9/4vbHx1I54fS0XuclLhDHArPQCiMjDxjaL8fPxhw==}
engines: {node: '>=0.12'}
@@ -11964,6 +12116,7 @@ packages:
/fraction.js@4.3.7:
resolution: {integrity: sha512-ZsDfxO51wGAXREY55a7la9LScWpwv9RxIrYABrlvOFBlH/ShPnrtsXeuUIfXKKOVicNxQ+o8JTbJvjS4M89yew==}
dev: false
/framer-motion@11.12.0(react-dom@19.1.0)(react@19.1.0):
resolution: {integrity: sha512-gZaZeqFM6pX9kMVti60hYAa75jGpSsGYWAHbBfIkuHN7DkVHVkxSxeNYnrGmHuM0zPkWTzQx10ZT+fDjn7N4SA==}
@@ -13295,6 +13448,11 @@ packages:
resolution: {integrity: sha512-/imKNG4EbWNrVjoNC/1H5/9GFy+tqjGBHCaSsN+P2RnPqjsLmv6UD3Ej+Kj8nBWaRAwyk7kK5ZUc+OEatnTR3A==}
hasBin: true
/jiti@2.6.1:
resolution: {integrity: sha512-ekilCSN1jwRvIbgeg/57YFh8qQDNbwDb9xT/qu2DAHbFFZUicIl4ygVaAvzveMhMVr3LnpSKTNnwt8PoOfmKhQ==}
hasBin: true
dev: true
/jju@1.4.0:
resolution: {integrity: sha512-8wb9Yw966OSxApiCt0K3yNJL8pnNeIv+OEq2YMidz4FKP6nonSRoOXc80iXY4JaN2FC11B9qsNmDsm+ZOfMROA==}
dev: true
@@ -13599,6 +13757,124 @@ packages:
resolution: {integrity: sha512-0Wd+GPz1O134cP62YU2GTOPNA7Qgl09XwCqM5zpBv87ERCXdfDtyKXvV7c9U22yWJh44QZqBocFnXN11K96qow==}
dev: false
/lightningcss-android-arm64@1.31.1:
resolution: {integrity: sha512-HXJF3x8w9nQ4jbXRiNppBCqeZPIAfUo8zE/kOEGbW5NZvGc/K7nMxbhIr+YlFlHW5mpbg/YFPdbnCh1wAXCKFg==}
engines: {node: '>= 12.0.0'}
cpu: [arm64]
os: [android]
requiresBuild: true
dev: true
optional: true
/lightningcss-darwin-arm64@1.31.1:
resolution: {integrity: sha512-02uTEqf3vIfNMq3h/z2cJfcOXnQ0GRwQrkmPafhueLb2h7mqEidiCzkE4gBMEH65abHRiQvhdcQ+aP0D0g67sg==}
engines: {node: '>= 12.0.0'}
cpu: [arm64]
os: [darwin]
requiresBuild: true
dev: true
optional: true
/lightningcss-darwin-x64@1.31.1:
resolution: {integrity: sha512-1ObhyoCY+tGxtsz1lSx5NXCj3nirk0Y0kB/g8B8DT+sSx4G9djitg9ejFnjb3gJNWo7qXH4DIy2SUHvpoFwfTA==}
engines: {node: '>= 12.0.0'}
cpu: [x64]
os: [darwin]
requiresBuild: true
dev: true
optional: true
/lightningcss-freebsd-x64@1.31.1:
resolution: {integrity: sha512-1RINmQKAItO6ISxYgPwszQE1BrsVU5aB45ho6O42mu96UiZBxEXsuQ7cJW4zs4CEodPUioj/QrXW1r9pLUM74A==}
engines: {node: '>= 12.0.0'}
cpu: [x64]
os: [freebsd]
requiresBuild: true
dev: true
optional: true
/lightningcss-linux-arm-gnueabihf@1.31.1:
resolution: {integrity: sha512-OOCm2//MZJ87CdDK62rZIu+aw9gBv4azMJuA8/KB74wmfS3lnC4yoPHm0uXZ/dvNNHmnZnB8XLAZzObeG0nS1g==}
engines: {node: '>= 12.0.0'}
cpu: [arm]
os: [linux]
requiresBuild: true
dev: true
optional: true
/lightningcss-linux-arm64-gnu@1.31.1:
resolution: {integrity: sha512-WKyLWztD71rTnou4xAD5kQT+982wvca7E6QoLpoawZ1gP9JM0GJj4Tp5jMUh9B3AitHbRZ2/H3W5xQmdEOUlLg==}
engines: {node: '>= 12.0.0'}
cpu: [arm64]
os: [linux]
requiresBuild: true
dev: true
optional: true
/lightningcss-linux-arm64-musl@1.31.1:
resolution: {integrity: sha512-mVZ7Pg2zIbe3XlNbZJdjs86YViQFoJSpc41CbVmKBPiGmC4YrfeOyz65ms2qpAobVd7WQsbW4PdsSJEMymyIMg==}
engines: {node: '>= 12.0.0'}
cpu: [arm64]
os: [linux]
requiresBuild: true
dev: true
optional: true
/lightningcss-linux-x64-gnu@1.31.1:
resolution: {integrity: sha512-xGlFWRMl+0KvUhgySdIaReQdB4FNudfUTARn7q0hh/V67PVGCs3ADFjw+6++kG1RNd0zdGRlEKa+T13/tQjPMA==}
engines: {node: '>= 12.0.0'}
cpu: [x64]
os: [linux]
requiresBuild: true
dev: true
optional: true
/lightningcss-linux-x64-musl@1.31.1:
resolution: {integrity: sha512-eowF8PrKHw9LpoZii5tdZwnBcYDxRw2rRCyvAXLi34iyeYfqCQNA9rmUM0ce62NlPhCvof1+9ivRaTY6pSKDaA==}
engines: {node: '>= 12.0.0'}
cpu: [x64]
os: [linux]
requiresBuild: true
dev: true
optional: true
/lightningcss-win32-arm64-msvc@1.31.1:
resolution: {integrity: sha512-aJReEbSEQzx1uBlQizAOBSjcmr9dCdL3XuC/6HLXAxmtErsj2ICo5yYggg1qOODQMtnjNQv2UHb9NpOuFtYe4w==}
engines: {node: '>= 12.0.0'}
cpu: [arm64]
os: [win32]
requiresBuild: true
dev: true
optional: true
/lightningcss-win32-x64-msvc@1.31.1:
resolution: {integrity: sha512-I9aiFrbd7oYHwlnQDqr1Roz+fTz61oDDJX7n9tYF9FJymH1cIN1DtKw3iYt6b8WZgEjoNwVSncwF4wx/ZedMhw==}
engines: {node: '>= 12.0.0'}
cpu: [x64]
os: [win32]
requiresBuild: true
dev: true
optional: true
/lightningcss@1.31.1:
resolution: {integrity: sha512-l51N2r93WmGUye3WuFoN5k10zyvrVs0qfKBhyC5ogUQ6Ew6JUSswh78mbSO+IU3nTWsyOArqPCcShdQSadghBQ==}
engines: {node: '>= 12.0.0'}
dependencies:
detect-libc: 2.1.1
optionalDependencies:
lightningcss-android-arm64: 1.31.1
lightningcss-darwin-arm64: 1.31.1
lightningcss-darwin-x64: 1.31.1
lightningcss-freebsd-x64: 1.31.1
lightningcss-linux-arm-gnueabihf: 1.31.1
lightningcss-linux-arm64-gnu: 1.31.1
lightningcss-linux-arm64-musl: 1.31.1
lightningcss-linux-x64-gnu: 1.31.1
lightningcss-linux-x64-musl: 1.31.1
lightningcss-win32-arm64-msvc: 1.31.1
lightningcss-win32-x64-msvc: 1.31.1
dev: true
/lilconfig@2.1.0:
resolution: {integrity: sha512-utWOt/GHzuUxnLKxB6dk81RoOeoNeHgbrXiuGk4yyF5qlRz+iIVWu56E2fqGHFrXz0QNUhLB/8nKqvRH66JKGQ==}
engines: {node: '>=10'}
@@ -13728,6 +14004,12 @@ packages:
dependencies:
'@jridgewell/sourcemap-codec': 1.5.0
/magic-string@0.30.21:
resolution: {integrity: sha512-vd2F4YUyEXKGcLHoq+TEyCjxueSeHnFxyyjNp80yg0XV4vUhnDer/lvvlqM/arB5bXQN5K2/3oinyCRyx8T2CQ==}
dependencies:
'@jridgewell/sourcemap-codec': 1.5.5
dev: true
/magicast@0.3.5:
resolution: {integrity: sha512-L0WhttDl+2BOsybvEOLK7fW3UA0OQ0IQ2d6Zl2x/a6vVRs3bAY0ECOSHHeL5jD+SbOpOCUEi0y1DgHEn9Qn1AQ==}
dependencies:
@@ -14857,6 +15139,7 @@ packages:
/normalize-range@0.1.2:
resolution: {integrity: sha512-bdok/XvKII3nUpklnV6P2hxtMNrCboOjAcyBuQnWEhO665FwrSNRxU+AqpsyvO6LgGYPspN+lu5CLtw4jPRKNA==}
engines: {node: '>=0.10.0'}
dev: false
/normalize-url@8.0.1:
resolution: {integrity: sha512-IO9QvjUMWxPQQhs60oOu10CRkWCiZzSUkzbXGGV9pviYl1fXYcvkzQ5jV9z8Y6un8ARoVRl4EtC6v6jNqbaJ/w==}
@@ -15378,17 +15661,6 @@ packages:
engines: {node: '>= 0.4'}
dev: true
/postcss-import@15.1.0(postcss@8.5.3):
resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
engines: {node: '>=14.0.0'}
peerDependencies:
postcss: ^8.0.0
dependencies:
postcss: 8.5.3
postcss-value-parser: 4.2.0
read-cache: 1.0.0
resolve: 1.22.10
/postcss-import@15.1.0(postcss@8.5.6):
resolution: {integrity: sha512-hpr+J05B2FVYUAXHeK1YyI267J/dDDhMU6B6civm8hSY1jYJnBXxzKDKDswzJmtLHryrjhnDjqqp/49t8FALew==}
engines: {node: '>=14.0.0'}
@@ -15399,16 +15671,6 @@ packages:
postcss-value-parser: 4.2.0
read-cache: 1.0.0
resolve: 1.22.10
dev: true
/postcss-js@4.0.1(postcss@8.5.3):
resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
engines: {node: ^12 || ^14 || >= 16}
peerDependencies:
postcss: ^8.4.21
dependencies:
camelcase-css: 2.0.1
postcss: 8.5.3
/postcss-js@4.0.1(postcss@8.5.6):
resolution: {integrity: sha512-dDLF8pEO191hJMtlHFPRa8xsizHaM82MLfNkUHdUtVEV3tgTp5oj+8qbEqYM57SLfc74KSbw//4SeJma2LRVIw==}
@@ -15418,23 +15680,6 @@ packages:
dependencies:
camelcase-css: 2.0.1
postcss: 8.5.6
dev: true
/postcss-load-config@4.0.2(postcss@8.5.3):
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
dependencies:
lilconfig: 3.1.3
postcss: 8.5.3
yaml: 2.7.1
/postcss-load-config@4.0.2(postcss@8.5.6):
resolution: {integrity: sha512-bSVhyJGL00wMVoPUzAVAnbEoWyqRxkjv64tUl427SKnPrENtq6hJwUojroMz2VB+Q1edmi4IfrAPpami5VVgMQ==}
@@ -15451,7 +15696,6 @@ packages:
lilconfig: 3.1.3
postcss: 8.5.6
yaml: 2.7.1
dev: true
/postcss-load-config@6.0.1(postcss@8.5.3):
resolution: {integrity: sha512-oPtTM4oerL+UXmx+93ytZVN82RrlY/wPUV8IeDxFrzIjXOLF1pN+EmKPLbubvKHT2HC20xXsCAH2Z+CKV6Oz/g==}
@@ -15497,15 +15741,6 @@ packages:
postcss: 8.5.6
dev: true
/postcss-nested@6.2.0(postcss@8.5.3):
resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==}
engines: {node: '>=12.0'}
peerDependencies:
postcss: ^8.2.14
dependencies:
postcss: 8.5.3
postcss-selector-parser: 6.1.2
/postcss-nested@6.2.0(postcss@8.5.6):
resolution: {integrity: sha512-HQbt28KulC5AJzG+cZtj9kvKB93CFCdLvog1WFLf1D+xmMvPGlBstkpTEZfK5+AN9hfJocyBFCNiqyS48bpgzQ==}
engines: {node: '>=12.0'}
@@ -15514,7 +15749,6 @@ packages:
dependencies:
postcss: 8.5.6
postcss-selector-parser: 6.1.2
dev: true
/postcss-selector-parser@6.1.2:
resolution: {integrity: sha512-Q8qQfPiZ+THO/3ZrOrO0cJJKfpYCagtMUkXbnEfmgUjwXg6z/WBeOyS9APBBPCTSiDV+s4SwQGu8yFsiMRIudg==}
@@ -17712,12 +17946,12 @@ packages:
resolution: {integrity: sha512-FQT/OVqCD+7edmmJpsgCsY820RTD5AkBryuG5IUqR5YQZSdj5xlH5nLgH7YPths7WsLPSpSBNneJdM8aS8aeFA==}
dev: false
/tailwindcss-animate@1.0.7(tailwindcss@3.4.15):
/tailwindcss-animate@1.0.7(tailwindcss@4.2.1):
resolution: {integrity: sha512-bl6mpH3T7I3UFxuvDEXLxy/VuFxBk5bbzplh7tXI68mwMokNYd1t9qPBHlnyTwfa4JGC4zP516I1hYYtQ/vspA==}
peerDependencies:
tailwindcss: '>=3.0.0 || insiders'
dependencies:
tailwindcss: 3.4.15
tailwindcss: 4.2.1
dev: false
/tailwindcss@3.4.15:
@@ -17739,16 +17973,17 @@ packages:
normalize-path: 3.0.0
object-hash: 3.0.0
picocolors: 1.1.1
postcss: 8.5.3
postcss-import: 15.1.0(postcss@8.5.3)
postcss-js: 4.0.1(postcss@8.5.3)
postcss-load-config: 4.0.2(postcss@8.5.3)
postcss-nested: 6.2.0(postcss@8.5.3)
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
dev: false
/tailwindcss@3.4.4:
resolution: {integrity: sha512-ZoyXOdJjISB7/BcLTR6SEsLgKtDStYyYZVLsUtWChO4Ps20CBad7lfJKVDiejocV4ME1hLmyY0WJE3hSDcmQ2A==}
@@ -17781,6 +18016,14 @@ packages:
- ts-node
dev: true
/tailwindcss@4.2.1:
resolution: {integrity: sha512-/tBrSQ36vCleJkAOsy9kbNTgaxvGbyOamC30PRePTQe/o1MFwEKHQk4Cn7BNGaPtjp+PuUrByJehM1hgxfq4sw==}
/tapable@2.3.0:
resolution: {integrity: sha512-g9ljZiwki/LfxmQADO3dEY1CbpmXT5Hm2fJ+QaGKwSXUylMybePR7/67YW7jOrrvjEgL1Fmz5kzyAjWVWLlucg==}
engines: {node: '>=6'}
dev: true
/tar-fs@3.0.8:
resolution: {integrity: sha512-ZoROL70jptorGAlgAYiLoBLItEKw/fUxg9BSYK/dF/GAGYFJOJJJMvjPAKDJraCXFwadD456FCuvLWgfhMsPwg==}
dependencies: