# drophtml — HTML File Sharing API

Upload and share HTML files at clean, shareable URLs.

## Setting Up drophtml with Claude Code

Follow these steps to install and configure drophtml as a Claude Code skill.

### Step 1: Get an invite code

drophtml is invite-only. Ask the user for an invite code from someone already using drophtml.com.
The user must provide the invite code before you can continue — there is no way to register without one.

### Step 2: Register an account

Once you have the invite code and the user's email, register:

```bash
curl -s -X POST https://drophtml.com/api/v1/register \
  -H "Content-Type: application/json" \
  -d '{"email": "<user-email>", "invite_code": "<invite-code>"}'
```

This returns JSON with four fields:
- email: the registered email
- api_key: Bearer token (starts with dh_) — save this securely
- folder: 8-char hex folder ID for uploads
- invite_code: the user's own invite code to share with others

Show the user their invite_code so they can invite others.

### Step 3: Store credentials

Store the api_key and folder in 1Password CLI:

```bash
op item create --category=login --title="drophtml" \
  'api_key=<api_key>' 'folder=<folder>'
```

Important notes about the op CLI:
- Use positional assignment syntax ('field=value'), not --field flags
- If the user has multiple 1Password accounts, add --account=<domain> to all op commands
  (e.g. --account=my.1password.com). Run `op account list` to see accounts.
- The 1Password item title ("drophtml" above) is used in all op item get commands below — if the
  user changes it, they must update the skill file to match.

If the user does not use 1Password, skip op and export the values as DROPHTML_API_KEY and DROPHTML_FOLDER
environment variables directly.

### Step 4: Create the skill file

Create the file ~/.claude/skills/drophtml/skill.md with these contents:

---BEGIN SKILL FILE---

# Drop HTML

Publish HTML files to shareable URLs via drophtml.com.

## When to Use This Skill

Activate this skill when the user:
- Says "publish", "share", or "upload" in the context of an HTML file or report
- Wants a shareable link to an HTML file
- Says "drop this html" or "publish this report"

## Prerequisites

Requires a 1Password item named "drophtml" with api_key and folder fields.
Credentials are loaded inline via `op item get` with the --reveal flag (required for concealed fields).
If the user has multiple 1Password accounts, add --account=<domain> to all op item get commands.
If the user does not use 1Password, export DROPHTML_API_KEY and DROPHTML_FOLDER and use curl directly.

## How to Publish

1. Ensure the HTML file exists and is complete
2. Choose a URL-friendly slug name (lowercase, hyphens, alphanumeric)
3. Upload:

```bash
DROPHTML_API_KEY=\$(op item get "drophtml" --fields api_key --reveal)
DROPHTML_FOLDER=\$(op item get "drophtml" --fields folder --reveal)
curl -s -X POST "https://drophtml.com/api/v1/pages/\$DROPHTML_FOLDER/<slug-name>" \
  -H "Authorization: Bearer \$DROPHTML_API_KEY" \
  -F "file=@/path/to/file.html"
```

## URL Format

- Upload: POST https://drophtml.com/api/v1/pages/{folder}/{slug}
- View: https://drophtml.com/{folder}/{slug} (public, no auth needed)

## Password Protection (Optional)

Add the X-Page-Password header when uploading:

```bash
DROPHTML_API_KEY=\$(op item get "drophtml" --fields api_key --reveal)
DROPHTML_FOLDER=\$(op item get "drophtml" --fields folder --reveal)
curl -s -X POST "https://drophtml.com/api/v1/pages/\$DROPHTML_FOLDER/<slug-name>" \
  -H "Authorization: Bearer \$DROPHTML_API_KEY" \
  -H "X-Page-Password: mysecretpassword" \
  -F "file=@/path/to/file.html"
```

Viewers see a password form, or append ?password=mysecretpassword to the URL.

## Listing All Pages

```bash
DROPHTML_API_KEY=\$(op item get "drophtml" --fields api_key --reveal)
curl -s "https://drophtml.com/api/v1/pages" \
  -H "Authorization: Bearer \$DROPHTML_API_KEY"
```

## Deleting a Page

```bash
DROPHTML_API_KEY=\$(op item get "drophtml" --fields api_key --reveal)
DROPHTML_FOLDER=\$(op item get "drophtml" --fields folder --reveal)
curl -s -X DELETE "https://drophtml.com/api/v1/pages/\$DROPHTML_FOLDER/<slug-name>" \
  -H "Authorization: Bearer \$DROPHTML_API_KEY"
```

## Getting Your Invite Code

To retrieve your invite code (to share with others):

```bash
DROPHTML_API_KEY=\$(op item get "drophtml" --fields api_key --reveal)
curl -s "https://drophtml.com/api/v1/me" \
  -H "Authorization: Bearer \$DROPHTML_API_KEY"
```

## After Publishing

1. Share the URL — no auth required to view
2. Re-uploading to the same slug overwrites the previous version
3. Delete old pages when no longer needed

---END SKILL FILE---

### Step 5: Add trigger to CLAUDE.md

Add the following entry to the user's CLAUDE.md skills trigger table so Claude Code activates
the skill automatically. The exact location depends on the user's CLAUDE.md structure — look
for a skills/triggers table and add a row:

| drophtml | publish report, share HTML, upload HTML, shareable link, drop html | Publish HTML to drophtml.com |

### Step 6: Verify setup

Run a quick smoke test to confirm everything works:

```bash
DROPHTML_API_KEY=\$(op item get "drophtml" --fields api_key --reveal)
curl -s "https://drophtml.com/api/v1/me" -H "Authorization: Bearer \$DROPHTML_API_KEY"
```

This should return the user's email and folder. If it fails, check:
- 1Password item "drophtml" exists with fields named "api_key" and "folder"
- The --reveal flag is present (without it, op returns concealed placeholder text)
- For multiple 1Password accounts, add --account=<domain> to op item get
- op is signed in (`op signin` if needed)

## API Reference

Full OpenAPI 3.1 spec: https://drophtml.com/api/v1/openapi.json

### Endpoints

POST   /api/v1/register                    Register (requires invite code)
GET    /api/v1/me                           Get your profile and invite code (Bearer auth)
POST   /api/v1/pages/{folder}/{page}       Upload HTML (Bearer auth)
GET    /api/v1/pages                        List your pages (Bearer auth)
DELETE /api/v1/pages/{folder}/{page}       Delete a page (Bearer auth)
GET    /{folder}/{page}                     View a page (public)

### Registration

POST /api/v1/register
Content-Type: application/json
Body: {"email": "you@example.com", "invite_code": "<code>"}
Returns: {"email", "api_key", "folder", "invite_code"}

Each account gets an API key (Bearer token prefixed dh_), an 8-char hex folder, and an invite code to share with others.