@cloudgrid-io/ui 0.31.2 → 0.31.4

package/dist/blocks/showcase-scroll.d.ts

@@ -0,0 +1,103 @@
+import * as React from "react";
+/**
+ * The sign-in showcase (#283): the purple panel filled with scrolling columns of
+ * the website's creations, with each card's numbers on hover.
+ *
+ * Ported from the founder-approved v3 mock (`frontend-brain/mocks/showcase-scroll.html`,
+ * 2026-10-06) with the founder's chosen settings: continuous motion at 46 px/s, the
+ * middle column at 80% of that for a slight parallax, hover pauses ITS column only,
+ * no dimming of the other cards, an edge fade, and `prefers-reduced-motion` static.
+ * The mock's controls and its step-and-hold mode are not here.
+ *
+ * ## Motion
+ *
+ * Pure CSS. Each column's track holds N identical copies of the column's cards and
+ * the keyframes move it by exactly one copy, written as `-100% / N` of the track's own
+ * height, so the loop is seamless by construction, at any width, with no measured
+ * pixel in the geometry. Columns alternate: up, down, up.
+ *
+ * Only the DURATION is measured, because px/s is a length over a time and CSS cannot
+ * divide one by the other: one copy's height over the speed. Until that measurement
+ * lands the tracks hold their first frame (paused), so a server render, the first
+ * paint and hydration all show the same picture and nothing jumps when motion starts.
+ *
+ * Each column opens staggered: column one's first card at the 32px padding line,
+ * column two half a landscape card higher, column three a third higher, so the
+ * masonry reads staggered from the first frame and no column opens on a cut card.
+ * That offset is CSS too (`75cqw` is a 4:3 card's height in a column that is a
+ * size container).
+ *
+ * ## Breakpoints
+ *
+ * Three columns when the panel is at least 544px wide, two below. 544 is not a round
+ * number on purpose: the Console's sign-in shell gives this panel 45% of the window
+ * minus a 16px inset either side, which is exactly 544 at 1280, the shell's `xl`.
+ * So a container query on the panel switches at the same window width the shell's
+ * media query used to, and the block still works at any width somewhere else.
+ * Hiding the panel on small screens stays the shell's business.
+ *
+ * The two- and three-column deals are both rendered and the container query shows
+ * one. That keeps the server render right at every width. Both deals hold the same
+ * 19 pictures, so the hidden one costs DOM, not bytes.
+ *
+ * ## Pictures
+ *
+ * A package has no public URL, so the block does not decide one. The 19 default
+ * pictures ship as files, `@cloudgrid-io/ui/brand/showcase/<slug>.webp`, already
+ * cropped to their card's shape, and the consumer says where they are served:
+ * `resolveSrc(card)`, or a `src` on each card. In a Next app that is a static import
+ * per file (hashed, cached forever, copied out of node_modules by the build). Not
+ * inlined as data URIs, unlike `EmptyCreations`' four thumbnails: that was 13 KB,
+ * this is 205 KB, and base64 in a JS chunk would cost 270 KB on the first page a
+ * signed-out person loads, uncacheable apart from the code around it.
+ *
+ * ## Decorative
+ *
+ * The whole panel is `aria-hidden`, every picture has `alt=""`, and nothing in it is
+ * focusable. The numbers are hover-only and are the website's placeholders.
+ */
+/** The three card shapes, each a crop the picture files are already cut to. */
+type ShowcaseScrollShape = "landscape" | "square" | "portrait";
+type ShowcaseScrollCard = {
+    /** Stable key, and the file name under `brand/showcase/` without `.webp`. */
+    slug: string;
+    /** The creation's name. Not shown: the card is a picture of it. */
+    name: string;
+    views: number;
+    reactions: number;
+    /** landscape 4:3, square 1:1, portrait 3:4. */
+    shape: ShowcaseScrollShape;
+    /** The picture's URL. When absent, `resolveSrc` is asked. */
+    src?: string;
+};
+/**
+ * The website's 19 creations: the /thegrid ticker's twelve plus the home page's seven
+ * (`cloudgrid-landing` `preview/full-site` @ 2fa378b, `Ticker.astro`).
+ *
+ * THE NUMBERS ARE ILLUSTRATIVE. They are the website's placeholder figures, kept
+ * as the site has them; none of them is real usage data.
+ */
+declare const SHOWCASE_SCROLL_CARDS: readonly ShowcaseScrollCard[];
+/**
+ * The default cards dealt into columns BY HAND, as the mock deals them: light and
+ * dark cards alternate down each column, every column mixes the three shapes, and
+ * no card is in two columns. Used only with the default cards; an override is dealt
+ * round-robin.
+ */
+declare const SHOWCASE_SCROLL_COLUMNS: Readonly<Record<2 | 3, readonly (readonly string[])[]>>;
+/** The founder's speed, px/s, for the outer columns (2026-10-06). */
+declare const SHOWCASE_SCROLL_SPEED = 46;
+type ShowcaseScrollProps = Omit<React.ComponentProps<"section">, "children" | "ref"> & {
+    /** Replaces the default 19. An override is dealt into columns round-robin. */
+    cards?: readonly ShowcaseScrollCard[];
+    /** Where a card's picture is served, for a card with no `src` of its own. */
+    resolveSrc?: (card: ShowcaseScrollCard) => string | undefined;
+    /** px/s for the outer columns. The middle column runs at 80% of it. */
+    speed?: number;
+    /** Holds every column still on its current frame. */
+    paused?: boolean;
+};
+declare function ShowcaseScroll({ cards, resolveSrc, speed, paused, className, ...props }: ShowcaseScrollProps): React.JSX.Element;
+export { ShowcaseScroll, SHOWCASE_SCROLL_CARDS, SHOWCASE_SCROLL_COLUMNS, SHOWCASE_SCROLL_SPEED };
+export type { ShowcaseScrollCard, ShowcaseScrollShape, ShowcaseScrollProps };
+//# sourceMappingURL=showcase-scroll.d.ts.map

package/dist/blocks/showcase-scroll.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"showcase-scroll.d.ts","sourceRoot":"","sources":["../../src/blocks/showcase-scroll.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwDG;AAEH,+EAA+E;AAC/E,KAAK,mBAAmB,GAAG,WAAW,GAAG,QAAQ,GAAG,UAAU,CAAA;AAE9D,KAAK,kBAAkB,GAAG;IACxB,6EAA6E;IAC7E,IAAI,EAAE,MAAM,CAAA;IACZ,mEAAmE;IACnE,IAAI,EAAE,MAAM,CAAA;IACZ,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,MAAM,CAAA;IACjB,+CAA+C;IAC/C,KAAK,EAAE,mBAAmB,CAAA;IAC1B,6DAA6D;IAC7D,GAAG,CAAC,EAAE,MAAM,CAAA;CACb,CAAA;AAED;;;;;;GAMG;AACH,QAAA,MAAM,qBAAqB,EAAE,SAAS,kBAAkB,EAoBvD,CAAA;AAED;;;;;GAKG;AACH,QAAA,MAAM,uBAAuB,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,EAAE,SAAS,CAAC,SAAS,MAAM,EAAE,CAAC,EAAE,CAAC,CAUpF,CAAA;AAED,qEAAqE;AACrE,QAAA,MAAM,qBAAqB,KAAK,CAAA;AA+OhC,KAAK,mBAAmB,GAAG,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,SAAS,CAAC,EAAE,UAAU,GAAG,KAAK,CAAC,GAAG;IACrF,8EAA8E;IAC9E,KAAK,CAAC,EAAE,SAAS,kBAAkB,EAAE,CAAA;IACrC,6EAA6E;IAC7E,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,kBAAkB,KAAK,MAAM,GAAG,SAAS,CAAA;IAC7D,uEAAuE;IACvE,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,qDAAqD;IACrD,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AA4GD,iBAAS,cAAc,CAAC,EACtB,KAAK,EACL,UAAU,EACV,KAA6B,EAC7B,MAAc,EACd,SAAS,EACT,GAAG,KAAK,EACT,EAAE,mBAAmB,qBAoHrB;AA2DD,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,qBAAqB,EAAE,CAAA;AAChG,YAAY,EAAE,kBAAkB,EAAE,mBAAmB,EAAE,mBAAmB,EAAE,CAAA"}

