@you-agent-factory/factory-graph 0.0.0

package/dist/semantic-place-nodes.js

@@ -0,0 +1,157 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { GraphNodeButton } from "@you-agent-factory/components/graphs";
+import { GraphSemanticIcon } from "./semantic-icon.js";
+import { FactoryGraphNodeShell, } from "./semantic-node-shell.js";
+import { factoryGraphNodeHoverClassName, factoryGraphNodeSurfaceClassName, } from "./semantic-node-style.js";
+import { FactoryGraphNodeBadge, } from "./semantic-support-nodes.js";
+import { workStatePhaseSemanticIconClassName, workStatePhaseSemanticIconKind, workStatePhaseSurfaceClassName, } from "./work-state-presentation.js";
+const DOT_LIMIT = 10;
+const CONTENT_CLASS = "flex min-w-0 w-full flex-col gap-0.5 overflow-hidden";
+export function FactoryGraphStatePositionNodeView(props) {
+    return _jsx(FactoryGraphPlaceNodeView, { ...props });
+}
+export function FactoryGraphConstraintNodeView(props) {
+    return _jsx(FactoryGraphPlaceNodeView, { ...props });
+}
+function FactoryGraphPlaceNodeView({ data }) {
+    const placeLabel = formatPlaceLabel(data.place);
+    const selectable = data.place.kind === "work_state" && data.onSelectStateNode !== undefined;
+    const stateNode = data.place.kind === "work_state";
+    const nodeType = stateNode
+        ? "statePosition"
+        : data.place.kind === "resource"
+            ? "resource"
+            : "constraint";
+    const className = classNames(placeNodeClassName(data.place), factoryGraphNodeHoverClassName({
+        activeFlow: data.activeFlow,
+        muted: data.muted,
+        selected: data.selectedStateNode,
+        validationError: data.validationError,
+    }), data.activeFlow &&
+        !data.selectedStateNode &&
+        !data.validationError &&
+        "border-af-success-border shadow-af-success-chip", data.selectedStateNode &&
+        !data.validationError &&
+        "border-primary shadow-af-accent-selected", data.validationError &&
+        "ring-2 ring-af-danger-border motion-safe:animate-pulse", data.muted && "opacity-[0.45]");
+    const content = stateNode ? (_jsx(FactoryGraphStatePositionContent, { locale: data.locale, place: data.place, tokenCount: data.tokenCount })) : (_jsx(FactoryGraphStaticPlaceContent, { locale: data.locale, place: data.place, tokenCount: data.tokenCount }));
+    return (_jsx(FactoryGraphNodeShell, { className: classNames("justify-center text-left", className), handles: data.handles, nodeType: nodeType, children: selectable ? (_jsx(GraphNodeButton, { "aria-invalid": data.validationError ? true : undefined, "aria-label": data.validationMessage ?? selectStateLabel(placeLabel, data.locale), "aria-pressed": data.selectedStateNode, className: CONTENT_CLASS, "data-selected-state": data.selectedStateNode ? "true" : undefined, title: data.validationMessage, onClick: (event) => {
+                event.stopPropagation();
+                data.onSelectStateNode?.(data.place.place_id);
+            }, children: content })) : (content) }));
+}
+function FactoryGraphStatePositionContent({ locale, place, tokenCount, }) {
+    const label = formatPlaceLabel(place);
+    return (_jsxs(_Fragment, { children: [_jsxs("span", { className: "grid h-6 max-h-6 min-w-0 grid-cols-[auto_minmax(0,1fr)] items-center gap-1.5 overflow-hidden", "data-state-label-zone": true, children: [_jsx(FactoryGraphPlaceSemanticIcon, { locale: locale, place: place }), _jsx(FactoryGraphPlaceLabelText, { dataPrefix: "state", place: place })] }), _jsx("span", { className: "flex min-h-5 w-full shrink-0 items-center justify-center overflow-hidden", "data-state-marker-zone": true, title: label, children: stateMarkers(tokenCount, locale) ?? (_jsx("span", { className: "sr-only", children: activeItemCountLabel(tokenCount, locale) })) })] }));
+}
+function FactoryGraphStaticPlaceContent({ locale, place, tokenCount, }) {
+    const label = formatPlaceLabel(place);
+    if (place.kind !== "resource")
+        return (_jsxs("div", { className: "grid min-w-0 gap-0.5 overflow-hidden", "data-place-label-container": true, children: [_jsxs("span", { className: "flex min-w-0 items-center gap-1.5 overflow-hidden", "data-place-label-zone": true, title: label, children: [_jsx(FactoryGraphPlaceSemanticIcon, { locale: locale, place: place }), _jsx("strong", { className: "block min-w-0 truncate whitespace-nowrap font-mono text-[0.86rem] font-bold leading-tight", children: label })] }), _jsx("span", { className: "flex min-h-4 w-full shrink-0 items-center justify-start overflow-hidden", "data-place-marker-zone": true, title: label, children: tokenCountDisplay(place, tokenCount, locale) })] }));
+    return (_jsxs("div", { className: "flex min-w-0 w-full flex-col overflow-hidden", "data-place-label-container": true, children: [_jsxs("span", { "aria-label": label, className: "grid h-6 max-h-6 min-w-0 grid-cols-[auto_minmax(0,1fr)] items-center gap-1.5 overflow-hidden", "data-place-label-zone": true, role: "img", children: [_jsx(FactoryGraphPlaceSemanticIcon, { locale: locale, place: place }), _jsx(FactoryGraphPlaceLabelText, { dataPrefix: "place", place: place })] }), _jsx("span", { className: "flex min-h-5 w-full shrink-0 items-center justify-start overflow-hidden", "data-place-marker-zone": true, title: label, children: tokenCountDisplay(place, tokenCount, locale) })] }));
+}
+function FactoryGraphPlaceSemanticIcon({ locale, place, }) {
+    const kind = place.kind === "work_state"
+        ? workStatePhaseSemanticIconKind(place.state_category)
+        : place.kind === "resource"
+            ? "resource"
+            : place.kind === "limit"
+                ? "limit"
+                : "constraint";
+    const className = place.kind === "work_state"
+        ? workStatePhaseSemanticIconClassName(place.state_category)
+        : place.kind === "resource"
+            ? "text-success"
+            : place.kind === "limit"
+                ? "text-error"
+                : "text-info";
+    const label = placeSemanticLabel(place, locale);
+    return (_jsx("span", { className: "flex min-h-4 shrink-0 items-center", "data-place-semantic-icon": true, title: placeKindLabel(place, locale), children: _jsx(GraphSemanticIcon, { className: classNames("h-3.5 w-3.5", className), kind: kind, label: label }) }));
+}
+function FactoryGraphPlaceLabelText({ dataPrefix, place, }) {
+    const label = formatPlaceLabel(place);
+    const parts = placeLabelParts(place);
+    return (_jsxs("span", { className: "grid min-w-0 gap-px overflow-hidden", title: label, children: [_jsx("span", { className: "block min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-[0.62rem] font-bold uppercase leading-none text-on-surface-subtle", "data-place-work-type": dataPrefix === "place" ? true : undefined, "data-state-work-type": dataPrefix === "state" ? true : undefined, title: parts.workType, children: parts.workType }), _jsx("span", { className: "block min-w-0 overflow-hidden truncate whitespace-nowrap font-mono text-[0.76rem] font-bold leading-[0.82rem] text-on-surface", "data-place-state-value": dataPrefix === "place" ? true : undefined, "data-state-value": dataPrefix === "state" ? true : undefined, title: parts.stateValue, children: parts.stateValue })] }));
+}
+function stateMarkers(count, locale) {
+    if (count === 0)
+        return null;
+    return count > DOT_LIMIT ? (_jsx(FactoryGraphWorkProgressMarker, { ariaLabel: activeItemCountLabel(count, locale), className: "inline-flex min-h-5 min-w-7 rounded-full px-2 text-[0.76rem]", count: count, "data-state-work-progress": "numeric", kind: "numeric" })) : (_jsx(FactoryGraphWorkProgressMarker, { ariaLabel: activeItemCountLabel(count, locale), className: "inline-grid grid-cols-[repeat(5,0.5rem)] justify-center gap-1", "data-state-work-progress": "dots", dotCount: count, dotDataAttribute: "data-state-work-progress-dot", kind: "dots" }));
+}
+export function FactoryGraphWorkProgressMarker(props) {
+    if (props.kind === "numeric") {
+        const { ariaLabel, className, count, kind: _kind, ...rest } = props;
+        return (_jsx("span", { "aria-label": ariaLabel, className: classNames("items-center justify-center border border-af-success-border bg-success-container font-mono font-bold leading-none text-success", className), role: "status", ...rest, children: count }));
+    }
+    const { ariaLabel, className, dotClassName = "h-2 w-2", dotCount, dotDataAttribute, kind: _kind, suffix, ...rest } = props;
+    return (_jsxs("span", { "aria-label": ariaLabel, className: classNames("items-center justify-center border border-af-success-border bg-success-container", className), role: "status", ...rest, children: [Array.from({ length: dotCount }, (_, index) => `dot-${index}`).map((key, index) => (_jsx("span", { "aria-hidden": "true", className: classNames("rounded-full bg-success", dotClassName), "data-current-activity-work-progress-dot": String(index), [dotDataAttribute]: String(index) }, key))), suffix] }));
+}
+function tokenCountDisplay(place, count, locale) {
+    return (_jsx(FactoryGraphNodeBadge, { "aria-label": tokenCountLabel(place, count, locale), className: "w-fit", "data-place-token-count": true, role: "status", children: count }));
+}
+function placeNodeClassName(place) {
+    return place.kind === "work_state"
+        ? workStatePhaseSurfaceClassName(place.state_category)
+        : place.kind === "resource"
+            ? classNames(factoryGraphNodeSurfaceClassName("resource"), "text-on-surface")
+            : classNames(factoryGraphNodeSurfaceClassName("info"), "border-dashed text-on-surface");
+}
+function formatPlaceLabel(place) {
+    return place.type_id && place.state_value
+        ? `${place.type_id}:${place.state_value}`
+        : place.place_id;
+}
+function placeLabelParts(place) {
+    return {
+        stateValue: place.state_value ?? place.place_id,
+        workType: place.type_id ?? "work",
+    };
+}
+function classNames(...values) {
+    return values.filter(Boolean).join(" ");
+}
+function activeItemCountLabel(count, locale) {
+    return locale === "zh-CN"
+        ? `${count} 个活动项`
+        : `${count} active ${count === 1 ? "item" : "items"}`;
+}
+function selectStateLabel(label, locale) {
+    return locale === "zh-CN" ? `选择 ${label} 状态` : `Select ${label} state`;
+}
+function placeKindLabel(place, locale) {
+    const chinese = locale === "zh-CN";
+    if (place.kind === "work_state")
+        return place.state_category === "TERMINAL"
+            ? chinese
+                ? "终止状态"
+                : "Terminal"
+            : place.state_category === "FAILED"
+                ? chinese
+                    ? "失败状态"
+                    : "Failed"
+                : chinese
+                    ? "队列"
+                    : "Queue";
+    if (place.kind === "resource")
+        return chinese ? "资源" : "Resource";
+    return place.kind === "limit"
+        ? chinese
+            ? "限制"
+            : "Limit"
+        : chinese
+            ? "约束"
+            : "Constraint";
+}
+function placeSemanticLabel(place, locale) {
+    return place.kind === "work_state" && place.state_category === "PROCESSING"
+        ? locale === "zh-CN"
+            ? "处理中状态"
+            : "Processing state"
+        : placeKindLabel(place, locale);
+}
+function tokenCountLabel(place, count, locale) {
+    if (locale === "zh-CN")
+        return `${count} 个${placeKindLabel(place, locale)}令牌`;
+    const token = count === 1 ? "token" : "tokens";
+    return `${count} ${placeKindLabel(place, locale).toLowerCase()} ${token}`;
+}

