@ripple-ui/svelte 0.0.0-stage → 0.8.2

package/dist/intent/layouts/TableLayout.svelte.d.ts

@@ -0,0 +1,9 @@
+import type { LayoutInput } from '../layout-adapter.js';
+interface Props {
+    input: LayoutInput;
+    /** Called when the user clicks a row. */
+    onRowSelect?: (item: Record<string, unknown>) => void;
+}
+declare const TableLayout: import("svelte").Component<Props, {}, "">;
+type TableLayout = ReturnType<typeof TableLayout>;
+export default TableLayout;

package/dist/intent/layouts/TimelineLayout.svelte

@@ -0,0 +1,81 @@
+<!--
+  TimelineLayout.svelte — designed chronological-timeline layout (Wave 3: ported layouts).
+  Created 2026-06-07.
+  Ripple-native port of ocean-flow's TimelineLayout. Instead of re-implementing
+  the rail/dot/connector markup with shadcn + genesis IconWidget, this COMPOSES
+  ripple's existing `Timeline` widget (widgets/research/Timeline.svelte) — one
+  source of truth for timeline chrome.
+
+  Routed for the `timeline` display hint (display.layout='timeline'). The adapter
+  feeds structured `items`; this maps each item (via the field mapping) to the
+  Timeline widget's {date, title, detail, type} event shape. PURE — reads only
+  `input` from the adapter, no fetch / service. No top-level $state (renders as a
+  child only; avoids the repo's mounted-entry $state flake).
+-->
+<script lang="ts">
+  import Timeline from '../../widgets/research/Timeline.svelte';
+  import EmptyState from '../../widgets/display/EmptyState.svelte';
+  import type { LayoutInput } from '../layout-adapter.js';
+
+  interface Props {
+    input: LayoutInput;
+  }
+
+  let { input }: Props = $props();
+
+  const fields = $derived(input.fields);
+  const items = $derived(input.items);
+
+  function field(item: Record<string, unknown>, key: string): unknown {
+    const mapped = fields[key];
+    return mapped ? item[mapped] : undefined;
+  }
+
+  function asString(v: unknown): string {
+    return v == null ? '' : String(v);
+  }
+
+  // Map the adapter's generic items to the Timeline widget's event shape. The
+  // date reads from the field-mapped `subtitle` (genesis put dates there) or a
+  // literal `date` key; the body reads `description`.
+  const events = $derived(
+    items.map((item) => ({
+      date: asString(field(item, 'subtitle') ?? item.date),
+      title: asString(field(item, 'title') ?? item.title),
+      detail: asString(field(item, 'description') ?? item.description) || undefined,
+      type: (item.type as 'default' | 'success' | 'warning' | 'error' | 'info') ?? 'default',
+      color: item.color as string | undefined,
+    })),
+  );
+</script>
+
+{#if events.length === 0}
+  <EmptyState title="No events" description="There's nothing on this timeline yet." icon="clock" />
+{:else}
+  <div class="timeline-layout">
+    {#if input.title}
+      <h2 class="timeline-layout__title">{input.title}</h2>
+    {/if}
+    {#if input.description}
+      <p class="timeline-layout__description">{input.description}</p>
+    {/if}
+    <Timeline {events} />
+  </div>
+{/if}
+
+<style>
+  .timeline-layout {
+    display: flex;
+    flex-direction: column;
+    gap: 0.75rem;
+  }
+  .timeline-layout__title {
+    font-size: 1.125rem;
+    font-weight: 600;
+    color: var(--ripple-foreground, inherit);
+  }
+  .timeline-layout__description {
+    font-size: 0.875rem;
+    color: var(--ripple-muted-foreground, inherit);
+  }
+</style>

package/dist/intent/layouts/TimelineLayout.svelte.d.ts

@@ -0,0 +1,7 @@
+import type { LayoutInput } from '../layout-adapter.js';
+interface Props {
+    input: LayoutInput;
+}
+declare const TimelineLayout: import("svelte").Component<Props, {}, "">;
+type TimelineLayout = ReturnType<typeof TimelineLayout>;
+export default TimelineLayout;

package/dist/intent/pattern-detector.d.ts

@@ -0,0 +1,72 @@
+/**
+ * @file pattern-detector.ts
+ * @description Detects UI patterns (quiz, results) and transforms data.
+ * Extracted from IntentRenderer for modularity.
+ * @changes
+ *   - 2026-09-17: field coercions route through asText (objects → JSON, not
+ *     "[object Object]") — oxlint no-base-to-string sweep
+ *   - 2026-06-08: isQuizPattern / isResultsPattern now require EVERY item to fit
+ *     (was `.some(...)`). A single matching item no longer flips a mixed array to
+ *     quiz/results — that false-positive could also drop the non-matching items.
+ *     `length === 0 → false` guard and intent checks unchanged; isChartPattern's
+ *     first-item heuristic is intentionally left as-is.
+ */
+type FieldMapping = Record<string, string>;
+export interface QuizOption {
+    id: string;
+    text: string;
+    correct: boolean;
+}
+export interface ResultsItem {
+    label: string;
+    value: string;
+    icon?: string;
+    highlight?: boolean;
+}
+/**
+ * Detect if this is a quiz pattern:
+ * - Intent is 'select'
+ * - Items have 'correct' field
+ */
+export declare function isQuizPattern(spec: {
+    intent: string;
+}, items: Record<string, unknown>[]): boolean;
+/**
+ * Detect if this is a results/summary pattern:
+ * - Intent is 'info'
+ * - Items have 'label' and 'value' fields
+ */
+export declare function isResultsPattern(spec: {
+    intent: string;
+}, items: Record<string, unknown>[]): boolean;
+/**
+ * Convert items to quiz options format
+ */
+export declare function toQuizOptions(items: Record<string, unknown>[], fields?: FieldMapping): QuizOption[];
+/**
+ * Convert items to results summary format
+ */
+export declare function toResultsItems(items: Record<string, unknown>[]): ResultsItem[];
+export interface ChartDataPoint {
+    label: string;
+    value: number;
+    [key: string]: unknown;
+}
+/**
+ * Detect if this is a chart pattern:
+ * - Intent is 'info'
+ * - Items have numeric values
+ * - Items have label/category field
+ * - OR display.chart_type is explicitly set
+ */
+export declare function isChartPattern(spec: {
+    intent: string;
+    display?: {
+        chart_type?: string;
+    };
+}, items: Record<string, unknown>[]): boolean;
+/**
+ * Convert items to chart data format
+ */
+export declare function toChartData(items: Record<string, unknown>[], fields?: FieldMapping): ChartDataPoint[];
+export {};

package/dist/intent/pattern-detector.js

@@ -0,0 +1,102 @@
+/**
+ * @file pattern-detector.ts
+ * @description Detects UI patterns (quiz, results) and transforms data.
+ * Extracted from IntentRenderer for modularity.
+ * @changes
+ *   - 2026-09-17: field coercions route through asText (objects → JSON, not
+ *     "[object Object]") — oxlint no-base-to-string sweep
+ *   - 2026-06-08: isQuizPattern / isResultsPattern now require EVERY item to fit
+ *     (was `.some(...)`). A single matching item no longer flips a mixed array to
+ *     quiz/results — that false-positive could also drop the non-matching items.
+ *     `length === 0 → false` guard and intent checks unchanged; isChartPattern's
+ *     first-item heuristic is intentionally left as-is.
+ */
+import { asText } from '../widgets/text-coerce.js';
+// ============================================================================
+// Pattern Detection
+// ============================================================================
+/**
+ * Detect if this is a quiz pattern:
+ * - Intent is 'select'
+ * - Items have 'correct' field
+ */
+export function isQuizPattern(spec, items) {
+    if (spec.intent !== 'select')
+        return false;
+    if (items.length === 0)
+        return false;
+    return items.every((item) => 'correct' in item);
+}
+/**
+ * Detect if this is a results/summary pattern:
+ * - Intent is 'info'
+ * - Items have 'label' and 'value' fields
+ */
+export function isResultsPattern(spec, items) {
+    if (spec.intent !== 'info')
+        return false;
+    if (items.length === 0)
+        return false;
+    return items.every((item) => 'label' in item && 'value' in item);
+}
+// ============================================================================
+// Data Transformers
+// ============================================================================
+/**
+ * Convert items to quiz options format
+ */
+export function toQuizOptions(items, fields) {
+    const idField = fields?.id || 'id';
+    const titleField = fields?.title || 'title';
+    return items.map((item) => ({
+        id: asText(item[idField] || item.id),
+        text: asText(item[titleField] || item.option || item.text || ''),
+        correct: Boolean(item.correct)
+    }));
+}
+/**
+ * Convert items to results summary format
+ */
+export function toResultsItems(items) {
+    return items.map((item) => ({
+        label: asText(item.label || ''),
+        value: asText(item.value || ''),
+        icon: item.icon ? asText(item.icon) : undefined,
+        highlight: Boolean(item.highlight)
+    }));
+}
+/**
+ * Detect if this is a chart pattern:
+ * - Intent is 'info'
+ * - Items have numeric values
+ * - Items have label/category field
+ * - OR display.chart_type is explicitly set
+ */
+export function isChartPattern(spec, items) {
+    // Explicit chart type in display hints
+    if (spec.display?.chart_type)
+        return true;
+    // Auto-detect from data structure
+    if (spec.intent !== 'info')
+        return false;
+    if (items.length === 0)
+        return false;
+    const first = items[0];
+    // Check for numeric values
+    const hasNumeric = Object.values(first).some(v => typeof v === 'number');
+    // Check for label field
+    const hasLabel = 'label' in first || 'name' in first || 'category' in first || 'title' in first;
+    return hasNumeric && hasLabel;
+}
+/**
+ * Convert items to chart data format
+ */
+export function toChartData(items, fields) {
+    const labelField = fields?.title || 'label';
+    const valueField = fields?.value || fields?.price || 'value';
+    return items.map(item => ({
+        label: asText(item[labelField] || item.label || item.name || item.category || ''),
+        value: Number(item[valueField] || item.value || 0),
+        ...item
+    }));
+}

package/dist/intent/slides-partition.d.ts

@@ -0,0 +1,40 @@
+/**
+ * @file slides-partition.ts
+ * @description Pure helpers for the `slides` intent layout (SP-4). Splits a
+ * UniversalSpec into an ordered list of slide nodes and clamps a slide index to
+ * the deck range. Kept framework-free (no Svelte) so the partition rule is unit
+ * testable without a DOM or the Ripple context.
+ *
+ * Partition order (first non-empty source wins):
+ *   1. `spec.sections` — an explicit, ordered array of slide nodes. Not a core
+ *      UniversalSpec field, so it only survives when the spec reaches the layout
+ *      un-normalized (e.g. a direct render or a test); read defensively via a
+ *      cast. Supported because the SP-4 brief asks the layout to "handle both".
+ *   2. `spec.ui.children` — the canonical live path: each top-level child of the
+ *      root `ui` node becomes one slide.
+ *   3. `spec.ui` — a single-slide fallback when the root has no children.
+ *   4. `[]` — nothing renderable.
+ *
+ * @created 2026-06-28 (SP-4 — slides intent layout)
+ */
+import { type UINode, type UniversalSpec } from '@ripple-ui/core';
+/** A spec that may also carry the optional, non-core `sections` slide array. */
+type SlidesSpec = (UniversalSpec | {
+    ui?: UINode;
+    sections?: unknown;
+}) & {
+    sections?: unknown;
+};
+/**
+ * Split a spec into its ordered slide nodes. Each returned node is rendered as
+ * one full-bleed slide through NodeRenderer. See the file header for the source
+ * precedence; the result is always a fresh array (never the spec's own array).
+ */
+export declare function partitionSlides(spec: SlidesSpec | null | undefined): UINode[];
+/**
+ * Clamp a slide index into the valid range `[0, total - 1]`. An empty deck
+ * (total <= 0) clamps to 0. Used for Prev/Next/dot navigation so the deck never
+ * lands out of bounds (no wrap-around — first/last are hard stops).
+ */
+export declare function clampIndex(index: number, total: number): number;
+export {};

package/dist/intent/slides-partition.js

@@ -0,0 +1,67 @@
+/**
+ * @file slides-partition.ts
+ * @description Pure helpers for the `slides` intent layout (SP-4). Splits a
+ * UniversalSpec into an ordered list of slide nodes and clamps a slide index to
+ * the deck range. Kept framework-free (no Svelte) so the partition rule is unit
+ * testable without a DOM or the Ripple context.
+ *
+ * Partition order (first non-empty source wins):
+ *   1. `spec.sections` — an explicit, ordered array of slide nodes. Not a core
+ *      UniversalSpec field, so it only survives when the spec reaches the layout
+ *      un-normalized (e.g. a direct render or a test); read defensively via a
+ *      cast. Supported because the SP-4 brief asks the layout to "handle both".
+ *   2. `spec.ui.children` — the canonical live path: each top-level child of the
+ *      root `ui` node becomes one slide.
+ *   3. `spec.ui` — a single-slide fallback when the root has no children.
+ *   4. `[]` — nothing renderable.
+ *
+ * @created 2026-06-28 (SP-4 — slides intent layout)
+ */
+import {} from '@ripple-ui/core';
+/** Truthy object guard — a renderable slide node is at minimum a non-null object. */
+function isNode(value) {
+    return !!value && typeof value === 'object';
+}
+/**
+ * Split a spec into its ordered slide nodes. Each returned node is rendered as
+ * one full-bleed slide through NodeRenderer. See the file header for the source
+ * precedence; the result is always a fresh array (never the spec's own array).
+ */
+export function partitionSlides(spec) {
+    if (!spec || typeof spec !== 'object')
+        return [];
+    // 1. Explicit sections array (handled defensively — not a core spec field).
+    const sections = spec.sections;
+    if (Array.isArray(sections)) {
+        const slides = sections.filter(isNode);
+        if (slides.length > 0)
+            return slides;
+    }
+    // 2. Canonical path: each child of the root ui node is a slide.
+    const ui = spec.ui;
+    const children = ui?.children;
+    if (Array.isArray(children)) {
+        const slides = children.filter(isNode);
+        if (slides.length > 0)
+            return slides;
+    }
+    // 3. Single-slide fallback: the whole ui tree is one slide.
+    if (isNode(ui))
+        return [ui];
+    // 4. Nothing to present.
+    return [];
+}
+/**
+ * Clamp a slide index into the valid range `[0, total - 1]`. An empty deck
+ * (total <= 0) clamps to 0. Used for Prev/Next/dot navigation so the deck never
+ * lands out of bounds (no wrap-around — first/last are hard stops).
+ */
+export function clampIndex(index, total) {
+    if (total <= 0)
+        return 0;
+    if (!Number.isFinite(index) || index < 0)
+        return 0;
+    if (index > total - 1)
+        return total - 1;
+    return Math.floor(index);
+}

package/dist/manifest/actions.d.ts

@@ -0,0 +1,7 @@
+/**
+ * @file manifest/actions.ts
+ * @description Re-export. The action grammar moved to
+ * `@ripple-ui/core/manifest` on 2026-09-27 because it documents the engine,
+ * not a widget. Kept so existing imports of this path keep working.
+ */
+export { manifestActions } from '@ripple-ui/core/manifest';

package/dist/manifest/actions.js

@@ -0,0 +1,7 @@
+/**
+ * @file manifest/actions.ts
+ * @description Re-export. The action grammar moved to
+ * `@ripple-ui/core/manifest` on 2026-09-27 because it documents the engine,
+ * not a widget. Kept so existing imports of this path keep working.
+ */
+export { manifestActions } from '@ripple-ui/core/manifest';

package/dist/manifest/entries/accordion.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetManifestEntry } from '../index.js';
+export declare const accordionEntry: WidgetManifestEntry;

package/dist/manifest/entries/accordion.js

@@ -0,0 +1,20 @@
+export const accordionEntry = {
+    type: 'accordion',
+    category: 'layout',
+    description: 'Expandable accordion with single or multiple open items. Use for FAQs and progressive disclosure.',
+    props: {
+        multiple: { type: 'boolean', required: false, description: 'Allow multiple items open at once. Default false.' },
+        value: { type: 'string | string[]', required: false, description: 'Currently open item value(s).' },
+        items: { type: 'Array<{ value: string; title: string; content: string }>', required: true, description: 'Accordion items.' },
+    },
+    example: {
+        type: 'accordion',
+        props: {
+            multiple: false,
+            items: [
+                { value: 'shipping', title: 'How long does shipping take?', content: 'Most orders arrive within 3-5 business days.' },
+                { value: 'returns', title: 'What is the return policy?', content: 'Free returns within 30 days of purchase.' },
+            ],
+        },
+    },
+};

package/dist/manifest/entries/agenda.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetManifestEntry } from '../index.js';
+export declare const agendaEntry: WidgetManifestEntry;

package/dist/manifest/entries/agenda.js

@@ -0,0 +1,30 @@
+export const agendaEntry = {
+    type: 'agenda',
+    category: 'composite',
+    description: 'Meeting agenda app: start "HH:MM", items[{title, owner?, minutes, notes?}]; start times, time share bar, tick done, reorder, run mode with a countdown. Bind value.',
+    props: {
+        title: { type: 'string', required: true, description: 'e.g. "Weekly team sync".' },
+        start: { type: 'string', required: false, description: 'Start time "HH:MM" (24 h). Without it items show offsets like +0:15.' },
+        items: {
+            type: 'Array<{ id?: string; title: string; owner?: string; minutes: number; notes?: string; done?: boolean }>',
+            required: true,
+            description: '1 to 30 items in running order. minutes 1 to 240. Keep notes to one short line.',
+        },
+        sound: { type: 'boolean', required: false, description: "A soft chime when the running item's time is up. Default true; false mutes this widget." },
+    },
+    example: {
+        type: 'agenda',
+        bind: '{state.agenda}',
+        props: {
+            title: 'Weekly team sync',
+            start: '10:00',
+            items: [
+                { title: 'Wins from last week', owner: 'Maya Chen', minutes: 5 },
+                { title: 'Metrics review', owner: 'Leo Park', minutes: 8, notes: 'Signups, churn, support load' },
+                { title: 'Launch checklist', owner: 'Ana Ruiz', minutes: 10 },
+                { title: 'Blockers', minutes: 5 },
+                { title: 'Actions and owners', owner: 'Maya Chen', minutes: 2 },
+            ],
+        },
+    },
+};

package/dist/manifest/entries/alert.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetManifestEntry } from '../index.js';
+export declare const alertEntry: WidgetManifestEntry;

package/dist/manifest/entries/alert.js

@@ -0,0 +1,12 @@
+export const alertEntry = {
+    type: 'alert',
+    category: 'overlay',
+    description: 'Alert box with title, description, and visual variant (info/success/warning/destructive).',
+    props: {
+        title: { type: 'string', required: false, description: 'Alert title.' },
+        description: { type: 'string', required: false, description: 'Alert description text.' },
+        variant: { type: '"info" | "success" | "warning" | "destructive" | "default"', required: false, description: 'Visual variant with icon and color.' },
+        hideIcon: { type: 'boolean', required: false, description: 'Hide the leading icon.' },
+    },
+    example: { type: 'alert', props: { title: 'System update', description: 'Your application will restart in 5 minutes.', variant: 'info' } },
+};

package/dist/manifest/entries/analyst-bar.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetManifestEntry } from '../index.js';
+export declare const analystBarEntry: WidgetManifestEntry;

