panelui-native 0.97.0 → 0.98.0

package/lib/typescript/src/components/stack-card/index.d.ts

@@ -0,0 +1,472 @@
+/**
+ * StackCard — a pile of cards, taken one at a time by throwing the top one off.
+ *
+ * ```tsx
+ * <StackCard className="h-[460px]" onSwipe={(direction, index) => decide(people[index], direction)}>
+ *   <StackCard.Stamp direction="right" color="success">Yes</StackCard.Stamp>
+ *   <StackCard.Stamp direction="left" color="destructive">No</StackCard.Stamp>
+ *   {people.map((person) => (
+ *     <StackCard.Card key={person.id}>
+ *       <Text>{person.name}</Text>
+ *     </StackCard.Card>
+ *   ))}
+ *   <StackCard.Empty>
+ *     <Text muted>Nobody left</Text>
+ *   </StackCard.Empty>
+ * </StackCard>
+ * ```
+ *
+ * For a queue of things each answered with one decision and then gone: a
+ * review queue, a set of flashcards, an inbox of suggestions. The gesture is
+ * the answer, which is what makes it quicker than a list of rows with buttons
+ * on them — and what makes it wrong for anything the reader has to compare,
+ * skim or come back to. A deck shows one card and hides the rest.
+ *
+ * For a run of slides the reader browses rather than disposes of, use
+ * [Carousel](../carousel); for one row's actions in a list, [Swipe](../swipe).
+ *
+ * ## The pile is one drag, read by everything
+ *
+ * The top card's `x` and `y` are the only values a gesture writes, and every
+ * other moving part is derived from them: each stamp fades in on how far the
+ * drag has carried the card toward its own direction, and the cards behind
+ * climb toward the top position on the furthest of those.
+ *
+ * That derivation is also what makes a dismissal seamless. By the time the top
+ * card has been carried far enough to leave, the second card is already
+ * exactly where the top card sits — so when the deck advances there is nothing
+ * left for it to move, and no frame in which the pile re-arranges itself.
+ *
+ * ## The deck moves on the UI thread, and React catches up
+ *
+ * Which card is on top is held twice: as React state, for what is mounted and
+ * for the callbacks, and as a shared value, for what is drawn. A throw is
+ * handled entirely on the UI thread — the card leaves on the frame the finger
+ * lets go, and once it is off the screen the top card, the offset and the fade
+ * all move in one step — and only then is the new index requested from React.
+ *
+ * Nothing on the screen waits for a render, so a busy JavaScript thread cannot
+ * stall a throw or leave a frame where the two halves disagree. What React
+ * renders afterwards is kept from showing before the UI thread agrees with it:
+ * a stamp is only drawn on the card the UI thread has on top.
+ *
+ * A controlled deck is still the owner's to decide. An owner that declines the
+ * new index gets the card back, flown in from the way it went; one that
+ * accepts it sees nothing move at all, because it already has.
+ *
+ * One card behind the pile's stated depth stays mounted so it can fade in as
+ * it takes the last visible place, and one card ahead of the top stays mounted
+ * so `undo` has something to fly back in. The rest are unmounted, which is
+ * what makes a deck of five hundred cost what a deck of five costs.
+ *
+ * ## A deck is not reachable by a gesture alone
+ *
+ * A throw is not available to a screen reader, and neither is a card that can
+ * only be answered by throwing it. So the top card publishes an accessibility
+ * action for every direction the deck accepts, and `StackCard.Action` renders
+ * the same decisions as ordinary buttons — which sighted people reach for too,
+ * on the card they are not sure about.
+ */
+import { type ReactNode } from 'react';
+import { View, type ViewProps } from 'react-native';
+import { type SharedValue } from 'react-native-reanimated';
+import { type VariantProps } from 'tailwind-variants';
+import { type StackCardDirection } from './stack-card-geometry.js';
+export type { StackCardDirection } from './stack-card-geometry.js';
+/**
+ * The deck's state, for a control that lives outside the pile — a counter, a
+ * progress bar, a button in a toolbar.
+ *
+ * `release` is a shared value running 0 to 1 as the top card is carried toward
+ * leaving, so something beside the deck can move with the drag rather than
+ * starting a second animation next to it.
+ */
+export declare function useStackCard(): {
+    /** How many cards have been answered, which is also the top card's index. */
+    index: number;
+    /** How many cards the deck was given. */
+    count: number;
+    /** How many are left, the top one included. */
+    remaining: number;
+    /** Whether there is a card to bring back. */
+    canUndo: boolean;
+    release: SharedValue<number>;
+    send: (direction: StackCardDirection) => void;
+    undo: () => void;
+    reset: () => void;
+};
+/** How the cards behind the top one are arranged. */
+export type StackCardLayout = 'stack' | 'fan' | 'flat';
+export interface StackCardHandle {
+    /** Send the top card away as though it had been thrown that way. */
+    swipe: (direction: StackCardDirection) => void;
+    /** Bring the last card back, and with it the decision that removed it. */
+    undo: () => void;
+    /** Put every card back. */
+    reset: () => void;
+}
+export interface StackCardProps extends Omit<ViewProps, 'children'> {
+    /**
+     * A `StackCard.Card` for each card, plus any of `StackCard.Stamp`,
+     * `StackCard.Empty` and `StackCard.Actions`, in any order. Anything else is
+     * laid out under the pile.
+     */
+    children?: ReactNode;
+    /**
+     * Which card is on top, when the caller holds it. Leave unset to let the
+     * deck keep its own. A controlled deck that declines a request stays where
+     * it is and the thrown card comes back, so this is also how a decision is
+     * confirmed before it is taken.
+     */
+    index?: number;
+    /** Which card an uncontrolled deck starts on. */
+    defaultIndex?: number;
+    /** Fires whenever the deck asks to move, with the index it is asking for. */
+    onIndexChange?: (index: number) => void;
+    /**
+     * Fires when a card leaves, with the way it went and the index it was at.
+     * It fires before `onIndexChange` asks for the next index. Not called by
+     * `undo` — the index going back is what reports that.
+     */
+    onSwipe?: (direction: StackCardDirection, index: number) => void;
+    /** Fires once when the last card leaves. */
+    onEmpty?: () => void;
+    /**
+     * Which ways a card may be thrown. Left and right by default.
+     *
+     * A direction left out still follows the finger a little and then comes
+     * back, rather than refusing to move at all — a card that does not budge
+     * reads as a frozen screen.
+     */
+    directions?: readonly StackCardDirection[];
+    /**
+     * How the cards behind the top one are arranged. `stack` steps them down and
+     * back; `fan` turns them alternately, like a hand of cards; `flat` hides them
+     * entirely, for full-bleed cards where a peeking edge is only clutter.
+     */
+    layout?: StackCardLayout;
+    /** How many cards are drawn behind the top one. Two is a pile; five is a mess. */
+    depth?: number;
+    /**
+     * How far a card has to be taken for a release to send it away, as a
+     * fraction of the card. Momentum counts toward it, so a flick clears it
+     * without travelling.
+     */
+    threshold?: number;
+    /** Stop the deck taking a gesture, without changing how it looks. */
+    disabled?: boolean;
+    /** A tick when a drag first reaches the point of no return, and a knock as the card goes. */
+    haptics?: boolean;
+    /**
+     * What a screen reader is offered for each direction, in place of "Swipe
+     * left". Name the decision — `{ left: 'Skip', right: 'Save' }`.
+     */
+    directionLabels?: Partial<Record<StackCardDirection, string>>;
+    /** Classes for the whole control. Give it a height; the pile fills what is left. */
+    className?: string;
+    /** Classes for the box the cards are laid out in. */
+    pileClassName?: string;
+}
+export interface StackCardCardProps extends ViewProps {
+    className?: string;
+    children?: ReactNode;
+}
+/**
+ * A stamp is a filled block of colour with a word on it, turned a few degrees
+ * so it reads as pressed onto the card rather than laid out on it.
+ *
+ * The fill is the status colour at full strength rather than a tint of it: a
+ * stamp exists only for the moment it appears, and a six-per-cent wash of the
+ * card's own surface is a smudge rather than an answer. The word is carried in
+ * white, which is what the status colours are chosen to take — a status's
+ * `-foreground` token is its darker text form, meant for a neutral surface,
+ * and over the fill it is the same hue twice.
+ *
+ * It sits in the corner the card is being pulled away from, which is also the
+ * corner the thumb is not over.
+ */
+declare const stampVariants: import("tailwind-variants").TVReturnType<{
+    color: {
+        default: {
+            pill: string;
+            label: string;
+        };
+        primary: {
+            pill: string;
+            label: string;
+        };
+        success: {
+            pill: string;
+            label: string;
+        };
+        warning: {
+            pill: string;
+            label: string;
+        };
+        info: {
+            pill: string;
+            label: string;
+        };
+        destructive: {
+            pill: string;
+            label: string;
+        };
+    };
+    direction: {
+        left: {
+            root: string;
+            pill: string;
+        };
+        right: {
+            root: string;
+            pill: string;
+        };
+        up: {
+            root: string;
+        };
+        down: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    pill: string;
+    label: string;
+}, undefined, {
+    color: {
+        default: {
+            pill: string;
+            label: string;
+        };
+        primary: {
+            pill: string;
+            label: string;
+        };
+        success: {
+            pill: string;
+            label: string;
+        };
+        warning: {
+            pill: string;
+            label: string;
+        };
+        info: {
+            pill: string;
+            label: string;
+        };
+        destructive: {
+            pill: string;
+            label: string;
+        };
+    };
+    direction: {
+        left: {
+            root: string;
+            pill: string;
+        };
+        right: {
+            root: string;
+            pill: string;
+        };
+        up: {
+            root: string;
+        };
+        down: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    pill: string;
+    label: string;
+}, import("tailwind-variants").TVReturnType<{
+    color: {
+        default: {
+            pill: string;
+            label: string;
+        };
+        primary: {
+            pill: string;
+            label: string;
+        };
+        success: {
+            pill: string;
+            label: string;
+        };
+        warning: {
+            pill: string;
+            label: string;
+        };
+        info: {
+            pill: string;
+            label: string;
+        };
+        destructive: {
+            pill: string;
+            label: string;
+        };
+    };
+    direction: {
+        left: {
+            root: string;
+            pill: string;
+        };
+        right: {
+            root: string;
+            pill: string;
+        };
+        up: {
+            root: string;
+        };
+        down: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+    pill: string;
+    label: string;
+}, undefined, unknown, unknown, undefined>>;
+export type StackCardStampColor = 'default' | 'primary' | 'success' | 'warning' | 'info' | 'destructive';
+export interface StackCardStampProps extends Omit<ViewProps, 'children'>, VariantProps<typeof stampVariants> {
+    className?: string;
+    /** The word, or anything else to draw on the stamp. */
+    children?: ReactNode;
+    /** Which direction the stamp answers for. Also where on the card it goes. */
+    direction?: StackCardDirection;
+    /** Extra classes for the label, when the stamp is given a string. */
+    labelClassName?: string;
+}
+export interface StackCardEmptyProps extends ViewProps {
+    className?: string;
+    children?: ReactNode;
+}
+export interface StackCardActionsProps extends ViewProps {
+    className?: string;
+    children?: ReactNode;
+}
+declare const actionVariants: import("tailwind-variants").TVReturnType<{
+    color: {
+        default: {
+            root: string;
+        };
+        primary: {
+            root: string;
+        };
+        success: {
+            root: string;
+        };
+        warning: {
+            root: string;
+        };
+        info: {
+            root: string;
+        };
+        destructive: {
+            root: string;
+        };
+    };
+    size: {
+        sm: {
+            root: string;
+        };
+        md: {
+            root: string;
+        };
+        lg: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+}, undefined, {
+    color: {
+        default: {
+            root: string;
+        };
+        primary: {
+            root: string;
+        };
+        success: {
+            root: string;
+        };
+        warning: {
+            root: string;
+        };
+        info: {
+            root: string;
+        };
+        destructive: {
+            root: string;
+        };
+    };
+    size: {
+        sm: {
+            root: string;
+        };
+        md: {
+            root: string;
+        };
+        lg: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+}, import("tailwind-variants").TVReturnType<{
+    color: {
+        default: {
+            root: string;
+        };
+        primary: {
+            root: string;
+        };
+        success: {
+            root: string;
+        };
+        warning: {
+            root: string;
+        };
+        info: {
+            root: string;
+        };
+        destructive: {
+            root: string;
+        };
+    };
+    size: {
+        sm: {
+            root: string;
+        };
+        md: {
+            root: string;
+        };
+        lg: {
+            root: string;
+        };
+    };
+}, {
+    root: string;
+}, undefined, unknown, unknown, undefined>>;
+export interface StackCardActionProps extends Omit<ViewProps, 'children'>, VariantProps<typeof actionVariants> {
+    className?: string;
+    /** What pressing it does: send the top card that way, or bring the last one back. */
+    action: StackCardDirection | 'undo';
+    /** The glyph. Sized and tinted by the button — pass neither. */
+    icon?: ReactNode;
+    /**
+     * What a screen reader is offered. Falls back to "Undo", or to the plain
+     * name of the direction.
+     */
+    label?: string;
+    /** Run after the deck has been told, for a sound or a log. */
+    onPress?: () => void;
+}
+export declare const StackCard: import("react").ForwardRefExoticComponent<StackCardProps & import("react").RefAttributes<StackCardHandle>> & {
+    Card: import("react").ForwardRefExoticComponent<StackCardCardProps & import("react").RefAttributes<View>>;
+    Stamp: import("react").ForwardRefExoticComponent<StackCardStampProps & import("react").RefAttributes<View>>;
+    Empty: import("react").ForwardRefExoticComponent<StackCardEmptyProps & import("react").RefAttributes<View>>;
+    Actions: import("react").ForwardRefExoticComponent<StackCardActionsProps & import("react").RefAttributes<View>>;
+    Action: import("react").ForwardRefExoticComponent<StackCardActionProps & import("react").RefAttributes<View>>;
+};
+//# sourceMappingURL=index.d.ts.map

package/lib/typescript/src/components/stack-card/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../../src/components/stack-card/index.tsx"],"names":[],"mappings":"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"}

package/lib/typescript/src/components/stack-card/stack-card-geometry.d.ts

@@ -0,0 +1,126 @@
+/**
+ * The numbers a deck is made of, kept apart from the views that draw them so
+ * each rule can be checked on its own.
+ *
+ * Every function here is a worklet: they run inside the pan handler and the
+ * animated styles, on the UI thread, and none of them touches anything but
+ * its arguments.
+ */
+/** Which way a card leaves the deck. */
+export type StackCardDirection = 'left' | 'right' | 'up' | 'down';
+/**
+ * iOS's scroll deceleration, and the constant behind `project`.
+ *
+ * Momentum is what lets a short fast flick count and a long slow drag not.
+ * Without it the only question a release can answer is how far the finger
+ * travelled, and a deck read that way feels heavy in the hand.
+ */
+export declare const DECELERATION = 0.998;
+/**
+ * Where a flick would come to rest if it kept decelerating, in points.
+ *
+ * The exponential-decay form the platform uses, not the `v² / 2a` from
+ * physics: the two disagree most at exactly the speeds a thumb produces.
+ */
+export declare function project(velocity: number, deceleration?: number): number;
+/**
+ * How far a finger gets on an axis the deck does not accept, given how far it
+ * pushed.
+ *
+ * Asymptotic rather than clamped. A card that stops dead at a limit reads as
+ * broken; one that keeps moving a little further for a lot more travel reads
+ * as held.
+ */
+export declare function resist(travel: number, span: number, give: number): number;
+/** How far a card has to be taken for a release to send it away, in points. */
+export declare function commitReach(span: number, threshold: number): number;
+/**
+ * How far a drag has carried a card toward leaving in one direction, 0 to 1.
+ *
+ * One number, and three things read it: the stamp for that direction fades in
+ * on it, the card behind climbs into place on it, and the haptic fires when it
+ * first reaches 1.
+ */
+export declare function directionProgress(direction: StackCardDirection, x: number, y: number, width: number, height: number, threshold: number): number;
+/** The furthest any accepted direction has been carried, 0 to 1. */
+export declare function releaseProgress(allowed: readonly StackCardDirection[], x: number, y: number, width: number, height: number, threshold: number): number;
+/**
+ * Which way a lifted finger sent the card, or `null` to put it back.
+ *
+ * Distance and momentum are added before the comparison rather than tested one
+ * after the other, so there is a single rule: a card leaves when the finger
+ * was going to take it past the reach, whether it got there or not.
+ *
+ * Where two directions both qualify — a diagonal fling in a deck that takes
+ * all four — the one carried furthest wins, so the card goes where it was
+ * actually thrown.
+ */
+export declare function releasedDirection(allowed: readonly StackCardDirection[], x: number, y: number, velocityX: number, velocityY: number, width: number, height: number, threshold: number): StackCardDirection | null;
+/**
+ * Where a card is animated to on its way off.
+ *
+ * The off-axis is carried rather than zeroed, so a card thrown up and to the
+ * right leaves up and to the right. Zeroing it straightens the throw out
+ * mid-flight, which is the one moment the animation is most obviously not the
+ * finger any more.
+ */
+export declare function exitTarget(direction: StackCardDirection, width: number, height: number, x: number, y: number): {
+    x: number;
+    y: number;
+};
+/**
+ * How long a card takes to leave, in milliseconds.
+ *
+ * Long enough that the card starts out at the speed the finger let go of it.
+ * An ease-out starts `slope` times faster than its average, so covering
+ * `distance` from `speed` takes `slope × distance / speed`. Faster than that
+ * and the card leaps ahead of the finger; slower, and it drags as though it
+ * had caught on something.
+ *
+ * Clamped both ways. A hard flick would otherwise be gone in a frame or two,
+ * which reads as the card vanishing rather than being thrown; and a card
+ * released barely moving would drift off for a second. `speed` is only what
+ * was travelling toward the way out — none at all, for a card sent by a
+ * button, gives the longest.
+ */
+export declare function exitDuration(distance: number, speed: number, slope: number, shortest: number, longest: number): number;
+/**
+ * Which way the card pivots, from where it was taken hold of.
+ *
+ * A card pulled by its top corner turns one way and one pulled by its bottom
+ * corner turns the other, because that is what a piece of card on a table
+ * does. Read once when the finger lands and held for the whole gesture: a
+ * lever that changed sign mid-drag would flip the card over in the hand.
+ */
+export declare function lever(grabY: number, height: number): number;
+/**
+ * The card's tilt, in degrees.
+ *
+ * Measured against half the card rather than all of it: a card commits at
+ * roughly a third of its width, and scaled across the full width the tilt at
+ * the moment of release would be a couple of degrees — present in the numbers
+ * and invisible on the screen.
+ */
+export declare function tiltAngle(x: number, width: number, maxTilt: number, pivot: number): number;
+/**
+ * Where a card sits in the pile, counting the top one as 0, once the drag on
+ * the card in front of it is taken into account.
+ *
+ * This is what makes the pile continuous across a dismissal. By the time the
+ * top card has been carried far enough to leave, the one behind it has already
+ * arrived at the top position — so when it becomes the top card there is
+ * nothing left to move.
+ */
+export declare function effectiveDepth(depth: number, release: number): number;
+/**
+ * How opaque a card at a given depth is drawn, where `visible` is how many the
+ * pile shows behind its top card.
+ *
+ * One more card is kept than the pile shows, and this is what fades it in: one
+ * place further back than the pile goes it is invisible, and it reaches full
+ * strength exactly as it takes the last visible place. Without it a card
+ * appears out of nothing at the bottom of the pile every time one leaves the
+ * top.
+ */
+export declare function depthOpacity(depth: number, visible: number): number;
+//# sourceMappingURL=stack-card-geometry.d.ts.map

package/lib/typescript/src/components/stack-card/stack-card-geometry.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"stack-card-geometry.d.ts","sourceRoot":"","sources":["../../../../../src/components/stack-card/stack-card-geometry.ts"],"names":[],"mappings":"AAAA;;;;;;;GAOG;AAEH,wCAAwC;AACxC,MAAM,MAAM,kBAAkB,GAAG,MAAM,GAAG,OAAO,GAAG,IAAI,GAAG,MAAM,CAAC;AAElE;;;;;;GAMG;AACH,eAAO,MAAM,YAAY,QAAQ,CAAC;AAElC;;;;;GAKG;AACH,wBAAgB,OAAO,CAAC,QAAQ,EAAE,MAAM,EAAE,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAcvE;AAED;;;;;;;GAOG;AACH,wBAAgB,MAAM,CAAC,MAAM,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,MAAM,CAIzE;AAED,+EAA+E;AAC/E,wBAAgB,WAAW,CAAC,IAAI,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,GAAG,MAAM,CAGnE;AAED;;;;;;GAMG;AACH,wBAAgB,iBAAiB,CAC/B,SAAS,EAAE,kBAAkB,EAC7B,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,MAAM,GAChB,MAAM,CAOR;AAED,oEAAoE;AACpE,wBAAgB,eAAe,CAC7B,OAAO,EAAE,SAAS,kBAAkB,EAAE,EACtC,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,MAAM,GAChB,MAAM,CAUR;AAED;;;;;;;;;;GAUG;AACH,wBAAgB,iBAAiB,CAC/B,OAAO,EAAE,SAAS,kBAAkB,EAAE,EACtC,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,EACT,SAAS,EAAE,MAAM,EACjB,SAAS,EAAE,MAAM,EACjB,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,SAAS,EAAE,MAAM,GAChB,kBAAkB,GAAG,IAAI,CAgC3B;AAQD;;;;;;;GAOG;AACH,wBAAgB,UAAU,CACxB,SAAS,EAAE,kBAAkB,EAC7B,KAAK,EAAE,MAAM,EACb,MAAM,EAAE,MAAM,EACd,CAAC,EAAE,MAAM,EACT,CAAC,EAAE,MAAM,GACR;IAAE,CAAC,EAAE,MAAM,CAAC;IAAC,CAAC,EAAE,MAAM,CAAA;CAAE,CAY1B;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,YAAY,CAC1B,QAAQ,EAAE,MAAM,EAChB,KAAK,EAAE,MAAM,EACb,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,MAAM,EAChB,OAAO,EAAE,MAAM,GACd,MAAM,CAKR;AAED;;;;;;;GAOG;AACH,wBAAgB,KAAK,CAAC,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,CAI3D;AAED;;;;;;;GAOG;AACH,wBAAgB,SAAS,CAAC,CAAC,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,GAAG,MAAM,CAK1F;AAED;;;;;;;;GAQG;AACH,wBAAgB,cAAc,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAGrE;AAED;;;;;;;;;GASG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,GAAG,MAAM,CAGnE"}

package/lib/typescript/src/index.d.ts

@@ -126,6 +126,7 @@ export { Sortable, reorderItems, useSortableItem, type SortableProps, type Sorta
 export { Spinner, type SpinnerProps } from './components/spinner/index.js';
 export { Splitter, type SplitterProps, type SplitterPanelProps, type SplitterHandleProps, type SplitterOrientation, type SplitterConstraint, } from './components/splitter/index.js';
 export { SplitView, useSplitView, type SplitViewProps, type SplitViewPaneProps, type SplitViewDragAreaProps, type SplitViewHandleProps, type SplitViewVariant, } from './components/split-view/index.js';
+export { StackCard, useStackCard, type StackCardProps, type StackCardHandle, type StackCardCardProps, type StackCardStampProps, type StackCardEmptyProps, type StackCardActionsProps, type StackCardActionProps, type StackCardDirection, type StackCardLayout, type StackCardStampColor, } from './components/stack-card/index.js';
 export { Steps, type StepsProps, type StepsItemProps, type StepsTriggerProps, type StepsIndicatorProps, type StepsSeparatorProps, type StepState, type StepsOrientation, } from './components/steps/index.js';
 export { Surface, type SurfaceProps } from './components/surface/index.js';
 export { Swipe, useSwipeGroup, type SwipeProps, type SwipeGroupProps, type SwipePanelProps, type SwipeActionProps, type SwipeActionColor, type SwipeOpenSide, type SwipeHandle, } from './components/swipe/index.js';