motion-brew 0.0.0-stage → 0.1.0

package/dist/components/prompt-input/prompt-input.d.ts

@@ -0,0 +1,49 @@
+/**
+ * PromptInput
+ *
+ * Trigger: type (plus press). A white composer for an AI assistant. The field
+ * grows smoothly as you write, and while it is empty its placeholder rolls
+ * through example prompts. Underneath sits a row of tools: an attach icon that
+ * plays on hover and adds file chips that pop in (and shrink away when
+ * removed), a model picker that opens upward with a sliding highlight, a web
+ * search toggle with an earth that turns on hover, and a mic that turns into
+ * live sound bars while a ring of fine particles in the field ripples and
+ * brightens with the voice beside a running timer, then types out what it
+ * heard. The send
+ * button stays quiet until there is something to send, then wakes into ink;
+ * pressing it (or Enter) launches the arrow upward and turns the button into a
+ * stop square while a soft neutral glow breathes around the card and a light
+ * shimmer travels round its edge until the reply is done.
+ * Shift and Enter make a new line. Reduced motion keeps every state but drops
+ * the movement.
+ *
+ * Engine: motion/react (height glide, rolling placeholder, spring chips, a
+ * layoutId menu highlight, and a breathing neutral glow with a travelling
+ * edge shimmer while it works), with a GSAP ticker drawing the listening
+ * particle ring.
+ */
+import * as React from "react";
+export interface PromptModel {
+    id: string;
+    label: string;
+    /** A short line under the name in the menu. */
+    hint: string;
+}
+export interface PromptSubmit {
+    text: string;
+    model: string;
+    web: boolean;
+    files: string[];
+}
+export interface PromptInputProps {
+    /** Placeholders the empty field rolls through. */
+    placeholders?: string[];
+    /** Models in the picker. Default three. */
+    models?: PromptModel[];
+    /** Called on send. Return a promise to keep the working state until it settles. */
+    onSubmit?: (prompt: PromptSubmit) => void | Promise<unknown>;
+    /** Called by the attach button. Default adds a sample file chip. */
+    onAttach?: () => void;
+    className?: string;
+}
+export declare const PromptInput: React.ForwardRefExoticComponent<PromptInputProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/quota-gauge/index.d.ts

@@ -0,0 +1 @@
+export { QuotaGauge, type QuotaGaugeProps } from "./quota-gauge";

package/dist/components/quota-gauge/quota-gauge.d.ts

@@ -0,0 +1,30 @@
+/**
+ * QuotaGauge
+ *
+ * Trigger: in view, then hover. A white card for a plan's credit quota: a
+ * three quarter gauge made of radial ticks, like a speedometer, around a
+ * bolt. When it scrolls into view the ticks light up one by one up to the
+ * amount used, the lit ones growing a little longer, while the credits count
+ * up on odometer wheels beneath the bolt and the share of the plan rolls in.
+ * The tick at the tip glows. Hovering the card plays the bolt and swaps the
+ * caption to what is left. Reduced motion shows the final state at once.
+ *
+ * Engine: motion/react (a counting motion value drives the ticks and the
+ * numbers, springs for the ticks, AnimatePresence for the caption) with an
+ * animated bolt from lucide-animated (MIT), vendored in src/icons.
+ */
+import * as React from "react";
+export interface QuotaGaugeProps {
+    /** Credits used so far. Default `2022`. */
+    value?: number;
+    /** The plan limit. Default `2500`. */
+    goal?: number;
+    /** Unit after the amount. Default `"credits used"`. */
+    unit?: string;
+    /** Ticks on the gauge. Default `44`. */
+    ticks?: number;
+    /** Colour of lit ticks. Default ink. */
+    color?: string;
+    className?: string;
+}
+export declare const QuotaGauge: React.ForwardRefExoticComponent<QuotaGaugeProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/range-chart/index.d.ts

