@tanstack/cta-ui 0.15.3 → 0.15.5

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 (88) hide show
  1. package/dist/assets/index-BLGJkAxX.css +1 -0
  2. package/dist/assets/index-DPjMQkKx.js +208 -0
  3. package/dist/assets/index-DPjMQkKx.js.map +1 -0
  4. package/dist/index.html +3 -2
  5. package/index.html +1 -0
  6. package/lib/engine-handling/create-app-wrapper.ts +3 -4
  7. package/lib/engine-handling/generate-initial-payload.ts +12 -20
  8. package/lib/engine-handling/server-environment.ts +2 -2
  9. package/lib/index.ts +33 -15
  10. package/lib-dist/engine-handling/create-app-wrapper.js +3 -2
  11. package/lib-dist/engine-handling/generate-initial-payload.d.ts +8 -6
  12. package/lib-dist/engine-handling/generate-initial-payload.js +9 -14
  13. package/lib-dist/engine-handling/server-environment.d.ts +3 -3
  14. package/lib-dist/index.d.ts +1 -0
  15. package/lib-dist/index.js +29 -11
  16. package/package.json +3 -32
  17. package/src/index.tsx +2 -42
  18. package/src/main.tsx +0 -1
  19. package/src/styles.css +2 -0
  20. package/src/types.d.ts +13 -8
  21. package/dist/assets/index-BktnQA5a.js +0 -213
  22. package/dist/assets/index-BktnQA5a.js.map +0 -1
  23. package/dist/assets/index-CpoUtYXp.css +0 -1
  24. package/dist/logo-color-100w.png +0 -0
  25. package/dist/logo192.png +0 -0
  26. package/dist/logo512.png +0 -0
  27. package/dist/tailwind.svg +0 -1
  28. package/dist/tanstack.png +0 -0
  29. package/dist/typescript.svg +0 -1
  30. package/lib/engine-handling/framework-registration.ts +0 -11
  31. package/lib-dist/engine-handling/framework-registration.d.ts +0 -1
  32. package/lib-dist/engine-handling/framework-registration.js +0 -10
  33. package/public/logo-color-100w.png +0 -0
  34. package/public/logo192.png +0 -0
  35. package/public/logo512.png +0 -0
  36. package/public/tailwind.svg +0 -1
  37. package/public/tanstack.png +0 -0
  38. package/public/typescript.svg +0 -1
  39. package/src/components/StatusList.tsx +0 -22
  40. package/src/components/add-on-info-dialog.tsx +0 -39
  41. package/src/components/background-animation.tsx +0 -229
  42. package/src/components/cta-sidebar.tsx +0 -50
  43. package/src/components/custom-add-on-dialog.tsx +0 -79
  44. package/src/components/file-navigator.tsx +0 -203
  45. package/src/components/file-tree.tsx +0 -35
  46. package/src/components/file-viewer.tsx +0 -67
  47. package/src/components/header.tsx +0 -31
  48. package/src/components/sidebar-items/add-ons.tsx +0 -94
  49. package/src/components/sidebar-items/mode-selector.tsx +0 -57
  50. package/src/components/sidebar-items/project-name.tsx +0 -28
  51. package/src/components/sidebar-items/run-add-ons.tsx +0 -71
  52. package/src/components/sidebar-items/run-create-app.tsx +0 -82
  53. package/src/components/sidebar-items/starter.tsx +0 -123
  54. package/src/components/sidebar-items/typescript-switch.tsx +0 -52
  55. package/src/components/starters-carousel.tsx +0 -45
  56. package/src/components/startup-dialog.tsx +0 -71
  57. package/src/components/toaster.tsx +0 -29
  58. package/src/components/ui/button.tsx +0 -61
  59. package/src/components/ui/carousel.tsx +0 -239
  60. package/src/components/ui/checkbox.tsx +0 -30
  61. package/src/components/ui/dialog.tsx +0 -138
  62. package/src/components/ui/dropdown-menu.tsx +0 -255
  63. package/src/components/ui/input.tsx +0 -21
  64. package/src/components/ui/label.tsx +0 -22
  65. package/src/components/ui/popover.tsx +0 -46
  66. package/src/components/ui/separator.tsx +0 -28
  67. package/src/components/ui/sheet.tsx +0 -137
  68. package/src/components/ui/sidebar.tsx +0 -726
  69. package/src/components/ui/skeleton.tsx +0 -13
  70. package/src/components/ui/sonner.tsx +0 -23
  71. package/src/components/ui/switch.tsx +0 -29
  72. package/src/components/ui/table.tsx +0 -114
  73. package/src/components/ui/tabs.tsx +0 -64
  74. package/src/components/ui/toggle-group.tsx +0 -71
  75. package/src/components/ui/toggle.tsx +0 -49
  76. package/src/components/ui/tooltip.tsx +0 -61
  77. package/src/components/ui/tree-view.tsx +0 -497
  78. package/src/file-classes.ts +0 -54
  79. package/src/hooks/use-mobile.ts +0 -19
  80. package/src/hooks/use-mounted.ts +0 -9
  81. package/src/hooks/use-preferred-reduced-motion.ts +0 -27
  82. package/src/hooks/use-streaming-status.ts +0 -70
  83. package/src/lib/api.ts +0 -92
  84. package/src/lib/utils.ts +0 -6
  85. package/src/store/add-ons.ts +0 -81
  86. package/src/store/project.ts +0 -347
  87. package/tests/store/add-ons.test.ts +0 -222
  88. package/vitest.config.ts +0 -6
