{
  "$schema": "https://hyperframes.heygen.com/schema/registry-item.json",
  "name": "before-after-wipe",
  "type": "hyperframes:component",
  "title": "Before After Wipe",
  "description": "Two full-bleed content slots compare before and after states as a persistent divider wipes the after layer over the before layer and rests at a configurable split. Callers fill the named before/after slot panels; token-styled defaults render when a slot is left empty.",
  "tags": ["prop", "ui-props", "compare", "holdable", "before-after", "wipe", "slots"],
  "jobs": ["compare"],
  "family": "ui-props",
  "profile": "holdable",
  "evidence": "Wave J U-B: comparison-split divider-wipe mechanic ported onto real content slots",
  "syncPoints": [{ "id": "wipe-land", "phase": "in", "offset": 1.3 }],
  "files": [
    {
      "path": "before-after-wipe.html",
      "target": "compositions/components/before-after-wipe.html",
      "type": "hyperframes:snippet"
    }
  ],
  "variables": [
    {
      "id": "label_a",
      "type": "string",
      "role": "content",
      "label": "Before label",
      "description": "Chip shown on the base before panel. Blank hides the chip.",
      "default": "Before"
    },
    {
      "id": "label_b",
      "type": "string",
      "role": "content",
      "label": "After label",
      "description": "Chip shown on the revealed after panel. Blank hides the chip.",
      "default": "After"
    },
    {
      "id": "rest_split",
      "type": "number",
      "role": "layout",
      "label": "Resting split",
      "description": "Divider resting position after the wipe lands.",
      "default": 50,
      "min": 0,
      "max": 100,
      "step": 1,
      "unit": "%"
    },
    {
      "id": "wipe_at",
      "type": "number",
      "role": "timing",
      "label": "Wipe start",
      "description": "Seconds after mount start when the wipe begins.",
      "default": 0.25,
      "min": 0,
      "max": 8,
      "step": 0.05,
      "unit": "s"
    },
    {
      "id": "accent",
      "type": "enum",
      "role": "style",
      "label": "Accent",
      "description": "Divider handle and after chip color.",
      "default": "green",
      "options": [
        { "value": "green", "label": "Green" },
        { "value": "blue", "label": "Blue" },
        { "value": "violet", "label": "Violet" }
      ]
    },
    {
      "id": "exit",
      "type": "enum",
      "role": "timing",
      "label": "Exit",
      "description": "Outgoing transition. None holds the final comparison frame.",
      "default": "none",
      "options": [
        { "value": "none", "label": "None" },
        { "value": "fade", "label": "Fade" },
        { "value": "up", "label": "Up" }
      ]
    }
  ]
}