litestar-vite-plugin 0.15.0 → 0.16.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (23) hide show
  1. package/dist/js/astro.d.ts +17 -8
  2. package/dist/js/astro.js +43 -18
  3. package/dist/js/dev-server-index.html +115 -163
  4. package/dist/js/index.d.ts +19 -5
  5. package/dist/js/index.js +41 -18
  6. package/dist/js/nuxt.d.ts +16 -7
  7. package/dist/js/nuxt.js +42 -25
  8. package/dist/js/shared/bridge-schema.d.ts +3 -0
  9. package/dist/js/shared/bridge-schema.js +22 -0
  10. package/dist/js/shared/constants.d.ts +33 -0
  11. package/dist/js/shared/constants.js +10 -0
  12. package/dist/js/shared/emit-schemas-types.d.ts +8 -0
  13. package/dist/js/shared/emit-schemas-types.js +341 -0
  14. package/dist/js/shared/network.d.ts +30 -0
  15. package/dist/js/shared/network.js +25 -0
  16. package/dist/js/shared/typegen-core.d.ts +6 -0
  17. package/dist/js/shared/typegen-core.js +21 -0
  18. package/dist/js/shared/typegen-plugin.d.ts +2 -0
  19. package/dist/js/shared/typegen-plugin.js +17 -0
  20. package/dist/js/sveltekit.d.ts +16 -7
  21. package/dist/js/sveltekit.js +43 -22
  22. package/dist/js/typegen-cli.js +6 -2
  23. package/package.json +9 -4
package/dist/js/astro.d.ts CHANGED
@@ -17,10 +17,7 @@
17
17
  * integrations: [
18
18
  * litestar({
19
19
  * apiProxy: 'http://localhost:8000',
20
- * types: {
21
- * enabled: true,
22
- * output: 'src/generated',
23
- * },
20
+ * types: true,
24
21
  * }),
25
22
  * ],
26
23
  * });