package/dist/semantic-support-nodes.d.ts

@@ -0,0 +1,61 @@
+import type { Node, NodeProps } from "@xyflow/react";
+import type { ComponentPropsWithoutRef, ReactNode } from "react";
+import { type FactoryGraphNodeHandle } from "./semantic-node-shell.js";
+/** The portion of a Factory place needed by the original semantic node views. */
+export interface FactoryGraphPlaceRef {
+    kind?: string;
+    place_id: string;
+    state_value?: string | null;
+    type_id?: string | null;
+}
+export interface FactoryGraphWorkerNodeData extends Record<string, unknown> {
+    activeFlow: boolean;
+    factoryGraphNodeId?: string;
+    handles: FactoryGraphNodeHandle[];
+    kind: "worker";
+    locale?: string;
+    muted: boolean;
+    onSelectWorker?: (workerName: string) => void;
+    place: FactoryGraphPlaceRef;
+    selectedWorker: boolean;
+}
+export type FactoryGraphWorkerNode = Node<FactoryGraphWorkerNodeData, "worker">;
+export interface FactoryGraphWorkTypeNodeData extends Record<string, unknown> {
+    activeFlow: boolean;
+    factoryGraphNodeId?: string;
+    handles: FactoryGraphNodeHandle[];
+    isDefaultWorkType?: boolean;
+    kind: "work-type";
+    locale?: string;
+    muted: boolean;
+    onSelectWorkType?: (workTypeName: string) => void;
+    place: FactoryGraphPlaceRef;
+    selectedWorkType?: boolean;
+    validationError?: boolean;
+    validationMessage?: string;
+}
+export type FactoryGraphWorkTypeNode = Node<FactoryGraphWorkTypeNodeData, "workType">;
+export interface FactoryGraphResourceNodeData extends Record<string, unknown> {
+    activeFlow: boolean;
+    factoryGraphNodeId?: string;
+    handles: FactoryGraphNodeHandle[];
+    kind: "resource";
+    locale?: string;
+    muted: boolean;
+    onSelectResource?: (resourceName: string) => void;
+    place: FactoryGraphPlaceRef;
+    selectedResource: boolean;
+    tokenCount: number;
+}
+export type FactoryGraphResourceNode = Node<FactoryGraphResourceNodeData, "resource">;
+/** Original Factory worker node, with host-owned worker selection. */
+export declare function FactoryGraphWorkerNodeView({ data, }: NodeProps<FactoryGraphWorkerNode>): import("react").JSX.Element;
+/** Original Factory work-type node, with host-owned selection and validation. */
+export declare function FactoryGraphWorkTypeNodeView({ data, }: NodeProps<FactoryGraphWorkTypeNode>): import("react").JSX.Element;
+/** Original Factory resource node, with host-owned resource selection. */
+export declare function FactoryGraphResourceNodeView({ data, }: NodeProps<FactoryGraphResourceNode>): import("react").JSX.Element;
+export declare function FactoryGraphNodeBadge({ children, className, tone, weight, ...rest }: ComponentPropsWithoutRef<"span"> & {
+    children: ReactNode;
+    tone?: "danger" | "info" | "neutral" | "success" | "warning";
+    weight?: "body" | "label";
+}): import("react").JSX.Element;

