motion-brew 0.0.0-stage → 0.1.1

package/dist/components/booking-card/booking-card.d.ts

@@ -0,0 +1,56 @@
+/**
+ * BookingCard
+ *
+ * Trigger: press. A white booking card for a trial class, a demo call or any
+ * slot someone reserves. A strip of upcoming days scrolls sideways; picking a
+ * day glides an ink pill to it on a spring, and the times for that day unfold
+ * below with their own sliding pill. The full-width button wakes up once a
+ * day and a time are chosen: its label rolls to the chosen slot, the arrow
+ * nudges on hover, and a press runs a short spinner before the button turns
+ * green and draws a check. Then the whole card becomes the confirmation: a
+ * green seal spins in, draws its check and bursts sparks (the same seal as
+ * VerifyFlow), the date and time tiles rise in with a clock whose hands sweep
+ * to the booked time, and the add to calendar button flips its icon to a
+ * check. Change goes back to the picker with the slot kept. Days and times
+ * that are taken stay visible but can't be picked. Dates and times are radio groups with arrow keys, and
+ * every change is announced. Reduced motion swaps the glides for fades.
+ *
+ * Engine: motion/react for the sliding pills, the unfolding times, the
+ * button's label, spinner and check, and the confirmation's layout; gsap +
+ * @gsap/react for the confirmation's drawn icons (scoped with useGSAP).
+ */
+import * as React from "react";
+export interface BookingCardProps {
+    /** Card title. Default `"Book a free trial"`. */
+    title?: string;
+    /** Line under the title. */
+    subtitle?: string;
+    /** First day in the strip. Default today. */
+    start?: Date;
+    /** How many days the strip shows. The month menu lists every month they cover. Default `45`. */
+    days?: number;
+    /** Times offered each day, as labels. Default five slots from 09:00 to 18:00. */
+    times?: string[];
+    /** Days that can't be booked. Default Sundays. */
+    isUnavailable?: (date: Date) => boolean;
+    /** Times taken on a given day. Default a few, varying by day. */
+    takenTimes?: (date: Date) => string[];
+    /** Button label before a slot is chosen. Default `"Book a trial"`. */
+    cta?: string;
+    /** Heading on the confirmation. Default `"You're booked"`. */
+    doneTitle?: string;
+    /** Line under the confirmation heading. */
+    doneText?: string;
+    /** Called by the confirmation's add to calendar button. */
+    onAddToCalendar?: (slot: {
+        date: Date;
+        time: string;
+    }) => void;
+    /** Called on press with the chosen slot. Return a promise to hold the spinner until it settles. */
+    onBook?: (slot: {
+        date: Date;
+        time: string;
+    }) => void | Promise<unknown>;
+    className?: string;
+}
+export declare const BookingCard: React.ForwardRefExoticComponent<BookingCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/booking-card/index.d.ts

@@ -0,0 +1 @@
+export { BookingCard, type BookingCardProps } from "./booking-card";

package/dist/components/brand-bridge/brand-bridge.d.ts

