react-component-kit-ui 0.0.0-stage → 0.1.0

package/dist/types/components/lib/data/PriceCompareTable.d.ts

@@ -0,0 +1,6 @@
+import './PriceCompareTable.css';
+/** PriceCompareTable */
+export interface PriceCompareTableProps {
+}
+export declare function PriceCompareTable({}: PriceCompareTableProps): import("react").JSX.Element;
+export default PriceCompareTable;

package/dist/types/components/lib/data/ProgressListSmall.d.ts

@@ -0,0 +1,6 @@
+import './ProgressListSmall.css';
+/** ProgressListSmall */
+export interface ProgressListSmallProps {
+}
+export declare function ProgressListSmall({}: ProgressListSmallProps): import("react").JSX.Element;
+export default ProgressListSmall;

package/dist/types/components/lib/data/RatingBreakdownBar.d.ts

@@ -0,0 +1,6 @@
+import './RatingBreakdownBar.css';
+/** RatingBreakdownBar */
+export interface RatingBreakdownBarProps {
+}
+export declare function RatingBreakdownBar({}: RatingBreakdownBarProps): import("react").JSX.Element;
+export default RatingBreakdownBar;

package/dist/types/components/lib/data/SparklineStatCard.d.ts

@@ -0,0 +1,6 @@
+import './SparklineStatCard.css';
+/** SparklineStatCard */
+export interface SparklineStatCardProps {
+}
+export declare function SparklineStatCard({}: SparklineStatCardProps): import("react").JSX.Element;
+export default SparklineStatCard;

package/dist/types/components/lib/data/StatsGridDashboard.d.ts

@@ -0,0 +1,6 @@
+import './StatsGridDashboard.css';
+/** StatsGridDashboard */
+export interface StatsGridDashboardProps {
+}
+export declare function StatsGridDashboard({}: StatsGridDashboardProps): import("react").JSX.Element;
+export default StatsGridDashboard;

package/dist/types/components/lib/data/StatusTimelineFeed.d.ts

@@ -0,0 +1,16 @@
+import './StatusTimelineFeed.css';
+/**
+ * StatusTimelineFeed — Chronological event audit feed with status icons, timestamps, and detail lines.
+ *
+ * @param {Array<{title: string, desc: string, time: string, status: 'done' | 'active' | 'pending'}>} events - Timeline events.
+ */
+export interface StatusTimelineFeedProps {
+    events?: Array<{
+        title: string;
+        desc: string;
+        time: string;
+        status: 'done' | 'active' | 'pending';
+    }>;
+}
+export declare function StatusTimelineFeed({ events, }: StatusTimelineFeedProps): import("react").JSX.Element;
+export default StatusTimelineFeed;

package/dist/types/components/lib/data/StepperDataVertical.d.ts

@@ -0,0 +1,6 @@
+import './StepperDataVertical.css';
+/** StepperDataVertical */
+export interface StepperDataVerticalProps {
+}
+export declare function StepperDataVertical({}: StepperDataVerticalProps): import("react").JSX.Element;
+export default StepperDataVertical;

package/dist/types/components/lib/data/TagCloudData.d.ts

@@ -0,0 +1,6 @@
+import './TagCloudData.css';
+/** TagCloudData */
+export interface TagCloudDataProps {
+}
+export declare function TagCloudData({}: TagCloudDataProps): import("react").JSX.Element;
+export default TagCloudData;

package/dist/types/components/lib/data/TimelineHorizSteps.d.ts

@@ -0,0 +1,6 @@
+import './TimelineHorizSteps.css';
+/** TimelineHorizSteps */
+export interface TimelineHorizStepsProps {
+}
+export declare function TimelineHorizSteps({}: TimelineHorizStepsProps): import("react").JSX.Element;
+export default TimelineHorizSteps;

package/dist/types/components/lib/data/TreeItemInteractive.d.ts

@@ -0,0 +1,6 @@
+import './TreeItemInteractive.css';
+/** TreeItemInteractive */
+export interface TreeItemInteractiveProps {
+}
+export declare function TreeItemInteractive({}: TreeItemInteractiveProps): import("react").JSX.Element;
+export default TreeItemInteractive;

