@ludic-labs/assembly 0.0.0-stage → 0.4.0

package/docs/svg/specification.md

@@ -0,0 +1,108 @@
+# `svg-asset/0.1` specification
+
+This document specifies the implemented initial version. Unknown fields and unsupported variants are errors, not ignored extension points. Version changes require a new `schema` identifier. The notation is JSON data, not an expression string language or a container for arbitrary SVG/XML.
+
+## Document and coordinates
+
+Required fields: `schema: "svg-asset/0.1"`, `name`, `viewBox: [x, y, width, height]`, and a nonempty `nodes` array. Width/height must be positive. Optional fields are `seed`, `params`, `palette`, `gradients`, `clips`, `masks`, `symbols`, `animations`, `defaultAnimation`. The complete machine grammar is [the JSON Schema](../../schemas/svg-asset-0.1.schema.json).
+
+X increases rightward, Y downward; lengths use SVG user units. Rotation is in degrees. Trigonometric expressions use radians. Time is in seconds. Roots and siblings paint in array order, later on top. The root viewBox clips the delivered image. Shapes inherit SVG fill/stroke through parent groups; default SVG fill is black, default stroke is none. IDs are identifiers beginning with an ASCII letter, followed by letters, digits, `_` or `-`, maximum 64 characters.
+
+Every node has an `id` unique among its siblings. Instance identity is the ordered expansion path, exposed as `data-part`, such as `root/row/2/book/book/cover`. IDs are semantic labels, never global DOM IDs. Definitions receive generated IDs prefixed by `options.prefix` (default `asset`). When multiple SVGs share an HTML document, callers must use distinct prefixes. Prefixes allow a letter followed by up to 79 letters, digits, underscores or hyphens; animated export appends `-fN`, which must fit that limit too.
+
+`name` is escaped into `<title>` and `aria-label`. Strings must contain valid XML text. The grammar has no scripts, external URLs, event handlers, HTML, embedded images or raw attribute escape hatch. This constrains the output surface; it is not a security certification or a generic sanitizer for arbitrary SVG.
+
+## Numbers, parameters and expressions
+
+`params` maps names to `{ "default": number, "min": number, "max": number }`. Bounds and defaults are required, finite and ordered. Values at both bounds are legal. Parameters named `time`, `phase`, `i`, `n`, `age` or `life` are reserved. Numeric literals and parameter declarations are limited to ±1,000,000. Intermediate evaluated expressions are limited to ±1,000,000,000. Division by zero and invalid bounds are errors.
+
+Anywhere the schema permits a numeric expression, use a literal, `$name` reference or operator tuple:
+
+| Form                                                               | Meaning                                                          |
+| ------------------------------------------------------------------ | ---------------------------------------------------------------- |
+| `["add", a, b]`, `["sub", a, b]`, `["mul", a, b]`, `["div", a, b]` | Binary arithmetic; arity is exactly two                          |
+| `["min", a, b]`, `["max", a, b]`                                   | Minimum/maximum                                                  |
+| `["sin", a]`, `["cos", a]`, `["abs", a]`                           | Trigonometry (radians), absolute value                           |
+| `["clamp", value, low, high]`                                      | Inclusive clamp; low must not exceed high                        |
+| `["mix", a, b, u]`                                                 | `a + (b-a)*u`; extrapolation is allowed, then bounds are checked |
+| `["rand", salt, low, high]`                                        | Stable seeded sample in `[low, high)`, or low when equal         |
+
+Randomness hashes the document seed (default zero), the full expanded node/particle path and numeric salt using explicit 32-bit operations. It never reads `Math.random`, wall time or previous samples. The same salt at the same path shares a sample; use different salts for independent attributes. Renaming or reparenting an instance intentionally changes its random identity. Seeds are uint32. Sampling trigonometry uses JavaScript floating point; bit-identical results across every CPU/JS runtime are not promised. SVG numeric serialization rounds to six decimal places.
+
+Global `$time` is the selected clip's wrapped/clamped local time; without a clip it is the requested time. `$phase` is `$time / duration`, or zero without a clip. Requested times are finite in `[0, 1000000]`. `animation: null` selects the rest parameter values and leaves time unwrapped; it does not freeze explicit `$time` expressions or emitters. `params` render options replace sampled global parameter values and must be within declared bounds.
+
+## Shapes and composition
+
+Each node shares optional `transform`, `style`, `opacity`, `clip`, `mask`, `blur`.
+
+| `kind`    | Required geometry / fields                          | Optional geometry / fields                               |
+| --------- | --------------------------------------------------- | -------------------------------------------------------- |
+| `rect`    | `x`, `y`, `width`, `height`                         | `radius` (uniform rounded corner, default zero)          |
+| `ellipse` | `cx`, `cy`, `rx`, `ry`                              | —                                                        |
+| `path`    | `d`: array of absolute command tuples               | —                                                        |
+| `group`   | `children`: nonempty node array                     | —                                                        |
+| `use`     | `symbol`: declared symbol name                      | `args`: numeric expressions for that symbol's parameters |
+| `repeat`  | `count`: integer 1–1024; `children`                 | —                                                        |
+| `emitter` | `count`, `lifetime`, `mode`, `velocity`, `children` | `start` (zero), `acceleration` (`[0,0]`)                 |
+
+Dimensions, radii and stroke widths are nonnegative, capped at 1,000,000. Zero sizes are allowed and collapse geometry. Negative scales allow mirroring. Opacity is in `[0,1]`; blur deviation is in `[0,100]`.
+
+Paths start with `M`. Command tuples are `['M',x,y]`, `['L',x,y]`, `['Q',cx,cy,x,y]`, `['C',c1x,c1y,c2x,c2y,x,y]`, `['A',rx,ry,rotation,largeArcFlag,sweepFlag,x,y]`, `['Z']`. Arc flags are literal 0 or 1. Additional `M` commands introduce subpaths. Curves can deform by referencing animated parameters in control-point expressions; command topology stays fixed. Relative commands and raw `d` strings are excluded to keep validation and editing explicit.
+
+`transform` contains optional `translate: [x,y]`, `rotate`, `scale: [sx,sy]`, `pivot: [px,py]`. The matrix is `T(translate) T(pivot) R(rotate) S(scale) T(-pivot)`. Thus local points are scaled about the pivot, rotated about it, then translated, before the parent transform. This supports hierarchical articulation without a separate rig API.
+
+`symbols` maps a name to `{ params?, children }`. Each call creates a group and expands the body with **lexical scope**: document globals plus the symbol's own arguments/defaults. Caller loop/particle locals are not implicitly captured; pass them explicitly as declared arguments. Arguments are evaluated in the caller's scope, then checked against the symbol's bounds. Local parameters may shadow document parameters. Unknown arguments, undeclared symbols and all symbol cycles (including unused cycles) are errors. Arguments are numeric only; colors can be inherited by leaving symbol paint unspecified or using the document palette.
+
+`repeat` expands children in increasing index order. `$i` is zero-based and `$n` is the count in its child scope. Nested repetition shadows those two variables. Repetition does not apply an implicit translation; author the layout in children, for example `translate: [["mul", "$i", 24], 0]`.
+
+## Paint and definitions
+
+`style` fields: `fill`, `stroke`, `strokeWidth`, `linecap` (`butt|round|square`), `linejoin` (`miter|round|bevel`), `fillRule` (`nonzero|evenodd`). Paint is six-digit `#rrggbb`, `none`, a palette reference `@name`, or `{ "gradient": "name" }`. Alpha uses node opacity or gradient stop opacity. General CSS color strings and external URLs are excluded.
+
+Gradients use `userSpaceOnUse`, in the referencing element's coordinate system:
+
+- Linear: `{ kind: "linear", from: [x1,y1], to: [x2,y2], stops }`.
+- Radial: `{ kind: "radial", center: [cx,cy], radius, stops }`, radius strictly positive.
+- Stops: ordered 2–32 entries `{ offset: 0..1, color: "#rrggbb", opacity?: 0..1 }`. Equal offsets permit hard transitions. Positions can use global animated expressions; stop colors/offsets are fixed in 0.1.
+
+`clips` and `masks` map names to nonempty shape arrays (no groups, symbols or emitters). These definitions use global parameters only. Shapes can have transforms and paint but cannot themselves refer to clips, masks or blur, avoiding recursive definition graphs. Clips use `userSpaceOnUse` and `fillRule` also controls `clip-rule`. Masks use SVG luminance: white reveals, black conceals; default unpainted shapes are black. Mask region is the document viewBox in user units. Both definitions are interpreted in the referencing element's local coordinates.
+
+`blur` creates a Gaussian filter with a `-100%..200%` region along each axis and sRGB interpolation. Large blur relative to tiny shape bounds can be clipped by this finite filter region; expand source geometry if necessary. No arbitrary filter graph or compositing/blend-mode DSL is exposed.
+
+## Clips and effects
+
+`animations` maps names to `{ duration, loop, tracks }`. Duration is strictly positive and at most 60 seconds. A track targets a declared global parameter and has 2–256 keys `{ time, value, ease? }`. It must begin at zero, end at the exact duration, have strictly increasing times, and keep all values within parameter bounds. Empty `tracks` is allowed for effects driven by `$time` or emitter lifetime.
+
+The outgoing segment uses the earlier key's ease: `linear` (default), `smooth` (`u²(3−2u)`) or `hold` (keep earlier value until the next key). Overshoot requires explicit keys/bounds; smooth interpolation cannot overshoot its endpoints. Independent tracks can be staggered for anticipation/follow-through. Loops use `t % duration`; one-shots clamp at duration. Keys at the last instant of a loop define interpolation toward the boundary but sampling exactly at duration returns the first pose. Loop continuity is authored: different endpoints, hold transitions or nonperiodic expressions can deliberately pop.
+
+For an emitter with `N=count`, `L=lifetime`, `e=$time-start`:
+
+- If `e < 0`, emit nothing.
+- `loop` prewarms a fixed population: particle i has `life=(e+i*L/N)%L`.
+- `burst` gives all particles `life=e`; particles disappear at `e >= L`.
+- Children and velocity/acceleration expressions receive `$i`, `$n`, `$life` in seconds, and `$age=life/L`.
+- Position is `velocity*life + acceleration*life²/2` in the emitter's local frame. Each component may be an expression. With age-varying coefficients this is an authored trajectory formula, not a physical integration solver.
+- The particle's subtree is arbitrary supported nodes. Lifetimes/counts are literal and fixed; seed/identity repeats each cycle, providing exact seekability. There is no accumulating particle state, stochastic birth rate or collision system.
+
+For seamless emitters, fade children at age boundaries and choose a clip duration compatible with emitter lifetime. Clipping the time to a one-shot also freezes its surviving particles at the endpoint.
+
+## Output and budgets
+
+`renderSvgFrame` returns a complete standalone SVG with a title, viewBox, definitions and named part paths. No network or font resolution is involved. Core output is a string; a host chooses when/how to insert it, animate it or rasterize it.
+
+`exportSvgAnimation` uses `steps=ceil(duration*fps)` and samples at `i*duration/steps`. Requested fps defaults to 24 and is in `[1,60]`; effective sample rate is `steps/duration`. Loops have `steps` frames excluding the duplicate endpoint; one-shots add a frame at the exact endpoint. Each frame has separately namespaced definitions and a discrete SVG `animate` controlling its group display. Exactly one frame is visible during supported playback. One-shots use `fill="freeze"` and hold the endpoint. When animation is disabled, the base document shows the first frame. No JavaScript is embedded.
+
+This exporter samples the curve; it does not preserve continuous animation between those frames. It also duplicates geometry. The in-app sampler can instead render at a host-controlled cadence without storing every frame. Static output and exported playback are compared at the same sample times in browser verification.
+
+| Budget               | Limit                                                          |
+| -------------------- | -------------------------------------------------------------- |
+| Source traversal     | 100,000 JSON values, depth 64, 2,000,000 string/key characters |
+| Dictionaries         | 128 entries each                                               |
+| Child arrays / paths | 512 children per array; 2,048 commands per path                |
+| Expanded frame       | 10,000 visited source nodes; expansion depth 32                |
+| Animation export     | 240 frames; 8,000,000 body/definition characters               |
+| Individual frame     | 8,000,000 body/definition characters                           |
+
+Budgets raise `SVG_BUDGET`; they do not silently omit shapes. Small document wrappers add a few hundred characters beyond the body/definition budget. JSON Schema encodes structural sizes; the runtime additionally enforces aggregate/expansion budgets. Compilation and export are all-or-error in memory. The CLI validates a complete frame sequence before writing it; file I/O failures can still leave partial files, and existing output-directory contents are not deleted.
+
+Other diagnostic codes include `SVG_STRUCTURE`, `SVG_REFERENCE`, `SVG_PARAMETER`, `SVG_DUPLICATE`, `SVG_CYCLE`, `SVG_DEFINITION`, `SVG_PATH`, `SVG_GRADIENT`, `SVG_TIMELINE`, `SVG_RANGE`, `SVG_ARITHMETIC`, `SVG_ID` and CLI-only `SVG_CLI`. Structural diagnostics carry a source path; evaluation diagnostics carry a semantic expansion path or option path. No claim is made that the first diagnostic lists every problem in an invalid document.