@@ -0,0 +1,63 @@
+/**
+ * BrandBridge
+ *
+ * Trigger: press and hover (plus in view). A feature card for any site or
+ * app: on top, brand tiles stand in two columns either side of a hub, and only
+ * the connected ones are wired in. On its own it wires the brands in one at
+ * a time in a random order and then stays connected; it pauses while hovered
+ * and hands over for good once a tile is pressed. Each wire is a gradient in its brand's own
+ * colours, fading into ink at the hub, and a glowing comet of the same
+ * gradient runs along it now and then; when it lands, the hub's rotating
+ * colour ring pulses and a few sparks of that brand fly off. Press a tile to
+ * connect it: the wire draws itself in, a burst of brand coloured particles
+ * streams to the hub and the logo turns from gray to colour. Press again to
+ * disconnect and the wire pulls back. Hovering a tile lifts it and previews or
+ * brightens its wire. The wires are magnetic: bring the pointer near one and
+ * it bends toward it on a spring, lights up and carries its comet along the
+ * bend, then snaps back with a small wobble when the pointer leaves. Behind the graphic a sparse field of particles drifts,
+ * slowly circles the hub and scatters from the pointer. Under it sit a
+ * centred heading and line. Everything pauses off screen. Reduced motion
+ * keeps the wires and particles still.
+ *
+ * Engine: motion/react (entrances and pathLength wires)
+ * with one requestAnimationFrame loop that drives the comets on SVG dash
+ * offsets and the particles on a 2D canvas.
+ */
+import * as React from "react";
+export interface BridgeBrand {
+    id: string;
+    name: string;
+    /** The wire's gradient, from the tile toward the hub. The first is the brand's main colour. */
+    colors: string[];
+    /** The mark inside the tile, about 28px. */
+    logo: React.ReactNode;
+}
+export interface BrandBridgeProps {
+    /** Up to eight brands; the first half stand on the left. Default six. */
+    brands?: BridgeBrand[];
+    /** Ids connected at first. Default none, so autoplay builds them up. */
+    defaultConnected?: string[];
+    /**
+     * Connect the brands by itself, one at a time in a random order, and stay
+     * connected. Plays again on reload or remount; pauses while the card is
+     * hovered and stops for good once a tile is pressed. Default `true`.
+     */
+    autoplay?: boolean;
+    onToggle?: (id: string, connected: boolean) => void;
+    /** Heading under the graphic. */
+    title?: React.ReactNode;
+    /** Line under the heading. */
+    description?: React.ReactNode;
+    /** What sits in the hub. Default a small mark. */
+    hub?: React.ReactNode;
+    /** Particles in the background field, 0 to 240. Default `48`. */
+    particles?: number;
+    /** Comet speed; `2` is twice as fast. Default `1`. */
+    speed?: number;
+    className?: string;
+}
+/** Every built in brand; pick from these or pass your own. */
+export declare const BRANDS: BridgeBrand[];
+/** The default six: three a side. */
+export declare const DEFAULT_BRANDS: BridgeBrand[];
+export declare const BrandBridge: React.ForwardRefExoticComponent<BrandBridgeProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/brand-bridge/index.d.ts

@@ -0,0 +1 @@
+export { BrandBridge, BRANDS, DEFAULT_BRANDS, type BrandBridgeProps, type BridgeBrand, } from "./brand-bridge";

package/dist/components/calendar-agenda/calendar-agenda.d.ts

@@ -0,0 +1,64 @@
+/**
+ * CalendarAgenda
+ *
+ * Trigger: drag (plus press and keys). A day planner card: a week strip on top
+ * and the chosen day's events below, each with its time, length and a colored
+ * bar. Swipe a row left to mark it done: a green Done grows from under its
+ * right edge, only as wide as the slide; tap it or swipe far, and the title is
+ * struck through while confetti rises from across the row and floats up out of
+ * the card. Swiping a done row left offers Undo. Swipe a row right to delete
+ * it: the row slides off a red Delete underneath, and the rows below slide up to
+ * close the gap. Picking another day slides the selection pill across and swaps
+ * the list with a soft blur, and the header counts what is left. Rows are real
+ * list items: Enter or Space marks done, Delete or Backspace removes, and
+ * changes are announced. Reduced motion keeps every action but skips the travel
+ * and the confetti.
+ *
+ * Engine: motion/react (drag with snap points, layout and exit animations, the
+ * sliding day pill) plus a small built-in canvas confetti system.
+ */
+import * as React from "react";
+export interface AgendaEvent {
+    id: string;
+    /** Start time label, like `"10:00"`. */
+    time: string;
+    /** Length label, like `"1h"`. */
+    length?: string;
+    title: string;
+    /** Second line, like `"4 people · Zoom"`. */
+    meta?: string;
+    /** Bar and confetti color. */
+    color?: string;
+    /** Small status pill, like `"in 19 min"`. */
+    tag?: string;
+    /** A free slot: shown muted, with no actions. */
+    free?: boolean;
+    done?: boolean;
+}
+export interface AgendaDay {
+    /** Short weekday, like `"Tue"`. */
+    label: string;
+    /** Day of the month. */
+    date: number;
+    /** Heading when selected, like `"Tuesday"`. */
+    title: string;
+    /** Line under the heading, like `"11 November"`. */
+    subtitle?: string;
+    events: AgendaEvent[];
+}
+export interface CalendarAgendaProps {
+    /** The week. Default a sample week. */
+    days?: AgendaDay[];
+    /** Index of the day shown first. Default `1`. */
+    defaultDay?: number;
+    /** Confetti when an event is marked done. Default `true`. */
+    confetti?: boolean;
+    /** Called when an event is marked done or reopened. */
+    onToggle?: (event: AgendaEvent, done: boolean) => void;
+    /** Called when an event is deleted. */
+    onDelete?: (event: AgendaEvent) => void;
+    /** Called by the round add button. */
+    onAdd?: () => void;
+    className?: string;
+}
+export declare const CalendarAgenda: React.ForwardRefExoticComponent<CalendarAgendaProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/calendar-agenda/index.d.ts

