mirror of https://github.com/hanzoai/gui.git synced 2026-10-25 02:31:41 +00:00

Files

T

zeekayandHanzo Dev 751ef5c778 rename the framework to @hanzo/gui and the loader to @hanzogui/loader

Both old names are owned by a different npm account (artemis-prime), so
publishing them returns 403 — which is how this surfaced: the 8.0.0 run
shipped @hanzogui/logo and @hanzogui/demos depending on [email protected], a
version that cannot be published and therefore does not exist. Those two
were uninstallable.

@hanzo/gui and @hanzogui/* are ours, so the framework now carries the name
it is imported by everywhere downstream, and the loader moves under the
scope we control.

The rewrite is limited to package references. `DEBUG?.startsWith('hanzogui')`
is a log-namespace filter and join(dir, 'hanzogui') is a path — rewriting
either would change behaviour, so both are untouched.

Co-authored-by: Hanzo Dev <[email protected]>

2026-07-30 20:23:18 -07:00

1.6 KiB

Raw Permalink Blame History

@hanzogui/animations-motion

Motion animation driver for Gui, powered by the Motion library and the Web Animations API (WAAPI).

Features

Hybrid Engine: Combines JavaScript animations with native WAAPI for GPU-accelerated performance
Spring Physics: Natural, physics-based animations with intuitive damping, stiffness, and mass parameters
Independent Transforms: Animate x, y, scale, rotate properties separately with different configurations
Compositor Thread: Runs animations smoothly even when the main thread is busy
Web-Only: Optimized for modern web browsers with WAAPI support

Installation

yarn add @hanzogui/animations-motion motion

Usage

Add to your Gui configuration:

import { createAnimations } from '@hanzogui/animations-motion'
import { createGui } from '@hanzo/gui'

export default createGui({
  animations: createAnimations({
    bouncy: {
      type: 'spring',
      damping: 9,
      mass: 0.9,
      stiffness: 150,
    },
    quick: {
      type: 'spring',
      damping: 20,
      mass: 1.2,
      stiffness: 250,
    },
    '100ms': {
      duration: 100,
    },
  }),
  // ...
})

Animation Types

Spring Animations

{
  type: 'spring',
  damping: 10,    // Higher = less bouncy
  stiffness: 100, // Higher = faster
  mass: 1,        // Higher = more inertia
}

Tween Animations

{
  duration: 200, // Duration in milliseconds
}

Documentation

For complete documentation, see the Gui Animations docs.

1.6 KiB Raw Permalink Blame History