package/dist/blocks/showcase-scroll.js

@@ -0,0 +1,432 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Panel } from "../ui/panel.js";
+import { ReactionsIcon, ViewsIcon } from "./icons.js";
+import { cn } from "../lib/cloudgrid-cn.js";
+/**
+ * The website's 19 creations: the /thegrid ticker's twelve plus the home page's seven
+ * (`cloudgrid-landing` `preview/full-site` @ 2fa378b, `Ticker.astro`).
+ *
+ * THE NUMBERS ARE ILLUSTRATIVE. They are the website's placeholder figures, kept
+ * as the site has them; none of them is real usage data.
+ */
+const SHOWCASE_SCROLL_CARDS = [
+    { slug: "space-today", name: "Space Today", shape: "square", views: 2481, reactions: 37 },
+    { slug: "sales-call-coach", name: "Sales Call Coach", shape: "landscape", views: 248, reactions: 25 },
+    { slug: "all-the-way-down", name: "All the Way Down", shape: "landscape", views: 1109, reactions: 18 },
+    { slug: "pricing-simulator", name: "Pricing Simulator", shape: "landscape", views: 186, reactions: 17 },
+    { slug: "fox-tales", name: "Fox Tales", shape: "square", views: 864, reactions: 52 },
+    { slug: "moon-run", name: "Moon Run", shape: "landscape", views: 1420, reactions: 110 },
+    { slug: "chess-puzzles", name: "Chess Puzzles", shape: "square", views: 318, reactions: 9 },
+    { slug: "campaign-brief-builder", name: "Campaign Brief Builder", shape: "landscape", views: 324, reactions: 38 },
+    { slug: "tour-poster", name: "Tour Poster", shape: "portrait", views: 1742, reactions: 64 },
+    { slug: "onboarding-guide", name: "Onboarding Guide", shape: "landscape", views: 412, reactions: 40 },
+    { slug: "operating-review", name: "Operating Review", shape: "square", views: 126, reactions: 5 },
+    { slug: "living-board-update", name: "Living Board Update", shape: "landscape", views: 96, reactions: 11 },
+    { slug: "analytics-dashboard", name: "Analytics Dashboard", shape: "square", views: 1318, reactions: 41 },
+    { slug: "online-shop", name: "Online Shop", shape: "landscape", views: 2204, reactions: 73 },
+    { slug: "stocks-dashboard", name: "Stocks Dashboard", shape: "landscape", views: 689, reactions: 22 },
+    { slug: "invoices", name: "Invoices", shape: "square", views: 402, reactions: 14 },
+    { slug: "task-manager", name: "Task Manager", shape: "landscape", views: 957, reactions: 36 },
+    { slug: "your-crm", name: "Your CRM", shape: "landscape", views: 533, reactions: 19 },
+    { slug: "rent-or-buy", name: "Rent or Buy", shape: "landscape", views: 1476, reactions: 58 },
+];
+/**
+ * The default cards dealt into columns BY HAND, as the mock deals them: light and
+ * dark cards alternate down each column, every column mixes the three shapes, and
+ * no card is in two columns. Used only with the default cards; an override is dealt
+ * round-robin.
+ */
+const SHOWCASE_SCROLL_COLUMNS = {
+    3: [
+        ["moon-run", "campaign-brief-builder", "analytics-dashboard", "rent-or-buy", "fox-tales", "living-board-update", "sales-call-coach"],
+        ["online-shop", "tour-poster", "pricing-simulator", "stocks-dashboard", "onboarding-guide", "operating-review"],
+        ["space-today", "invoices", "all-the-way-down", "task-manager", "chess-puzzles", "your-crm"],
+    ],
+    2: [
+        ["moon-run", "campaign-brief-builder", "analytics-dashboard", "rent-or-buy", "space-today", "task-manager", "fox-tales", "living-board-update", "sales-call-coach", "your-crm"],
+        ["online-shop", "tour-poster", "pricing-simulator", "stocks-dashboard", "invoices", "all-the-way-down", "onboarding-guide", "chess-puzzles", "operating-review"],
+    ],
+};
+/** The founder's speed, px/s, for the outer columns (2026-10-06). */
+const SHOWCASE_SCROLL_SPEED = 46;
+/** The middle column runs at this share of the speed: the parallax. */
+const MIDDLE_COLUMN_FACTOR = 0.8;
+/** Where each column's first card opens, in 4:3 card heights above the padding line. */
+const START_OFFSETS = [0, -0.5, -0.33];
+/** The count-up, as on the website's ticker. */
+const COUNT_MS = 780;
+const MIN_COPIES = 3;
+const MAX_COPIES = 12;
+/**
+ * Everything a utility class cannot carry cleanly: keyframes, a 17-stop mask, a
+ * container query that swaps the deal, a hover chain across elements, and the
+ * reduced-motion overrides. Every value is a token or a geometry of the mock's.
+ *
+ * Emitted as a React 19 hoistable stylesheet (`href` + `precedence`), so React puts
+ * it in the head once however many panels render. It sits in `@layer components`,
+ * under a consumer's own utilities. It opens by declaring Tailwind v4's layer order:
+ * layer order is set by FIRST appearance, so if this sheet ever reached the page
+ * before the consumer's Tailwind CSS, `components` would otherwise rank below
+ * `base`, and preflight's `img { height: auto }` would undo the cover-fit pictures.
+ *
+ * The mask's stops are written as `color-mix(in srgb, black N%, transparent)`. A mask
+ * paints nothing; only each stop's ALPHA is read, so these are opacities on the
+ * smoothstep curve, not colours.
+ */
+const STYLES = `
+@layer theme, base, components, utilities;
+@layer components {
+  [data-slot="showcase-scroll"] {
+    container: cg-showcase / inline-size;
+    position: relative;
+    overflow: hidden;
+    isolation: isolate;
+    /* The mock's lift and rise: between --cg-duration (180) and -slow (280). */
+    --cg-showcase-lift: 200ms;
+  }
+  [data-slot="showcase-scroll-frame"] {
+    position: absolute;
+    inset: 0;
+  }
+  [data-slot="showcase-scroll-layout"] {
+    position: absolute;
+    inset: 0;
+    display: grid;
+    grid-template-columns: repeat(var(--cg-showcase-columns), minmax(0, 1fr));
+    gap: var(--cg-space-4);
+    padding: 0 var(--cg-space-8);
+    --cg-showcase-fade-size: 15%;
+    --cg-showcase-fade: linear-gradient(to bottom,
+      transparent 0,
+      color-mix(in srgb, black 3%, transparent) calc(var(--cg-showcase-fade-size) * 0.125),
+      color-mix(in srgb, black 10%, transparent) calc(var(--cg-showcase-fade-size) * 0.25),
+      color-mix(in srgb, black 22%, transparent) calc(var(--cg-showcase-fade-size) * 0.375),
+      color-mix(in srgb, black 37%, transparent) calc(var(--cg-showcase-fade-size) * 0.5),
+      color-mix(in srgb, black 55%, transparent) calc(var(--cg-showcase-fade-size) * 0.625),
+      color-mix(in srgb, black 73%, transparent) calc(var(--cg-showcase-fade-size) * 0.75),
+      color-mix(in srgb, black 88%, transparent) calc(var(--cg-showcase-fade-size) * 0.875),
+      black var(--cg-showcase-fade-size),
+      black calc(100% - var(--cg-showcase-fade-size)),
+      color-mix(in srgb, black 88%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.875),
+      color-mix(in srgb, black 73%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.75),
+      color-mix(in srgb, black 55%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.625),
+      color-mix(in srgb, black 37%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.5),
+      color-mix(in srgb, black 22%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.375),
+      color-mix(in srgb, black 10%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.25),
+      color-mix(in srgb, black 3%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.125),
+      transparent 100%);
+    -webkit-mask-image: var(--cg-showcase-fade);
+    mask-image: var(--cg-showcase-fade);
+  }
+  [data-slot="showcase-scroll-layout"][data-columns="3"] { display: none; }
+  @container cg-showcase (min-width: 544px) {
+    [data-slot="showcase-scroll-layout"][data-columns="2"] { display: none; }
+    [data-slot="showcase-scroll-layout"][data-columns="3"] { display: grid; }
+  }
+  [data-slot="showcase-scroll-column"] {
+    container-type: inline-size;
+    position: relative;
+    min-width: 0;
+  }
+  [data-slot="showcase-scroll-offset"] {
+    transform: translate3d(0, calc(var(--cg-space-8) + var(--cg-showcase-start) * 75cqw), 0);
+  }
+  [data-slot="showcase-scroll-track"] {
+    will-change: transform;
+    animation-duration: var(--cg-showcase-duration, 30s);
+    animation-timing-function: linear;
+    animation-iteration-count: infinite;
+  }
+  [data-slot="showcase-scroll-column"][data-direction="up"] [data-slot="showcase-scroll-track"] {
+    animation-name: cg-showcase-up;
+  }
+  [data-slot="showcase-scroll-column"][data-direction="down"] [data-slot="showcase-scroll-track"] {
+    animation-name: cg-showcase-down;
+  }
+  [data-slot="showcase-scroll"]:not([data-running]) [data-slot="showcase-scroll-track"] {
+    animation-play-state: paused;
+  }
+  @media (hover: hover) {
+    [data-slot="showcase-scroll-column"]:hover [data-slot="showcase-scroll-track"] {
+      animation-play-state: paused;
+    }
+  }
+  [data-slot="showcase-scroll-copy"] {
+    display: flex;
+    flex-direction: column;
+    gap: var(--cg-space-4);
+    padding-bottom: var(--cg-space-4);
+  }
+  [data-slot="showcase-scroll-card"] {
+    position: relative;
+    overflow: hidden;
+    border-radius: var(--cg-radius-xl);
+    background: var(--cg-neutral-50);
+    box-shadow: var(--cg-shadow-tile);
+    transition:
+      transform var(--cg-showcase-lift) var(--cg-ease-out),
+      box-shadow var(--cg-showcase-lift) var(--cg-ease-out);
+  }
+  [data-slot="showcase-scroll-card"][data-shape="landscape"] { aspect-ratio: 4 / 3; }
+  [data-slot="showcase-scroll-card"][data-shape="square"] { aspect-ratio: 1 / 1; }
+  [data-slot="showcase-scroll-card"][data-shape="portrait"] { aspect-ratio: 3 / 4; }
+  [data-slot="showcase-scroll-card"] > img {
+    position: absolute;
+    inset: 0;
+    display: block;
+    width: 100%;
+    height: 100%;
+    max-width: none;
+    object-fit: cover;
+    user-select: none;
+    -webkit-user-drag: none;
+  }
+  @media (hover: hover) {
+    [data-slot="showcase-scroll-card"]:hover {
+      transform: scale(1.02);
+      box-shadow: var(--cg-shadow-tile-hover);
+      z-index: 2;
+    }
+  }
+  [data-slot="showcase-scroll-stats"] {
+    position: absolute;
+    left: var(--cg-space-2);
+    bottom: var(--cg-space-2);
+    z-index: 3;
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+    gap: var(--cg-space-1);
+    pointer-events: none;
+    animation: cg-showcase-rise var(--cg-showcase-lift) var(--cg-ease-out) both;
+  }
+  @media (hover: none) {
+    [data-slot="showcase-scroll-stats"] { display: none; }
+  }
+  [data-slot="showcase-scroll-chip"] {
+    display: flex;
+    align-items: center;
+    gap: 7px;
+    height: var(--cg-space-8);
+    padding: 0 10px 0 5px;
+    border: var(--cg-border-width) solid var(--cg-border-hairline);
+    border-radius: var(--cg-radius-xs);
+    background: var(--cg-surface-card);
+    box-shadow: var(--cg-shadow-card);
+    white-space: nowrap;
+  }
+  [data-slot="showcase-scroll-plate"] {
+    display: grid;
+    place-items: center;
+    flex: none;
+    width: 22px;
+    height: 22px;
+    border-radius: var(--cg-radius-2xs);
+    background: var(--cg-surface-page);
+    color: var(--cg-text-accent);
+  }
+  [data-slot="showcase-scroll-plate"] > svg { width: 14px; height: 14px; }
+  [data-slot="showcase-scroll-figure"] {
+    display: flex;
+    align-items: baseline;
+    gap: 5px;
+    font-family: var(--cg-font-body);
+  }
+  [data-slot="showcase-scroll-number"] {
+    font-size: var(--cg-body-md);
+    font-weight: var(--cg-weight-medium);
+    line-height: 1;
+    color: var(--cg-text-primary);
+    font-variant-numeric: tabular-nums;
+  }
+  [data-slot="showcase-scroll-label"] {
+    font-size: var(--cg-caption);
+    font-weight: var(--cg-weight-regular);
+    line-height: 1;
+    color: var(--cg-text-secondary);
+  }
+  [data-slot="showcase-scroll-stats"][data-compact] [data-slot="showcase-scroll-chip"] {
+    height: auto;
+    padding-top: 5px;
+    padding-bottom: 5px;
+  }
+  [data-slot="showcase-scroll-stats"][data-compact] [data-slot="showcase-scroll-figure"] {
+    flex-direction: column;
+    align-items: flex-start;
+    gap: 3px;
+  }
+  @media (prefers-reduced-motion: reduce) {
+    [data-slot="showcase-scroll-layout"] {
+      padding-top: var(--cg-space-8);
+      --cg-showcase-fade: linear-gradient(to bottom,
+        black calc(100% - var(--cg-showcase-fade-size)),
+        color-mix(in srgb, black 55%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.625),
+        color-mix(in srgb, black 10%, transparent) calc(100% - var(--cg-showcase-fade-size) * 0.25),
+        transparent 100%);
+    }
+    [data-slot="showcase-scroll-offset"],
+    [data-slot="showcase-scroll-track"] { animation: none; transform: none; }
+    [data-slot="showcase-scroll-card"],
+    [data-slot="showcase-scroll-stats"] { transition: none; animation: none; }
+    [data-slot="showcase-scroll-card"]:hover { transform: none; }
+  }
+}
+@keyframes cg-showcase-up {
+  from { transform: translate3d(0, calc(-100% / var(--cg-showcase-copies)), 0); }
+  to { transform: translate3d(0, calc(-200% / var(--cg-showcase-copies)), 0); }
+}
+@keyframes cg-showcase-down {
+  from { transform: translate3d(0, calc(-200% / var(--cg-showcase-copies)), 0); }
+  to { transform: translate3d(0, calc(-100% / var(--cg-showcase-copies)), 0); }
+}
+@keyframes cg-showcase-rise {
+  from { opacity: 0; transform: translate3d(0, var(--cg-space-1), 0); }
+  to { opacity: 1; transform: none; }
+}
+`;
+function deal(cards, usesDefaults) {
+    return [3, 2].map((columns) => {
+        if (usesDefaults) {
+            const bySlug = new Map(cards.map((c) => [c.slug, c]));
+            return {
+                columns,
+                cols: SHOWCASE_SCROLL_COLUMNS[columns].map((slugs) => slugs.map((s) => bySlug.get(s)).filter((c) => Boolean(c))),
+            };
+        }
+        const cols = Array.from({ length: columns }, () => []);
+        cards.forEach((card, i) => cols[i % columns].push(card));
+        return { columns, cols };
+    });
+}
+const format = (n) => Math.round(n).toLocaleString("en-US");
+/** The ticker's count curve: ease in, ease out. */
+const climb = (u) => (u < 0.5 ? 2 * u * u : 1 - Math.pow(-2 * u + 2, 2) / 2);
+function reducedMotion() {
+    return typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
+}
+/** The two chips, inside the hovered card's bottom-left corner. */
+function ShowcaseStats({ views, reactions }) {
+    const ref = React.useRef(null);
+    const [compact, setCompact] = React.useState(false);
+    // Rendered at the final numbers first, so the narrow-card check measures the
+    // widest the chips will ever be, then counted up from zero before the first paint.
+    const [progress, setProgress] = React.useState(1);
+    React.useLayoutEffect(() => {
+        const el = ref.current;
+        const card = el?.parentElement;
+        if (el && card)
+            setCompact(el.scrollWidth > card.clientWidth - 16);
+        if (reducedMotion())
+            return;
+        setProgress(0);
+        let raf = 0;
+        const t0 = performance.now();
+        const step = (now) => {
+            const g = Math.min(1, (now - t0) / COUNT_MS);
+            setProgress(g);
+            if (g < 1)
+                raf = requestAnimationFrame(step);
+        };
+        raf = requestAnimationFrame(step);
+        return () => cancelAnimationFrame(raf);
+    }, []);
+    const shown = (n) => format(progress >= 1 ? n : n * climb(progress));
+    return (_jsxs("div", { ref: ref, "data-slot": "showcase-scroll-stats", "data-compact": compact ? "" : undefined, "data-theme": "default", children: [_jsxs("div", { "data-slot": "showcase-scroll-chip", "data-stat": "views", children: [_jsx("span", { "data-slot": "showcase-scroll-plate", children: _jsx(ViewsIcon, {}) }), _jsxs("span", { "data-slot": "showcase-scroll-figure", children: [_jsx("b", { "data-slot": "showcase-scroll-number", children: shown(views) }), _jsx("small", { "data-slot": "showcase-scroll-label", children: "Views" })] })] }), _jsxs("div", { "data-slot": "showcase-scroll-chip", "data-stat": "reactions", children: [_jsx("span", { "data-slot": "showcase-scroll-plate", children: _jsx(ReactionsIcon, {}) }), _jsxs("span", { "data-slot": "showcase-scroll-figure", children: [_jsx("b", { "data-slot": "showcase-scroll-number", children: shown(reactions) }), _jsx("small", { "data-slot": "showcase-scroll-label", children: "Reactions" })] })] })] }));
+}
+const ShowcaseCard = React.memo(function ShowcaseCard({ id, card, src, eager, active, }) {
+    return (_jsxs("div", { "data-slot": "showcase-scroll-card", "data-card": card.slug, "data-shape": card.shape, "data-tile": id, children: [src ? _jsx("img", { src: src, alt: "", loading: eager ? "eager" : "lazy", decoding: "async", draggable: false }) : null, active ? _jsx(ShowcaseStats, { views: card.views, reactions: card.reactions }) : null] }));
+});
+function ShowcaseScroll({ cards, resolveSrc, speed = SHOWCASE_SCROLL_SPEED, paused = false, className, ...props }) {
+    const rootRef = React.useRef(null);
+    const source = cards ?? SHOWCASE_SCROLL_CARDS;
+    const deals = React.useMemo(() => deal(source, !cards), [source, cards]);
+    const [copies, setCopies] = React.useState(MIN_COPIES);
+    const [durations, setDurations] = React.useState({});
+    const [hovered, setHovered] = React.useState(null);
+    // False until the panel is laid out with a size. Pictures are `lazy` until then,
+    // so a panel the shell hides (phones) fetches nothing, and `eager` after, so the
+    // 19 files arrive before their cards scroll in: lazy loading treats a card below
+    // the panel's clipped edge as out of view until it is already entering.
+    const [shown, setShown] = React.useState(false);
+    // One copy's height over the speed is each column's duration, and the panel's
+    // height decides how many copies keep the column covered for a whole loop.
+    React.useLayoutEffect(() => {
+        const root = rootRef.current;
+        if (!root)
+            return;
+        const measure = () => {
+            const panelH = root.clientHeight;
+            if (panelH > 0 && root.clientWidth > 0)
+                setShown(true);
+            const next = {};
+            let need = MIN_COPIES;
+            root.querySelectorAll('[data-slot="showcase-scroll-column"]').forEach((col) => {
+                if (col.getClientRects().length === 0)
+                    return;
+                const copy = col.querySelector('[data-slot="showcase-scroll-copy"]');
+                const offset = col.querySelector('[data-slot="showcase-scroll-offset"]');
+                const h = copy?.getBoundingClientRect().height ?? 0;
+                if (!h)
+                    return;
+                const factor = Number(col.dataset.speedFactor) || 1;
+                next[col.dataset.column] = h / (speed * factor);
+                // The track starts one copy up (two for a down column) from this offset,
+                // so it must reach the panel's bottom with two copies spent.
+                const t = offset && typeof DOMMatrixReadOnly !== "undefined"
+                    ? new DOMMatrixReadOnly(getComputedStyle(offset).transform).m42
+                    : 0;
+                need = Math.max(need, Math.ceil(2 + (panelH - t) / h));
+            });
+            setCopies((c) => {
+                const n = Math.min(MAX_COPIES, need);
+                return c === n ? c : n;
+            });
+            setDurations((prev) => {
+                const keys = Object.keys(next);
+                if (keys.length === Object.keys(prev).length && keys.every((k) => Math.abs(prev[k] - next[k]) < 1e-6)) {
+                    return prev;
+                }
+                return next;
+            });
+        };
+        measure();
+        // Absent in jsdom and other non-browser hosts: the block then renders its
+        // first frame and holds it, rather than throwing in a consumer's unit tests.
+        if (typeof ResizeObserver === "undefined")
+            return;
+        const ro = new ResizeObserver(measure);
+        ro.observe(root);
+        return () => ro.disconnect();
+    }, [speed, deals]);
+    const running = !paused && Object.keys(durations).length > 0;
+    const onPointerOver = (e) => {
+        if (e.pointerType !== "mouse")
+            return;
+        const tile = e.target.closest('[data-slot="showcase-scroll-card"]');
+        if (tile?.dataset.tile)
+            setHovered(tile.dataset.tile);
+    };
+    const onPointerOut = (e) => {
+        if (e.pointerType !== "mouse")
+            return;
+        const to = e.relatedTarget instanceof Element ? e.relatedTarget.closest('[data-slot="showcase-scroll-card"]') : null;
+        if (!to)
+            setHovered(null);
+    };
+    return (_jsxs(Panel, { ...props, inset: "flush", padding: "md", "data-slot": "showcase-scroll", "data-running": running ? "" : undefined, className: cn("h-full rounded-3xl p-0", className), "aria-hidden": "true", onPointerOver: onPointerOver, onPointerOut: onPointerOut, children: [_jsx("style", { href: "cg-showcase-scroll", precedence: "medium", children: STYLES }), _jsx("div", { ref: rootRef, "data-slot": "showcase-scroll-frame", children: deals.map(({ columns, cols }) => (_jsx("div", { "data-slot": "showcase-scroll-layout", "data-columns": columns, style: { "--cg-showcase-columns": columns }, children: cols.map((col, ci) => (_jsx(ShowcaseColumn, { id: `${columns}-${ci}`, index: ci, cards: col, copies: copies, duration: durations[`${columns}-${ci}`], hovered: hovered, eager: shown, resolveSrc: resolveSrc }, ci))) }, columns))) })] }));
+}
+/** One column: a static start offset around a track of identical copies. */
+function ShowcaseColumn({ id, index, cards, copies, duration, hovered, eager, resolveSrc, }) {
+    const trackStyle = {
+        "--cg-showcase-copies": copies,
+        ...(duration ? { "--cg-showcase-duration": `${duration}s` } : {}),
+    };
+    return (_jsx("div", { "data-slot": "showcase-scroll-column", "data-column": id, "data-direction": index % 2 ? "down" : "up", "data-speed-factor": index === 1 ? MIDDLE_COLUMN_FACTOR : 1, style: { "--cg-showcase-start": START_OFFSETS[index] ?? 0 }, children: _jsx("div", { "data-slot": "showcase-scroll-offset", children: _jsx("div", { "data-slot": "showcase-scroll-track", style: trackStyle, children: Array.from({ length: copies }, (_, k) => (_jsx("div", { "data-slot": "showcase-scroll-copy", children: cards.map((card, i) => {
+                        const tile = `${id}-${k}-${i}`;
+                        return (_jsx(ShowcaseCard, { id: tile, card: card, src: card.src ?? resolveSrc?.(card), eager: eager, active: hovered === tile }, tile));
+                    }) }, k))) }) }) }));
+}
+export { ShowcaseScroll, SHOWCASE_SCROLL_CARDS, SHOWCASE_SCROLL_COLUMNS, SHOWCASE_SCROLL_SPEED };
+//# sourceMappingURL=showcase-scroll.js.map