package/dist/semantic-support-nodes.js

@@ -0,0 +1,121 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { GraphNodeButton } from "@you-agent-factory/components/graphs";
+import { GraphSemanticIcon } from "./semantic-icon.js";
+import { FactoryGraphNodeShell, } from "./semantic-node-shell.js";
+import { factoryGraphNodeHoverClassName, factoryGraphNodeSurfaceClassName, } from "./semantic-node-style.js";
+/** Original Factory worker node, with host-owned worker selection. */
+export function FactoryGraphWorkerNodeView({ data, }) {
+    const workerName = resolveWorkerName(data);
+    const label = `worker:${workerName}`;
+    const workerLabel = semanticLabel("worker", data.locale);
+    const selectable = data.onSelectWorker !== undefined;
+    const content = (_jsxs("span", { "aria-label": label, className: "flex min-w-0 items-center gap-1.5 overflow-hidden", "data-worker-label-zone": true, role: "img", title: label, children: [_jsx("span", { className: "sr-only", children: label }), _jsx(GraphSemanticIcon, { className: "h-3.5 w-3.5 shrink-0 text-info", kind: "worker", label: workerLabel }), _jsxs("span", { className: "grid min-w-0 gap-px overflow-hidden", children: [_jsx("span", { className: "block min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-[0.62rem] font-bold uppercase leading-none text-info", children: workerLabel }), _jsx("strong", { className: "block min-w-0 truncate whitespace-nowrap font-mono text-[0.8rem] font-bold leading-tight text-on-surface", children: workerName })] })] }));
+    return (_jsx(FactoryGraphNodeShell, { className: classNames(factoryGraphNodeSurfaceClassName("info"), "justify-center text-left text-on-surface", factoryGraphNodeHoverClassName({
+            activeFlow: data.activeFlow,
+            muted: data.muted,
+            selected: data.selectedWorker,
+        }), data.activeFlow &&
+            !data.selectedWorker &&
+            "border-af-success-border shadow-af-success-chip", data.selectedWorker && "border-primary shadow-af-accent-selected", data.muted && "opacity-[0.45]"), handles: data.handles, nodeType: "worker", children: selectable ? (_jsx(GraphNodeButton, { "aria-label": selectLabel("worker", workerName, data.locale), "aria-pressed": data.selectedWorker, className: "grid min-w-0 gap-0.5 overflow-hidden", "data-selected-worker": data.selectedWorker ? "true" : undefined, onClick: (event) => {
+                event.stopPropagation();
+                data.onSelectWorker?.(workerName);
+            }, children: content })) : (content) }));
+}
+/** Original Factory work-type node, with host-owned selection and validation. */
+export function FactoryGraphWorkTypeNodeView({ data, }) {
+    const name = workTypeName(data.place);
+    const label = `work-type:${name}`;
+    const workTypeLabel = semanticLabel("work-type", data.locale);
+    const selectable = data.onSelectWorkType !== undefined;
+    const content = (_jsxs("span", { "aria-hidden": selectable ? true : undefined, className: "flex min-w-0 items-center gap-1.5 overflow-hidden", "data-work-type-label-zone": true, ...(selectable ? {} : { "aria-label": label, role: "img" }), title: data.validationMessage ?? label, children: [selectable ? null : _jsx("span", { className: "sr-only", children: label }), _jsx(GraphSemanticIcon, { className: "h-3.5 w-3.5 shrink-0 text-info", kind: "work-type", label: workTypeLabel }), _jsxs("span", { className: "grid min-w-0 gap-px overflow-hidden", children: [_jsxs("span", { className: "flex min-w-0 items-center gap-1 overflow-hidden", children: [_jsx("span", { className: "block min-w-0 overflow-hidden text-ellipsis whitespace-nowrap text-[0.62rem] font-bold uppercase leading-none text-info", children: workTypeLabel }), data.isDefaultWorkType ? (_jsx(FactoryGraphNodeBadge, { className: "max-w-full shrink", role: "status", tone: "info", weight: "label", children: defaultWorkTypeLabel(data.locale) })) : null] }), _jsx("strong", { className: "block min-w-0 truncate whitespace-nowrap font-mono text-[0.8rem] font-bold leading-tight text-on-surface", children: name })] })] }));
+    return (_jsx(FactoryGraphNodeShell, { className: classNames(factoryGraphNodeSurfaceClassName("info"), "justify-center border-dashed text-left text-on-surface", factoryGraphNodeHoverClassName({
+            activeFlow: data.activeFlow,
+            muted: data.muted,
+            selected: data.selectedWorkType,
+            validationError: data.validationError,
+        }), data.activeFlow && "border-info shadow-af-info-chip", data.muted && "opacity-[0.45]", data.validationError &&
+            "ring-2 ring-af-danger-border motion-safe:animate-pulse", data.selectedWorkType &&
+            !data.validationError &&
+            "border-primary shadow-af-accent-selected"), handles: data.handles, nodeType: "workType", children: selectable ? (_jsx(GraphNodeButton, { "aria-invalid": data.validationError ? true : undefined, "aria-label": selectLabel("work type", name, data.locale), "aria-pressed": data.selectedWorkType, className: "grid min-w-0 gap-0.5 overflow-hidden", "data-selected-work-type": data.selectedWorkType ? "true" : undefined, onClick: (event) => {
+                event.stopPropagation();
+                data.onSelectWorkType?.(name);
+            }, children: content })) : (_jsx("div", { className: "grid min-w-0 gap-0.5 overflow-hidden", children: content })) }));
+}
+/** Original Factory resource node, with host-owned resource selection. */
+export function FactoryGraphResourceNodeView({ data, }) {
+    const label = resourceName(data.place);
+    const resourceLabel = semanticLabel("resource", data.locale);
+    const selectable = data.onSelectResource !== undefined;
+    const content = (_jsx(FactoryGraphResourceNodeContent, { label: label, locale: data.locale, place: data.place, resourceLabel: resourceLabel, tokenCount: data.tokenCount }));
+    return (_jsx(FactoryGraphNodeShell, { className: classNames(factoryGraphNodeSurfaceClassName("resource"), "justify-center text-left text-on-surface", factoryGraphNodeHoverClassName({
+            activeFlow: data.activeFlow,
+            muted: data.muted,
+            selected: data.selectedResource,
+        }), data.activeFlow &&
+            !data.selectedResource &&
+            "border-af-success-border shadow-af-success-chip", data.selectedResource && "border-primary shadow-af-accent-selected", data.muted && "opacity-[0.45]"), handles: data.handles, nodeType: "resource", children: selectable ? (_jsx(GraphNodeButton, { "aria-label": selectLabel("resource", label, data.locale), "aria-pressed": data.selectedResource, className: "flex min-w-0 w-full flex-col overflow-hidden", "data-selected-resource": data.selectedResource ? "true" : undefined, onClick: (event) => {
+                event.stopPropagation();
+                data.onSelectResource?.(label);
+            }, children: content })) : (content) }));
+}
+function FactoryGraphResourceNodeContent({ label, locale, place, resourceLabel, tokenCount, }) {
+    return (_jsxs("div", { className: "flex min-w-0 w-full flex-col overflow-hidden", children: [_jsxs("span", { "aria-label": label, className: "grid h-6 max-h-6 min-w-0 grid-cols-[auto_minmax(0,1fr)] items-center gap-1.5 overflow-hidden", "data-resource-label-zone": true, role: "img", children: [_jsx("span", { className: "flex min-h-4 shrink-0 items-center", title: resourceLabel, children: _jsx(GraphSemanticIcon, { className: "h-3.5 w-3.5 text-success", kind: "resource", label: resourceLabel }) }), _jsx("span", { className: "flex min-w-0 overflow-hidden", title: label, children: _jsx("span", { className: "block min-w-0 overflow-hidden truncate whitespace-nowrap font-mono text-[0.76rem] font-bold leading-[0.82rem] text-on-surface", "data-resource-name": true, title: label, children: label }) })] }), _jsx("span", { className: "flex min-h-5 w-full shrink-0 items-center justify-start overflow-hidden", "data-resource-token-zone": true, title: label, children: _jsx(FactoryGraphNodeBadge, { "aria-label": tokenCountLabel(place, tokenCount, locale), className: "w-fit", "data-resource-token-count": true, role: "status", children: tokenCount }) })] }));
+}
+export function FactoryGraphNodeBadge({ children, className, tone = "neutral", weight = "body", ...rest }) {
+    const toneClass = {
+        danger: "border-af-danger-border bg-error-container text-on-error-container",
+        info: "border-af-info-border bg-info-container text-on-info-container",
+        neutral: "border-outline bg-surface-container-low text-on-surface-variant",
+        success: "border-af-success-border bg-success-container text-on-success-container",
+        warning: "border-af-warning-border bg-warning-container text-on-warning-container",
+    }[tone];
+    return (_jsx("span", { className: classNames("inline-flex min-h-6 w-fit items-center justify-center gap-1 rounded-full border px-2 py-0.5 font-semibold leading-none", toneClass, weight === "body"
+            ? "font-mono text-[0.68rem]"
+            : "text-[0.65rem] font-semibold uppercase tracking-[0.08em]", className), ...rest, children: children }));
+}
+function resolveWorkerName(data) {
+    return (data.place.state_value ??
+        data.factoryGraphNodeId?.replace(/^worker:/, "") ??
+        data.place.place_id.replace(/^place:worker:/, "").replace(/^worker:/, ""));
+}
+function workTypeName(place) {
+    return typeof place.state_value === "string" &&
+        place.state_value.trim().length > 0
+        ? place.state_value
+        : place.place_id.replace(/^work-type:/, "");
+}
+function resourceName(place) {
+    return typeof place.type_id === "string" && place.type_id.trim().length > 0
+        ? place.type_id
+        : place.place_id.replace(/:available$/, "");
+}
+function classNames(...values) {
+    return values.filter(Boolean).join(" ");
+}
+function semanticLabel(kind, locale) {
+    const chinese = locale === "zh-CN";
+    return kind === "resource"
+        ? chinese
+            ? "资源"
+            : "Resource"
+        : kind === "worker"
+            ? chinese
+                ? "工作者"
+                : "Worker"
+            : chinese
+                ? "工作类型"
+                : "Work type";
+}
+function defaultWorkTypeLabel(locale) {
+    return locale === "zh-CN" ? "默认工作类型" : "Default work type";
+}
+function selectLabel(kind, name, locale) {
+    return locale === "zh-CN"
+        ? `选择 ${name} ${kind === "work type" ? "工作类型" : kind === "worker" ? "工作者" : "资源"}`
+        : `Select ${name} ${kind}`;
+}
+function tokenCountLabel(_place, count, locale) {
+    return locale === "zh-CN"
+        ? `${count} 个资源令牌`
+        : `${count} resource tokens`;
+}