@@ -0,0 +1 @@
+export { CalendarAgenda, type AgendaDay, type AgendaEvent, type CalendarAgendaProps } from "./calendar-agenda";

package/dist/components/channel-mix/channel-mix.d.ts

@@ -0,0 +1,63 @@
+/**
+ * ChannelMix
+ *
+ * Trigger: in view, then hover and press. A white marketing card: a light
+ * gray header with an icon tile, a title and a line of copy, then a white
+ * panel overlapping it with the
+ * week's sessions on rolling digits and a row of slim ticks that splits them
+ * by channel. When it scrolls into view the ticks rise in a wave from left to
+ * right while the numbers roll up from zero. Pointing at the bar or a legend
+ * chip lights up that channel's ticks, dims the rest, and rolls the headline
+ * to the channel's own sessions and change. Under a hairline, a small table of
+ * metrics: a soft pill glides between rows under the pointer, each row's
+ * animated icon plays, and its change arrow nudges the way it points. The info
+ * button explains the numbers in a tooltip, and Details slides its arrow out.
+ * Reduced motion keeps every state without movement.
+ *
+ * Engine: motion/react (staggered scale for the ticks, spring digit columns,
+ * layoutId pills, AnimatePresence for the headline) with animated icons from
+ * lucide-animated (MIT), vendored in src/icons.
+ */
+import * as React from "react";
+export interface ChannelMixChannel {
+    name: string;
+    /** Sessions from this channel in the period. */
+    sessions: number;
+    /** Change against the last period, in percent. */
+    change: number;
+    /** Tick and dot color. Defaults follow the card's palette. */
+    color?: string;
+}
+export type ChannelMixIcon = "people" | "time" | "money";
+export interface ChannelMixMetric {
+    label: string;
+    /** Shown as written; its digits roll, everything else stays put. */
+    value: string;
+    /** Change against the last period, in percent. */
+    change: number;
+    /** Whether a rise is good news. Default true; set false for costs and waits. */
+    higherIsBetter?: boolean;
+    icon: ChannelMixIcon;
+}
+export interface ChannelMixProps {
+    /** Title in the shell. Default `"Channel insights"`. */
+    title?: React.ReactNode;
+    /** Line under the title. */
+    description?: React.ReactNode;
+    /** Label over the headline number. Default `"Sessions this week"`. */
+    label?: string;
+    /** What the info button explains. */
+    info?: string;
+    channels?: ChannelMixChannel[];
+    /** Change of all sessions against the last period, in percent. Default `2.1`. */
+    change?: number;
+    metrics?: ChannelMixMetric[];
+    /** Called by the Details button. Leave out to hide it. */
+    onDetails?: () => void;
+    /** Locale for numbers. Default `"en-US"`. */
+    locale?: string;
+    /** Show the gray header band with the icon, title and copy. Default true; false leaves just the chart. */
+    header?: boolean;
+    className?: string;
+}
+export declare const ChannelMix: React.ForwardRefExoticComponent<ChannelMixProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/channel-mix/index.d.ts

@@ -0,0 +1 @@
+export { ChannelMix, type ChannelMixProps, type ChannelMixChannel, type ChannelMixMetric, type ChannelMixIcon, } from "./channel-mix";

package/dist/components/column-card/column-card.d.ts

