Generative Loaders

loadersz is a framework-agnostic, dependency-free browser library of Canvas loading animations, distributed as a native Web Component with an imperative TypeScript API. It provides 150 motion states, including working, searching, connecting, solving, and racing, and supports configurable size, speed, density, color, theme, pausing, and reduced-motion behavior. The root import registers a switchable <loadersz-loader> element, while individual state entry points such as loadersz/racing include the Canvas core and one geometry builder for smaller fixed-state bundles. The API can also attach a fixed or switchable loader controller to an application-owned canvas and supports lifecycle methods such as setOptions and destroy. Typed integration adapters are provided for React, Vue, Svelte, and Angular; plain HTML, Lit, Solid, and Qwik can use the native element directly. The library pauses in hidden tabs, respects prefers-reduced-motion by default, and caps Canvas device-pixel ratio at two. The package has no regular runtime dependencies, and its repository is licensed under the MIT License.

thinking-orbs is a React component package providing dotted animated loading indicators for AI and agent interfaces. It offers nine hand-tuned states— including working, searching, solving, listening, connecting, weaving, composing, breathing, and shaping—rendered with plain 2D canvas rather than WebGL or filters. The indicators have separate 64-pixel chat-avatar and 20-pixel inline-text designs, automatic or pinned light/dark themes, adjustable speed, pause control, and pass-through canvas properties. It includes per-state accessible labels, renders a static frame for prefers-reduced-motion, pauses offscreen instances through IntersectionObserver or when the tab is hidden, and resumes them in phase using a shared clock. The package is distributed through npm under the MIT license.

Torph is a dependency-free animated text morphing web component for React, Vue, Svelte, and vanilla JavaScript. Its TextMorph component transitions between strings and supports physics-based spring easing configured with parameters such as stiffness and damping. The package is installable through pnpm and is documented in the project's repository.

json-render is a generative UI framework from Vercel Labs that converts natural-language prompts and structured JSON outputs into interface specifications constrained by a developer-defined catalog of components, actions, schemas, and data bindings. The catalog generates the AI system prompt and acts as a guardrail; specifications are validated against the catalog and rendered progressively through a streaming compiler. Components can use state expressions, conditional visibility, computed values, templates, actions, and state watchers. The framework provides renderers and adapters for React, Vue, Svelte, Solid, React Native, Next.js, TanStack Start, terminal UIs, Remotion video, React PDF, React Email, SVG/PNG images, and React Three Fiber, along with optional shadcn/ui components, devtools, state-store adapters, MCP Apps integration, YAML support, and code-generation utilities.

Interior Dev is an open-source collection of copy-paste React micro-interactions for the brief period after a click. Each component is distributed as a single file rather than a package and exports a headless `useX` hook containing the behavior without class names alongside an `X` styled example component. The components address layout-preserving transitions, animation restarts, resizing labels, loading jumps, interrupted drags and gesture recovery when focus is lost, keyboard interaction, and `prefers-reduced-motion` behavior; reduced-motion mode preserves the information while skipping the animation. The only dependency is `motion`, and the documentation site can be run with Bun.