package/dist/semantic-workstation-node.d.ts

@@ -0,0 +1,34 @@
+import type { Node, NodeProps } from "@xyflow/react";
+import { type FactoryGraphNodeHandle, type FactoryGraphZAxisIncompleteHints } from "./semantic-node-shell.js";
+import { type FactoryGraphWorkItemRef, type FactoryGraphWorkstationRef } from "./semantic-workstation-presentation.js";
+export type { FactoryGraphWorkItemRef, FactoryGraphWorkstationRef, } from "./semantic-workstation-presentation.js";
+export interface FactoryGraphActiveExecution {
+    dispatch_id: string;
+    started_at: string;
+    work_items?: FactoryGraphWorkItemRef[];
+}
+export interface FactoryGraphWorkstationNodeData extends Record<string, unknown> {
+    active: boolean;
+    activeFlow: boolean;
+    executions: FactoryGraphActiveExecution[];
+    factoryGraphNodeId?: string;
+    handles: FactoryGraphNodeHandle[];
+    kind?: "workstation";
+    locale?: string;
+    muted: boolean;
+    now: number;
+    progressOutcomeRouteWorkstation?: unknown;
+    selectedWorkID: string | null;
+    selectedWorkstation: boolean;
+    summaryOnly?: boolean;
+    workstation: FactoryGraphWorkstationRef;
+    zAxisIncompleteHints?: FactoryGraphZAxisIncompleteHints | null;
+    onSelectWorkstation?: (nodeId: string) => void;
+    onSelectWorkID?: (workID: string, hint?: {
+        dispatchID?: string;
+        nodeID?: string;
+    }) => void;
+}
+export type FactoryGraphWorkstationNode = Node<FactoryGraphWorkstationNodeData, "workstation">;
+/** Original Factory workstation presentation, with host-owned selection callbacks. */
+export declare function FactoryGraphWorkstationNodeView({ data, }: NodeProps<FactoryGraphWorkstationNode>): import("react").JSX.Element;

