Skip to main content

Crate autumn_plugin_motion

Crate autumn_plugin_motion 

Source
Expand description

Motion animations for Autumn, with Maud + htmx ergonomics.

Add MotionPlugin to the app, put motion_script() in the page, and animate declaratively:

use autumn_plugin_motion::{Motion, MotionPlugin, motion_script};
use autumn_web::prelude::*;

#[get("/")]
async fn index() -> Markup {
    html! {
        html {
            head { (motion_script()) }
            body {
                // Typed builder: wraps the markup in an animated div.
                (Motion::fade_up().delay(100).wrap(html! {
                    h1 { "Hello" }
                }))
                // Or raw attributes on your own elements:
                p data-motion="fade" data-motion-delay="200" { "World" }
            }
        }
    }
}

autumn_web::app()
    .plugin(MotionPlugin::new())
    .routes(routes![index])
    .run()
    .await;

The plugin vendors Motion 12.x (MIT) — no npm, no bundler — and installs it as an Autumn plugin asset bundle (MOTION_ASSETS), served from memory under /static/_plugins/motion/ at content-hashed, immutably cached URLs with SRI hashes computed from the embedded bytes. The init script scans [data-motion] on load and re-scans on htmx:afterSwap, so every htmx partial animates declaratively too. prefers-reduced-motion is respected: no animations, content stays visible.

§Limits

  • Motion+ (the paid motion.dev tier: splitText, Cursor, Carousel, Ticker, AnimateNumber, …) is not included — only the MIT core.
  • The Motion version is pinned per plugin release (see assets::MOTION_VERSION); upgrading Motion means upgrading the plugin.
  • Animations are enter/scroll effects on server-rendered HTML. There is no layout-animation / shared-element support in the declarative layer.
  • Without JavaScript (or with reduced motion) everything renders statically — by design.

Structs§

Motion
A declarative animation: preset plus modifiers.
MotionPlugin
Installs the Motion animation assets in an Autumn app.

Enums§

Ease
An easing curve for a Motion animation.
InViewAmount
How much of the element must be visible before its inView animation triggers.
Preset
An animation preset, mirroring the keyframes in assets/init.js.
RepeatType
How a repeated Motion animation restarts each cycle.
StaggerFrom
Where a staggered cascade starts.

Constants§

ASSETS_NAMESPACE
URL namespace of the bundle: files are served under /static/_plugins/motion/.
MOTION_JS_INTEGRITY
sha384 Subresource Integrity hash of the upstream file vendored as assets/motion.min.js.
MOTION_SOURCE
jsDelivr source URL of the vendored UMD build.
MOTION_VERSION
Pinned Motion version vendored in assets/motion.min.js.
PLUGIN_NAME
The plugin name in Autumn diagnostics.

Statics§

MOTION_ASSETS
The plugin’s asset bundle: Motion, the init script, and the stylesheet.

Functions§

motion_script
Renders the <script> tags loading Motion and the plugin init script.
motion_stylesheet
Renders the <link> tag for the plugin stylesheet.