@tanstack/cta-engine 0.10.0-alpha.15 → 0.10.0-alpha.16

package/templates/react/add-on/shadcn/assets/components.json

@@ -1,21 +0,0 @@
-{
-  "$schema": "https://ui.shadcn.com/schema.json",
-  "style": "new-york",
-  "rsc": false,
-  "tsx": true,
-  "tailwind": {
-    "config": "",
-    "css": "src/styles.css",
-    "baseColor": "zinc",
-    "cssVariables": true,
-    "prefix": ""
-  },
-  "aliases": {
-    "components": "@/components",
-    "utils": "@/lib/utils",
-    "ui": "@/components/ui",
-    "lib": "@/lib",
-    "hooks": "@/hooks"
-  },
-  "iconLibrary": "lucide"
-}

package/templates/react/add-on/shadcn/assets/src/lib/utils.ts

@@ -1,6 +0,0 @@
-import { clsx, type ClassValue } from "clsx"
-import { twMerge } from "tailwind-merge"
-
-export function cn(...inputs: ClassValue[]) {
-  return twMerge(clsx(inputs))
-}

package/templates/react/add-on/shadcn/assets/src/styles.css

@@ -1,138 +0,0 @@
-@import 'tailwindcss';
-
-@plugin "tailwindcss-animate";
-
-@custom-variant dark (&:is(.dark *));
-
-body {
-  @apply m-0;
-  font-family:
-    -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu',
-    'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
-  -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
-
-code {
-  font-family:
-    source-code-pro, Menlo, Monaco, Consolas, 'Courier New', monospace;
-}
-
-:root {
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.141 0.005 285.823);
-  --card: oklch(1 0 0);
-  --card-foreground: oklch(0.141 0.005 285.823);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.141 0.005 285.823);
-  --primary: oklch(0.21 0.006 285.885);
-  --primary-foreground: oklch(0.985 0 0);
-  --secondary: oklch(0.967 0.001 286.375);
-  --secondary-foreground: oklch(0.21 0.006 285.885);
-  --muted: oklch(0.967 0.001 286.375);
-  --muted-foreground: oklch(0.552 0.016 285.938);
-  --accent: oklch(0.967 0.001 286.375);
-  --accent-foreground: oklch(0.21 0.006 285.885);
-  --destructive: oklch(0.577 0.245 27.325);
-  --destructive-foreground: oklch(0.577 0.245 27.325);
-  --border: oklch(0.92 0.004 286.32);
-  --input: oklch(0.92 0.004 286.32);
-  --ring: oklch(0.871 0.006 286.286);
-  --chart-1: oklch(0.646 0.222 41.116);
-  --chart-2: oklch(0.6 0.118 184.704);
-  --chart-3: oklch(0.398 0.07 227.392);
-  --chart-4: oklch(0.828 0.189 84.429);
-  --chart-5: oklch(0.769 0.188 70.08);
-  --radius: 0.625rem;
-  --sidebar: oklch(0.985 0 0);
-  --sidebar-foreground: oklch(0.141 0.005 285.823);
-  --sidebar-primary: oklch(0.21 0.006 285.885);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.967 0.001 286.375);
-  --sidebar-accent-foreground: oklch(0.21 0.006 285.885);
-  --sidebar-border: oklch(0.92 0.004 286.32);
-  --sidebar-ring: oklch(0.871 0.006 286.286);
-}
-
-.dark {
-  --background: oklch(0.141 0.005 285.823);
-  --foreground: oklch(0.985 0 0);
-  --card: oklch(0.141 0.005 285.823);
-  --card-foreground: oklch(0.985 0 0);
-  --popover: oklch(0.141 0.005 285.823);
-  --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.985 0 0);
-  --primary-foreground: oklch(0.21 0.006 285.885);
-  --secondary: oklch(0.274 0.006 286.033);
-  --secondary-foreground: oklch(0.985 0 0);
-  --muted: oklch(0.274 0.006 286.033);
-  --muted-foreground: oklch(0.705 0.015 286.067);
-  --accent: oklch(0.274 0.006 286.033);
-  --accent-foreground: oklch(0.985 0 0);
-  --destructive: oklch(0.396 0.141 25.723);
-  --destructive-foreground: oklch(0.637 0.237 25.331);
-  --border: oklch(0.274 0.006 286.033);
-  --input: oklch(0.274 0.006 286.033);
-  --ring: oklch(0.442 0.017 285.786);
-  --chart-1: oklch(0.488 0.243 264.376);
-  --chart-2: oklch(0.696 0.17 162.48);
-  --chart-3: oklch(0.769 0.188 70.08);
-  --chart-4: oklch(0.627 0.265 303.9);
-  --chart-5: oklch(0.645 0.246 16.439);
-  --sidebar: oklch(0.21 0.006 285.885);
-  --sidebar-foreground: oklch(0.985 0 0);
-  --sidebar-primary: oklch(0.488 0.243 264.376);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.274 0.006 286.033);
-  --sidebar-accent-foreground: oklch(0.985 0 0);
-  --sidebar-border: oklch(0.274 0.006 286.033);
-  --sidebar-ring: oklch(0.442 0.017 285.786);
-}
-
-@theme inline {
-  --color-background: var(--background);
-  --color-foreground: var(--foreground);
-  --color-card: var(--card);
-  --color-card-foreground: var(--card-foreground);
-  --color-popover: var(--popover);
-  --color-popover-foreground: var(--popover-foreground);
-  --color-primary: var(--primary);
-  --color-primary-foreground: var(--primary-foreground);
-  --color-secondary: var(--secondary);
-  --color-secondary-foreground: var(--secondary-foreground);
-  --color-muted: var(--muted);
-  --color-muted-foreground: var(--muted-foreground);
-  --color-accent: var(--accent);
-  --color-accent-foreground: var(--accent-foreground);
-  --color-destructive: var(--destructive);
-  --color-destructive-foreground: var(--destructive-foreground);
-  --color-border: var(--border);
-  --color-input: var(--input);
-  --color-ring: var(--ring);
-  --color-chart-1: var(--chart-1);
-  --color-chart-2: var(--chart-2);
-  --color-chart-3: var(--chart-3);
-  --color-chart-4: var(--chart-4);
-  --color-chart-5: var(--chart-5);
-  --radius-sm: calc(var(--radius) - 4px);
-  --radius-md: calc(var(--radius) - 2px);
-  --radius-lg: var(--radius);
-  --radius-xl: calc(var(--radius) + 4px);
-  --color-sidebar: var(--sidebar);
-  --color-sidebar-foreground: var(--sidebar-foreground);
-  --color-sidebar-primary: var(--sidebar-primary);
-  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-  --color-sidebar-accent: var(--sidebar-accent);
-  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-  --color-sidebar-border: var(--sidebar-border);
-  --color-sidebar-ring: var(--sidebar-ring);
-}
-
-@layer base {
-  * {
-    @apply border-border outline-ring/50;
-  }
-  body {
-    @apply bg-background text-foreground;
-  }
-}

