@hashintel/ds-theme 0.0.3 → 0.1.0

package/dist/main.js

@@ -1,25 +1,957 @@
-import { a as lineHeights, i as fonts, n as fontSizes, o as spacing, r as fontWeights, s as colors, t as radii, u as definePreset } from "./radii.gen-aroChr7P.js";
-
+import { a as staticColors, d as green, h as definePreset$1, i as palettes, m as defineGlobalStyles, n as fontWeights$1, p as blue, s as red, t as fontSizes$1, u as orange } from "./typography.gen-Bua4caJG.js";
+//#region ../../../node_modules/@pandacss/preset-panda/dist/index.mjs
+var breakpoints = {
+	sm: "640px",
+	md: "768px",
+	lg: "1024px",
+	xl: "1280px",
+	"2xl": "1536px"
+};
+var containerSizes = {
+	xs: "320px",
+	sm: "384px",
+	md: "448px",
+	lg: "512px",
+	xl: "576px",
+	"2xl": "672px",
+	"3xl": "768px",
+	"4xl": "896px",
+	"5xl": "1024px",
+	"6xl": "1152px",
+	"7xl": "1280px",
+	"8xl": "1440px"
+};
+var keyframes = {
+	spin: { to: { transform: "rotate(360deg)" } },
+	ping: { "75%, 100%": {
+		transform: "scale(2)",
+		opacity: "0"
+	} },
+	pulse: { "50%": { opacity: ".5" } },
+	bounce: {
+		"0%, 100%": {
+			transform: "translateY(-25%)",
+			animationTimingFunction: "cubic-bezier(0.8,0,1,1)"
+		},
+		"50%": {
+			transform: "none",
+			animationTimingFunction: "cubic-bezier(0,0,0.2,1)"
+		}
+	}
+};
+var animations = {
+	spin: { value: "spin 1s linear infinite" },
+	ping: { value: "ping 1s cubic-bezier(0, 0, 0.2, 1) infinite" },
+	pulse: { value: "pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite" },
+	bounce: { value: "bounce 1s infinite" }
+};
+var aspectRatios = {
+	square: { value: "1 / 1" },
+	landscape: { value: "4 / 3" },
+	portrait: { value: "3 / 4" },
+	wide: { value: "16 / 9" },
+	ultrawide: { value: "18 / 5" },
+	golden: { value: "1.618 / 1" }
+};
+var borders = { none: { value: "none" } };
+var colors = {
+	current: { value: "currentColor" },
+	black: { value: "#000" },
+	white: { value: "#fff" },
+	transparent: { value: "rgb(0 0 0 / 0)" },
+	rose: {
+		50: { value: "#fff1f2" },
+		100: { value: "#ffe4e6" },
+		200: { value: "#fecdd3" },
+		300: { value: "#fda4af" },
+		400: { value: "#fb7185" },
+		500: { value: "#f43f5e" },
+		600: { value: "#e11d48" },
+		700: { value: "#be123c" },
+		800: { value: "#9f1239" },
+		900: { value: "#881337" },
+		950: { value: "#4c0519" }
+	},
+	pink: {
+		50: { value: "#fdf2f8" },
+		100: { value: "#fce7f3" },
+		200: { value: "#fbcfe8" },
+		300: { value: "#f9a8d4" },
+		400: { value: "#f472b6" },
+		500: { value: "#ec4899" },
+		600: { value: "#db2777" },
+		700: { value: "#be185d" },
+		800: { value: "#9d174d" },
+		900: { value: "#831843" },
+		950: { value: "#500724" }
+	},
+	fuchsia: {
+		50: { value: "#fdf4ff" },
+		100: { value: "#fae8ff" },
+		200: { value: "#f5d0fe" },
+		300: { value: "#f0abfc" },
+		400: { value: "#e879f9" },
+		500: { value: "#d946ef" },
+		600: { value: "#c026d3" },
+		700: { value: "#a21caf" },
+		800: { value: "#86198f" },
+		900: { value: "#701a75" },
+		950: { value: "#4a044e" }
+	},
+	purple: {
+		50: { value: "#faf5ff" },
+		100: { value: "#f3e8ff" },
+		200: { value: "#e9d5ff" },
+		300: { value: "#d8b4fe" },
+		400: { value: "#c084fc" },
+		500: { value: "#a855f7" },
+		600: { value: "#9333ea" },
+		700: { value: "#7e22ce" },
+		800: { value: "#6b21a8" },
+		900: { value: "#581c87" },
+		950: { value: "#3b0764" }
+	},
+	violet: {
+		50: { value: "#f5f3ff" },
+		100: { value: "#ede9fe" },
+		200: { value: "#ddd6fe" },
+		300: { value: "#c4b5fd" },
+		400: { value: "#a78bfa" },
+		500: { value: "#8b5cf6" },
+		600: { value: "#7c3aed" },
+		700: { value: "#6d28d9" },
+		800: { value: "#5b21b6" },
+		900: { value: "#4c1d95" },
+		950: { value: "#2e1065" }
+	},
+	indigo: {
+		50: { value: "#eef2ff" },
+		100: { value: "#e0e7ff" },
+		200: { value: "#c7d2fe" },
+		300: { value: "#a5b4fc" },
+		400: { value: "#818cf8" },
+		500: { value: "#6366f1" },
+		600: { value: "#4f46e5" },
+		700: { value: "#4338ca" },
+		800: { value: "#3730a3" },
+		900: { value: "#312e81" },
+		950: { value: "#1e1b4b" }
+	},
+	blue: {
+		50: { value: "#eff6ff" },
+		100: { value: "#dbeafe" },
+		200: { value: "#bfdbfe" },
+		300: { value: "#93c5fd" },
+		400: { value: "#60a5fa" },
+		500: { value: "#3b82f6" },
+		600: { value: "#2563eb" },
+		700: { value: "#1d4ed8" },
+		800: { value: "#1e40af" },
+		900: { value: "#1e3a8a" },
+		950: { value: "#172554" }
+	},
+	sky: {
+		50: { value: "#f0f9ff" },
+		100: { value: "#e0f2fe" },
+		200: { value: "#bae6fd" },
+		300: { value: "#7dd3fc" },
+		400: { value: "#38bdf8" },
+		500: { value: "#0ea5e9" },
+		600: { value: "#0284c7" },
+		700: { value: "#0369a1" },
+		800: { value: "#075985" },
+		900: { value: "#0c4a6e" },
+		950: { value: "#082f49" }
+	},
+	cyan: {
+		50: { value: "#ecfeff" },
+		100: { value: "#cffafe" },
+		200: { value: "#a5f3fc" },
+		300: { value: "#67e8f9" },
+		400: { value: "#22d3ee" },
+		500: { value: "#06b6d4" },
+		600: { value: "#0891b2" },
+		700: { value: "#0e7490" },
+		800: { value: "#155e75" },
+		900: { value: "#164e63" },
+		950: { value: "#083344" }
+	},
+	teal: {
+		50: { value: "#f0fdfa" },
+		100: { value: "#ccfbf1" },
+		200: { value: "#99f6e4" },
+		300: { value: "#5eead4" },
+		400: { value: "#2dd4bf" },
+		500: { value: "#14b8a6" },
+		600: { value: "#0d9488" },
+		700: { value: "#0f766e" },
+		800: { value: "#115e59" },
+		900: { value: "#134e4a" },
+		950: { value: "#042f2e" }
+	},
+	emerald: {
+		50: { value: "#ecfdf5" },
+		100: { value: "#d1fae5" },
+		200: { value: "#a7f3d0" },
+		300: { value: "#6ee7b7" },
+		400: { value: "#34d399" },
+		500: { value: "#10b981" },
+		600: { value: "#059669" },
+		700: { value: "#047857" },
+		800: { value: "#065f46" },
+		900: { value: "#064e3b" },
+		950: { value: "#022c22" }
+	},
+	green: {
+		50: { value: "#f0fdf4" },
+		100: { value: "#dcfce7" },
+		200: { value: "#bbf7d0" },
+		300: { value: "#86efac" },
+		400: { value: "#4ade80" },
+		500: { value: "#22c55e" },
+		600: { value: "#16a34a" },
+		700: { value: "#15803d" },
+		800: { value: "#166534" },
+		900: { value: "#14532d" },
+		950: { value: "#052e16" }
+	},
+	lime: {
+		50: { value: "#f7fee7" },
+		100: { value: "#ecfccb" },
+		200: { value: "#d9f99d" },
+		300: { value: "#bef264" },
+		400: { value: "#a3e635" },
+		500: { value: "#84cc16" },
+		600: { value: "#65a30d" },
+		700: { value: "#4d7c0f" },
+		800: { value: "#3f6212" },
+		900: { value: "#365314" },
+		950: { value: "#1a2e05" }
+	},
+	yellow: {
+		50: { value: "#fefce8" },
+		100: { value: "#fef9c3" },
+		200: { value: "#fef08a" },
+		300: { value: "#fde047" },
+		400: { value: "#facc15" },
+		500: { value: "#eab308" },
+		600: { value: "#ca8a04" },
+		700: { value: "#a16207" },
+		800: { value: "#854d0e" },
+		900: { value: "#713f12" },
+		950: { value: "#422006" }
+	},
+	amber: {
+		50: { value: "#fffbeb" },
+		100: { value: "#fef3c7" },
+		200: { value: "#fde68a" },
+		300: { value: "#fcd34d" },
+		400: { value: "#fbbf24" },
+		500: { value: "#f59e0b" },
+		600: { value: "#d97706" },
+		700: { value: "#b45309" },
+		800: { value: "#92400e" },
+		900: { value: "#78350f" },
+		950: { value: "#451a03" }
+	},
+	orange: {
+		50: { value: "#fff7ed" },
+		100: { value: "#ffedd5" },
+		200: { value: "#fed7aa" },
+		300: { value: "#fdba74" },
+		400: { value: "#fb923c" },
+		500: { value: "#f97316" },
+		600: { value: "#ea580c" },
+		700: { value: "#c2410c" },
+		800: { value: "#9a3412" },
+		900: { value: "#7c2d12" },
+		950: { value: "#431407" }
+	},
+	red: {
+		50: { value: "#fef2f2" },
+		100: { value: "#fee2e2" },
+		200: { value: "#fecaca" },
+		300: { value: "#fca5a5" },
+		400: { value: "#f87171" },
+		500: { value: "#ef4444" },
+		600: { value: "#dc2626" },
+		700: { value: "#b91c1c" },
+		800: { value: "#991b1b" },
+		900: { value: "#7f1d1d" },
+		950: { value: "#450a0a" }
+	},
+	neutral: {
+		50: { value: "#fafafa" },
+		100: { value: "#f5f5f5" },
+		200: { value: "#e5e5e5" },
+		300: { value: "#d4d4d4" },
+		400: { value: "#a3a3a3" },
+		500: { value: "#737373" },
+		600: { value: "#525252" },
+		700: { value: "#404040" },
+		800: { value: "#262626" },
+		900: { value: "#171717" },
+		950: { value: "#0a0a0a" }
+	},
+	stone: {
+		50: { value: "#fafaf9" },
+		100: { value: "#f5f5f4" },
+		200: { value: "#e7e5e4" },
+		300: { value: "#d6d3d1" },
+		400: { value: "#a8a29e" },
+		500: { value: "#78716c" },
+		600: { value: "#57534e" },
+		700: { value: "#44403c" },
+		800: { value: "#292524" },
+		900: { value: "#1c1917" },
+		950: { value: "#0c0a09" }
+	},
+	zinc: {
+		50: { value: "#fafafa" },
+		100: { value: "#f4f4f5" },
+		200: { value: "#e4e4e7" },
+		300: { value: "#d4d4d8" },
+		400: { value: "#a1a1aa" },
+		500: { value: "#71717a" },
+		600: { value: "#52525b" },
+		700: { value: "#3f3f46" },
+		800: { value: "#27272a" },
+		900: { value: "#18181b" },
+		950: { value: "#09090b" }
+	},
+	gray: {
+		50: { value: "#f9fafb" },
+		100: { value: "#f3f4f6" },
+		200: { value: "#e5e7eb" },
+		300: { value: "#d1d5db" },
+		400: { value: "#9ca3af" },
+		500: { value: "#6b7280" },
+		600: { value: "#4b5563" },
+		700: { value: "#374151" },
+		800: { value: "#1f2937" },
+		900: { value: "#111827" },
+		950: { value: "#030712" }
+	},
+	slate: {
+		50: { value: "#f8fafc" },
+		100: { value: "#f1f5f9" },
+		200: { value: "#e2e8f0" },
+		300: { value: "#cbd5e1" },
+		400: { value: "#94a3b8" },
+		500: { value: "#64748b" },
+		600: { value: "#475569" },
+		700: { value: "#334155" },
+		800: { value: "#1e293b" },
+		900: { value: "#0f172a" },
+		950: { value: "#020617" }
+	}
+};
+var shadows = {
+	"2xs": { value: "0 1px rgb(0 0 0 / 0.05)" },
+	xs: { value: "0 1px 2px 0 rgb(0 0 0 / 0.05)" },
+	sm: { value: ["0 1px 3px 0 rgb(0 0 0 / 0.1)", "0 1px 2px -1px rgb(0 0 0 / 0.1)"] },
+	md: { value: ["0 4px 6px -1px rgb(0 0 0 / 0.1)", "0 2px 4px -2px rgb(0 0 0 / 0.1)"] },
+	lg: { value: ["0 10px 15px -3px rgb(0 0 0 / 0.1)", "0 4px 6px -4px rgb(0 0 0 / 0.1)"] },
+	xl: { value: ["0 20px 25px -5px rgb(0 0 0 / 0.1)", "0 8px 10px -6px rgb(0 0 0 / 0.1)"] },
+	"2xl": { value: "0 25px 50px -12px rgb(0 0 0 / 0.25)" },
+	"inset-2xs": { value: "inset 0 1px rgb(0 0 0 / 0.05)" },
+	"inset-xs": { value: "inset 0 1px 1px rgb(0 0 0 / 0.05)" },
+	"inset-sm": { value: "inset 0 2px 4px rgb(0 0 0 / 0.05)" }
+};
+var spacing = {
+	0: { value: "0rem" },
+	.5: { value: "0.125rem" },
+	1: { value: "0.25rem" },
+	1.5: { value: "0.375rem" },
+	2: { value: "0.5rem" },
+	2.5: { value: "0.625rem" },
+	3: { value: "0.75rem" },
+	3.5: { value: "0.875rem" },
+	4: { value: "1rem" },
+	4.5: { value: "1.125rem" },
+	5: { value: "1.25rem" },
+	5.5: { value: "1.375rem" },
+	6: { value: "1.5rem" },
+	7: { value: "1.75rem" },
+	8: { value: "2rem" },
+	9: { value: "2.25rem" },
+	10: { value: "2.5rem" },
+	11: { value: "2.75rem" },
+	12: { value: "3rem" },
+	14: { value: "3.5rem" },
+	16: { value: "4rem" },
+	20: { value: "5rem" },
+	24: { value: "6rem" },
+	28: { value: "7rem" },
+	32: { value: "8rem" },
+	36: { value: "9rem" },
+	40: { value: "10rem" },
+	44: { value: "11rem" },
+	48: { value: "12rem" },
+	52: { value: "13rem" },
+	56: { value: "14rem" },
+	60: { value: "15rem" },
+	64: { value: "16rem" },
+	72: { value: "18rem" },
+	80: { value: "20rem" },
+	96: { value: "24rem" }
+};
+var largeSizes = {
+	xs: { value: "20rem" },
+	sm: { value: "24rem" },
+	md: { value: "28rem" },
+	lg: { value: "32rem" },
+	xl: { value: "36rem" },
+	"2xl": { value: "42rem" },
+	"3xl": { value: "48rem" },
+	"4xl": { value: "56rem" },
+	"5xl": { value: "64rem" },
+	"6xl": { value: "72rem" },
+	"7xl": { value: "80rem" },
+	"8xl": { value: "90rem" },
+	prose: { value: "65ch" }
+};
+var sizes = {
+	...spacing,
+	...largeSizes,
+	full: { value: "100%" },
+	min: { value: "min-content" },
+	max: { value: "max-content" },
+	fit: { value: "fit-content" }
+};
+var fontSizes = {
+	"2xs": { value: "0.5rem" },
+	xs: { value: "0.75rem" },
+	sm: { value: "0.875rem" },
+	md: { value: "1rem" },
+	lg: { value: "1.125rem" },
+	xl: { value: "1.25rem" },
+	"2xl": { value: "1.5rem" },
+	"3xl": { value: "1.875rem" },
+	"4xl": { value: "2.25rem" },
+	"5xl": { value: "3rem" },
+	"6xl": { value: "3.75rem" },
+	"7xl": { value: "4.5rem" },
+	"8xl": { value: "6rem" },
+	"9xl": { value: "8rem" }
+};
+var fontWeights = {
+	thin: { value: "100" },
+	extralight: { value: "200" },
+	light: { value: "300" },
+	normal: { value: "400" },
+	medium: { value: "500" },
+	semibold: { value: "600" },
+	bold: { value: "700" },
+	extrabold: { value: "800" },
+	black: { value: "900" }
+};
+var letterSpacings = {
+	tighter: { value: "-0.05em" },
+	tight: { value: "-0.025em" },
+	normal: { value: "0em" },
+	wide: { value: "0.025em" },
+	wider: { value: "0.05em" },
+	widest: { value: "0.1em" }
+};
+var lineHeights = {
+	none: { value: "1" },
+	tight: { value: "1.25" },
+	snug: { value: "1.375" },
+	normal: { value: "1.5" },
+	relaxed: { value: "1.625" },
+	loose: { value: "2" }
+};
+var fonts = {
+	sans: { value: [
+		"ui-sans-serif",
+		"system-ui",
+		"-apple-system",
+		"BlinkMacSystemFont",
+		"\"Segoe UI\"",
+		"Roboto",
+		"\"Helvetica Neue\"",
+		"Arial",
+		"\"Noto Sans\"",
+		"sans-serif",
+		"\"Apple Color Emoji\"",
+		"\"Segoe UI Emoji\"",
+		"\"Segoe UI Symbol\"",
+		"\"Noto Color Emoji\""
+	] },
+	serif: { value: [
+		"ui-serif",
+		"Georgia",
+		"Cambria",
+		"\"Times New Roman\"",
+		"Times",
+		"serif"
+	] },
+	mono: { value: [
+		"ui-monospace",
+		"SFMono-Regular",
+		"Menlo",
+		"Monaco",
+		"Consolas",
+		"\"Liberation Mono\"",
+		"\"Courier New\"",
+		"monospace"
+	] }
+};
+var textStyles = {
+	xs: { value: {
+		fontSize: "0.75rem",
+		lineHeight: "calc(1 / 0.75)"
+	} },
+	sm: { value: {
+		fontSize: "0.875rem",
+		lineHeight: "calc(1.25 / 0.875)"
+	} },
+	md: { value: {
+		fontSize: "1rem",
+		lineHeight: "calc(1.5 / 1)"
+	} },
+	lg: { value: {
+		fontSize: "1.125rem",
+		lineHeight: "calc(1.75 / 1.125)"
+	} },
+	xl: { value: {
+		fontSize: "1.25rem",
+		lineHeight: "calc(1.75 / 1.25)"
+	} },
+	"2xl": { value: {
+		fontSize: "1.5rem",
+		lineHeight: "calc(2 / 1.5)"
+	} },
+	"3xl": { value: {
+		fontSize: "1.875rem",
+		lineHeight: "calc(2.25 / 1.875)"
+	} },
+	"4xl": { value: {
+		fontSize: "2.25rem",
+		lineHeight: "calc(2.5 / 2.25)"
+	} },
+	"5xl": { value: {
+		fontSize: "3rem",
+		lineHeight: "1"
+	} },
+	"6xl": { value: {
+		fontSize: "3.75rem",
+		lineHeight: "1"
+	} },
+	"7xl": { value: {
+		fontSize: "4.5rem",
+		lineHeight: "1"
+	} },
+	"8xl": { value: {
+		fontSize: "6rem",
+		lineHeight: "1"
+	} },
+	"9xl": { value: {
+		fontSize: "8rem",
+		lineHeight: "1"
+	} }
+};
+var defineTokens = (v) => v;
+var tokens = defineTokens({
+	aspectRatios,
+	borders,
+	easings: {
+		default: { value: "cubic-bezier(0.4, 0, 0.2, 1)" },
+		linear: { value: "linear" },
+		in: { value: "cubic-bezier(0.4, 0, 1, 1)" },
+		out: { value: "cubic-bezier(0, 0, 0.2, 1)" },
+		"in-out": { value: "cubic-bezier(0.4, 0, 0.2, 1)" }
+	},
+	durations: {
+		fastest: { value: "50ms" },
+		faster: { value: "100ms" },
+		fast: { value: "150ms" },
+		normal: { value: "200ms" },
+		slow: { value: "300ms" },
+		slower: { value: "400ms" },
+		slowest: { value: "500ms" }
+	},
+	radii: {
+		xs: { value: "0.125rem" },
+		sm: { value: "0.25rem" },
+		md: { value: "0.375rem" },
+		lg: { value: "0.5rem" },
+		xl: { value: "0.75rem" },
+		"2xl": { value: "1rem" },
+		"3xl": { value: "1.5rem" },
+		"4xl": { value: "2rem" },
+		full: { value: "9999px" }
+	},
+	fontWeights,
+	lineHeights,
+	fonts,
+	letterSpacings,
+	fontSizes,
+	shadows,
+	colors,
+	blurs: {
+		xs: { value: "4px" },
+		sm: { value: "8px" },
+		md: { value: "12px" },
+		lg: { value: "16px" },
+		xl: { value: "24px" },
+		"2xl": { value: "40px" },
+		"3xl": { value: "64px" }
+	},
+	spacing,
+	sizes,
+	animations
+});
+var definePreset = (config) => config;
+var index_default = definePreset({
+	name: "@pandacss/preset-panda",
+	theme: {
+		keyframes,
+		breakpoints,
+		tokens,
+		textStyles,
+		containerSizes
+	}
+});
+//#endregion
+//#region src/theme/utils.ts
+/**
+* Returns the foreground color to use on a "solid" background (bg.solid / bgSolid.solid).
+* Uses explicit _light/_dark values because solid backgrounds (s90 for colored,
+* s125 for neutral) don't fully invert at the crossover zone.
+*
+* - normal: s90 is dark/vivid in both modes → light text in both
+* - bright: s90 is vivid/light in light mode (dark text), vivid in dark mode (light text)
+* - neutral: solid is s125 which fully inverts → s00 auto-flips correctly
+*/
+function fgOnSolid(kind, ps) {
+	switch (kind) {
+		case "bright": return { value: {
+			_dark: ps("s00").value,
+			_light: ps("s125").value
+		} };
+		case "normal":
+		case "neutral": return ps("s00");
+	}
+}
+/**
+* Creates the bg/fg/bd semantic structure referencing a specific palette.
+* The palette must be a valid token path like "colors.blue" or "colors.neutral".
+*
+* bg — alpha-based layers from transparent (min) through surface/subtle/shaded
+*       up to opaque solid; provides hover/active/disabled for each.
+* bgSolid — solid-color equivalents of bg, using opaque s* steps instead of alpha a*.
+*           Use for surfaces that must not blend (popovers, dialogs, dropdowns).
+* fg — text hierarchy from max (strongest) through heading/body/muted/subtle,
+*       plus link and onSolid (contrast color for solid backgrounds).
+* bd — alpha-based borders at three weights: subtle, solid, strong.
+*/
+function createSemanticSet(palette = "neutral", kind = "normal") {
+	const ps = (step) => ({ value: `{${palette}.${step}}` });
+	const solidAccent = {
+		DEFAULT: ps(kind === "neutral" ? "s125" : "s90"),
+		hover: kind === "neutral" ? ps("s120") : ps("s100"),
+		active: kind === "neutral" ? ps("s120") : ps("s100"),
+		disabled: ps("s60")
+	};
+	return {
+		bg: {
+			min: {
+				DEFAULT: ps("a00"),
+				hover: ps("a05"),
+				active: ps("a10"),
+				disabled: ps("a00")
+			},
+			surface: {
+				DEFAULT: ps("a10"),
+				hover: ps("a15"),
+				active: ps("a20"),
+				disabled: ps("a05")
+			},
+			subtle: {
+				DEFAULT: ps("a30"),
+				hover: ps("a40"),
+				active: ps("a50"),
+				disabled: ps("a15")
+			},
+			shaded: {
+				DEFAULT: ps("a50"),
+				hover: ps("a60"),
+				active: ps("a65"),
+				disabled: ps("a30")
+			},
+			solid: solidAccent
+		},
+		bgSolid: {
+			min: {
+				DEFAULT: ps("s00"),
+				hover: ps("s05"),
+				active: ps("s10"),
+				disabled: ps("s00")
+			},
+			surface: {
+				DEFAULT: ps("s10"),
+				hover: ps("s15"),
+				active: ps("s20"),
+				disabled: ps("s05")
+			},
+			subtle: {
+				DEFAULT: ps("s30"),
+				hover: ps("s40"),
+				active: ps("s50"),
+				disabled: ps("s15")
+			},
+			shaded: {
+				DEFAULT: ps("s50"),
+				hover: ps("s60"),
+				active: ps("s65"),
+				disabled: ps("s30")
+			},
+			solid: solidAccent
+		},
+		fg: {
+			max: ps("s125"),
+			onSolid: fgOnSolid(kind, ps),
+			heading: ps("s120"),
+			body: {
+				DEFAULT: ps("s115"),
+				hover: ps("s120"),
+				disabled: ps("s90")
+			},
+			muted: {
+				DEFAULT: ps("s100"),
+				hover: ps("s110"),
+				disabled: ps("s80")
+			},
+			subtle: {
+				DEFAULT: ps("s90"),
+				hover: ps("s100"),
+				disabled: ps("s70")
+			},
+			link: {
+				DEFAULT: ps("s110"),
+				hover: ps("s120"),
+				active: ps("s110"),
+				disabled: ps("s90")
+			}
+		},
+		bd: {
+			subtle: {
+				DEFAULT: ps("a40"),
+				hover: ps("a50"),
+				active: ps("a50"),
+				disabled: ps("a20")
+			},
+			solid: {
+				DEFAULT: ps("a60"),
+				hover: ps("a70"),
+				active: ps("a70"),
+				disabled: ps("a40")
+			},
+			strong: {
+				DEFAULT: ps("a80"),
+				hover: ps("a90"),
+				active: ps("a90"),
+				disabled: ps("a60")
+			}
+		}
+	};
+}
+//#endregion
 //#region src/main.ts