@@ -0,0 +1 @@
+export { RangeChart, type RangeChartProps, type RangeDay } from "./range-chart";

package/dist/components/range-chart/range-chart.d.ts

@@ -0,0 +1,47 @@
+/**
+ * RangeChart
+ *
+ * Trigger: hover and press (plus keys and in view). A white card that charts a
+ * range for each day, like heart rate: a pill from each day's low to high on
+ * a soft column track, separate bubbles for outlying readings, and a dashed
+ * average line. A 7D, 15D or 30D switch picks how many days to show: an ink
+ * pill slides to it, the bars slim down or widen to fit and grow back in, and
+ * the labels change from weekdays to dates. When the card scrolls into view
+ * it rises, the pills grow out from the average one after another and the
+ * average tag slides in. Hovering a day (or focusing it, or stepping with the
+ * arrow keys) widens its pills, marks their ends with white dots and fades
+ * the other days, while the big range in the header rolls to that day like
+ * an odometer, the caption names it, and the Lowest, Average and Peak tiles
+ * roll to match; leaving rolls it all back. The Full stats button slides its
+ * arrow through on hover. Reduced motion keeps the states without movement.
+ *
+ * Engine: motion/react (staggered springs for the bars, odometer digit
+ * columns for the numbers, layoutId pills for the switch and the hovered
+ * column, AnimatePresence for the captions).
+ */
+import * as React from "react";
+export interface RangeDay {
+    /** The day, used for labels and the header. */
+    date: Date;
+    /** One or more [low, high] ranges; a short one reads as a single bubble. */
+    ranges: [number, number][];
+}
+export interface RangeChartProps {
+    title?: string;
+    /** Unit after the numbers. Default `"bpm"`. */
+    unit?: string;
+    /** Every day you have, oldest first. The chart shows the most recent ones. Default 30 days. */
+    data?: RangeDay[];
+    /** Spans the switch offers, in days. Default `[7, 15, 30]`. */
+    spans?: number[];
+    /** Span shown first. Default `7`. */
+    defaultSpan?: number;
+    /** Value of the dashed average line. Default the mean of the shown readings. */
+    average?: number;
+    /** Range colour. Default a warm red. */
+    color?: string;
+    /** Called by the Full stats button. */
+    onFullStats?: () => void;
+    className?: string;
+}
+export declare const RangeChart: React.ForwardRefExoticComponent<RangeChartProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1 @@
+export { ReactionCard, type ReactionCardProps, type Reaction, } from "./reaction-card";

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

@@ -0,0 +1,60 @@
+/**
+ * ReactionCard
+ *
+ * Trigger: hover and press (long press on touch). A white post card with
+ * three reaction buttons, each with its own pop-up of choices in the spirit
+ * of a social feed. React opens a row of faces, Love a row of coloured
+ * hearts, and Boost a row of numbers to add. Hovering a button for a moment,
+ * or holding it on touch, springs the pop-up open with each choice rising in
+ * turn; the choice under the pointer swells and lifts with its name above
+ * it. Picking one closes the pop-up, pops the choice into the button with a
+ * small burst of copies flying out, and rolls the count. A quick press
+ * without opening the pop-up toggles the first choice, and Boost adds one
+ * each time with a +1 that floats up. The summary line above the buttons
+ * stacks the faces picked so far. With the keyboard, Arrow Up opens a
+ * pop-up, arrows move through it, Enter picks and Escape closes. Reduced
+ * motion swaps the springs and bursts for fades.
+ *
+ * Engine: motion/react (spring pop-ups, staggered choices, bursts and
+ * rolling counts).
+ */
+import * as React from "react";
+export interface Reaction {
+    key: string;
+    /** What shows in the pop-up and on the button. */
+    emoji: string;
+    /** Name shown above it in the pop-up and on the button once picked. */
+    label: string;
+    /** For Boost style buttons, how much a pick adds. */
+    amount?: number;
+}
+export interface ReactionCardProps {
+    /** Who posted. Default `"Maya Lindqvist"`. */
+    author?: string;
+    /** Their photo. */
+    avatar?: string;
+    /** When they posted. Default `"2h"`. */
+    time?: string;
+    /** The post itself. */
+    text?: string;
+    /** Faces for the React button. */
+    faces?: Reaction[];
+    /** Hearts for the Love button. */
+    hearts?: Reaction[];
+    /** Amounts for the Boost button. */
+    boosts?: Reaction[];
+    /** Reactions before yours. Default `128`. */
+    reactions?: number;
+    /** Loves before yours. Default `64`. */
+    loves?: number;
+    /** Boost total before yours. Default `320`. */
+    boosted?: number;
+    /** Called whenever any button changes, with all three values. */
+    onChange?: (state: {
+        face: string | null;
+        heart: string | null;
+        boost: number;
+    }) => void;
+    className?: string;
+}
+export declare const ReactionCard: React.ForwardRefExoticComponent<ReactionCardProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1 @@
+export { RecapCard, type RecapCardProps, type RecapStat, type RecapPart, type RecapBadge, type RecapIconName, } from "./recap-card";

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