package/templates/react/add-on/shadcn/info.json

@@ -1,7 +0,0 @@
-{
-  "name": "Shadcn",
-  "description": "Add Shadcn UI to your application.",
-  "phase": "add-on",
-  "templates": ["file-router", "code-router"],
-  "link": "https://ui.shadcn.com/"
-}

package/templates/react/add-on/shadcn/package.json

@@ -1,9 +0,0 @@
-{
-  "dependencies": {
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "lucide-react": "^0.476.0",
-    "tailwind-merge": "^3.0.2",
-    "tailwindcss-animate": "^1.0.7"
-  }
-}

package/templates/react/add-on/start/assets/_dot_gitignore.append

@@ -1,2 +0,0 @@
-.output
-.vinxi

package/templates/react/add-on/start/assets/app.config.ts.ejs

@@ -1,19 +0,0 @@
-import { defineConfig } from '@tanstack/react-start/config'
-import viteTsConfigPaths from 'vite-tsconfig-paths'<% if (tailwind) { %>
-import tailwindcss from "@tailwindcss/vite"
-<% } %>
-
-export default defineConfig({
-  tsr: {
-    appDirectory: 'src',
-  },
-  vite: {
-    plugins: [
-      // this is the plugin that enables path aliases
-      viteTsConfigPaths({
-        projects: ['./tsconfig.json'],
-      }),
-      <% if (tailwind) { %>tailwindcss(),<% } %>
-    ],
-  },
-})