-const preset = definePreset({
+const isObject = (value) => typeof value === "object" && value !== null && !Array.isArray(value);
+const scaleTokenValues = (tokens, factorVariable, { skipReferences = false } = {}) => {
+	const walk = (node) => {
+		if (!isObject(node)) return node;
+		if ("value" in node && typeof node["value"] === "string") {
+			const value = node["value"];
+			if (skipReferences && value.includes("{")) return node;
+			return {
+				...node,
+				value: `calc(${value} * var(${factorVariable}, 1))`
+			};
+		}
+		return Object.fromEntries(Object.entries(node).map(([key, value]) => [key, walk(value)]));
+	};
+	return walk(tokens);
+};
+const scaledSpacing = scaleTokenValues(index_default.theme.tokens.spacing, "--density-factor");
+const scaledRadii = scaleTokenValues(index_default.theme.tokens.radii, "--roundness-factor");
+const scaledLineHeights = scaleTokenValues(index_default.theme.tokens.lineHeights, "--leading-factor");
+const preset = definePreset$1({
 	name: "@hashintel/ds-theme",
+	globalCss: defineGlobalStyles({ "html, body": {
+		colorPalette: "neutral",
+		focusRingColor: "colorPalette.bd.solid",
+		fontFamily: "body",
+		bg: "neutral.s00",
+		color: "fg.heading",
+		"--roundness-factor": "1",
+		"--leading-factor": "1",
+		"--density-factor": "1"
+	} }),
 	conditions: { extend: {
-		light: ":root &, .light &, [data-theme=light] &",
-		dark: ".dark &, [data-theme=\"dark\"] &"
+		light: ":where(:root:not(.dark, [data-theme=\"dark\"])) &, .light &, [data-theme=light] &",
+		dark: ".dark &, [data-theme=\"dark\"] &",
+		supportHover: ["@media (hover: hover) and (pointer: fine)", "&:is(:hover, [data-support-hover])"],
+		focusVisibleWithin: "&:is(:has(:focus-visible), [data-focus-visible-within])",
+		inert: "&:is([inert], [inert] *, [data-inert])",
+		groupFocusVisibleWithin: ".group:is(:has(:focus-visible), [data-focus-visible-within]) &",
+		peerFocusVisibleWithin: ".peer:is(:has(:focus-visible), [data-focus-visible-within]) ~ &",
+		userValid: "&:is(:user-valid, [data-user-valid])",
+		userInvalid: "&:is(:user-invalid, [data-user-invalid])",
+		pointerFine: "@media (pointer: fine)",
+		pointerCoarse: "@media (pointer: coarse)",
+		pointerNone: "@media (pointer: none)",
+		anyPointerFine: "@media (any-pointer: fine)",
+		anyPointerCoarse: "@media (any-pointer: coarse)",
+		inHover: ":where(:is(*:hover, [data-in-hover])) &",
+		inFocus: ":where(:is(*:focus, [data-in-focus])) &",
+		inFocusVisible: ":where(:is(*:focus-visible, [data-in-focus-visible])) &",
+		inFocusWithin: ":where(:is(*:focus-within, [data-in-focus-within])) &",
+		hasHover: "&:is(:has(*:hover), [data-has-hover])",
+		hasFocus: "&:is(:has(*:focus), [data-has-focus])",
+		hasFocusVisible: "&:is(:has(*:focus-visible), [data-has-focus-visible])",
+		hasFocusWithin: "&:is(:has(*:focus-within), [data-has-focus-within])",
+		hasChecked: "&:is(:has(*:checked), [data-has-checked])"
 	} },
-	theme: {
+	utilities: { extend: {
+		leading: {
+			className: "leading",
+			values: {
+				tight: "0.9",
+				normal: "1",
+				loose: "1.1"
+			},
+			transform(value) {
+				return { "--leading-factor": value };
+			}
+		},
+		density: {
+			className: "density",
+			values: {
+				compact: "0.75",
+				normal: "1",
+				comfortable: "1.25"
+			},
+			transform(value) {
+				return { "--density-factor": value };
+			}
+		},
+		roundness: {
+			className: "roundness",
+			values: {
+				none: "0",
+				sm: "0.75",
+				md: "1",
+				lg: "1.5",
+				xl: "2"
+			},
+			transform(value) {
+				return { "--roundness-factor": value };
+			}
+		}
+	} },
+	theme: { extend: {
 		tokens: {
-			spacing,
-			fonts,
-			fontWeights,
-			fontSizes,
-			lineHeights,
-			radii
-		},
-		extend: { semanticTokens: { colors } }
-	}
+			fontSizes: fontSizes$1,
+			fontWeights: fontWeights$1,
+			fonts: {
+				display: { value: "var(--font-inter-tight), Inter Tight, ui-sans-serif, system-ui, sans-serif" },
+				body: { value: "var(--font-inter), Inter, ui-sans-serif, system-ui, sans-serif" },
+				mono: { value: "var(--font-geist-mono), Geist Mono, ui-monospace, SFMono-Regular, monospace" }
+			},
+			colors: staticColors,
+			sizes: index_default.theme.tokens.sizes,
+			shadows: index_default.theme.tokens.shadows,
+			spacing: scaledSpacing,
+			radii: scaledRadii,
+			lineHeights: scaledLineHeights
+		},
+		semanticTokens: {
+			colors: {
+				DEFAULT: createSemanticSet("colors.neutral", "neutral"),
+				...palettes,
+				status: {
+					info: blue,
+					success: green,
+					warning: orange,
+					error: red
+				}
+			},
+			shadows: { elevation: {
+				drop: {
+					macro: { value: "{shadows.xs}" },
+					micro: { value: "{shadows.2xs}" }
+				},
+				lift: {
+					macro: { value: "{shadows.sm}" },
+					micro: { value: "{shadows.xs}" }
+				},
+				raise: {
+					macro: { value: "{shadows.md}" },
+					micro: { value: "{shadows.sm}" }
+				},
+				float: {
+					macro: { value: "{shadows.lg}" },
+					micro: { value: "{shadows.md}" }
+				}
+			} }
+		},
+		textStyles: {
+			xs: { value: {
+				fontSize: "{fontSizes.xs}",
+				lineHeight: "calc(1em * 1.6 * var(--leading-factor, 1))",
+				letterSpacing: "0.01em"
+			} },
+			sm: { value: {
+				fontSize: "{fontSizes.sm}",
+				lineHeight: "calc(1em * 1.6 * var(--leading-factor, 1))",
+				letterSpacing: "0.005em"
+			} },
+			base: { value: {
+				fontSize: "{fontSizes.base}",
+				lineHeight: "calc(1em * 1.5 * var(--leading-factor, 1))",
+				letterSpacing: "0em"
+			} },
+			lg: { value: {
+				fontSize: "{fontSizes.lg}",
+				lineHeight: "calc(1em * 1.5 * var(--leading-factor, 1))",
+				letterSpacing: "-0.005em"
+			} },
+			xl: { value: {
+				fontSize: "{fontSizes.xl}",
+				lineHeight: "calc(1em * 1.4 * var(--leading-factor, 1))",
+				letterSpacing: "-0.01em"
+			} },
+			"2xl": { value: {
+				fontSize: "{fontSizes.2xl}",
+				lineHeight: "calc(1em * 1.4 * var(--leading-factor, 1))",
+				letterSpacing: "-0.015em"
+			} },
+			"3xl": { value: {
+				fontSize: "{fontSizes.3xl}",
+				lineHeight: "calc(1em * 1.3 * var(--leading-factor, 1))",
+				letterSpacing: "-0.02em"
+			} },
+			"4xl": { value: {
+				fontSize: "{fontSizes.4xl}",
+				lineHeight: "calc(1em * 1.3 * var(--leading-factor, 1))",
+				letterSpacing: "-0.025em"
+			} }
+		},
+		colorPalette: {
+			enabled: true,
+			include: [
+				"bg.*",
+				"bgSolid.*",
+				"fg.*",
+				"bd.*",
+				"status.*"
+			]
+		}
+	} }
 });
-var main_default = preset;
-
 //#endregion
-export { main_default as default, preset };
+export { preset as default, preset };