@@ -0,0 +1,39 @@
+/**
+ * ColumnCard
+ *
+ * Trigger: in view, then hover, press and keys. A tall white card with a small
+ * live pill, a headline, a short line of body text and a few big rounded
+ * columns standing in a soft gray stage over faint guide lines, each carrying
+ * its value inside at the top, with a legend and the total in a footer. When
+ * it scrolls into view the columns grow up from the floor one after another,
+ * springing a little past their height, and each number counts up from zero
+ * inside its column, the total with them. Hovering (or focusing) a column
+ * lifts it, dims the others and floats an ink tooltip with its share above
+ * it; leaving settles it back. Reduced motion shows the final state at once.
+ *
+ * Engine: motion/react (animate on motion values for the counts, column
+ * heights on springs, AnimatePresence for the share tooltip).
+ */
+import * as React from "react";
+export interface Column {
+    label: string;
+    value: number;
+    /** Column colour. Defaults run violet, then ink. */
+    color?: string;
+}
+export interface ColumnCardProps {
+    /** Headline. Default `"Data that puts your health in motion"`. */
+    title?: React.ReactNode;
+    /** Body text under the headline. */
+    description?: React.ReactNode;
+    /** The columns, left to right. Heights are relative to the largest. */
+    columns?: Column[];
+    /** Small pill above the headline. Pass `null` to hide it. Default `"Last 30 days"`. */
+    eyebrow?: React.ReactNode;
+    /** Word after the total in the footer. Default `"readings"`. */
+    unit?: string;
+    /** Height of the tallest column in px. Default `220`. */
+    columnHeight?: number;
+    className?: string;
+}
+export declare const ColumnCard: React.ForwardRefExoticComponent<ColumnCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/column-card/index.d.ts

@@ -0,0 +1 @@
+export { ColumnCard, type ColumnCardProps, type Column } from "./column-card";

package/dist/components/contact-card/contact-card.d.ts

@@ -0,0 +1,44 @@
+/**
+ * ContactCard
+ *
+ * Trigger: hover (plus focus and press). A Contact link that lives inside a
+ * sentence ("Not just a simple Contact button."), set in the sentence's own
+ * size, weight and colour with just an arrow after it. Hovering draws an
+ * underline under it, turns the arrow up toward the card and lifts a white
+ * contact card out of it with a soft spring and a blur, its rows rising in one
+ * after another: an avatar with a breathing "available" dot, the name
+ * and role, the email address, a LinkedIn link and a Book a call button.
+ * Pressing the email copies it, the icon flipping to a check while the label
+ * rolls to Copied. The LinkedIn and Book arrows slide through on hover. The
+ * card stays open while the pointer travels from the link onto it, and
+ * closes a moment after it leaves, on Escape, or on a click elsewhere. Keyboard focus and a tap on
+ * touch open it too. Reduced motion keeps every state but drops the movement.
+ *
+ * Engine: motion/react (spring pop-over with a staggered reveal, rolling
+ * labels and icon swaps).
+ */
+import * as React from "react";
+export interface ContactCardProps {
+    /** Pill label. Default `"Contact"`. */
+    label?: string;
+    /** Who you are reaching. Default `"Maya Lindqvist"`. */
+    name?: string;
+    /** Their role. Default `"Design lead"`. */
+    role?: string;
+    /** Their photo. */
+    avatar?: string;
+    /** Email address. Default `"maya@studio.co"`. */
+    email?: string;
+    /** LinkedIn profile URL. */
+    linkedin?: string;
+    /** Booking link. Without it the button calls `onBook`. */
+    bookHref?: string;
+    /** Called by the book button when there is no `bookHref`. */
+    onBook?: () => void;
+    /** Book button label. Default `"Book a call"`. */
+    bookLabel?: string;
+    /** Show the available dot. Default `true`. */
+    available?: boolean;
+    className?: string;
+}
+export declare const ContactCard: React.ForwardRefExoticComponent<ContactCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/contact-card/index.d.ts

@@ -0,0 +1 @@
+export { ContactCard, type ContactCardProps } from "./contact-card";

package/dist/components/context-menu/context-menu.d.ts