package/examples/svg/arcane-shield.json

@@ -0,0 +1,261 @@
+{
+  "schema": "svg-asset/0.1",
+  "name": "Arcane shield",
+  "viewBox": [0, 0, 480, 360],
+  "seed": 123,
+  "params": {
+    "turn": {
+      "default": 0,
+      "min": 0,
+      "max": 360
+    },
+    "pulse": {
+      "default": 1,
+      "min": 0.94,
+      "max": 1.06
+    }
+  },
+  "gradients": {
+    "glass": {
+      "kind": "radial",
+      "center": [240, 180],
+      "radius": 126,
+      "stops": [
+        {
+          "offset": 0,
+          "color": "#7096ec",
+          "opacity": 0.05
+        },
+        {
+          "offset": 0.8,
+          "color": "#72d5ef",
+          "opacity": 0.18
+        },
+        {
+          "offset": 1,
+          "color": "#a4f3ec",
+          "opacity": 0.04
+        }
+      ]
+    }
+  },
+  "animations": {
+    "guard": {
+      "duration": 4,
+      "loop": true,
+      "tracks": {
+        "turn": [
+          {
+            "time": 0,
+            "value": 0
+          },
+          {
+            "time": 4,
+            "value": 360
+          }
+        ],
+        "pulse": [
+          {
+            "time": 0,
+            "value": 0.96,
+            "ease": "smooth"
+          },
+          {
+            "time": 2.0,
+            "value": 1.04,
+            "ease": "smooth"
+          },
+          {
+            "time": 4,
+            "value": 0.96
+          }
+        ]
+      }
+    }
+  },
+  "defaultAnimation": "guard",
+  "nodes": [
+    {
+      "id": "glass",
+      "kind": "ellipse",
+      "cx": 240,
+      "cy": 180,
+      "rx": 124,
+      "ry": 124,
+      "style": {
+        "fill": {
+          "gradient": "glass"
+        }
+      }
+    },
+    {
+      "id": "shield",
+      "kind": "group",
+      "transform": {
+        "pivot": [240, 180],
+        "scale": ["$pulse", "$pulse"]
+      },
+      "children": [
+        {
+          "id": "glow",
+          "kind": "path",
+          "d": [
+            ["M", 240.0, 72.0],
+            ["L", 333.531, 126.0],
+            ["L", 333.531, 234.0],
+            ["L", 240.0, 288.0],
+            ["L", 146.469, 234.0],
+            ["L", 146.469, 126.0],
+            ["Z"]
+          ],
+          "style": {
+            "fill": "none",
+            "stroke": "#78e5dd",
+            "strokeWidth": 10,
+            "linecap": "round",
+            "linejoin": "round"
+          },
+          "blur": 7,
+          "opacity": 0.45
+        },
+        {
+          "id": "edge",
+          "kind": "path",
+          "d": [
+            ["M", 240.0, 72.0],
+            ["L", 333.531, 126.0],
+            ["L", 333.531, 234.0],
+            ["L", 240.0, 288.0],
+            ["L", 146.469, 234.0],
+            ["L", 146.469, 126.0],
+            ["Z"]
+          ],
+          "style": {
+            "fill": "none",
+            "stroke": "#9ef3e5",
+            "strokeWidth": 2.5,
+            "linecap": "round",
+            "linejoin": "round"
+          }
+        },
+        {
+          "id": "inner",
+          "kind": "path",
+          "d": [
+            ["M", 240.0, 72.0],
+            ["L", 333.531, 126.0],
+            ["L", 333.531, 234.0],
+            ["L", 240.0, 288.0],
+            ["L", 146.469, 234.0],
+            ["L", 146.469, 126.0],
+            ["Z"]
+          ],
+          "style": {
+            "fill": "none",
+            "stroke": "#809af2",
+            "strokeWidth": 1,
+            "linecap": "round",
+            "linejoin": "round"
+          },
+          "transform": {
+            "pivot": [240, 180],
+            "scale": [0.86, 0.86]
+          }
+        },
+        {
+          "id": "seams",
+          "kind": "path",
+          "d": [
+            ["M", 240, 72],
+            ["L", 240, 288],
+            ["M", 146.47, 126],
+            ["L", 333.53, 234],
+            ["M", 146.47, 234],
+            ["L", 333.53, 126]
+          ],
+          "style": {
+            "fill": "none",
+            "stroke": "#9abbeb",
+            "strokeWidth": 0.8,
+            "linecap": "round",
+            "linejoin": "round"
+          },
+          "opacity": 0.22
+        }
+      ]
+    },
+    {
+      "id": "orbit",
+      "kind": "repeat",
+      "count": 12,
+      "transform": {
+        "translate": [240, 180],
+        "rotate": "$turn"
+      },
+      "children": [
+        {
+          "id": "mark",
+          "kind": "group",
+          "transform": {
+            "rotate": ["mul", "$i", 30]
+          },
+          "children": [
+            {
+              "id": "rune",
+              "kind": "path",
+              "d": [["M", 0, -145], ["L", 4, -136], ["L", 0, -127], ["L", -4, -136], ["Z"]],
+              "style": {
+                "fill": "none",
+                "stroke": "#e6c9f8",
+                "strokeWidth": 1.5,
+                "linecap": "round",
+                "linejoin": "round"
+              }
+            },
+            {
+              "id": "point",
+              "kind": "ellipse",
+              "cx": 0,
+              "cy": -116,
+              "rx": 1.4,
+              "ry": 1.4,
+              "style": {
+                "fill": "#b6f9ed"
+              }
+            }
+          ]
+        }
+      ]
+    },
+    {
+      "id": "upper-arc",
+      "kind": "path",
+      "d": [
+        ["M", 120, 125],
+        ["A", 133, 133, 0, 0, 1, 320, 74]
+      ],
+      "style": {
+        "fill": "none",
+        "stroke": "#b6a1f1",
+        "strokeWidth": 2,
+        "linecap": "round",
+        "linejoin": "round"
+      }
+    },
+    {
+      "id": "lower-arc",
+      "kind": "path",
+      "d": [
+        ["M", 360, 235],
+        ["A", 133, 133, 0, 0, 1, 160, 286]
+      ],
+      "style": {
+        "fill": "none",
+        "stroke": "#7cedd9",
+        "strokeWidth": 2,
+        "linecap": "round",
+        "linejoin": "round"
+      }
+    }
+  ]
+}