@@ -0,0 +1,61 @@
+/**
+ * RecapCard
+ *
+ * Trigger: in view, then hover, focus and press. A white summary card that
+ * reads like a sentence: the period's numbers sit inline in soft gray chips,
+ * each with an animated icon, and count up from zero when the card scrolls
+ * into view while their icons play once. Below, a row of round milestone
+ * badges pops in one after another on a spring. Earned badges carry their icon
+ * in ink with a small check; a badge still in reach shows a ring filling to
+ * how close it is. Hovering or focusing a badge lifts it, turns its disc to
+ * ink and plays its icon, and a dark note on how it was earned grows up out of
+ * the disc like liquid: a column shoots up, spreads into the note and stays
+ * joined to the disc by soft inward curves, then drains back on leave. A full width button at the bottom
+ * slides its arrow on hover and dips on press. Reduced motion shows the final
+ * state at once.
+ *
+ * Engine: motion/react (useInView, animate on motion values for the counts,
+ * staggered spring variants for the badges, a pathLength ring for progress,
+ * and two springs feeding one SVG path for the liquid note, as in LiquidTabs).
+ */
+import * as React from "react";
+/** The animated icons a stat or a badge can carry. */
+export type RecapIconName = "words" | "trend" | "streak" | "time" | "spark" | "sun" | "moon" | "feather";
+/** A number inside the sentence, set in a chip that counts up. */
+export interface RecapStat {
+    value: number;
+    /** Decimal places. Default `0`. */
+    decimals?: number;
+    /** Text before the number, as in `"$"`. */
+    prefix?: string;
+    /** Text after the number, as in `" words"` or `"%"`. */
+    suffix?: string;
+    icon?: RecapIconName;
+}
+/** The sentence, as plain text and stats in reading order. */
+export type RecapPart = string | RecapStat;
+export interface RecapBadge {
+    label: string;
+    icon: RecapIconName;
+    /** How it was earned, or how close it is, shown on hover and focus. */
+    note: string;
+    /** Share of the way there, 0 to 1. Below 1 the badge is still in reach and shows a ring. Default `1`. */
+    progress?: number;
+}
+export interface RecapCardProps {
+    /** Card title. Default `"Your month in words"`. */
+    title?: string;
+    /** Period shown in a chip by the title. Pass `null` to hide it. Default `"November"`. */
+    period?: string | null;
+    /** The summary sentence. Default a writing recap. */
+    parts?: RecapPart[];
+    /** The badges, left to right. Default four writing milestones. */
+    badges?: RecapBadge[];
+    /** Button label. Pass `null` to hide the button. Default `"View full recap"`. */
+    actionLabel?: string | null;
+    /** Makes the button a link. */
+    href?: string;
+    onAction?: () => void;
+    className?: string;
+}
+export declare const RecapCard: React.ForwardRefExoticComponent<RecapCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/receipt-button/index.d.ts