package/dist/manifest/entries/analyst-bar.js

@@ -0,0 +1,13 @@
+export const analystBarEntry = {
+    type: 'analyst-bar',
+    category: 'research',
+    description: 'Analyst recommendation bar: Buy/Hold/Sell distribution with consensus label and target price.',
+    props: {
+        buy: { type: 'number', required: true, description: 'Buy/Overweight ratings count.' },
+        hold: { type: 'number', required: true, description: 'Hold ratings count.' },
+        sell: { type: 'number', required: true, description: 'Sell/Underweight ratings count.' },
+        consensus: { type: 'string', required: false, description: 'Consensus label (e.g. "Strong Buy").' },
+        target: { type: 'string', required: false, description: 'Average target price.' },
+    },
+    example: { type: 'analyst-bar', props: { buy: 18, hold: 8, sell: 2, consensus: 'Strong Buy', target: '$210.50' } },
+};

package/dist/manifest/entries/analytics-dashboard.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetManifestEntry } from '../index.js';
+export declare const analyticsDashboardEntry: WidgetManifestEntry;

package/dist/manifest/entries/analytics-dashboard.js

@@ -0,0 +1,87 @@
+export const analyticsDashboardEntry = {
+    type: 'analytics-dashboard',
+    category: 'composite',
+    description: 'Analytics archetype: hero headline metric with period comparison → dominant time-series chart → small-chart breakdown row → top-items table.',
+    props: {
+        title: { type: 'string', required: false, description: 'Page title.' },
+        subtitle: { type: 'string', required: false, description: 'Subheading.' },
+        dateRange: { type: 'string', required: false, description: 'Date-range chip.' },
+        headline: { type: '{ label: string; value: string | number; delta?: string; trend?: "up" | "down" | "flat"; comparison?: string; sparkline?: number[] }', required: false, description: 'The "big number" hero: center stage, with sparkline and period comparison.' },
+        secondaryMetrics: { type: 'Array<{ label: string; value: string | number; delta?: string; trend?: "up" | "down" | "flat"; sublabel?: string }>', required: false, description: 'Smaller cards next to the headline.' },
+        primaryChart: { type: '{ title?: string; subtitle?: string; type?: "bar" | "line" | "area" | "pie" | "donut" | "radar" | "heatmap"; data: DataPoint[]; height?: number; colors?: string[] }', required: false, description: 'Dominant time-series chart.' },
+        breakdowns: { type: 'Array<ChartConfig>', required: false, description: 'Small charts in a responsive row (e.g. by source / device / region).' },
+        topItems: { type: '{ title?: string; columns: Array<{ key: string; label: string; align?: "left" | "right" | "center" }>; rows: Record<string, unknown>[] }', required: false, description: 'Top items / pages / referrers table.' },
+    },
+    example: {
+        type: 'analytics-dashboard',
+        props: {
+            title: 'Web traffic',
+            subtitle: 'docs.acme.com — Last 30 days',
+            dateRange: 'Last 30 days',
+            headline: {
+                label: 'Visitors',
+                value: '482k',
+                delta: '+22.4%',
+                trend: 'up',
+                comparison: 'vs prior 30 days',
+                sparkline: [12, 14, 18, 16, 20, 22, 26, 24, 28, 32, 36, 38, 42, 48]
+            },
+            secondaryMetrics: [
+                { label: 'Pageviews', value: '1.6M', delta: '+18%', trend: 'up', sublabel: '3.3 per visit' },
+                { label: 'Avg session', value: '2m 14s', delta: '+8s', trend: 'up' },
+                { label: 'Bounce rate', value: '38%', delta: '-3pp', trend: 'down' },
+                { label: 'New visitors', value: '62%', delta: '+4pp', trend: 'up' },
+                { label: 'Signups', value: 1284, delta: '+182', trend: 'up', sublabel: '2.7% conv.' },
+                { label: 'Goal completions', value: 612, delta: '+88', trend: 'up', sublabel: 'Trial start' }
+            ],
+            primaryChart: {
+                title: 'Visitors by day',
+                subtitle: 'Daily unique visitors over the last 30 days',
+                type: 'area',
+                data: Array.from({ length: 30 }, (_, i) => ({
+                    label: `Day ${i + 1}`,
+                    value: 9000 + Math.round(Math.sin(i / 3) * 2400 + i * 320 + (i > 22 ? 1200 : 0))
+                }))
+            },
+            breakdowns: [
+                { title: 'By source', type: 'donut', data: [
+                        { label: 'Direct', value: 38 }, { label: 'Search', value: 33 },
+                        { label: 'Social', value: 14 }, { label: 'Referral', value: 10 }, { label: 'Email', value: 5 }
+                    ] },
+                { title: 'By device', type: 'donut', data: [
+                        { label: 'Desktop', value: 62 }, { label: 'Mobile', value: 32 }, { label: 'Tablet', value: 6 }
+                    ] },
+                { title: 'By region', type: 'bar', data: [
+                        { label: 'NA', value: 220 }, { label: 'EU', value: 154 },
+                        { label: 'APAC', value: 78 }, { label: 'LATAM', value: 30 }, { label: 'MEA', value: 14 }
+                    ] },
+                { title: 'By browser', type: 'bar', data: [
+                        { label: 'Chrome', value: 58 }, { label: 'Safari', value: 22 },
+                        { label: 'Firefox', value: 9 }, { label: 'Edge', value: 8 }, { label: 'Other', value: 3 }
+                    ] }
+            ],
+            topItems: {
+                title: 'Top pages',
+                columns: [
+                    { key: 'page', label: 'Page' },
+                    { key: 'views', label: 'Views', align: 'right' },
+                    { key: 'unique', label: 'Unique', align: 'right' },
+                    { key: 'avg', label: 'Avg time', align: 'right' },
+                    { key: 'bounce', label: 'Bounce', align: 'right' }
+                ],
+                rows: [
+                    { page: '/getting-started', views: '92k', unique: '64k', avg: '3m 12s', bounce: '24%' },
+                    { page: '/api', views: '64k', unique: '41k', avg: '4m 02s', bounce: '18%' },
+                    { page: '/pricing', views: '48k', unique: '38k', avg: '1m 18s', bounce: '42%' },
+                    { page: '/docs/auth', views: '38k', unique: '22k', avg: '2m 44s', bounce: '28%' },
+                    { page: '/docs/quickstart', views: '32k', unique: '24k', avg: '5m 18s', bounce: '14%' },
+                    { page: '/changelog', views: '28k', unique: '19k', avg: '1m 02s', bounce: '52%' },
+                    { page: '/faq', views: '24k', unique: '18k', avg: '0m 54s', bounce: '61%' },
+                    { page: '/blog/launch', views: '21k', unique: '17k', avg: '2m 32s', bounce: '34%' },
+                    { page: '/integrations', views: '18k', unique: '13k', avg: '1m 48s', bounce: '38%' },
+                    { page: '/security', views: '14k', unique: '11k', avg: '2m 04s', bounce: '29%' }
+                ]
+            }
+        },
+    },
+};