package/dist/semantic-workstation-node.js

@@ -0,0 +1,84 @@
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { GraphNodeButton } from "@you-agent-factory/components/graphs";
+import { GraphSemanticIcon } from "./semantic-icon.js";
+import { FactoryGraphNodeShell, } from "./semantic-node-shell.js";
+import { factoryGraphNodeHoverClassName, factoryGraphNodeSurfaceClassName, } from "./semantic-node-style.js";
+import { FactoryGraphWorkProgressMarker } from "./semantic-place-nodes.js";
+import { factoryGraphActiveItemsLabel as activeItemsLabel, factoryGraphClassNames as classNames, factoryGraphDurationText as durationText, factoryGraphGraphDuration as graphDuration, factoryGraphSelectExhaustionLabel as selectExhaustionLabel, factoryGraphSelectWorkstationLabel as selectWorkstationLabel, factoryGraphWorkItemLabel as workItemLabel, factoryGraphWorkItemLabelClassName as workItemLabelClassName, factoryGraphWorkstationPresentation as workstationPresentation, factoryGraphWorkstationTitleClassName as workstationTitleClassName, } from "./semantic-workstation-presentation.js";
+const VISIBLE_WORK_ITEM_LIMIT = 3;
+/** Original Factory workstation presentation, with host-owned selection callbacks. */
+export function FactoryGraphWorkstationNodeView({ data, }) {
+    const presentation = workstationPresentation(data.workstation, data.locale);
+    const exhaustion = presentation.semanticKind === "exhaustion";
+    const title = data.workstation.workstation_name ||
+        data.workstation.transition_id ||
+        data.workstation.node_id;
+    const entries = data.executions.flatMap((execution) => (execution.work_items ?? []).map((workItem) => ({ execution, workItem })));
+    const className = classNames(factoryGraphNodeSurfaceClassName("workstation"), "min-w-0 w-full justify-start overflow-hidden border-2", factoryGraphNodeHoverClassName({ muted: data.muted, selected: data.selectedWorkstation }, "primary"), exhaustion ? "border-dashed border-af-danger-border" : "border-info-border", !exhaustion && presentation.borderClassName, !exhaustion &&
+        data.active &&
+        !data.selectedWorkstation &&
+        "border-af-success-border shadow-af-success-chip", !exhaustion &&
+        data.activeFlow &&
+        !data.selectedWorkstation &&
+        "agent-flow-node--active ring-2 ring-af-success-border", data.selectedWorkstation && "border-primary shadow-af-accent-selected", !exhaustion &&
+        data.selectedWorkID !== null &&
+        "border-info-border shadow-af-info-selected", data.muted && "opacity-[0.45]");
+    return (_jsx(FactoryGraphNodeShell, { className: className, handles: data.handles, nodeType: "workstation", zAxisIncompleteHints: data.zAxisIncompleteHints, children: exhaustion ? (_jsx(Exhaustion, { data: data, presentation: presentation, title: title })) : data.summaryOnly ? (_jsx(Summary, { data: data, presentation: presentation, title: title })) : (_jsx(ActiveContent, { data: data, entries: entries, presentation: presentation, title: title })) }));
+}
+function Summary({ data, presentation, title, }) {
+    return (_jsx(GraphNodeButton, { "aria-label": data.onSelectWorkstation
+            ? selectWorkstationLabel(title, data.locale)
+            : undefined, "aria-pressed": data.onSelectWorkstation ? data.selectedWorkstation : undefined, className: "flex min-w-0 w-full items-center justify-between gap-2 overflow-hidden", "data-selected-workstation": data.selectedWorkstation ? "true" : undefined, "data-workstation-kind": presentation.semanticKind, disabled: data.onSelectWorkstation === undefined, onClick: data.onSelectWorkstation
+            ? (event) => {
+                event.stopPropagation();
+                data.onSelectWorkstation?.(data.workstation.node_id);
+            }
+            : undefined, title: title, children: _jsx(Header, { presentation: presentation, title: title }) }));
+}
+function Exhaustion({ data, presentation, title, }) {
+    const header = _jsx(Header, { presentation: presentation, title: title, compact: true });
+    if (!data.onSelectWorkstation)
+        return (_jsx("div", { className: "flex h-full min-w-0 w-full items-center gap-2 overflow-hidden", "data-selected-workstation": data.selectedWorkstation ? "true" : undefined, "data-workstation-kind": presentation.semanticKind, title: title, children: header }));
+    return (_jsx(GraphNodeButton, { "aria-label": selectExhaustionLabel(title, data.locale), "aria-pressed": data.selectedWorkstation, className: "flex h-full min-w-0 w-full items-center gap-2 overflow-hidden", "data-selected-workstation": data.selectedWorkstation ? "true" : undefined, "data-workstation-kind": presentation.semanticKind, onClick: (event) => {
+            event.stopPropagation();
+            data.onSelectWorkstation?.(data.workstation.node_id);
+        }, title: title, children: header }));
+}
+function ActiveContent({ data, entries, presentation, title, }) {
+    const visible = entries.slice(0, VISIBLE_WORK_ITEM_LIMIT);
+    const header = _jsx(Header, { presentation: presentation, title: title });
+    return (_jsxs("div", { className: "grid h-full min-w-0 grid-rows-[auto_1fr_auto]", "data-active": data.active ? "true" : undefined, "data-selected-work": data.selectedWorkID !== null ? "true" : undefined, "data-selected-workstation": data.selectedWorkstation ? "true" : undefined, "data-workstation-kind": presentation.semanticKind, children: [data.onSelectWorkstation ? (_jsx(GraphNodeButton, { "aria-label": selectWorkstationLabel(title, data.locale), "aria-pressed": data.selectedWorkstation, className: "flex min-w-0 w-full items-center justify-between gap-2 overflow-hidden", onClick: (event) => {
+                    event.stopPropagation();
+                    data.onSelectWorkstation?.(data.workstation.node_id);
+                }, title: title, children: header })) : (_jsx("div", { className: "flex min-w-0 w-full items-center justify-between gap-2 overflow-hidden", title: title, children: header })), _jsx("ul", { className: "mt-2 grid min-w-0 list-none content-start gap-1 p-0", children: visible.map(({ execution, workItem }) => (_jsx(WorkItem, { data: data, execution: execution, workItem: workItem }, `${execution.dispatch_id}:${workItem.work_id}`))) }), _jsx(Overflow, { total: entries.length, visible: visible.length, locale: data.locale })] }));
+}
+function WorkItem({ data, execution, workItem, }) {
+    const selected = data.selectedWorkID === workItem.work_id;
+    const label = workItemLabel(workItem);
+    const duration = graphDuration(execution.started_at, data.now, data.locale);
+    const durationTitle = durationText(execution.started_at, data.now, data.locale);
+    const content = (_jsxs(_Fragment, { children: [_jsx("span", { className: workItemLabelClassName(label), "data-active-work-label": true, children: label }), _jsx("span", { className: "shrink-0 whitespace-nowrap text-right font-mono text-[0.72rem] text-on-surface-subtle", "data-active-work-duration": true, children: duration })] }));
+    const className = classNames("grid min-w-0 w-full grid-cols-[minmax(0,1fr)_auto] items-center gap-1 overflow-hidden rounded-lg border border-outline bg-surface px-1.5 py-1 text-[0.74rem]", selected && "border-info-border bg-info-container shadow-af-info-chip");
+    return (_jsx("li", { children: data.onSelectWorkID ? (_jsx(GraphNodeButton, { "aria-pressed": selected, className: className, "data-selected": selected ? "true" : undefined, onClick: (event) => {
+                event.stopPropagation();
+                data.onSelectWorkID?.(workItem.work_id, {
+                    dispatchID: execution.dispatch_id,
+                    nodeID: data.workstation.node_id,
+                });
+            }, title: `${label} - ${durationTitle}`, children: content })) : (_jsx("div", { className: className, "data-selected": selected ? "true" : undefined, title: `${label} - ${durationTitle}`, children: content })) }));
+}
+function Header({ compact = false, presentation, title, }) {
+    return (_jsxs(_Fragment, { children: [_jsx("span", { className: compact
+                    ? "flex min-h-4 items-center"
+                    : "flex min-h-5 shrink-0 items-center", "data-workstation-semantic-icon": true, title: presentation.label, children: _jsx(GraphSemanticIcon, { className: classNames("h-4 w-4", presentation.className), kind: presentation.iconKind, label: presentation.label }) }), _jsx("span", { className: compact
+                    ? "block min-w-0 truncate whitespace-nowrap font-mono text-[0.74rem] font-bold leading-tight text-on-surface"
+                    : workstationTitleClassName(title), "data-workstation-title": true, children: title })] }));
+}
+function Overflow({ locale, total, visible, }) {
+    const remaining = Math.max(0, total - visible);
+    if (!remaining)
+        return null;
+    if (remaining > 10)
+        return (_jsx(FactoryGraphWorkProgressMarker, { ariaLabel: activeItemsLabel(total, locale), className: "mt-2 flex min-h-7 w-full rounded-lg px-3 py-1 text-[0.9rem]", count: total, "data-workstation-work-progress": "numeric", kind: "numeric" }));
+    return (_jsx(FactoryGraphWorkProgressMarker, { ariaLabel: activeItemsLabel(total, locale), className: "mt-2 flex min-h-7 gap-1 rounded-lg px-2", "data-workstation-work-progress": "dots", dotClassName: "h-1.5 w-1.5", dotCount: remaining, dotDataAttribute: "data-workstation-work-progress-dot", kind: "dots", suffix: _jsxs("span", { className: "ml-1 font-mono text-[0.68rem] font-bold text-success", children: ["+", remaining] }) }));
+}