package/dist/index.html CHANGED
@@ -10,8 +10,9 @@
10
10
  rel="stylesheet"
11
11
  href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
12
12
  />
13
- <script type="module" crossorigin src="/assets/index-BktnQA5a.js"></script>
14
- <link rel="stylesheet" crossorigin href="/assets/index-CpoUtYXp.css">
13
+ <!-- PRELOAD-->
14
+ <script type="module" crossorigin src="/assets/index-DPjMQkKx.js"></script>
15
+ <link rel="stylesheet" crossorigin href="/assets/index-BLGJkAxX.css">
15
16
  </head>
16
17
  <body class="dark">
17
18
  <div id="root"></div>
package/index.html CHANGED
@@ -10,6 +10,7 @@
10
10
  rel="stylesheet"
11
11
  href="https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap"
12
12
  />
13
+ <!-- PRELOAD-->
13
14
  </head>
14
15
  <body class="dark">
15
16
  <div id="root"></div>
package/lib/engine-handling/create-app-wrapper.ts CHANGED
@@ -11,8 +11,6 @@ import {
11
11
 
12
12
  import { TMP_TARGET_DIR } from '../constants.js'
13
13
 
14
- import { registerFrameworks } from './framework-registration.js'
15
-
16
14
  import { cleanUpFileArray, cleanUpFiles } from './file-helpers.js'
17
15
  import { getApplicationMode, getProjectPath } from './server-environment.js'
18
16
 
@@ -33,9 +31,10 @@ export async function createAppWrapper(
33
31
  environmentFactory?: () => Environment
34
32
  },
35
33
  ) {
36
- registerFrameworks()
37
-
38
34
  const framework = getFrameworkById(projectOptions.framework)!
35
+ if (!framework) {
36
+ throw new Error(`Framework ${projectOptions.framework} not found`)
37
+ }
39
38
 
40
39
  let starter: Starter | undefined
41
40
  const addOns: Array<string> = [...projectOptions.chosenAddOns]
package/lib/engine-handling/generate-initial-payload.ts CHANGED
@@ -12,7 +12,6 @@ import {
12
12
 
13
13
  import { cleanUpFiles } from './file-helpers.js'
14
14
  import { createAppWrapper } from './create-app-wrapper.js'
15
- import { registerFrameworks } from './framework-registration.js'
16
15
  import {
17
16
  getApplicationMode,
18
17
  getForcedAddOns,
@@ -40,8 +39,6 @@ function convertAddOnToAddOnInfo(addOn: AddOn): AddOnInfo {
40
39
  }
41
40
 
42
41
  export async function generateInitialPayload() {
43
- registerFrameworks()
44
-
45
42
  const projectPath = getProjectPath()
46
43
  const applicationMode = getApplicationMode()
47
44
 
@@ -76,23 +73,23 @@ export async function generateInitialPayload() {
76
73
  }
77
74
  }
78
75
 
76
+ const serializedOptions = await getSerializedOptions()
77
+
79
78
  const rawRegistry = await getRawRegistry(getRegistryURL())
80
79
  const registryAddOns = await getRegistryAddOns(getRegistryURL())
81
80
 
82
- const serializedOptions = await getSerializedOptions()
83
-
84
81
  const output = await createAppWrapper(serializedOptions, {
85
82
  dryRun: true,
86
83
  })
87
84
 
88
85
  const framework = await getFrameworkById(serializedOptions.framework)
89
86
 
90
- const codeRouterAddOns = getAllAddOns(framework!, 'code-router').map(
91
- convertAddOnToAddOnInfo,
92
- )
93
-
94
- const fileRouterAddOns = getAllAddOns(framework!, 'file-router').map(
95
- convertAddOnToAddOnInfo,
87
+ const addOns = Object.keys(framework!.supportedModes).reduce(
88
+ (acc, mode) => {
89
+ acc[mode] = getAllAddOns(framework!, mode).map(convertAddOnToAddOnInfo)
90
+ return acc
91
+ },
92
+ {} as Record<string, Array<AddOnInfo>>,
96
93
  )
97
94
 
98
95
  for (const addOnInfo of registryAddOns) {
@@ -100,11 +97,8 @@ export async function generateInitialPayload() {
100
97
  (addOn) => addOn.url === addOnInfo.id,
101
98
  )
102
99
  if (addOnFramework?.framework === serializedOptions.framework) {
103
- if (addOnInfo.modes.includes('code-router')) {
104
- codeRouterAddOns.push(convertAddOnToAddOnInfo(addOnInfo))
105
- }
106
- if (addOnInfo.modes.includes('file-router')) {
107
- fileRouterAddOns.push(convertAddOnToAddOnInfo(addOnInfo))
100
+ for (const mode of addOnInfo.modes) {
101
+ addOns[mode].push(convertAddOnToAddOnInfo(addOnInfo))
108
102
  }
109
103
  }
110
104
  }
@@ -117,12 +111,10 @@ export async function generateInitialPayload() {
117
111
  }
118
112
 
119
113
  return {
114
+ supportedModes: framework!.supportedModes,
120
115
  applicationMode,
121
116
  localFiles,
122
- addOns: {
123
- 'code-router': codeRouterAddOns,
124
- 'file-router': fileRouterAddOns,
125
- },
117
+ addOns,
126
118
  options: serializedOptions,
127
119
  output,
128
120
  forcedRouterMode,
package/lib/engine-handling/server-environment.ts CHANGED
@@ -1,11 +1,11 @@
1
- import type { Mode, SerializedOptions } from '@tanstack/cta-engine'
1
+ import type { SerializedOptions } from '@tanstack/cta-engine'
2
2
 
3
3
  export type ServerEnvironment = {
4
4
  projectPath: string
5
5
  mode: 'add' | 'setup'
6
6
  options?: SerializedOptions
7
7
  addOns?: Array<string>
8
- forcedRouterMode?: Mode
8
+ forcedRouterMode?: string
9
9
  forcedAddOns?: Array<string>
10
10
  registry?: string
11
11
  }
package/lib/index.ts CHANGED
@@ -22,9 +22,10 @@ export function launchUI(
22
22
  options: Partial<ServerEnvironment> & {
23
23
  port?: number
24
24
  environmentFactory?: () => Environment
25
+ webBase?: string
25
26
  },
26
27
  ) {
27
- const { port: requestedPort, ...rest } = options
28
+ const { port: requestedPort, webBase, ...rest } = options
28
29
  setServerEnvironment(rest)
29
30
 
30
31
  const app = express()
@@ -33,10 +34,11 @@ export function launchUI(
33
34
  app.use(express.json())
34
35
  app.use(express.urlencoded({ extended: true }))
35
36
 
37
+ const packagePath = resolve(dirname(fileURLToPath(import.meta.url)), '..')
38
+
36
39
  const launchUI = !process.env.CTA_DISABLE_UI
37
40
  if (launchUI) {
38
- const packagePath = resolve(dirname(fileURLToPath(import.meta.url)), '..')
39
- app.use(express.static(resolve(packagePath, 'dist')))
41
+ app.use(express.static(webBase || resolve(packagePath, 'dist')))
40
42
  }
41
43
 
42
44
  app.post('/api/add-to-app', async (req, res) => {
@@ -54,21 +56,37 @@ export function launchUI(
54
56
  })
55
57
 
56
58
  app.post('/api/dry-run-add-to-app', async (req, res) => {
57
- res.send(
58
- await addToAppWrapper(req.body.addOns, {
59
- dryRun: true,
60
- environmentFactory: options.environmentFactory,
61
- }),
62
- )
59
+ try {
60
+ res.send(
61
+ await addToAppWrapper(req.body.addOns, {
62
+ dryRun: true,
63
+ environmentFactory: options.environmentFactory,
64
+ }),
65
+ )
66
+ } catch {
67
+ res.send({
68
+ files: {},
69
+ commands: [],
70
+ deletedFiles: [],
71
+ })
72
+ }
63
73
  })
64
74
 
65
75
  app.post('/api/dry-run-create-app', async (req, res) => {
66
- res.send(
67
- await createAppWrapper(req.body.options, {
68
- dryRun: true,
69
- environmentFactory: options.environmentFactory,
70
- }),
71
- )
76
+ try {
77
+ res.send(
78
+ await createAppWrapper(req.body.options, {
79
+ dryRun: true,
80
+ environmentFactory: options.environmentFactory,
81
+ }),
82
+ )
83
+ } catch {
84
+ res.send({
85
+ files: {},
86
+ commands: [],
87
+ deletedFiles: [],
88
+ })
89
+ }
72
90
  })
73
91
 
74
92
  app.get('/api/initial-payload', async (_req, res) => {
package/lib-dist/engine-handling/create-app-wrapper.js CHANGED
@@ -1,12 +1,13 @@
1
1
  import { resolve } from 'node:path';
2
2
  import { createApp, createDefaultEnvironment, createMemoryEnvironment, finalizeAddOns, getFrameworkById, loadStarter, } from '@tanstack/cta-engine';
3
3
  import { TMP_TARGET_DIR } from '../constants.js';
4
- import { registerFrameworks } from './framework-registration.js';
5
4
  import { cleanUpFileArray, cleanUpFiles } from './file-helpers.js';
6
5
  import { getApplicationMode, getProjectPath } from './server-environment.js';
7
6
  export async function createAppWrapper(projectOptions, opts) {
8
- registerFrameworks();
9
7
  const framework = getFrameworkById(projectOptions.framework);
8
+ if (!framework) {
9
+ throw new Error(`Framework ${projectOptions.framework} not found`);
10
+ }
10
11
  let starter;
11
12
  const addOns = [...projectOptions.chosenAddOns];
12
13
  if (projectOptions.starter) {
package/lib-dist/engine-handling/generate-initial-payload.d.ts CHANGED
@@ -1,12 +1,14 @@
1
1
  import type { SerializedOptions } from '@tanstack/cta-engine';
2
2
  import type { AddOnInfo } from '../types.js';
3
3
  export declare function generateInitialPayload(): Promise<{
4
+ supportedModes: Record<string, {
5
+ displayName: string;
6
+ description: string;
7
+ forceTypescript: boolean;
8
+ }>;
4
9
  applicationMode: "add" | "setup";
5
10
  localFiles: Record<string, string>;
6
- addOns: {
7
- 'code-router': AddOnInfo[];
8
- 'file-router': AddOnInfo[];
9
- };
11
+ addOns: Record<string, AddOnInfo[]>;
10
12
  options: SerializedOptions;
11
13
  output: {
12
14
  files: Record<string, string>;
@@ -16,7 +18,7 @@ export declare function generateInitialPayload(): Promise<{
16
18
  args: Array<string>;
17
19
  }>;
18
20
  } | undefined;
19
- forcedRouterMode: import("@tanstack/cta-engine").Mode | undefined;
21
+ forcedRouterMode: string | undefined;
20
22
  forcedAddOns: string[];
21
23
  registry: {
22
24
  "add-ons": never[];
@@ -25,7 +27,7 @@ export declare function generateInitialPayload(): Promise<{
25
27
  description: string;
26
28
  url: string;
27
29
  framework: string;
28
- mode: "code-router" | "file-router";
30
+ mode: string;
29
31
  banner?: string | undefined;
30
32
  }[];
31
33
  };
package/lib-dist/engine-handling/generate-initial-payload.js CHANGED
@@ -2,7 +2,6 @@ import { basename, resolve } from 'node:path';
2
2
  import { createSerializedOptionsFromPersisted, getAllAddOns, getFrameworkById, getRawRegistry, getRegistryAddOns, readConfigFile, recursivelyGatherFiles, } from '@tanstack/cta-engine';
3
3
  import { cleanUpFiles } from './file-helpers.js';
4
4
  import { createAppWrapper } from './create-app-wrapper.js';
5
- import { registerFrameworks } from './framework-registration.js';
6
5
  import { getApplicationMode, getForcedAddOns, getForcedRouterMode, getProjectOptions, getProjectPath, getRegistry as getRegistryURL, } from './server-environment.js';
7
6
  function convertAddOnToAddOnInfo(addOn) {
8
7
  return {
@@ -18,7 +17,6 @@ function convertAddOnToAddOnInfo(addOn) {
18
17
  };
19
18
  }
20
19
  export async function generateInitialPayload() {
21
- registerFrameworks();
22
20
  const projectPath = getProjectPath();
23
21
  const applicationMode = getApplicationMode();
24
22
  const localFiles = applicationMode === 'add'
@@ -48,23 +46,22 @@ export async function generateInitialPayload() {
48
46
  return createSerializedOptionsFromPersisted(persistedOptions);
49
47
  }
50
48
  }
49
+ const serializedOptions = await getSerializedOptions();
51
50
  const rawRegistry = await getRawRegistry(getRegistryURL());
52
51
  const registryAddOns = await getRegistryAddOns(getRegistryURL());
53
- const serializedOptions = await getSerializedOptions();
54
52
  const output = await createAppWrapper(serializedOptions, {
55
53
  dryRun: true,
56
54
  });
57
55
  const framework = await getFrameworkById(serializedOptions.framework);
58
- const codeRouterAddOns = getAllAddOns(framework, 'code-router').map(convertAddOnToAddOnInfo);
59
- const fileRouterAddOns = getAllAddOns(framework, 'file-router').map(convertAddOnToAddOnInfo);
56
+ const addOns = Object.keys(framework.supportedModes).reduce((acc, mode) => {
57
+ acc[mode] = getAllAddOns(framework, mode).map(convertAddOnToAddOnInfo);
58
+ return acc;
59
+ }, {});
60
60
  for (const addOnInfo of registryAddOns) {
61
61
  const addOnFramework = rawRegistry?.['add-ons']?.find((addOn) => addOn.url === addOnInfo.id);
62
62
  if (addOnFramework?.framework === serializedOptions.framework) {
63
- if (addOnInfo.modes.includes('code-router')) {
64
- codeRouterAddOns.push(convertAddOnToAddOnInfo(addOnInfo));
65
- }
66
- if (addOnInfo.modes.includes('file-router')) {
67
- fileRouterAddOns.push(convertAddOnToAddOnInfo(addOnInfo));
63
+ for (const mode of addOnInfo.modes) {
64
+ addOns[mode].push(convertAddOnToAddOnInfo(addOnInfo));
68
65
  }
69
66
  }
70
67
  }
@@ -73,12 +70,10 @@ export async function generateInitialPayload() {
73
70
  starters: (rawRegistry?.starters || []).filter((starter) => starter.framework === serializedOptions.framework),
74
71
  };
75
72
  return {
73
+ supportedModes: framework.supportedModes,
76
74
  applicationMode,
77
75
  localFiles,
78
- addOns: {
79
- 'code-router': codeRouterAddOns,
80
- 'file-router': fileRouterAddOns,
81
- },
76
+ addOns,
82
77
  options: serializedOptions,
83
78
  output,
84
79
  forcedRouterMode,
package/lib-dist/engine-handling/server-environment.d.ts CHANGED
@@ -1,10 +1,10 @@
1
- import type { Mode, SerializedOptions } from '@tanstack/cta-engine';
1
+ import type { SerializedOptions } from '@tanstack/cta-engine';
2
2
  export type ServerEnvironment = {
3
3
  projectPath: string;
4
4
  mode: 'add' | 'setup';
5
5
  options?: SerializedOptions;
6
6
  addOns?: Array<string>;
7
- forcedRouterMode?: Mode;
7
+ forcedRouterMode?: string;
8
8
  forcedAddOns?: Array<string>;
9
9
  registry?: string;
10
10
  };
@@ -12,6 +12,6 @@ export declare function setServerEnvironment(options: Partial<ServerEnvironment>
12
12
  export declare const getProjectPath: () => string;
13
13
  export declare const getApplicationMode: () => "add" | "setup";
14
14
  export declare const getProjectOptions: () => SerializedOptions;
15
- export declare const getForcedRouterMode: () => Mode | undefined;
15
+ export declare const getForcedRouterMode: () => string | undefined;
16
16
  export declare const getForcedAddOns: () => string[];
17
17
  export declare const getRegistry: () => string | undefined;
package/lib-dist/index.d.ts CHANGED
@@ -3,4 +3,5 @@ import type { Environment } from '@tanstack/cta-engine';
3
3
  export declare function launchUI(options: Partial<ServerEnvironment> & {
4
4
  port?: number;
5
5
  environmentFactory?: () => Environment;
6
+ webBase?: string;
6
7
  }): void;
package/lib-dist/index.js CHANGED
@@ -9,16 +9,16 @@ import { createAppWrapper } from './engine-handling/create-app-wrapper.js';
9
9
  import { generateInitialPayload } from './engine-handling/generate-initial-payload.js';
10
10
  import { setServerEnvironment } from './engine-handling/server-environment.js';
11
11
  export function launchUI(options) {
12
- const { port: requestedPort, ...rest } = options;
12
+ const { port: requestedPort, webBase, ...rest } = options;
13
13
  setServerEnvironment(rest);
14
14
  const app = express();
15
15
  app.use(cors());
16
16
  app.use(express.json());
17
17
  app.use(express.urlencoded({ extended: true }));
18
+ const packagePath = resolve(dirname(fileURLToPath(import.meta.url)), '..');
18
19
  const launchUI = !process.env.CTA_DISABLE_UI;
19
20
  if (launchUI) {
20
- const packagePath = resolve(dirname(fileURLToPath(import.meta.url)), '..');
21
- app.use(express.static(resolve(packagePath, 'dist')));
21
+ app.use(express.static(webBase || resolve(packagePath, 'dist')));
22
22
  }
23
23
  app.post('/api/add-to-app', async (req, res) => {
24
24
  await addToAppWrapper(req.body.addOns, {
@@ -33,16 +33,34 @@ export function launchUI(options) {
33
33
  });
34
34
  });
35
35
  app.post('/api/dry-run-add-to-app', async (req, res) => {
36
- res.send(await addToAppWrapper(req.body.addOns, {
37
- dryRun: true,
38
- environmentFactory: options.environmentFactory,
39
- }));
36
+ try {
37
+ res.send(await addToAppWrapper(req.body.addOns, {
38
+ dryRun: true,
39
+ environmentFactory: options.environmentFactory,
40
+ }));
41
+ }
42
+ catch {
43
+ res.send({
44
+ files: {},
45
+ commands: [],
46
+ deletedFiles: [],
47
+ });
48
+ }
40
49
  });
41
50
  app.post('/api/dry-run-create-app', async (req, res) => {
42
- res.send(await createAppWrapper(req.body.options, {
43
- dryRun: true,
44
- environmentFactory: options.environmentFactory,
45
- }));
51
+ try {
52
+ res.send(await createAppWrapper(req.body.options, {
53
+ dryRun: true,
54
+ environmentFactory: options.environmentFactory,
55
+ }));
56
+ }
57
+ catch {
58
+ res.send({
59
+ files: {},
60
+ commands: [],
61
+ deletedFiles: [],
62
+ });
63
+ }
46
64
  });
47
65
  app.get('/api/initial-payload', async (_req, res) => {
48
66
  res.send(await generateInitialPayload());
package/package.json CHANGED
@@ -4,50 +4,21 @@
4
4
  "main": "./lib-dist/index.js",
5
5
  "types": "./lib-dist/index.d.ts",
6
6
  "dependencies": {
7
- "@codemirror/lang-css": "^6.3.1",
8
- "@codemirror/lang-html": "^6.4.9",
9
- "@codemirror/lang-javascript": "^6.2.3",
10
- "@codemirror/lang-json": "^6.0.1",
11
- "@radix-ui/react-accordion": "^1.2.3",
12
- "@radix-ui/react-checkbox": "^1.1.4",
13
- "@radix-ui/react-dialog": "^1.1.10",
14
- "@radix-ui/react-dropdown-menu": "^2.1.11",
15
- "@radix-ui/react-label": "^2.1.4",
16
- "@radix-ui/react-popover": "^1.1.10",
17
- "@radix-ui/react-separator": "^1.1.4",
18
- "@radix-ui/react-slot": "^1.2.0",
19
- "@radix-ui/react-switch": "^1.2.2",
20
- "@radix-ui/react-tabs": "^1.1.3",
21
- "@radix-ui/react-toggle": "^1.1.2",
22
- "@radix-ui/react-toggle-group": "^1.1.2",
23
- "@radix-ui/react-tooltip": "^1.2.3",
24
7
  "@tailwindcss/vite": "^4.1.6",
25
- "@tanstack/react-query": "^5.66.5",
26
- "@tanstack/react-query-devtools": "^5.66.5",
27
- "@uiw/codemirror-theme-github": "^4.23.10",
28
- "@uiw/react-codemirror": "^4.23.10",
29
8
  "chalk": "^5.4.1",
30
- "class-variance-authority": "^0.7.1",
31
- "clsx": "^2.1.1",
32
9
  "cors": "^2.8.5",
33
- "embla-carousel-react": "^8.6.0",
34
10
  "execa": "^9.5.2",
35
11
  "express": "^4.21.2",
36
- "jotai-tanstack-query": "^0.9.0",
37
- "lucide-react": "^0.476.0",
38
12
  "next-themes": "^0.4.6",
39
13
  "react": "^19.0.0",
40
- "react-codemirror-merge": "^4.23.10",
41
14
  "react-dom": "^19.0.0",
42
15
  "sonner": "^2.0.3",
43
16
  "tailwind-merge": "^3.0.2",
44
17
  "tailwindcss": "^4.1.6",
45
18
  "tailwindcss-animate": "^1.0.7",
46
19
  "vite-tsconfig-paths": "^5.1.4",
47
- "zustand": "^5.0.3",
48
- "@tanstack/cta-framework-react-cra": "0.15.3",
49
- "@tanstack/cta-framework-solid": "0.15.3",
50
- "@tanstack/cta-engine": "0.15.3"
20
+ "@tanstack/cta-engine": "0.15.5",
21
+ "@tanstack/cta-ui-base": "0.15.5"
51
22
  },
52
23
  "devDependencies": {
53
24
  "@tailwindcss/typography": "^0.5.16",
@@ -66,6 +37,6 @@
66
37
  "vitest": "^3.0.5",
67
38
  "web-vitals": "^4.2.4"
68
39
  },
69
- "version": "0.15.3",
40
+ "version": "0.15.5",
70
41
  "scripts": {}
71
42
  }
package/src/index.tsx CHANGED
@@ -1,43 +1,3 @@
1
- import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
2
- import FileNavigator from '@/components/file-navigator'
3
- import StartupDialog from '@/components/startup-dialog'
1
+ import App from '@tanstack/cta-ui-base'
4
2
 
5
- import { Toaster } from '@/components/toaster'
6
-
7
- import { AppSidebar } from '@/components/cta-sidebar'
8
- import { AppHeader } from '@/components/header'
9
- import { BackgroundAnimation } from '@/components/background-animation'
10
- import { useManager } from '@/store/project'
11
-
12
- const queryClient = new QueryClient()
13
-
14
- function Content() {
15
- useManager()
16
-
17
- return (
18
- <main className="min-w-[1280px]">
19
- <BackgroundAnimation />
20
- <div className="min-h-dvh p-2 sm:p-4 space-y-2 sm:space-y-4 @container">
21
- <AppHeader />
22
- <div className="flex flex-row">
23
- <div className="w-1/3 @8xl:w-1/4 pr-2">
24
- <AppSidebar />
25
- </div>
26
- <div className="w-2/3 @8xl:w-3/4 pl-2">
27
- <FileNavigator />
28
- </div>
29
- </div>
30
- </div>
31
- <StartupDialog />
32
- </main>
33
- )
34
- }
35
-
36
- export default function RootComponent() {
37
- return (
38
- <QueryClientProvider client={queryClient}>
39
- <Content />
40
- <Toaster />
41
- </QueryClientProvider>
42
- )
43
- }
3
+ export default App
package/src/main.tsx CHANGED
@@ -1,4 +1,3 @@
1
- import React from 'react'
2
1
  import ReactDOM from 'react-dom/client'
3
2
 
4
3
  import './styles.css'
package/src/styles.css CHANGED
@@ -1,4 +1,6 @@
1
1
  @import 'tailwindcss';
2
+ @source "../node_modules/@tanstack/cta-ui-base";
3
+
2
4
  @layer theme, base, components, utilities;
3
5
 
4
6
  @plugin "tailwindcss-animate";
package/src/types.d.ts CHANGED
@@ -1,4 +1,4 @@
1
- import type { Mode, StatusStepType } from '@tanstack/cta-engine'
1
+ import type { StatusStepType } from '@tanstack/cta-engine'
2
2
 
3
3
  export type ApplicationMode = 'add' | 'setup' | 'none'
4
4
 
@@ -10,7 +10,7 @@ export type StarterInfo = {
10
10
  version: string
11
11
  author: string
12
12
  license: string
13
- mode: Mode
13
+ mode: string
14
14
  typescript: boolean
15
15
  tailwind: boolean
16
16
  banner?: string
@@ -33,7 +33,7 @@ export type AddOnInfo = {
33
33
  name: string
34
34
  description: string
35
35
  type: 'add-on' | 'example' | 'starter' | 'toolchain'
36
- modes: Array<'code-router' | 'file-router'>
36
+ modes: Array<string>
37
37
  smallLogo?: string
38
38
  logo?: string
39
39
  link: string
@@ -70,15 +70,20 @@ export type Registry = {
70
70
  }
71
71
 
72
72
  export type InitialData = {
73
+ supportedModes: Record<
74
+ string,
75
+ {
76
+ displayName: string
77
+ description: string
78
+ forceTypescript: boolean
79
+ }
80
+ >
73
81
  options: SerializedOptions
74
82
  output: GeneratorOutput
75
83
  localFiles: Record<string, string>
76
- addOns: {
77
- 'code-router': Array<AddOnInfo>
78
- 'file-router': Array<AddOnInfo>
79
- }
84
+ addOns: Record<string, Array<AddOnInfo>>
80
85
  applicationMode: ApplicationMode
81
- forcedRouterMode?: Mode
86
+ forcedRouterMode?: string
82
87
  forcedAddOns?: Array<string>
83
88
  registry?: Registry | undefined
84
89
  }