package/examples/svg/aurora-ribbon.json

@@ -0,0 +1,158 @@
+{
+  "schema": "svg-asset/0.1",
+  "name": "Aurora ribbon",
+  "viewBox": [0, 0, 480, 360],
+  "seed": 610,
+  "params": {
+    "wave": {
+      "default": 0,
+      "min": -1,
+      "max": 1
+    }
+  },
+  "animations": {
+    "flow": {
+      "duration": 4,
+      "loop": true,
+      "tracks": {
+        "wave": [
+          {
+            "time": 0,
+            "value": -1,
+            "ease": "smooth"
+          },
+          {
+            "time": 2.0,
+            "value": 1,
+            "ease": "smooth"
+          },
+          {
+            "time": 4,
+            "value": -1
+          }
+        ]
+      }
+    }
+  },
+  "defaultAnimation": "flow",
+  "nodes": [
+    {
+      "id": "stars",
+      "kind": "repeat",
+      "count": 27,
+      "children": [
+        {
+          "id": "star",
+          "kind": "ellipse",
+          "cx": ["rand", 0, 24, 456],
+          "cy": ["rand", 1, 35, 300],
+          "rx": ["rand", 2, 0.6, 1.5],
+          "ry": ["rand", 2, 0.6, 1.5],
+          "style": {
+            "fill": "#c6e8e9"
+          },
+          "opacity": 0.55
+        }
+      ]
+    },
+    {
+      "id": "curtains",
+      "kind": "repeat",
+      "count": 24,
+      "children": [
+        {
+          "id": "ray",
+          "kind": "path",
+          "d": [
+            ["M", 0, 0],
+            ["Q", 10, -25, 0, -65]
+          ],
+          "style": {
+            "fill": "none",
+            "stroke": "#6cebc2",
+            "strokeWidth": 2,
+            "linecap": "round",
+            "linejoin": "round"
+          },
+          "opacity": ["add", 0.22, ["mul", 0.16, ["sin", ["add", ["mul", "$i", 0.42], "$wave"]]]],
+          "transform": {
+            "translate": [
+              ["add", 48, ["mul", "$i", 16]],
+              ["add", 180, ["mul", 42, ["sin", ["add", ["mul", "$i", 0.33], "$wave"]]]]
+            ]
+          }
+        }
+      ]
+    },
+    {
+      "id": "ribbon-0",
+      "kind": "path",
+      "d": [
+        ["M", 32, 170],
+        ["C", 125, ["sub", 70, ["mul", "$wave", 35]], 145, ["add", 300, ["mul", "$wave", 22]], 240, 170],
+        ["C", 325, ["sub", 55, ["mul", "$wave", 25]], 355, ["add", 270, ["mul", "$wave", 40]], 448, 140]
+      ],
+      "style": {
+        "fill": "none",
+        "stroke": "#765df0",
+        "strokeWidth": 28,
+        "linecap": "round",
+        "linejoin": "round"
+      },
+      "opacity": 0.22,
+      "blur": 7
+    },
+    {
+      "id": "ribbon-1",
+      "kind": "path",
+      "d": [
+        ["M", 32, 183],
+        ["C", 125, ["sub", 70, ["mul", "$wave", 35]], 145, ["add", 300, ["mul", "$wave", 22]], 240, 183],
+        ["C", 325, ["sub", 55, ["mul", "$wave", 25]], 355, ["add", 270, ["mul", "$wave", 40]], 448, 153]
+      ],
+      "style": {
+        "fill": "none",
+        "stroke": "#42dec1",
+        "strokeWidth": 18,
+        "linecap": "round",
+        "linejoin": "round"
+      },
+      "opacity": 0.28,
+      "blur": 7
+    },
+    {
+      "id": "ribbon-2",
+      "kind": "path",
+      "d": [
+        ["M", 32, 196],
+        ["C", 125, ["sub", 70, ["mul", "$wave", 35]], 145, ["add", 300, ["mul", "$wave", 22]], 240, 196],
+        ["C", 325, ["sub", 55, ["mul", "$wave", 25]], 355, ["add", 270, ["mul", "$wave", 40]], 448, 166]
+      ],
+      "style": {
+        "fill": "none",
+        "stroke": "#8df9cf",
+        "strokeWidth": 7,
+        "linecap": "round",
+        "linejoin": "round"
+      },
+      "opacity": 0.72
+    },
+    {
+      "id": "ribbon-3",
+      "kind": "path",
+      "d": [
+        ["M", 32, 209],
+        ["C", 125, ["sub", 70, ["mul", "$wave", 35]], 145, ["add", 300, ["mul", "$wave", 22]], 240, 209],
+        ["C", 325, ["sub", 55, ["mul", "$wave", 25]], 355, ["add", 270, ["mul", "$wave", 40]], 448, 179]
+      ],
+      "style": {
+        "fill": "none",
+        "stroke": "#d9ffdc",
+        "strokeWidth": 1.5,
+        "linecap": "round",
+        "linejoin": "round"
+      },
+      "opacity": 0.85
+    }
+  ]
+}