package/dist/semantic-workstation-presentation.d.ts

@@ -0,0 +1,31 @@
+import type { GraphSemanticIconKind } from "./semantic-icon.js";
+export interface FactoryGraphWorkstationRef {
+    node_id: string;
+    transition_id: string;
+    workstation_name: string;
+    worker_type?: string;
+    workstation_kind?: string;
+}
+export interface FactoryGraphWorkItemRef {
+    display_name?: string;
+    work_id: string;
+    work_type_id?: string;
+}
+export type FactoryGraphWorkstationSemanticKind = "CRON" | "POLLER" | "REPEATER" | "STANDARD" | "exhaustion";
+export interface FactoryGraphWorkstationPresentation {
+    borderClassName?: string;
+    className: string;
+    iconKind: GraphSemanticIconKind;
+    label: string;
+    semanticKind: FactoryGraphWorkstationSemanticKind;
+}
+export declare function factoryGraphWorkstationPresentation(workstation: FactoryGraphWorkstationRef, locale?: string): FactoryGraphWorkstationPresentation;
+export declare function factoryGraphWorkItemLabel(item: FactoryGraphWorkItemRef): string;
+export declare function factoryGraphGraphDuration(startedAt: string, now: number, locale?: string): string;
+export declare function factoryGraphDurationText(startedAt: string, now: number, locale?: string): string;
+export declare function factoryGraphActiveItemsLabel(count: number, locale?: string): string;
+export declare function factoryGraphSelectWorkstationLabel(title: string, locale?: string): string;
+export declare function factoryGraphSelectExhaustionLabel(title: string, locale?: string): string;
+export declare function factoryGraphWorkstationTitleClassName(label: string): string;
+export declare function factoryGraphWorkItemLabelClassName(label: string): string;
+export declare function factoryGraphClassNames(...values: Array<string | false | null | undefined>): string;