package/dist/blocks/showcase-scroll.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"showcase-scroll.js","sourceRoot":"","sources":["../../src/blocks/showcase-scroll.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAE9B,OAAO,EAAE,KAAK,EAAE,MAAM,qBAAqB,CAAA;AAC3C,OAAO,EAAE,aAAa,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC9D,OAAO,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAA;AA4EvC;;;;;;GAMG;AACH,MAAM,qBAAqB,GAAkC;IAC3D,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE;IACzF,EAAE,IAAI,EAAE,kBAAkB,EAAE,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IACrG,EAAE,IAAI,EAAE,kBAAkB,EAAE,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE;IACtG,EAAE,IAAI,EAAE,mBAAmB,EAAE,IAAI,EAAE,mBAAmB,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IACvG,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,WAAW,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IACpF,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,GAAG,EAAE;IACvF,EAAE,IAAI,EAAE,eAAe,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,EAAE;IAC3F,EAAE,IAAI,EAAE,wBAAwB,EAAE,IAAI,EAAE,wBAAwB,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IACjH,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,UAAU,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE;IAC3F,EAAE,IAAI,EAAE,kBAAkB,EAAE,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IACrG,EAAE,IAAI,EAAE,kBAAkB,EAAE,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,CAAC,EAAE;IACjG,EAAE,IAAI,EAAE,qBAAqB,EAAE,IAAI,EAAE,qBAAqB,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE;IAC1G,EAAE,IAAI,EAAE,qBAAqB,EAAE,IAAI,EAAE,qBAAqB,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE;IACzG,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE;IAC5F,EAAE,IAAI,EAAE,kBAAkB,EAAE,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IACrG,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IAClF,EAAE,IAAI,EAAE,cAAc,EAAE,IAAI,EAAE,cAAc,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IAC7F,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,GAAG,EAAE,SAAS,EAAE,EAAE,EAAE;IACrF,EAAE,IAAI,EAAE,aAAa,EAAE,IAAI,EAAE,aAAa,EAAE,KAAK,EAAE,WAAW,EAAE,KAAK,EAAE,IAAI,EAAE,SAAS,EAAE,EAAE,EAAE;CAC7F,CAAA;AAED;;;;;GAKG;AACH,MAAM,uBAAuB,GAA4D;IACvF,CAAC,EAAE;QACD,CAAC,UAAU,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,aAAa,EAAE,WAAW,EAAE,qBAAqB,EAAE,kBAAkB,CAAC;QACpI,CAAC,aAAa,EAAE,aAAa,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,kBAAkB,CAAC;QAC/G,CAAC,aAAa,EAAE,UAAU,EAAE,kBAAkB,EAAE,cAAc,EAAE,eAAe,EAAE,UAAU,CAAC;KAC7F;IACD,CAAC,EAAE;QACD,CAAC,UAAU,EAAE,wBAAwB,EAAE,qBAAqB,EAAE,aAAa,EAAE,aAAa,EAAE,cAAc,EAAE,WAAW,EAAE,qBAAqB,EAAE,kBAAkB,EAAE,UAAU,CAAC;QAC/K,CAAC,aAAa,EAAE,aAAa,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,UAAU,EAAE,kBAAkB,EAAE,kBAAkB,EAAE,eAAe,EAAE,kBAAkB,CAAC;KACjK;CACF,CAAA;AAED,qEAAqE;AACrE,MAAM,qBAAqB,GAAG,EAAE,CAAA;AAEhC,uEAAuE;AACvE,MAAM,oBAAoB,GAAG,GAAG,CAAA;AAChC,wFAAwF;AACxF,MAAM,aAAa,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,EAAE,CAAC,IAAI,CAAU,CAAA;AAC/C,gDAAgD;AAChD,MAAM,QAAQ,GAAG,GAAG,CAAA;AACpB,MAAM,UAAU,GAAG,CAAC,CAAA;AACpB,MAAM,UAAU,GAAG,EAAE,CAAA;AAErB;;;;;;;;;;;;;;;GAeG;AACH,MAAM,MAAM,GAAG;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAkNd,CAAA;AAeD,SAAS,IAAI,CAAC,KAAoC,EAAE,YAAqB;IACvE,OAAQ,CAAC,CAAC,EAAE,CAAC,CAAW,CAAC,GAAG,CAAC,CAAC,OAAO,EAAE,EAAE;QACvC,IAAI,YAAY,EAAE,CAAC;YACjB,MAAM,MAAM,GAAG,IAAI,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC,CAAC,CAAA;YACrD,OAAO;gBACL,OAAO;gBACP,IAAI,EAAE,uBAAuB,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CACnD,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAA2B,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,CAAC,CACnF;aACF,CAAA;QACH,CAAC;QACD,MAAM,IAAI,GAA2B,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,OAAO,EAAE,EAAE,GAAG,EAAE,CAAC,EAAE,CAAC,CAAA;QAC9E,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,GAAG,OAAO,CAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;QACzD,OAAO,EAAE,OAAO,EAAE,IAAI,EAAE,CAAA;IAC1B,CAAC,CAAC,CAAA;AACJ,CAAC;AAED,MAAM,MAAM,GAAG,CAAC,CAAS,EAAE,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,cAAc,CAAC,OAAO,CAAC,CAAA;AACnE,mDAAmD;AACnD,MAAM,KAAK,GAAG,CAAC,CAAS,EAAE,EAAE,CAAC,CAAC,CAAC,GAAG,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,CAAA;AAEpF,SAAS,aAAa;IACpB,OAAO,OAAO,MAAM,KAAK,WAAW,IAAI,MAAM,CAAC,UAAU,EAAE,CAAC,kCAAkC,CAAC,CAAC,OAAO,CAAA;AACzG,CAAC;AAED,mEAAmE;AACnE,SAAS,aAAa,CAAC,EAAE,KAAK,EAAE,SAAS,EAAwC;IAC/E,MAAM,GAAG,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAA;IAC9C,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IACnD,6EAA6E;IAC7E,mFAAmF;IACnF,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;IAEjD,KAAK,CAAC,eAAe,CAAC,GAAG,EAAE;QACzB,MAAM,EAAE,GAAG,GAAG,CAAC,OAAO,CAAA;QACtB,MAAM,IAAI,GAAG,EAAE,EAAE,aAAa,CAAA;QAC9B,IAAI,EAAE,IAAI,IAAI;YAAE,UAAU,CAAC,EAAE,CAAC,WAAW,GAAG,IAAI,CAAC,WAAW,GAAG,EAAE,CAAC,CAAA;QAClE,IAAI,aAAa,EAAE;YAAE,OAAM;QAC3B,WAAW,CAAC,CAAC,CAAC,CAAA;QACd,IAAI,GAAG,GAAG,CAAC,CAAA;QACX,MAAM,EAAE,GAAG,WAAW,CAAC,GAAG,EAAE,CAAA;QAC5B,MAAM,IAAI,GAAG,CAAC,GAAW,EAAE,EAAE;YAC3B,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC,GAAG,GAAG,EAAE,CAAC,GAAG,QAAQ,CAAC,CAAA;YAC5C,WAAW,CAAC,CAAC,CAAC,CAAA;YACd,IAAI,CAAC,GAAG,CAAC;gBAAE,GAAG,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAA;QAC9C,CAAC,CAAA;QACD,GAAG,GAAG,qBAAqB,CAAC,IAAI,CAAC,CAAA;QACjC,OAAO,GAAG,EAAE,CAAC,oBAAoB,CAAC,GAAG,CAAC,CAAA;IACxC,CAAC,EAAE,EAAE,CAAC,CAAA;IAEN,MAAM,KAAK,GAAG,CAAC,CAAS,EAAE,EAAE,CAAC,MAAM,CAAC,QAAQ,IAAI,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAA;IAC5E,OAAO,CACL,eACE,GAAG,EAAE,GAAG,eACE,uBAAuB,kBACnB,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,gBAI3B,SAAS,aAEpB,4BAAe,sBAAsB,eAAW,OAAO,aACrD,4BAAgB,uBAAuB,YACrC,KAAC,SAAS,KAAG,GACR,EACP,6BAAgB,wBAAwB,aACtC,yBAAa,wBAAwB,YAAE,KAAK,CAAC,KAAK,CAAC,GAAK,EACxD,6BAAiB,uBAAuB,sBAAc,IACjD,IACH,EACN,4BAAe,sBAAsB,eAAW,WAAW,aACzD,4BAAgB,uBAAuB,YACrC,KAAC,aAAa,KAAG,GACZ,EACP,6BAAgB,wBAAwB,aACtC,yBAAa,wBAAwB,YAAE,KAAK,CAAC,SAAS,CAAC,GAAK,EAC5D,6BAAiB,uBAAuB,0BAAkB,IACrD,IACH,IACF,CACP,CAAA;AACH,CAAC;AAED,MAAM,YAAY,GAAG,KAAK,CAAC,IAAI,CAAC,SAAS,YAAY,CAAC,EACpD,EAAE,EACF,IAAI,EACJ,GAAG,EACH,KAAK,EACL,MAAM,GAOP;IACC,OAAO,CACL,4BAAe,sBAAsB,eAAY,IAAI,CAAC,IAAI,gBAAc,IAAI,CAAC,KAAK,eAAa,EAAE,aAC9F,GAAG,CAAC,CAAC,CAAC,cAAK,GAAG,EAAE,GAAG,EAAE,GAAG,EAAC,EAAE,EAAC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,EAAE,QAAQ,EAAC,OAAO,EAAC,SAAS,EAAE,KAAK,GAAI,CAAC,CAAC,CAAC,IAAI,EAC3G,MAAM,CAAC,CAAC,CAAC,KAAC,aAAa,IAAC,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,CAAC,SAAS,GAAI,CAAC,CAAC,CAAC,IAAI,IAC5E,CACP,CAAA;AACH,CAAC,CAAC,CAAA;AAEF,SAAS,cAAc,CAAC,EACtB,KAAK,EACL,UAAU,EACV,KAAK,GAAG,qBAAqB,EAC7B,MAAM,GAAG,KAAK,EACd,SAAS,EACT,GAAG,KAAK,EACY;IACpB,MAAM,OAAO,GAAG,KAAK,CAAC,MAAM,CAAiB,IAAI,CAAC,CAAA;IAClD,MAAM,MAAM,GAAG,KAAK,IAAI,qBAAqB,CAAA;IAC7C,MAAM,KAAK,GAAG,KAAK,CAAC,OAAO,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,KAAK,CAAC,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC,CAAA;IACxE,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,UAAU,CAAC,CAAA;IACtD,MAAM,CAAC,SAAS,EAAE,YAAY,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAyB,EAAE,CAAC,CAAA;IAC5E,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAgB,IAAI,CAAC,CAAA;IACjE,iFAAiF;IACjF,iFAAiF;IACjF,iFAAiF;IACjF,wEAAwE;IACxE,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAA;IAE/C,8EAA8E;IAC9E,2EAA2E;IAC3E,KAAK,CAAC,eAAe,CAAC,GAAG,EAAE;QACzB,MAAM,IAAI,GAAG,OAAO,CAAC,OAAO,CAAA;QAC5B,IAAI,CAAC,IAAI;YAAE,OAAM;QACjB,MAAM,OAAO,GAAG,GAAG,EAAE;YACnB,MAAM,MAAM,GAAG,IAAI,CAAC,YAAY,CAAA;YAChC,IAAI,MAAM,GAAG,CAAC,IAAI,IAAI,CAAC,WAAW,GAAG,CAAC;gBAAE,QAAQ,CAAC,IAAI,CAAC,CAAA;YACtD,MAAM,IAAI,GAA2B,EAAE,CAAA;YACvC,IAAI,IAAI,GAAG,UAAU,CAAA;YACrB,IAAI,CAAC,gBAAgB,CAAc,sCAAsC,CAAC,CAAC,OAAO,CAAC,CAAC,GAAG,EAAE,EAAE;gBACzF,IAAI,GAAG,CAAC,cAAc,EAAE,CAAC,MAAM,KAAK,CAAC;oBAAE,OAAM;gBAC7C,MAAM,IAAI,GAAG,GAAG,CAAC,aAAa,CAAc,oCAAoC,CAAC,CAAA;gBACjF,MAAM,MAAM,GAAG,GAAG,CAAC,aAAa,CAAc,sCAAsC,CAAC,CAAA;gBACrF,MAAM,CAAC,GAAG,IAAI,EAAE,qBAAqB,EAAE,CAAC,MAAM,IAAI,CAAC,CAAA;gBACnD,IAAI,CAAC,CAAC;oBAAE,OAAM;gBACd,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,OAAO,CAAC,WAAW,CAAC,IAAI,CAAC,CAAA;gBACnD,IAAI,CAAC,GAAG,CAAC,OAAO,CAAC,MAAO,CAAC,GAAG,CAAC,GAAG,CAAC,KAAK,GAAG,MAAM,CAAC,CAAA;gBAChD,yEAAyE;gBACzE,6DAA6D;gBAC7D,MAAM,CAAC,GACL,MAAM,IAAI,OAAO,iBAAiB,KAAK,WAAW;oBAChD,CAAC,CAAC,IAAI,iBAAiB,CAAC,gBAAgB,CAAC,MAAM,CAAC,CAAC,SAAS,CAAC,CAAC,GAAG;oBAC/D,CAAC,CAAC,CAAC,CAAA;gBACP,IAAI,GAAG,IAAI,CAAC,GAAG,CAAC,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,CAAA;YACxD,CAAC,CAAC,CAAA;YACF,SAAS,CAAC,CAAC,CAAC,EAAE,EAAE;gBACd,MAAM,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,UAAU,EAAE,IAAI,CAAC,CAAA;gBACpC,OAAO,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAA;YACxB,CAAC,CAAC,CAAA;YACF,YAAY,CAAC,CAAC,IAAI,EAAE,EAAE;gBACpB,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;gBAC9B,IAAI,IAAI,CAAC,MAAM,KAAK,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,IAAI,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAE,GAAG,IAAI,CAAC,CAAC,CAAE,CAAC,GAAG,IAAI,CAAC,EAAE,CAAC;oBACxG,OAAO,IAAI,CAAA;gBACb,CAAC;gBACD,OAAO,IAAI,CAAA;YACb,CAAC,CAAC,CAAA;QACJ,CAAC,CAAA;QACD,OAAO,EAAE,CAAA;QACT,0EAA0E;QAC1E,6EAA6E;QAC7E,IAAI,OAAO,cAAc,KAAK,WAAW;YAAE,OAAM;QACjD,MAAM,EAAE,GAAG,IAAI,cAAc,CAAC,OAAO,CAAC,CAAA;QACtC,EAAE,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;QAChB,OAAO,GAAG,EAAE,CAAC,EAAE,CAAC,UAAU,EAAE,CAAA;IAC9B,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAA;IAElB,MAAM,OAAO,GAAG,CAAC,MAAM,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM,GAAG,CAAC,CAAA;IAE5D,MAAM,aAAa,GAAG,CAAC,CAAqB,EAAE,EAAE;QAC9C,IAAI,CAAC,CAAC,WAAW,KAAK,OAAO;YAAE,OAAM;QACrC,MAAM,IAAI,GAAI,CAAC,CAAC,MAAkB,CAAC,OAAO,CAAc,oCAAoC,CAAC,CAAA;QAC7F,IAAI,IAAI,EAAE,OAAO,CAAC,IAAI;YAAE,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;IACvD,CAAC,CAAA;IACD,MAAM,YAAY,GAAG,CAAC,CAAqB,EAAE,EAAE;QAC7C,IAAI,CAAC,CAAC,WAAW,KAAK,OAAO;YAAE,OAAM;QACrC,MAAM,EAAE,GAAG,CAAC,CAAC,aAAa,YAAY,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,aAAa,CAAC,OAAO,CAAC,oCAAoC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA;QACpH,IAAI,CAAC,EAAE;YAAE,UAAU,CAAC,IAAI,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,OAAO,CACL,MAAC,KAAK,OACA,KAAK,EACT,KAAK,EAAC,OAAO,EACb,OAAO,EAAC,IAAI,eACF,iBAAiB,kBACb,OAAO,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,SAAS,EACtC,SAAS,EAAE,EAAE,CAAC,wBAAwB,EAAE,SAAS,CAAC,iBACtC,MAAM,EAClB,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,aAE1B,gBAAO,IAAI,EAAC,oBAAoB,EAAC,UAAU,EAAC,QAAQ,YACjD,MAAM,GACD,EAGR,cAAK,GAAG,EAAE,OAAO,eAAY,uBAAuB,YACjD,KAAK,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,EAAE,IAAI,EAAE,EAAE,EAAE,CAAC,CAChC,2BAEY,wBAAwB,kBACpB,OAAO,EACrB,KAAK,EAAE,EAAE,uBAAuB,EAAE,OAAO,EAAyB,YAEjE,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,EAAE,EAAE,CAAC,CACrB,KAAC,cAAc,IAEb,EAAE,EAAE,GAAG,OAAO,IAAI,EAAE,EAAE,EACtB,KAAK,EAAE,EAAE,EACT,KAAK,EAAE,GAAG,EACV,MAAM,EAAE,MAAM,EACd,QAAQ,EAAE,SAAS,CAAC,GAAG,OAAO,IAAI,EAAE,EAAE,CAAC,EACvC,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,UAAU,EAAE,UAAU,IARjB,EAAE,CASP,CACH,CAAC,IAjBG,OAAO,CAkBR,CACP,CAAC,GACE,IACA,CACT,CAAA;AACH,CAAC;AAED,4EAA4E;AAC5E,SAAS,cAAc,CAAC,EACtB,EAAE,EACF,KAAK,EACL,KAAK,EACL,MAAM,EACN,QAAQ,EACR,OAAO,EACP,KAAK,EACL,UAAU,GAUX;IACC,MAAM,UAAU,GAAG;QACjB,sBAAsB,EAAE,MAAM;QAC9B,GAAG,CAAC,QAAQ,CAAC,CAAC,CAAC,EAAE,wBAAwB,EAAE,GAAG,QAAQ,GAAG,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC;KAC3C,CAAA;IACxB,OAAO,CACL,2BACY,wBAAwB,iBACrB,EAAE,oBACC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,uBACtB,KAAK,KAAK,CAAC,CAAC,CAAC,CAAC,oBAAoB,CAAC,CAAC,CAAC,CAAC,EACzD,KAAK,EAAE,EAAE,qBAAqB,EAAE,aAAa,CAAC,KAAK,CAAC,IAAI,CAAC,EAAyB,YAElF,2BAAe,wBAAwB,YACrC,2BAAe,uBAAuB,EAAC,KAAK,EAAE,UAAU,YACrD,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CACxC,2BAAuB,sBAAsB,YAC1C,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,CAAC,EAAE,EAAE;wBACrB,MAAM,IAAI,GAAG,GAAG,EAAE,IAAI,CAAC,IAAI,CAAC,EAAE,CAAA;wBAC9B,OAAO,CACL,KAAC,YAAY,IAEX,EAAE,EAAE,IAAI,EACR,IAAI,EAAE,IAAI,EACV,GAAG,EAAE,IAAI,CAAC,GAAG,IAAI,UAAU,EAAE,CAAC,IAAI,CAAC,EACnC,KAAK,EAAE,KAAK,EACZ,MAAM,EAAE,OAAO,KAAK,IAAI,IALnB,IAAI,CAMT,CACH,CAAA;oBACH,CAAC,CAAC,IAbM,CAAC,CAcL,CACP,CAAC,GACE,GACF,GACF,CACP,CAAA;AACH,CAAC;AAED,OAAO,EAAE,cAAc,EAAE,qBAAqB,EAAE,uBAAuB,EAAE,qBAAqB,EAAE,CAAA"}

