@vertesia/create-plugin 0.80.0-dev.20251121 → 0.80.0

package/templates/tool/src/server.ts

@@ -1,71 +0,0 @@
-import { ToolCollection } from "@vertesia/tools-sdk";
-import { Context, Hono } from "hono";
-import { cors } from "hono/cors";
-import { collections } from "./collections/index.js";
-import { HTTPException } from "hono/http-exception";
-
-function createServer(collections: ToolCollection[], prefix = '/api') {
-    prefix = prefix.trim();
-    const app = new Hono();
-
-    // Add CORS middleware globally
-    app.use('*', cors({ origin: '*', allowMethods: ['GET', 'POST', 'OPTIONS'] }));
-
-    // Add base API route
-    app.get(prefix, (c) => {
-        return c.json({
-            message: 'Tool Collections API',
-            version: '1.0.0',
-            endpoints: {
-                collections: collections.map(col => `${prefix}/${col.name}`)
-            }
-        });
-    });
-
-    // Create endpoints for tool collections
-    for (const col of collections) {
-        app.route(`${prefix}/${col.name}`, createCollectionEndpoints(col));
-    }
-
-    // Global error handler
-    app.onError((err, c) => {
-        if (err instanceof HTTPException) {
-            return c.json({
-                error: err.message,
-            }, err.status);
-        }
-        console.error('Uncaught Error:', err);
-        return c.json({
-            error: 'Internal Server Error',
-        }, 500)
-    })
-
-    return app;
-}
-
-const server = createServer(collections);
-
-export default server;
-
-/**
- * Create endpoints for a tool collection
- */
-function createCollectionEndpoints(coll: ToolCollection) {
-    const endpoint = new Hono();
-
-    // POST endpoint to execute tools
-    endpoint.post('/', (c: Context) => {
-        return coll.execute(c);
-    });
-
-    // GET endpoint to retrieve collection metadata and tool definitions
-    endpoint.get('/', (c) => {
-        return c.json({
-            title: coll.title || coll.name,
-            description: coll.description,
-            tools: coll.getToolDefinitions()
-        });
-    });
-
-    return endpoint;
-}

package/templates/tool/tsconfig.json

@@ -1,24 +0,0 @@
-{
-    "compilerOptions": {
-        "target": "ES2022",
-        "module": "ESNext",
-        "moduleResolution": "Bundler",
-        "esModuleInterop": true,
-        "strict": true,
-        "skipLibCheck": true,
-        "resolveJsonModule": true,
-        "allowSyntheticDefaultImports": true,
-        "forceConsistentCasingInFileNames": true,
-        "noUnusedLocals": true,
-        "noUnusedParameters": true,
-        "noImplicitReturns": true,
-        "outDir": "dist"
-    },
-    "include": [
-        "src/**/*"
-    ],
-    "exclude": [
-        "node_modules",
-        "dist"
-    ]
-}

package/templates/tool/vite.config.js

@@ -1,48 +0,0 @@
-import devServer from '@hono/vite-dev-server';
-import { defineConfig, loadEnv } from 'vite';
-
-export default defineConfig(({ mode }) => {
-    // Load env files
-    const env = loadEnv(mode, process.cwd(), '');
-
-    // Dev config
-    if (mode === 'development') {
-        return {
-            plugins: [
-                devServer({
-                    prefix: '/api',  // mount the tool endpoints under /api
-                    entry: './src/server.ts',
-                }),
-            ],
-        }
-    }
-
-    // Build config
-    return {
-        build: {
-            minify: false,
-            lib: {
-                entry: {
-                    server: './src/server.ts',
-                },
-                formats: ['es']
-            },
-            rollupOptions: {
-                external: (id) => {
-                    // Keep relative imports as part of the bundle
-                    if (id.startsWith('.') || id.startsWith('/')) {
-                        return false;
-                    }
-                    // Externalize all node modules and absolute imports
-                    return true;
-                },
-                output: {
-                    preserveModules: true,
-                    preserveModulesRoot: 'src',
-                    entryFileNames: '[name].js'
-                }
-            },
-            outDir: 'dist'
-        },
-    }
-});

package/templates/web/README.md

