@zvk/composite 0.1.1 → 0.1.3

package/dist/workflows/process-list-panel.d.ts

@@ -0,0 +1,26 @@
+import * as React from "react";
+import { type WorkflowStatusTone } from "./workflow-status-card.js";
+export interface ProcessListPanelItem {
+    readonly id: string;
+    readonly title: React.ReactNode;
+    readonly description?: React.ReactNode;
+    readonly status: React.ReactNode;
+    readonly tone?: WorkflowStatusTone;
+    readonly progressValue?: number;
+    readonly progressLabel?: React.ReactNode;
+    readonly metadata?: React.ReactNode;
+    readonly details?: React.ReactNode;
+    readonly actions?: React.ReactNode;
+}
+export interface ProcessListPanelProps extends Omit<React.ComponentPropsWithoutRef<"section">, "title" | "children"> {
+    readonly title: React.ReactNode;
+    readonly description?: React.ReactNode;
+    readonly items: readonly ProcessListPanelItem[];
+    readonly empty?: React.ReactNode;
+    readonly loading?: boolean;
+    readonly actions?: React.ReactNode;
+    readonly footer?: React.ReactNode;
+    readonly renderItem?: (item: ProcessListPanelItem) => React.ReactNode;
+    readonly ref?: React.Ref<HTMLElement>;
+}
+export declare function ProcessListPanel({ actions, className, description, empty, footer, items, loading, ref, renderItem, title, ...props }: ProcessListPanelProps): React.JSX.Element;

package/dist/workflows/process-list-panel.js

@@ -0,0 +1,24 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Spinner } from "@zvk/ui/spinner";
+import { cn } from "../utils/cn.js";
+import { WorkflowStatusCard } from "./workflow-status-card.js";
+function hasValue(value) {
+    return value !== null && value !== undefined && value !== false;
+}
+function renderDefaultItem(item) {
+    const cardProps = {
+        ...(item.description !== undefined ? { description: item.description } : {}),
+        ...(item.tone !== undefined ? { tone: item.tone } : {}),
+        ...(item.progressValue !== undefined ? { progressValue: item.progressValue } : {}),
+        ...(item.progressLabel !== undefined ? { progressLabel: item.progressLabel } : {}),
+        ...(item.metadata !== undefined ? { metadata: item.metadata } : {}),
+        ...(item.details !== undefined ? { details: item.details } : {}),
+        ...(item.actions !== undefined ? { actions: item.actions } : {})
+    };
+    return (_jsx(WorkflowStatusCard, { ...cardProps, status: item.status, title: item.title }));
+}
+export function ProcessListPanel({ actions, className, description, empty = "No work items.", footer, items, loading = false, ref, renderItem, title, ...props }) {
+    const hasItems = items.length > 0;
+    return (_jsxs("section", { ...props, ref: ref, "aria-busy": loading ? true : props["aria-busy"], className: cn("zvk-composite-process-list-panel", className), "data-loading": loading ? "" : undefined, children: [_jsxs("div", { className: "zvk-composite-process-list-panel__header", children: [_jsxs("div", { className: "zvk-composite-process-list-panel__copy", children: [_jsx("h3", { className: "zvk-composite-process-list-panel__title", children: title }), hasValue(description) ? (_jsx("p", { className: "zvk-composite-process-list-panel__description", children: description })) : null] }), hasValue(actions) ? _jsx("div", { className: "zvk-composite-process-list-panel__actions", children: actions }) : null] }), _jsxs("div", { className: "zvk-composite-process-list-panel__body", children: [loading ? (_jsxs("div", { className: "zvk-composite-process-list-panel__state", "data-state": "loading", children: [_jsx(Spinner, { label: "Loading work items", size: "sm", tone: "muted" }), _jsx("span", { children: "Loading work items..." })] })) : null, !loading && !hasItems ? (_jsx("div", { className: "zvk-composite-process-list-panel__state", "data-state": "empty", children: empty })) : null, !loading && hasItems ? (_jsx("ul", { className: "zvk-composite-process-list-panel__list", children: items.map((item) => (_jsx("li", { className: "zvk-composite-process-list-panel__item", children: renderItem ? renderItem(item) : renderDefaultItem(item) }, item.id))) })) : null] }), hasValue(footer) ? _jsx("div", { className: "zvk-composite-process-list-panel__footer", children: footer }) : null] }));
+}

package/dist/workflows/workflow-status-card.d.ts