package/dist/types/components/lib/data/UserDirectoryItem.d.ts

@@ -0,0 +1,6 @@
+import './UserDirectoryItem.css';
+/** UserDirectoryItem */
+export interface UserDirectoryItemProps {
+}
+export declare function UserDirectoryItem({}: UserDirectoryItemProps): import("react").JSX.Element;
+export default UserDirectoryItem;

package/dist/types/components/lib/data/VerticalTimeline.d.ts

@@ -0,0 +1,6 @@
+import './VerticalTimeline.css';
+/** VerticalTimeline */
+export interface VerticalTimelineProps {
+}
+export declare function VerticalTimeline({}: VerticalTimelineProps): import("react").JSX.Element;
+export default VerticalTimeline;

package/dist/types/components/lib/data/index.d.ts

@@ -0,0 +1,23 @@
+export { default as AccordionGroupGlass } from './AccordionGroupGlass';
+export { default as AvatarGroupStack } from './AvatarGroupStack';
+export { default as CalendarGridView } from './CalendarGridView';
+export { default as DataChipsGroup } from './DataChipsGroup';
+export { default as DescriptionListHoriz } from './DescriptionListHoriz';
+export { default as FileTreeView } from './FileTreeView';
+export { default as GanttChartMinimal } from './GanttChartMinimal';
+export { default as GlassTable } from './GlassTable';
+export { default as KeyValuePillGroup } from './KeyValuePillGroup';
+export { default as PriceCompareTable } from './PriceCompareTable';
+export { default as ProgressListSmall } from './ProgressListSmall';
+export { default as RatingBreakdownBar } from './RatingBreakdownBar';
+export { default as SparklineStatCard } from './SparklineStatCard';
+export { default as StatsGridDashboard } from './StatsGridDashboard';
+export { default as StepperDataVertical } from './StepperDataVertical';
+export { default as TagCloudData } from './TagCloudData';
+export { default as TimelineHorizSteps } from './TimelineHorizSteps';
+export { default as TreeItemInteractive } from './TreeItemInteractive';
+export { default as UserDirectoryItem } from './UserDirectoryItem';
+export { default as VerticalTimeline } from './VerticalTimeline';
+export { default as MetricComparisonRow } from './MetricComparisonRow';
+export { default as ActivityHeatmapGrid } from './ActivityHeatmapGrid';
+export { default as StatusTimelineFeed } from './StatusTimelineFeed';

package/dist/types/components/lib/ecommerce/CartDrawer.d.ts

@@ -0,0 +1,43 @@
+import type { CartItem } from './types';
+import './CartDrawer.css';
+/**
+ * CartDrawer — Slide-in cart with line items, quantity steppers, remove, free-shipping
+ * progress, subtotal and checkout button. Reads and writes the shared cart store.
+ *
+ * Opens on the `ack:cart-open` event (dispatched by StoreHeader's cart button and by
+ * add-to-cart buttons) or on any `[data-cart-open]` element outside a StoreHeader.
+ *
+ * @param {string} cartKey - Cart storage key. Default 'ack-cart'.
+ * @param {string} title - Drawer heading. Default 'Your cart'.
+ * @param {string} checkoutHref - Checkout page URL. Default '#'.
+ * @param {string} checkoutLabel - Checkout button label. Default 'Checkout'.
+ * @param {string} currency - ISO currency. Default 'USD'.
+ * @param {string} locale - Number format locale. Default 'en-US'.
+ * @param {number} freeShippingThreshold - Shows progress towards free shipping (0 hides it). Default 75.
+ * @param {CartItem[]} demoItems - Seeds an empty cart once (demo stores only).
+ * @param {boolean} inline - Render as an always-visible panel instead of an overlay (docs/previews). Default false.
+ * @param {string} side - Slide-in side (right|left). Default 'right'.
+ * @param {string} size - Panel width (sm|md|lg). Default 'md'.
+ * @param {string} id - Base id for inner elements (unique per page). Default 'cart-drawer'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: modal dialog with focus trap, Escape to close, focus returned to the trigger,
+ * background scroll locked; totals are announced through a polite live region.
+ */
+export interface CartDrawerProps {
+    cartKey?: string;
+    title?: string;
+    checkoutHref?: string;
+    checkoutLabel?: string;
+    currency?: string;
+    locale?: string;
+    freeShippingThreshold?: number;
+    demoItems?: CartItem[];
+    inline?: boolean;
+    side?: 'right' | 'left';
+    size?: 'sm' | 'md' | 'lg';
+    id?: string;
+    className?: string;
+}
+export declare function CartDrawer({ cartKey, title, checkoutHref, checkoutLabel, currency, locale, freeShippingThreshold, demoItems, inline, side, size, id, className, }: CartDrawerProps): import("react").JSX.Element;
+export default CartDrawer;