@@ -110,19 +107,25 @@ export interface AstroTypesConfig {
110
107
  /**
111
108
  * Path where the OpenAPI schema is exported by Litestar.
112
109
  *
113
- * @default 'openapi.json'
110
+ * @default `${output}/openapi.json`
114
111
  */
115
112
  openapiPath?: string;
116
113
  /**
117
114
  * Path where route metadata is exported by Litestar.
118
115
  *
119
- * @default 'routes.json'
116
+ * @default `${output}/routes.json`
120
117
  */
121
118
  routesPath?: string;
119
+ /**
120
+ * Optional path for the generated schemas.ts helper file.
121
+ *
122
+ * @default `${output}/schemas.ts`
123
+ */
124
+ schemasTsPath?: string;
122
125
  /**
123
126
  * Path where Inertia page props metadata is exported by Litestar.
124
127
  *
125
- * @default 'inertia-pages.json'
128
+ * @default `${output}/inertia-pages.json`
126
129
  */
127
130
  pagePropsPath?: string;
128
131
  /**
@@ -149,6 +152,12 @@ export interface AstroTypesConfig {
149
152
  * @default true
150
153
  */
151
154
  generatePageProps?: boolean;
155
+ /**
156
+ * Generate schemas.ts with ergonomic form/response type helpers.
157
+ *
158
+ * @default true
159
+ */
160
+ generateSchemas?: boolean;
152
161
  /**
153
162
  * Register route() globally on window object.
154
163
  *
@@ -219,7 +228,7 @@ export interface LitestarAstroConfig {
219
228
  * apiPrefix: '/api',
220
229
  * types: {
221
230
  * enabled: true,
222
- * output: 'src/generated/api',
231
+ * output: 'src/generated',
223
232
  * },
224
233
  * }),
225
234
  * ],
package/dist/js/astro.js CHANGED
@@ -1,6 +1,8 @@
1
1
  import fs from "node:fs";
2
2
  import path from "node:path";
3
3
  import { readBridgeConfig } from "./shared/bridge-schema.js";
4
+ import { DEBOUNCE_MS } from "./shared/constants.js";
5
+ import { normalizeHost, resolveHotFilePath } from "./shared/network.js";
4
6
  import { createLitestarTypeGenPlugin } from "./shared/typegen-plugin.js";
5
7
  function resolveConfig(config = {}) {
6
8
  let hotFile;
@@ -20,7 +22,7 @@ function resolveConfig(config = {}) {
20
22
  if (runtime) {
21
23
  hasPythonConfig = true;
22
24
  const hot = runtime.hotFile;
23
- hotFile = path.isAbsolute(hot) ? hot : path.resolve(process.cwd(), runtime.bundleDir, hot);
25
+ hotFile = resolveHotFilePath(runtime.bundleDir, hot);
24
26
  proxyMode = runtime.proxyMode;
25
27
  port = runtime.port;
26
28
  pythonExecutor = runtime.executor;
@@ -29,47 +31,71 @@ function resolveConfig(config = {}) {
29
31
  }
30
32
  }
31
33
  let typesConfig = false;
34
+ const defaultTypesOutput = "src/generated";
35
+ const buildTypeDefaults = (output) => ({
36
+ openapiPath: path.join(output, "openapi.json"),
37
+ routesPath: path.join(output, "routes.json"),
38
+ pagePropsPath: path.join(output, "inertia-pages.json"),
39
+ schemasTsPath: path.join(output, "schemas.ts")
40
+ });
32
41
  if (config.types === true) {
42
+ const output = pythonTypesConfig?.output ?? defaultTypesOutput;
43
+ const defaults = buildTypeDefaults(output);
33
44
  typesConfig = {
34
45
  enabled: true,
35
- output: pythonTypesConfig?.output ?? "src/generated",
36
- openapiPath: pythonTypesConfig?.openapiPath ?? "openapi.json",
37
- routesPath: pythonTypesConfig?.routesPath ?? "routes.json",
38
- pagePropsPath: pythonTypesConfig?.pagePropsPath ?? "inertia-pages.json",
46
+ output,
47
+ openapiPath: pythonTypesConfig?.openapiPath ?? defaults.openapiPath,
48
+ routesPath: pythonTypesConfig?.routesPath ?? defaults.routesPath,
49
+ pagePropsPath: pythonTypesConfig?.pagePropsPath ?? defaults.pagePropsPath,
50
+ schemasTsPath: pythonTypesConfig?.schemasTsPath ?? defaults.schemasTsPath,
39
51
  generateZod: pythonTypesConfig?.generateZod ?? false,
40
52
  generateSdk: pythonTypesConfig?.generateSdk ?? true,
41
53
  generateRoutes: pythonTypesConfig?.generateRoutes ?? true,
42
54
  generatePageProps: pythonTypesConfig?.generatePageProps ?? true,
55
+ generateSchemas: pythonTypesConfig?.generateSchemas ?? true,
43
56
  globalRoute: pythonTypesConfig?.globalRoute ?? false,
44
- debounce: 300
57
+ debounce: DEBOUNCE_MS
45
58
  };
46
59
  } else if (typeof config.types === "object" && config.types !== null) {
60
+ const userProvidedOutput = Object.hasOwn(config.types, "output");
61
+ const output = config.types.output ?? pythonTypesConfig?.output ?? defaultTypesOutput;
62
+ const defaults = buildTypeDefaults(output);
63
+ const openapiFallback = userProvidedOutput ? defaults.openapiPath : pythonTypesConfig?.openapiPath ?? defaults.openapiPath;
64
+ const routesFallback = userProvidedOutput ? defaults.routesPath : pythonTypesConfig?.routesPath ?? defaults.routesPath;
65
+ const pagePropsFallback = userProvidedOutput ? defaults.pagePropsPath : pythonTypesConfig?.pagePropsPath ?? defaults.pagePropsPath;
66
+ const schemasFallback = userProvidedOutput ? defaults.schemasTsPath : pythonTypesConfig?.schemasTsPath ?? defaults.schemasTsPath;
47
67
  typesConfig = {
48
68
  enabled: config.types.enabled ?? true,
49
- output: config.types.output ?? pythonTypesConfig?.output ?? "src/generated",
50
- openapiPath: config.types.openapiPath ?? pythonTypesConfig?.openapiPath ?? "openapi.json",
51
- routesPath: config.types.routesPath ?? pythonTypesConfig?.routesPath ?? "routes.json",
52
- pagePropsPath: config.types.pagePropsPath ?? pythonTypesConfig?.pagePropsPath ?? "inertia-pages.json",
69
+ output,
70
+ openapiPath: config.types.openapiPath ?? openapiFallback,
71
+ routesPath: config.types.routesPath ?? routesFallback,
72
+ pagePropsPath: config.types.pagePropsPath ?? pagePropsFallback,
73
+ schemasTsPath: config.types.schemasTsPath ?? schemasFallback,
53
74
  generateZod: config.types.generateZod ?? pythonTypesConfig?.generateZod ?? false,
54
75
  generateSdk: config.types.generateSdk ?? pythonTypesConfig?.generateSdk ?? true,
55
76
  generateRoutes: config.types.generateRoutes ?? pythonTypesConfig?.generateRoutes ?? true,
56
77
  generatePageProps: config.types.generatePageProps ?? pythonTypesConfig?.generatePageProps ?? true,
78
+ generateSchemas: config.types.generateSchemas ?? pythonTypesConfig?.generateSchemas ?? true,
57
79
  globalRoute: config.types.globalRoute ?? pythonTypesConfig?.globalRoute ?? false,
58
- debounce: config.types.debounce ?? 300
80
+ debounce: config.types.debounce ?? DEBOUNCE_MS
59
81
  };
60
82
  } else if (config.types !== false && pythonTypesConfig?.enabled) {
83
+ const output = pythonTypesConfig.output ?? defaultTypesOutput;
84
+ const defaults = buildTypeDefaults(output);
61
85
  typesConfig = {
62
86
  enabled: true,
63
- output: pythonTypesConfig.output ?? "src/generated",
64
- openapiPath: pythonTypesConfig.openapiPath ?? "openapi.json",
65
- routesPath: pythonTypesConfig.routesPath ?? "routes.json",
66
- pagePropsPath: pythonTypesConfig.pagePropsPath ?? "inertia-pages.json",
87
+ output,
88
+ openapiPath: pythonTypesConfig.openapiPath ?? defaults.openapiPath,
89
+ routesPath: pythonTypesConfig.routesPath ?? defaults.routesPath,
90
+ pagePropsPath: pythonTypesConfig.pagePropsPath ?? defaults.pagePropsPath,
91
+ schemasTsPath: pythonTypesConfig.schemasTsPath ?? defaults.schemasTsPath,
67
92
  generateZod: pythonTypesConfig.generateZod ?? false,
68
93
  generateSdk: pythonTypesConfig.generateSdk ?? true,
69
94
  generateRoutes: pythonTypesConfig.generateRoutes ?? true,
70
95
  generatePageProps: pythonTypesConfig.generatePageProps ?? true,
96
+ generateSchemas: pythonTypesConfig.generateSchemas ?? true,
71
97
  globalRoute: pythonTypesConfig.globalRoute ?? false,
72
- debounce: 300
98
+ debounce: DEBOUNCE_MS
73
99
  };
74
100
  }
75
101
  return {
@@ -179,8 +205,7 @@ function litestarAstro(userConfig = {}) {
179
205
  // Always write hotfile - proxy mode needs it for dynamic target discovery
180
206
  "astro:server:start": ({ address, logger }) => {
181
207
  if (config.hotFile) {
182
- const rawAddr = address.address;
183
- const host = rawAddr === "::" || rawAddr === "::1" || rawAddr === "0.0.0.0" || rawAddr === "127.0.0.1" ? "localhost" : rawAddr;
208
+ const host = normalizeHost(address.address);
184
209
  const url = `http://${host}:${address.port}`;
185
210
  fs.mkdirSync(path.dirname(config.hotFile), { recursive: true });
186
211
  fs.writeFileSync(config.hotFile, url);
package/dist/js/dev-server-index.html CHANGED
@@ -1,179 +1,131 @@
1
1
  <!DOCTYPE html>
2
2
  <html lang="en" class="dark">
3
- <head>
4
- <meta charset="utf-8" />
5
- <meta name="viewport" content="width=device-width, initial-scale=1" />
6
-
7
- <title>Litestar Vite Dev Server</title>
8
-
9
- <!-- Fonts -->
10
- <link
11
- href="https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;700&display=swap"
12
- rel="stylesheet"
13
- />
14
-
15
- <script src="https://cdn.tailwindcss.com"></script>
16
- <script>
17
- tailwind.config = {
18
- darkMode: 'class',
19
- theme: {
20
- extend: {
21
- colors: {
22
- litestar: {
23
- primary: '#202235', // Dark Blue/Black
24
- accent: '#EDB641', // Gold
25
- 'accent-light': '#FFD480', // Light Gold
26
- gray: '#DCDFE4', // Light Gray
27
- success: '#00b648',
28
- error: '#ff7b72',
29
- }
30
- },
31
- fontFamily: {
32
- sans: ['Nunito', 'sans-serif'],
33
- },
34
- animation: {
35
- 'blob': 'blob 7s infinite',
36
- },
37
- keyframes: {
38
- blob: {
39
- '0%': { transform: 'translate(0px, 0px) scale(1)' },
40
- '33%': { transform: 'translate(30px, -50px) scale(1.1)' },
41
- '66%': { transform: 'translate(-20px, 20px) scale(0.9)' },
42
- '100%': { transform: 'translate(0px, 0px) scale(1)' },
43
- }
44
- }
45
- }
46
- }
47
- }
48
- </script>
49
- <style>
50
- body {
51
- background-color: #202235;
52
- background-image: radial-gradient(#2a2d45 1px, transparent 1px);
53
- background-size: 24px 24px;
54
- }
55
- </style>
56
- </head>
57
- <body class="antialiased min-h-screen flex flex-col items-center justify-center text-litestar-gray selection:bg-litestar-accent selection:text-litestar-primary overflow-hidden">
58
-
59
- <!-- Main Container -->
60
- <div class="relative w-full max-w-2xl px-6 py-12">
61
-
62
- <!-- Animated Background Blobs -->
63
- <div class="absolute top-0 -left-4 w-72 h-72 bg-litestar-accent/10 rounded-full mix-blend-multiply filter blur-xl opacity-70 animate-blob"></div>
64
- <div class="absolute top-0 -right-4 w-72 h-72 bg-purple-500/10 rounded-full mix-blend-multiply filter blur-xl opacity-70 animate-blob animation-delay-2000"></div>
65
- <div class="absolute -bottom-8 left-20 w-72 h-72 bg-blue-500/10 rounded-full mix-blend-multiply filter blur-xl opacity-70 animate-blob animation-delay-4000"></div>
66
-
67
- <!-- Card -->
68
- <div class="relative bg-gray-900/60 backdrop-blur-lg border border-white/10 rounded-3xl shadow-2xl overflow-hidden">
69
-
70
- <!-- Top Accent Line -->
71
- <div class="h-1 w-full bg-gradient-to-r from-transparent via-litestar-accent to-transparent opacity-50"></div>
72
-
73
- <div class="px-8 py-10 sm:px-12 sm:py-12">
74
-
75
- <!-- Header / Logos -->
76
- <div class="flex items-center justify-center space-x-8 mb-10">
77
- <!-- Litestar Logo -->
78
- <a href="https://litestar.dev" target="_blank" class="group transition-transform hover:scale-110 duration-300 relative">
79
- <div class="absolute inset-0 bg-litestar-accent/20 blur-xl rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
80
- <svg viewBox="0 52 410 250" xmlns="http://www.w3.org/2000/svg" class="relative h-20 w-auto drop-shadow-lg">
81
- <defs>
82
- <clipPath id="9eb7762d41">
83
- <path d="M 15.933594 105 L 328 105 L 328 259 L 15.933594 259 Z M 15.933594 105 " clip-rule="nonzero"/>
84
- </clipPath>
85
- <clipPath id="183d3cc178">
86
- <path d="M 142 78.769531 L 359.433594 78.769531 L 359.433594 296.269531 L 142 296.269531 Z M 142 78.769531 " clip-rule="nonzero"/>
87
- </clipPath>
88
- </defs>
89
- <g clip-path="url(#9eb7762d41)">
90
- <path fill="#edb641" d="M 147.625 240.3125 C 161.5 233.984375 173.554688 227.011719 183.425781 220.550781 C 202.304688 208.203125 226.4375 185.242188 227.761719 183.410156 L 218.917969 177.503906 L 211.257812 172.386719 L 235.503906 171.441406 L 243.296875 171.136719 L 245.414062 163.640625 L 252.007812 140.304688 L 260.402344 163.054688 L 263.097656 170.363281 L 270.890625 170.058594 L 295.136719 169.113281 L 276.078125 184.117188 L 269.953125 188.9375 L 272.652344 196.25 L 281.046875 218.996094 L 260.871094 205.523438 L 254.390625 201.195312 L 248.265625 206.015625 L 229.207031 221.023438 L 232.480469 209.425781 L 235.796875 197.691406 L 236.207031 196.234375 C 213.003906 213.585938 180.546875 230.304688 161.140625 236.488281 C 156.6875 237.90625 152.183594 239.179688 147.625 240.3125 Z M 101.992188 258.078125 C 136.382812 256.734375 177.355469 248 217.675781 222.363281 L 209.90625 249.867188 L 254.910156 214.4375 L 302.539062 246.246094 L 282.71875 192.539062 L 327.71875 157.109375 L 270.46875 159.34375 L 250.648438 105.636719 L 235.085938 160.726562 L 177.835938 162.964844 L 210.980469 185.097656 C 189.164062 204.921875 134.445312 247.195312 61.957031 250.03125 C 47.300781 250.601562 31.914062 249.558594 15.933594 246.394531 C 15.933594 246.394531 52.011719 260.035156 101.992188 258.078125 " fill-opacity="1" fill-rule="nonzero"/>
91
- </g>
92
- <g clip-path="url(#183d3cc178)">
93
- <path fill="#edb641" d="M 250.789062 78.96875 C 190.78125 78.96875 142.140625 127.570312 142.140625 187.519531 C 142.140625 198.875 143.886719 209.816406 147.121094 220.101562 C 151.847656 217.75 156.363281 215.316406 160.660156 212.84375 C 158.394531 204.789062 157.183594 196.296875 157.183594 187.519531 C 157.183594 135.871094 199.089844 93.996094 250.789062 93.996094 C 302.484375 93.996094 344.390625 135.871094 344.390625 187.519531 C 344.390625 239.171875 302.484375 281.042969 250.789062 281.042969 C 222.75 281.042969 197.597656 268.722656 180.441406 249.210938 C 175.453125 251.152344 170.402344 252.917969 165.289062 254.511719 C 185.183594 279.816406 216.082031 296.070312 250.789062 296.070312 C 310.792969 296.070312 359.433594 247.472656 359.433594 187.519531 C 359.433594 127.570312 310.792969 78.96875 250.789062 78.96875 " fill-opacity="1" fill-rule="nonzero"/>
94
- </g>
95
- <path fill="#edb641" d="M 92.292969 173.023438 L 98.289062 191.460938 L 117.691406 191.460938 L 101.992188 202.855469 L 107.988281 221.292969 L 92.292969 209.898438 L 76.59375 221.292969 L 82.589844 202.855469 L 66.894531 191.460938 L 86.296875 191.460938 L 92.292969 173.023438 " fill-opacity="1" fill-rule="nonzero"/>
96
- <path fill="#edb641" d="M 120.214844 112.25 L 125.390625 128.167969 L 142.140625 128.167969 L 128.589844 138 L 133.765625 153.917969 L 120.214844 144.082031 L 106.664062 153.917969 L 111.839844 138 L 98.289062 128.167969 L 115.039062 128.167969 L 120.214844 112.25 " fill-opacity="1" fill-rule="nonzero"/>
97
- <path fill="#edb641" d="M 34.695312 209.136719 L 37.71875 218.421875 L 47.492188 218.421875 L 39.585938 224.160156 L 42.605469 233.449219 L 34.695312 227.707031 L 26.792969 233.449219 L 29.8125 224.160156 L 21.90625 218.421875 L 31.679688 218.421875 L 34.695312 209.136719 " fill-opacity="1" fill-rule="nonzero"/>
98
- </svg>
99
- </a>
3
+ <head>
4
+ <meta charset="UTF-8">
5
+ <meta name="viewport" content="width=device-width, initial-scale=1.0">
6
+ <title>Litestar Vite Dev Server</title>
7
+ <style rel="stylesheet" crossorigin>@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-blur:initial;--tw-brightness:initial;--tw-contrast:initial;--tw-grayscale:initial;--tw-hue-rotate:initial;--tw-invert:initial;--tw-opacity:initial;--tw-saturate:initial;--tw-sepia:initial;--tw-drop-shadow:initial;--tw-drop-shadow-color:initial;--tw-drop-shadow-alpha:100%;--tw-drop-shadow-size:initial;--tw-backdrop-blur:initial;--tw-backdrop-brightness:initial;--tw-backdrop-contrast:initial;--tw-backdrop-grayscale:initial;--tw-backdrop-hue-rotate:initial;--tw-backdrop-invert:initial;--tw-backdrop-opacity:initial;--tw-backdrop-saturate:initial;--tw-backdrop-sepia:initial;--tw-duration:initial;--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-blue-500:oklch(62.3% .214 259.815);--color-purple-500:oklch(62.7% .265 303.9);--color-gray-900:oklch(21% .034 264.665);--color-white:#fff;--spacing:.25rem;--container-2xl:42rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5/2.25);--text-5xl:3rem;--text-5xl--line-height:1;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--tracking-tight:-.025em;--tracking-wide:.025em;--leading-relaxed:1.625;--radius-2xl:1rem;--radius-3xl:1.5rem;--drop-shadow-lg:0 4px 4px #00000026;--animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--blur-lg:16px;--blur-xl:24px;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono);--color-brand-primary:oklch(22% .03 265);--color-brand-accent:oklch(78% .16 85);--color-brand-accent-light:oklch(85% .12 85);--color-brand-gray:oklch(90% .01 265);--color-brand-success:oklch(65% .2 145);--color-brand-dots:oklch(26% .03 265);--animate-blob:blob 7s infinite ease-in-out}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}::-webkit-calendar-picker-indicator{line-height:1}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.absolute{position:absolute}.relative{position:relative}.inset-0{inset:calc(var(--spacing)*0)}.top-0{top:calc(var(--spacing)*0)}.-right-4{right:calc(var(--spacing)*-4)}.-bottom-8{bottom:calc(var(--spacing)*-8)}.-left-4{left:calc(var(--spacing)*-4)}.left-20{left:calc(var(--spacing)*20)}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-12{margin-top:calc(var(--spacing)*12)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-10{margin-bottom:calc(var(--spacing)*10)}.ml-2{margin-left:calc(var(--spacing)*2)}.flex{display:flex}.inline{display:inline}.inline-block{display:inline-block}.inline-flex{display:inline-flex}.h-1{height:calc(var(--spacing)*1)}.h-3{height:calc(var(--spacing)*3)}.h-4{height:calc(var(--spacing)*4)}.h-6{height:calc(var(--spacing)*6)}.h-16{height:calc(var(--spacing)*16)}.h-20{height:calc(var(--spacing)*20)}.h-72{height:calc(var(--spacing)*72)}.h-full{height:100%}.h-px{height:1px}.min-h-screen{min-height:100vh}.w-3{width:calc(var(--spacing)*3)}.w-4{width:calc(var(--spacing)*4)}.w-6{width:calc(var(--spacing)*6)}.w-72{width:calc(var(--spacing)*72)}.w-auto{width:auto}.w-full{width:100%}.max-w-2xl{max-width:var(--container-2xl)}.animate-blob{animation:var(--animate-blob)}.animate-ping{animation:var(--animate-ping)}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-center{justify-content:center}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-8>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*8)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*8)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-x-3>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*3)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-x-reverse)))}:where(.space-x-8>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*8)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*8)*calc(1 - var(--tw-space-x-reverse)))}.overflow-hidden{overflow:hidden}.rounded-2xl{border-radius:var(--radius-2xl)}.rounded-3xl{border-radius:var(--radius-3xl)}.rounded-full{border-radius:3.40282e38px}.border{border-style:var(--tw-border-style);border-width:1px}.border-t{border-top-style:var(--tw-border-style);border-top-width:1px}.border-white\/10{border-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.border-white\/10{border-color:color-mix(in oklab,var(--color-white)10%,transparent)}}.bg-blue-500\/10{background-color:#3080ff1a}@supports (color:color-mix(in lab,red,red)){.bg-blue-500\/10{background-color:color-mix(in oklab,var(--color-blue-500)10%,transparent)}}.bg-brand-accent\/10{background-color:#e6ad001a}@supports (color:color-mix(in lab,red,red)){.bg-brand-accent\/10{background-color:color-mix(in oklab,var(--color-brand-accent)10%,transparent)}}.bg-brand-accent\/20{background-color:#e6ad0033}@supports (color:color-mix(in lab,red,red)){.bg-brand-accent\/20{background-color:color-mix(in oklab,var(--color-brand-accent)20%,transparent)}}.bg-brand-accent\/30{background-color:#e6ad004d}@supports (color:color-mix(in lab,red,red)){.bg-brand-accent\/30{background-color:color-mix(in oklab,var(--color-brand-accent)30%,transparent)}}.bg-brand-success{background-color:var(--color-brand-success)}.bg-gray-900\/60{background-color:#10182899}@supports (color:color-mix(in lab,red,red)){.bg-gray-900\/60{background-color:color-mix(in oklab,var(--color-gray-900)60%,transparent)}}.bg-purple-500\/10{background-color:#ac4bff1a}@supports (color:color-mix(in lab,red,red)){.bg-purple-500\/10{background-color:color-mix(in oklab,var(--color-purple-500)10%,transparent)}}.bg-purple-500\/20{background-color:#ac4bff33}@supports (color:color-mix(in lab,red,red)){.bg-purple-500\/20{background-color:color-mix(in oklab,var(--color-purple-500)20%,transparent)}}.bg-white\/5{background-color:#ffffff0d}@supports (color:color-mix(in lab,red,red)){.bg-white\/5{background-color:color-mix(in oklab,var(--color-white)5%,transparent)}}.bg-linear-to-r{--tw-gradient-position:to right}@supports (background-image:linear-gradient(in lab,red,red)){.bg-linear-to-r{--tw-gradient-position:to right in oklab}}.bg-linear-to-r{background-image:linear-gradient(var(--tw-gradient-stops))}.from-brand-accent{--tw-gradient-from:var(--color-brand-accent);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.from-transparent{--tw-gradient-from:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.via-brand-accent{--tw-gradient-via:var(--color-brand-accent);--tw-gradient-via-stops:var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-via)var(--tw-gradient-via-position),var(--tw-gradient-to)var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-via-stops)}.to-brand-accent-light{--tw-gradient-to:var(--color-brand-accent-light);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.p-6{padding:calc(var(--spacing)*6)}.px-5{padding-inline:calc(var(--spacing)*5)}.px-6{padding-inline:calc(var(--spacing)*6)}.px-8{padding-inline:calc(var(--spacing)*8)}.py-2\.5{padding-block:calc(var(--spacing)*2.5)}.py-10{padding-block:calc(var(--spacing)*10)}.py-12{padding-block:calc(var(--spacing)*12)}.pt-8{padding-top:calc(var(--spacing)*8)}.text-center{text-align:center}.font-mono{font-family:var(--font-mono)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.leading-relaxed{--tw-leading:var(--leading-relaxed);line-height:var(--leading-relaxed)}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-brand-accent{color:var(--color-brand-accent)}.text-brand-gray{color:var(--color-brand-gray)}.text-brand-gray\/30{color:#dbdee54d}@supports (color:color-mix(in lab,red,red)){.text-brand-gray\/30{color:color-mix(in oklab,var(--color-brand-gray)30%,transparent)}}.text-brand-gray\/60{color:#dbdee599}@supports (color:color-mix(in lab,red,red)){.text-brand-gray\/60{color:color-mix(in oklab,var(--color-brand-gray)60%,transparent)}}.text-brand-gray\/80{color:#dbdee5cc}@supports (color:color-mix(in lab,red,red)){.text-brand-gray\/80{color:color-mix(in oklab,var(--color-brand-gray)80%,transparent)}}.text-brand-success{color:var(--color-brand-success)}.text-transparent{color:#0000}.text-white{color:var(--color-white)}.uppercase{text-transform:uppercase}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.opacity-0{opacity:0}.opacity-50{opacity:.5}.opacity-70{opacity:.7}.opacity-75{opacity:.75}.mix-blend-multiply{mix-blend-mode:multiply}.shadow-2xl{--tw-shadow:0 25px 50px -12px var(--tw-shadow-color,#00000040);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-inner{--tw-shadow:inset 0 2px 4px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.blur-xl{--tw-blur:blur(var(--blur-xl));filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.drop-shadow-lg{--tw-drop-shadow-size:drop-shadow(0 4px 4px var(--tw-drop-shadow-color,#00000026));--tw-drop-shadow:drop-shadow(var(--drop-shadow-lg));filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.filter{filter:var(--tw-blur,)var(--tw-brightness,)var(--tw-contrast,)var(--tw-grayscale,)var(--tw-hue-rotate,)var(--tw-invert,)var(--tw-saturate,)var(--tw-sepia,)var(--tw-drop-shadow,)}.backdrop-blur-lg{--tw-backdrop-blur:blur(var(--blur-lg));-webkit-backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,);backdrop-filter:var(--tw-backdrop-blur,)var(--tw-backdrop-brightness,)var(--tw-backdrop-contrast,)var(--tw-backdrop-grayscale,)var(--tw-backdrop-hue-rotate,)var(--tw-backdrop-invert,)var(--tw-backdrop-opacity,)var(--tw-backdrop-saturate,)var(--tw-backdrop-sepia,)}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}.animation-delay-2000{animation-delay:2s}.animation-delay-4000{animation-delay:4s}@media(hover:hover){.group-hover\:translate-x-1:is(:where(.group):hover *){--tw-translate-x:calc(var(--spacing)*1);translate:var(--tw-translate-x)var(--tw-translate-y)}.group-hover\:bg-brand-accent:is(:where(.group):hover *){background-color:var(--color-brand-accent)}.group-hover\:text-brand-accent-light:is(:where(.group):hover *){color:var(--color-brand-accent-light)}.group-hover\:text-white:is(:where(.group):hover *){color:var(--color-white)}.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}.hover\:scale-110:hover{--tw-scale-x:110%;--tw-scale-y:110%;--tw-scale-z:110%;scale:var(--tw-scale-x)var(--tw-scale-y)}.hover\:border-brand-accent\/50:hover{border-color:#e6ad0080}@supports (color:color-mix(in lab,red,red)){.hover\:border-brand-accent\/50:hover{border-color:color-mix(in oklab,var(--color-brand-accent)50%,transparent)}}.hover\:bg-white\/10:hover{background-color:#ffffff1a}@supports (color:color-mix(in lab,red,red)){.hover\:bg-white\/10:hover{background-color:color-mix(in oklab,var(--color-white)10%,transparent)}}}@media(min-width:40rem){.sm\:px-12{padding-inline:calc(var(--spacing)*12)}.sm\:py-12{padding-block:calc(var(--spacing)*12)}.sm\:text-5xl{font-size:var(--text-5xl);line-height:var(--tw-leading,var(--text-5xl--line-height))}}}@keyframes blob{0%,to{transform:translate(0)scale(1)}33%{transform:translate(30px,-50px)scale(1.1)}66%{transform:translate(-20px,20px)scale(.9)}}body{background-color:var(--color-brand-primary);background-image:radial-gradient(var(--color-brand-dots)1px,transparent 1px);color:var(--color-brand-gray);background-size:24px 24px}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-blur{syntax:"*";inherits:false}@property --tw-brightness{syntax:"*";inherits:false}@property --tw-contrast{syntax:"*";inherits:false}@property --tw-grayscale{syntax:"*";inherits:false}@property --tw-hue-rotate{syntax:"*";inherits:false}@property --tw-invert{syntax:"*";inherits:false}@property --tw-opacity{syntax:"*";inherits:false}@property --tw-saturate{syntax:"*";inherits:false}@property --tw-sepia{syntax:"*";inherits:false}@property --tw-drop-shadow{syntax:"*";inherits:false}@property --tw-drop-shadow-color{syntax:"*";inherits:false}@property --tw-drop-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-drop-shadow-size{syntax:"*";inherits:false}@property --tw-backdrop-blur{syntax:"*";inherits:false}@property --tw-backdrop-brightness{syntax:"*";inherits:false}@property --tw-backdrop-contrast{syntax:"*";inherits:false}@property --tw-backdrop-grayscale{syntax:"*";inherits:false}@property --tw-backdrop-hue-rotate{syntax:"*";inherits:false}@property --tw-backdrop-invert{syntax:"*";inherits:false}@property --tw-backdrop-opacity{syntax:"*";inherits:false}@property --tw-backdrop-saturate{syntax:"*";inherits:false}@property --tw-backdrop-sepia{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-scale-x{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-y{syntax:"*";inherits:false;initial-value:1}@property --tw-scale-z{syntax:"*";inherits:false;initial-value:1}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}</style>
8
+ </head>
9
+ <body class="antialiased min-h-screen flex flex-col items-center justify-center overflow-hidden">
10
+
11
+ <!-- Main Container -->
12
+ <div class="relative w-full max-w-2xl px-6 py-12">
13
+
14
+ <!-- Animated Background Blobs -->
15
+ <div class="absolute top-0 -left-4 w-72 h-72 bg-brand-accent/10 rounded-full mix-blend-multiply filter blur-xl opacity-70 animate-blob"></div>
16
+ <div class="absolute top-0 -right-4 w-72 h-72 bg-purple-500/10 rounded-full mix-blend-multiply filter blur-xl opacity-70 animate-blob animation-delay-2000"></div>
17
+ <div class="absolute -bottom-8 left-20 w-72 h-72 bg-blue-500/10 rounded-full mix-blend-multiply filter blur-xl opacity-70 animate-blob animation-delay-4000"></div>
18
+
19
+ <!-- Card -->
20
+ <div class="relative bg-gray-900/60 backdrop-blur-lg border border-white/10 rounded-3xl shadow-2xl overflow-hidden">
21
+
22
+ <!-- Top Accent Line -->
23
+ <div class="h-1 w-full bg-linear-to-r from-transparent via-brand-accent to-transparent opacity-50"></div>
24
+
25
+ <div class="px-8 py-10 sm:px-12 sm:py-12">
26
+
27
+ <!-- Header / Logos -->
28
+ <div class="flex items-center justify-center space-x-8 mb-10">
29
+ <!-- Litestar Logo -->
30
+ <a href="https://litestar.dev" target="_blank" class="group transition-transform hover:scale-110 duration-300 relative">
31
+ <div class="absolute inset-0 bg-brand-accent/20 blur-xl rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
32
+ <svg viewBox="0 52 410 250" xmlns="http://www.w3.org/2000/svg" class="relative h-20 w-auto drop-shadow-lg">
33
+ <defs>
34
+ <clipPath id="9eb7762d41">
35
+ <path d="M 15.933594 105 L 328 105 L 328 259 L 15.933594 259 Z M 15.933594 105 " clip-rule="nonzero"/>
36
+ </clipPath>
37
+ <clipPath id="183d3cc178">
38
+ <path d="M 142 78.769531 L 359.433594 78.769531 L 359.433594 296.269531 L 142 296.269531 Z M 142 78.769531 " clip-rule="nonzero"/>
39
+ </clipPath>
40
+ </defs>
41
+ <g clip-path="url(#9eb7762d41)">
42
+ <path fill="#edb641" d="M 147.625 240.3125 C 161.5 233.984375 173.554688 227.011719 183.425781 220.550781 C 202.304688 208.203125 226.4375 185.242188 227.761719 183.410156 L 218.917969 177.503906 L 211.257812 172.386719 L 235.503906 171.441406 L 243.296875 171.136719 L 245.414062 163.640625 L 252.007812 140.304688 L 260.402344 163.054688 L 263.097656 170.363281 L 270.890625 170.058594 L 295.136719 169.113281 L 276.078125 184.117188 L 269.953125 188.9375 L 272.652344 196.25 L 281.046875 218.996094 L 260.871094 205.523438 L 254.390625 201.195312 L 248.265625 206.015625 L 229.207031 221.023438 L 232.480469 209.425781 L 235.796875 197.691406 L 236.207031 196.234375 C 213.003906 213.585938 180.546875 230.304688 161.140625 236.488281 C 156.6875 237.90625 152.183594 239.179688 147.625 240.3125 Z M 101.992188 258.078125 C 136.382812 256.734375 177.355469 248 217.675781 222.363281 L 209.90625 249.867188 L 254.910156 214.4375 L 302.539062 246.246094 L 282.71875 192.539062 L 327.71875 157.109375 L 270.46875 159.34375 L 250.648438 105.636719 L 235.085938 160.726562 L 177.835938 162.964844 L 210.980469 185.097656 C 189.164062 204.921875 134.445312 247.195312 61.957031 250.03125 C 47.300781 250.601562 31.914062 249.558594 15.933594 246.394531 C 15.933594 246.394531 52.011719 260.035156 101.992188 258.078125 " fill-opacity="1" fill-rule="nonzero"/>
43
+ </g>
44
+ <g clip-path="url(#183d3cc178)">
45
+ <path fill="#edb641" d="M 250.789062 78.96875 C 190.78125 78.96875 142.140625 127.570312 142.140625 187.519531 C 142.140625 198.875 143.886719 209.816406 147.121094 220.101562 C 151.847656 217.75 156.363281 215.316406 160.660156 212.84375 C 158.394531 204.789062 157.183594 196.296875 157.183594 187.519531 C 157.183594 135.871094 199.089844 93.996094 250.789062 93.996094 C 302.484375 93.996094 344.390625 135.871094 344.390625 187.519531 C 344.390625 239.171875 302.484375 281.042969 250.789062 281.042969 C 222.75 281.042969 197.597656 268.722656 180.441406 249.210938 C 175.453125 251.152344 170.402344 252.917969 165.289062 254.511719 C 185.183594 279.816406 216.082031 296.070312 250.789062 296.070312 C 310.792969 296.070312 359.433594 247.472656 359.433594 187.519531 C 359.433594 127.570312 310.792969 78.96875 250.789062 78.96875 " fill-opacity="1" fill-rule="nonzero"/>
46
+ </g>
47
+ <path fill="#edb641" d="M 92.292969 173.023438 L 98.289062 191.460938 L 117.691406 191.460938 L 101.992188 202.855469 L 107.988281 221.292969 L 92.292969 209.898438 L 76.59375 221.292969 L 82.589844 202.855469 L 66.894531 191.460938 L 86.296875 191.460938 L 92.292969 173.023438 " fill-opacity="1" fill-rule="nonzero"/>
48
+ <path fill="#edb641" d="M 120.214844 112.25 L 125.390625 128.167969 L 142.140625 128.167969 L 128.589844 138 L 133.765625 153.917969 L 120.214844 144.082031 L 106.664062 153.917969 L 111.839844 138 L 98.289062 128.167969 L 115.039062 128.167969 L 120.214844 112.25 " fill-opacity="1" fill-rule="nonzero"/>
49
+ <path fill="#edb641" d="M 34.695312 209.136719 L 37.71875 218.421875 L 47.492188 218.421875 L 39.585938 224.160156 L 42.605469 233.449219 L 34.695312 227.707031 L 26.792969 233.449219 L 29.8125 224.160156 L 21.90625 218.421875 L 31.679688 218.421875 L 34.695312 209.136719 " fill-opacity="1" fill-rule="nonzero"/>
50
+ </svg>
51
+ </a>
52
+
53
+ <!-- Connection Icon -->
54
+ <div class="flex items-center text-brand-gray/30">
55
+ <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
56
+ <path stroke-linecap="round" stroke-linejoin="round" d="M12 4v16m8-8H4" />
57
+ </svg>
58
+ </div>
100
59
 
101
- <!-- Connection Icon -->
102
- <div class="flex items-center text-litestar-gray/30">
103
- <svg xmlns="http://www.w3.org/2000/svg" class="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
104
- <path stroke-linecap="round" stroke-linejoin="round" d="M12 4v16m8-8H4" />
105
- </svg>
106
- </div>
60
+ <!-- Vite Logo -->
61
+ <a href="https://vitejs.dev" target="_blank" class="group transition-transform hover:scale-110 duration-300 relative">
62
+ <div class="absolute inset-0 bg-purple-500/20 blur-xl rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
63
+ <svg viewBox="0 0 410 404" class="relative h-16 w-auto drop-shadow-lg" fill="none" xmlns="http://www.w3.org/2000/svg">
64
+ <path d="M399.641 59.5246L215.643 388.545C211.844 395.338 202.084 395.378 198.228 388.618L10.5817 59.5563C6.38087 52.1896 12.6802 43.2665 21.0281 44.7586L205.223 77.6824C206.398 77.8924 207.601 77.8904 208.776 77.6763L389.119 44.8058C397.439 43.2894 403.768 52.1434 399.641 59.5246Z" fill="url(#paint0_linear)"/>
65
+ <path d="M292.965 1.5744L156.801 28.2552C154.563 28.6937 152.906 30.5903 152.771 32.8664L144.395 174.33C144.198 177.662 147.258 180.248 150.51 179.498L188.42 170.749C191.967 169.931 195.172 173.055 194.443 176.622L183.18 231.775C182.422 235.487 185.907 238.661 189.532 237.56L212.947 230.446C216.577 229.344 220.065 232.527 219.297 236.242L201.398 322.875C200.278 328.294 207.486 331.249 210.492 326.603L212.5 323.5L323.454 102.072C325.312 98.3645 322.108 94.137 318.036 94.9228L279.014 102.454C275.347 103.161 272.227 99.746 273.262 96.1583L298.731 7.86689C299.767 4.27314 296.636 0.855181 292.965 1.5744Z" fill="url(#paint1_linear)"/>
66
+ <defs>
67
+ <linearGradient id="paint0_linear" x1="6.00017" y1="32.9999" x2="235" y2="344" gradientUnits="userSpaceOnUse">
68
+ <stop stop-color="#41D1FF"/>
69
+ <stop offset="1" stop-color="#BD34FE"/>
70
+ </linearGradient>
71
+ <linearGradient id="paint1_linear" x1="194.651" y1="8.81818" x2="236.076" y2="292.989" gradientUnits="userSpaceOnUse">
72
+ <stop stop-color="#FFEA83"/>
73
+ <stop offset="0.0833333" stop-color="#FFDD35"/>
74
+ <stop offset="1" stop-color="#FFA800"/>
75
+ </linearGradient>
76
+ </defs>
77
+ </svg>
78
+ </a>
79
+ </div>
107
80
 
108
- <!-- Vite Logo -->
109
- <a href="https://vitejs.dev" target="_blank" class="group transition-transform hover:scale-110 duration-300 relative">
110
- <div class="absolute inset-0 bg-purple-500/20 blur-xl rounded-full opacity-0 group-hover:opacity-100 transition-opacity duration-300"></div>
111
- <svg viewBox="0 0 410 404" class="relative h-16 w-auto drop-shadow-lg" fill="none" xmlns="http://www.w3.org/2000/svg">
112
- <path d="M399.641 59.5246L215.643 388.545C211.844 395.338 202.084 395.378 198.228 388.618L10.5817 59.5563C6.38087 52.1896 12.6802 43.2665 21.0281 44.7586L205.223 77.6824C206.398 77.8924 207.601 77.8904 208.776 77.6763L389.119 44.8058C397.439 43.2894 403.768 52.1434 399.641 59.5246Z" fill="url(#paint0_linear)"/>
113
- <path d="M292.965 1.5744L156.801 28.2552C154.563 28.6937 152.906 30.5903 152.771 32.8664L144.395 174.33C144.198 177.662 147.258 180.248 150.51 179.498L188.42 170.749C191.967 169.931 195.172 173.055 194.443 176.622L183.18 231.775C182.422 235.487 185.907 238.661 189.532 237.56L212.947 230.446C216.577 229.344 220.065 232.527 219.297 236.242L201.398 322.875C200.278 328.294 207.486 331.249 210.492 326.603L212.5 323.5L323.454 102.072C325.312 98.3645 322.108 94.137 318.036 94.9228L279.014 102.454C275.347 103.161 272.227 99.746 273.262 96.1583L298.731 7.86689C299.767 4.27314 296.636 0.855181 292.965 1.5744Z" fill="url(#paint1_linear)"/>
114
- <defs>
115
- <linearGradient id="paint0_linear" x1="6.00017" y1="32.9999" x2="235" y2="344" gradientUnits="userSpaceOnUse">
116
- <stop stop-color="#41D1FF"/>
117
- <stop offset="1" stop-color="#BD34FE"/>
118
- </linearGradient>
119
- <linearGradient id="paint1_linear" x1="194.651" y1="8.81818" x2="236.076" y2="292.989" gradientUnits="userSpaceOnUse">
120
- <stop stop-color="#FFEA83"/>
121
- <stop offset="0.0833333" stop-color="#FFDD35"/>
122
- <stop offset="1" stop-color="#FFA800"/>
123
- </linearGradient>
124
- </defs>
125
- </svg>
126
- </a>
81
+ <!-- Content -->
82
+ <div class="relative text-center space-y-8">
83
+ <div>
84
+ <h1 class="text-4xl sm:text-5xl font-bold text-white tracking-tight mb-2">
85
+ Litestar <span class="text-transparent bg-clip-text bg-linear-to-r from-brand-accent to-brand-accent-light">Vite</span>
86
+ </h1>
87
+ <p class="text-brand-gray/60 text-lg font-medium">Frontend Development Server</p>
127
88
  </div>
128
89
 
129
- <!-- Content -->
130
- <div class="relative text-center space-y-8">
131
- <div>
132
- <h1 class="text-4xl sm:text-5xl font-bold text-white tracking-tight mb-2">
133
- Litestar <span class="text-transparent bg-clip-text bg-gradient-to-r from-litestar-accent to-litestar-accent-light">Vite</span>
134
- </h1>
135
- <p class="text-litestar-gray/60 text-lg font-medium">Frontend Development Server</p>
90
+ <div class="p-6 rounded-2xl bg-white/5 border border-white/10 shadow-inner">
91
+ <div class="flex items-center justify-center space-x-3 mb-4">
92
+ <span class="relative flex h-3 w-3">
93
+ <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-brand-success opacity-75"></span>
94
+ <span class="relative inline-flex rounded-full h-3 w-3 bg-brand-success"></span>
95
+ </span>
96
+ <span class="text-sm font-semibold text-brand-success tracking-wide uppercase">Server Active</span>
136
97
  </div>
137
98
 
138
- <div class="p-6 rounded-2xl bg-white/5 border border-white/10 shadow-inner">
139
- <div class="flex items-center justify-center space-x-3 mb-4">
140
- <span class="relative flex h-3 w-3">
141
- <span class="animate-ping absolute inline-flex h-full w-full rounded-full bg-litestar-success opacity-75"></span>
142
- <span class="relative inline-flex rounded-full h-3 w-3 bg-litestar-success"></span>
143
- </span>
144
- <span class="text-sm font-semibold text-litestar-success tracking-wide uppercase">Server Active</span>
145
- </div>
146
-
147
- <p class="text-litestar-gray leading-relaxed">
148
- This server provides <strong class="text-white">Hot Module Replacement (HMR)</strong> for your assets.
149
- To view your application, ensure your Litestar backend is running.
150
- </p>
151
- </div>
99
+ <p class="text-brand-gray leading-relaxed">
100
+ This server provides <strong class="text-white">Hot Module Replacement (HMR)</strong> for your assets.
101
+ To view your application, ensure your Litestar backend is running.
102
+ </p>
103
+ </div>
152
104
 
153
- <div class="space-y-2">
154
- <p class="text-litestar-gray/80">
155
- Your application is configured at:
156
- </p>
157
- <div class="inline-block group">
158
- <a href="{{ APP_URL }}" class="text-2xl font-mono font-bold text-litestar-accent group-hover:text-litestar-accent-light transition-colors">
159
- {{ APP_URL }}
160
- </a>
161
- <div class="h-px w-full bg-litestar-accent/30 group-hover:bg-litestar-accent transition-colors mt-1"></div>
162
- </div>
105
+ <div class="space-y-2">
106
+ <p class="text-brand-gray/80">
107
+ Your application is configured at:
108
+ </p>
109
+ <div class="inline-block group">
110
+ <a href="{{ APP_URL }}" class="text-2xl font-mono font-bold text-brand-accent group-hover:text-brand-accent-light transition-colors">
111
+ {{ APP_URL }}
112
+ </a>
113
+ <div class="h-px w-full bg-brand-accent/30 group-hover:bg-brand-accent transition-colors mt-1"></div>
163
114
  </div>
164
115
  </div>
116
+ </div>
165
117
 
166
- <!-- Footer -->
167
- <div class="mt-12 pt-8 border-t border-white/10 flex justify-center">
168
- <a href="https://litestar.dev/docs/vite" target="_blank" class="group inline-flex items-center px-5 py-2.5 rounded-full bg-white/5 hover:bg-white/10 border border-white/10 hover:border-litestar-accent/50 transition-all duration-300">
169
- <span class="text-sm font-semibold text-litestar-gray group-hover:text-white transition-colors">Documentation</span>
170
- <svg xmlns="http://www.w3.org/2000/svg" class="ml-2 h-4 w-4 text-litestar-accent group-hover:translate-x-1 transition-transform" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
171
- <path stroke-linecap="round" stroke-linejoin="round" d="M14 5l7 7m0 0l-7 7m7-7H3" />
172
- </svg>
173
- </a>
174
- </div>
118
+ <!-- Footer -->
119
+ <div class="mt-12 pt-8 border-t border-white/10 flex justify-center">
120
+ <a href="https://docs.litestar.dev/latest/topics/integrations/vite/" target="_blank" class="group inline-flex items-center px-5 py-2.5 rounded-full bg-white/5 hover:bg-white/10 border border-white/10 hover:border-brand-accent/50 transition-all duration-300">
121
+ <span class="text-sm font-semibold text-brand-gray group-hover:text-white transition-colors">Documentation</span>
122
+ <svg xmlns="http://www.w3.org/2000/svg" class="ml-2 h-4 w-4 text-brand-accent group-hover:translate-x-1 transition-transform" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="2">
123
+ <path stroke-linecap="round" stroke-linejoin="round" d="M14 5l7 7m0 0l-7 7m7-7H3" />
124
+ </svg>
125
+ </a>
175
126
  </div>
176
127
  </div>
177
128
  </div>
178
- </body>
129
+ </div>
130
+ </body>
179
131
  </html>
package/dist/js/index.d.ts CHANGED
@@ -18,28 +18,33 @@ export interface TypesConfig {
18
18
  /**
19
19
  * Path to output generated TypeScript types.
20
20
  *
21
- * @default 'src/types/api'
21
+ * @default 'src/generated'
22
22
  */
23
23
  output?: string;
24
24
  /**
25
25
  * Path where the OpenAPI schema is exported by Litestar.
26
26
  * The Vite plugin watches this file and runs @hey-api/openapi-ts when it changes.
27
27
  *
28
- * @default 'openapi.json'
28
+ * @default 'src/generated/openapi.json'
29
29
  */
30
30
  openapiPath?: string;
31
31
  /**
32
32
  * Path where route metadata is exported by Litestar.
33
33
  * The Vite plugin watches this file for route helper generation.
34
34
  *
35
- * @default 'routes.json'
35
+ * @default 'src/generated/routes.json'
36
36
  */
37
37
  routesPath?: string;
38
+ /**
39
+ * Optional path for the generated schemas.ts helper file.
40
+ * Defaults to `${output}/schemas.ts` when not set.
41
+ */
42
+ schemasTsPath?: string;
38
43
  /**
39
44
  * Path where Inertia page props metadata is exported by Litestar.
40
45
  * The Vite plugin watches this file for page props type generation.
41
46
  *
42
- * @default 'inertia-pages.json'
47
+ * @default 'src/generated/inertia-pages.json'
43
48
  */
44
49
  pagePropsPath?: string;
45
50
  /**
@@ -51,7 +56,7 @@ export interface TypesConfig {
51
56
  /**
52
57
  * Generate a typed SDK client (fetch) in addition to types.
53
58
  *
54
- * @default false
59
+ * @default true
55
60
  */
56
61
  generateSdk?: boolean;
57
62
  /**
@@ -70,6 +75,15 @@ export interface TypesConfig {
70
75
  * @default true
71
76
  */
72
77
  generatePageProps?: boolean;
78
+ /**
79
+ * Generate schemas.ts with ergonomic form/response type helpers.
80
+ *
81
+ * Creates helper types like FormInput<'api:login'> and FormResponse<'api:login', 201>
82
+ * that wrap hey-api generated types with cleaner DX.
83
+ *
84
+ * @default true
85
+ */
86
+ generateSchemas?: boolean;
73
87
  /**
74
88
  * Register route() function globally on window object.
75
89
  *