@@ -0,0 +1,59 @@
+/**
+ * ContextMenu
+ *
+ * Trigger: right click (plus long press and keys). Wraps any content; right
+ * clicking it (or a long press on touch, or Shift F10) opens a white menu at
+ * the pointer that springs out of that corner while its rows rise in. A soft
+ * gray pill glides between rows and each row's animated icon plays while it
+ * is hovered. Rows can show a shortcut, open a submenu that slides out beside
+ * them, roll to a done state in place (Copy link becomes Link copied with a
+ * check before the menu closes), or ask twice before a destructive action
+ * (Delete rolls to Click again to delete on a red tint). After a choice a
+ * small pill with a check confirms what happened. The arrow keys move through
+ * rows, Right and Left open and close the submenu, Enter chooses, and Escape
+ * or a click outside closes it. Reduced motion keeps the states without
+ * movement.
+ *
+ * Engine: motion/react (AnimatePresence for the menus and the toast,
+ * staggered variants, a layoutId hover pill, rolling labels) with animated
+ * icons from lucide-animated (MIT), vendored in src/icons.
+ */
+import * as React from "react";
+/** Any icon that can be told to play. The vendored animated icons all fit. */
+export type MenuIcon = React.ComponentType<{
+    active?: boolean;
+    className?: string;
+}>;
+export type ContextMenuItem = {
+    separator: true;
+} | {
+    id: string;
+    label: string;
+    icon?: MenuIcon;
+    /** Shown on the right, like "⌘C". */
+    shortcut?: string;
+    /** A nested menu that opens beside this row. */
+    items?: ContextMenuItem[];
+    /** Red tinted, for destructive actions. */
+    danger?: boolean;
+    /** Ask twice: the first press rolls the label to this. */
+    confirm?: string;
+    /** Roll to this label and icon in place before closing. */
+    done?: {
+        label: string;
+        icon?: MenuIcon;
+    };
+    /** Text for the small pill shown after it runs. */
+    feedback?: string;
+    onSelect?: () => void;
+};
+export interface ContextMenuProps {
+    /** The rows. Default a set of file actions. */
+    items?: ContextMenuItem[];
+    /** The area that opens the menu. Default a small file card. */
+    children?: React.ReactNode;
+    /** Accessible name for the area. Default `"File, right click for actions"`. */
+    label?: string;
+    className?: string;
+}
+export declare const ContextMenu: React.ForwardRefExoticComponent<ContextMenuProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/context-menu/index.d.ts

@@ -0,0 +1 @@
+export { ContextMenu, type ContextMenuProps, type ContextMenuItem, type MenuIcon, } from "./context-menu";

package/dist/components/contour-feature-card/contour-feature-card.d.ts

@@ -0,0 +1,36 @@
+/**
+ * ContourFeatureCard
+ *
+ * Trigger: hover and press (plus in view). A product feature card: a browser
+ * window with a small dashboard rises in front of a live topographic map.
+ * The map is drifting noise traced into contour lines (marching squares),
+ * with every fourth line a little heavier like the index lines on a real map.
+ * The pointer raises a soft hill, so the lines bend and crowd around it and
+ * light up near it; a press sends a ring of a wave out through the terrain,
+ * and while the pointer is away one rises on its own now and then. On the way
+ * in the card rises, the lines spread out from the centre and the window
+ * slides up and tilts toward the pointer, while its dashboard builds itself:
+ * the figures count, the chart draws its line and the rows slide in. Reduced
+ * motion draws one still frame and keeps the window flat.
+ *
+ * Engine: motion/react (springs for the window, pathLength for the chart,
+ * counting motion values) with a canvas 2D contour field on one
+ * requestAnimationFrame loop that pauses off screen.
+ */
+import * as React from "react";
+export interface ContourFeatureCardProps {
+    /** Line colour. Default `"#242423"`. */
+    color?: string;
+    /** How many contour levels to trace; more means tighter lines. Default `14`. */
+    lines?: number;
+    /** Size of the hills and valleys; higher zooms out. Default `1`. */
+    scale?: number;
+    /** Drift speed; `2` is twice as fast. Default `1`. */
+    speed?: number;
+    /** How high the pointer's hill rises. Default `1`. */
+    lift?: number;
+    /** What the window shows. Default a small analytics dashboard. */
+    children?: React.ReactNode;
+    className?: string;
+}
+export declare const ContourFeatureCard: React.ForwardRefExoticComponent<ContourFeatureCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/contour-feature-card/index.d.ts