package/dist/manifest/entries/animated-beam.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetManifestEntry } from '../index.js';
+export declare const animatedBeamEntry: WidgetManifestEntry;

package/dist/manifest/entries/animated-beam.js

@@ -0,0 +1,16 @@
+export const animatedBeamEntry = {
+    type: 'animated-beam',
+    category: 'display',
+    description: 'An SVG curve with a flowing gradient pulse connecting two points (pure SVG/CSS). Use to suggest a connection or data flow in a diagram.',
+    props: {
+        duration: { type: 'number', required: false, description: 'Seconds per flow. Default 4.' },
+        curvature: { type: 'number', required: false, description: 'Arc height in viewBox units (negative bows up). Default -40.' },
+        gradientStart: { type: 'string', required: false, description: 'Gradient start colour. Default #18CCFC.' },
+        gradientStop: { type: 'string', required: false, description: 'Gradient stop colour. Default #AE48FF.' },
+    },
+    example: {
+        type: 'animated-beam',
+        props: { duration: 4, curvature: -50 },
+        class: 'h-24 text-muted-foreground',
+    },
+};

package/dist/manifest/entries/api-key.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetManifestEntry } from '../index.js';
+export declare const apiKeyEntry: WidgetManifestEntry;

package/dist/manifest/entries/api-key.js

@@ -0,0 +1,14 @@
+export const apiKeyEntry = {
+    type: 'api-key',
+    category: 'vertical',
+    description: 'Secret key display with mask/reveal toggle, copy button, and optional rotate action.',
+    props: {
+        label: { type: 'string', required: false, description: 'Field label.' },
+        value: { type: 'string', required: false, description: 'Secret value to display.' },
+        description: { type: 'string', required: false, description: 'Helper text under the label.' },
+        hideReveal: { type: 'boolean', required: false, description: 'Hide reveal toggle.' },
+        hideRotate: { type: 'boolean', required: false, description: 'Hide rotate button.' },
+        revealLast: { type: 'number', required: false, description: 'Trailing chars visible when masked. Default 4.' },
+    },
+    example: { type: 'api-key', props: { label: 'Live API Key', description: 'Use in production.', value: 'sk_live_9x8y7z6a5b4c3d2e1f0g9h8i7j6k5l4', revealLast: 4 } },
+};

package/dist/manifest/entries/app-shell.d.ts

@@ -0,0 +1,2 @@
+import type { WidgetManifestEntry } from '../index.js';
+export declare const appShellEntry: WidgetManifestEntry;