@open-mercato/core 0.6.3-develop.3857.1.da89d7530c → 0.6.3-develop.3881.1.0b590ac4eb

package/dist/modules/workflows/components/StepsEditor.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/modules/workflows/components/StepsEditor.tsx"],
-  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport { Label } from '@open-mercato/ui/primitives/label'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@open-mercato/ui/primitives/select'\nimport { Textarea } from '@open-mercato/ui/primitives/textarea'\nimport { Trash2, Plus, ChevronUp, ChevronDown } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\ninterface Step {\n  stepId: string\n  stepName: string\n  stepType: string\n  description?: string\n  config?: Record<string, any>\n  timeout?: number\n  retryPolicy?: {\n    maxAttempts?: number\n    retryDelay?: number\n    backoffMultiplier?: number\n  }\n}\n\ninterface StepsEditorProps {\n  value: Step[]\n  onChange: (steps: Step[]) => void\n  error?: string\n}\n\nconst STEP_TYPES = [\n  { value: 'START', label: 'Start' },\n  { value: 'END', label: 'End' },\n  { value: 'USER_TASK', label: 'User Task' },\n  { value: 'AUTOMATED', label: 'Automated' },\n  { value: 'PARALLEL_FORK', label: 'Parallel Fork' },\n  { value: 'PARALLEL_JOIN', label: 'Parallel Join' },\n  { value: 'SUB_WORKFLOW', label: 'Sub-Workflow' },\n  { value: 'WAIT_FOR_SIGNAL', label: 'Wait for Signal' },\n  { value: 'WAIT_FOR_TIMER', label: 'Wait for Timer' },\n]\n\nexport function StepsEditor({ value = [], onChange, error }: StepsEditorProps) {\n  const t = useT()\n\n  const addStep = () => {\n    const newStep: Step = {\n      stepId: `step_${Date.now()}`,\n      stepName: t('workflows.common.newStep'),\n      stepType: 'AUTOMATED',\n      description: '',\n      config: {},\n    }\n    onChange([...value, newStep])\n  }\n\n  const updateStep = (index: number, field: keyof Step, fieldValue: any) => {\n    const updated = [...value]\n    updated[index] = { ...updated[index], [field]: fieldValue }\n    onChange(updated)\n  }\n\n  const removeStep = (index: number) => {\n    onChange(value.filter((_, i) => i !== index))\n  }\n\n  const moveStep = (index: number, direction: 'up' | 'down') => {\n    const newIndex = direction === 'up' ? index - 1 : index + 1\n    if (newIndex < 0 || newIndex >= value.length) return\n\n    const updated = [...value]\n    const temp = updated[index]\n    updated[index] = updated[newIndex]\n    updated[newIndex] = temp\n    onChange(updated)\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n        <div>\n          <p className=\"text-sm text-muted-foreground\">\n            {t('workflows.form.descriptions.steps')}\n          </p>\n          {error && <p className=\"text-sm text-red-600 mt-1\">{error}</p>}\n        </div>\n        <Button type=\"button\" onClick={addStep} variant=\"outline\" size=\"sm\" className=\"w-full sm:w-auto\">\n          <Plus className=\"h-4 w-4 mr-1\" />\n          {t('workflows.form.addStep')}\n        </Button>\n      </div>\n\n      {value.length === 0 && (\n        <div className=\"p-6 text-center text-muted-foreground border rounded-md bg-muted\">\n          {t('workflows.form.noSteps')}\n        </div>\n      )}\n\n      <div className=\"space-y-3\">\n        {value.map((step, index) => (\n          <div key={index} className=\"p-4 border rounded-md bg-card shadow-sm\">\n            <div className=\"space-y-3\">\n              <div className=\"flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between\">\n                <div className=\"flex-1 grid grid-cols-1 sm:grid-cols-2 gap-3\">\n                  <div>\n                    <Label htmlFor={`step-${index}-id`} className=\"text-xs\">\n                      {t('workflows.steps.stepId')} *\n                    </Label>\n                    <Input\n                      id={`step-${index}-id`}\n                      value={step.stepId}\n                      onChange={(e) => updateStep(index, 'stepId', e.target.value)}\n                      placeholder=\"step_name\"\n                      className=\"mt-1\"\n                    />\n                  </div>\n                  <div>\n                    <Label htmlFor={`step-${index}-name`} className=\"text-xs\">\n                      {t('workflows.steps.stepName')} *\n                    </Label>\n                    <Input\n                      id={`step-${index}-name`}\n                      value={step.stepName}\n                      onChange={(e) => updateStep(index, 'stepName', e.target.value)}\n                      placeholder={t('workflows.steps.stepName')}\n                      className=\"mt-1\"\n                    />\n                  </div>\n                </div>\n                <div className=\"flex items-center gap-1 self-end sm:self-auto\">\n                  <Button\n                    type=\"button\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    onClick={() => moveStep(index, 'up')}\n                    disabled={index === 0}\n                    title={t('common.moveUp')}\n                  >\n                    <ChevronUp className=\"h-4 w-4\" />\n                  </Button>\n                  <Button\n                    type=\"button\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    onClick={() => moveStep(index, 'down')}\n                    disabled={index === value.length - 1}\n                    title={t('common.moveDown')}\n                  >\n                    <ChevronDown className=\"h-4 w-4\" />\n                  </Button>\n                  <Button\n                    type=\"button\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    onClick={() => removeStep(index)}\n                    title={t('common.delete')}\n                  >\n                    <Trash2 className=\"h-4 w-4 text-red-600\" />\n                  </Button>\n                </div>\n              </div>\n\n              <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-3\">\n                <div>\n                  <Label htmlFor={`step-${index}-type`} className=\"text-xs\">\n                    {t('workflows.steps.stepType')} *\n                  </Label>\n                  <Select\n                    value={step.stepType}\n                    onValueChange={(value) => updateStep(index, 'stepType', value)}\n                  >\n                    <SelectTrigger id={`step-${index}-type`} className=\"mt-1\">\n                      <SelectValue />\n                    </SelectTrigger>\n                    <SelectContent>\n                      {STEP_TYPES.map((type) => (\n                        <SelectItem key={type.value} value={type.value}>\n                          {t(`workflows.steps.types.${type.value}`)}\n                        </SelectItem>\n                      ))}\n                    </SelectContent>\n                  </Select>\n                </div>\n                <div>\n                  <Label htmlFor={`step-${index}-timeout`} className=\"text-xs\">\n                    {t('workflows.steps.timeout')} (ms)\n                  </Label>\n                  <Input\n                    id={`step-${index}-timeout`}\n                    type=\"number\"\n                    value={step.timeout || ''}\n                    onChange={(e) => updateStep(index, 'timeout', e.target.value ? parseInt(e.target.value) : undefined)}\n                    placeholder=\"30000\"\n                    className=\"mt-1\"\n                  />\n                </div>\n              </div>\n\n              <div>\n                <Label htmlFor={`step-${index}-description`} className=\"text-xs\">\n                  {t('workflows.steps.singular')} {t('workflows.definitions.description')}\n                </Label>\n                <Textarea\n                  id={`step-${index}-description`}\n                  value={step.description || ''}\n                  onChange={(e) => updateStep(index, 'description', e.target.value)}\n                  placeholder={t('workflows.form.placeholders.description')}\n                  rows={2}\n                  className=\"mt-1\"\n                />\n              </div>\n            </div>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["\"use client\"\n\nimport * as React from 'react'\nimport { Button } from '@open-mercato/ui/primitives/button'\nimport { Input } from '@open-mercato/ui/primitives/input'\nimport { Label } from '@open-mercato/ui/primitives/label'\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@open-mercato/ui/primitives/select'\nimport { Textarea } from '@open-mercato/ui/primitives/textarea'\nimport { Trash2, Plus, ChevronUp, ChevronDown } from 'lucide-react'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\ninterface Step {\n  stepId: string\n  stepName: string\n  stepType: string\n  description?: string\n  config?: Record<string, any>\n  timeout?: number\n  retryPolicy?: {\n    maxAttempts?: number\n    retryDelay?: number\n    backoffMultiplier?: number\n  }\n}\n\ninterface StepsEditorProps {\n  value: Step[]\n  onChange: (steps: Step[]) => void\n  error?: string\n}\n\nconst STEP_TYPES = [\n  { value: 'START', label: 'Start' },\n  { value: 'END', label: 'End' },\n  { value: 'USER_TASK', label: 'User Task' },\n  { value: 'AUTOMATED', label: 'Automated' },\n  { value: 'PARALLEL_FORK', label: 'Parallel Fork' },\n  { value: 'PARALLEL_JOIN', label: 'Parallel Join' },\n  { value: 'SUB_WORKFLOW', label: 'Sub-Workflow' },\n  { value: 'WAIT_FOR_SIGNAL', label: 'Wait for Signal' },\n  { value: 'WAIT_FOR_TIMER', label: 'Wait for Timer' },\n]\n\nexport function StepsEditor({ value = [], onChange, error }: StepsEditorProps) {\n  const t = useT()\n\n  const addStep = () => {\n    const newStep: Step = {\n      stepId: `step_${Date.now()}`,\n      stepName: t('workflows.common.newStep'),\n      stepType: 'AUTOMATED',\n      description: '',\n      config: {},\n    }\n    onChange([...value, newStep])\n  }\n\n  const updateStep = (index: number, field: keyof Step, fieldValue: any) => {\n    const updated = [...value]\n    updated[index] = { ...updated[index], [field]: fieldValue }\n    onChange(updated)\n  }\n\n  const removeStep = (index: number) => {\n    onChange(value.filter((_, i) => i !== index))\n  }\n\n  const moveStep = (index: number, direction: 'up' | 'down') => {\n    const newIndex = direction === 'up' ? index - 1 : index + 1\n    if (newIndex < 0 || newIndex >= value.length) return\n\n    const updated = [...value]\n    const temp = updated[index]\n    updated[index] = updated[newIndex]\n    updated[newIndex] = temp\n    onChange(updated)\n  }\n\n  return (\n    <div className=\"space-y-4\">\n      <div className=\"flex flex-col gap-3 sm:flex-row sm:items-center sm:justify-between\">\n        <div>\n          <p className=\"text-sm text-muted-foreground\">\n            {t('workflows.form.descriptions.steps')}\n          </p>\n          {error && <p className=\"text-sm text-red-600 mt-1\">{error}</p>}\n        </div>\n        <Button type=\"button\" onClick={addStep} variant=\"outline\" size=\"sm\" className=\"w-full sm:w-auto\">\n          <Plus className=\"h-4 w-4 mr-1\" />\n          {t('workflows.form.addStep')}\n        </Button>\n      </div>\n\n      {value.length === 0 && (\n        <div className=\"p-6 text-center text-muted-foreground border rounded-md bg-muted\">\n          {t('workflows.form.noSteps')}\n        </div>\n      )}\n\n      <div className=\"space-y-3\">\n        {value.map((step, index) => (\n          <div key={index} className=\"p-4 border rounded-md bg-card shadow-sm\">\n            <div className=\"space-y-3\">\n              <div className=\"flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between\">\n                <div className=\"flex-1 grid grid-cols-1 sm:grid-cols-2 gap-3\">\n                  <div>\n                    <Label htmlFor={`step-${index}-id`} className=\"text-xs\">\n                      {t('workflows.steps.stepId')} *\n                    </Label>\n                    <Input\n                      id={`step-${index}-id`}\n                      value={step.stepId}\n                      onChange={(e) => updateStep(index, 'stepId', e.target.value)}\n                      placeholder=\"step_name\"\n                      className=\"mt-1\"\n                    />\n                  </div>\n                  <div>\n                    <Label htmlFor={`step-${index}-name`} className=\"text-xs\">\n                      {t('workflows.steps.stepName')} *\n                    </Label>\n                    <Input\n                      id={`step-${index}-name`}\n                      value={step.stepName}\n                      onChange={(e) => updateStep(index, 'stepName', e.target.value)}\n                      placeholder={t('workflows.steps.stepName')}\n                      className=\"mt-1\"\n                    />\n                  </div>\n                </div>\n                <div className=\"flex items-center gap-1 self-end sm:self-auto\">\n                  <Button\n                    type=\"button\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    onClick={() => moveStep(index, 'up')}\n                    disabled={index === 0}\n                    title={t('common.moveUp')}\n                  >\n                    <ChevronUp className=\"h-4 w-4\" />\n                  </Button>\n                  <Button\n                    type=\"button\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    onClick={() => moveStep(index, 'down')}\n                    disabled={index === value.length - 1}\n                    title={t('common.moveDown')}\n                  >\n                    <ChevronDown className=\"h-4 w-4\" />\n                  </Button>\n                  <Button\n                    type=\"button\"\n                    variant=\"ghost\"\n                    size=\"sm\"\n                    onClick={() => removeStep(index)}\n                    title={t('common.delete')}\n                  >\n                    <Trash2 className=\"h-4 w-4 text-red-600\" />\n                  </Button>\n                </div>\n              </div>\n\n              <div className=\"grid grid-cols-1 sm:grid-cols-2 gap-3\">\n                <div>\n                  <Label htmlFor={`step-${index}-type`} className=\"text-xs\">\n                    {t('workflows.steps.stepType')} *\n                  </Label>\n                  <Select\n                    value={step.stepType}\n                    onValueChange={(value) => updateStep(index, 'stepType', value)}\n                  >\n                    <SelectTrigger id={`step-${index}-type`} className=\"mt-1\">\n                      <SelectValue />\n                    </SelectTrigger>\n                    <SelectContent>\n                      {STEP_TYPES.map((type) => (\n                        <SelectItem key={type.value} value={type.value}>\n                          {t(`workflows.steps.types.${type.value}`)}\n                        </SelectItem>\n                      ))}\n                    </SelectContent>\n                  </Select>\n                </div>\n                <div>\n                  <Label htmlFor={`step-${index}-timeout`} className=\"text-xs\">\n                    {t('workflows.steps.timeout')} (ms)\n                  </Label>\n                  <Input\n                    id={`step-${index}-timeout`}\n                    type=\"number\"\n                    value={step.timeout || ''}\n                    onChange={(e) => updateStep(index, 'timeout', e.target.value ? parseInt(e.target.value) : undefined)}\n                    placeholder=\"30000\"\n                    className=\"mt-1\"\n                  />\n                </div>\n              </div>\n\n              {step.stepType === 'WAIT_FOR_TIMER' && (\n                <div className=\"grid grid-cols-1 sm:grid-cols-[1fr_auto_1fr] gap-3 items-end\">\n                  <div>\n                    <Label htmlFor={`step-${index}-duration`} className=\"text-xs\">\n                      {t('workflows.activities.waitDuration')}\n                    </Label>\n                    <Input\n                      id={`step-${index}-duration`}\n                      value={step.config?.duration || ''}\n                      onChange={(e) => updateStep(index, 'config', { ...step.config, duration: e.target.value, until: undefined })}\n                      placeholder={t('workflows.activities.waitDurationPlaceholder')}\n                      className=\"mt-1\"\n                    />\n                    <p className=\"text-xs text-muted-foreground mt-1\">\n                      {t('workflows.activities.waitDurationDescription')}\n                    </p>\n                  </div>\n                  <span className=\"text-xs text-muted-foreground pb-6\">{t('workflows.activities.waitOr')}</span>\n                  <div>\n                    <Label htmlFor={`step-${index}-until`} className=\"text-xs\">\n                      {t('workflows.activities.waitUntil')}\n                    </Label>\n                    <Input\n                      id={`step-${index}-until`}\n                      type=\"datetime-local\"\n                      value={step.config?.until ? step.config.until.slice(0, 16) : ''}\n                      onChange={(e) => updateStep(index, 'config', { ...step.config, until: e.target.value ? new Date(e.target.value).toISOString() : undefined, duration: undefined })}\n                      className=\"mt-1\"\n                    />\n                    <p className=\"text-xs text-muted-foreground mt-1\">\n                      {t('workflows.activities.waitUntilDescription')}\n                    </p>\n                  </div>\n                </div>\n              )}\n\n              <div>\n                <Label htmlFor={`step-${index}-description`} className=\"text-xs\">\n                  {t('workflows.steps.singular')} {t('workflows.definitions.description')}\n                </Label>\n                <Textarea\n                  id={`step-${index}-description`}\n                  value={step.description || ''}\n                  onChange={(e) => updateStep(index, 'description', e.target.value)}\n                  placeholder={t('workflows.form.placeholders.description')}\n                  rows={2}\n                  className=\"mt-1\"\n                />\n              </div>\n            </div>\n          </div>\n        ))}\n      </div>\n    </div>\n  )\n}\n"],
+  "mappings": "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",
   "names": ["value"]
 }