@@ -0,0 +1 @@
+export { ContourFeatureCard, type ContourFeatureCardProps, } from "./contour-feature-card";

package/dist/components/contour-lines/contour-lines.d.ts

@@ -0,0 +1,34 @@
+/**
+ * ContourLines
+ *
+ * Trigger: hover and press (plus in view). A background of live topographic
+ * contour lines. Drifting noise is traced into contour lines with marching
+ * squares, every fourth line a little heavier like the index lines on a real
+ * map. The pointer raises a soft hill, so the lines bend and crowd around it
+ * and light up near it; a press sends a ring of a wave out through the
+ * terrain, and while the pointer is away one rises on its own now and then.
+ * On the way in the lines spread out from the centre. Put anything on top as
+ * children. Reduced motion draws a single still frame.
+ *
+ * Engine: canvas 2D on one requestAnimationFrame loop that pauses off screen,
+ * with motion/react's useInView for the entrance.
+ */
+import * as React from "react";
+export interface ContourLinesProps {
+    /** Line colour. Default `"#242423"`. */
+    color?: string;
+    /** How many contour levels to trace; more means tighter lines. Default `14`. */
+    lines?: number;
+    /** Size of the hills and valleys; higher zooms out. Default `1`. */
+    scale?: number;
+    /** Drift speed; `2` is twice as fast. Default `1`. */
+    speed?: number;
+    /** How high the pointer's hill rises. Default `1`. */
+    lift?: number;
+    /** Raise a hill under the pointer and send waves on press. Default `true`. */
+    interactive?: boolean;
+    /** Content laid over the lines. */
+    children?: React.ReactNode;
+    className?: string;
+}
+export declare const ContourLines: React.ForwardRefExoticComponent<ContourLinesProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/contour-lines/index.d.ts

@@ -0,0 +1 @@
+export { ContourLines, type ContourLinesProps } from "./contour-lines";

package/dist/components/decay-card/decay-card.d.ts

@@ -0,0 +1,44 @@
+/**
+ * DecayCard
+ *
+ * Trigger: hover. A full-bleed image card with its text laid over the
+ * picture. When the pointer comes onto it, the picture decays from the inside
+ * out: a hole opens right where the pointer entered and eats outward, its rim
+ * torn and eroded, with chunks bitten out just past the edge and fine specks
+ * sprayed beyond it, spreading until it has eaten the whole card and a second
+ * picture shows through, easing in from a slight zoom. While it spreads the
+ * rim keeps crawling and the hole drifts after the pointer.
+ * Leaving lets the first picture grow back over the hole until it is whole
+ * again. The card also sits in 3D: it leans toward the pointer and lifts a
+ * touch, a soft glare slides across it and the text drifts against the lean
+ * for depth. The text stays crisp on top. Reduced motion shows the plain
+ * picture, flat.
+ *
+ * Engine: canvas 2D. The picture is drawn each frame and a rounded hole with
+ * a noisy, gritty outline and scattered flecks is cut out of it with
+ * destination-out, in one requestAnimationFrame loop that rests once the
+ * picture is whole; motion/react eases the text in.
+ */
+import * as React from "react";
+export interface DecayCardProps {
+    /** The picture. */
+    src?: string;
+    /** The picture the decay reveals underneath. */
+    revealSrc?: string;
+    /** Small label in the top corner. Default `"Field notes"`. */
+    tag?: string;
+    /** Title over the picture. Default `"Nothing stays"`. */
+    title?: string;
+    /** Line under the title. */
+    subtitle?: string;
+    /** How far the decay eats, as a share of the card. Above about 1.5 it takes the whole card. Default `1.6`. */
+    depth?: number;
+    /** Speed of the decay and the mending. Default `1`. */
+    speed?: number;
+    /** How far the card leans toward the pointer, in degrees. `0` keeps it flat. Default `8`. */
+    tilt?: number;
+    /** A soft glare that follows the pointer across the card. Default `true`. */
+    glare?: boolean;
+    className?: string;
+}
+export declare const DecayCard: React.ForwardRefExoticComponent<DecayCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/decay-card/index.d.ts