@@ -0,0 +1 @@
+export { ReceiptButton, type ReceiptButtonProps, type ReceiptItem } from "./receipt-button";

package/dist/components/receipt-button/receipt-button.d.ts

@@ -0,0 +1,53 @@
+/**
+ * ReceiptButton
+ *
+ * Trigger: press, then a timeline. Pressing pay lifts the label away while a
+ * success fill washes across the button with a rippling water edge. A check draws itself and "Paid" rises
+ * in letter by letter. Then a receipt feeds up from behind the button line by
+ * line, like a thermal printer, and is torn off: its bottom edge rips into a
+ * zigzag and the slip lifts away with a slight tilt. It resets after a delay,
+ * or when the receipt is clicked. Reduced motion jumps straight to the end.
+ *
+ * Engine: gsap + @gsap/react (one timeline per payment, scoped with useGSAP,
+ * contextSafe handlers, clip-path tween for the tear).
+ */
+import * as React from "react";
+export interface ReceiptItem {
+    qty: number;
+    name: string;
+    price: number;
+}
+export interface ReceiptButtonProps {
+    /** Line items on the receipt. The total is their sum. */
+    items?: ReceiptItem[];
+    /** Currency symbol. Default `"$"`. */
+    currency?: string;
+    /** Shop name at the top of the receipt. Default `"NORTH ROAST"`. */
+    merchant?: string;
+    /** Small line under the shop name. Default `"Coffee bar"`. */
+    tagline?: string;
+    /** Order number printed on the receipt. Default `"1042"`. */
+    orderId?: string;
+    /** Last line of the receipt. Default `"Thank you, come again"`. */
+    footer?: string;
+    /** Button label before paying. Default `Pay {total}`. */
+    label?: React.ReactNode;
+    /** Label once paid. Default `"Paid"`. */
+    paidLabel?: string;
+    /** How long the processing fill takes, in ms. Default `1200`. */
+    processing?: number;
+    /** Seconds per printed line. Lower prints faster. Default `0.09`. */
+    feedSpeed?: number;
+    /** Button color before paying. Default `"#141414"`. */
+    color?: string;
+    /** Fill and paid color. Default `"#2f8a4f"`. */
+    successColor?: string;
+    /** Reset this many ms after the tear. `null` keeps the receipt. Default `3200`. */
+    resetAfter?: number | null;
+    /** Called on press, when payment starts. */
+    onPay?: () => void;
+    /** Called once the receipt is torn off. */
+    onComplete?: () => void;
+    className?: string;
+}
+export declare const ReceiptButton: React.ForwardRefExoticComponent<ReceiptButtonProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/ribbon-gallery/index.d.ts

@@ -0,0 +1 @@
+export { RibbonGallery, type RibbonGalleryItem, type RibbonGalleryProps } from "./ribbon-gallery";

package/dist/components/ribbon-gallery/ribbon-gallery.d.ts

