@svgrid/create-studio 0.2.1 → 0.4.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.
- package/LICENSE +0 -25
- package/README.md +22 -3
- package/index.mjs +9 -2
- package/package.json +4 -4
- package/templates/default/.github/workflows/ci.yml +18 -0
- package/templates/default/DEPLOY.md +47 -0
- package/templates/default/README.md +3 -1
- package/templates/default/_env.example +15 -0
- package/templates/default/_package.json +2 -1
- package/templates/default/src/lib/data.ts +1 -1
- package/templates/default/src/routes/+layout.svelte +2 -2
package/LICENSE
CHANGED
|
@@ -1,28 +1,3 @@
|
|
|
1
|
-
This repository is a multi-package workspace. Different packages ship
|
|
2
|
-
under different licenses. The authoritative license for each package is
|
|
3
|
-
the LICENSE file inside that package directory.
|
|
4
|
-
|
|
5
|
-
------------------------------------------------------------------------
|
|
6
|
-
Per-package licensing
|
|
7
|
-
------------------------------------------------------------------------
|
|
8
|
-
|
|
9
|
-
packages/grid/ MIT (terms below, and packages/grid/LICENSE)
|
|
10
|
-
packages/enterprise/ Commercial - see packages/enterprise/LICENSE
|
|
11
|
-
packages/mcp/ Commercial - see packages/mcp/LICENSE
|
|
12
|
-
website/ Proprietary - see website/LICENSE
|
|
13
|
-
|
|
14
|
-
Only `@svgrid/grid` is open source. Everything else in this
|
|
15
|
-
repository (the Pro feature pack, the MCP server, the marketing +
|
|
16
|
-
docs website, and any other package added later that does not ship
|
|
17
|
-
its own MIT LICENSE) is proprietary and may not be copied, modified,
|
|
18
|
-
or redistributed without a paid license. Source is visible in this
|
|
19
|
-
repository for transparency and for paying customers; visibility does
|
|
20
|
-
not grant a license.
|
|
21
|
-
|
|
22
|
-
------------------------------------------------------------------------
|
|
23
|
-
MIT License (applies ONLY to packages/grid)
|
|
24
|
-
------------------------------------------------------------------------
|
|
25
|
-
|
|
26
1
|
MIT License
|
|
27
2
|
|
|
28
3
|
Copyright (c) 2026 jQWidgets Ltd
|
package/README.md
CHANGED
|
@@ -1,4 +1,23 @@
|
|
|
1
|
-
|
|
1
|
+
<p align="center">
|
|
2
|
+
<img src="https://svgrid.com/brand/svgrid-logo-icon-1200.png" alt="SvGrid" width="100" height="100" />
|
|
3
|
+
</p>
|
|
4
|
+
|
|
5
|
+
<h1 align="center">@svgrid/create-studio</h1>
|
|
6
|
+
|
|
7
|
+
<p align="center"><strong>Scaffold a runnable SvelteKit data app in one command.</strong></p>
|
|
8
|
+
|
|
9
|
+
<p align="center">
|
|
10
|
+
<a href="https://www.npmjs.com/package/@svgrid/create-studio"><img src="https://img.shields.io/npm/v/%40svgrid%2Fcreate-studio.svg?label=%40svgrid%2Fcreate-studio" alt="npm version" /></a>
|
|
11
|
+
<a href="./LICENSE"><img src="https://img.shields.io/badge/license-MIT-brightgreen.svg" alt="MIT License" /></a>
|
|
12
|
+
</p>
|
|
13
|
+
|
|
14
|
+
<p align="center">
|
|
15
|
+
<a href="https://svgrid.com">Website</a> ·
|
|
16
|
+
<a href="https://svgrid.com/docs/">Docs</a> ·
|
|
17
|
+
<a href="https://svgrid.com/pricing/">Pricing</a>
|
|
18
|
+
</p>
|
|
19
|
+
|
|
20
|
+
---
|
|
2
21
|
|
|
3
22
|
Scaffold a runnable **SvGrid Studio** data app in one command.
|
|
4
23
|
|
|
@@ -32,7 +51,7 @@ npm create @svgrid/studio@latest my-app -- --from ./src/lib/db/schema.ts
|
|
|
32
51
|
|
|
33
52
|
## From a designer project
|
|
34
53
|
|
|
35
|
-
Export a `studio.config.json` from the [visual app designer](https://
|
|
54
|
+
Export a `studio.config.json` from the [visual app designer](https://svgrid.com/docs/enterprise/studio/app-designer/)
|
|
36
55
|
and generate the exact screens + blocks you arranged:
|
|
37
56
|
|
|
38
57
|
```bash
|
|
@@ -87,6 +106,6 @@ The grid, form, sorting, filtering, and paging keep working unchanged.
|
|
|
87
106
|
|
|
88
107
|
## Links
|
|
89
108
|
|
|
90
|
-
- Docs: https://
|
|
109
|
+
- Docs: https://svgrid.com/docs/enterprise/studio/
|
|
91
110
|
- Grid: [`@svgrid/grid`](https://www.npmjs.com/package/@svgrid/grid)
|
|
92
111
|
- Studio / enterprise: [`@svgrid/enterprise`](https://www.npmjs.com/package/@svgrid/enterprise)
|
package/index.mjs
CHANGED
|
@@ -85,11 +85,14 @@ ${color('bold', 'Examples')}
|
|
|
85
85
|
npm create @svgrid/studio@latest my-app -- --from ./prisma/schema.prisma
|
|
86
86
|
npm create @svgrid/studio@latest my-app -- --project ./studio.config.json
|
|
87
87
|
npm create @svgrid/studio@latest my-app -- --theme material --dark
|
|
88
|
+
|
|
89
|
+
${color('bold', 'Have a database?')}
|
|
90
|
+
npx @svgrid/studio init reads your tables and scaffolds a page for each.
|
|
88
91
|
`)
|
|
89
92
|
}
|
|
90
93
|
|
|
91
94
|
const THEME_IDS = [
|
|
92
|
-
'shadcn', 'tailwind', 'material', 'excel', 'fluent', 'carbon', 'sap',
|
|
95
|
+
'ember', 'shadcn', 'tailwind', 'material', 'excel', 'fluent', 'carbon', 'sap',
|
|
93
96
|
'salesforce', 'atlassian', 'github', 'antd', 'ag-alpine', 'bootstrap',
|
|
94
97
|
'vercel', 'linear', 'notion', 'nord', 'dracula', 'catppuccin',
|
|
95
98
|
]
|
|
@@ -187,6 +190,9 @@ async function applyProject(destDir, projectPath) {
|
|
|
187
190
|
const files = studio.emitStudioAppBundle(project)
|
|
188
191
|
for (const f of files) {
|
|
189
192
|
const full = join(destDir, f.path)
|
|
193
|
+
// User-owned companions (handlers.ts) are write-once: never overwrite an
|
|
194
|
+
// existing one on regeneration - same contract as the designer server.
|
|
195
|
+
if (typeof studio.skipUserOwned === 'function' && studio.skipUserOwned(f, existsSync(full))) continue
|
|
190
196
|
await mkdir(dirname(full), { recursive: true })
|
|
191
197
|
await writeFile(full, f.contents)
|
|
192
198
|
}
|
|
@@ -373,7 +379,8 @@ async function main() {
|
|
|
373
379
|
stdout.write(` cd ${target}\n`)
|
|
374
380
|
stdout.write(` npm install\n`)
|
|
375
381
|
stdout.write(` npm run dev\n\n`)
|
|
376
|
-
stdout.write(`${color('dim', '
|
|
382
|
+
stdout.write(`${color('dim', 'Have a database?')} npx @svgrid/studio init ${color('dim', 'reads your tables and scaffolds a page for each.')}\n`)
|
|
383
|
+
stdout.write(`${color('dim', 'Docs:')} https://svgrid.com/docs/enterprise/studio/\n\n`)
|
|
377
384
|
}
|
|
378
385
|
|
|
379
386
|
main().catch((err) => {
|
package/package.json
CHANGED
|
@@ -4,15 +4,15 @@
|
|
|
4
4
|
"type": "commercial",
|
|
5
5
|
"url": "https://svgrid.com/pricing"
|
|
6
6
|
},
|
|
7
|
-
"version": "0.
|
|
7
|
+
"version": "0.4.0",
|
|
8
8
|
"description": "Scaffold a runnable SvGrid Studio data app in one command: npm create @svgrid/studio@latest",
|
|
9
9
|
"type": "module",
|
|
10
10
|
"license": "MIT",
|
|
11
11
|
"author": "jQWidgets Ltd",
|
|
12
|
-
"homepage": "https://
|
|
12
|
+
"homepage": "https://svgrid.com",
|
|
13
13
|
"repository": {
|
|
14
14
|
"type": "git",
|
|
15
|
-
"url": "https://github.com/sv-grid/sv-grid.git",
|
|
15
|
+
"url": "git+https://github.com/sv-grid/sv-grid.git",
|
|
16
16
|
"directory": "packages/create-studio"
|
|
17
17
|
},
|
|
18
18
|
"keywords": [
|
|
@@ -41,6 +41,6 @@
|
|
|
41
41
|
"node": ">=18"
|
|
42
42
|
},
|
|
43
43
|
"dependencies": {
|
|
44
|
-
"@svgrid/enterprise": "^2.
|
|
44
|
+
"@svgrid/enterprise": "^2.4.0"
|
|
45
45
|
}
|
|
46
46
|
}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
# Build + type-check every push. Generated by SvGrid Studio.
|
|
2
|
+
name: CI
|
|
3
|
+
on:
|
|
4
|
+
push:
|
|
5
|
+
branches: [main]
|
|
6
|
+
pull_request:
|
|
7
|
+
|
|
8
|
+
jobs:
|
|
9
|
+
build:
|
|
10
|
+
runs-on: ubuntu-latest
|
|
11
|
+
steps:
|
|
12
|
+
- uses: actions/checkout@v4
|
|
13
|
+
- uses: actions/setup-node@v4
|
|
14
|
+
with:
|
|
15
|
+
node-version: 22
|
|
16
|
+
- run: npm install
|
|
17
|
+
- run: npm run check
|
|
18
|
+
- run: npm run build
|
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
# Deploying
|
|
2
|
+
|
|
3
|
+
This app uses SvelteKit's `@sveltejs/adapter-auto`, which detects Vercel, Netlify,
|
|
4
|
+
and Cloudflare Pages automatically at build time. A CI workflow
|
|
5
|
+
(`.github/workflows/ci.yml`) checks + builds every push.
|
|
6
|
+
|
|
7
|
+
## Environment variables
|
|
8
|
+
|
|
9
|
+
Nothing is required while the app runs on its seeded in-memory data. When you
|
|
10
|
+
connect a real database or add auth, copy `.env.example` to `.env` locally and
|
|
11
|
+
set the same variables in your host's dashboard (see `.env.example` for the
|
|
12
|
+
list).
|
|
13
|
+
|
|
14
|
+
## Option A - Git integration (simplest)
|
|
15
|
+
|
|
16
|
+
1. Push this repo to GitHub.
|
|
17
|
+
2. Import it at your provider - <https://vercel.com/new>,
|
|
18
|
+
<https://app.netlify.com/start>, or <https://dash.cloudflare.com/> (Pages) -
|
|
19
|
+
the SvelteKit build is auto-detected.
|
|
20
|
+
3. Add any environment variables in the host's dashboard.
|
|
21
|
+
|
|
22
|
+
Every push to `main` then redeploys automatically.
|
|
23
|
+
|
|
24
|
+
## Option B - Deploy from your machine
|
|
25
|
+
|
|
26
|
+
```bash
|
|
27
|
+
npm run deploy # runs: npx vercel deploy --prod
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
Prefer Netlify or Cloudflare? Use `npx netlify deploy --build --prod` or
|
|
31
|
+
`npx wrangler pages deploy` instead, and consider pinning the matching SvelteKit
|
|
32
|
+
adapter in `svelte.config.js` (`@sveltejs/adapter-netlify` /
|
|
33
|
+
`@sveltejs/adapter-cloudflare`).
|
|
34
|
+
|
|
35
|
+
## Connecting a real database before deploy
|
|
36
|
+
|
|
37
|
+
The starter's grids run on in-memory seed data - a deployed copy works, but data
|
|
38
|
+
resets on every restart and isn't shared between visitors. To go persistent:
|
|
39
|
+
|
|
40
|
+
1. Bind your entities to a database - the fastest path is the Studio designer
|
|
41
|
+
(`npx @svgrid/studio designer`) or `npx @svgrid/studio add <table> --db
|
|
42
|
+
postgres --url "$DATABASE_URL"`.
|
|
43
|
+
2. Regenerate; the emitted app then includes the connected API routes and a
|
|
44
|
+
`DEPLOY.md` with database-specific steps (tables, migrations, seeding).
|
|
45
|
+
3. Set `DATABASE_URL` locally and on your host.
|
|
46
|
+
|
|
47
|
+
Docs: <https://svgrid.com/docs/enterprise/studio/>
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
# My Studio App
|
|
2
2
|
|
|
3
|
-
A data app built with
|
|
3
|
+
A SvelteKit data app built with
|
|
4
|
+
[SvGrid Studio](https://svgrid.com/docs/enterprise/studio/) and the
|
|
5
|
+
[SvGrid](https://svgrid.com) data grid.
|
|
4
6
|
|
|
5
7
|
```bash
|
|
6
8
|
npm install
|
|
@@ -0,0 +1,15 @@
|
|
|
1
|
+
# Environment variables. This starter runs fully in-memory, so nothing here is
|
|
2
|
+
# required to start - copy to .env and fill in as you grow the app.
|
|
3
|
+
|
|
4
|
+
# Your database connection string, once you bind entities to a real database
|
|
5
|
+
# (Neon / Supabase / Postgres / MySQL / SQLite path). See DEPLOY.md.
|
|
6
|
+
# DATABASE_URL=
|
|
7
|
+
|
|
8
|
+
# Turso / libSQL auth token (only for Turso).
|
|
9
|
+
# DATABASE_AUTH_TOKEN=
|
|
10
|
+
|
|
11
|
+
# Session signing secret - required if you add authentication. Use a long random value.
|
|
12
|
+
# SESSION_SECRET=
|
|
13
|
+
|
|
14
|
+
# Optional: your SvGrid license key removes the unlicensed watermark.
|
|
15
|
+
# VITE_SVPRO_KEY=
|
|
@@ -7,7 +7,8 @@
|
|
|
7
7
|
"dev": "vite dev",
|
|
8
8
|
"build": "vite build",
|
|
9
9
|
"preview": "vite preview",
|
|
10
|
-
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json"
|
|
10
|
+
"check": "svelte-kit sync && svelte-check --tsconfig ./tsconfig.json",
|
|
11
|
+
"deploy": "npx vercel deploy --prod"
|
|
11
12
|
},
|
|
12
13
|
"devDependencies": {
|
|
13
14
|
"@sveltejs/adapter-auto": "^6.0.0",
|
|
@@ -5,10 +5,10 @@
|
|
|
5
5
|
* one with `npx @svgrid/studio add <table> --db postgres --url ...`) - the grid,
|
|
6
6
|
* form, sorting, filtering, and paging keep working unchanged.
|
|
7
7
|
*/
|
|
8
|
+
import type { ServerDataSource } from '@svgrid/grid'
|
|
8
9
|
import {
|
|
9
10
|
createInMemoryDataSource,
|
|
10
11
|
createRelationLookup,
|
|
11
|
-
type ServerDataSource,
|
|
12
12
|
} from '@svgrid/enterprise'
|
|
13
13
|
import { customerSchema, orderSchema, productSchema, type Customer, type Order, type Product } from './schemas'
|
|
14
14
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<script lang="ts">
|
|
2
2
|
import '../app.css'
|
|
3
|
-
import { page } from '$app/
|
|
3
|
+
import { page } from '$app/state'
|
|
4
4
|
|
|
5
5
|
let { children } = $props()
|
|
6
6
|
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
<a class="app__brand" href="/">My Studio App</a>
|
|
18
18
|
<nav class="app__links">
|
|
19
19
|
{#each nav as item (item.href)}
|
|
20
|
-
<a class="app__link" class:is-active={
|
|
20
|
+
<a class="app__link" class:is-active={page.url.pathname === item.href} href={item.href}>{item.label}</a>
|
|
21
21
|
{/each}
|
|
22
22
|
</nav>
|
|
23
23
|
<span class="app__foot">Built with SvGrid Studio</span>
|