package/templates/react/add-on/start/assets/src/api.ts

@@ -1,6 +0,0 @@
-import {
-  createStartAPIHandler,
-  defaultAPIFileRouteHandler,
-} from '@tanstack/react-start/api'
-
-export default createStartAPIHandler(defaultAPIFileRouteHandler)

package/templates/react/add-on/start/assets/src/client.tsx

@@ -1,8 +0,0 @@
-import { hydrateRoot } from 'react-dom/client'
-import { StartClient } from '@tanstack/react-start'
-
-import { createRouter } from './router'
-
-const router = createRouter()
-
-hydrateRoot(document, <StartClient router={router} />)

package/templates/react/add-on/start/assets/src/router.tsx.ejs

@@ -1,77 +0,0 @@
-import { createRouter as createTanstackRouter } from '@tanstack/react-router'<% if (addOnEnabled.sentry) { %>
-import * as Sentry from '@sentry/react'
-import * as SentryServer from '@sentry/node'
-import { createIsomorphicFn } from '@tanstack/react-start'
-<% } %><% if (addOnEnabled['tanstack-query']) { %>
-import { routerWithQueryClient } from '@tanstack/react-router-with-query'
-import * as TanstackQuery from './integrations/tanstack-query/root-provider'
-<% } %>
-
-// Import the generated route tree
-import { routeTree } from './routeTree.gen'
-
-import './styles.css'
-
-// Create a new router instance
-export const createRouter = () => {
-  <% if (addOnEnabled['tanstack-query']) { %>
-  const router = routerWithQueryClient(createTanstackRouter({
-    routeTree,
-    context: {
-      <% if (addOnEnabled['tanstack-query']) { %>
-        ...TanstackQuery.getContext(),
-      <% } %>
-    },
-    scrollRestoration: true,
-    defaultPreloadStaleTime: 0,
-    <% if (addOnEnabled.tRPC) { %>
-    Wrap: (props: { children: React.ReactNode }) => {
-      return (
-        <TanstackQuery.Provider>
-          {props.children}
-        </TanstackQuery.Provider>
-      );
-    },
-  <% } %>
-  }), TanstackQuery.getContext().queryClient)
-  <% } else { %>
-  const router = createTanstackRouter({
-    routeTree,
-    scrollRestoration: true,
-    defaultPreloadStaleTime: 0,
-  })
-  <% } %>
-  return router
-}
-
-<% if (addOnEnabled.sentry) { %>
-  const router = createRouter()
-  createIsomorphicFn().server(() => {
-    SentryServer.init({
-      dsn: import.meta.env.VITE_SENTRY_DSN,
-      tracesSampleRate: 1.0,
-      profilesSampleRate: 1.0,
-    })
-  }).client(() => {
-    Sentry.init({
-      dsn: import.meta.env.VITE_SENTRY_DSN,
-      integrations: [
-        Sentry.replayIntegration({
-          maskAllText: false,
-          blockAllMedia: false,
-        }),
-        Sentry.tanstackRouterBrowserTracingIntegration(router),
-      ],
-      tracesSampleRate: 1.0,
-      replaysSessionSampleRate: 1.0,
-      replaysOnErrorSampleRate: 1.0,
-    })
-  })()
-<% } %>
-
-// Register the router instance for type safety
-declare module '@tanstack/react-router' {
-  interface Register {
-    router: ReturnType<typeof createRouter>
-  }
-}