package/dist/modules/workflows/components/WorkflowGraph.js

@@ -14,7 +14,7 @@ import {
   ConnectionMode,
   MarkerType
 } from "@xyflow/react";
-import { StartNode, EndNode, UserTaskNode, AutomatedNode, SubWorkflowNode, WaitForSignalNode } from "./nodes/index.js";
+import { StartNode, EndNode, UserTaskNode, AutomatedNode, SubWorkflowNode, WaitForSignalNode, WaitForTimerNode } from "./nodes/index.js";
 import { WorkflowTransitionEdge } from "./WorkflowTransitionEdge.js";
 import { STATUS_COLORS } from "../lib/status-colors.js";
 import { Alert, AlertDescription } from "@open-mercato/ui/primitives/alert";
@@ -102,7 +102,8 @@ function WorkflowGraph({
       userTask: UserTaskNode,
       automated: AutomatedNode,
       subWorkflow: SubWorkflowNode,
-      waitForSignal: WaitForSignalNode
+      waitForSignal: WaitForSignalNode,
+      waitForTimer: WaitForTimerNode
     }),
     []
   );

package/dist/modules/workflows/components/WorkflowGraph.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../src/modules/workflows/components/WorkflowGraph.tsx"],
-  "sourcesContent": ["'use client'\n\nimport { useCallback, useMemo, useEffect, useState } from 'react'\nimport {\n  ReactFlow,\n  Node,\n  Edge,\n  Controls,\n  Background,\n  BackgroundVariant,\n  MiniMap,\n  Panel,\n  useNodesState,\n  useEdgesState,\n  addEdge,\n  Connection,\n  ConnectionMode,\n  MarkerType,\n} from '@xyflow/react'\nimport {StartNode, EndNode, UserTaskNode, AutomatedNode, SubWorkflowNode, WaitForSignalNode} from './nodes'\nimport { WorkflowTransitionEdge } from './WorkflowTransitionEdge'\nimport { STATUS_COLORS } from '../lib/status-colors'\nimport { Alert, AlertDescription } from '@open-mercato/ui/primitives/alert'\nimport { Edit3 } from 'lucide-react'\nimport { useTheme } from '@open-mercato/ui/theme'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\n// NOTE: ReactFlow styles should be imported in the page that uses this component\n// or in a global CSS file. Import: '@xyflow/react/dist/style.css'\n\nexport interface WorkflowGraphProps {\n  initialNodes?: Node[]\n  initialEdges?: Edge[]\n  onNodesChange?: (changes: any[]) => void\n  onEdgesChange?: (changes: any[]) => void\n  onNodeClick?: (event: React.MouseEvent, node: Node) => void\n  onEdgeClick?: (event: React.MouseEvent, edge: Edge) => void\n  onConnect?: (connection: Connection) => void\n  editable?: boolean\n  className?: string\n  height?: string\n}\n\n/**\n * WorkflowGraph - ReactFlow wrapper component for workflow visualization\n *\n * Provides a graph-based view of workflow definitions with:\n * - Pan and zoom controls\n * - Background grid\n * - Mini-map for navigation\n * - Optional editing capabilities\n */\nexport function WorkflowGraph({\n  initialNodes = [],\n  initialEdges = [],\n  onNodesChange: onNodesChangeProp,\n  onEdgesChange: onEdgesChangeProp,\n  onNodeClick: onNodeClickProp,\n  onEdgeClick: onEdgeClickProp,\n  onConnect: onConnectProp,\n  editable = false,\n  className = '',\n  height = '600px',\n}: WorkflowGraphProps) {\n  const t = useT()\n  // Use ReactFlow hooks for node and edge state management\n  const [nodes, setNodes, onNodesChange] = useNodesState(initialNodes)\n  const [edges, setEdges, onEdgesChange] = useEdgesState(initialEdges)\n\n  // Get theme for dark mode support\n  const { resolvedTheme } = useTheme()\n  const isDark = resolvedTheme === 'dark'\n  const backgroundDotColor = isDark ? '#374151' : '#e5e7eb'\n  const [isCompactViewport, setIsCompactViewport] = useState(false)\n\n  useEffect(() => {\n    if (typeof window === 'undefined') return\n    const mediaQuery = window.matchMedia('(max-width: 1279px)')\n    const updateViewportMode = () => setIsCompactViewport(mediaQuery.matches)\n\n    updateViewportMode()\n    mediaQuery.addEventListener('change', updateViewportMode)\n\n    return () => {\n      mediaQuery.removeEventListener('change', updateViewportMode)\n    }\n  }, [])\n\n  // Sync internal state when external state changes (e.g., when parent adds nodes)\n  useEffect(() => {\n    setNodes(initialNodes)\n  }, [initialNodes, setNodes])\n\n  useEffect(() => {\n    setEdges(initialEdges)\n  }, [initialEdges, setEdges])\n\n  // Handle connection between nodes (when user drags from one node to another)\n  const onConnect = useCallback(\n    (connection: Connection) => {\n      if (onConnectProp) {\n        // Let parent handle the connection\n        onConnectProp(connection)\n      } else {\n        // Fallback: handle internally if no parent callback\n        const newEdge = {\n          ...connection,\n          type: 'workflowTransition',\n          animated: false,\n          markerEnd: {\n            type: MarkerType.ArrowClosed,\n            width: 16,\n            height: 16,\n            color: '#9ca3af',\n          },\n        }\n        setEdges((eds) => addEdge(newEdge, eds))\n      }\n    },\n    [setEdges, onConnectProp]\n  )\n\n  // Notify parent when nodes change\n  const handleNodesChange = useCallback(\n    (changes: any) => {\n      onNodesChange(changes)\n      if (onNodesChangeProp) {\n        onNodesChangeProp(changes)\n      }\n    },\n    [onNodesChange, onNodesChangeProp]\n  )\n\n  // Notify parent when edges change\n  const handleEdgesChange = useCallback(\n    (changes: any) => {\n      onEdgesChange(changes)\n      if (onEdgesChangeProp) {\n        onEdgesChangeProp(changes)\n      }\n    },\n    [onEdgesChange, onEdgesChangeProp]\n  )\n\n  // Register custom node types\n  const nodeTypes = useMemo(\n    () => ({\n      start: StartNode,\n      end: EndNode,\n      userTask: UserTaskNode,\n      automated: AutomatedNode,\n      subWorkflow: SubWorkflowNode,\n      waitForSignal: WaitForSignalNode,\n    }),\n    []\n  )\n\n  // Register custom edge types\n  const edgeTypes = useMemo(\n    () => ({\n      workflowTransition: WorkflowTransitionEdge,\n    }),\n    []\n  )\n\n  return (\n    <div className={`workflow-graph-container ${className}`} style={{ height }}>\n      <ReactFlow\n        nodes={nodes}\n        edges={edges}\n        nodeTypes={nodeTypes}\n        edgeTypes={edgeTypes}\n        onNodesChange={handleNodesChange}\n        onEdgesChange={handleEdgesChange}\n        onConnect={editable ? onConnect : undefined}\n        onNodeClick={onNodeClickProp}\n        onEdgeClick={onEdgeClickProp}\n        connectionMode={ConnectionMode.Loose}\n        fitView\n        fitViewOptions={{\n          padding: 0.2,\n          maxZoom: isCompactViewport ? 0.9 : 1,\n        }}\n        minZoom={0.1}\n        maxZoom={2}\n        defaultEdgeOptions={{\n          type: 'workflowTransition',\n          animated: false,\n          markerEnd: {\n            type: MarkerType.ArrowClosed,\n            width: 16,\n            height: 16,\n            color: '#9ca3af',\n          },\n        }}\n        nodesDraggable={editable}\n        nodesConnectable={editable}\n        elementsSelectable={editable}\n        proOptions={{ hideAttribution: true }}\n      >\n        {/* Background grid for visual reference */}\n        <Background\n          variant={BackgroundVariant.Dots}\n          gap={16}\n          size={1}\n          color={backgroundDotColor}\n        />\n\n        {/* Zoom and pan controls */}\n        <Controls\n          showZoom={true}\n          showFitView={true}\n          showInteractive={false}\n          position={isCompactViewport ? 'bottom-right' : 'top-right'}\n          className={`!bg-card !border-border !shadow-md [&>button]:!bg-card [&>button]:!border-border [&>button]:!fill-foreground [&>button:hover]:!bg-muted ${isCompactViewport ? 'scale-90 origin-bottom-right' : ''}`}\n        />\n\n        {/* Mini-map for navigation in large workflows */}\n        {!isCompactViewport && (\n          <MiniMap\n            nodeStrokeWidth={3}\n            nodeColor={(node) => {\n              // Color nodes by status - using status-based colors\n              const status = (node.data?.status || 'not_started') as keyof typeof STATUS_COLORS\n              return STATUS_COLORS[status]?.hex || STATUS_COLORS.not_started.hex\n            }}\n            maskColor=\"rgba(0, 0, 0, 0.1)\"\n            position=\"bottom-left\"\n            className=\"!bg-card !border !border-border !rounded-lg\"\n          />\n        )}\n\n        {/* Info panel */}\n        {!editable && !isCompactViewport && (\n          <Panel position=\"top-left\" style={{ margin: 10 }}>\n            <div className=\"bg-card rounded-lg shadow-sm border border-border px-4 py-2\">\n              <p className=\"text-sm text-muted-foreground font-medium\">\n                {t('workflows.graph.visualization')}\n              </p>\n            </div>\n          </Panel>\n        )}\n\n        {editable && !isCompactViewport && (\n          <Panel position=\"top-left\" style={{ margin: 10 }}>\n            <Alert variant=\"info\" className=\"max-w-sm\">\n              <Edit3 className=\"size-4\" />\n              <AlertDescription className=\"font-medium\">\n                {t('workflows.graph.editModeInfo')}\n              </AlertDescription>\n            </Alert>\n          </Panel>\n        )}\n      </ReactFlow>\n    </div>\n  )\n}\n\n/**\n * WorkflowGraphReadOnly - Read-only version for viewing workflow execution\n */\nexport function WorkflowGraphReadOnly({\n  nodes,\n  edges,\n  className = '',\n  height = '500px',\n}: {\n  nodes: Node[]\n  edges: Edge[]\n  className?: string\n  height?: string\n}) {\n  return (\n    <WorkflowGraph\n      initialNodes={nodes}\n      initialEdges={edges}\n      editable={false}\n      className={className}\n      height={height}\n    />\n  )\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["'use client'\n\nimport { useCallback, useMemo, useEffect, useState } from 'react'\nimport {\n  ReactFlow,\n  Node,\n  Edge,\n  Controls,\n  Background,\n  BackgroundVariant,\n  MiniMap,\n  Panel,\n  useNodesState,\n  useEdgesState,\n  addEdge,\n  Connection,\n  ConnectionMode,\n  MarkerType,\n} from '@xyflow/react'\nimport {StartNode, EndNode, UserTaskNode, AutomatedNode, SubWorkflowNode, WaitForSignalNode, WaitForTimerNode} from './nodes'\nimport { WorkflowTransitionEdge } from './WorkflowTransitionEdge'\nimport { STATUS_COLORS } from '../lib/status-colors'\nimport { Alert, AlertDescription } from '@open-mercato/ui/primitives/alert'\nimport { Edit3 } from 'lucide-react'\nimport { useTheme } from '@open-mercato/ui/theme'\nimport { useT } from '@open-mercato/shared/lib/i18n/context'\n\n// NOTE: ReactFlow styles should be imported in the page that uses this component\n// or in a global CSS file. Import: '@xyflow/react/dist/style.css'\n\nexport interface WorkflowGraphProps {\n  initialNodes?: Node[]\n  initialEdges?: Edge[]\n  onNodesChange?: (changes: any[]) => void\n  onEdgesChange?: (changes: any[]) => void\n  onNodeClick?: (event: React.MouseEvent, node: Node) => void\n  onEdgeClick?: (event: React.MouseEvent, edge: Edge) => void\n  onConnect?: (connection: Connection) => void\n  editable?: boolean\n  className?: string\n  height?: string\n}\n\n/**\n * WorkflowGraph - ReactFlow wrapper component for workflow visualization\n *\n * Provides a graph-based view of workflow definitions with:\n * - Pan and zoom controls\n * - Background grid\n * - Mini-map for navigation\n * - Optional editing capabilities\n */\nexport function WorkflowGraph({\n  initialNodes = [],\n  initialEdges = [],\n  onNodesChange: onNodesChangeProp,\n  onEdgesChange: onEdgesChangeProp,\n  onNodeClick: onNodeClickProp,\n  onEdgeClick: onEdgeClickProp,\n  onConnect: onConnectProp,\n  editable = false,\n  className = '',\n  height = '600px',\n}: WorkflowGraphProps) {\n  const t = useT()\n  // Use ReactFlow hooks for node and edge state management\n  const [nodes, setNodes, onNodesChange] = useNodesState(initialNodes)\n  const [edges, setEdges, onEdgesChange] = useEdgesState(initialEdges)\n\n  // Get theme for dark mode support\n  const { resolvedTheme } = useTheme()\n  const isDark = resolvedTheme === 'dark'\n  const backgroundDotColor = isDark ? '#374151' : '#e5e7eb'\n  const [isCompactViewport, setIsCompactViewport] = useState(false)\n\n  useEffect(() => {\n    if (typeof window === 'undefined') return\n    const mediaQuery = window.matchMedia('(max-width: 1279px)')\n    const updateViewportMode = () => setIsCompactViewport(mediaQuery.matches)\n\n    updateViewportMode()\n    mediaQuery.addEventListener('change', updateViewportMode)\n\n    return () => {\n      mediaQuery.removeEventListener('change', updateViewportMode)\n    }\n  }, [])\n\n  // Sync internal state when external state changes (e.g., when parent adds nodes)\n  useEffect(() => {\n    setNodes(initialNodes)\n  }, [initialNodes, setNodes])\n\n  useEffect(() => {\n    setEdges(initialEdges)\n  }, [initialEdges, setEdges])\n\n  // Handle connection between nodes (when user drags from one node to another)\n  const onConnect = useCallback(\n    (connection: Connection) => {\n      if (onConnectProp) {\n        // Let parent handle the connection\n        onConnectProp(connection)\n      } else {\n        // Fallback: handle internally if no parent callback\n        const newEdge = {\n          ...connection,\n          type: 'workflowTransition',\n          animated: false,\n          markerEnd: {\n            type: MarkerType.ArrowClosed,\n            width: 16,\n            height: 16,\n            color: '#9ca3af',\n          },\n        }\n        setEdges((eds) => addEdge(newEdge, eds))\n      }\n    },\n    [setEdges, onConnectProp]\n  )\n\n  // Notify parent when nodes change\n  const handleNodesChange = useCallback(\n    (changes: any) => {\n      onNodesChange(changes)\n      if (onNodesChangeProp) {\n        onNodesChangeProp(changes)\n      }\n    },\n    [onNodesChange, onNodesChangeProp]\n  )\n\n  // Notify parent when edges change\n  const handleEdgesChange = useCallback(\n    (changes: any) => {\n      onEdgesChange(changes)\n      if (onEdgesChangeProp) {\n        onEdgesChangeProp(changes)\n      }\n    },\n    [onEdgesChange, onEdgesChangeProp]\n  )\n\n  // Register custom node types\n  const nodeTypes = useMemo(\n    () => ({\n      start: StartNode,\n      end: EndNode,\n      userTask: UserTaskNode,\n      automated: AutomatedNode,\n      subWorkflow: SubWorkflowNode,\n      waitForSignal: WaitForSignalNode,\n      waitForTimer: WaitForTimerNode,\n    }),\n    []\n  )\n\n  // Register custom edge types\n  const edgeTypes = useMemo(\n    () => ({\n      workflowTransition: WorkflowTransitionEdge,\n    }),\n    []\n  )\n\n  return (\n    <div className={`workflow-graph-container ${className}`} style={{ height }}>\n      <ReactFlow\n        nodes={nodes}\n        edges={edges}\n        nodeTypes={nodeTypes}\n        edgeTypes={edgeTypes}\n        onNodesChange={handleNodesChange}\n        onEdgesChange={handleEdgesChange}\n        onConnect={editable ? onConnect : undefined}\n        onNodeClick={onNodeClickProp}\n        onEdgeClick={onEdgeClickProp}\n        connectionMode={ConnectionMode.Loose}\n        fitView\n        fitViewOptions={{\n          padding: 0.2,\n          maxZoom: isCompactViewport ? 0.9 : 1,\n        }}\n        minZoom={0.1}\n        maxZoom={2}\n        defaultEdgeOptions={{\n          type: 'workflowTransition',\n          animated: false,\n          markerEnd: {\n            type: MarkerType.ArrowClosed,\n            width: 16,\n            height: 16,\n            color: '#9ca3af',\n          },\n        }}\n        nodesDraggable={editable}\n        nodesConnectable={editable}\n        elementsSelectable={editable}\n        proOptions={{ hideAttribution: true }}\n      >\n        {/* Background grid for visual reference */}\n        <Background\n          variant={BackgroundVariant.Dots}\n          gap={16}\n          size={1}\n          color={backgroundDotColor}\n        />\n\n        {/* Zoom and pan controls */}\n        <Controls\n          showZoom={true}\n          showFitView={true}\n          showInteractive={false}\n          position={isCompactViewport ? 'bottom-right' : 'top-right'}\n          className={`!bg-card !border-border !shadow-md [&>button]:!bg-card [&>button]:!border-border [&>button]:!fill-foreground [&>button:hover]:!bg-muted ${isCompactViewport ? 'scale-90 origin-bottom-right' : ''}`}\n        />\n\n        {/* Mini-map for navigation in large workflows */}\n        {!isCompactViewport && (\n          <MiniMap\n            nodeStrokeWidth={3}\n            nodeColor={(node) => {\n              // Color nodes by status - using status-based colors\n              const status = (node.data?.status || 'not_started') as keyof typeof STATUS_COLORS\n              return STATUS_COLORS[status]?.hex || STATUS_COLORS.not_started.hex\n            }}\n            maskColor=\"rgba(0, 0, 0, 0.1)\"\n            position=\"bottom-left\"\n            className=\"!bg-card !border !border-border !rounded-lg\"\n          />\n        )}\n\n        {/* Info panel */}\n        {!editable && !isCompactViewport && (\n          <Panel position=\"top-left\" style={{ margin: 10 }}>\n            <div className=\"bg-card rounded-lg shadow-sm border border-border px-4 py-2\">\n              <p className=\"text-sm text-muted-foreground font-medium\">\n                {t('workflows.graph.visualization')}\n              </p>\n            </div>\n          </Panel>\n        )}\n\n        {editable && !isCompactViewport && (\n          <Panel position=\"top-left\" style={{ margin: 10 }}>\n            <Alert variant=\"info\" className=\"max-w-sm\">\n              <Edit3 className=\"size-4\" />\n              <AlertDescription className=\"font-medium\">\n                {t('workflows.graph.editModeInfo')}\n              </AlertDescription>\n            </Alert>\n          </Panel>\n        )}\n      </ReactFlow>\n    </div>\n  )\n}\n\n/**\n * WorkflowGraphReadOnly - Read-only version for viewing workflow execution\n */\nexport function WorkflowGraphReadOnly({\n  nodes,\n  edges,\n  className = '',\n  height = '500px',\n}: {\n  nodes: Node[]\n  edges: Edge[]\n  className?: string\n  height?: string\n}) {\n  return (\n    <WorkflowGraph\n      initialNodes={nodes}\n      initialEdges={edges}\n      editable={false}\n      className={className}\n      height={height}\n    />\n  )\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/modules/workflows/components/nodes/WaitForTimerNode.js

@@ -0,0 +1,54 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Handle, Position } from "@xyflow/react";
+import { WorkflowNodeCard } from "../WorkflowNodeCard.js";
+function WaitForTimerNode({ data, isConnectable, selected }) {
+  const nodeData = data;
+  const mapStatus = (status) => {
+    if (!status || status === "pending") return "not_started";
+    if (status === "running" || status === "in_progress") return "in_progress";
+    if (status === "completed") return "completed";
+    if (status === "error") return "not_started";
+    return "not_started";
+  };
+  const workflowStatus = mapStatus(nodeData.status);
+  const duration = nodeData.duration || nodeData.config?.duration;
+  const until = nodeData.until || nodeData.config?.until;
+  const description = nodeData.description || (duration ? `Wait for ${duration}` : until ? `Wait until ${until}` : "Timer-based pause");
+  return /* @__PURE__ */ jsxs("div", { className: "wait-for-timer-node", title: nodeData.tooltip, children: [
+    /* @__PURE__ */ jsx(
+      Handle,
+      {
+        type: "target",
+        position: Position.Top,
+        id: "target",
+        isConnectable,
+        className: "!w-3 !h-3 !bg-[#0080FE] !border-2 !border-white"
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      WorkflowNodeCard,
+      {
+        title: nodeData.label,
+        description,
+        status: workflowStatus,
+        nodeType: "waitForTimer",
+        selected
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Handle,
+      {
+        type: "source",
+        position: Position.Bottom,
+        id: "source",
+        isConnectable,
+        className: "!w-3 !h-3 !bg-[#0080FE] !border-2 !border-white"
+      }
+    )
+  ] });
+}
+export {
+  WaitForTimerNode
+};
+//# sourceMappingURL=WaitForTimerNode.js.map

package/dist/modules/workflows/components/nodes/WaitForTimerNode.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../../../src/modules/workflows/components/nodes/WaitForTimerNode.tsx"],
+  "sourcesContent": ["'use client'\n\nimport { Handle, Position, NodeProps } from '@xyflow/react'\nimport { WorkflowNodeCard } from '../WorkflowNodeCard'\nimport { WorkflowStatus } from '../../lib/status-colors'\n\nexport interface WaitForTimerNodeData {\n  label: string\n  description?: string\n  duration?: string\n  until?: string\n  config?: { duration?: string; until?: string }\n  version?: number\n  status?: 'pending' | 'running' | 'completed' | 'error' | 'not_started' | 'in_progress'\n  stepNumber?: number\n  badge?: string\n  tooltip?: string\n  executionStatus?: 'completed' | 'active' | 'pending' | 'failed' | 'skipped'\n}\n\n/**\n * WaitForTimerNode - Pauses workflow for a duration or until a specific datetime\n * Uses WorkflowNodeCard for consistent styling\n */\nexport function WaitForTimerNode({ data, isConnectable, selected }: NodeProps) {\n  const nodeData = data as unknown as WaitForTimerNodeData\n\n  const mapStatus = (status?: string): WorkflowStatus => {\n    if (!status || status === 'pending') return 'not_started'\n    if (status === 'running' || status === 'in_progress') return 'in_progress'\n    if (status === 'completed') return 'completed'\n    if (status === 'error') return 'not_started'\n    return 'not_started'\n  }\n\n  const workflowStatus = mapStatus(nodeData.status)\n\n  const duration = nodeData.duration || nodeData.config?.duration\n  const until = nodeData.until || nodeData.config?.until\n  const description = nodeData.description ||\n    (duration ? `Wait for ${duration}` : until ? `Wait until ${until}` : 'Timer-based pause')\n\n  return (\n    <div className=\"wait-for-timer-node\" title={nodeData.tooltip}>\n      <Handle\n        type=\"target\"\n        position={Position.Top}\n        id=\"target\"\n        isConnectable={isConnectable}\n        className=\"!w-3 !h-3 !bg-[#0080FE] !border-2 !border-white\"\n      />\n\n      <WorkflowNodeCard\n        title={nodeData.label}\n        description={description}\n        status={workflowStatus}\n        nodeType=\"waitForTimer\"\n        selected={selected}\n      />\n\n      <Handle\n        type=\"source\"\n        position={Position.Bottom}\n        id=\"source\"\n        isConnectable={isConnectable}\n        className=\"!w-3 !h-3 !bg-[#0080FE] !border-2 !border-white\"\n      />\n    </div>\n  )\n}\n"],
+  "mappings": ";AA2CI,SACE,KADF;AAzCJ,SAAS,QAAQ,gBAA2B;AAC5C,SAAS,wBAAwB;AAqB1B,SAAS,iBAAiB,EAAE,MAAM,eAAe,SAAS,GAAc;AAC7E,QAAM,WAAW;AAEjB,QAAM,YAAY,CAAC,WAAoC;AACrD,QAAI,CAAC,UAAU,WAAW,UAAW,QAAO;AAC5C,QAAI,WAAW,aAAa,WAAW,cAAe,QAAO;AAC7D,QAAI,WAAW,YAAa,QAAO;AACnC,QAAI,WAAW,QAAS,QAAO;AAC/B,WAAO;AAAA,EACT;AAEA,QAAM,iBAAiB,UAAU,SAAS,MAAM;AAEhD,QAAM,WAAW,SAAS,YAAY,SAAS,QAAQ;AACvD,QAAM,QAAQ,SAAS,SAAS,SAAS,QAAQ;AACjD,QAAM,cAAc,SAAS,gBAC1B,WAAW,YAAY,QAAQ,KAAK,QAAQ,cAAc,KAAK,KAAK;AAEvE,SACE,qBAAC,SAAI,WAAU,uBAAsB,OAAO,SAAS,SACnD;AAAA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAU,SAAS;AAAA,QACnB,IAAG;AAAA,QACH;AAAA,QACA,WAAU;AAAA;AAAA,IACZ;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,OAAO,SAAS;AAAA,QAChB;AAAA,QACA,QAAQ;AAAA,QACR,UAAS;AAAA,QACT;AAAA;AAAA,IACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,MAAK;AAAA,QACL,UAAU,SAAS;AAAA,QACnB,IAAG;AAAA,QACH;AAAA,QACA,WAAU;AAAA;AAAA,IACZ;AAAA,KACF;AAEJ;",
+  "names": []
+}

package/dist/modules/workflows/components/nodes/index.js

@@ -4,12 +4,14 @@ import { UserTaskNode } from "./UserTaskNode.js";
 import { AutomatedNode } from "./AutomatedNode.js";
 import { SubWorkflowNode } from "./SubWorkflowNode.js";
 import { WaitForSignalNode } from "./WaitForSignalNode.js";
+import { WaitForTimerNode } from "./WaitForTimerNode.js";
 export {
   AutomatedNode,
   EndNode,
   StartNode,
   SubWorkflowNode,
   UserTaskNode,
-  WaitForSignalNode
+  WaitForSignalNode,
+  WaitForTimerNode
 };
 //# sourceMappingURL=index.js.map

package/dist/modules/workflows/components/nodes/index.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../../../src/modules/workflows/components/nodes/index.ts"],
-  "sourcesContent": ["export { StartNode } from './StartNode'\nexport type { StartNodeData } from './StartNode'\n\nexport { EndNode } from './EndNode'\nexport type { EndNodeData } from './EndNode'\n\nexport { UserTaskNode } from './UserTaskNode'\nexport type { UserTaskNodeData } from './UserTaskNode'\n\nexport { AutomatedNode } from './AutomatedNode'\nexport type { AutomatedNodeData } from './AutomatedNode'\n\nexport { SubWorkflowNode } from './SubWorkflowNode'\nexport type { SubWorkflowNodeData } from './SubWorkflowNode'\n\nexport { WaitForSignalNode } from './WaitForSignalNode'\nexport type { WaitForSignalNodeData } from './WaitForSignalNode'\n"],
-  "mappings": "AAAA,SAAS,iBAAiB;AAG1B,SAAS,eAAe;AAGxB,SAAS,oBAAoB;AAG7B,SAAS,qBAAqB;AAG9B,SAAS,uBAAuB;AAGhC,SAAS,yBAAyB;",
+  "sourcesContent": ["export { StartNode } from './StartNode'\nexport type { StartNodeData } from './StartNode'\n\nexport { EndNode } from './EndNode'\nexport type { EndNodeData } from './EndNode'\n\nexport { UserTaskNode } from './UserTaskNode'\nexport type { UserTaskNodeData } from './UserTaskNode'\n\nexport { AutomatedNode } from './AutomatedNode'\nexport type { AutomatedNodeData } from './AutomatedNode'\n\nexport { SubWorkflowNode } from './SubWorkflowNode'\nexport type { SubWorkflowNodeData } from './SubWorkflowNode'\n\nexport { WaitForSignalNode } from './WaitForSignalNode'\nexport type { WaitForSignalNodeData } from './WaitForSignalNode'\n\nexport { WaitForTimerNode } from './WaitForTimerNode'\nexport type { WaitForTimerNodeData } from './WaitForTimerNode'\n"],
+  "mappings": "AAAA,SAAS,iBAAiB;AAG1B,SAAS,eAAe;AAGxB,SAAS,oBAAoB;AAG7B,SAAS,qBAAqB;AAG9B,SAAS,uBAAuB;AAGhC,SAAS,yBAAyB;AAGlC,SAAS,wBAAwB;",
   "names": []
 }