package/dist/index.d.ts

@@ -31,6 +31,7 @@ export * from "./blocks/celebration.js";
 export * from "./blocks/cloudgrid-install.js";
 export * from "./blocks/command-field.js";
 export * from "./blocks/compare-table.js";
+export * from "./blocks/confirm-delete-dialog.js";
 export * from "./blocks/creation-tile.js";
 export * from "./blocks/cta-banner.js";
 export * from "./blocks/drop-zone.js";
@@ -54,6 +55,8 @@ export * from "./blocks/pricing-tiers.js";
 export * from "./blocks/prompt-block.js";
 export * from "./blocks/quote.js";
 export * from "./blocks/rich-text.js";
+export * from "./blocks/shelf.js";
+export * from "./blocks/showcase-scroll.js";
 export * from "./blocks/side-nav.js";
 export * from "./blocks/sign-in-options.js";
 export * from "./blocks/stage-panel.js";

package/dist/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAiBA,cAAc,mBAAmB,CAAA;AACjC,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,cAAc,CAAA;AAC5B,cAAc,kBAAkB,CAAA;AAChC,cAAc,kBAAkB,CAAA;AAChC,cAAc,oBAAoB,CAAA;AAClC,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,uBAAuB,CAAA;AACrC,cAAc,qBAAqB,CAAA;AACnC,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA;AACpC,cAAc,eAAe,CAAA;AAC7B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,qBAAqB,CAAA;AACnC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,kBAAkB,CAAA;AAChC,cAAc,iBAAiB,CAAA;AAG/B,cAAc,0BAA0B,CAAA;AACxC,cAAc,oBAAoB,CAAA;AAClC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,2BAA2B,CAAA;AACzC,cAAc,qBAAqB,CAAA;AACnC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,2BAA2B,CAAA;AACzC,cAAc,0BAA0B,CAAA;AACxC,cAAc,mBAAmB,CAAA;AACjC,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,qBAAqB,CAAA;AACnC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,wBAAwB,CAAA;AAGtC,cAAc,uBAAuB,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAiBA,cAAc,mBAAmB,CAAA;AACjC,cAAc,eAAe,CAAA;AAC7B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,cAAc,CAAA;AAC5B,cAAc,kBAAkB,CAAA;AAChC,cAAc,kBAAkB,CAAA;AAChC,cAAc,oBAAoB,CAAA;AAClC,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,uBAAuB,CAAA;AACrC,cAAc,qBAAqB,CAAA;AACnC,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA;AACpC,cAAc,eAAe,CAAA;AAC7B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,qBAAqB,CAAA;AACnC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,gBAAgB,CAAA;AAC9B,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,kBAAkB,CAAA;AAChC,cAAc,iBAAiB,CAAA;AAG/B,cAAc,0BAA0B,CAAA;AACxC,cAAc,oBAAoB,CAAA;AAClC,cAAc,uBAAuB,CAAA;AACrC,cAAc,yBAAyB,CAAA;AACvC,cAAc,+BAA+B,CAAA;AAC7C,cAAc,2BAA2B,CAAA;AACzC,cAAc,2BAA2B,CAAA;AACzC,cAAc,mCAAmC,CAAA;AACjD,cAAc,2BAA2B,CAAA;AACzC,cAAc,wBAAwB,CAAA;AACtC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,2BAA2B,CAAA;AACzC,cAAc,qBAAqB,CAAA;AACnC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,mBAAmB,CAAA;AACjC,cAAc,kBAAkB,CAAA;AAChC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,yBAAyB,CAAA;AACvC,cAAc,0BAA0B,CAAA;AACxC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,gCAAgC,CAAA;AAC9C,cAAc,2BAA2B,CAAA;AACzC,cAAc,0BAA0B,CAAA;AACxC,cAAc,mBAAmB,CAAA;AACjC,cAAc,uBAAuB,CAAA;AACrC,cAAc,mBAAmB,CAAA;AACjC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,sBAAsB,CAAA;AACpC,cAAc,6BAA6B,CAAA;AAC3C,cAAc,yBAAyB,CAAA;AACvC,cAAc,uBAAuB,CAAA;AACrC,cAAc,uBAAuB,CAAA;AACrC,cAAc,qBAAqB,CAAA;AACnC,cAAc,4BAA4B,CAAA;AAC1C,cAAc,uBAAuB,CAAA;AACrC,cAAc,wBAAwB,CAAA;AACtC,cAAc,wBAAwB,CAAA;AAGtC,cAAc,uBAAuB,CAAA"}