package/templates/react/add-on/start/assets/src/routes/api.demo-names.ts

@@ -1,11 +0,0 @@
-import { createAPIFileRoute } from '@tanstack/react-start/api'
-
-export const APIRoute = createAPIFileRoute('/demo/start/api/names')({
-  GET: async ({ request }) => {
-    return new Response(JSON.stringify(['Alice', 'Bob', 'Charlie']), {
-      headers: {
-        'Content-Type': 'application/json',
-      },
-    })
-  },
-})

package/templates/react/add-on/start/assets/src/routes/demo.start.api-request.tsx.ejs

@@ -1,33 +0,0 @@
-<% if (addOnEnabled['react-query']) { %>
-  import { useQuery } from '@tanstack/react-query'
-  <% } else { %>
-  import { useEffect, useState } from 'react'
-  <% } %>
-  import { createFileRoute } from '@tanstack/react-router'
-  
-  function getNames() {
-    return fetch('/api/demo-names').then((res) => res.json())
-  }
-  
-  export const Route = createFileRoute('/demo/start/api-request')({
-    component: Home,
-  })
-  
-  function Home() {
-    <% if (addOnEnabled['react-query']) { %>
-      const { data: names = [] } = useQuery({
-        queryKey: ['names'],
-        queryFn: getNames,
-      })
-    <% } else { %>
-      const [names, setNames] = useState<Array<string>>([])
-      useEffect(() => {
-        getNames().then(setNames)
-      }, [])
-    <% } %>
-    return (
-      <div className="p-4">
-        <div>{names.join(', ')}</div>
-      </div>
-    )
-  }

package/templates/react/add-on/start/assets/src/routes/demo.start.server-funcs.tsx

@@ -1,50 +0,0 @@
-import * as fs from 'node:fs'
-import { createFileRoute, useRouter } from '@tanstack/react-router'
-import { createServerFn } from '@tanstack/react-start'
-
-const filePath = 'count.txt'
-
-async function readCount() {
-  return parseInt(
-    await fs.promises.readFile(filePath, 'utf-8').catch(() => '0'),
-  )
-}
-
-const getCount = createServerFn({
-  method: 'GET',
-}).handler(() => {
-  return readCount()
-})
-
-const updateCount = createServerFn({ method: 'POST' })
-  .validator((d: number) => d)
-  .handler(async ({ data }) => {
-    const count = await readCount()
-    await fs.promises.writeFile(filePath, `${count + data}`)
-  })
-
-export const Route = createFileRoute('/demo/start/server-funcs')({
-  component: Home,
-  loader: async () => await getCount(),
-})
-
-function Home() {
-  const router = useRouter()
-  const state = Route.useLoaderData()
-
-  return (
-    <div className="p-4">
-      <button
-        type="button"
-        onClick={() => {
-          updateCount({ data: 1 }).then(() => {
-            router.invalidate()
-          })
-        }}
-        className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
-      >
-        Add 1 to {state}?
-      </button>
-    </div>
-  )
-}

package/templates/react/add-on/start/assets/src/ssr.tsx

@@ -1,12 +0,0 @@
-import {
-  createStartHandler,
-  defaultStreamHandler,
-} from '@tanstack/react-start/server'
-import { getRouterManifest } from '@tanstack/react-start/router-manifest'
-
-import { createRouter } from './router'
-
-export default createStartHandler({
-  createRouter,
-  getRouterManifest,
-})(defaultStreamHandler)

package/templates/react/add-on/start/info.json