@@ -0,0 +1,61 @@
+/**
+ * RibbonGallery
+ *
+ * Trigger: drag (plus wheel, trackpad and touch). An endless ribbon of cards
+ * wrapped on the inside of a curved screen and tilted across the frame (20
+ * degrees by default). Cards near the edges swing toward you while the center
+ * sits back, and every card bends smoothly with the curve. Drag or flick to
+ * spin it, scroll to glide, or let it drift. Speed makes the ribbon ripple like
+ * fabric (it ripples gently even at rest) and smears it with a motion blur along its length, both settling as it
+ * slows to its resting ripple. Hovering a card brings it fully into focus, its
+ * ripple settling flat, while the rest of the ribbon fades back. On first view it sweeps in from the side. Reduced motion keeps it
+ * still and flat-lit, with no ripple, blur or drift.
+ *
+ * Engine: motion/react (useAnimationFrame runs the camera; each card is cut into
+ * thin vertical slices placed on a cylinder with CSS 3D transforms written
+ * straight to the DOM, so it bends without WebGL or React re-renders).
+ */
+import * as React from "react";
+export interface RibbonGalleryItem {
+    /** Image URL. */
+    src: string;
+    title: string;
+    /** Alt text. Default the title. */
+    alt?: string;
+    /** Where the card goes when clicked. */
+    href?: string;
+}
+export interface RibbonGalleryProps {
+    /** Cards on the ribbon; repeated as needed to loop. Default sample photos. */
+    items?: RibbonGalleryItem[];
+    /** Tilt of the ribbon across the frame, degrees. `0` is horizontal. Default `20`. */
+    angle?: number;
+    /** How strongly the ribbon curves, 0 (flat) to 1 (tight). Default `0.45`. */
+    curve?: number;
+    /** Card width, px. Default `230`. */
+    cardWidth?: number;
+    /** Card height, px. Default `290`. */
+    cardHeight?: number;
+    /** Space between cards, px. Default `14`. */
+    gap?: number;
+    /** Idle drift, px/s. `0` stops it. Default `30`. */
+    drift?: number;
+    /** How far a flick carries, 0 to 1. Default `0.65`. */
+    momentum?: number;
+    /** Ripple strength, 0 (flat) to 2. The ribbon always ripples gently and swells further while dragged or scrolled. Default `1`. */
+    wave?: number;
+    /** Strongest motion blur along the ribbon, px. `0` turns it off. Default `9.5`. */
+    blur?: number;
+    /** Sweep in from the side the first time it scrolls into view. Default `true`. */
+    intro?: boolean;
+    /** Wheel and trackpad move the ribbon while hovered. Default `true`. */
+    wheel?: boolean;
+    /** How far the other cards fade back while one is hovered, 0 (no fade) to 1. Default `0.75`. */
+    dim?: number;
+    /** Color the other cards fade toward while one is hovered; match it to the background. Default a light gray. */
+    dimColor?: string;
+    /** Accessible name. Default `"Project ribbon"`. */
+    label?: string;
+    className?: string;
+}
+export declare const RibbonGallery: React.ForwardRefExoticComponent<RibbonGalleryProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1 @@
+export { RoadmapCard, type RoadmapCardProps, type RoadmapPhase } from "./roadmap-card";

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

@@ -0,0 +1,38 @@
+/**
+ * RoadmapCard
+ *
+ * Trigger: press (plus keys and in view). A white card that walks through the
+ * phases of a product roadmap like stories. A row of bars across the top has
+ * one bar per phase: past ones full, the current one filling over the time
+ * each phase is shown, the rest empty; any bar jumps to its phase, and a
+ * small Playing chip pauses and resumes it. A big two digit phase number rolls
+ * like an odometer next to the title, the title and body blur across in the
+ * direction of travel, and a short list of milestones follows with each check
+ * drawing in one after another. Round previous and next buttons with animated
+ * chevrons step through, and so do the arrow keys. Reduced motion stops it
+ * playing on its own and swaps the moves for plain changes.
+ *
+ * Engine: motion/react (a motion value for the story fill that pauses and
+ * resumes from the chip, rolling digit columns, AnimatePresence for the text and the list)
+ * with animated icons from lucide-animated (MIT), vendored in src/icons.
+ */
+import * as React from "react";
+export interface RoadmapPhase {
+    /** Short name, like "Private beta". Shown as the title. */
+    title: string;
+    body: string;
+    /** A few milestones, checked off under the body. */
+    focus?: string[];
+}
+export interface RoadmapCardProps {
+    /** Small label at the top. Default `"Product roadmap"`. */
+    label?: string;
+    phases?: RoadmapPhase[];
+    /** Phase shown first. Default `2` (the third). */
+    defaultPhase?: number;
+    /** Seconds per phase while it plays on its own; `0` turns it off. Default `5`. */
+    autoplay?: number;
+    onChange?: (index: number) => void;
+    className?: string;
+}
+export declare const RoadmapCard: React.ForwardRefExoticComponent<RoadmapCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/rolling-card-stack/index.d.ts