@@ -0,0 +1,20 @@
+import * as React from "react";
+export type WorkflowStatusTone = "queued" | "running" | "success" | "warning" | "danger" | "neutral";
+export interface WorkflowStatusCardProps extends Omit<React.HTMLAttributes<HTMLElement>, "title"> {
+    title: React.ReactNode;
+    description?: React.ReactNode;
+    status: React.ReactNode;
+    tone?: WorkflowStatusTone;
+    progressValue?: number;
+    progressMax?: number;
+    progressLabel?: React.ReactNode;
+    currentStep?: React.ReactNode;
+    metadata?: React.ReactNode;
+    details?: React.ReactNode;
+    error?: React.ReactNode;
+    actions?: React.ReactNode;
+    footer?: React.ReactNode;
+    loading?: boolean;
+    ref?: React.Ref<HTMLElement>;
+}
+export declare function WorkflowStatusCard({ actions, className, currentStep, description, details, error, footer, loading, metadata, progressLabel, progressMax, progressValue, ref, status, title, tone, ...props }: WorkflowStatusCardProps): React.JSX.Element;

package/dist/workflows/workflow-status-card.js

@@ -0,0 +1,46 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import * as React from "react";
+import { Badge } from "@zvk/ui/badge";
+import { Spinner } from "@zvk/ui/spinner";
+import { cn } from "../utils/cn.js";
+function hasValue(value) {
+    return value !== null && value !== undefined && value !== false;
+}
+function getBadgeTone(tone) {
+    if (tone === "danger") {
+        return "destructive";
+    }
+    if (tone === "running") {
+        return "primary";
+    }
+    if (tone === "queued") {
+        return "info";
+    }
+    return tone;
+}
+function getProgressState(value, max) {
+    const normalizedMax = Number.isFinite(max) && max !== undefined && max > 0 ? max : 100;
+    if (value === undefined || !Number.isFinite(value)) {
+        return {
+            indeterminate: true,
+            max: normalizedMax,
+            percentage: undefined,
+            value: undefined
+        };
+    }
+    const normalizedValue = Math.min(Math.max(value, 0), normalizedMax);
+    return {
+        indeterminate: false,
+        max: normalizedMax,
+        percentage: (normalizedValue / normalizedMax) * 100,
+        value: normalizedValue
+    };
+}
+export function WorkflowStatusCard({ actions, className, currentStep, description, details, error, footer, loading = false, metadata, progressLabel, progressMax, progressValue, ref, status, title, tone = "neutral", ...props }) {
+    const progress = getProgressState(progressValue, progressMax);
+    const showProgress = progressValue !== undefined || progressLabel !== undefined || currentStep !== undefined;
+    const showAside = loading || hasValue(status) || hasValue(actions);
+    return (_jsxs("article", { ...props, ref: ref, "aria-busy": loading ? true : props["aria-busy"], className: cn("zvk-composite-workflow-status-card", className), "data-loading": loading ? "" : undefined, "data-tone": tone, children: [_jsxs("div", { className: "zvk-composite-workflow-status-card__header", children: [_jsxs("div", { className: "zvk-composite-workflow-status-card__copy", children: [_jsx("h3", { className: "zvk-composite-workflow-status-card__title", children: title }), hasValue(description) ? _jsx("p", { className: "zvk-composite-workflow-status-card__description", children: description }) : null] }), showAside ? (_jsxs("div", { className: "zvk-composite-workflow-status-card__aside", children: [loading ? _jsx(Spinner, { label: "Loading workflow status", size: "sm", tone: "muted" }) : null, hasValue(status) ? (_jsx(Badge, { tone: getBadgeTone(tone), variant: "soft", children: status })) : null, hasValue(actions) ? _jsx("div", { className: "zvk-composite-workflow-status-card__actions", children: actions }) : null] })) : null] }), hasValue(metadata) ? _jsx("div", { className: "zvk-composite-workflow-status-card__metadata", children: metadata }) : null, showProgress ? (_jsxs("div", { className: "zvk-composite-workflow-status-card__progress-group", children: [_jsxs("div", { className: "zvk-composite-workflow-status-card__progress-header", children: [hasValue(currentStep) ? _jsx("span", { className: "zvk-composite-workflow-status-card__step", children: currentStep }) : null, hasValue(progressLabel) ? _jsx("span", { className: "zvk-composite-workflow-status-card__progress-label", children: progressLabel }) : null] }), _jsx("div", { "aria-label": typeof progressLabel === "string" ? progressLabel : "Workflow progress", "aria-valuemax": progress.indeterminate ? undefined : progress.max, "aria-valuemin": progress.indeterminate ? undefined : 0, "aria-valuenow": progress.value, className: "zvk-composite-workflow-status-card__progress", "data-indeterminate": progress.indeterminate ? "" : undefined, role: "progressbar", style: {
+                            "--zvk-composite-workflow-status-card-progress": progress.percentage === undefined ? undefined : `${progress.percentage}%`
+                        }, children: _jsx("span", { className: "zvk-composite-workflow-status-card__progress-track", children: _jsx("span", { className: "zvk-composite-workflow-status-card__progress-indicator" }) }) })] })) : null, hasValue(details) ? _jsx("div", { className: "zvk-composite-workflow-status-card__details", children: details }) : null, hasValue(error) ? (_jsx("div", { className: "zvk-composite-workflow-status-card__error", role: "alert", children: error })) : null, hasValue(footer) ? _jsx("div", { className: "zvk-composite-workflow-status-card__footer", children: footer }) : null] }));
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@zvk/composite",
-  "version": "0.1.1",
+  "version": "0.1.3",
   "description": "Drop-in composite React components built from @zvk/ui primitives for product workspaces.",
   "private": false,
   "type": "module",
@@ -25,60 +25,154 @@
   "exports": {
     ".": {
       "types": "./dist/index.d.ts",
-      "import": "./dist/index.js"
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
     },
     "./styles.css": "./dist/styles.css",
+    "./activity-feed": {
+      "types": "./dist/activity/activity-feed.d.ts",
+      "import": "./dist/activity/activity-feed.js",
+      "default": "./dist/activity/activity-feed.js"
+    },
     "./app-workspace-shell": {
       "types": "./dist/navigation/app-workspace-shell.d.ts",
-      "import": "./dist/navigation/app-workspace-shell.js"
+      "import": "./dist/navigation/app-workspace-shell.js",
+      "default": "./dist/navigation/app-workspace-shell.js"
+    },
+    "./entity-switcher-menu": {
+      "types": "./dist/navigation/entity-switcher-menu.d.ts",
+      "import": "./dist/navigation/entity-switcher-menu.js",
+      "default": "./dist/navigation/entity-switcher-menu.js"
+    },
+    "./command-palette-shell": {
+      "types": "./dist/navigation/command-palette-shell.d.ts",
+      "import": "./dist/navigation/command-palette-shell.js",
+      "default": "./dist/navigation/command-palette-shell.js"
     },
     "./sectioned-workspace-shell": {
       "types": "./dist/navigation/sectioned-workspace-shell.d.ts",
-      "import": "./dist/navigation/sectioned-workspace-shell.js"
+      "import": "./dist/navigation/sectioned-workspace-shell.js",
+      "default": "./dist/navigation/sectioned-workspace-shell.js"
     },
     "./workspace-header": {
       "types": "./dist/navigation/workspace-header.d.ts",
-      "import": "./dist/navigation/workspace-header.js"
+      "import": "./dist/navigation/workspace-header.js",
+      "default": "./dist/navigation/workspace-header.js"
     },
     "./breadcrumb-page-header": {
       "types": "./dist/navigation/workspace-header.d.ts",
-      "import": "./dist/navigation/workspace-header.js"
+      "import": "./dist/navigation/workspace-header.js",
+      "default": "./dist/navigation/workspace-header.js"
     },
     "./page-scaffold": {
       "types": "./dist/layout/page-scaffold.d.ts",
-      "import": "./dist/layout/page-scaffold.js"
+      "import": "./dist/layout/page-scaffold.js",
+      "default": "./dist/layout/page-scaffold.js"
+    },
+    "./feature-shell": {
+      "types": "./dist/layout/feature-shell.d.ts",
+      "import": "./dist/layout/feature-shell.js",
+      "default": "./dist/layout/feature-shell.js"
     },
     "./state-surface": {
       "types": "./dist/state/state-surface.d.ts",
-      "import": "./dist/state/state-surface.js"
+      "import": "./dist/state/state-surface.js",
+      "default": "./dist/state/state-surface.js"
+    },
+    "./route-state-frame": {
+      "types": "./dist/state/route-state-frame.d.ts",
+      "import": "./dist/state/route-state-frame.js",
+      "default": "./dist/state/route-state-frame.js"
     },
     "./entity-card": {
       "types": "./dist/lists/entity-card.d.ts",
-      "import": "./dist/lists/entity-card.js"
+      "import": "./dist/lists/entity-card.js",
+      "default": "./dist/lists/entity-card.js"
     },
     "./entity-list-section": {
       "types": "./dist/lists/entity-list-section.d.ts",
-      "import": "./dist/lists/entity-list-section.js"
+      "import": "./dist/lists/entity-list-section.js",
+      "default": "./dist/lists/entity-list-section.js"
     },
     "./summary-metric-grid": {
       "types": "./dist/lists/summary-metric-grid.d.ts",
-      "import": "./dist/lists/summary-metric-grid.js"
+      "import": "./dist/lists/summary-metric-grid.js",
+      "default": "./dist/lists/summary-metric-grid.js"
     },
     "./settings-hub-list": {
       "types": "./dist/lists/settings-hub-list.d.ts",
-      "import": "./dist/lists/settings-hub-list.js"
+      "import": "./dist/lists/settings-hub-list.js",
+      "default": "./dist/lists/settings-hub-list.js"
     },
     "./form-surface": {
       "types": "./dist/forms/form-surface.d.ts",
-      "import": "./dist/forms/form-surface.js"
+      "import": "./dist/forms/form-surface.js",
+      "default": "./dist/forms/form-surface.js"
     },
     "./confirm-action-dialog": {
       "types": "./dist/forms/confirm-action-dialog.d.ts",
-      "import": "./dist/forms/confirm-action-dialog.js"
+      "import": "./dist/forms/confirm-action-dialog.js",
+      "default": "./dist/forms/confirm-action-dialog.js"
+    },
+    "./integration-status-card": {
+      "types": "./dist/integrations/integration-status-card.d.ts",
+      "import": "./dist/integrations/integration-status-card.js",
+      "default": "./dist/integrations/integration-status-card.js"
+    },
+    "./workflow-status-card": {
+      "types": "./dist/workflows/workflow-status-card.d.ts",
+      "import": "./dist/workflows/workflow-status-card.js",
+      "default": "./dist/workflows/workflow-status-card.js"
+    },
+    "./process-list-panel": {
+      "types": "./dist/workflows/process-list-panel.d.ts",
+      "import": "./dist/workflows/process-list-panel.js",
+      "default": "./dist/workflows/process-list-panel.js"
+    },
+    "./parameter-editor": {
+      "types": "./dist/settings/parameter-editor.d.ts",
+      "import": "./dist/settings/parameter-editor.js",
+      "default": "./dist/settings/parameter-editor.js"
+    },
+    "./settings-section-stack": {
+      "types": "./dist/settings/settings-section-stack.d.ts",
+      "import": "./dist/settings/settings-section-stack.js",
+      "default": "./dist/settings/settings-section-stack.js"
+    },
+    "./provider-model-selector": {
+      "types": "./dist/ai/provider-model-selector.d.ts",
+      "import": "./dist/ai/provider-model-selector.js",
+      "default": "./dist/ai/provider-model-selector.js"
+    },
+    "./conversation-directory": {
+      "types": "./dist/ai/conversation-directory.d.ts",
+      "import": "./dist/ai/conversation-directory.js",
+      "default": "./dist/ai/conversation-directory.js"
+    },
+    "./sticky-composer": {
+      "types": "./dist/ai/sticky-composer.d.ts",
+      "import": "./dist/ai/sticky-composer.js",
+      "default": "./dist/ai/sticky-composer.js"
+    },
+    "./detail-inspector-panel": {
+      "types": "./dist/detail/detail-inspector-panel.d.ts",
+      "import": "./dist/detail/detail-inspector-panel.js",
+      "default": "./dist/detail/detail-inspector-panel.js"
+    },
+    "./data-table-control-bar": {
+      "types": "./dist/data/data-table-control-bar.d.ts",
+      "import": "./dist/data/data-table-control-bar.js",
+      "default": "./dist/data/data-table-control-bar.js"
     },
     "./data-table-page-frame": {
       "types": "./dist/data/data-table-page-frame.d.ts",
-      "import": "./dist/data/data-table-page-frame.js"
+      "import": "./dist/data/data-table-page-frame.js",
+      "default": "./dist/data/data-table-page-frame.js"
+    },
+    "./link-action": {
+      "types": "./dist/navigation/link-action.d.ts",
+      "import": "./dist/navigation/link-action.js",
+      "default": "./dist/navigation/link-action.js"
     },
     "./package.json": "./package.json"
   },
@@ -95,14 +189,15 @@
     "validate:exports": "bun run scripts/validate-exports.mjs",
     "tarball:inspect": "bun run scripts/check-tarball.mjs",
     "pack:dry": "bun pm pack --dry-run",
-    "preflight": "bun run typecheck && bun run build && bun run test:ssr && bun run test:types && bun run test:exports && bun run validate:exports && bun run tarball:inspect && bun run pack:dry"
+    "preflight": "bun run build && bun run typecheck && bun run test:ssr && bun run test:types && bun run test:exports && bun run validate:exports && bun run tarball:inspect && bun run pack:dry",
+    "preflight:ci": "bun run build && bun run typecheck && bun run test:ssr && bun run test:types && bun run test:exports && bun run validate:exports && bun run tarball:inspect && bun run pack:dry"
   },
   "peerDependencies": {
     "react": "^19.0.0",
     "react-dom": "^19.0.0"
   },
   "dependencies": {
-    "@zvk/ui": "^0.1.8"
+    "@zvk/ui": "^0.1.11"
   },
   "tsd": {
     "directory": "tests/types"