JSPM

@prisma/studio-core

0.17.0
    • ESM via JSPM
    • ES Module Entrypoint
    • Export Map
    • Keywords
    • License
    • Repository URL
    • TypeScript Types
    • README
    • Created
    • Published
    • Downloads 3109972
    • Score
      100M100P100Q206637F
    • License Apache-2.0

    Modular Prisma Studio components

    Package Exports

    • @prisma/studio-core/data
    • @prisma/studio-core/data/bff
    • @prisma/studio-core/data/mysql-core
    • @prisma/studio-core/data/mysql2
    • @prisma/studio-core/data/node-sqlite
    • @prisma/studio-core/data/pglite
    • @prisma/studio-core/data/postgres-core
    • @prisma/studio-core/data/postgresjs
    • @prisma/studio-core/data/sqlite-core
    • @prisma/studio-core/data/sqljs
    • @prisma/studio-core/ui
    • @prisma/studio-core/ui/index.css

    Readme

    @prisma/studio-core

    @prisma/studio-core is the embeddable Prisma Studio package.

    It provides the same core experience as Prisma Studio: a visual way to explore schema, browse table data, edit rows, filter/sort/paginate records, inspect relation data, and run SQL queries with an operation log.

    This package is published to npm and consumed by Prisma surfaces such as Console and CLI integrations.

    Telemetry

    This package includes anonymized telemetry to help us improve Prisma Studio. Use implies consent. Learn more in our Privacy Policy.

    Run Studio Locally

    Requirements:

    • Node.js ^20.19 || ^22.12 || ^24.0
    • pnpm 8
    • bun

    Install dependencies and start the demo:

    pnpm install
    pnpm demo:ppg

    Then open http://localhost:4310.

    The demo:

    • starts Prisma Postgres dev (ppg-dev) programmatically via @prisma/dev
    • uses direct TCP for query execution
    • seeds sample relational data on startup
    • auto-rebuilds and reloads the UI when source files change

    The demo database is intentionally ephemeral: it is pre-seeded when the demo starts and reset when the demo process stops.

    Useful Commands

    • pnpm demo:ppg - run local Studio demo with seeded Prisma Postgres dev
    • pnpm typecheck - run TypeScript checks
    • pnpm lint - run ESLint (--fix)
    • pnpm test - run default vitest suite
    • pnpm test:checkpoint - run checkpoint tests
    • pnpm test:data - run data-layer tests
    • pnpm test:ui - run UI tests
    • pnpm test:e2e - run e2e tests
    • pnpm demo:ppg:build - bundle the demo server with bun build
    • pnpm demo:ppg:bundle - build and run the bundled demo server
    • pnpm build - build distributable package with tsup
    • pnpm check:exports - validate package export map/types

    When bundling the demo with bun build, we use --packages external so @prisma/dev can resolve its PGlite runtime assets (WASM/data/extensions) directly from node_modules at runtime.

    Development Workflow

    For day-to-day development, use an agent with Playwright available and let the agent run the demo itself.

    Recommended flow:

    1. Let the agent run pnpm demo:ppg.
    2. Let the agent inspect terminal logs and browser behavior together.
    3. Let the agent verify UI state via Playwright after changes.

    Because the demo is pre-seeded and resets between runs, update seed data whenever needed to reproduce richer scenarios.

    Seed data lives in /Users/sorenschmidt/code/studio/demo/ppg-dev/server.ts (seedDatabase).