package/dist/types/components/lib/ecommerce/CartPageList.d.ts

@@ -0,0 +1,36 @@
+import type { CartItem } from './types';
+import './CartPageList.css';
+/**
+ * CartPageList — Full shopping-bag page: line items with quantity and remove, gift note,
+ * free-shipping progress and a summary card with the checkout button. Reads the cart store live.
+ *
+ * @param {string} cartKey - Cart storage key. Default 'ack-cart'.
+ * @param {string} title - Page heading. Default 'Your bag'.
+ * @param {string} checkoutHref - Checkout URL. Default '#'.
+ * @param {string} continueHref - "Continue shopping" URL. Default '#'.
+ * @param {number} freeShippingThreshold - Free shipping from this subtotal (0 hides it). Default 150.
+ * @param {number} shippingFlat - Shipping estimate below the threshold. Default 8.
+ * @param {string} currency - ISO currency. Default 'EUR'.
+ * @param {string} locale - Number format locale. Default 'en-GB'.
+ * @param {CartItem[]} demoItems - Seeds an empty cart once (demos only).
+ * @param {string} variant - Style (editorial|card). Default 'editorial'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: one h1; the item list is a real list with labelled quantity buttons;
+ * totals are a polite live region; removing an item moves focus to the next row (or the heading).
+ */
+export interface CartPageListProps {
+    cartKey?: string;
+    title?: string;
+    checkoutHref?: string;
+    continueHref?: string;
+    freeShippingThreshold?: number;
+    shippingFlat?: number;
+    currency?: string;
+    locale?: string;
+    demoItems?: CartItem[];
+    variant?: 'editorial' | 'card';
+    className?: string;
+}
+export declare function CartPageList({ cartKey, title, checkoutHref, continueHref, freeShippingThreshold, shippingFlat, currency, locale, demoItems, variant, className, }: CartPageListProps): import("react").JSX.Element;
+export default CartPageList;

package/dist/types/components/lib/ecommerce/CartToast.d.ts

@@ -0,0 +1,34 @@
+import './CartToast.css';
+/**
+ * CartToast — Stacked live notifications for the shop: "Added to cart" (with a View cart
+ * action) whenever an add-to-cart button skips the drawer, plus any custom notice sent with
+ * `document.dispatchEvent(new CustomEvent('ack:notify', { detail: { title, text, tone } }))`.
+ *
+ * @param {string} cartKey - Only react to this cart. Default 'ack-cart'.
+ * @param {string} position - Screen corner (bottom-right|bottom-left|top-right|top-center). Default 'bottom-right'.
+ * @param {number} duration - Auto-dismiss delay in ms (paused on hover/focus). Default 4500.
+ * @param {number} max - Maximum toasts visible at once. Default 3.
+ * @param {string} addedTitle - Title for cart notices. Default 'Added to cart'.
+ * @param {string} actionLabel - Cart action label. Default 'View cart'.
+ * @param {boolean} always - Also toast when the drawer opens on add. Default false.
+ * @param {boolean} demo - Render one static example toast (docs/previews). Default false.
+ * @param {string} variant - Style (glass|solid). Default 'glass'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: polite live region (role="status"), every toast has a close button,
+ * timers pause while hovered or focused, motion is removed with prefers-reduced-motion.
+ */
+export interface CartToastProps {
+    cartKey?: string;
+    position?: 'bottom-right' | 'bottom-left' | 'top-right' | 'top-center';
+    duration?: number;
+    max?: number;
+    addedTitle?: string;
+    actionLabel?: string;
+    always?: boolean;
+    demo?: boolean;
+    variant?: 'glass' | 'solid';
+    className?: string;
+}
+export declare function CartToast({ cartKey, position, duration, max, addedTitle, actionLabel, always, demo, variant, className, }: CartToastProps): import("react").JSX.Element;
+export default CartToast;

