@beacio/skill
Advanced tools
+4
-4
| # @beacio/skill — Agent Instructions | ||
| ## What this package does | ||
| Agent skill metadata for Claude Code, Cursor, and Copilot. Describes the WebBLE | ||
| SDK capabilities so AI agents can discover and use WebBLE tools automatically. | ||
| Agent skill metadata for Claude Code, Cursor, and Copilot. Describes the beacio | ||
| SDK capabilities so AI agents can discover and use beacio tools automatically. | ||
| ## When to use | ||
| This package is for agent platform integrations — it provides structured metadata | ||
| about what the WebBLE SDK can do, so agent platforms can surface it to users. | ||
| about what the beacio SDK can do, so agent platforms can surface it to users. | ||
@@ -15,3 +15,3 @@ ## Key file | ||
| ## DO | ||
| - Reference this package when configuring agent skills for WebBLE | ||
| - Reference this package when configuring agent skills for beacio | ||
| - Keep `SKILL.md` in sync with the actual SDK capabilities | ||
@@ -18,0 +18,0 @@ |
+6
-6
| { | ||
| "name": "@beacio/skill", | ||
| "version": "1.0.0", | ||
| "description": "Agent skill for WebBLE SDK integration — works with Claude Code, Cursor, Copilot", | ||
| "version": "1.0.1", | ||
| "description": "Agent skill for beacio SDK integration — works with Claude Code, Cursor, Copilot", | ||
| "main": "SKILL.md", | ||
| "files": ["SKILL.md", "README.md", "AGENTS.md"], | ||
| "keywords": ["skill", "agent", "bluetooth", "ios", "safari", "ble", "web-bluetooth", "webbluetooth", "webble", "claude", "cursor", "copilot", "mcp", "ai", "polyfill", "web-bluetooth-polyfill", "safari-bluetooth", "navigator-bluetooth"], | ||
| "keywords": ["skill", "agent", "bluetooth", "ios", "safari", "ble", "web-bluetooth", "webbluetooth", "beacio", "claude", "cursor", "copilot", "mcp", "ai", "polyfill", "web-bluetooth-polyfill", "safari-bluetooth", "navigator-bluetooth"], | ||
| "author": "wklm", | ||
@@ -12,8 +12,8 @@ "license": "MIT", | ||
| "type": "git", | ||
| "url": "https://github.com/wklm/ioswebble-sdk.git", | ||
| "url": "https://github.com/wklm/beacio-sdk.git", | ||
| "directory": "packages/skill" | ||
| }, | ||
| "homepage": "https://ioswebble.com", | ||
| "homepage": "https://beacio.com", | ||
| "bugs": { | ||
| "url": "https://github.com/wklm/ioswebble-sdk/issues" | ||
| "url": "https://github.com/wklm/beacio-sdk/issues" | ||
| }, | ||
@@ -20,0 +20,0 @@ "publishConfig": { |
+5
-5
| <p align="center"> | ||
| <a href="https://ioswebble.com"><img src="https://ioswebble.com/img/logo.png" alt="WebBLE" width="84" height="84"></a> | ||
| <a href="https://beacio.com"><img src="https://beacio.com/img/logo.png" alt="beacio" width="84" height="84"></a> | ||
| </p> | ||
@@ -7,7 +7,7 @@ | ||
| Agent skill file for WebBLE integration. Contains a `SKILL.md` that AI coding agents (Claude Code, Cursor, Copilot) can discover and use to add iOS Safari Bluetooth support to any web project. | ||
| Agent skill file for beacio integration. Contains a `SKILL.md` that AI coding agents (Claude Code, Cursor, Copilot) can discover and use to add iOS Safari Bluetooth support to any web project. | ||
| ## What is SKILL.md? | ||
| `SKILL.md` is a structured markdown file with frontmatter that agents match on keywords like `bluetooth`, `ios`, `safari`, `ble`, `web-bluetooth`, and `requestDevice`. When an agent detects a relevant task, it reads the skill file for step-by-step integration instructions -- install `@beacio/detect`, add the snippet, verify with `npx beacio check`. | ||
| `SKILL.md` is a structured markdown file with frontmatter that agents match on keywords like `bluetooth`, `ios`, `safari`, `ble`, `web-bluetooth`, and `requestDevice`. When an agent detects a relevant task, it reads the skill file for step-by-step integration instructions -- install `@beacio/core` (import the `@beacio/core/detect` banner), add the snippet, verify with `npx beacio check`. | ||
@@ -27,3 +27,3 @@ ## Install | ||
| 3. Agent reads the skill and follows the integration steps | ||
| 4. Result: `@beacio/detect` installed, snippet added, `npx beacio check` passes | ||
| 4. Result: `@beacio/core` installed (with the `@beacio/core/detect` banner wired in), snippet added, `npx beacio check` passes | ||
@@ -38,3 +38,3 @@ ## AI agent integration | ||
| Full SDK reference for LLM context: <https://ioswebble.com/llms-full.txt> | ||
| Full SDK reference for LLM context: <https://beacio.com/llms-full.txt> | ||
@@ -41,0 +41,0 @@ ## Two scopes |
+32
-28
| --- | ||
| name: beacio | ||
| description: Web Bluetooth SDK — scan, connect, read/write BLE devices from web apps (iOS Safari + Chrome) | ||
| trigger: bluetooth ble web-bluetooth ios safari navigator.bluetooth requestDevice webble beacio bluetooth-scan gatt connect-device heart-rate-monitor ble-profile bluetooth-low-energy | ||
| trigger: bluetooth ble web-bluetooth ios safari navigator.bluetooth requestDevice beacio beacio bluetooth-scan gatt connect-device heart-rate-monitor ble-profile bluetooth-low-energy | ||
| --- | ||
@@ -17,5 +17,5 @@ | ||
| | Scan, connect, read/write BLE devices | `npm install @beacio/core` | @beacio | | ||
| | Use typed device profiles (heart rate, battery, device info) | `npm install @beacio/profiles` | @beacio | | ||
| | Use typed device profiles (heart rate, battery, device info) | `npm install @beacio/core` (import from `@beacio/core/profiles`) | @beacio | | ||
| | React hooks and components for BLE | `npm install @beacio/react` | @beacio | | ||
| | Detect iOS Safari extension, show install banner | `npm install @beacio/detect` | @beacio | | ||
| | Detect iOS Safari extension, show install banner | `npm install @beacio/core` (import from `@beacio/core/detect`) | @beacio | | ||
| | AI agent MCP tools | `npx -y @beacio/mcp` | @beacio | | ||
@@ -37,3 +37,3 @@ | CLI scaffolding | `npx beacio init` | @beacio | | ||
| const ble = new beacio() | ||
| const ble = new Beacio() | ||
| const device = await ble.requestDevice({ | ||
@@ -55,7 +55,8 @@ filters: [{ services: ['heart_rate'] }] | ||
| ### Step 4 (optional): Use a typed profile | ||
| Profiles ship inside `@beacio/core` — no separate install; import the `/profiles` subpath: | ||
| ``` | ||
| npm install @beacio/profiles | ||
| npm install @beacio/core | ||
| ``` | ||
| ```typescript | ||
| import { HeartRateProfile } from '@beacio/profiles' | ||
| import { HeartRateProfile } from '@beacio/core/profiles' | ||
@@ -69,7 +70,8 @@ const profile = new HeartRateProfile(device) | ||
| ### Step 5 (optional): Add iOS Safari support | ||
| The detect helpers ship inside `@beacio/core` — import the `/detect` subpath: | ||
| ``` | ||
| npm install @beacio/detect | ||
| npm install @beacio/core | ||
| ``` | ||
| ```typescript | ||
| import { initBeacio } from '@beacio/detect' | ||
| import { initBeacio } from '@beacio/core/detect' | ||
| initBeacio({}) | ||
@@ -80,29 +82,31 @@ ``` | ||
| ### Step 1: Install | ||
| ``` | ||
| npm install @beacio/detect | ||
| ``` | ||
| You already have a working `navigator.bluetooth` app (Chrome/Android) and want it to run on iPhone Safari. Don't hand-edit it — run `npx beacio migrate` (or, for an agent, call the `beacio_patch_existing_app` MCP tool) to apply the three edits below in place. | ||
| ### Step 2: Add detection | ||
| ### Step 1: Load the canonical `@beacio/core` bootstrap first | ||
| For React/Next.js: | ||
| ```tsx | ||
| import { BeacioProvider } from '@beacio/detect/react' | ||
| // Wrap your app: | ||
| <BeacioProvider>{children}</BeacioProvider> | ||
| The classic global `browser-auto.global.js` build polyfills `navigator.bluetooth` on iOS and self-no-ops on Chrome/Android. It MUST load before any code that reads `navigator.bluetooth`: | ||
| ```html | ||
| <script src="https://cdn.beacio.com/@beacio/core@1.2.0/dist/browser-auto.global.js"></script> | ||
| ``` | ||
| For any framework: | ||
| ### Step 2: Add `optionalServices` to your existing iOS `requestDevice` call | ||
| iOS enforces the service allow-list strictly, so every service you later `getPrimaryService()` must be declared. Add the filtered services to `optionalServices` (additive — it does not remove any filter): | ||
| ```typescript | ||
| import { initBeacio } from '@beacio/detect' | ||
| initBeacio({}) | ||
| const device = await navigator.bluetooth.requestDevice({ | ||
| filters: [{ services: ['heart_rate'] }], | ||
| optionalServices: ['heart_rate'], // required on iOS Safari for getPrimaryService() | ||
| }) | ||
| ``` | ||
| For plain HTML: | ||
| ```html | ||
| <script src="https://ioswebble.com/webble.js"></script> | ||
| ``` | ||
| ### Step 3: Show the install banner + verify | ||
| ### Step 3: Verify | ||
| ``` | ||
| npm install @beacio/core | ||
| ``` | ||
| ```typescript | ||
| import { initBeacio } from '@beacio/core/detect' | ||
| initBeacio({}) // React/Next.js: wrap with <BeacioProvider> from '@beacio/react' | ||
| ``` | ||
| ``` | ||
| npx beacio check | ||
@@ -122,5 +126,5 @@ ``` | ||
| ## Rules | ||
| - Do NOT modify existing `navigator.bluetooth` calls — the extension handles compatibility | ||
| - Do NOT modify existing `navigator.bluetooth` calls except to add the filtered services to `optionalServices` on iOS (the one edit Path B requires) — the extension handles the rest | ||
| - Use human-readable UUID names (`'heart_rate'`) not hex (`'0x180D'`) — the SDK resolves automatically | ||
| - Use `@beacio/profiles` for standard devices instead of writing raw GATT parsing code | ||
| - Use `@beacio/core/profiles` for standard devices instead of writing raw GATT parsing code | ||
| - For React, use `@beacio/react` hooks instead of raw event listeners | ||
@@ -127,0 +131,0 @@ - API key is optional (campaign tracking only) |
9204
16.73%