capture_reference
Persist any grabbed UI pattern as a durable reference with selector, styles, HTML, URL, and an offline thumbnail. Keeps design work from vanishing when the tab closes.
Instructions
Persist a pattern grabbed from any page so it survives the browser tab. Call it after get_grabbed_elements returns a selection, passing that selection's selector/styles/html/rect/stateStyles plus the URL it was grabbed from. Stores one JSON record under ~/.raven/references; html over 8000 chars is truncated and flagged, style maps over 200 properties are rejected, and non-http(s) URLs are rejected. Every save gets a fresh ref_id, so grabbing the same element twice keeps both. When html is supplied it also renders a PNG thumbnail beside the record by rebuilding that markup offline in headless Chromium — every external request is blocked, so remote images and webfonts are absent and the record says so (image.fidelity 'offline'). The thumbnail is best-effort: if no browser is available the capture still succeeds, with no image field. It does not fetch the source URL, and does not map anything onto the project's tokens — that is map_reference_to_tokens.
Input Schema
| Name | Required | Description | Default |
|---|---|---|---|
| app | No | Human name of the source app, e.g. 'Linear' | |
| url | Yes | Full http(s) URL of the page the pattern was grabbed from | |
| html | No | outerHTML of the grabbed element; truncated to 8000 chars on save | |
| note | No | The designer's own words about why this pattern was kept; the highest-weighted field in search | |
| rect | No | Bounding rect of the grabbed element in page coordinates | |
| tags | Yes | Topic tags for later filtering, e.g. ['hero','typography'] | |
| owner | Yes | Whether the pattern came from the user's own product or someone else's site | |
| styles | Yes | Computed styles exactly as captured; rejected over 200 properties | |
| selector | Yes | CSS selector of the grabbed element, from the grab selection | |
| taxonomy | No | Stable pattern-kind ids binding this element to Raven's controlled vocabulary — this is what makes it findable by INTENT ('a scrolling mouse icon in a hero') rather than by the words that happen to be in the note. Bind every applicable kind; an unrecognized id is rejected with near matches. One of: scroll-cue, hero, sticky-nav, top-nav, sidebar-nav, breadcrumbs, command-palette, dropdown-menu, mobile-menu, cta-button, sticky-cta, pricing-card, pricing-toggle, comparison-table, testimonial, testimonial-marquee, logo-cloud, star-rating, signup-form, social-login, stepper, inline-validation, empty-state, no-results, error-message, error-page, skeleton-loader, progress-indicator, modal, confirmation-dialog, toast, bottom-sheet, kpi-card, activity-feed, feature-block, footer-cta | |
| stateStyles | No | Alias of state_styles, matching the field name get_grabbed_elements returns | |
| state_styles | No | Per-state styles, either { hover: { color: 'red' } } or the grab selection's own { hover: { declarations: [{ property, value }] } } |