@@ -0,0 +1 @@
+export { RollingCardStack, type RollingCardStackProps, type StackCard } from "./rolling-card-stack";

package/dist/components/rolling-card-stack/rolling-card-stack.d.ts

@@ -0,0 +1,53 @@
+/**
+ * RollingCardStack
+ *
+ * Trigger: drag (plus wheel, keys and a timeline). A deck of metric cards that
+ * rolls forward like a rolodex. The cards behind peek out above the front one,
+ * smaller and softer. On each advance the front card tips forward and rolls
+ * down out of view with a touch of blur, the next card glides into place, and
+ * the rolled card fades into the back of the stack. The new front card counts
+ * its number up and fills its segmented bar. It advances on its own, pausing
+ * while hovered or focused; drag it up or down, scroll or use the arrow keys
+ * to roll it yourself. Changes are announced politely.
+ * Reduced motion swaps cards with a fade.
+ *
+ * Engine: motion/react (keyframed roll, depth springs, drag with elastic snap,
+ * counting numbers and staggered bar fills).
+ */
+import * as React from "react";
+import { type LucideIcon } from "lucide-react";
+export interface StackCard {
+    title: string;
+    value: number;
+    /** Text before the number, like `"$"`. */
+    prefix?: string;
+    /** Text after the number, like `"%"`. */
+    suffix?: string;
+    /** Decimal places. Default `0`. */
+    decimals?: number;
+    /** Change label, like `"+12.4%"`. A leading minus shows it as a drop. */
+    delta?: string;
+    /** Bar fill, 0 to 1. */
+    progress: number;
+    /** Caption after the bar. Default `"<n>% of target"`. */
+    caption?: string;
+    /** Accent color for the bar and dot. */
+    color: string;
+    icon?: LucideIcon;
+}
+export interface RollingCardStackProps {
+    /** Cards in order. Default five product metrics. */
+    cards?: StackCard[];
+    /** Milliseconds between automatic rolls. `0` turns autoplay off. Default `3600`. */
+    interval?: number;
+    /** How many cards peek out behind the front one. Default `2`. */
+    peek?: number;
+    /** Pills in each card's bar. Default `10`. */
+    pills?: number;
+    /** Called with the new front card's index. */
+    onChange?: (index: number) => void;
+    /** Accessible name. Default `"Metrics"`. */
+    label?: string;
+    className?: string;
+}
+export declare const RollingCardStack: React.ForwardRefExoticComponent<RollingCardStackProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/rolling-stepper/index.d.ts

@@ -0,0 +1 @@
+export { RollingStepper, type RollingStepperProps } from "./rolling-stepper";

package/dist/components/rolling-stepper/rolling-stepper.d.ts

@@ -0,0 +1,33 @@
+/**
+ * RollingStepper
+ *
+ * Trigger: press. A number stepper whose digits roll like an odometer. Each
+ * digit is its own column of 0 to 9 that springs to the new value, so going
+ * from 19 to 20 rolls both columns. The buttons squash on press, and hitting
+ * the min or max gives a small sideways shake instead of a dead click.
+ * Arrow Up / Down step the value when the number is focused.
+ *
+ * Engine: motion/react (springs on transform, useAnimate for the shake).
+ */
+import * as React from "react";
+import { type SpringOptions } from "motion/react";
+export interface RollingStepperProps {
+    /** Controlled value. Leave out to let the stepper manage its own value. */
+    value?: number;
+    /** Starting value when uncontrolled. Default `0`. */
+    defaultValue?: number;
+    /** Called with the next value after every step. */
+    onValueChange?: (value: number) => void;
+    /** Lowest allowed value. Default `0`. */
+    min?: number;
+    /** Highest allowed value. Default `999`. */
+    max?: number;
+    /** Amount per step. Default `1`. */
+    step?: number;
+    /** Spring for the digit roll. Default `{ stiffness: 280, damping: 26, mass: 0.8 }`. */
+    spring?: SpringOptions;
+    /** Accessible name for the value. Default `"Quantity"`. */
+    label?: string;
+    className?: string;
+}
+export declare function RollingStepper({ value: valueProp, defaultValue, onValueChange, min, max, step, spring, label, className, }: RollingStepperProps): React.JSX.Element;