@@ -1,156 +0,0 @@
-# Vertesia Custom App Sample
-
-A sample project demonstrating how to build a custom app/plugin for the Vertesia platform using React, TypeScript, and Vite.
-
-## Overview
-
-This project serves as a template for building Vertesia plugins that can be integrated into the Vertesia platform. It includes:
-
-- React 19 with TypeScript for type-safe component development
-- Tailwind CSS for styling
-- Vite for fast development and optimized builds
-- Dual build modes: standalone app and plugin library
-
-## Project Structure
-
-```txt
-src/
-├── app.tsx          # Main app component with router
-├── plugin.tsx       # Plugin entry point for Vertesia integration
-├── routes.tsx       # Application route definitions
-├── pages.tsx        # Page components
-└── main.tsx         # Dev mode entry point
-```
-
-## Getting Started
-
-### Installation
-
-```bash
-pnpm install
-```
-
-### Development
-
-Run the app in development mode with hot module replacement:
-
-```bash
-pnpm dev
-```
-
-The app will be available at `https://localhost:5173`.
-
-### Building
-
-Build both standalone app and plugin library:
-
-```bash
-pnpm build
-```
-
-Or build individually:
-
-```bash
-# Build standalone app
-pnpm build:app
-
-# Build plugin library
-pnpm build:lib
-```
-
-The plugin library will be output to the `dist/lib/` directory.
-
-## Deployment
-
-Since this is a standard web application, you can deploy it to any static hosting provider (Vercel, Netlify, Cloudflare Pages, AWS S3, etc.).
-
-### Deploying to Vercel
-
-Vercel is a practical deployment option with a generous free tier. You can very simply deploy your standalone app using the Vercel CLI.
-
-#### Setup
-
-Install the Vercel CLI globally:
-
-```bash
-npm i -g vercel
-```
-
-#### Deployment Steps
-
-1. **Login to Vercel**:
-
-    ```bash
-    vercel login
-    ```
-
-2. **Deploy to preview**:
-
-    ```bash
-    vercel
-    ```
-
-    This will create a preview deployment and provide you with a URL to test your app.
-
-3. **Deploy to production**:
-
-    ```bash
-    vercel --prod
-    ```
-
-For more information, visit the [Vercel CLI documentation](https://vercel.com/docs/cli).
-
-#### Update App Manifest with Deployment URL
-
-After deploying to Vercel, update your app manifest to point to the deployed URL using the vertesia CLI:
-
-```bash
-vertesia apps update <appId> --manifest '{
-  "name": "my-app",
-  "title": "My App",
-  "description": "A sample app",
-  "publisher": "your-org",
-  "private": true,
-  "status": "beta",
-  "ui": {
-    "src": "https://your-app.vercel.app/lib/plugin.js",
-    "isolation": "shadow"
-  }
-}'
-```
-
-Replace `appId` by the actual ID and `https://your-app.vercel.app` with your actual Vercel deployment URL.
-
-## Key Features
-
-### Dual Build Modes
-
-- **App Mode**: Builds a standalone application for development and testing
-- **Library Mode**: Builds a plugin that can be integrated into the Vertesia platform
-
-### External Dependencies
-
-When building as a plugin, React and Vertesia dependencies are externalized to prevent duplication:
-
-- `react` / `react-dom`
-- `@vertesia/common`
-- `@vertesia/ui`
-
-## Tech Stack
-
-- **React 19** - UI framework
-- **TypeScript** - Type safety
-- **Vite** - Build tool and dev server
-- **Tailwind CSS 4** - Styling
-- **@vertesia/ui** - Vertesia UI components
-- **@vertesia/plugin-builder** - Plugin build utilities
-
-## Development Notes
-
-- The dev server uses HTTPS (via `@vitejs/plugin-basic-ssl`)
-- CSS can be inlined in the plugin bundle or kept separate (configured in [vite.config.ts](vite.config.ts))
-- For debugging Vertesia UI sources, set `VERTESIA_UI_PATH` in [vite.config.ts](vite.config.ts)
-
-## License
-
-See package.json for license information.

package/templates/web/eslint.config.js

@@ -1,29 +0,0 @@
-import js from '@eslint/js'
-import globals from 'globals'
-import reactHooks from 'eslint-plugin-react-hooks'
-import reactRefresh from 'eslint-plugin-react-refresh'
-import tseslint from 'typescript-eslint'
-import { defineConfig } from 'eslint/config';
-
-export default defineConfig(
-  { ignores: ['dist'] },
-  {
-    extends: [js.configs.recommended, ...tseslint.configs.recommended],
-    files: ['**/*.{ts,tsx}'],
-    languageOptions: {
-      ecmaVersion: 2020,
-      globals: globals.browser,
-    },
-    plugins: {
-      'react-hooks': reactHooks,
-      'react-refresh': reactRefresh,
-    },
-    rules: {
-      ...reactHooks.configs.recommended.rules,
-      'react-refresh/only-export-components': [
-        'warn',
-        { allowConstantExport: true },
-      ],
-    },
-  },
-)

package/templates/web/gitignore

@@ -1,25 +0,0 @@
-# Logs
-logs
-*.log
-npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
-pnpm-debug.log*
-lerna-debug.log*
-
-node_modules
-dist
-dist-ssr
-lib
-*.local
-
-# Editor directories and files
-.vscode/*
-!.vscode/extensions.json
-.idea
-.DS_Store
-*.suo
-*.ntvs*
-*.njsproj
-*.sln
-*.sw?

package/templates/web/index.html.tmpl

@@ -1,26 +0,0 @@
-<!doctype html>
-<html lang="en">
-
-<head>
-  <meta charset="UTF-8" />
-  <link rel="icon" type="image/svg+xml" href="/vite.svg" />
-  <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-  <title>${plugin_title}</title>
-  <script type="importmap">
-      {
-        "imports": {
-          "react": "https://esm.sh/react@19.0.0",
-          "react-dom": "https://esm.sh/react-dom@19.0.0",
-          "react-dom/client": "https://esm.sh/react-dom@19.0.0/client",
-          "react/jsx-runtime": "https://esm.sh/react@19.0.0/jsx-runtime"
-        }
-      }
-    </script>
-</head>
-
-<body>
-  <div id="root"></div>
-  <script type="module" src="/src/main.tsx"></script>
-</body>
-
-</html>

package/templates/web/src/app.tsx

@@ -1,8 +0,0 @@
-import { NestedRouterProvider } from "@vertesia/ui/router";
-import { routes } from "./routes";
-
-export function App() {
-    return (
-        <NestedRouterProvider routes={routes} />
-    )
-}

package/templates/web/src/assets.ts

@@ -1,26 +0,0 @@
-
-let _usePluginAssets = true;
-
-export function setUsePluginAssets(usePluginAssets: boolean) {
-    _usePluginAssets = usePluginAssets
-}
-
-/**
- * Correctly resolve the URL to an asset so that it works in dev mode but also in prod as a standalone app or plugin.
- * Assets must be put inside /public/assets folder so the given `path` will be resolved as /assets/path in the right context
- * @param path 
- */
-export function useAsset(path: string) {
-    if (path.startsWith('/')) {
-        path = path.substring(1);
-    } else if (path.startsWith('./')) {
-        path = path.substring(2);
-    }
-    if (_usePluginAssets) {
-        // the plugin.js file is in lib/ directory and  we need to serve from assets/ directory 
-        path = `../assets/${path}`;
-        return new URL(path, import.meta.url).href;
-    } else {
-        return `/assets/${path}`;
-    }
-}

package/templates/web/src/env.ts.tmpl

@@ -1,14 +0,0 @@
-import { Env } from "@vertesia/ui/env";
-
-Env.init({
-    name: "${plugin_title}",
-    version: "1.0.0",
-    isLocalDev: true,
-    isDocker: true,
-    type: "development",
-    endpoints: {
-        studio: "https://api.vertesia.io",
-        zeno: "https://api.vertesia.io",
-        sts: "https://sts.vertesia.io",
-    }
-});

package/templates/web/src/index.css

@@ -1,21 +0,0 @@
-@import "tailwindcss";
-
-/**
- * The login form use this for inputs
- */
-@plugin '@tailwindcss/forms';
-
-/**
- * Scan typescript sources 
- */
-@source "./";
-
-/**
- * Scan the index.html for tailwind CSS
- */
-@source "../index.html";
-
-/**
- * Scan @vertesia/ui dependency for tailwind classes 
- */
-@source "../node_modules/@vertesia/ui/src";

package/templates/web/src/main.tsx.tmpl

@@ -1,21 +0,0 @@
-import { StandaloneApp, VertesiaShell } from '@vertesia/ui/shell'
-import { StrictMode } from 'react'
-import { createRoot } from 'react-dom/client'
-import './index.css'
-// initialize dev environment
-import { RouterProvider } from '@vertesia/ui/router'
-import { App } from './app'
-import "./env"
-import { setUsePluginAssets } from './assets'
-
-setUsePluginAssets(false);
-
-createRoot(document.getElementById('root')!).render(
-    <StrictMode>
-        <VertesiaShell>
-            <StandaloneApp name={import.meta.env.VITE_APP_NAME}> {/* <---- define VITE_APP_NAME en var in .env.local */}
-                <RouterProvider routes={[{ path: "*", Component: App }]} />
-            </StandaloneApp>
-        </VertesiaShell>
-    </StrictMode>,
-)

package/templates/web/src/pages.tsx

@@ -1,31 +0,0 @@
-import { useNavigate } from "@vertesia/ui/router";
-import { useUserSession } from "@vertesia/ui/session";
-import type { ReactNode } from "react";
-
-export function HomePage() {
-    const { user } = useUserSession();
-    return (
-        <div className='p-4'>
-            <h1 className='pb-4'>Hello {user?.email}!</h1>
-            <NavButton href='/next'>Go to next page</NavButton>
-        </div>
-    )
-}
-
-export function NextPage() {
-    return (
-        <div className='p-4'>
-            <h1 className='pb-4'>Hello again!</h1>
-            <NavButton href='/'>Go to previous page</NavButton>
-        </div>
-    )
-}
-
-function NavButton({ href, children }: { href: string, children: ReactNode }) {
-    const navigate = useNavigate();
-    return (
-        <button className="bg-blue-500 text-white px-4 py-2 rounded cursor-pointer" onClick={() => navigate(href)}>
-            {children}
-        </button>
-    )
-}

package/templates/web/src/plugin.tsx.tmpl

@@ -1,18 +0,0 @@
-import { PortalContainerProvider } from "@vertesia/ui/core";
-import { App } from "./app";
-
-/**
- * Export the plugin component.
- */
-export default function ${ PluginComponent } ({ slot }: { slot: string }) {
-    if (slot === "page") {
-        return (
-            <PortalContainerProvider>
-                <App />
-            </PortalContainerProvider>
-        );
-    } else {
-        console.warn('No component found for slot', slot);
-        return null;
-    }
-}

package/templates/web/src/routes.tsx

@@ -1,17 +0,0 @@
-import { HomePage, NextPage } from "./pages";
-
-export const routes = [
-    {
-        path: '/',
-        Component: HomePage,
-    },
-    {
-        path: '/next',
-        Component: NextPage,
-    },
-    {
-        path: '*',
-        Component: () => <div className="text-red-800 p-4">Not found</div>,
-    }
-
-];

package/templates/web/src/vite-env.d.ts

@@ -1 +0,0 @@
-/// <reference types="vite/client" />

package/templates/web/tsconfig.app.json

@@ -1,51 +0,0 @@
-{
-  "compilerOptions": {
-    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.app.tsbuildinfo",
-    "target": "ES2020",
-    "useDefineForClassFields": true,
-    "lib": [
-      "ES2020",
-      "DOM",
-      "DOM.Iterable"
-    ],
-    "module": "ESNext",
-    "skipLibCheck": true,
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "verbatimModuleSyntax": true,
-    "moduleDetection": "force",
-    "noEmit": true,
-    "jsx": "react-jsx",
-    "baseUrl": ".",
-    "paths": {
-      "@vertesia/common": [
-        "./node_modules/@vertesia/common/src/index.ts"
-      ],
-      "@vertesia/client": [
-        "./node_modules/@vertesia/client/src/index.ts",
-      ],
-      "@vertesia/ui/*": [
-        "./node_modules/@vertesia/ui/src/*"
-      ]
-    },
-    /* Linting */
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "erasableSyntaxOnly": false,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true
-  },
-  "include": [
-    "src"
-  ],
-  "references": [
-    {
-      "path": "./node_modules/@vertesia/common/tsconfig.dist.json"
-    },
-    {
-      "path": "./node_modules/@vertesia/ui/tsconfig.dist.json"
-    }
-  ]
-}

package/templates/web/tsconfig.json

@@ -1,7 +0,0 @@
-{
-  "files": [],
-  "references": [
-    { "path": "./tsconfig.app.json" },
-    { "path": "./tsconfig.node.json" }
-  ]
-}

package/templates/web/tsconfig.node.json

@@ -1,27 +0,0 @@
-{
-  "compilerOptions": {
-    "tsBuildInfoFile": "./node_modules/.tmp/tsconfig.node.tsbuildinfo",
-    "target": "ES2022",
-    "lib": [
-      "ES2023"
-    ],
-    "module": "ESNext",
-    "skipLibCheck": true,
-    /* Bundler mode */
-    "moduleResolution": "bundler",
-    "allowImportingTsExtensions": true,
-    "verbatimModuleSyntax": true,
-    "moduleDetection": "force",
-    "noEmit": true,
-    /* Linting */
-    "strict": true,
-    "noUnusedLocals": true,
-    "noUnusedParameters": true,
-    "erasableSyntaxOnly": false,
-    "noFallthroughCasesInSwitch": true,
-    "noUncheckedSideEffectImports": true
-  },
-  "include": [
-    "vite.config.ts"
-  ]
-}