package/dist/semantic-workstation-presentation.js

@@ -0,0 +1,127 @@
+import { factoryGraphNodeTitleClassName } from "./semantic-node-style.js";
+export function factoryGraphWorkstationPresentation(workstation, locale) {
+    const exhaustion = workstation.workstation_kind === "exhaustion" ||
+        (!workstation.workstation_kind && !workstation.worker_type);
+    const normalized = workstation.workstation_kind?.trim().toUpperCase();
+    const semanticKind = exhaustion
+        ? "exhaustion"
+        : normalized === "CRON"
+            ? "CRON"
+            : normalized === "POLLER"
+                ? "POLLER"
+                : normalized === "REPEATER"
+                    ? "REPEATER"
+                    : "STANDARD";
+    const chinese = locale === "zh-CN";
+    const values = {
+        CRON: {
+            borderClassName: "border-dashed",
+            className: "text-success",
+            iconKind: "cron",
+            semanticKind: "CRON",
+        },
+        POLLER: {
+            borderClassName: "border-dotted",
+            className: "text-primary",
+            iconKind: "poller",
+            semanticKind: "POLLER",
+        },
+        REPEATER: {
+            borderClassName: "border-double",
+            className: "text-info",
+            iconKind: "repeater",
+            semanticKind: "REPEATER",
+        },
+        STANDARD: {
+            className: "text-on-surface-subtle",
+            iconKind: "workstation",
+            semanticKind: "STANDARD",
+        },
+        exhaustion: {
+            className: "text-error",
+            iconKind: "exhaustion",
+            semanticKind: "exhaustion",
+        },
+    };
+    const labels = {
+        CRON: chinese ? "Cron 工作站" : "Cron workstation",
+        POLLER: chinese ? "轮询器工作站" : "Poller workstation",
+        REPEATER: chinese ? "重复器工作站" : "Repeater workstation",
+        STANDARD: chinese ? "标准工作站" : "Standard workstation",
+        exhaustion: chinese ? "耗尽规则" : "Exhaustion rule",
+    };
+    return { ...values[semanticKind], label: labels[semanticKind] };
+}
+export function factoryGraphWorkItemLabel(item) {
+    return item.display_name?.trim() || item.work_id?.trim() || "Unknown work";
+}
+export function factoryGraphGraphDuration(startedAt, now, locale) {
+    const millis = durationMillis(startedAt, now);
+    if (millis === undefined)
+        return "Unavailable";
+    const [value, suffix] = graphDurationParts(millis, locale);
+    return `${value}${suffix}`;
+}
+export function factoryGraphDurationText(startedAt, now, locale) {
+    const millis = durationMillis(startedAt, now);
+    if (millis === undefined)
+        return "Unavailable";
+    const seconds = Math.floor(millis / 1000);
+    const minutes = Math.floor(seconds / 60);
+    const hours = Math.floor(minutes / 60);
+    const [hour, minute, second] = locale === "zh-CN" ? ["小时", "分", "秒"] : ["h", "m", "s"];
+    if (hours > 0)
+        return `${hours}${hour} ${minutes % 60}${minute}`;
+    if (minutes > 0)
+        return `${minutes}${minute} ${seconds % 60}${second}`;
+    return `${seconds}${second}`;
+}
+export function factoryGraphActiveItemsLabel(count, locale) {
+    return locale === "zh-CN"
+        ? `${count} 个活动项`
+        : `${count} active ${count === 1 ? "item" : "items"}`;
+}
+export function factoryGraphSelectWorkstationLabel(title, locale) {
+    return locale === "zh-CN"
+        ? `选择 ${title} 工作站`
+        : `Select ${title} workstation`;
+}
+export function factoryGraphSelectExhaustionLabel(title, locale) {
+    return locale === "zh-CN"
+        ? `选择 ${title} 枯竭规则`
+        : `Select ${title} exhaustion rule`;
+}
+export function factoryGraphWorkstationTitleClassName(label) {
+    return factoryGraphNodeTitleClassName(factoryGraphClassNames("basis-0 flex-1", label.length > 34
+        ? "text-[0.78rem]"
+        : label.length > 20
+            ? "text-[0.88rem]"
+            : "text-[1rem]"));
+}
+export function factoryGraphWorkItemLabelClassName(label) {
+    return factoryGraphClassNames("block min-w-0 basis-0 flex-1 truncate whitespace-nowrap leading-tight", label.length > 58
+        ? "text-[0.64rem]"
+        : label.length > 38
+            ? "text-[0.68rem]"
+            : "text-[0.74rem]");
+}
+export function factoryGraphClassNames(...values) {
+    return values.filter(Boolean).join(" ");
+}
+function durationMillis(startedAt, now) {
+    const started = Date.parse(startedAt);
+    return Number.isNaN(started) ? undefined : Math.max(0, now - started);
+}
+function graphDurationParts(millis, locale) {
+    const units = [
+        [24 * 60 * 60 * 1000, locale === "zh-CN" ? "天" : "d"],
+        [60 * 60 * 1000, locale === "zh-CN" ? "时" : "h"],
+        [60 * 1000, locale === "zh-CN" ? "分" : "m"],
+        [1000, locale === "zh-CN" ? "秒" : "s"],
+    ];
+    const unit = units.find(([size]) => millis >= size) ?? units[3];
+    return [
+        new Intl.NumberFormat(locale).format(Math.floor(millis / unit[0])),
+        unit[1],
+    ];
+}