package/dist/modules/workflows/data/validators.js

@@ -1,5 +1,33 @@
 import { z } from "zod";
+import { parseDuration } from "../lib/duration.js";
 const uuid = z.uuid();
+const containsTemplate = (value) => value.includes("{{");
+function isValidDurationString(value) {
+  if (typeof value !== "string" || value.length === 0) return false;
+  if (containsTemplate(value)) return true;
+  try {
+    const ms = parseDuration(value);
+    return Number.isFinite(ms) && ms > 0;
+  } catch {
+    return false;
+  }
+}
+function isValidIsoDateString(value) {
+  if (typeof value !== "string" || value.length === 0) return false;
+  if (containsTemplate(value)) return true;
+  const d = new Date(value);
+  return !Number.isNaN(d.getTime());
+}
+function isFutureIsoDateString(value) {
+  if (typeof value !== "string" || value.length === 0) return false;
+  if (containsTemplate(value)) return true;
+  const d = new Date(value);
+  if (Number.isNaN(d.getTime())) return false;
+  return d.getTime() > Date.now();
+}
+const DURATION_ERROR = "Invalid duration. Use ISO 8601 (e.g., PT5M, PT1H, P1D) or simple format (5m, 1h, 3d)";
+const UNTIL_ERROR = 'Invalid "until". Provide an ISO 8601 datetime string';
+const UNTIL_PAST_ERROR = '"until" must be a future datetime';
 const workflowStepTypeSchema = z.enum([
   "START",
   "END",
@@ -131,6 +159,49 @@ const activityDefinitionSchema = z.object({
     // Auto-trigger on failure
   }).optional()
   // Compensation configuration (Phase 8.2)
+}).superRefine((activity, ctx) => {
+  if (activity.activityType !== "WAIT") return;
+  const config = activity.config || {};
+  const hasDuration = config.duration != null && config.duration !== "";
+  const hasUntil = config.until != null && config.until !== "";
+  if (!hasDuration && !hasUntil) {
+    ctx.addIssue({
+      code: "custom",
+      path: ["config"],
+      message: 'WAIT activity requires "duration" or "until"'
+    });
+    return;
+  }
+  if (hasDuration && hasUntil) {
+    ctx.addIssue({
+      code: "custom",
+      path: ["config"],
+      message: 'WAIT activity accepts "duration" OR "until", not both'
+    });
+    return;
+  }
+  if (hasDuration && !isValidDurationString(config.duration)) {
+    ctx.addIssue({
+      code: "custom",
+      path: ["config", "duration"],
+      message: DURATION_ERROR
+    });
+  }
+  if (hasUntil) {
+    if (!isValidIsoDateString(config.until)) {
+      ctx.addIssue({
+        code: "custom",
+        path: ["config", "until"],
+        message: UNTIL_ERROR
+      });
+    } else if (!isFutureIsoDateString(config.until)) {
+      ctx.addIssue({
+        code: "custom",
+        path: ["config", "until"],
+        message: UNTIL_PAST_ERROR
+      });
+    }
+  }
 });
 const localizedMessageSchema = z.record(z.string(), z.string());
 const startPreConditionSchema = z.object({
@@ -158,6 +229,49 @@ const workflowStepSchema = z.object({
   retryPolicy: retryPolicySchema.optional(),
   // Pre-conditions for START step (business rules to validate before workflow can be started)
   preConditions: z.array(startPreConditionSchema).optional()
+}).superRefine((step, ctx) => {
+  if (step.stepType !== "WAIT_FOR_TIMER") return;
+  const config = step.config || {};
+  const hasDuration = config.duration != null && config.duration !== "";
+  const hasUntil = config.until != null && config.until !== "";
+  if (!hasDuration && !hasUntil) {
+    ctx.addIssue({
+      code: "custom",
+      path: ["config"],
+      message: 'WAIT_FOR_TIMER step requires "duration" or "until"'
+    });
+    return;
+  }
+  if (hasDuration && hasUntil) {
+    ctx.addIssue({
+      code: "custom",
+      path: ["config"],
+      message: 'WAIT_FOR_TIMER step accepts "duration" OR "until", not both'
+    });
+    return;
+  }
+  if (hasDuration && !isValidDurationString(config.duration)) {
+    ctx.addIssue({
+      code: "custom",
+      path: ["config", "duration"],
+      message: DURATION_ERROR
+    });
+  }
+  if (hasUntil) {
+    if (!isValidIsoDateString(config.until)) {
+      ctx.addIssue({
+        code: "custom",
+        path: ["config", "until"],
+        message: UNTIL_ERROR
+      });
+    } else if (!isFutureIsoDateString(config.until)) {
+      ctx.addIssue({
+        code: "custom",
+        path: ["config", "until"],
+        message: UNTIL_PAST_ERROR
+      });
+    }
+  }
 });
 const transitionConditionSchema = z.object({
   ruleId: z.string().min(1).max(50),
@@ -496,6 +610,9 @@ export {
   eventPatternSchema,
   eventTriggerConfigSchema,
   eventTriggerFilterSchema,
+  isFutureIsoDateString,
+  isValidDurationString,
+  isValidIsoDateString,
   localizedMessageSchema,
   retryPolicySchema,
   startPreConditionSchema,