package/dist/types/components/lib/ecommerce/CategoryTiles.d.ts

@@ -0,0 +1,32 @@
+import type { StoreCategory } from './types';
+import './CategoryTiles.css';
+type Tile = StoreCategory & {
+    href: string;
+    count?: number;
+};
+/**
+ * CategoryTiles — Grid of shop categories with illustration, item count and arrow link.
+ *
+ * @param {string} title - Section heading (optional). Default 'Shop by category'.
+ * @param {string} subtitle - Supporting copy (optional).
+ * @param {Array<StoreCategory & { href: string, count?: number }>} categories - Tiles to show.
+ * @param {number} columns - Desktop columns (2–6). Default 4.
+ * @param {string} variant - Tile style (glass|image|minimal). Default 'glass'.
+ * @param {string} size - Tile height (sm|md|lg). Default 'md'.
+ * @param {string} countLabel - Suffix after the count. Default 'products'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: each tile is a single link with a visible name; art is decorative.
+ */
+export interface CategoryTilesProps {
+    title?: string;
+    subtitle?: string;
+    categories?: Tile[];
+    columns?: number;
+    variant?: 'glass' | 'image' | 'minimal';
+    size?: 'sm' | 'md' | 'lg';
+    countLabel?: string;
+    className?: string;
+}
+export declare function CategoryTiles({ title, subtitle, categories, columns, variant, size, countLabel, className, }: CategoryTilesProps): import("react").JSX.Element;
+export default CategoryTiles;

package/dist/types/components/lib/ecommerce/CheckoutForm.d.ts

@@ -0,0 +1,44 @@
+import type { ShippingRate } from './types';
+import './CheckoutForm.css';
+/**
+ * CheckoutForm — One-page checkout: contact, delivery address, shipping method and payment,
+ * built from AnimatedInput, ModernSelect and CustomRadioGroup. Shows an order confirmation
+ * (AnimatedCheckmark) on submit and clears the cart.
+ *
+ * Pair it with OrderSummary: the shipping radios drive its totals and the pay button shows
+ * the live total. Replace the demo submit handler with your payment provider.
+ *
+ * @param {string} id - Form id. Default 'checkout'.
+ * @param {ShippingRate[]} shippingRates - Shipping options (must match OrderSummary).
+ * @param {number} freeShippingThreshold - Shows "Free" on the first rate above this subtotal. Default 75.
+ * @param {Array<{label: string, value: string}>} countries - Country select options.
+ * @param {string} cartKey - Cart storage key. Default 'ack-cart'.
+ * @param {string} currency - ISO currency. Default 'USD'.
+ * @param {string} locale - Number format locale. Default 'en-US'.
+ * @param {string} continueHref - "Continue shopping" link on the confirmation. Default '#'.
+ * @param {boolean} demo - Simulates payment and never sends data anywhere. Default true.
+ * @param {string} variant - Section style (cards|plain). Default 'cards'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: grouped fieldsets with legends, autocomplete hints on every field, native
+ * validation with focus moved to the first invalid field, confirmation heading receives focus.
+ * Emits `ack:order-placed` with `{ orderId, total }`.
+ */
+export interface CheckoutFormProps {
+    id?: string;
+    shippingRates?: ShippingRate[];
+    freeShippingThreshold?: number;
+    countries?: Array<{
+        label: string;
+        value: string;
+    }>;
+    cartKey?: string;
+    currency?: string;
+    locale?: string;
+    continueHref?: string;
+    demo?: boolean;
+    variant?: 'cards' | 'plain';
+    className?: string;
+}
+export declare function CheckoutForm({ id, shippingRates, freeShippingThreshold, countries, cartKey, currency, locale, continueHref, demo, variant, className, }: CheckoutFormProps): import("react").JSX.Element;
+export default CheckoutForm;