@@ -0,0 +1 @@
+export { DecayCard, type DecayCardProps } from "./decay-card";

package/dist/components/deploy-streak/deploy-streak.d.ts

@@ -0,0 +1,30 @@
+/**
+ * DeployStreak
+ *
+ * Trigger: in view, then hover. A white card for a team's shipping streak: a
+ * title with an animated flame, a big count of days in a row with a deploy
+ * and a grid of dots, one per day. When the card scrolls into view the dots
+ * pop in as a diagonal wave, days that shipped filling in green, while the
+ * count runs up on odometer wheels; today's dot breathes a soft ring.
+ * Hovering a dot lifts it and names the day in a small ink tooltip; hovering
+ * the card lights the flame. Reduced motion shows the final state at once.
+ *
+ * Engine: motion/react (a counting motion value, staggered springs for the
+ * dots, AnimatePresence for the tooltip) with an animated flame from
+ * lucide-animated (MIT), vendored in src/icons.
+ */
+import * as React from "react";
+export interface DeployStreakProps {
+    /** Title. Default `"Deploys"`. */
+    title?: string;
+    /** One entry per day, oldest first; true is a day that shipped. The last day is today. Default 70 days. */
+    days?: boolean[];
+    /** Days per row. Default `14`. */
+    columns?: number;
+    /** Colour of days that shipped. Default `"#269a5a"`. */
+    color?: string;
+    /** Date of the last day, for the tooltips. Default today. */
+    today?: Date;
+    className?: string;
+}
+export declare const DeployStreak: React.ForwardRefExoticComponent<DeployStreakProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/deploy-streak/index.d.ts

@@ -0,0 +1 @@
+export { DeployStreak, type DeployStreakProps } from "./deploy-streak";

package/dist/components/depth-carousel/depth-carousel.d.ts

@@ -0,0 +1,42 @@
+/**
+ * DepthCarousel
+ *
+ * Trigger: hover, drag and scroll. A stack of cards receding into depth along
+ * a diagonal, each turned a little toward the viewer. It drifts slowly on its
+ * own; scroll, drag or the arrow keys glide it through the stack with
+ * momentum, and fast moves smear with a motion blur along the diagonal.
+ * Hovering a card pulls it up out of the stack and toward you: it draws in
+ * front of the others fully solid, turns to face you square on and tilts
+ * toward the cursor in perspective with a plastic shine (a hot spot that
+ * follows the cursor, a sheen band that slides as it tilts and a bright
+ * laminated edge), while every other card stays solid but
+ * sinks out of focus.
+ * The stack climbs up or down the frame, set by `direction`; changing it
+ * eases the whole stack across.
+ * The stack runs off both corners of the frame and loops forever, wrapping
+ * round out of sight. Reduced
+ * motion stops the drift, the blur and the tilt.
+ *
+ * Engine: motion/react (springs for the hover lift, tilt and shine) with one
+ * requestAnimationFrame loop placing the cards and driving the SVG motion
+ * blur.
+ */
+import * as React from "react";
+export interface DepthCarouselItem {
+    src: string;
+    title: string;
+}
+export interface DepthCarouselProps {
+    /** Cards in the stack. Default twelve photos. */
+    items?: DepthCarouselItem[];
+    /** Which way the stack climbs. Default `"up"`. */
+    direction?: "up" | "down";
+    /** Cards per second the stack drifts on its own. `0` holds it still. Default `0.18`. */
+    drift?: number;
+    /** Strength of the motion blur, 0 to 2. Default `1`. */
+    blur?: number;
+    /** Accessible name. Default `"Photo stack"`. */
+    label?: string;
+    className?: string;
+}
+export declare const DepthCarousel: React.ForwardRefExoticComponent<DepthCarouselProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/depth-carousel/index.d.ts

@@ -0,0 +1 @@
+export { DepthCarousel, type DepthCarouselProps, type DepthCarouselItem, } from "./depth-carousel";