Square collapse
Static-view: four corners fold inward, then the sheet folds upward from the center line.
A quiet runtime for folding one real DOM surface into paper-like facets. The demo now treats the center line as a pre-crease, then folds only a small diagonal corner flap on patterned washi.
npm install orikata
Click the folded button or type into the folded input.
Step 1 is a flat center pre-crease; step 2 folds a local corner flap on the already-defined right panel. The sheet should read as one continuous piece of paper, not two sliced halves.
Experimental non-snapshot backend: cloned visual DOM is clipped to folded faces, so CSS transition and keyframe animation can keep running on the paper. Events still bridge back to the single hidden source DOM.
Hover the folded button: this is CSS transition, not snapshot rebuild.
Static-view: four corners fold inward, then the sheet folds upward from the center line.
A dense dashboard-like DOM texture folded as a static surface with an automatic Z-fold loop.
Snapshot texture plus fold transforms. No hidden source DOM, no click bridge.
createOrigamiRuntime({
mode: 'static-view',
host, paper, foldOps,
snapshot
});
One hidden source DOM; folded hit-tests bridge back to a real button.
createOrigamiRuntime({
mode: 'interactive-bridge',
host, sourceRoot,
snapshotProvider
});
Manifest pieces are mounted directly; runtime angle mutation is frozen.
const manifest =
buildBakedOrigamiManifest(doc);
createOrigamiRuntime({
mode: 'baked-view',
host, manifest
});