feat(playground-url): add package to generate playground share links

[joshunrau]

Add @opendatacapture/playground-url, which encodes an instrument's source
files into a shareable playground link (lz-string compressed, matching the
playground's existing URL scheme). Exposes a library (generatePlaygroundURL,
encodeShareURL, decodeShareURL, isFullscreenShareURL) and a playground-url
CLI that points at an instrument directory and emits the link.

Move the share-URL encode/decode logic out of apps/playground into the new
package so the app and CLI share one implementation, and have the playground
consume it (passing baseURL: window.location.origin to preserve dev behavior).

Co-Authored-By: Claude Opus 4.8 noreply@anthropic.com

Summary by CodeRabbit

• New Features

  • Added CLI tool for generating shareable playground URLs from instrument directories
  • Share URLs now support fullscreen mode parameter
  • Created reusable playground URL package with shareable link utilities

• Chores

  • Extracted and refactored share URL utilities into a standalone package for reuse across applications

[coderabbitai]

Caution

Review failed

The pull request is closed.

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Repository UI

Review profile: CHILL

Plan: Pro

Run ID: a7117d72-29f0-45b8-a117-e2e1a0427453

📥 Commits

Reviewing files that changed from the base of the PR and between 085ac9d and d415aac.

⛔ Files ignored due to path filters (1)

• pnpm-lock.yaml is excluded by !**/pnpm-lock.yaml

📒 Files selected for processing (15)

• apps/outreach/package.json
• apps/playground/package.json
• apps/playground/src/components/Header/ShareButton/ShareButton.tsx
• apps/playground/src/pages/IndexPage.tsx
• apps/playground/src/utils/encode.ts
• packages/playground-url/README.md
• packages/playground-url/package.json
• packages/playground-url/scripts/build.js
• packages/playground-url/src/cli.ts
• packages/playground-url/src/index.ts
• packages/playground-url/src/models.ts
• packages/playground-url/src/share-url.test.ts
• packages/playground-url/src/share-url.ts
• packages/playground-url/tsconfig.json
• packages/playground-url/vitest.config.ts

---

Walkthrough

Extracts share URL encoding/decoding logic from the playground app into a new reusable @opendatacapture/playground-url package, adds a CLI tool for generating shareable links from instrument directories, and updates the playground app to depend on the extracted package.

Changes

Playground URL Package Extraction

Layer / File(s)	Summary
Package foundation and configuration packages/playground-url/package.json, packages/playground-url/tsconfig.json, packages/playground-url/vitest.config.ts, packages/playground-url/scripts/build.js	ES module package configured at version 2.0.0 with public access, entrypoint export to ./src/index.ts, and CLI binary at ./dist/cli.js. Build script bundles CLI via esbuild with Node shebang and CommonJS globals shim.
Data models and types packages/playground-url/src/models.ts, packages/playground-url/src/index.ts	Zod schemas $EditorFile and $EditorFiles define typed shapes for editor file content and metadata, exported alongside EditorFile and PlaygroundInstrument types via barrel module.
Share URL encoding and decoding packages/playground-url/src/share-url.ts, packages/playground-url/src/index.ts	Encodes editor files and labels into compressed URL query parameters using lz-string, supports fullscreen flag override, computes byte-length size, and decodes from URL back to PlaygroundInstrument or null.
Share URL logic tests packages/playground-url/src/share-url.test.ts	Vitest cases validate default/custom base URL handling, correct size computation as href byte length, fullscreen flag inclusion, and bidirectional encode/decode round-trips.
CLI tool for link generation packages/playground-url/src/cli.ts	Commander-based CLI reads shareable text files (CSS/HTML/JS/JSON/TS/JSX/TSX) from a directory, warns to stderr and skips binary assets, encodes via encodeShareURL, prints URL to stdout for piping, and optionally opens in browser.
Package documentation packages/playground-url/README.md	Documents exported functions (generatePlaygroundURL, encodeShareURL, decodeShareURL, isFullscreenShareURL), option shapes, CLI usage with flags (--label, --fullscreen, --base-url, --open), and file embedding behavior.
Playground app integration apps/playground/package.json, apps/playground/src/pages/IndexPage.tsx, apps/playground/src/components/Header/ShareButton/ShareButton.tsx	Playground adds @opendatacapture/playground-url dependency and removes local lz-string. IndexPage and ShareButton import decodeShareURL and isFullscreenShareURL from the new package and use encodeShareURL with baseURL: window.location.origin and fullscreen flag.

Estimated code review effort

🎯 3 (Moderate) | ⏱️ ~25 minutes

Possibly related PRs

• DouglasNeuroInformatics/OpenDataCapture#1377: Main PR that extracted the share URL encoding/decoding logic and fullscreen flag handling from the playground app into the new reusable @opendatacapture/playground-url package.

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

Warning

There were issues while running some tools. Please review the errors and either fix the tool's configuration or disable the tool if it's a critical failure.

🔧 ESLint

If the error stems from missing dependencies, add them to the package.json file. For unrecoverable errors (e.g., due to private dependencies), disable the tool in the CodeRabbit configuration.

ESLint install timed out. The project may have too many dependencies for the sandbox.

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}