@@ -1,18 +0,0 @@
-{
-  "name": "Start",
-  "phase": "setup",
-  "description": "Add TanStack Start for SSR, API endpoints, and more.",
-  "link": "https://tanstack.com/start/latest",
-  "templates": ["file-router"],
-  "warning": "TanStack Start is not yet at 1.0 and may change significantly or not be compatible with other add-ons.",
-  "routes": [
-    {
-      "url": "/demo/start/server-funcs",
-      "name": "Start - Server Functions"
-    },
-    {
-      "url": "/demo/start/api-request",
-      "name": "Start - API Request"
-    }
-  ]
-}

package/templates/react/add-on/start/package.json

@@ -1,13 +0,0 @@
-{
-  "scripts": {
-    "dev": "vinxi dev",
-    "build": "vinxi build",
-    "start": "vinxi start"
-  },
-  "dependencies": {
-    "@tanstack/react-router-with-query": "^1.114.3",
-    "@tanstack/react-start": "^1.114.3",
-    "vinxi": "^0.5.3",
-    "vite-tsconfig-paths": "^5.1.4"
-  }
-}

package/templates/react/add-on/store/assets/src/lib/demo-store.ts

@@ -1,13 +0,0 @@
-import { Derived, Store } from '@tanstack/store'
-
-export const store = new Store({
-  firstName: 'Jane',
-  lastName: 'Smith',
-})
-
-export const fullName = new Derived({
-  fn: () => `${store.state.firstName} ${store.state.lastName}`,
-  deps: [store],
-})
-
-fullName.mount()

package/templates/react/add-on/store/assets/src/routes/demo.store.tsx.ejs

@@ -1,75 +0,0 @@
-import { <% if (fileRouter) { %>createFileRoute<% } else { %>createRoute<% } %> } from '@tanstack/react-router'
-import { useStore } from '@tanstack/react-store'
-
-import { fullName, store } from '../lib/demo-store'
-<% if (codeRouter) { %>
-import type { RootRoute } from '@tanstack/react-router'
-<% } else { %>
-export const Route = createFileRoute('/demo/store')({
-  component: DemoStore,
-})
-<% } %>
-
-function FirstName() {
-  const firstName = useStore(store, (state) => state.firstName)
-  return (
-    <input
-      type="text"
-      value={firstName}
-      onChange={(e) =>
-        store.setState((state) => ({ ...state, firstName: e.target.value }))
-      }
-      className="bg-white/10 rounded-lg px-4 py-2 outline-none border border-white/20 hover:border-white/40 focus:border-white/60 transition-colors duration-200 placeholder-white/40"
-    />
-  )
-}
-
-function LastName() {
-  const lastName = useStore(store, (state) => state.lastName)
-  return (
-    <input
-      type="text"
-      value={lastName}
-      onChange={(e) =>
-        store.setState((state) => ({ ...state, lastName: e.target.value }))
-      }
-      className="bg-white/10 rounded-lg px-4 py-2 outline-none border border-white/20 hover:border-white/40 focus:border-white/60 transition-colors duration-200 placeholder-white/40"
-    />
-  )
-}
-
-function FullName() {
-  const fName = useStore(fullName)
-  return (
-    <div className="bg-white/10 rounded-lg px-4 py-2 outline-none ">
-      {fName}
-    </div>
-  )
-}
-
-function DemoStore() {
-  return (
-    <div
-      className="min-h-[calc(100vh-32px)] text-white p-8 flex items-center justify-center w-full h-full"
-      style={{
-        backgroundImage:
-          'radial-gradient(50% 50% at 80% 80%, #f4a460 0%, #8b4513 70%, #1a0f0a 100%)',
-      }}
-    >
-      <div className="bg-white/10 backdrop-blur-lg rounded-xl p-8 shadow-lg flex flex-col gap-4 text-3xl min-w-1/2">
-        <h1 className="text-4xl font-bold mb-5">Store Example</h1>
-        <FirstName />
-        <LastName />
-        <FullName />
-      </div>
-    </div>
-  )
-}
-
-<% if (codeRouter) { %>
-export default (parentRoute: RootRoute) => createRoute({
-  path: '/demo/store',
-  component: DemoStore,
-  getParentRoute: () => parentRoute,
-})
-<% } %>