package/dist/components/rotating-text/index.d.ts

@@ -0,0 +1 @@
+export { RotatingText, type RotatingTextProps } from "./rotating-text";

package/dist/components/rotating-text/rotating-text.d.ts

@@ -0,0 +1,25 @@
+/**
+ * RotatingText
+ *
+ * Trigger: hover. Text set on a circle spins slowly around a center badge.
+ * Hovering speeds the spin up and the arrow in the middle turns to point the
+ * way; leaving eases the spin back down. Reduced motion keeps the ring still.
+ *
+ * Engine: motion/react (useAnimationFrame drives the rotation so the speed can
+ * ease between rates without restarting the loop).
+ */
+import * as React from "react";
+export interface RotatingTextProps {
+    /** Text on the ring; it repeats to fill the circle. Default `"Scroll to explore • "`. */
+    text?: string;
+    /** Diameter in px. Default `160`. */
+    size?: number;
+    /** Seconds per turn at rest. Default `14`. */
+    duration?: number;
+    /** How much faster it spins on hover. Default `4`. */
+    boost?: number;
+    /** Accessible label. Default the ring text. */
+    label?: string;
+    className?: string;
+}
+export declare const RotatingText: React.ForwardRefExoticComponent<RotatingTextProps & React.RefAttributes<HTMLDivElement>>;

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

@@ -0,0 +1 @@
+export { ScoreCard, type ScoreCardProps, type ScoreBar, } from "./score-card";

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

@@ -0,0 +1,40 @@
+/**
+ * ScoreCard
+ *
+ * Trigger: in view, then hover, press and keys. A white chart card with a big
+ * score and a few pill bars. When it scrolls into view the bars slide in from
+ * the left one after another, springing a little past their mark, while the
+ * score counts up from zero with a light motion blur. Hovering (or focusing) a
+ * bar fills it with its colour, dims the others and rolls the score to that bar's share,
+ * with its name in the caption; leaving rolls it back. New data glides every
+ * bar to its new length while the score counts to the new number.
+ * Reduced motion shows the final state at once.
+ *
+ * Engine: motion/react (animate on motion values for the count, bar fills
+ * that grow on springs, AnimatePresence for the
+ * caption and the change chip).
+ */
+import * as React from "react";
+export interface ScoreBar {
+    label: string;
+    value: number;
+    max: number;
+    /** Bar colour. Defaults run violet, blue, green. */
+    color?: string;
+}
+export interface ScoreCardProps {
+    /** Card title. Default `"Health score"`. */
+    title?: string;
+    /** Avatar image in the corner. Pass `null` to hide it. */
+    avatar?: string | null;
+    /** The bars, top to bottom. The last one sits in full colour. Default Sleep, Activity and Nutrition. */
+    bars?: ScoreBar[];
+    /** Change against the period before, in points, shown as a chip. Pass `null` to hide it. Default `4.1`. */
+    change?: number | null;
+    /** Period named in the caption, as in "Overall this month". Default `"month"`. */
+    period?: string;
+    /** Decimal places on the score. Default `1`. */
+    decimals?: number;
+    className?: string;
+}
+export declare const ScoreCard: React.ForwardRefExoticComponent<ScoreCardProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components/search-modal/index.d.ts

@@ -0,0 +1 @@
+export { SearchModal, type SearchModalProps, type SearchModalItem, type SearchModalAction, } from "./search-modal";