package/examples/svg/bouncing-ember.json

@@ -0,0 +1,76 @@
+{
+  "schema": "svg-asset/0.1",
+  "name": "Bouncing ember",
+  "viewBox": [0, 0, 100, 100],
+  "params": {
+    "lift": {
+      "default": 0,
+      "min": -25,
+      "max": 0
+    },
+    "squash": {
+      "default": 1,
+      "min": 0.8,
+      "max": 1.2
+    }
+  },
+  "nodes": [
+    {
+      "id": "ember",
+      "kind": "ellipse",
+      "cx": 50,
+      "cy": 65,
+      "rx": 16,
+      "ry": 20,
+      "style": {
+        "fill": "#edb95f"
+      },
+      "transform": {
+        "translate": [0, "$lift"],
+        "pivot": [50, 85],
+        "scale": [["div", 1, "$squash"], "$squash"]
+      }
+    }
+  ],
+  "animations": {
+    "bounce": {
+      "duration": 1,
+      "loop": true,
+      "tracks": {
+        "lift": [
+          {
+            "time": 0,
+            "value": 0,
+            "ease": "smooth"
+          },
+          {
+            "time": 0.5,
+            "value": -25,
+            "ease": "smooth"
+          },
+          {
+            "time": 1,
+            "value": 0
+          }
+        ],
+        "squash": [
+          {
+            "time": 0,
+            "value": 0.8,
+            "ease": "smooth"
+          },
+          {
+            "time": 0.5,
+            "value": 1.2,
+            "ease": "smooth"
+          },
+          {
+            "time": 1,
+            "value": 0.8
+          }
+        ]
+      }
+    }
+  },
+  "defaultAnimation": "bounce"
+}