package/templates/react/add-on/store/info.json

@@ -1,13 +0,0 @@
-{
-  "name": "Store",
-  "description": "Add TanStack Store to your application.",
-  "phase": "add-on",
-  "link": "https://tanstack.com/store/latest",
-  "templates": ["file-router", "code-router"],
-  "routes": [
-    {
-      "url": "/demo/store",
-      "name": "Store"
-    }
-  ]
-}

package/templates/react/add-on/store/package.json

@@ -1,6 +0,0 @@
-{
-  "dependencies": {
-    "@tanstack/store": "^0.7.0",
-    "@tanstack/react-store": "^0.7.0"
-  }
-}

package/templates/react/add-on/tRPC/assets/src/integrations/trpc/init.ts

@@ -1,9 +0,0 @@
-import { initTRPC } from "@trpc/server";
-import superjson from "superjson";
-
-const t = initTRPC.create({
-  transformer: superjson,
-});
-
-export const createTRPCRouter = t.router;
-export const publicProcedure = t.procedure;

package/templates/react/add-on/tRPC/assets/src/integrations/trpc/react.ts

@@ -1,4 +0,0 @@
-import { createTRPCContext } from "@trpc/tanstack-react-query";
-import type { TRPCRouter } from "@/integrations/trpc/router";
-
-export const { TRPCProvider, useTRPC } = createTRPCContext<TRPCRouter>();

package/templates/react/add-on/tRPC/assets/src/integrations/trpc/router.ts

@@ -1,18 +0,0 @@
-import { TRPCError } from '@trpc/server'
-import type { TRPCRouterRecord } from '@trpc/server'
-// import { z } from 'zod'
-
-import { createTRPCRouter, publicProcedure } from './init'
-
-const peopleRouter = {
-  list: publicProcedure.query(async () =>
-    fetch('https://swapi.dev/api/people')
-      .then((res) => res.json())
-      .then((d) => d.results as { name: string }[]),
-  ),
-} satisfies TRPCRouterRecord
-
-export const trpcRouter = createTRPCRouter({
-  people: peopleRouter,
-})
-export type TRPCRouter = typeof trpcRouter

package/templates/react/add-on/tRPC/assets/src/routes/api.trpc.$.tsx

@@ -1,16 +0,0 @@
-import { createAPIFileRoute } from '@tanstack/react-start/api'
-import { fetchRequestHandler } from '@trpc/server/adapters/fetch'
-import { trpcRouter } from '@/integrations/trpc/router'
-
-function handler({ request }: { request: Request }) {
-  return fetchRequestHandler({
-    req: request,
-    router: trpcRouter,
-    endpoint: '/api/trpc',
-  })
-}
-
-export const APIRoute = createAPIFileRoute('/api/trpc/$')({
-  GET: handler,
-  POST: handler,
-})

package/templates/react/add-on/tRPC/info.json

@@ -1,9 +0,0 @@
-{
-  "name": "tRPC",
-  "description": "Integrate tRPC into your application.",
-  "phase": "add-on",
-  "templates": ["file-router"],
-  "link": "https://trpc.io/",
-  "routes": [],
-  "dependsOn": ["tanstack-query", "start"]
-}

package/templates/react/add-on/tRPC/package.json

@@ -1,9 +0,0 @@
-{
-  "dependencies": {
-    "@trpc/client": "^11.0.0",
-    "@trpc/server": "^11.0.0",
-    "@trpc/tanstack-react-query": "^11.0.0",
-    "superjson": "^2.2.2",
-    "zod": "^3.24.2"
-  }
-}