{"_id":"@alexbruf/radar-runner","name":"@alexbruf/radar-runner","dist-tags":{"latest":"1.1.0"},"versions":{"1.1.0":{"name":"@alexbruf/radar-runner","version":"1.1.0","type":"module","description":"A gravity-based flight game web component — dive into slopes, soar off hilltops, outrun the night","license":"MIT","repository":{"type":"git","url":"git+https://github.com/alexbruf/radar-runner.git"},"main":"./dist/radar-runner.js","module":"./dist/radar-runner.js","types":"./dist/types/main.d.ts","exports":{".":{"types":"./dist/types/main.d.ts","import":"./dist/radar-runner.js"},"./react":{"types":"./dist/types/react.d.ts","import":"./dist/react.js"},"./preact":{"types":"./dist/types/preact.d.ts","import":"./dist/preact.js"},"./vue":{"types":"./dist/types/vue.d.ts","import":"./dist/vue.js"}},"sideEffects":["./dist/radar-runner.js","./src/radar-runner-shell.ts","./src/demo.ts","./src/main.ts"],"scripts":{"dev":"vite dev --config vite.config.demo.ts","build":"vite build && tsc -p tsconfig.build.json","build:demo":"vite build --config vite.config.demo.ts","preview":"vite preview --config vite.config.demo.ts","typecheck":"tsc --noEmit","tui":"bun tui.ts","build:tui":"bun build --compile --minify tui.ts --outfile radar-runner","prepublishOnly":"bun run build"},"dependencies":{"planck":"^1.4.3"},"devDependencies":{"@types/node":"^25.5.0","@types/react":"^19.0.0","preact":"^10.25.0","typescript":"^5.7.0","vite":"^6.0.0","vue":"^3.5.0"},"peerDependencies":{"react":">=17","preact":">=10","vue":">=3"},"peerDependenciesMeta":{"react":{"optional":true},"preact":{"optional":true},"vue":{"optional":true}},"_id":"@alexbruf/radar-runner@1.1.0","gitHead":"3a78e6b296fc6d690589e19ecff8b1bd9d85bd0c","bugs":{"url":"https://github.com/alexbruf/radar-runner/issues"},"homepage":"https://github.com/alexbruf/radar-runner#readme","_nodeVersion":"20.20.0","_npmVersion":"10.8.2","dist":{"integrity":"sha512-OxCUV1njDoE2Io90HRAKgbjYiC3GiznznHRCLXqxJecK1WJoVK4+cWyRNqboVsnhtpa+4//MO/hqv3VmeMMnvg==","shasum":"17c4c0ab52f65bd8ab973844fe7cf6dde17c088d","tarball":"https://registry.npmjs.org/@alexbruf/radar-runner/-/radar-runner-1.1.0.tgz","fileCount":26,"unpackedSize":1062936,"signatures":[{"keyid":"SHA256:DhQ8wR5APBvFHLF/+Tc+AYvPOdTpcIDqOhxsBHRwC7U","sig":"MEUCID4If6ITcmLoCRJIk+1Mnl/n4fLKAzHqFUyHQqO2/dOLAiEAkIfPR0Kqey4Qtqy0tbvcBcTrPUuZ2U4JM4xTnVeI7Mk="}]},"_npmUser":{"name":"alexbruf","email":"alex@brufsky.org"},"directories":{},"maintainers":[{"name":"alexbruf","email":"alex@brufsky.org"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages-npm-production","tmp":"tmp/radar-runner_1.1.0_1773680083691_0.7418763837836144"},"_hasShrinkwrap":false}},"time":{"created":"2026-03-16T16:54:43.613Z","1.1.0":"2026-03-16T16:54:43.896Z","modified":"2026-03-16T16:54:44.060Z"},"maintainers":[{"name":"alexbruf","email":"alex@brufsky.org"}],"description":"A gravity-based flight game web component — dive into slopes, soar off hilltops, outrun the night","homepage":"https://github.com/alexbruf/radar-runner#readme","repository":{"type":"git","url":"git+https://github.com/alexbruf/radar-runner.git"},"bugs":{"url":"https://github.com/alexbruf/radar-runner/issues"},"license":"MIT","readme":"# Radar Runner\n\nA gravity-based flight game as a **web component** — drop it into any page with zero framework dependencies.\n\n**[Play demo](https://alexbruf.github.io/radar-runner/)** | [npm](https://www.npmjs.com/package/@alexbruf/radar-runner)\n\n![Web version](assets/web-screenshot.png)\n\n### Terminal version\n\n![TUI version](assets/tui-screenshot.png)\n\n## Install\n\n```sh\nbun add @alexbruf/radar-runner    # or npm install @alexbruf/radar-runner\n```\n\nOr load from a CDN:\n\n```html\n<script type=\"module\" src=\"https://cdn.jsdelivr.net/npm/@alexbruf/radar-runner/dist/radar-runner.js\"></script>\n```\n\n## Usage\n\n```html\n<!-- That's it -->\n<radar-runner></radar-runner>\n```\n\n### Sizing\n\n```html\n<radar-runner width=\"800\"></radar-runner>   <!-- explicit width, height auto (8:5 ratio) -->\n<radar-runner height=\"300\"></radar-runner>  <!-- explicit height, width auto -->\n<radar-runner></radar-runner>              <!-- fills container, max 640px -->\n```\n\n### Theme\n\nFollows `prefers-color-scheme` by default. Override with `color-mode`:\n\n```html\n<radar-runner color-mode=\"dark\"></radar-runner>\n<radar-runner color-mode=\"light\"></radar-runner>\n```\n\n### Collapsed / accordion mode\n\nStarts as a button. Game loads on first click — zero bytes downloaded until the user engages.\n\n```html\n<radar-runner collapsed></radar-runner>\n```\n\nCustomize the open/close button content with named slots:\n\n```html\n<radar-runner collapsed>\n  <span slot=\"open\">Play a game</span>\n  <span slot=\"close\">Hide game</span>\n</radar-runner>\n```\n\nPut whatever you want in the slots — SVGs, images, styled text:\n\n```html\n<radar-runner collapsed>\n  <span slot=\"open\">\n    <svg width=\"18\" height=\"18\" viewBox=\"0 0 24 24\"><path d=\"M5 3l14 9-14 9V3z\" fill=\"currentColor\"/></svg>\n    Play while you wait\n  </span>\n  <span slot=\"close\">Close</span>\n</radar-runner>\n```\n\nDefault fallbacks are provided if no slots are used.\n\n### Styling the toggle button\n\nCSS custom properties:\n\n```css\nradar-runner {\n  --rr-toggle-bg: #1a1a2e;\n  --rr-toggle-color: #e94560;\n  --rr-toggle-border: 1px solid #e94560;\n  --rr-toggle-font: 600 16px Inter, sans-serif;\n  --rr-toggle-radius: 12px;\n  --rr-toggle-padding: 12px 32px;\n}\n```\n\nOr use `::part(toggle)` for full CSS access:\n\n```css\nradar-runner::part(toggle) {\n  box-shadow: 0 2px 8px rgba(0,0,0,0.2);\n}\n```\n\n### Styling the in-game buttons\n\n```css\nradar-runner {\n  --rr-btn-padding: 8px;\n  --rr-btn-radius: 8px;\n  --rr-btn-icon-size: 22;\n}\n```\n\nOr via `::part()`:\n\n```css\nradar-runner::part(btn-help),\nradar-runner::part(btn-pause),\nradar-runner::part(btn-reset) {\n  padding: 8px;\n}\n```\n\n## Framework wrappers\n\n### React\n\n```tsx\nimport { RadarRunner } from '@alexbruf/radar-runner/react';\n\n<RadarRunner width={640} colorMode=\"dark\" collapsed>\n  <span slot=\"open\">Play!</span>\n</RadarRunner>\n```\n\n### Preact\n\n```tsx\nimport { RadarRunner } from '@alexbruf/radar-runner/preact';\n\n<RadarRunner width={640} collapsed />\n```\n\n### Vue\n\n```vue\n<script setup>\nimport { RadarRunner } from '@alexbruf/radar-runner/vue';\n</script>\n\n<template>\n  <RadarRunner :width=\"640\" :collapsed=\"true\">\n    <template #open>Play!</template>\n    <template #close>Hide</template>\n  </RadarRunner>\n</template>\n```\n\n## How to play\n\n**Hold** (click, tap, or Space) to dive heavy into slopes. **Release** to float light and soar off hilltops. Fly as far as you can before nightfall catches you.\n\nLand 5 perfect dives in a row to trigger **Fever Mode**.\n\n## Architecture\n\nThe package ships as two chunks:\n\n| File | Size (gzip) | Contents |\n|------|------------|----------|\n| `radar-runner.js` | ~3 KB | Web component shell, loading screen, theme, sizing |\n| `radar-runner-game.js` | ~55 KB | Planck.js physics engine + game logic (lazy-loaded) |\n\nThe game chunk only loads when the component is visible (or on first expand in collapsed mode). Framework wrappers are <1 KB each.\n\n## Terminal version (TUI)\n\nThere's also a standalone terminal version using Unicode braille rendering. See [Releases](../../releases) for prebuilt binaries, or run from source:\n\n```sh\nbun tui.ts\n```\n\n## Development\n\n```sh\nbun install\nbun dev           # demo site at localhost:5173\nbun run build     # library → dist/\nbun run build:demo # demo site → demo-dist/\nbun run typecheck  # type checking\n```\n\n## License\n\nMIT\n","readmeFilename":"README.md","_rev":"1-11b629383bdc6e8920434b84a96adb9b"}