@gxp-dev/mod-ui 2.0.0 → 2.0.3

package/dist/components/compositions/elements/builder/ReactiveCanvasBuilder.vue2.js.map

@@ -1 +1 @@
-{"version":3,"file":"ReactiveCanvasBuilder.vue2.js","sources":["../../../../../src/components/compositions/elements/builder/ReactiveCanvasBuilder.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * ReactiveCanvasBuilder — visual canvas where component-like blocks can\n * be placed and configured.\n *\n * Three-pane layout (matches FormBuilder):\n *   - LEFT (Palette):    a list of built-in block types. Click to add.\n *   - MIDDLE (Canvas):   a fixed-size relative-positioned surface. Each\n *                        block renders as an absolutely-positioned\n *                        placeholder card showing type + size + position.\n *                        Click to select.\n *   - RIGHT (Inspector): edits the selected block's x / y / width /\n *                        height (number inputs), type (Select), and\n *                        props (JSON textarea for now).\n *\n * Blocks may be repositioned by pointer-drag (no snapping, raw pixel\n * delta) and resized via four corner handles. Drag clamps to the\n * canvas bounds; resize clamps each block to a 20x20 minimum.\n *\n * State is owned by `reactiveCanvasBuilderStore`. Two-way binds the\n * full `ReactiveCanvasBuilderSchema` via `defineModel`.\n */\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from \"vue\"\nimport { Plus, Trash2, X } from \"lucide-vue-next\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\"\nimport {\n  FieldFrame,\n  type FieldFrameProps,\n} from \"@/components/ui/field-frame\"\nimport { Input } from \"@/components/ui/input\"\nimport { Label } from \"@/components/ui/label\"\nimport {\n  Select,\n  SelectContent,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from \"@/components/ui/select\"\nimport { Textarea } from \"@/components/ui/textarea\"\nimport {\n  REACTIVE_CANVAS_BLOCK_TYPES,\n  useReactiveCanvasBuilder,\n  type ReactiveCanvasBlock,\n  type ReactiveCanvasBuilderSchema,\n} from \"@/stores/reactiveCanvasBuilderStore\"\nimport { cn } from \"@/lib/utils\"\n\nexport interface ReactiveCanvasBuilderProps\n  extends Pick<FieldFrameProps, \"label\" | \"hideLabel\" | \"helpText\" | \"errors\"> {\n  /** Initial / current schema. Two-way bindable via v-model. */\n  modelValue?: ReactiveCanvasBuilderSchema\n  /**\n   * Identifier used to key the reactiveCanvasBuilderStore. Defaults to\n   * a stable auto-generated id so multiple builders on the same page\n   * don't collide.\n   */\n  builderId?: string\n  name?: string | null\n  item?: Record<string, unknown>\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<ReactiveCanvasBuilderProps>(), {\n  errors: () => [],\n  item: () => ({}),\n})\n\nconst model = defineModel<ReactiveCanvasBuilderSchema | undefined>(\n  \"modelValue\",\n)\n\nlet nextAutoId = 0\nfunction makeAutoId(): string {\n  nextAutoId += 1\n  return `reactive-canvas-${Date.now()}-${nextAutoId}`\n}\nconst fallbackId = ref<string>(makeAutoId())\nconst builderId = computed<string>(() => props.builderId ?? fallbackId.value)\n\nconst builder = useReactiveCanvasBuilder(builderId.value)\n\nfunction isSchema(value: unknown): value is ReactiveCanvasBuilderSchema {\n  if (typeof value !== \"object\" || value === null) {\n    return false\n  }\n  const v = value as Record<string, unknown>\n  return (\n    typeof v.width === \"number\" &&\n    typeof v.height === \"number\" &&\n    Array.isArray(v.blocks)\n  )\n}\n\nonMounted(() => {\n  const seed = model.value\n  if (isSchema(seed)) {\n    builder.loadSchema(seed)\n  }\n})\n\nwatch(\n  () => builder.schema.value,\n  (next) => {\n    model.value = next\n  },\n  { deep: true },\n)\n\nconst schema = computed<ReactiveCanvasBuilderSchema>(\n  () => builder.schema.value,\n)\nconst blocks = computed<ReactiveCanvasBlock[]>(() => schema.value.blocks)\nconst selectedId = computed<string | null>(() => builder.selection.value.id)\nconst selectedBlock = computed<ReactiveCanvasBlock | null>(() => {\n  const id = selectedId.value\n  if (!id) {\n    return null\n  }\n  return blocks.value.find((b) => b.id === id) ?? null\n})\n\n/** Local string buffer for the props JSON textarea so users can type\n * freely without us re-parsing on every keystroke. */\nconst propsJsonDraft = ref<string>(\"\")\nconst propsJsonError = ref<string | null>(null)\n\nwatch(\n  () => selectedBlock.value?.id,\n  () => {\n    const block = selectedBlock.value\n    if (!block) {\n      propsJsonDraft.value = \"\"\n      propsJsonError.value = null\n      return\n    }\n    propsJsonDraft.value = JSON.stringify(block.props ?? {}, null, 2)\n    propsJsonError.value = null\n  },\n  { immediate: true },\n)\n\nfunction onPaletteAdd(type: string): void {\n  const id = builder.addBlock(type)\n  builder.select(id)\n}\n\nfunction onBlockClick(blockId: string): void {\n  builder.select(blockId)\n}\n\nfunction onClearSelection(): void {\n  builder.select(null)\n}\n\nfunction onRemoveSelected(): void {\n  const id = selectedId.value\n  if (id) {\n    builder.removeBlock(id)\n  }\n}\n\nfunction patchSelected(\n  patch: Partial<Omit<ReactiveCanvasBlock, \"id\">>,\n): void {\n  const id = selectedId.value\n  if (id) {\n    builder.updateBlock(id, patch)\n  }\n}\n\nfunction onNumberInput(\n  key: \"x\" | \"y\" | \"width\" | \"height\",\n  e: Event,\n): void {\n  const raw = (e.target as HTMLInputElement).value\n  const parsed = Number(raw)\n  if (Number.isFinite(parsed)) {\n    patchSelected({ [key]: parsed } as Partial<ReactiveCanvasBlock>)\n  }\n}\n\nfunction onCanvasSizeInput(key: \"width\" | \"height\", e: Event): void {\n  const raw = (e.target as HTMLInputElement).value\n  const parsed = Number(raw)\n  if (Number.isFinite(parsed) && parsed > 0) {\n    builder.setCanvasSize({ [key]: parsed })\n  }\n}\n\nfunction onTypeChange(v: unknown): void {\n  if (typeof v === \"string\") {\n    patchSelected({ type: v })\n  }\n}\n\nfunction onPropsJsonInput(e: Event): void {\n  const next = (e.target as HTMLTextAreaElement).value\n  propsJsonDraft.value = next\n  try {\n    const parsed = next.trim() === \"\" ? {} : JSON.parse(next)\n    if (\n      typeof parsed !== \"object\" ||\n      parsed === null ||\n      Array.isArray(parsed)\n    ) {\n      throw new Error(\"Props must be a JSON object\")\n    }\n    propsJsonError.value = null\n    patchSelected({ props: parsed as Record<string, unknown> })\n  } catch (err) {\n    propsJsonError.value =\n      err instanceof Error ? err.message : \"Invalid JSON\"\n  }\n}\n\nconst canvasStyle = computed(() => ({\n  width: `${schema.value.width}px`,\n  height: `${schema.value.height}px`,\n  maxWidth: \"100%\",\n}))\n\nfunction blockStyle(block: ReactiveCanvasBlock): Record<string, string> {\n  return {\n    left: `${block.x}px`,\n    top: `${block.y}px`,\n    width: `${block.width}px`,\n    height: `${block.height}px`,\n  }\n}\n\n/* ------------------------------------------------------------------ */\n/* Pointer-driven drag + resize                                       */\n/* ------------------------------------------------------------------ */\n\nconst MIN_BLOCK_SIZE = 20\n\ntype ResizeCorner = \"tl\" | \"tr\" | \"bl\" | \"br\"\n\ninterface DragState {\n  mode: \"drag\" | \"resize\"\n  corner: ResizeCorner | null\n  blockId: string\n  pointerId: number\n  target: HTMLElement\n  startClientX: number\n  startClientY: number\n  startX: number\n  startY: number\n  startWidth: number\n  startHeight: number\n}\n\nconst activeDrag = ref<DragState | null>(null)\nconst activeInteractionId = computed<string | null>(\n  () => activeDrag.value?.blockId ?? null,\n)\n\nfunction clampToCanvas(\n  x: number,\n  y: number,\n  width: number,\n  height: number,\n): { x: number; y: number } {\n  const maxX = Math.max(0, schema.value.width - width)\n  const maxY = Math.max(0, schema.value.height - height)\n  return {\n    x: Math.min(Math.max(0, x), maxX),\n    y: Math.min(Math.max(0, y), maxY),\n  }\n}\n\nfunction beginInteraction(\n  block: ReactiveCanvasBlock,\n  event: PointerEvent,\n  mode: \"drag\" | \"resize\",\n  corner: ResizeCorner | null = null,\n): void {\n  event.preventDefault()\n  event.stopPropagation()\n  builder.select(block.id)\n  const target = event.target as HTMLElement | null\n  if (target && typeof target.setPointerCapture === \"function\") {\n    try {\n      target.setPointerCapture(event.pointerId)\n    } catch {\n      // ignore (jsdom or detached node)\n    }\n  }\n  activeDrag.value = {\n    mode,\n    corner,\n    blockId: block.id,\n    pointerId: event.pointerId,\n    target: target ?? (event.currentTarget as HTMLElement),\n    startClientX: event.clientX,\n    startClientY: event.clientY,\n    startX: block.x,\n    startY: block.y,\n    startWidth: block.width,\n    startHeight: block.height,\n  }\n  window.addEventListener(\"pointermove\", onPointerMove)\n  window.addEventListener(\"pointerup\", onPointerUp)\n  window.addEventListener(\"pointercancel\", onPointerUp)\n}\n\nfunction onBlockPointerDown(\n  block: ReactiveCanvasBlock,\n  event: PointerEvent,\n): void {\n  if (event.button !== undefined && event.button !== 0) {\n    return\n  }\n  beginInteraction(block, event, \"drag\")\n}\n\nfunction onResizePointerDown(\n  block: ReactiveCanvasBlock,\n  corner: ResizeCorner,\n  event: PointerEvent,\n): void {\n  if (event.button !== undefined && event.button !== 0) {\n    return\n  }\n  beginInteraction(block, event, \"resize\", corner)\n}\n\nfunction applyDrag(state: DragState, dx: number, dy: number): void {\n  const nextX = state.startX + dx\n  const nextY = state.startY + dy\n  const clamped = clampToCanvas(\n    nextX,\n    nextY,\n    state.startWidth,\n    state.startHeight,\n  )\n  builder.updateBlock(state.blockId, { x: clamped.x, y: clamped.y })\n}\n\nfunction applyResize(state: DragState, dx: number, dy: number): void {\n  let x = state.startX\n  let y = state.startY\n  let width = state.startWidth\n  let height = state.startHeight\n  switch (state.corner) {\n    case \"br\":\n      width = state.startWidth + dx\n      height = state.startHeight + dy\n      break\n    case \"tr\":\n      width = state.startWidth + dx\n      height = state.startHeight - dy\n      y = state.startY + dy\n      break\n    case \"bl\":\n      width = state.startWidth - dx\n      height = state.startHeight + dy\n      x = state.startX + dx\n      break\n    case \"tl\":\n      width = state.startWidth - dx\n      height = state.startHeight - dy\n      x = state.startX + dx\n      y = state.startY + dy\n      break\n    default:\n      return\n  }\n  // Enforce minimum size: if the user drags past the min on a \"leading\n  // edge\" corner (tl/tr/bl), we need to clamp position too so the\n  // block doesn't grow in the wrong direction.\n  if (width < MIN_BLOCK_SIZE) {\n    if (state.corner === \"tl\" || state.corner === \"bl\") {\n      x = state.startX + (state.startWidth - MIN_BLOCK_SIZE)\n    }\n    width = MIN_BLOCK_SIZE\n  }\n  if (height < MIN_BLOCK_SIZE) {\n    if (state.corner === \"tl\" || state.corner === \"tr\") {\n      y = state.startY + (state.startHeight - MIN_BLOCK_SIZE)\n    }\n    height = MIN_BLOCK_SIZE\n  }\n  builder.updateBlock(state.blockId, { x, y, width, height })\n}\n\nfunction onPointerMove(event: PointerEvent): void {\n  const state = activeDrag.value\n  if (!state) {\n    return\n  }\n  const dx = event.clientX - state.startClientX\n  const dy = event.clientY - state.startClientY\n  if (state.mode === \"drag\") {\n    applyDrag(state, dx, dy)\n  } else {\n    applyResize(state, dx, dy)\n  }\n}\n\nfunction onPointerUp(event: PointerEvent): void {\n  const state = activeDrag.value\n  if (state) {\n    const target = state.target\n    if (target && typeof target.releasePointerCapture === \"function\") {\n      try {\n        target.releasePointerCapture(state.pointerId)\n      } catch {\n        // ignore\n      }\n    }\n  }\n  activeDrag.value = null\n  window.removeEventListener(\"pointermove\", onPointerMove)\n  window.removeEventListener(\"pointerup\", onPointerUp)\n  window.removeEventListener(\"pointercancel\", onPointerUp)\n  void event\n}\n\nonBeforeUnmount(() => {\n  window.removeEventListener(\"pointermove\", onPointerMove)\n  window.removeEventListener(\"pointerup\", onPointerUp)\n  window.removeEventListener(\"pointercancel\", onPointerUp)\n})\n\ninterface ResizeHandleSpec {\n  corner: ResizeCorner\n  position: string\n  cursor: string\n}\n\nconst RESIZE_HANDLES: ResizeHandleSpec[] = [\n  { corner: \"tl\", position: \"-top-1 -left-1\", cursor: \"cursor-nwse-resize\" },\n  { corner: \"tr\", position: \"-top-1 -right-1\", cursor: \"cursor-nesw-resize\" },\n  { corner: \"bl\", position: \"-bottom-1 -left-1\", cursor: \"cursor-nesw-resize\" },\n  { corner: \"br\", position: \"-bottom-1 -right-1\", cursor: \"cursor-nwse-resize\" },\n]\n</script>\n\n<template>\n  <FieldFrame\n    :label=\"props.label\"\n    :hide-label=\"props.hideLabel\"\n    :help-text=\"props.helpText\"\n    :errors=\"props.errors\"\n    :class=\"props.classList\"\n  >\n    <div\n      :class=\"cn('gxp-reactive-canvas-builder grid gap-3 rounded-lg border bg-card')\"\n      style=\"grid-template-columns: 220px 1fr 320px; min-height: 24rem\"\n      data-testid=\"reactive-canvas-builder\"\n      :data-element-name=\"props.name ?? undefined\"\n    >\n      <aside\n        class=\"flex flex-col gap-2 border-r p-3 overflow-y-auto\"\n        data-testid=\"reactive-canvas-builder-palette\"\n      >\n        <h4 class=\"text-xs font-semibold uppercase tracking-wide text-muted-foreground\">\n          Block palette\n        </h4>\n        <div class=\"flex flex-col gap-1\">\n          <button\n            v-for=\"type in REACTIVE_CANVAS_BLOCK_TYPES\"\n            :key=\"type\"\n            type=\"button\"\n            class=\"flex items-start gap-2 rounded-md border bg-background px-2 py-1.5 text-left text-xs transition-colors hover:border-primary hover:bg-accent/40\"\n            :data-testid=\"`reactive-canvas-builder-palette-${type}`\"\n            @click=\"onPaletteAdd(type)\"\n          >\n            <Plus class=\"mt-0.5 h-3.5 w-3.5 shrink-0\" />\n            <span class=\"font-medium\">{{ type }}</span>\n          </button>\n        </div>\n      </aside>\n\n      <section\n        class=\"flex flex-col gap-3 overflow-auto p-3\"\n        data-testid=\"reactive-canvas-builder-canvas\"\n      >\n        <header class=\"flex items-center justify-between gap-2\">\n          <h4 class=\"text-xs font-semibold uppercase tracking-wide text-muted-foreground\">\n            Canvas ({{ schema.width }} x {{ schema.height }})\n          </h4>\n          <Badge variant=\"outline\" class=\"font-mono text-[10px]\">\n            builder/reactive-canvas-builder\n          </Badge>\n        </header>\n\n        <div\n          class=\"relative overflow-auto rounded-md border border-dashed bg-background\"\n          :style=\"canvasStyle\"\n          data-testid=\"reactive-canvas-builder-surface\"\n        >\n          <p\n            v-if=\"blocks.length === 0\"\n            class=\"absolute inset-0 flex items-center justify-center text-center text-xs text-muted-foreground\"\n            data-testid=\"reactive-canvas-builder-canvas-empty\"\n          >\n            Click a block type in the palette to add it.\n          </p>\n          <div\n            v-for=\"block in blocks\"\n            :key=\"block.id\"\n            class=\"absolute cursor-move touch-none select-none rounded border bg-card p-2 text-xs shadow-sm transition-colors hover:border-primary\"\n            :class=\"[\n              selectedId === block.id\n                ? 'border-primary ring-2 ring-primary/30'\n                : '',\n              activeInteractionId === block.id ? 'ring-2 ring-primary' : '',\n            ]\"\n            :style=\"blockStyle(block)\"\n            :data-testid=\"`reactive-canvas-builder-block-${block.id}`\"\n            @click.stop=\"onBlockClick(block.id)\"\n            @pointerdown=\"(e: PointerEvent) => onBlockPointerDown(block, e)\"\n          >\n            <div class=\"flex items-center justify-between\">\n              <span class=\"font-mono text-[10px] text-muted-foreground\">\n                {{ block.type }}\n              </span>\n              <span class=\"font-mono text-[10px] text-muted-foreground\">\n                {{ block.width }}x{{ block.height }}\n              </span>\n            </div>\n            <div class=\"mt-1 font-mono text-[10px] text-muted-foreground\">\n              ({{ block.x }}, {{ block.y }})\n            </div>\n            <span\n              v-for=\"handle in RESIZE_HANDLES\"\n              :key=\"handle.corner\"\n              :class=\"\n                cn(\n                  'absolute h-2 w-2 rounded-sm border border-primary/70 bg-primary/30 hover:bg-primary',\n                  handle.position,\n                  handle.cursor,\n                )\n              \"\n              :data-testid=\"`reactive-canvas-builder-block-${block.id}-resize-${handle.corner}`\"\n              @click.stop\n              @pointerdown.stop=\"\n                (e: PointerEvent) => onResizePointerDown(block, handle.corner, e)\n              \"\n            />\n          </div>\n        </div>\n      </section>\n\n      <aside\n        class=\"flex flex-col gap-2 overflow-y-auto border-l p-3\"\n        data-testid=\"reactive-canvas-builder-inspector\"\n      >\n        <header class=\"flex items-center justify-between\">\n          <h4 class=\"text-xs font-semibold uppercase tracking-wide text-muted-foreground\">\n            Inspector\n          </h4>\n          <Button\n            v-if=\"selectedId\"\n            variant=\"ghost\"\n            size=\"icon-sm\"\n            aria-label=\"Clear selection\"\n            @click=\"onClearSelection\"\n          >\n            <X class=\"h-3.5 w-3.5\" />\n          </Button>\n        </header>\n\n        <Card class=\"border-dashed\">\n          <CardHeader class=\"py-2\">\n            <CardTitle class=\"font-mono text-xs uppercase tracking-wide\">\n              Canvas\n            </CardTitle>\n          </CardHeader>\n          <CardContent class=\"flex flex-col gap-2 pb-3\">\n            <div class=\"grid grid-cols-2 gap-2\">\n              <div class=\"flex flex-col gap-1\">\n                <Label for=\"rcb-canvas-width\">Width</Label>\n                <Input\n                  id=\"rcb-canvas-width\"\n                  type=\"number\"\n                  :model-value=\"schema.width\"\n                  data-testid=\"reactive-canvas-builder-canvas-width\"\n                  @input=\"(e: Event) => onCanvasSizeInput('width', e)\"\n                />\n              </div>\n              <div class=\"flex flex-col gap-1\">\n                <Label for=\"rcb-canvas-height\">Height</Label>\n                <Input\n                  id=\"rcb-canvas-height\"\n                  type=\"number\"\n                  :model-value=\"schema.height\"\n                  data-testid=\"reactive-canvas-builder-canvas-height\"\n                  @input=\"(e: Event) => onCanvasSizeInput('height', e)\"\n                />\n              </div>\n            </div>\n          </CardContent>\n        </Card>\n\n        <p\n          v-if=\"!selectedBlock\"\n          class=\"py-3 text-xs text-muted-foreground\"\n          data-testid=\"reactive-canvas-builder-inspector-empty\"\n        >\n          Select a block on the canvas to edit it.\n        </p>\n\n        <div\n          v-else\n          class=\"flex flex-col gap-3\"\n          data-testid=\"reactive-canvas-builder-inspector-fields\"\n        >\n          <Card class=\"border-dashed\">\n            <CardHeader class=\"py-2\">\n              <CardTitle class=\"font-mono text-xs uppercase tracking-wide\">\n                {{ selectedBlock.type }}\n              </CardTitle>\n            </CardHeader>\n            <CardContent class=\"flex flex-col gap-2 pb-3\">\n              <div class=\"flex flex-col gap-1\">\n                <Label>Block type</Label>\n                <Select\n                  :model-value=\"selectedBlock.type\"\n                  @update:model-value=\"onTypeChange\"\n                >\n                  <SelectTrigger\n                    data-testid=\"reactive-canvas-builder-inspector-type\"\n                  >\n                    <SelectValue />\n                  </SelectTrigger>\n                  <SelectContent>\n                    <SelectItem\n                      v-for=\"t in REACTIVE_CANVAS_BLOCK_TYPES\"\n                      :key=\"t\"\n                      :value=\"t\"\n                    >\n                      {{ t }}\n                    </SelectItem>\n                  </SelectContent>\n                </Select>\n              </div>\n\n              <div class=\"grid grid-cols-2 gap-2\">\n                <div class=\"flex flex-col gap-1\">\n                  <Label for=\"rcb-block-x\">X</Label>\n                  <Input\n                    id=\"rcb-block-x\"\n                    type=\"number\"\n                    :model-value=\"selectedBlock.x\"\n                    data-testid=\"reactive-canvas-builder-inspector-x\"\n                    @input=\"(e: Event) => onNumberInput('x', e)\"\n                  />\n                </div>\n                <div class=\"flex flex-col gap-1\">\n                  <Label for=\"rcb-block-y\">Y</Label>\n                  <Input\n                    id=\"rcb-block-y\"\n                    type=\"number\"\n                    :model-value=\"selectedBlock.y\"\n                    data-testid=\"reactive-canvas-builder-inspector-y\"\n                    @input=\"(e: Event) => onNumberInput('y', e)\"\n                  />\n                </div>\n                <div class=\"flex flex-col gap-1\">\n                  <Label for=\"rcb-block-width\">Width</Label>\n                  <Input\n                    id=\"rcb-block-width\"\n                    type=\"number\"\n                    :model-value=\"selectedBlock.width\"\n                    data-testid=\"reactive-canvas-builder-inspector-width\"\n                    @input=\"(e: Event) => onNumberInput('width', e)\"\n                  />\n                </div>\n                <div class=\"flex flex-col gap-1\">\n                  <Label for=\"rcb-block-height\">Height</Label>\n                  <Input\n                    id=\"rcb-block-height\"\n                    type=\"number\"\n                    :model-value=\"selectedBlock.height\"\n                    data-testid=\"reactive-canvas-builder-inspector-height\"\n                    @input=\"(e: Event) => onNumberInput('height', e)\"\n                  />\n                </div>\n              </div>\n\n              <div class=\"flex flex-col gap-1\">\n                <Label for=\"rcb-block-props\">Props (JSON)</Label>\n                <Textarea\n                  id=\"rcb-block-props\"\n                  :model-value=\"propsJsonDraft\"\n                  rows=\"6\"\n                  class=\"font-mono text-xs\"\n                  data-testid=\"reactive-canvas-builder-inspector-props\"\n                  @input=\"onPropsJsonInput\"\n                />\n                <p\n                  v-if=\"propsJsonError\"\n                  class=\"text-xs text-destructive\"\n                  data-testid=\"reactive-canvas-builder-inspector-props-error\"\n                >\n                  {{ propsJsonError }}\n                </p>\n              </div>\n            </CardContent>\n          </Card>\n\n          <div class=\"flex items-center gap-1\">\n            <Button\n              variant=\"destructive\"\n              size=\"sm\"\n              class=\"ml-auto\"\n              data-testid=\"reactive-canvas-builder-remove\"\n              @click=\"onRemoveSelected\"\n            >\n              <Trash2 class=\"h-3.5 w-3.5\" />\n              Remove block\n            </Button>\n          </div>\n        </div>\n      </aside>\n    </div>\n  </FieldFrame>\n</template>\n"],"names":["MIN_BLOCK_SIZE","props","__props","model","_useModel","nextAutoId","makeAutoId","fallbackId","ref","builderId","computed","builder","useReactiveCanvasBuilder","isSchema","value","v","onMounted","seed","watch","next","schema","blocks","selectedId","selectedBlock","id","b","propsJsonDraft","propsJsonError","_a","block","onPaletteAdd","type","onBlockClick","blockId","onClearSelection","onRemoveSelected","patchSelected","patch","onNumberInput","key","raw","parsed","onCanvasSizeInput","onTypeChange","onPropsJsonInput","e","err","canvasStyle","blockStyle","activeDrag","activeInteractionId","clampToCanvas","x","y","width","height","maxX","maxY","beginInteraction","event","mode","corner","target","onPointerMove","onPointerUp","onBlockPointerDown","onResizePointerDown","applyDrag","state","dx","dy","nextX","nextY","clamped","applyResize","onBeforeUnmount","RESIZE_HANDLES","_createBlock","_unref","FieldFrame","_normalizeClass","_createElementVNode","cn","_hoisted_2","_cache","_hoisted_3","_createElementBlock","_Fragment","_renderList","REACTIVE_CANVAS_BLOCK_TYPES","$event","_createVNode","Plus","_hoisted_5","_toDisplayString","_hoisted_6","_hoisted_7","_hoisted_8","Badge","_hoisted_9","_normalizeStyle","_withModifiers","_hoisted_11","_hoisted_12","_hoisted_13","_hoisted_14","handle","_hoisted_16","_hoisted_17","Button","X","Card","CardHeader","CardTitle","CardContent","_hoisted_18","_hoisted_19","Label","Input","_hoisted_20","_openBlock","_hoisted_22","_createTextVNode","_hoisted_23","Select","SelectTrigger","SelectValue","SelectContent","t","SelectItem","_hoisted_24","_hoisted_25","_hoisted_26","_hoisted_27","_hoisted_28","_hoisted_29","Textarea","_hoisted_30","_hoisted_31","Trash2","_hoisted_21"],"mappings":"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"}
+{"version":3,"file":"ReactiveCanvasBuilder.vue2.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}

package/dist/components/compositions/elements/card/ListCard.vue.d.ts

@@ -0,0 +1,21 @@
+export interface ListCardProps {
+    label?: string;
+    title?: string;
+    subtitle?: string;
+    showCard?: boolean;
+    gutterY?: string;
+    gutterX?: string;
+    /** Resolved child elements passed by the engine / FormBuilder canvas. */
+    nestedElements?: Array<Record<string, unknown>>;
+    item?: Record<string, unknown>;
+    classList?: string[] | string;
+}
+declare const _default: import('vue').DefineComponent<ListCardProps, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<ListCardProps> & Readonly<{}>, {
+    showCard: boolean;
+    nestedElements: Array<Record<string, unknown>>;
+    gutterY: string;
+    gutterX: string;
+    item: Record<string, unknown>;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
+export default _default;
+//# sourceMappingURL=ListCard.vue.d.ts.map

package/dist/components/compositions/elements/card/ListCard.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ListCard.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/card/ListCard.vue"],"names":[],"mappings":"AA+HA,MAAM,WAAW,aAAa;IAC5B,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,QAAQ,CAAC,EAAE,MAAM,CAAA;IACjB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,OAAO,CAAC,EAAE,MAAM,CAAA;IAChB,yEAAyE;IACzE,cAAc,CAAC,EAAE,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC,CAAA;IAC/C,IAAI,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;IAC9B,SAAS,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,CAAA;CAC9B;;cAPY,OAAO;oBAID,KAAK,CAAC,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;aAHrC,MAAM;aACN,MAAM;UAGT,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;;AA2LhC,wBAOG"}

package/dist/components/compositions/elements/code/BuildStatus.vue.d.ts

@@ -0,0 +1,43 @@
+export type BuildStatusValue = "pending" | "running" | "success" | "failed" | "cancelled";
+export interface BuildStatusEvent {
+    status: BuildStatusValue;
+    startedAt?: string | Date;
+    finishedAt?: string | Date;
+    durationMs?: number;
+    commitSha?: string;
+    commitMessage?: string;
+    triggeredBy?: string;
+    logs?: string[];
+}
+interface MessageEventLike {
+    data?: unknown;
+}
+interface EventListenerTarget {
+    addEventListener: (type: string, listener: (e: MessageEventLike) => void) => void;
+    removeEventListener: (type: string, listener: (e: MessageEventLike) => void) => void;
+}
+export interface BuildStatusProps {
+    /** Initial status to show before the stream emits. */
+    initial?: BuildStatusEvent;
+    /** Optional EventSource to subscribe to (`message` events). */
+    eventStream?: EventListenerTarget;
+    /** Optional WebSocket to subscribe to (`message` events). */
+    socket?: EventListenerTarget;
+    /** Cleanup callback fired on unmount. The composition does NOT close
+     *  the underlying stream itself — caller owns the lifecycle. */
+    onUnsubscribe?: () => void;
+    /** When true, render `logs[]` as a collapsible monospace block. */
+    showLogs?: boolean;
+    label?: string;
+    name?: string | null;
+    classList?: string[] | string;
+}
+declare function applyEvent(payload: unknown): void;
+declare const _default: import('vue').DefineComponent<BuildStatusProps, {
+    applyEvent: typeof applyEvent;
+}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<BuildStatusProps> & Readonly<{}>, {
+    label: string;
+    showLogs: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=BuildStatus.vue.d.ts.map

package/dist/components/compositions/elements/code/BuildStatus.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"BuildStatus.vue.d.ts","sourceRoot":"","sources":["../../../../../src/components/compositions/elements/code/BuildStatus.vue"],"names":[],"mappings":"AAoYA,MAAM,MAAM,gBAAgB,GACxB,SAAS,GACT,SAAS,GACT,SAAS,GACT,QAAQ,GACR,WAAW,CAAA;AAEf,MAAM,WAAW,gBAAgB;IAC/B,MAAM,EAAE,gBAAgB,CAAA;IACxB,SAAS,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACzB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IAC1B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAA;CAChB;AAED,UAAU,gBAAgB;IACxB,IAAI,CAAC,EAAE,OAAO,CAAA;CACf;AACD,UAAU,mBAAmB;IAC3B,gBAAgB,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,KAAK,IAAI,CAAA;IACjF,mBAAmB,EAAE,CACnB,IAAI,EAAE,MAAM,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,gBAAgB,KAAK,IAAI,KACpC,IAAI,CAAA;CACV;AAED,MAAM,WAAW,gBAAgB;IAC/B,sDAAsD;IACtD,OAAO,CAAC,EAAE,gBAAgB,CAAA;IAC1B,+DAA+D;IAC/D,WAAW,CAAC,EAAE,mBAAmB,CAAA;IACjC,6DAA6D;IAC7D,MAAM,CAAC,EAAE,mBAAmB,CAAA;IAC5B;oEACgE;IAChE,aAAa,CAAC,EAAE,MAAM,IAAI,CAAA;IAC1B,mEAAmE;IACnE,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,IAAI,CAAC,EAAE,MAAM,GAAG,IAAI,CAAA;IACpB,SAAS,CAAC,EAAE,MAAM,EAAE,GAAG,MAAM,CAAA;CAC9B;AA0CD,iBAAS,UAAU,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI,CAgB1C;;;;WA7DS,MAAM;cADH,OAAO;;AAocpB,wBASG"}

package/dist/components/compositions/elements/code/BuildStatus.vue.js

@@ -1,5 +1,249 @@
-import f from "./BuildStatus.vue2.js";
+import { defineComponent as O, ref as y, watch as X, onMounted as q, onBeforeUnmount as G, computed as v, openBlock as n, createBlock as h, unref as i, normalizeClass as N, withCtx as m, createVNode as u, createElementVNode as c, toDisplayString as l, resolveDynamicComponent as V, createElementBlock as o, createCommentVNode as d, createTextVNode as M, Fragment as D, renderList as K } from "vue";
+import { Clock as U, Ban as P, XCircle as Q, CheckCircle2 as W, Loader2 as Y, Activity as Z, AlertTriangle as tt, ChevronDown as et, ChevronRight as st } from "lucide-vue-next";
+import "../../../ui/badge/index.js";
+import "../../../ui/button/index.js";
+import "../../../ui/card/index.js";
+import { cn as j } from "../../../../lib/utils.js";
+import at from "../../../ui/card/Card.vue.js";
+import it from "../../../ui/card/CardHeader.vue.js";
+import nt from "../../../ui/card/CardTitle.vue.js";
+import rt from "../../../ui/badge/Badge.vue.js";
+import lt from "../../../ui/card/CardContent.vue.js";
+import ot from "../../../ui/button/Button.vue.js";
+const ut = { class: "flex items-center justify-between gap-2" }, ct = { class: "flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground" }, dt = {
+  key: 0,
+  class: "font-mono",
+  "data-testid": "build-status-sha"
+}, mt = {
+  key: 1,
+  class: "truncate",
+  "data-testid": "build-status-commit-message"
+}, gt = {
+  key: 2,
+  "data-testid": "build-status-triggered-by"
+}, ft = {
+  key: 3,
+  class: "flex items-center gap-1",
+  "data-testid": "build-status-duration"
+}, vt = {
+  key: 0,
+  class: "text-xs text-destructive",
+  role: "alert",
+  "data-testid": "build-status-parse-error"
+}, pt = {
+  key: 0,
+  class: "max-h-80 overflow-auto rounded-md bg-muted p-3 font-mono text-xs leading-snug",
+  "data-testid": "build-status-logs"
+}, $t = /* @__PURE__ */ O({
+  __name: "BuildStatus",
+  props: {
+    initial: {},
+    eventStream: {},
+    socket: {},
+    onUnsubscribe: {},
+    showLogs: { type: Boolean, default: !0 },
+    label: { default: "Build Status" },
+    name: {},
+    classList: {}
+  },
+  setup(R, { expose: T }) {
+    var S, k, w, C, $, z, L, E;
+    const a = R, s = y({
+      status: ((S = a.initial) == null ? void 0 : S.status) ?? "pending",
+      startedAt: (k = a.initial) == null ? void 0 : k.startedAt,
+      finishedAt: (w = a.initial) == null ? void 0 : w.finishedAt,
+      durationMs: (C = a.initial) == null ? void 0 : C.durationMs,
+      commitSha: ($ = a.initial) == null ? void 0 : $.commitSha,
+      commitMessage: (z = a.initial) == null ? void 0 : z.commitMessage,
+      triggeredBy: (L = a.initial) == null ? void 0 : L.triggeredBy,
+      logs: (E = a.initial) != null && E.logs ? [...a.initial.logs] : []
+    }), g = y(!0), p = y(null);
+    X(
+      () => a.initial,
+      (t) => {
+        t && (s.value = {
+          status: t.status,
+          startedAt: t.startedAt,
+          finishedAt: t.finishedAt,
+          durationMs: t.durationMs,
+          commitSha: t.commitSha,
+          commitMessage: t.commitMessage,
+          triggeredBy: t.triggeredBy,
+          logs: t.logs ? [...t.logs] : []
+        });
+      },
+      { deep: !0 }
+    );
+    function _(t) {
+      if (!t || typeof t != "object")
+        return;
+      const e = t;
+      s.value = {
+        status: e.status ?? s.value.status,
+        startedAt: e.startedAt ?? s.value.startedAt,
+        finishedAt: e.finishedAt ?? s.value.finishedAt,
+        durationMs: e.durationMs !== void 0 ? e.durationMs : s.value.durationMs,
+        commitSha: e.commitSha ?? s.value.commitSha,
+        commitMessage: e.commitMessage ?? s.value.commitMessage,
+        triggeredBy: e.triggeredBy ?? s.value.triggeredBy,
+        logs: Array.isArray(e.logs) ? e.logs : s.value.logs
+      };
+    }
+    function F(t) {
+      const e = t.data;
+      if (typeof e == "string")
+        try {
+          _(JSON.parse(e)), p.value = null;
+        } catch (r) {
+          p.value = r instanceof Error ? r.message : String(r);
+        }
+      else e && typeof e == "object" && _(e);
+    }
+    let f = null;
+    q(() => {
+      const t = a.eventStream ?? a.socket;
+      if (!t)
+        return;
+      const e = (r) => {
+        F(r);
+      };
+      t.addEventListener("message", e), f = { target: t, handler: e };
+    }), G(() => {
+      f && (f.target.removeEventListener("message", f.handler), f = null), a.onUnsubscribe && a.onUnsubscribe();
+    });
+    const H = v(() => {
+      switch (s.value.status) {
+        case "running":
+          return "info";
+        case "success":
+          return "success";
+        case "failed":
+          return "destructive";
+        case "cancelled":
+          return "warning";
+        case "pending":
+        default:
+          return "secondary";
+      }
+    }), I = v(() => {
+      switch (s.value.status) {
+        case "running":
+          return Y;
+        case "success":
+          return W;
+        case "failed":
+          return Q;
+        case "cancelled":
+          return P;
+        case "pending":
+        default:
+          return U;
+      }
+    });
+    function J(t) {
+      if (t === void 0 || Number.isNaN(t))
+        return "";
+      const e = Math.round(t / 1e3);
+      if (e < 60)
+        return `${e}s`;
+      const r = Math.floor(e / 60), b = e % 60;
+      return `${r}m ${b}s`;
+    }
+    const x = v(() => {
+      const t = s.value.commitSha;
+      return t ? t.length > 7 ? t.slice(0, 7) : t : "";
+    }), A = v(
+      () => J(s.value.durationMs)
+    ), B = v(() => s.value.status === "running");
+    return T({ applyEvent: _ }), (t, e) => (n(), h(i(at), {
+      class: N(i(j)(a.classList)),
+      "data-element-name": a.name ?? void 0,
+      "data-testid": "build-status"
+    }, {
+      default: m(() => [
+        u(i(it), { class: "flex flex-col gap-2 pb-3" }, {
+          default: m(() => [
+            c("div", ut, [
+              u(i(nt), { class: "flex items-center gap-2 text-base" }, {
+                default: m(() => [
+                  u(i(Z), { class: "size-5 text-muted-foreground" }),
+                  c("span", null, l(a.label), 1)
+                ]),
+                _: 1
+              }),
+              u(i(rt), {
+                variant: H.value,
+                size: "default",
+                class: "capitalize",
+                "data-testid": "build-status-badge"
+              }, {
+                default: m(() => [
+                  (n(), h(V(I.value), {
+                    class: N(
+                      i(j)(
+                        "size-3.5",
+                        B.value ? "animate-spin" : ""
+                      )
+                    ),
+                    "data-testid": B.value ? "build-status-spinner" : "build-status-icon"
+                  }, null, 8, ["class", "data-testid"])),
+                  c("span", null, l(s.value.status), 1)
+                ]),
+                _: 1
+              }, 8, ["variant"])
+            ]),
+            c("div", ct, [
+              x.value ? (n(), o("span", dt, l(x.value), 1)) : d("", !0),
+              s.value.commitMessage ? (n(), o("span", mt, l(s.value.commitMessage), 1)) : d("", !0),
+              s.value.triggeredBy ? (n(), o("span", gt, " by " + l(s.value.triggeredBy), 1)) : d("", !0),
+              A.value ? (n(), o("span", ft, [
+                u(i(U), { class: "size-3" }),
+                M(" " + l(A.value), 1)
+              ])) : d("", !0)
+            ]),
+            p.value ? (n(), o("p", vt, [
+              u(i(tt), { class: "inline size-3" }),
+              M(" " + l(p.value), 1)
+            ])) : d("", !0)
+          ]),
+          _: 1
+        }),
+        a.showLogs && s.value.logs && s.value.logs.length > 0 ? (n(), h(i(lt), {
+          key: 0,
+          class: "flex flex-col gap-2 pt-0"
+        }, {
+          default: m(() => [
+            u(i(ot), {
+              type: "button",
+              variant: "ghost",
+              size: "sm",
+              class: "w-fit -ml-2 text-xs",
+              "data-testid": "build-status-logs-toggle",
+              onClick: e[0] || (e[0] = (r) => g.value = !g.value)
+            }, {
+              default: m(() => [
+                (n(), h(V(g.value ? i(et) : i(st)), { class: "size-4" })),
+                c("span", null, l(g.value ? "Hide logs" : "Show logs") + " (" + l(s.value.logs.length) + ")", 1)
+              ]),
+              _: 1
+            }),
+            g.value ? (n(), o("pre", pt, [
+              c("code", null, [
+                (n(!0), o(D, null, K(s.value.logs, (r, b) => (n(), o(D, { key: b }, [
+                  M(l(r), 1),
+                  e[1] || (e[1] = c("br", null, null, -1))
+                ], 64))), 128))
+              ])
+            ])) : d("", !0)
+          ]),
+          _: 1
+        })) : d("", !0)
+      ]),
+      _: 1
+    }, 8, ["class", "data-element-name"]));
+  }
+});
 export {
-  f as default
+  $t as default
 };
 //# sourceMappingURL=BuildStatus.vue.js.map

package/dist/components/compositions/elements/code/BuildStatus.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"BuildStatus.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";"}
+{"version":3,"file":"BuildStatus.vue.js","sources":["../../../../../src/components/compositions/elements/code/BuildStatus.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/**\n * Props-driven real-time build status composition. Subscribes to an\n * `EventSource` OR `WebSocket` (whichever is provided) and renders the\n * latest decoded `BuildStatusEvent`. The composition does NOT open or\n * close the underlying stream — the caller owns its lifecycle. The\n * optional `onUnsubscribe` callback fires on unmount for any extra\n * cleanup the caller wants.\n *\n *   <BuildStatus\n *     :initial=\"{ status: 'pending' }\"\n *     :event-stream=\"es\"\n *     :on-unsubscribe=\"() => es.close()\"\n *   />\n */\nimport { computed, onBeforeUnmount, onMounted, ref, watch } from \"vue\"\nimport {\n  Activity,\n  AlertTriangle,\n  Ban,\n  CheckCircle2,\n  ChevronDown,\n  ChevronRight,\n  Clock,\n  Loader2,\n  XCircle,\n} from \"lucide-vue-next\"\nimport { Badge } from \"@/components/ui/badge\"\nimport { Button } from \"@/components/ui/button\"\nimport {\n  Card,\n  CardContent,\n  CardHeader,\n  CardTitle,\n} from \"@/components/ui/card\"\nimport { cn } from \"@/lib/utils\"\n\nexport type BuildStatusValue =\n  | \"pending\"\n  | \"running\"\n  | \"success\"\n  | \"failed\"\n  | \"cancelled\"\n\nexport interface BuildStatusEvent {\n  status: BuildStatusValue\n  startedAt?: string | Date\n  finishedAt?: string | Date\n  durationMs?: number\n  commitSha?: string\n  commitMessage?: string\n  triggeredBy?: string\n  logs?: string[]\n}\n\ninterface MessageEventLike {\n  data?: unknown\n}\ninterface EventListenerTarget {\n  addEventListener: (type: string, listener: (e: MessageEventLike) => void) => void\n  removeEventListener: (\n    type: string,\n    listener: (e: MessageEventLike) => void,\n  ) => void\n}\n\nexport interface BuildStatusProps {\n  /** Initial status to show before the stream emits. */\n  initial?: BuildStatusEvent\n  /** Optional EventSource to subscribe to (`message` events). */\n  eventStream?: EventListenerTarget\n  /** Optional WebSocket to subscribe to (`message` events). */\n  socket?: EventListenerTarget\n  /** Cleanup callback fired on unmount. The composition does NOT close\n   *  the underlying stream itself — caller owns the lifecycle. */\n  onUnsubscribe?: () => void\n  /** When true, render `logs[]` as a collapsible monospace block. */\n  showLogs?: boolean\n  label?: string\n  name?: string | null\n  classList?: string[] | string\n}\n\nconst props = withDefaults(defineProps<BuildStatusProps>(), {\n  showLogs: true,\n  label: \"Build Status\",\n})\n\nconst current = ref<BuildStatusEvent>({\n  status: props.initial?.status ?? \"pending\",\n  startedAt: props.initial?.startedAt,\n  finishedAt: props.initial?.finishedAt,\n  durationMs: props.initial?.durationMs,\n  commitSha: props.initial?.commitSha,\n  commitMessage: props.initial?.commitMessage,\n  triggeredBy: props.initial?.triggeredBy,\n  logs: props.initial?.logs ? [...props.initial.logs] : [],\n})\n\nconst logsExpanded = ref<boolean>(true)\nconst parseError = ref<string | null>(null)\n\nwatch(\n  () => props.initial,\n  (next) => {\n    if (!next) {\n      return\n    }\n    current.value = {\n      status: next.status,\n      startedAt: next.startedAt,\n      finishedAt: next.finishedAt,\n      durationMs: next.durationMs,\n      commitSha: next.commitSha,\n      commitMessage: next.commitMessage,\n      triggeredBy: next.triggeredBy,\n      logs: next.logs ? [...next.logs] : [],\n    }\n  },\n  { deep: true },\n)\n\nfunction applyEvent(payload: unknown): void {\n  if (!payload || typeof payload !== \"object\") {\n    return\n  }\n  const next = payload as Partial<BuildStatusEvent>\n  current.value = {\n    status: (next.status as BuildStatusValue) ?? current.value.status,\n    startedAt: next.startedAt ?? current.value.startedAt,\n    finishedAt: next.finishedAt ?? current.value.finishedAt,\n    durationMs:\n      next.durationMs !== undefined ? next.durationMs : current.value.durationMs,\n    commitSha: next.commitSha ?? current.value.commitSha,\n    commitMessage: next.commitMessage ?? current.value.commitMessage,\n    triggeredBy: next.triggeredBy ?? current.value.triggeredBy,\n    logs: Array.isArray(next.logs) ? next.logs : current.value.logs,\n  }\n}\n\nfunction handleMessage(e: MessageEventLike): void {\n  const raw = e.data\n  if (typeof raw === \"string\") {\n    try {\n      applyEvent(JSON.parse(raw))\n      parseError.value = null\n    } catch (err) {\n      parseError.value = err instanceof Error ? err.message : String(err)\n    }\n  } else if (raw && typeof raw === \"object\") {\n    applyEvent(raw)\n  }\n}\n\nlet attached: { target: EventListenerTarget; handler: (e: MessageEventLike) => void } | null = null\n\nonMounted(() => {\n  const target = props.eventStream ?? props.socket\n  if (!target) {\n    return\n  }\n  const handler = (e: MessageEventLike): void => {\n    handleMessage(e)\n  }\n  target.addEventListener(\"message\", handler)\n  attached = { target, handler }\n})\n\nonBeforeUnmount(() => {\n  if (attached) {\n    attached.target.removeEventListener(\"message\", attached.handler)\n    attached = null\n  }\n  if (props.onUnsubscribe) {\n    props.onUnsubscribe()\n  }\n})\n\n// -------- visual helpers ------------------------------------------------\n\nconst statusBadgeVariant = computed<\n  \"secondary\" | \"info\" | \"success\" | \"destructive\" | \"warning\"\n>(() => {\n  switch (current.value.status) {\n    case \"running\":\n      return \"info\"\n    case \"success\":\n      return \"success\"\n    case \"failed\":\n      return \"destructive\"\n    case \"cancelled\":\n      return \"warning\"\n    case \"pending\":\n    default:\n      return \"secondary\"\n  }\n})\n\nconst statusIcon = computed(() => {\n  switch (current.value.status) {\n    case \"running\":\n      return Loader2\n    case \"success\":\n      return CheckCircle2\n    case \"failed\":\n      return XCircle\n    case \"cancelled\":\n      return Ban\n    case \"pending\":\n    default:\n      return Clock\n  }\n})\n\nfunction formatDuration(value: number | undefined): string {\n  if (value === undefined || Number.isNaN(value)) {\n    return \"\"\n  }\n  const sec = Math.round(value / 1000)\n  if (sec < 60) {\n    return `${sec}s`\n  }\n  const m = Math.floor(sec / 60)\n  const s = sec % 60\n  return `${m}m ${s}s`\n}\n\nconst shortSha = computed<string>(() => {\n  const sha = current.value.commitSha\n  if (!sha) {\n    return \"\"\n  }\n  return sha.length > 7 ? sha.slice(0, 7) : sha\n})\n\nconst durationLabel = computed<string>(() =>\n  formatDuration(current.value.durationMs),\n)\n\nconst isRunning = computed<boolean>(() => current.value.status === \"running\")\n\ndefineExpose({ applyEvent })\n</script>\n\n<template>\n  <Card\n    :class=\"cn(props.classList)\"\n    :data-element-name=\"props.name ?? undefined\"\n    data-testid=\"build-status\"\n  >\n    <CardHeader class=\"flex flex-col gap-2 pb-3\">\n      <div class=\"flex items-center justify-between gap-2\">\n        <CardTitle class=\"flex items-center gap-2 text-base\">\n          <Activity class=\"size-5 text-muted-foreground\" />\n          <span>{{ props.label }}</span>\n        </CardTitle>\n        <Badge\n          :variant=\"statusBadgeVariant\"\n          size=\"default\"\n          class=\"capitalize\"\n          data-testid=\"build-status-badge\"\n        >\n          <component\n            :is=\"statusIcon\"\n            :class=\"\n              cn(\n                'size-3.5',\n                isRunning ? 'animate-spin' : '',\n              )\n            \"\n            :data-testid=\"\n              isRunning\n                ? 'build-status-spinner'\n                : 'build-status-icon'\n            \"\n          />\n          <span>{{ current.status }}</span>\n        </Badge>\n      </div>\n      <div\n        class=\"flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground\"\n      >\n        <span\n          v-if=\"shortSha\"\n          class=\"font-mono\"\n          data-testid=\"build-status-sha\"\n        >\n          {{ shortSha }}\n        </span>\n        <span\n          v-if=\"current.commitMessage\"\n          class=\"truncate\"\n          data-testid=\"build-status-commit-message\"\n        >\n          {{ current.commitMessage }}\n        </span>\n        <span\n          v-if=\"current.triggeredBy\"\n          data-testid=\"build-status-triggered-by\"\n        >\n          by {{ current.triggeredBy }}\n        </span>\n        <span\n          v-if=\"durationLabel\"\n          class=\"flex items-center gap-1\"\n          data-testid=\"build-status-duration\"\n        >\n          <Clock class=\"size-3\" />\n          {{ durationLabel }}\n        </span>\n      </div>\n      <p\n        v-if=\"parseError\"\n        class=\"text-xs text-destructive\"\n        role=\"alert\"\n        data-testid=\"build-status-parse-error\"\n      >\n        <AlertTriangle class=\"inline size-3\" />\n        {{ parseError }}\n      </p>\n    </CardHeader>\n    <CardContent\n      v-if=\"props.showLogs && current.logs && current.logs.length > 0\"\n      class=\"flex flex-col gap-2 pt-0\"\n    >\n      <Button\n        type=\"button\"\n        variant=\"ghost\"\n        size=\"sm\"\n        class=\"w-fit -ml-2 text-xs\"\n        data-testid=\"build-status-logs-toggle\"\n        @click=\"logsExpanded = !logsExpanded\"\n      >\n        <component\n          :is=\"logsExpanded ? ChevronDown : ChevronRight\"\n          class=\"size-4\"\n        />\n        <span>{{ logsExpanded ? \"Hide logs\" : \"Show logs\" }} ({{ current.logs.length }})</span>\n      </Button>\n      <pre\n        v-if=\"logsExpanded\"\n        class=\"max-h-80 overflow-auto rounded-md bg-muted p-3 font-mono text-xs leading-snug\"\n        data-testid=\"build-status-logs\"\n      ><code><template\n          v-for=\"(line, i) in current.logs\"\n          :key=\"i\"\n        >{{ line }}<br></template></code></pre>\n    </CardContent>\n  </Card>\n</template>\n"],"names":["props","__props","current","ref","_a","_b","_c","_d","_e","_f","_g","_h","logsExpanded","parseError","watch","next","applyEvent","payload","handleMessage","e","raw","err","attached","onMounted","target","handler","onBeforeUnmount","statusBadgeVariant","computed","statusIcon","Loader2","CheckCircle2","XCircle","Ban","Clock","formatDuration","value","sec","m","s","shortSha","sha","durationLabel","isRunning","__expose","_createBlock","_unref","Card","_normalizeClass","cn","_createVNode","CardHeader","_createElementVNode","_hoisted_1","CardTitle","Activity","_toDisplayString","Badge","_openBlock","_resolveDynamicComponent","_hoisted_2","_createElementBlock","_hoisted_3","_hoisted_4","_hoisted_5","_hoisted_6","_createTextVNode","_hoisted_7","AlertTriangle","CardContent","Button","_cache","$event","ChevronDown","ChevronRight","_hoisted_8","_Fragment","line","i"],"mappings":"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"}