package/dist/types/components/lib/ecommerce/CountdownBanner.d.ts

@@ -0,0 +1,38 @@
+import './CountdownBanner.css';
+/**
+ * CountdownBanner — Live sale countdown (days · hours · minutes · seconds) with title,
+ * copy and CTA; switches to an "ended" message when the time runs out.
+ *
+ * @param {string} endsAt - ISO date the offer ends. When omitted, `hours` is used.
+ * @param {number} hours - Rolling offer length in hours, counted from the visitor's first view (stored in localStorage). Default 48.
+ * @param {string} eyebrow - Small label. Default 'Flash sale'.
+ * @param {string} title - Headline. Default 'Up to 30% off the Storm collection'.
+ * @param {string} text - Supporting copy.
+ * @param {{label: string, href: string}} cta - Call to action.
+ * @param {string} endedText - Message shown after the deadline. Default 'This offer has ended — new deals every Friday.'
+ * @param {string} storageKey - localStorage key for the rolling deadline. Default 'ack-countdown'.
+ * @param {string} variant - Style (glow|bar|card). Default 'glow'.
+ * @param {string} size - Density (sm|md|lg). Default 'md'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: the ticking digits are aria-hidden; a visually hidden sentence with the remaining
+ * time updates once a minute in a polite live region (no per-second announcements).
+ */
+export interface CountdownBannerProps {
+    endsAt?: string;
+    hours?: number;
+    eyebrow?: string;
+    title?: string;
+    text?: string;
+    cta?: {
+        label: string;
+        href: string;
+    };
+    endedText?: string;
+    storageKey?: string;
+    variant?: 'glow' | 'bar' | 'card';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function CountdownBanner({ endsAt, hours, eyebrow, title, text, cta, endedText, storageKey, variant, size, className, }: CountdownBannerProps): import("react").JSX.Element;
+export default CountdownBanner;

package/dist/types/components/lib/ecommerce/FilterBar.d.ts

@@ -0,0 +1,48 @@
+import './FilterBar.css';
+/**
+ * FilterBar — Horizontal catalogue toolbar: category chips, a "Refine" panel (price, colour,
+ * availability), sort select and a live count. Filters any grid of product cards instantly.
+ *
+ * @param {string} target - id of the product grid. Default 'product-grid'.
+ * @param {Array<{id: string, name: string, count?: number}>} categories - Category chips.
+ * @param {string[]} selected - Pre-selected category ids (also read from `?category=`).
+ * @param {number} maxPrice - Upper bound of the price slider. Default 400.
+ * @param {Array<{name: string, hex: string}>} colors - Colour options.
+ * @param {number} total - Initial product count. Default 0.
+ * @param {string} allLabel - Label of the "all" chip. Default 'All'.
+ * @param {string} countLabel - Text after the count. Default 'products'.
+ * @param {string} currency - ISO currency. Default 'EUR'.
+ * @param {string} locale - Number format locale. Default 'en-GB'.
+ * @param {boolean} sticky - Stick under the header while scrolling. Default true.
+ * @param {string} variant - Style (line|filled). Default 'line'.
+ * @param {string} id - Base id. Default 'filter-bar'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: chips are toggle buttons (aria-pressed); "Refine" is a disclosure that closes
+ * with Escape; the count is a polite live region; all controls are native inputs.
+ */
+export interface FilterBarProps {
+    target?: string;
+    categories?: Array<{
+        id: string;
+        name: string;
+        count?: number;
+    }>;
+    selected?: string[];
+    maxPrice?: number;
+    colors?: Array<{
+        name: string;
+        hex: string;
+    }>;
+    total?: number;
+    allLabel?: string;
+    countLabel?: string;
+    currency?: string;
+    locale?: string;
+    sticky?: boolean;
+    variant?: 'line' | 'filled';
+    id?: string;
+    className?: string;
+}
+export declare function FilterBar({ target, categories, selected, maxPrice, colors, total, allLabel, countLabel, currency, locale, sticky, variant, id, className, }: FilterBarProps): import("react").JSX.Element;
+export default FilterBar;

package/dist/types/components/lib/ecommerce/FilterSidebar.d.ts

@@ -0,0 +1,42 @@
+import './FilterSidebar.css';
+/**
+ * FilterSidebar — Catalog filters (category, max price, colour, rating, stock) that filter
+ * and sort a ProductGrid instantly in the browser. Collapses behind a "Filters" button on mobile.
+ *
+ * @param {string} target - id of the ProductGrid to filter. Default 'product-grid'.
+ * @param {string} id - Form id; ProductToolbar's sort select uses `${id}-sort`. Default 'catalog-filters'.
+ * @param {Array<{id: string, name: string, count?: number}>} categories - Category checkboxes.
+ * @param {string[]} selected - Pre-checked category ids (also read from `?category=` in the URL).
+ * @param {number} maxPrice - Upper bound of the price slider. Default 300.
+ * @param {Array<{name: string, hex: string}>} colors - Colour swatches.
+ * @param {string} currency - ISO currency. Default 'USD'.
+ * @param {string} locale - Number format locale. Default 'en-US'.
+ * @param {string} variant - Style (glass|plain). Default 'glass'.
+ * @param {string} size - Density (sm|md). Default 'md'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: native form controls in fieldsets with legends; result count is announced
+ * by ProductToolbar's live region; the mobile toggle is a disclosure button.
+ */
+export interface FilterSidebarProps {
+    target?: string;
+    id?: string;
+    categories?: Array<{
+        id: string;
+        name: string;
+        count?: number;
+    }>;
+    selected?: string[];
+    maxPrice?: number;
+    colors?: Array<{
+        name: string;
+        hex: string;
+    }>;
+    currency?: string;
+    locale?: string;
+    variant?: 'glass' | 'plain';
+    size?: 'sm' | 'md';
+    className?: string;
+}
+export declare function FilterSidebar({ target, id, categories, selected, maxPrice, colors, currency, locale, variant, size, className, }: FilterSidebarProps): import("react").JSX.Element;
+export default FilterSidebar;

package/dist/types/components/lib/ecommerce/LiveActivityToast.d.ts

@@ -0,0 +1,43 @@
+import './LiveActivityToast.css';
+interface Activity {
+    name: string;
+    city: string;
+    product: string;
+    href?: string;
+    icon?: string;
+    hue?: number;
+    ago: string;
+}
+/**
+ * LiveActivityToast — Rotating social-proof notice ("Lucía in Madrid bought Aurora Headphones
+ * · 3 min ago") that slides in, waits and hides, cycling through `items`.
+ *
+ * @param {Array} items - `{ name, city, product, href?, icon?, hue?, ago }` entries to cycle through.
+ * @param {string} verb - Action text between person and product. Default 'just bought'.
+ * @param {number} interval - Time between notices in ms. Default 9000.
+ * @param {number} visibleFor - How long each notice stays in ms. Default 5000.
+ * @param {number} delay - Wait before the first notice in ms. Default 4000.
+ * @param {string} position - Corner (bottom-left|bottom-right). Default 'bottom-left'.
+ * @param {string} storageKey - sessionStorage key that remembers "stop showing". Default 'ack-activity-off'.
+ * @param {boolean} demo - Render statically with the first item (docs/previews). Default false.
+ * @param {string} variant - Style (glass|solid). Default 'glass'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: not announced by screen readers (it is promotional, aria-live="off"), never
+ * steals focus, has a close button that stops it for the session, pauses on hover/focus and
+ * when the tab is hidden; respects prefers-reduced-motion.
+ */
+export interface LiveActivityToastProps {
+    items?: Activity[];
+    verb?: string;
+    interval?: number;
+    visibleFor?: number;
+    delay?: number;
+    position?: 'bottom-left' | 'bottom-right';
+    storageKey?: string;
+    demo?: boolean;
+    variant?: 'glass' | 'solid';
+    className?: string;
+}
+export declare function LiveActivityToast({ items, verb, interval, visibleFor, delay, position, storageKey, demo, variant, className, }: LiveActivityToastProps): import("react").JSX.Element;
+export default LiveActivityToast;

package/dist/types/components/lib/ecommerce/OrderSummary.d.ts

@@ -0,0 +1,39 @@
+import type { ShippingRate } from './types';
+import './OrderSummary.css';
+/**
+ * OrderSummary — Checkout sidebar: cart lines, promo code, subtotal, shipping, tax and total.
+ * Reads the cart store live and follows the shipping method chosen in CheckoutForm.
+ *
+ * @param {string} title - Heading. Default 'Order summary'.
+ * @param {string} cartKey - Cart storage key. Default 'ack-cart'.
+ * @param {ShippingRate[]} shippingRates - Rates matching CheckoutForm's `shipping` radios.
+ * @param {number} freeShippingThreshold - Subtotal that makes the first rate free (0 disables). Default 75.
+ * @param {number} taxRate - Tax as a fraction (0.08 = 8%). Default 0.08.
+ * @param {Record<string, number>} promoCodes - Code → percent discount. Default { REACT10: 10 }.
+ * @param {string} editHref - "Edit cart" link (optional).
+ * @param {string} currency - ISO currency. Default 'USD'.
+ * @param {string} locale - Number format locale. Default 'en-US'.
+ * @param {boolean} sticky - Stick while the form scrolls (desktop). Default true.
+ * @param {string} variant - Style (glass|plain). Default 'glass'.
+ * @param {string} className - Extra class.
+ *
+ * Emits `ack:totals` on document with `{ subtotal, discount, shipping, tax, total, formatted }`.
+ *
+ * Accessibility: the totals block is a polite live region; promo feedback is a status message.
+ */
+export interface OrderSummaryProps {
+    title?: string;
+    cartKey?: string;
+    shippingRates?: ShippingRate[];
+    freeShippingThreshold?: number;
+    taxRate?: number;
+    promoCodes?: Record<string, number>;
+    editHref?: string;
+    currency?: string;
+    locale?: string;
+    sticky?: boolean;
+    variant?: 'glass' | 'plain';
+    className?: string;
+}
+export declare function OrderSummary({ title, cartKey, shippingRates, freeShippingThreshold, taxRate, promoCodes, editHref, currency, locale, sticky, variant, className, }: OrderSummaryProps): import("react").JSX.Element;
+export default OrderSummary;

package/dist/types/components/lib/ecommerce/ProductBuyBox.d.ts

@@ -0,0 +1,39 @@
+import type { Product } from './types';
+import './ProductBuyBox.css';
+/**
+ * ProductBuyBox — Product detail purchase panel: title, rating, price, colour/size pickers,
+ * quantity (StepperInput), add to cart, buy now, guarantees and expandable details.
+ *
+ * @param {Product} product - Product data. A demo product is used by default.
+ * @param {string} categoryLabel - Eyebrow text (e.g. the category name).
+ * @param {string} checkoutHref - Where "Buy now" goes after adding the item. Default '#'.
+ * @param {Array<{title: string, body: string}>} details - Expandable sections (materials, shipping…).
+ * @param {string} currency - ISO currency. Default 'USD'.
+ * @param {string} locale - Number format locale. Default 'en-US'.
+ * @param {string} cartKey - Cart storage key. Default 'ack-cart'.
+ * @param {string} id - Base id for inner controls. Default 'buy-box'.
+ * @param {string} variant - Style (plain|glass). Default 'plain'.
+ * @param {string} size - Type scale (md|lg). Default 'md'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: one h1 with the product name; pickers are radio groups; details use native
+ * <details>/<summary>; sold-out state disables the buttons and says so in text.
+ */
+export interface ProductBuyBoxProps {
+    product?: Product;
+    categoryLabel?: string;
+    checkoutHref?: string;
+    details?: Array<{
+        title: string;
+        body: string;
+    }>;
+    currency?: string;
+    locale?: string;
+    cartKey?: string;
+    id?: string;
+    variant?: 'plain' | 'glass';
+    size?: 'md' | 'lg';
+    className?: string;
+}
+export declare function ProductBuyBox({ product, categoryLabel, checkoutHref, details, currency, locale, cartKey, id, variant, size, className, }: ProductBuyBoxProps): import("react").JSX.Element;
+export default ProductBuyBox;

package/dist/types/components/lib/ecommerce/ProductCardMinimal.d.ts

@@ -0,0 +1,38 @@
+import type { Product } from './types';
+import './ProductCardMinimal.css';
+/**
+ * ProductCardMinimal — Editorial product card: tall media that swaps to a second view on hover,
+ * quick-add size buttons, name, price and colour count. Square corners, typography-led.
+ *
+ * @param {Product} product - Product data. A demo product is used by default.
+ * @param {string} href - Product page URL. Default '#'.
+ * @param {number} index - Optional catalogue number shown as "N° 01".
+ * @param {string} currency - ISO currency. Default 'EUR'.
+ * @param {string} locale - Number format locale. Default 'en-GB'.
+ * @param {string} cartKey - Cart storage key. Default 'ack-cart'.
+ * @param {boolean} quickAdd - Show quick-add (sizes, or a single "Add" button). Default true.
+ * @param {string} ratio - Media aspect ratio. Default '3 / 4'.
+ * @param {string} variant - Style (plain|framed). Default 'plain'.
+ * @param {string} size - Type scale (sm|md|lg). Default 'md'.
+ * @param {string} headingLevel - Title element (h2|h3|h4). Default 'h3'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: the title is a stretched link; quick-add buttons sit above it with their own
+ * labels ("Add size M"), are reachable by keyboard and appear on focus as well as hover.
+ */
+export interface ProductCardMinimalProps {
+    product?: Product;
+    href?: string;
+    index?: number;
+    currency?: string;
+    locale?: string;
+    cartKey?: string;
+    quickAdd?: boolean;
+    ratio?: string;
+    variant?: 'plain' | 'framed';
+    size?: 'sm' | 'md' | 'lg';
+    headingLevel?: 'h2' | 'h3' | 'h4';
+    className?: string;
+}
+export declare function ProductCardMinimal({ product, href, index, currency, locale, cartKey, quickAdd, ratio, variant, size, headingLevel, className, }: ProductCardMinimalProps): import("react").JSX.Element;
+export default ProductCardMinimal;

package/dist/types/components/lib/ecommerce/ProductGallery.d.ts

@@ -0,0 +1,29 @@
+import './ProductGallery.css';
+/**
+ * ProductGallery — Product image viewer with a large stage and thumbnail rail.
+ * Works with real photos (`images`) or generates several illustrated "angles".
+ *
+ * @param {string[]} images - Photo URLs. When empty, illustrated views are generated.
+ * @param {string} alt - Alt text base for photos. Default 'Product photo'.
+ * @param {string} icon - Illustration for generated views. Default 'headphones'.
+ * @param {number} hue - Backdrop hue for generated views. Default 38.
+ * @param {number} views - Number of generated views (2–5). Default 4.
+ * @param {string} layout - Thumbnail position (bottom|side). Default 'side'.
+ * @param {string} size - Stage ratio preset (sm|md|lg). Default 'md'.
+ * @param {string} className - Extra class.
+ *
+ * Accessibility: thumbnails are buttons with aria-pressed and labels; arrow keys move
+ * between thumbnails; the stage announces the current view number.
+ */
+export interface ProductGalleryProps {
+    images?: string[];
+    alt?: string;
+    icon?: string;
+    hue?: number;
+    views?: number;
+    layout?: 'bottom' | 'side';
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+}
+export declare function ProductGallery({ images, alt, icon, hue, views, layout, size, className, }: ProductGalleryProps): import("react").JSX.Element;
+export default ProductGallery;