@flanksource/clicky-ui 0.3.34 → 0.3.36

package/dist/data/Properties.js.map

@@ -1 +1 @@
-{"version":3,"file":"Properties.js","sources":["../../src/data/Properties.tsx"],"sourcesContent":["import { useEffect, useState, type ReactNode } from \"react\";\nimport { IconButton } from \"../components/IconButton\";\nimport {\n  UiCheck,\n  UiDotsVertical,\n  UiListDashes,\n  UiListFlat,\n  UiRows,\n} from \"../icons\";\nimport { cn } from \"../lib/utils\";\nimport { DropdownMenu } from \"../overlay/DropdownMenu\";\nimport { Icon, type StaticIconComponent } from \"./Icon\";\nimport { formatPropertyLabel } from \"./properties-utils\";\n\nexport type PropertiesAction<V = unknown> = {\n  /** Stable action id. */\n  id: string;\n  /** Iconify name or imported icon component. */\n  icon: string | StaticIconComponent;\n  /** Accessible label and tooltip for this row action. */\n  label: (key: string, value: V, item: PropertiesItem<V>) => string;\n  /** Return false to hide the action for a specific row. */\n  visible?: (key: string, value: V, item: PropertiesItem<V>) => boolean;\n  /** Return true to disable the action for a specific row. */\n  disabled?: (key: string, value: V, item: PropertiesItem<V>) => boolean;\n  /** Called when the row action is clicked. */\n  onClick: (key: string, value: V, item: PropertiesItem<V>) => void;\n};\n\nexport type PropertiesItem<V = unknown> = {\n  /** Stable property key. Also used as the default label. */\n  key: string;\n  /** Property value passed to renderers and actions. */\n  value: V;\n  /** Secondary text shown below the label. */\n  subtitle?: ReactNode;\n  /** Hide this row without removing it from the item array. */\n  hidden?: boolean;\n  /** Enables an expandable child area below the row value. */\n  expandable?: boolean;\n  /** Controlled expanded state. */\n  expanded?: boolean;\n  /** Called when an expandable row is toggled. */\n  onToggle?: (next: boolean) => void;\n  /** Child content rendered when the row is expanded. */\n  renderChildren?: () => ReactNode;\n};\n\nexport type PropertiesDensity = \"comfortable\" | \"compact\" | \"spacious\";\n\nexport type PropertiesProps<V = unknown> = {\n  /** Property rows to render. Hidden items are filtered out. */\n  items: PropertiesItem<V>[];\n  /** Custom label renderer. */\n  renderLabel?: (key: string, value: V, item: PropertiesItem<V>) => ReactNode;\n  /** Custom value renderer. */\n  renderValue?: (key: string, value: V, item: PropertiesItem<V>) => ReactNode;\n  /** Static icon name or function that returns an icon name per row. */\n  labelIcon?: string | ((key: string, value: V, item: PropertiesItem<V>) => string | undefined);\n  /** Actions rendered before the value. */\n  prefixActions?: PropertiesAction<V>[];\n  /** Actions rendered after the value. */\n  suffixActions?: PropertiesAction<V>[];\n  /** Classes applied to the list root. */\n  className?: string;\n  /** Classes applied to each row. */\n  rowClassName?: string;\n  /** CSS grid columns applied to each row. Defaults to the selected density preset. */\n  gridTemplateColumns?: string;\n  /** Classes applied to each label cell. */\n  labelClassName?: string;\n  /** Classes applied to each value cell. */\n  valueClassName?: string;\n  /** Row density preset. */\n  density?: PropertiesDensity;\n  /** Stable reference used to persist this instance's density preference. */\n  keyRef?: string;\n  /** Show the display-options menu. */\n  showDensityMenu?: boolean;\n  /** Empty-state content when no rows are visible. */\n  emptyMessage?: ReactNode;\n};\n\nconst PROPERTIES_DENSITY_STORAGE_PREFIX = \"clicky-ui-properties\";\n\nconst PROPERTIES_DENSITY_OPTIONS: Array<{\n  value: PropertiesDensity;\n  label: string;\n  icon: StaticIconComponent;\n}> = [\n  { value: \"compact\", label: \"Compact\", icon: UiRows },\n  { value: \"comfortable\", label: \"Comfortable\", icon: UiListFlat },\n  { value: \"spacious\", label: \"Spacious\", icon: UiListDashes },\n];\n\nconst DENSITY_CLASSES: Record<\n  PropertiesDensity,\n  { row: string; label: string; value: string; gridTemplateColumns: string }\n> = {\n  spacious: {\n    row: \"px-density-4 py-density-3\",\n    label: \"text-sm font-medium text-muted-foreground\",\n    value: \"text-base text-foreground\",\n    gridTemplateColumns: \"minmax(12rem, 20rem) minmax(0, 1fr)\",\n  },\n  comfortable: {\n    row: \"px-density-3 py-density-2\",\n    label: \"text-xs font-medium text-muted-foreground\",\n    value: \"text-sm text-foreground\",\n    gridTemplateColumns: \"minmax(7rem, 12rem) minmax(0, 1fr)\",\n  },\n  compact: {\n    row: \"px-density-2 py-density-1.5\",\n    label: \"font-mono text-[11px] text-muted-foreground\",\n    value: \"text-xs text-foreground\",\n    gridTemplateColumns: \"minmax(8rem, 14rem) minmax(0, 1fr)\",\n  },\n};\n\nexport function Properties<V = unknown>({\n  items,\n  renderLabel,\n  renderValue,\n  labelIcon,\n  prefixActions,\n  suffixActions,\n  className,\n  rowClassName,\n  gridTemplateColumns,\n  labelClassName,\n  valueClassName,\n  density = \"comfortable\",\n  keyRef,\n  showDensityMenu = true,\n  emptyMessage = \"No properties\",\n}: PropertiesProps<V>) {\n  const [densityOverride, setDensityOverride] = useState<PropertiesDensity>();\n  useEffect(() => setDensityOverride(readStoredDensity(keyRef)), [keyRef]);\n\n  const visible = items.filter((item) => !item.hidden);\n\n  if (visible.length === 0) {\n    return <div className=\"text-sm text-muted-foreground\">{emptyMessage}</div>;\n  }\n\n  const activeDensity = densityOverride ?? density;\n  const styles = DENSITY_CLASSES[activeDensity];\n\n  const updateDensity = (next: PropertiesDensity) => {\n    setDensityOverride(next);\n    writeStoredDensity(keyRef, next);\n  };\n\n  return (\n    <dl\n      className={cn(\n        \"divide-y divide-border rounded-md border border-border bg-muted/20\",\n        className,\n      )}\n    >\n      {showDensityMenu ? (\n        <div className=\"flex items-center justify-end px-density-2 py-density-1\">\n          <dt className=\"sr-only\">Properties display options</dt>\n          <dd>\n            <PropertiesDensityMenu density={activeDensity} onChange={updateDensity} />\n          </dd>\n        </div>\n      ) : null}\n      {visible.map((item) => {\n        const iconName =\n          typeof labelIcon === \"function\" ? labelIcon(item.key, item.value, item) : labelIcon;\n        const renderedLabel = renderLabel\n          ? renderLabel(item.key, item.value, item)\n          : formatPropertyLabel(item.key);\n        const ariaLabel = typeof renderedLabel === \"string\" ? renderedLabel : item.key;\n\n        return (\n          <div\n            key={item.key}\n            className={cn(\"grid min-w-0 gap-density-3\", styles.row, rowClassName)}\n            style={{ gridTemplateColumns: gridTemplateColumns ?? styles.gridTemplateColumns }}\n          >\n            <dt\n              aria-label={ariaLabel}\n              className={cn(\"min-w-0 truncate\", styles.label, labelClassName)}\n            >\n              <div className=\"flex min-w-0 items-center gap-density-1\">\n                {iconName ? <Icon name={iconName} className=\"text-xs shrink-0\" /> : null}\n                <span className=\"min-w-0 truncate\">{renderedLabel}</span>\n              </div>\n              {item.subtitle ? (\n                <div className=\"mt-0.5 text-[10px] font-normal text-muted-foreground/80\">\n                  {item.subtitle}\n                </div>\n              ) : null}\n            </dt>\n            <dd className={cn(\"min-w-0 space-y-density-1\", valueClassName)}>\n              <div className=\"flex min-w-0 items-start gap-density-1\">\n                <ActionList actions={prefixActions} item={item} className=\"shrink-0 pt-0.5\" />\n                <div className={cn(\"min-w-0 max-w-full flex-1\", styles.value)}>\n                  {renderValue\n                    ? renderValue(item.key, item.value, item)\n                    : defaultRenderValue(item.value)}\n                </div>\n                <ActionList actions={suffixActions} item={item} className=\"shrink-0 pt-0.5\" />\n              </div>\n              {item.expandable && item.expanded && item.renderChildren\n                ? item.renderChildren()\n                : null}\n            </dd>\n          </div>\n        );\n      })}\n    </dl>\n  );\n}\n\nfunction PropertiesDensityMenu({\n  density,\n  onChange,\n}: {\n  density: PropertiesDensity;\n  onChange: (density: PropertiesDensity) => void;\n}) {\n  return (\n    <DropdownMenu\n      align=\"right\"\n      menuLabel=\"Properties options\"\n      trigger={\n        <IconButton\n          icon={UiDotsVertical}\n          label=\"Properties options\"\n          className=\"h-6 w-6\"\n        />\n      }\n    >\n      {(closeMenu) => (\n        <div className=\"min-w-44 py-1 text-popover-foreground\">\n          <div className=\"px-2 py-1 text-xs font-medium text-muted-foreground\">\n            Density\n          </div>\n          {PROPERTIES_DENSITY_OPTIONS.map((option) => {\n            const active = density === option.value;\n            return (\n              <button\n                key={option.value}\n                type=\"button\"\n                role=\"menuitemradio\"\n                aria-checked={active}\n                className={densityMenuItemClassName(active)}\n                onClick={() => {\n                  onChange(option.value);\n                  closeMenu();\n                }}\n              >\n                <Icon\n                  icon={option.icon}\n                  className=\"text-sm text-muted-foreground\"\n                />\n                <span className=\"min-w-0 flex-1 truncate\">{option.label}</span>\n                {active ? (\n                  <Icon icon={UiCheck} className=\"text-sm text-foreground\" />\n                ) : (\n                  <span className=\"inline-block h-4 w-4\" aria-hidden />\n                )}\n              </button>\n            );\n          })}\n        </div>\n      )}\n    </DropdownMenu>\n  );\n}\n\nfunction densityMenuItemClassName(active: boolean): string {\n  return cn(\n    \"flex w-full items-center gap-2 px-2 py-1.5 text-left text-sm\",\n    \"hover:bg-accent focus:bg-accent focus:outline-none\",\n    active && \"bg-accent/60\",\n  );\n}\n\nfunction readStoredDensity(\n  keyRef: string | undefined,\n): PropertiesDensity | undefined {\n  const storageKey = propertiesDensityStorageKey(keyRef);\n  if (!storageKey || typeof window === \"undefined\") return undefined;\n\n  try {\n    const value = window.localStorage.getItem(storageKey);\n    return isPropertiesDensity(value) ? value : undefined;\n  } catch {\n    return undefined;\n  }\n}\n\nfunction writeStoredDensity(\n  keyRef: string | undefined,\n  density: PropertiesDensity,\n): void {\n  const storageKey = propertiesDensityStorageKey(keyRef);\n  if (!storageKey || typeof window === \"undefined\") return;\n\n  try {\n    window.localStorage.setItem(storageKey, density);\n  } catch {\n    // Display preferences are best-effort when browser storage is unavailable.\n  }\n}\n\nfunction propertiesDensityStorageKey(\n  keyRef: string | undefined,\n): string | undefined {\n  const normalized = keyRef?.trim();\n  return normalized\n    ? `${PROPERTIES_DENSITY_STORAGE_PREFIX}:${normalized}:density`\n    : undefined;\n}\n\nfunction isPropertiesDensity(value: unknown): value is PropertiesDensity {\n  return value === \"compact\" || value === \"comfortable\" || value === \"spacious\";\n}\n\nfunction ActionList<V>({\n  actions,\n  item,\n  className,\n}: {\n  actions: PropertiesAction<V>[] | undefined;\n  item: PropertiesItem<V>;\n  className?: string;\n}) {\n  if (!actions || actions.length === 0) return null;\n  const rendered = actions.filter(\n    (action) => !action.visible || action.visible(item.key, item.value, item),\n  );\n  if (rendered.length === 0) return null;\n  return (\n    <span className={cn(\"inline-flex items-center\", className)}>\n      {rendered.map((action) => (\n        <PropertiesActionButton key={action.id} action={action} item={item} />\n      ))}\n    </span>\n  );\n}\n\nfunction PropertiesActionButton<V>({\n  action,\n  item,\n}: {\n  action: PropertiesAction<V>;\n  item: PropertiesItem<V>;\n}) {\n  const label = action.label(item.key, item.value, item);\n  const disabled = action.disabled?.(item.key, item.value, item) ?? false;\n  return (\n    <button\n      type=\"button\"\n      aria-label={label}\n      title={label}\n      disabled={disabled}\n      className={cn(\n        \"inline-flex h-5 w-5 items-center justify-center rounded text-muted-foreground\",\n        \"hover:bg-accent hover:text-foreground\",\n        \"disabled:opacity-35 disabled:hover:bg-transparent disabled:hover:text-muted-foreground\",\n      )}\n      onClick={(event) => {\n        event.stopPropagation();\n        action.onClick(item.key, item.value, item);\n      }}\n    >\n      <Icon\n        {...(typeof action.icon === \"string\" ? { name: action.icon } : { icon: action.icon })}\n        className=\"text-xs\"\n      />\n    </button>\n  );\n}\n\nfunction defaultRenderValue(value: unknown): ReactNode {\n  if (value === null || value === undefined) {\n    return <span className=\"font-mono italic text-muted-foreground\">null</span>;\n  }\n  if (typeof value === \"string\") return value;\n  if (typeof value === \"number\" || typeof value === \"boolean\") {\n    return <span className=\"font-mono\">{String(value)}</span>;\n  }\n  try {\n    return (\n      <pre className=\"max-h-48 overflow-auto whitespace-pre-wrap break-words font-mono text-[11px] leading-relaxed\">\n        {JSON.stringify(value, null, 2)}\n      </pre>\n    );\n  } catch {\n    return String(value);\n  }\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Properties.js","sources":["../../src/data/Properties.tsx"],"sourcesContent":["import {\n  Fragment,\n  useContext,\n  useEffect,\n  useState,\n  type ReactNode,\n} from \"react\";\nimport { IconButton } from \"../components/IconButton\";\nimport {\n  UiCheck,\n  UiDotsVertical,\n  UiListDashes,\n  UiListFlat,\n  UiRows,\n} from \"../icons\";\nimport { cn } from \"../lib/utils\";\nimport { DropdownMenu } from \"../overlay/DropdownMenu\";\nimport { Icon, type StaticIconComponent } from \"./Icon\";\nimport { formatPropertyLabel } from \"./properties-utils\";\nimport { PropertiesContext } from \"./properties-context\";\n\nexport type PropertiesAction<V = unknown> = {\n  /** Stable action id. */\n  id: string;\n  /** Iconify name or imported icon component. */\n  icon: string | StaticIconComponent;\n  /** Accessible label and tooltip for this row action. */\n  label: (key: string, value: V, item: PropertiesItem<V>) => string;\n  /** Return false to hide the action for a specific row. */\n  visible?: (key: string, value: V, item: PropertiesItem<V>) => boolean;\n  /** Return true to disable the action for a specific row. */\n  disabled?: (key: string, value: V, item: PropertiesItem<V>) => boolean;\n  /** Called when the row action is clicked. */\n  onClick: (key: string, value: V, item: PropertiesItem<V>) => void;\n};\n\nexport type PropertiesItem<V = unknown> = {\n  /** Stable property key. Also used as the default label. */\n  key: string;\n  /** Property value passed to renderers and actions. */\n  value: V;\n  /** Secondary text shown below the label. */\n  subtitle?: ReactNode;\n  /** Hide this row without removing it from the item array. */\n  hidden?: boolean;\n  /** Enables a child area spanning both columns, with nested labels indented. */\n  expandable?: boolean;\n  /** Controlled expanded state. */\n  expanded?: boolean;\n  /** Called when an expandable row is toggled. */\n  onToggle?: (next: boolean) => void;\n  /** Child content rendered when the row is expanded. */\n  renderChildren?: () => ReactNode;\n};\n\nexport type PropertiesDensity = \"comfortable\" | \"compact\" | \"spacious\";\n\nexport type PropertiesProps<V = unknown> = {\n  /** Property rows to render. Hidden items are filtered out. */\n  items: PropertiesItem<V>[];\n  /** Custom label renderer. */\n  renderLabel?: (key: string, value: V, item: PropertiesItem<V>) => ReactNode;\n  /** Custom value renderer. */\n  renderValue?: (key: string, value: V, item: PropertiesItem<V>) => ReactNode;\n  /** Static icon name or function that returns an icon name per row. */\n  labelIcon?:\n    | string\n    | ((key: string, value: V, item: PropertiesItem<V>) => string | undefined);\n  /** Actions rendered before the value. */\n  prefixActions?: PropertiesAction<V>[];\n  /** Actions rendered after the value. */\n  suffixActions?: PropertiesAction<V>[];\n  /** Classes applied to the list root. */\n  className?: string;\n  /** Classes applied to each row. */\n  rowClassName?: string;\n  /** CSS grid columns applied to each row. Defaults to the selected density preset. */\n  gridTemplateColumns?: string;\n  /** Classes applied to each label cell. */\n  labelClassName?: string;\n  /** Classes applied to each value cell. */\n  valueClassName?: string;\n  /** Row density preset. */\n  density?: PropertiesDensity;\n  /** Stable reference used to persist this instance's density preference. */\n  keyRef?: string;\n  /** Show the display-options menu. */\n  showDensityMenu?: boolean;\n  /** Empty-state content when no rows are visible. */\n  emptyMessage?: ReactNode;\n};\n\nconst PROPERTIES_DENSITY_STORAGE_PREFIX = \"clicky-ui-properties\";\n\nconst PROPERTIES_DENSITY_OPTIONS: Array<{\n  value: PropertiesDensity;\n  label: string;\n  icon: StaticIconComponent;\n}> = [\n  { value: \"compact\", label: \"Compact\", icon: UiRows },\n  { value: \"comfortable\", label: \"Comfortable\", icon: UiListFlat },\n  { value: \"spacious\", label: \"Spacious\", icon: UiListDashes },\n];\n\nconst DENSITY_CLASSES: Record<\n  PropertiesDensity,\n  { row: string; label: string; value: string; gridTemplateColumns: string }\n> = {\n  spacious: {\n    row: \"px-density-4 py-density-3\",\n    label: \"text-sm font-medium text-muted-foreground\",\n    value: \"text-base text-foreground\",\n    gridTemplateColumns: \"minmax(12rem, 20rem) minmax(0, 1fr)\",\n  },\n  comfortable: {\n    row: \"px-density-3 py-density-2\",\n    label: \"text-xs font-medium text-muted-foreground\",\n    value: \"text-sm text-foreground\",\n    gridTemplateColumns: \"minmax(7rem, 12rem) minmax(0, 1fr)\",\n  },\n  compact: {\n    row: \"px-density-2 py-density-1.5\",\n    label: \"font-mono text-[11px] text-muted-foreground\",\n    value: \"text-xs text-foreground\",\n    gridTemplateColumns: \"minmax(8rem, 14rem) minmax(0, 1fr)\",\n  },\n};\n\nexport function Properties<V = unknown>({\n  items,\n  renderLabel,\n  renderValue,\n  labelIcon,\n  prefixActions,\n  suffixActions,\n  className,\n  rowClassName,\n  gridTemplateColumns,\n  labelClassName,\n  valueClassName,\n  density = \"comfortable\",\n  keyRef,\n  showDensityMenu = true,\n  emptyMessage = \"No properties\",\n}: PropertiesProps<V>) {\n  const parent = useContext(PropertiesContext);\n  const [densityOverride, setDensityOverride] = useState<PropertiesDensity>();\n  useEffect(() => setDensityOverride(readStoredDensity(keyRef)), [keyRef]);\n\n  const visible = items.filter((item) => !item.hidden);\n\n  if (visible.length === 0) {\n    return <div className=\"text-sm text-muted-foreground\">{emptyMessage}</div>;\n  }\n\n  const activeDensity = parent?.density ?? densityOverride ?? density;\n  const styles = DENSITY_CLASSES[activeDensity];\n  const columns =\n    parent?.columns ?? gridTemplateColumns ?? styles.gridTemplateColumns;\n  const depth = parent?.depth ?? 0;\n\n  const updateDensity = (next: PropertiesDensity) => {\n    setDensityOverride(next);\n    writeStoredDensity(keyRef, next);\n  };\n\n  return (\n    <dl\n      className={cn(\n        \"grid gap-x-density-3 divide-y divide-border rounded-md border border-border bg-muted/20\",\n        parent && \"col-span-full rounded-none border-0 bg-transparent\",\n        className,\n      )}\n      style={{ gridTemplateColumns: parent ? \"subgrid\" : columns }}\n    >\n      {showDensityMenu && !parent ? (\n        <div className=\"col-span-full flex items-center justify-end px-density-2 py-density-1\">\n          <dt className=\"sr-only\">Properties display options</dt>\n          <dd>\n            <PropertiesDensityMenu\n              density={activeDensity}\n              onChange={updateDensity}\n            />\n          </dd>\n        </div>\n      ) : null}\n      {visible.map((item) => {\n        const iconName =\n          typeof labelIcon === \"function\"\n            ? labelIcon(item.key, item.value, item)\n            : labelIcon;\n        const renderedLabel = renderLabel\n          ? renderLabel(item.key, item.value, item)\n          : formatPropertyLabel(item.key);\n        const ariaLabel =\n          typeof renderedLabel === \"string\" ? renderedLabel : item.key;\n\n        return (\n          <Fragment key={item.key}>\n            <div\n              className={cn(\n                \"col-span-full grid min-w-0 grid-cols-subgrid gap-density-3\",\n                styles.row,\n                rowClassName,\n              )}\n            >\n              <dt\n                aria-label={ariaLabel}\n                className={cn(\"min-w-0 truncate\", styles.label, labelClassName)}\n                style={{ paddingInlineStart: depth * 16 }}\n              >\n                <div className=\"flex min-w-0 items-center gap-density-1\">\n                  {iconName ? (\n                    <Icon name={iconName} className=\"text-xs shrink-0\" />\n                  ) : null}\n                  <span className=\"min-w-0 truncate\">{renderedLabel}</span>\n                </div>\n                {item.subtitle ? (\n                  <div className=\"mt-0.5 text-[10px] font-normal text-muted-foreground/80\">\n                    {item.subtitle}\n                  </div>\n                ) : null}\n              </dt>\n              <dd className={cn(\"min-w-0 space-y-density-1\", valueClassName)}>\n                <div className=\"flex min-w-0 items-start gap-density-1\">\n                  <ActionList\n                    actions={prefixActions}\n                    item={item}\n                    className=\"shrink-0 pt-0.5\"\n                  />\n                  <div\n                    className={cn(\"min-w-0 max-w-full flex-1\", styles.value)}\n                  >\n                    {renderValue\n                      ? renderValue(item.key, item.value, item)\n                      : defaultRenderValue(item.value)}\n                  </div>\n                  <ActionList\n                    actions={suffixActions}\n                    item={item}\n                    className=\"shrink-0 pt-0.5\"\n                  />\n                </div>\n              </dd>\n            </div>\n            {item.expandable && item.expanded && item.renderChildren ? (\n              <div className=\"col-span-full grid grid-cols-subgrid\">\n                <dt className=\"sr-only\">{ariaLabel} properties</dt>\n                <dd className=\"col-span-full grid min-w-0 grid-cols-subgrid\">\n                  <PropertiesContext.Provider\n                    value={{\n                      depth: depth + 1,\n                      columns,\n                      density: activeDensity,\n                    }}\n                  >\n                    {item.renderChildren()}\n                  </PropertiesContext.Provider>\n                </dd>\n              </div>\n            ) : null}\n          </Fragment>\n        );\n      })}\n    </dl>\n  );\n}\n\nfunction PropertiesDensityMenu({\n  density,\n  onChange,\n}: {\n  density: PropertiesDensity;\n  onChange: (density: PropertiesDensity) => void;\n}) {\n  return (\n    <DropdownMenu\n      align=\"right\"\n      menuLabel=\"Properties options\"\n      trigger={\n        <IconButton\n          icon={UiDotsVertical}\n          label=\"Properties options\"\n          className=\"h-6 w-6\"\n        />\n      }\n    >\n      {(closeMenu) => (\n        <div className=\"min-w-44 py-1 text-popover-foreground\">\n          <div className=\"px-2 py-1 text-xs font-medium text-muted-foreground\">\n            Density\n          </div>\n          {PROPERTIES_DENSITY_OPTIONS.map((option) => {\n            const active = density === option.value;\n            return (\n              <button\n                key={option.value}\n                type=\"button\"\n                role=\"menuitemradio\"\n                aria-checked={active}\n                className={densityMenuItemClassName(active)}\n                onClick={() => {\n                  onChange(option.value);\n                  closeMenu();\n                }}\n              >\n                <Icon\n                  icon={option.icon}\n                  className=\"text-sm text-muted-foreground\"\n                />\n                <span className=\"min-w-0 flex-1 truncate\">{option.label}</span>\n                {active ? (\n                  <Icon icon={UiCheck} className=\"text-sm text-foreground\" />\n                ) : (\n                  <span className=\"inline-block h-4 w-4\" aria-hidden />\n                )}\n              </button>\n            );\n          })}\n        </div>\n      )}\n    </DropdownMenu>\n  );\n}\n\nfunction densityMenuItemClassName(active: boolean): string {\n  return cn(\n    \"flex w-full items-center gap-2 px-2 py-1.5 text-left text-sm\",\n    \"hover:bg-accent focus:bg-accent focus:outline-none\",\n    active && \"bg-accent/60\",\n  );\n}\n\nfunction readStoredDensity(\n  keyRef: string | undefined,\n): PropertiesDensity | undefined {\n  const storageKey = propertiesDensityStorageKey(keyRef);\n  if (!storageKey || typeof window === \"undefined\") return undefined;\n\n  try {\n    const value = window.localStorage.getItem(storageKey);\n    return isPropertiesDensity(value) ? value : undefined;\n  } catch {\n    return undefined;\n  }\n}\n\nfunction writeStoredDensity(\n  keyRef: string | undefined,\n  density: PropertiesDensity,\n): void {\n  const storageKey = propertiesDensityStorageKey(keyRef);\n  if (!storageKey || typeof window === \"undefined\") return;\n\n  try {\n    window.localStorage.setItem(storageKey, density);\n  } catch {\n    // Display preferences are best-effort when browser storage is unavailable.\n  }\n}\n\nfunction propertiesDensityStorageKey(\n  keyRef: string | undefined,\n): string | undefined {\n  const normalized = keyRef?.trim();\n  return normalized\n    ? `${PROPERTIES_DENSITY_STORAGE_PREFIX}:${normalized}:density`\n    : undefined;\n}\n\nfunction isPropertiesDensity(value: unknown): value is PropertiesDensity {\n  return value === \"compact\" || value === \"comfortable\" || value === \"spacious\";\n}\n\nfunction ActionList<V>({\n  actions,\n  item,\n  className,\n}: {\n  actions: PropertiesAction<V>[] | undefined;\n  item: PropertiesItem<V>;\n  className?: string;\n}) {\n  if (!actions || actions.length === 0) return null;\n  const rendered = actions.filter(\n    (action) => !action.visible || action.visible(item.key, item.value, item),\n  );\n  if (rendered.length === 0) return null;\n  return (\n    <span className={cn(\"inline-flex items-center\", className)}>\n      {rendered.map((action) => (\n        <PropertiesActionButton key={action.id} action={action} item={item} />\n      ))}\n    </span>\n  );\n}\n\nfunction PropertiesActionButton<V>({\n  action,\n  item,\n}: {\n  action: PropertiesAction<V>;\n  item: PropertiesItem<V>;\n}) {\n  const label = action.label(item.key, item.value, item);\n  const disabled = action.disabled?.(item.key, item.value, item) ?? false;\n  return (\n    <button\n      type=\"button\"\n      aria-label={label}\n      title={label}\n      disabled={disabled}\n      className={cn(\n        \"inline-flex h-5 w-5 items-center justify-center rounded text-muted-foreground\",\n        \"hover:bg-accent hover:text-foreground\",\n        \"disabled:opacity-35 disabled:hover:bg-transparent disabled:hover:text-muted-foreground\",\n      )}\n      onClick={(event) => {\n        event.stopPropagation();\n        action.onClick(item.key, item.value, item);\n      }}\n    >\n      <Icon\n        {...(typeof action.icon === \"string\"\n          ? { name: action.icon }\n          : { icon: action.icon })}\n        className=\"text-xs\"\n      />\n    </button>\n  );\n}\n\nfunction defaultRenderValue(value: unknown): ReactNode {\n  if (value === null || value === undefined) {\n    return <span className=\"font-mono italic text-muted-foreground\">null</span>;\n  }\n  if (typeof value === \"string\") return value;\n  if (typeof value === \"number\" || typeof value === \"boolean\") {\n    return <span className=\"font-mono\">{String(value)}</span>;\n  }\n  try {\n    return (\n      <pre className=\"max-h-48 overflow-auto whitespace-pre-wrap break-words font-mono text-[11px] leading-relaxed\">\n        {JSON.stringify(value, null, 2)}\n      </pre>\n    );\n  } catch {\n    return String(value);\n  }\n}\n"],"names":[],"mappings":"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"}

package/dist/data/RadialGauge.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
+import { ReactNode } from 'react';
 import { GaugeTone } from './Gauge';
 export type RadialGaugeProps = {
     /** Current value. Clamped to [0, max]. */

package/dist/data/SchemaViewer.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
+import { ReactNode } from 'react';
 import { JsonSchemaObject } from '../components/json-schema-form-types';
 import { SchemaViewerFieldMeta, SchemaViewerNode } from './schema-viewer-model';
 export interface SchemaViewerProps {

package/dist/data/SortableHeader.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
+import { ReactNode } from 'react';
 import { SortDir } from '../hooks/use-sort';
 export type SortableHeaderProps = {
     /** Whether this header currently owns the sort state. */

package/dist/data/StatStrip.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
+import { ReactNode } from 'react';
 import { StaticIconComponent } from './Icon';
 import { BadgeTone } from './Badge';
 export type StatStripItem = {

package/dist/data/StatusBreakdown.d.ts

@@ -1,4 +1,4 @@
-import { ReactElement, ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
+import { ReactElement, ReactNode } from 'react';
 export interface StatusSegment {
     key: string;
     label: string;

package/dist/data/TabButton.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from '../../../../node_modules/@types/react/index.d.ts';
+import { ReactNode } from 'react';
 import { StaticIconComponent } from './Icon';
 /** Visual style: a filled `pill` (default) or an `underline` tab. */
 export type TabButtonVariant = "pill" | "underline";

package/dist/data/TaskHeaderExtras.cjs

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const jsxRuntime = require("react/jsx-runtime");
+const utils = require("../lib/utils.cjs");
+const taskProcessDetails = require("./task-process-details.cjs");
+const taskMetadata = require("./task-metadata.cjs");
+function MetadataChip({ label, value, tone }) {
+  return /* @__PURE__ */ jsxRuntime.jsxs(
+    "span",
+    {
+      className: utils.cn(
+        "inline-flex shrink-0 items-baseline gap-1 rounded-full px-1.5 py-px text-[10px] leading-4",
+        tone === "active" ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"
+      ),
+      title: `${label}: ${value}`,
+      children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "opacity-70", children: label }),
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "max-w-32 truncate font-medium", children: value })
+      ]
+    }
+  );
+}
+const ACTIVE_STATES = /* @__PURE__ */ new Set(["running", "active", "busy", "working", "in-progress", "starting"]);
+const STATE_KEYS = /* @__PURE__ */ new Set(["state", "status", "phase"]);
+function chipTone(key, value) {
+  return STATE_KEYS.has(key) && ACTIVE_STATES.has(value.toLowerCase()) ? "active" : void 0;
+}
+function TaskMetadataChips({ task }) {
+  const details = taskProcessDetails.isTaskProcessDetails(task.details) ? task.details : void 0;
+  const entries = taskMetadata.metadataEntries(details == null ? void 0 : details.metadata);
+  if (entries.length === 0) return null;
+  return /* @__PURE__ */ jsxRuntime.jsx("div", { className: "flex min-w-0 shrink items-center gap-1 overflow-hidden", children: entries.map(({ key, text }) => /* @__PURE__ */ jsxRuntime.jsx(MetadataChip, { label: key, value: text, ...chipTone(key, text) ? { tone: "active" } : {} }, key)) });
+}
+exports.TaskMetadataChips = TaskMetadataChips;
+//# sourceMappingURL=TaskHeaderExtras.cjs.map

package/dist/data/TaskHeaderExtras.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"TaskHeaderExtras.cjs","sources":["../../src/data/TaskHeaderExtras.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\n\nimport { cn } from \"../lib/utils\";\nimport { isTaskProcessDetails } from \"./task-process-details\";\nimport { metadataEntries } from \"./task-metadata\";\nimport type { TaskSnapshot } from \"./TaskSnapshot\";\n\n/**\n * Contributes host-owned content into a task's header row — the line carrying\n * its name, beside the duration and controls. It exists for the same reason\n * `TaskExtraTabs` does: what is worth knowing about a task at a glance is often\n * something only the host can say. An agent row wants its turn state and the\n * thread it is working; a build row wants neither.\n *\n * Return `null` for tasks it has nothing to add for, and the default renderer\n * takes over — so a host can enrich one kind of task without having to\n * re-implement the default for every other kind.\n */\nexport type TaskHeaderExtra = (task: TaskSnapshot, group: TaskSnapshot) => ReactNode;\n\n/** One metadata value, sized and coloured to sit on a header row. */\nfunction MetadataChip({ label, value, tone }: { label: string; value: string; tone?: \"active\" }) {\n  return (\n    <span\n      className={cn(\n        \"inline-flex shrink-0 items-baseline gap-1 rounded-full px-1.5 py-px text-[10px] leading-4\",\n        tone === \"active\" ? \"bg-primary/10 text-primary\" : \"bg-muted text-muted-foreground\",\n      )}\n      title={`${label}: ${value}`}\n    >\n      <span className=\"opacity-70\">{label}</span>\n      <span className=\"max-w-32 truncate font-medium\">{value}</span>\n    </span>\n  );\n}\n\n/**\n * States that read as \"this is doing something right now\", and so earn the\n * accent that makes a busy row findable in a long list. Matched case-insensitively\n * against a `state`/`status`/`phase` value, because the producer names its own\n * states and this only decides how loud to render them.\n */\nconst ACTIVE_STATES = new Set([\"running\", \"active\", \"busy\", \"working\", \"in-progress\", \"starting\"]);\nconst STATE_KEYS = new Set([\"state\", \"status\", \"phase\"]);\n\nfunction chipTone(key: string, value: string): \"active\" | undefined {\n  return STATE_KEYS.has(key) && ACTIVE_STATES.has(value.toLowerCase()) ? \"active\" : undefined;\n}\n\n/**\n * The default header content: the scalar values of a process's metadata, as\n * chips. Structured values are deliberately left out — they are shown in full,\n * with their structure, in the expanded process details, and a header row is not\n * the place to flatten them.\n *\n * A task with no process details, or none worth a chip, renders nothing, so a\n * plain task row looks exactly as it did before.\n */\nexport function TaskMetadataChips({ task }: { task: TaskSnapshot }) {\n  const details = isTaskProcessDetails(task.details) ? task.details : undefined;\n  const entries = metadataEntries(details?.metadata);\n  if (entries.length === 0) return null;\n  return (\n    <div className=\"flex min-w-0 shrink items-center gap-1 overflow-hidden\">\n      {entries.map(({ key, text }) => (\n        <MetadataChip key={key} label={key} value={text} {...(chipTone(key, text) ? { tone: \"active\" as const } : {})} />\n      ))}\n    </div>\n  );\n}\n"],"names":["jsxs","cn","jsx","isTaskProcessDetails","metadataEntries"],"mappings":";;;;;;AAqBA,SAAS,aAAa,EAAE,OAAO,OAAO,QAA2D;AAC/F,SACEA,2BAAAA;AAAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAWC,MAAAA;AAAAA,QACT;AAAA,QACA,SAAS,WAAW,+BAA+B;AAAA,MAAA;AAAA,MAErD,OAAO,GAAG,KAAK,KAAK,KAAK;AAAA,MAEzB,UAAA;AAAA,QAAAC,2BAAAA,IAAC,QAAA,EAAK,WAAU,cAAc,UAAA,OAAM;AAAA,QACpCA,2BAAAA,IAAC,QAAA,EAAK,WAAU,iCAAiC,UAAA,MAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG7D;AAQA,MAAM,gBAAgB,oBAAI,IAAI,CAAC,WAAW,UAAU,QAAQ,WAAW,eAAe,UAAU,CAAC;AACjG,MAAM,aAAa,oBAAI,IAAI,CAAC,SAAS,UAAU,OAAO,CAAC;AAEvD,SAAS,SAAS,KAAa,OAAqC;AAClE,SAAO,WAAW,IAAI,GAAG,KAAK,cAAc,IAAI,MAAM,YAAA,CAAa,IAAI,WAAW;AACpF;AAWO,SAAS,kBAAkB,EAAE,QAAgC;AAClE,QAAM,UAAUC,mBAAAA,qBAAqB,KAAK,OAAO,IAAI,KAAK,UAAU;AACpE,QAAM,UAAUC,aAAAA,gBAAgB,mCAAS,QAAQ;AACjD,MAAI,QAAQ,WAAW,EAAG,QAAO;AACjC,SACEF,2BAAAA,IAAC,OAAA,EAAI,WAAU,0DACZ,UAAA,QAAQ,IAAI,CAAC,EAAE,KAAK,KAAA,MACnBA,2BAAAA,IAAC,gBAAuB,OAAO,KAAK,OAAO,MAAO,GAAI,SAAS,KAAK,IAAI,IAAI,EAAE,MAAM,SAAA,IAAsB,CAAA,EAAC,GAAxF,GAA4F,CAChH,EAAA,CACH;AAEJ;;"}

package/dist/data/TaskHeaderExtras.d.ts

@@ -0,0 +1,27 @@
+import { ReactNode } from 'react';
+import { TaskSnapshot } from './TaskSnapshot';
+/**
+ * Contributes host-owned content into a task's header row — the line carrying
+ * its name, beside the duration and controls. It exists for the same reason
+ * `TaskExtraTabs` does: what is worth knowing about a task at a glance is often
+ * something only the host can say. An agent row wants its turn state and the
+ * thread it is working; a build row wants neither.
+ *
+ * Return `null` for tasks it has nothing to add for, and the default renderer
+ * takes over — so a host can enrich one kind of task without having to
+ * re-implement the default for every other kind.
+ */
+export type TaskHeaderExtra = (task: TaskSnapshot, group: TaskSnapshot) => ReactNode;
+/**
+ * The default header content: the scalar values of a process's metadata, as
+ * chips. Structured values are deliberately left out — they are shown in full,
+ * with their structure, in the expanded process details, and a header row is not
+ * the place to flatten them.
+ *
+ * A task with no process details, or none worth a chip, renders nothing, so a
+ * plain task row looks exactly as it did before.
+ */
+export declare function TaskMetadataChips({ task }: {
+    task: TaskSnapshot;
+}): import("react").JSX.Element | null;
+//# sourceMappingURL=TaskHeaderExtras.d.ts.map

package/dist/data/TaskHeaderExtras.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"TaskHeaderExtras.d.ts","sourceRoot":"","sources":["../../src/data/TaskHeaderExtras.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKvC,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAEnD;;;;;;;;;;GAUG;AACH,MAAM,MAAM,eAAe,GAAG,CAAC,IAAI,EAAE,YAAY,EAAE,KAAK,EAAE,YAAY,KAAK,SAAS,CAAC;AA+BrF;;;;;;;;GAQG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,IAAI,EAAE,EAAE;IAAE,IAAI,EAAE,YAAY,CAAA;CAAE,sCAWjE"}

package/dist/data/TaskHeaderExtras.js

@@ -0,0 +1,35 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cn } from "../lib/utils.js";
+import { isTaskProcessDetails } from "./task-process-details.js";
+import { metadataEntries } from "./task-metadata.js";
+function MetadataChip({ label, value, tone }) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: cn(
+        "inline-flex shrink-0 items-baseline gap-1 rounded-full px-1.5 py-px text-[10px] leading-4",
+        tone === "active" ? "bg-primary/10 text-primary" : "bg-muted text-muted-foreground"
+      ),
+      title: `${label}: ${value}`,
+      children: [
+        /* @__PURE__ */ jsx("span", { className: "opacity-70", children: label }),
+        /* @__PURE__ */ jsx("span", { className: "max-w-32 truncate font-medium", children: value })
+      ]
+    }
+  );
+}
+const ACTIVE_STATES = /* @__PURE__ */ new Set(["running", "active", "busy", "working", "in-progress", "starting"]);
+const STATE_KEYS = /* @__PURE__ */ new Set(["state", "status", "phase"]);
+function chipTone(key, value) {
+  return STATE_KEYS.has(key) && ACTIVE_STATES.has(value.toLowerCase()) ? "active" : void 0;
+}
+function TaskMetadataChips({ task }) {
+  const details = isTaskProcessDetails(task.details) ? task.details : void 0;
+  const entries = metadataEntries(details == null ? void 0 : details.metadata);
+  if (entries.length === 0) return null;
+  return /* @__PURE__ */ jsx("div", { className: "flex min-w-0 shrink items-center gap-1 overflow-hidden", children: entries.map(({ key, text }) => /* @__PURE__ */ jsx(MetadataChip, { label: key, value: text, ...chipTone(key, text) ? { tone: "active" } : {} }, key)) });
+}
+export {
+  TaskMetadataChips
+};
+//# sourceMappingURL=TaskHeaderExtras.js.map

package/dist/data/TaskHeaderExtras.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TaskHeaderExtras.js","sources":["../../src/data/TaskHeaderExtras.tsx"],"sourcesContent":["import type { ReactNode } from \"react\";\n\nimport { cn } from \"../lib/utils\";\nimport { isTaskProcessDetails } from \"./task-process-details\";\nimport { metadataEntries } from \"./task-metadata\";\nimport type { TaskSnapshot } from \"./TaskSnapshot\";\n\n/**\n * Contributes host-owned content into a task's header row — the line carrying\n * its name, beside the duration and controls. It exists for the same reason\n * `TaskExtraTabs` does: what is worth knowing about a task at a glance is often\n * something only the host can say. An agent row wants its turn state and the\n * thread it is working; a build row wants neither.\n *\n * Return `null` for tasks it has nothing to add for, and the default renderer\n * takes over — so a host can enrich one kind of task without having to\n * re-implement the default for every other kind.\n */\nexport type TaskHeaderExtra = (task: TaskSnapshot, group: TaskSnapshot) => ReactNode;\n\n/** One metadata value, sized and coloured to sit on a header row. */\nfunction MetadataChip({ label, value, tone }: { label: string; value: string; tone?: \"active\" }) {\n  return (\n    <span\n      className={cn(\n        \"inline-flex shrink-0 items-baseline gap-1 rounded-full px-1.5 py-px text-[10px] leading-4\",\n        tone === \"active\" ? \"bg-primary/10 text-primary\" : \"bg-muted text-muted-foreground\",\n      )}\n      title={`${label}: ${value}`}\n    >\n      <span className=\"opacity-70\">{label}</span>\n      <span className=\"max-w-32 truncate font-medium\">{value}</span>\n    </span>\n  );\n}\n\n/**\n * States that read as \"this is doing something right now\", and so earn the\n * accent that makes a busy row findable in a long list. Matched case-insensitively\n * against a `state`/`status`/`phase` value, because the producer names its own\n * states and this only decides how loud to render them.\n */\nconst ACTIVE_STATES = new Set([\"running\", \"active\", \"busy\", \"working\", \"in-progress\", \"starting\"]);\nconst STATE_KEYS = new Set([\"state\", \"status\", \"phase\"]);\n\nfunction chipTone(key: string, value: string): \"active\" | undefined {\n  return STATE_KEYS.has(key) && ACTIVE_STATES.has(value.toLowerCase()) ? \"active\" : undefined;\n}\n\n/**\n * The default header content: the scalar values of a process's metadata, as\n * chips. Structured values are deliberately left out — they are shown in full,\n * with their structure, in the expanded process details, and a header row is not\n * the place to flatten them.\n *\n * A task with no process details, or none worth a chip, renders nothing, so a\n * plain task row looks exactly as it did before.\n */\nexport function TaskMetadataChips({ task }: { task: TaskSnapshot }) {\n  const details = isTaskProcessDetails(task.details) ? task.details : undefined;\n  const entries = metadataEntries(details?.metadata);\n  if (entries.length === 0) return null;\n  return (\n    <div className=\"flex min-w-0 shrink items-center gap-1 overflow-hidden\">\n      {entries.map(({ key, text }) => (\n        <MetadataChip key={key} label={key} value={text} {...(chipTone(key, text) ? { tone: \"active\" as const } : {})} />\n      ))}\n    </div>\n  );\n}\n"],"names":[],"mappings":";;;;AAqBA,SAAS,aAAa,EAAE,OAAO,OAAO,QAA2D;AAC/F,SACE;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,WAAW;AAAA,QACT;AAAA,QACA,SAAS,WAAW,+BAA+B;AAAA,MAAA;AAAA,MAErD,OAAO,GAAG,KAAK,KAAK,KAAK;AAAA,MAEzB,UAAA;AAAA,QAAA,oBAAC,QAAA,EAAK,WAAU,cAAc,UAAA,OAAM;AAAA,QACpC,oBAAC,QAAA,EAAK,WAAU,iCAAiC,UAAA,MAAA,CAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAG7D;AAQA,MAAM,gBAAgB,oBAAI,IAAI,CAAC,WAAW,UAAU,QAAQ,WAAW,eAAe,UAAU,CAAC;AACjG,MAAM,aAAa,oBAAI,IAAI,CAAC,SAAS,UAAU,OAAO,CAAC;AAEvD,SAAS,SAAS,KAAa,OAAqC;AAClE,SAAO,WAAW,IAAI,GAAG,KAAK,cAAc,IAAI,MAAM,YAAA,CAAa,IAAI,WAAW;AACpF;AAWO,SAAS,kBAAkB,EAAE,QAAgC;AAClE,QAAM,UAAU,qBAAqB,KAAK,OAAO,IAAI,KAAK,UAAU;AACpE,QAAM,UAAU,gBAAgB,mCAAS,QAAQ;AACjD,MAAI,QAAQ,WAAW,EAAG,QAAO;AACjC,SACE,oBAAC,OAAA,EAAI,WAAU,0DACZ,UAAA,QAAQ,IAAI,CAAC,EAAE,KAAK,KAAA,MACnB,oBAAC,gBAAuB,OAAO,KAAK,OAAO,MAAO,GAAI,SAAS,KAAK,IAAI,IAAI,EAAE,MAAM,SAAA,IAAsB,CAAA,EAAC,GAAxF,GAA4F,CAChH,EAAA,CACH;AAEJ;"}

package/dist/data/TaskManager.cjs

@@ -9,6 +9,7 @@ const Icon = require("./Icon.cjs");
 const ProgressBar = require("./ProgressBar.cjs");
 const Timestamp = require("./cells/Timestamp.cjs");
 const TaskProgress = require("./TaskProgress.cjs");
+const taskWorkProgress = require("./task-work-progress.cjs");
 const taskQueryKeys = require("./task-query-keys.cjs");
 const taskStatus = require("./task-status.cjs");
 function TaskManager({
@@ -18,7 +19,9 @@ function TaskManager({
   pollMs,
   className,
   selectedId,
-  onSelectRun
+  onSelectRun,
+  extraTabs,
+  headerExtra
 }) {
   const [kindFilter, setKindFilter] = react.useState(kind ?? "");
   const [statusFilter, setStatusFilter] = react.useState("");
@@ -77,7 +80,8 @@ function TaskManager({
             /* @__PURE__ */ jsxRuntime.jsx("option", { value: "pending", children: "Pending" }),
             /* @__PURE__ */ jsxRuntime.jsx("option", { value: "success", children: "Success" }),
             /* @__PURE__ */ jsxRuntime.jsx("option", { value: "failed", children: "Failed" }),
-            /* @__PURE__ */ jsxRuntime.jsx("option", { value: "warning", children: "Warning" })
+            /* @__PURE__ */ jsxRuntime.jsx("option", { value: "warning", children: "Warning" }),
+            /* @__PURE__ */ jsxRuntime.jsx("option", { value: "canceled", children: "Canceled" })
           ]
         }
       ),
@@ -93,7 +97,9 @@ function TaskManager({
           pollMs,
           selectedId,
           onSelectRun,
-          runsQueryKey
+          runsQueryKey,
+          extraTabs,
+          headerExtra
         },
         run.id
       )) })
@@ -124,7 +130,9 @@ function RunRow({
   pollMs,
   selectedId,
   onSelectRun,
-  runsQueryKey
+  runsQueryKey,
+  extraTabs,
+  headerExtra
 }) {
   const [localOpen, setLocalOpen] = react.useState(false);
   const controlled = onSelectRun !== void 0;
@@ -134,6 +142,7 @@ function RunRow({
     else setLocalOpen((v) => !v);
   };
   const isTerminal = run.status !== "running" && run.status !== "pending";
+  const progress = taskWorkProgress.taskWorkProgress(run);
   return /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "border-b last:border-0", children: [
     /* @__PURE__ */ jsxRuntime.jsxs(
       "button",
@@ -167,13 +176,7 @@ function RunRow({
             ] }),
             /* @__PURE__ */ jsxRuntime.jsxs("div", { className: "mt-1 flex flex-wrap items-center gap-x-3 gap-y-0.5 text-xs text-muted-foreground", children: [
               run.startedAt && /* @__PURE__ */ jsxRuntime.jsx(Timestamp.Timestamp, { value: run.startedAt, format: "relative" }),
-              /* @__PURE__ */ jsxRuntime.jsxs("span", { children: [
-                run.completed + run.failed,
-                "/",
-                run.total,
-                " done",
-                run.failed > 0 ? `, ${run.failed} failed` : ""
-              ] }),
+              /* @__PURE__ */ jsxRuntime.jsx("span", { children: progress.label }),
               Object.entries(run.labels ?? {}).map(([k, v]) => /* @__PURE__ */ jsxRuntime.jsxs("span", { className: "font-mono", children: [
                 k,
                 "=",
@@ -184,14 +187,8 @@ function RunRow({
           /* @__PURE__ */ jsxRuntime.jsx("div", { className: "w-40 shrink-0", children: /* @__PURE__ */ jsxRuntime.jsx(
             ProgressBar.ProgressBar,
             {
-              segments: taskStatus.taskSegments({
-                ok: run.completed,
-                warn: 0,
-                fail: run.failed,
-                run: run.running,
-                pending: Math.max(0, run.total - run.completed - run.failed - run.running)
-              }),
-              total: run.total || 1,
+              segments: taskStatus.taskSegments(progress.counts),
+              total: progress.total || 1,
               height: "h-1.5"
             }
           ) })
@@ -204,7 +201,9 @@ function RunRow({
         runId: run.id,
         basePath,
         pollMs,
-        runsQueryKey
+        runsQueryKey,
+        extraTabs,
+        headerExtra
       }
     )
   ] });
@@ -213,9 +212,11 @@ function ExpandedRun({
   runId,
   basePath,
   pollMs,
-  runsQueryKey
+  runsQueryKey,
+  extraTabs,
+  headerExtra
 }) {
-  const { snapshots } = useTaskRun.useTaskRun({ id: runId, basePath, pollMs });
+  const { snapshots, status } = useTaskRun.useTaskRun({ id: runId, basePath, pollMs });
   const apiBase = basePath ?? "/api/v1";
   const queryClient = reactQuery.useQueryClient();
   const pendingControls = react.useRef(/* @__PURE__ */ new Map());
@@ -267,10 +268,13 @@ function ExpandedRun({
     TaskProgress.TaskProgress,
     {
       snapshots,
+      connectionStatus: status,
       compact: true,
       onControl: control,
       onTaskControl: controlTask,
-      metricsBaseUrl: `${apiBase}/tasks/metrics/`
+      metricsBaseUrl: `${apiBase}/tasks/metrics/`,
+      ...extraTabs ? { extraTabs } : {},
+      ...headerExtra ? { headerExtra } : {}
     }
   ) });
 }

package/dist/data/TaskManager.cjs.map

@@ -1 +1 @@
-{"version":3,"file":"TaskManager.cjs","sources":["../../src/data/TaskManager.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { hashKey, useMutation, useQueryClient } from \"@tanstack/react-query\";\nimport type { QueryKey } from \"@tanstack/react-query\";\nimport { cn } from \"../lib/utils\";\nimport { useTaskRun, useTaskRuns } from \"../hooks/use-task-run\";\nimport { Icon } from \"./Icon\";\nimport { ProgressBar } from \"./ProgressBar\";\nimport { Timestamp } from \"./cells/Timestamp\";\nimport { TaskProgress } from \"./TaskProgress\";\nimport type { TaskControlAction, TaskRunMeta, TaskSnapshot } from \"./TaskSnapshot\";\nimport { taskQueryKeys } from \"./task-query-keys\";\nimport { taskSegments, taskStatusBg, taskStatusColor, taskStatusIcon } from \"./task-status\";\n\n// TaskManager is the generic clicky-ui task-manager view: it lists every run\n// (TaskRunMeta) from GET {basePath}/tasks with kind/status filters, and expands\n// each row into a live <TaskProgress> for that run id. Runs are grouped by kind,\n// which applications use as their stable task identity.\n//\n// Requires a react-query QueryClientProvider in the host app (like\n// TimeseriesPanel and CacheBrowser): control actions run through useMutation,\n// and the listing is mirrored into the query cache so sibling views can read it.\n\nexport interface TaskManagerProps {\n  /** Base path of the clicky task API, e.g. \"/api/v1\". */\n  basePath?: string;\n  /** Restrict the listing to a single kind (also hides the kind filter). */\n  kind?: string;\n  /** Restrict the listing to runs whose labels contain every key/value pair. */\n  labels?: Record<string, string>;\n  pollMs?: number;\n  className?: string;\n  /**\n   * Currently-selected (expanded) run id, e.g. driven from the URL. When set,\n   * the matching run renders expanded and selection is controlled — otherwise\n   * each row manages its own expand/collapse state.\n   */\n  selectedId?: string;\n  /**\n   * Called when a run row is toggled: the new selection id, or null when the\n   * open row is collapsed. Pair with selectedId for URL-driven deep links.\n   */\n  onSelectRun?: (id: string | null) => void;\n}\n\nexport function TaskManager({\n  basePath,\n  kind,\n  labels,\n  pollMs,\n  className,\n  selectedId,\n  onSelectRun,\n}: TaskManagerProps) {\n  const [kindFilter, setKindFilter] = useState<string>(kind ?? \"\");\n  const [statusFilter, setStatusFilter] = useState<string>(\"\");\n  const queryClient = useQueryClient();\n  const apiBase = basePath ?? \"/api/v1\";\n  const activeKind = kind ?? (kindFilter || undefined);\n  const { runs, runsKey, status } = useTaskRuns({\n    basePath: apiBase,\n    kind: activeKind,\n    labels,\n    status: statusFilter || undefined,\n    pollMs,\n  });\n  const runsQueryKey = useMemo(\n    () => taskQueryKeys.runs({\n      basePath: apiBase,\n      kind: activeKind,\n      status: statusFilter || undefined,\n      labels,\n    }),\n    [activeKind, apiBase, labels, statusFilter],\n  );\n\n  // Changing a filter re-subscribes the transport but leaves the previous\n  // listing on screen until the next SSE/poll frame. Publishing that listing\n  // under the new key would hand cache consumers rows that do not match their\n  // filters, so mirror only once the delivered listing's own key agrees.\n  useEffect(() => {\n    if (!runsKey || hashKey(runsKey) !== hashKey(runsQueryKey)) return;\n    queryClient.setQueryData(runsQueryKey, runs);\n  }, [queryClient, runs, runsKey, runsQueryKey]);\n\n  const kinds = useMemo(() => {\n    const set = new Set<string>();\n    for (const r of runs) if (r.kind) set.add(r.kind);\n    return [...set].sort();\n  }, [runs]);\n  const applications = useMemo(() => groupRunsByApplication(runs), [runs]);\n\n  return (\n    <div className={cn(\"space-y-3\", className)}>\n      <div className=\"flex flex-wrap items-center gap-2\">\n        {!kind && (\n          <select\n            className=\"rounded-md border bg-background px-2 py-1 text-xs\"\n            value={kindFilter}\n            onChange={(e) => setKindFilter(e.target.value)}\n          >\n            <option value=\"\">All kinds</option>\n            {kinds.map((k) => (\n              <option key={k} value={k}>\n                {k}\n              </option>\n            ))}\n          </select>\n        )}\n        <select\n          className=\"rounded-md border bg-background px-2 py-1 text-xs\"\n          value={statusFilter}\n          onChange={(e) => setStatusFilter(e.target.value)}\n        >\n          <option value=\"\">Any status</option>\n          <option value=\"running\">Running</option>\n          <option value=\"pending\">Pending</option>\n          <option value=\"success\">Success</option>\n          <option value=\"failed\">Failed</option>\n          <option value=\"warning\">Warning</option>\n        </select>\n        <span className=\"text-xs text-muted-foreground\">{status}</span>\n      </div>\n\n      {runs.length === 0 ? (\n        <div className=\"rounded-lg border border-dashed p-6 text-center text-sm text-muted-foreground\">\n          No background tasks.\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          {applications.map((application) => (\n            <section key={application.kind}>\n              <h3 className=\"mb-1 px-1 text-xs font-semibold text-muted-foreground\">\n                {applicationLabel(application.kind)}\n              </h3>\n              <div className=\"overflow-hidden rounded-lg border bg-card\">\n                {application.runs.map((run) => (\n                  <RunRow\n                    key={run.id}\n                    run={run}\n                    basePath={basePath}\n                    pollMs={pollMs}\n                    selectedId={selectedId}\n                    onSelectRun={onSelectRun}\n                    runsQueryKey={runsQueryKey}\n                  />\n                ))}\n              </div>\n            </section>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction groupRunsByApplication(runs: TaskRunMeta[]) {\n  const grouped = new Map<string, TaskRunMeta[]>();\n  for (const run of runs) {\n    const application = run.kind || \"other\";\n    grouped.set(application, [...(grouped.get(application) ?? []), run]);\n  }\n  return [...grouped].map(([kind, applicationRuns]) => ({ kind, runs: applicationRuns }));\n}\n\nfunction applicationLabel(kind: string): string {\n  const names: Record<string, string> = {\n    makerprint: \"MakerPrint\",\n    openscad: \"OpenSCAD\",\n    orca: \"Orca\",\n    snapmaker: \"Snapmaker\",\n    other: \"Other\",\n  };\n  return names[kind] ?? kind;\n}\n\nfunction RunRow({\n  run,\n  basePath,\n  pollMs,\n  selectedId,\n  onSelectRun,\n  runsQueryKey,\n}: {\n  run: TaskRunMeta;\n  basePath: string | undefined;\n  pollMs: number | undefined;\n  selectedId: string | undefined;\n  onSelectRun: ((id: string | null) => void) | undefined;\n  runsQueryKey: QueryKey;\n}) {\n  const [localOpen, setLocalOpen] = useState(false);\n  // Controlled by selectedId when a selection handler is wired; otherwise the\n  // row owns its expand state (backward compatible for router-less consumers).\n  const controlled = onSelectRun !== undefined;\n  const open = controlled ? selectedId === run.id : localOpen;\n  const toggle = () => {\n    if (controlled) onSelectRun(open ? null : run.id);\n    else setLocalOpen((v) => !v);\n  };\n  const isTerminal = run.status !== \"running\" && run.status !== \"pending\";\n\n  return (\n    <div className=\"border-b last:border-0\">\n      <button\n        type=\"button\"\n        className=\"flex w-full items-center justify-between gap-4 px-4 py-3 text-left hover:bg-muted/50\"\n        onClick={toggle}\n      >\n        <div className=\"min-w-0 flex-1\">\n          <div className=\"flex items-center gap-2\">\n            <Icon\n              icon={taskStatusIcon(run.status)}\n              className={cn(taskStatusColor(run.status), run.status === \"running\" && \"animate-spin\")}\n            />\n            <span className=\"truncate font-medium\">{run.name}</span>\n            {run.kind && (\n              <span className=\"rounded-full bg-muted px-1.5 py-0 text-[10px] text-muted-foreground\">\n                {run.kind}\n              </span>\n            )}\n            {isTerminal && (\n              <span\n                className={cn(\n                  \"rounded-full px-2 py-0.5 text-xs\",\n                  taskStatusColor(run.status),\n                  taskStatusBg(run.status),\n                )}\n              >\n                {run.status}\n              </span>\n            )}\n          </div>\n          <div className=\"mt-1 flex flex-wrap items-center gap-x-3 gap-y-0.5 text-xs text-muted-foreground\">\n            {run.startedAt && <Timestamp value={run.startedAt} format=\"relative\" />}\n            <span>\n              {run.completed + run.failed}/{run.total} done\n              {run.failed > 0 ? `, ${run.failed} failed` : \"\"}\n            </span>\n            {Object.entries(run.labels ?? {}).map(([k, v]) => (\n              <span key={k} className=\"font-mono\">\n                {k}={v}\n              </span>\n            ))}\n          </div>\n        </div>\n        <div className=\"w-40 shrink-0\">\n          <ProgressBar\n            segments={taskSegments({\n              ok: run.completed,\n              warn: 0,\n              fail: run.failed,\n              run: run.running,\n              pending: Math.max(0, run.total - run.completed - run.failed - run.running),\n            })}\n            total={run.total || 1}\n            height=\"h-1.5\"\n          />\n        </div>\n      </button>\n      {open && (\n        <ExpandedRun\n          runId={run.id}\n          basePath={basePath}\n          pollMs={pollMs}\n          runsQueryKey={runsQueryKey}\n        />\n      )}\n    </div>\n  );\n}\n\nfunction ExpandedRun({\n  runId,\n  basePath,\n  pollMs,\n  runsQueryKey,\n}: {\n  runId: string;\n  basePath: string | undefined;\n  pollMs: number | undefined;\n  runsQueryKey: QueryKey;\n}) {\n  const { snapshots } = useTaskRun({ id: runId, basePath, pollMs });\n  const apiBase = basePath ?? \"/api/v1\";\n  const queryClient = useQueryClient();\n  const pendingControls = useRef(new Map<string, Promise<void>>());\n  const cachedSnapshots = useRef<TaskSnapshot[] | undefined>(undefined);\n  const runQueryKey = useMemo(\n    () => taskQueryKeys.run({ basePath: apiBase, runId }),\n    [apiBase, runId],\n  );\n  const controlMutation = useMutation({\n    mutationKey: taskQueryKeys.control({ basePath: apiBase, runId }),\n    mutationFn: postTaskControl,\n    onSuccess: async () => {\n      await Promise.all([\n        queryClient.invalidateQueries({ queryKey: runsQueryKey, exact: true, refetchType: \"none\" }),\n        queryClient.invalidateQueries({ queryKey: runQueryKey, exact: true, refetchType: \"none\" }),\n      ]);\n    },\n  });\n\n  useEffect(() => {\n    const previous = cachedSnapshots.current;\n    if (previous?.length === snapshots.length && previous.every((snapshot, index) => snapshot === snapshots[index])) {\n      return;\n    }\n    cachedSnapshots.current = snapshots;\n    queryClient.setQueryData(runQueryKey, snapshots);\n  }, [queryClient, runQueryKey, snapshots]);\n\n  const mutateControl = useCallback((request: TaskControlRequest) => {\n    const key = `${request.url}:${request.action}`;\n    const pending = pendingControls.current.get(key);\n    if (pending) return pending;\n    controlMutation.reset();\n    const mutation = controlMutation.mutateAsync(request).finally(() => {\n      if (pendingControls.current.get(key) === mutation) pendingControls.current.delete(key);\n    });\n    pendingControls.current.set(key, mutation);\n    return mutation;\n  }, [controlMutation.mutateAsync, controlMutation.reset]);\n  const control = (action: TaskControlAction, group: TaskSnapshot) =>\n    mutateControl({\n      url: `${apiBase}/tasks/${encodeURIComponent(runId)}/control`,\n      action,\n      target: group,\n    });\n  const controlTask = (action: TaskControlAction, task: TaskSnapshot) =>\n    mutateControl({\n      url: `${apiBase}/tasks/${encodeURIComponent(runId)}/tasks/${encodeURIComponent(task.id)}/control`,\n      action,\n      target: task,\n    });\n  return (\n    <div className=\"border-t bg-muted/30 px-4 py-3\">\n      <TaskProgress\n        snapshots={snapshots}\n        compact\n        onControl={control}\n        onTaskControl={controlTask}\n        metricsBaseUrl={`${apiBase}/tasks/metrics/`}\n      />\n    </div>\n  );\n}\n\ninterface TaskControlRequest {\n  url: string;\n  action: TaskControlAction;\n  target: TaskSnapshot;\n}\n\nasync function postTaskControl({ url, action, target }: TaskControlRequest) {\n  const context = `Failed to ${action} ${target.type} \"${target.name}\"`;\n  let response: Response;\n  try {\n    response = await fetch(url, {\n      method: \"POST\",\n      headers: { \"Content-Type\": \"application/json\" },\n      body: JSON.stringify({ action }),\n    });\n  } catch (cause) {\n    throw new Error(`${context}: ${cause instanceof Error ? cause.message : \"request failed\"}`, { cause });\n  }\n  if (!response.ok) {\n    const detail = (await response.text()).trim() || `HTTP ${response.status}`;\n    throw new Error(`${context}: ${detail}`);\n  }\n}\n"],"names":["useState","useQueryClient","useTaskRuns","useMemo","taskQueryKeys","useEffect","hashKey","cn","jsxs","jsx","Icon","taskStatusIcon","taskStatusColor","taskStatusBg","Timestamp","ProgressBar","taskSegments","useTaskRun","useRef","useMutation","useCallback","TaskProgress"],"mappings":"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"}
+{"version":3,"file":"TaskManager.cjs","sources":["../../src/data/TaskManager.tsx"],"sourcesContent":["import { useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport { hashKey, useMutation, useQueryClient } from \"@tanstack/react-query\";\nimport type { QueryKey } from \"@tanstack/react-query\";\nimport { cn } from \"../lib/utils\";\nimport { useTaskRun, useTaskRuns } from \"../hooks/use-task-run\";\nimport { Icon } from \"./Icon\";\nimport { ProgressBar } from \"./ProgressBar\";\nimport { Timestamp } from \"./cells/Timestamp\";\nimport { TaskProgress } from \"./TaskProgress\";\nimport { taskWorkProgress } from \"./task-work-progress\";\nimport type { TaskControlAction, TaskRunMeta, TaskSnapshot } from \"./TaskSnapshot\";\nimport type { TaskHeaderExtra } from \"./TaskHeaderExtras\";\nimport type { TaskExtraTabs } from \"./TaskStreamTabs\";\nimport { taskQueryKeys } from \"./task-query-keys\";\nimport { taskSegments, taskStatusBg, taskStatusColor, taskStatusIcon } from \"./task-status\";\n\n// TaskManager is the generic clicky-ui task-manager view: it lists every run\n// (TaskRunMeta) from GET {basePath}/tasks with kind/status filters, and expands\n// each row into a live <TaskProgress> for that run id. Runs are grouped by kind,\n// which applications use as their stable task identity.\n//\n// Requires a react-query QueryClientProvider in the host app (like\n// TimeseriesPanel and CacheBrowser): control actions run through useMutation,\n// and the listing is mirrored into the query cache so sibling views can read it.\n\nexport interface TaskManagerProps {\n  /** Base path of the clicky task API, e.g. \"/api/v1\". */\n  basePath?: string;\n  /** Restrict the listing to a single kind (also hides the kind filter). */\n  kind?: string;\n  /** Restrict the listing to runs whose labels contain every key/value pair. */\n  labels?: Record<string, string>;\n  pollMs?: number;\n  className?: string;\n  /**\n   * Currently-selected (expanded) run id, e.g. driven from the URL. When set,\n   * the matching run renders expanded and selection is controlled — otherwise\n   * each row manages its own expand/collapse state.\n   */\n  selectedId?: string;\n  /**\n   * Called when a run row is toggled: the new selection id, or null when the\n   * open row is collapsed. Pair with selectedId for URL-driven deep links.\n   */\n  onSelectRun?: (id: string | null) => void;\n  /**\n   * Contributes host-owned output panes to each task, alongside its own\n   * stdout/stderr — an agent's session transcript, say.\n   */\n  extraTabs?: TaskExtraTabs;\n  /**\n   * Replaces the content beside a task's name in its header row. Returning null\n   * for a task falls back to the default metadata chips.\n   */\n  headerExtra?: TaskHeaderExtra;\n}\n\nexport function TaskManager({\n  basePath,\n  kind,\n  labels,\n  pollMs,\n  className,\n  selectedId,\n  onSelectRun,\n  extraTabs,\n  headerExtra,\n}: TaskManagerProps) {\n  const [kindFilter, setKindFilter] = useState<string>(kind ?? \"\");\n  const [statusFilter, setStatusFilter] = useState<string>(\"\");\n  const queryClient = useQueryClient();\n  const apiBase = basePath ?? \"/api/v1\";\n  const activeKind = kind ?? (kindFilter || undefined);\n  const { runs, runsKey, status } = useTaskRuns({\n    basePath: apiBase,\n    kind: activeKind,\n    labels,\n    status: statusFilter || undefined,\n    pollMs,\n  });\n  const runsQueryKey = useMemo(\n    () => taskQueryKeys.runs({\n      basePath: apiBase,\n      kind: activeKind,\n      status: statusFilter || undefined,\n      labels,\n    }),\n    [activeKind, apiBase, labels, statusFilter],\n  );\n\n  // Changing a filter re-subscribes the transport but leaves the previous\n  // listing on screen until the next SSE/poll frame. Publishing that listing\n  // under the new key would hand cache consumers rows that do not match their\n  // filters, so mirror only once the delivered listing's own key agrees.\n  useEffect(() => {\n    if (!runsKey || hashKey(runsKey) !== hashKey(runsQueryKey)) return;\n    queryClient.setQueryData(runsQueryKey, runs);\n  }, [queryClient, runs, runsKey, runsQueryKey]);\n\n  const kinds = useMemo(() => {\n    const set = new Set<string>();\n    for (const r of runs) if (r.kind) set.add(r.kind);\n    return [...set].sort();\n  }, [runs]);\n  const applications = useMemo(() => groupRunsByApplication(runs), [runs]);\n\n  return (\n    <div className={cn(\"space-y-3\", className)}>\n      <div className=\"flex flex-wrap items-center gap-2\">\n        {!kind && (\n          <select\n            className=\"rounded-md border bg-background px-2 py-1 text-xs\"\n            value={kindFilter}\n            onChange={(e) => setKindFilter(e.target.value)}\n          >\n            <option value=\"\">All kinds</option>\n            {kinds.map((k) => (\n              <option key={k} value={k}>\n                {k}\n              </option>\n            ))}\n          </select>\n        )}\n        <select\n          className=\"rounded-md border bg-background px-2 py-1 text-xs\"\n          value={statusFilter}\n          onChange={(e) => setStatusFilter(e.target.value)}\n        >\n          <option value=\"\">Any status</option>\n          <option value=\"running\">Running</option>\n          <option value=\"pending\">Pending</option>\n          <option value=\"success\">Success</option>\n          <option value=\"failed\">Failed</option>\n          <option value=\"warning\">Warning</option>\n          <option value=\"canceled\">Canceled</option>\n        </select>\n        <span className=\"text-xs text-muted-foreground\">{status}</span>\n      </div>\n\n      {runs.length === 0 ? (\n        <div className=\"rounded-lg border border-dashed p-6 text-center text-sm text-muted-foreground\">\n          No background tasks.\n        </div>\n      ) : (\n        <div className=\"space-y-3\">\n          {applications.map((application) => (\n            <section key={application.kind}>\n              <h3 className=\"mb-1 px-1 text-xs font-semibold text-muted-foreground\">\n                {applicationLabel(application.kind)}\n              </h3>\n              <div className=\"overflow-hidden rounded-lg border bg-card\">\n                {application.runs.map((run) => (\n                  <RunRow\n                    key={run.id}\n                    run={run}\n                    basePath={basePath}\n                    pollMs={pollMs}\n                    selectedId={selectedId}\n                    onSelectRun={onSelectRun}\n                    runsQueryKey={runsQueryKey}\n                    extraTabs={extraTabs}\n                    headerExtra={headerExtra}\n                  />\n                ))}\n              </div>\n            </section>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n\nfunction groupRunsByApplication(runs: TaskRunMeta[]) {\n  const grouped = new Map<string, TaskRunMeta[]>();\n  for (const run of runs) {\n    const application = run.kind || \"other\";\n    grouped.set(application, [...(grouped.get(application) ?? []), run]);\n  }\n  return [...grouped].map(([kind, applicationRuns]) => ({ kind, runs: applicationRuns }));\n}\n\nfunction applicationLabel(kind: string): string {\n  const names: Record<string, string> = {\n    makerprint: \"MakerPrint\",\n    openscad: \"OpenSCAD\",\n    orca: \"Orca\",\n    snapmaker: \"Snapmaker\",\n    other: \"Other\",\n  };\n  return names[kind] ?? kind;\n}\n\nfunction RunRow({\n  run,\n  basePath,\n  pollMs,\n  selectedId,\n  onSelectRun,\n  runsQueryKey,\n  extraTabs,\n  headerExtra,\n}: {\n  run: TaskRunMeta;\n  basePath: string | undefined;\n  pollMs: number | undefined;\n  selectedId: string | undefined;\n  onSelectRun: ((id: string | null) => void) | undefined;\n  runsQueryKey: QueryKey;\n  extraTabs: TaskExtraTabs | undefined;\n  headerExtra: TaskHeaderExtra | undefined;\n}) {\n  const [localOpen, setLocalOpen] = useState(false);\n  // Controlled by selectedId when a selection handler is wired; otherwise the\n  // row owns its expand state (backward compatible for router-less consumers).\n  const controlled = onSelectRun !== undefined;\n  const open = controlled ? selectedId === run.id : localOpen;\n  const toggle = () => {\n    if (controlled) onSelectRun(open ? null : run.id);\n    else setLocalOpen((v) => !v);\n  };\n  const isTerminal = run.status !== \"running\" && run.status !== \"pending\";\n  const progress = taskWorkProgress(run);\n\n  return (\n    <div className=\"border-b last:border-0\">\n      <button\n        type=\"button\"\n        className=\"flex w-full items-center justify-between gap-4 px-4 py-3 text-left hover:bg-muted/50\"\n        onClick={toggle}\n      >\n        <div className=\"min-w-0 flex-1\">\n          <div className=\"flex items-center gap-2\">\n            <Icon\n              icon={taskStatusIcon(run.status)}\n              className={cn(taskStatusColor(run.status), run.status === \"running\" && \"animate-spin\")}\n            />\n            <span className=\"truncate font-medium\">{run.name}</span>\n            {run.kind && (\n              <span className=\"rounded-full bg-muted px-1.5 py-0 text-[10px] text-muted-foreground\">\n                {run.kind}\n              </span>\n            )}\n            {isTerminal && (\n              <span\n                className={cn(\n                  \"rounded-full px-2 py-0.5 text-xs\",\n                  taskStatusColor(run.status),\n                  taskStatusBg(run.status),\n                )}\n              >\n                {run.status}\n              </span>\n            )}\n          </div>\n          <div className=\"mt-1 flex flex-wrap items-center gap-x-3 gap-y-0.5 text-xs text-muted-foreground\">\n            {run.startedAt && <Timestamp value={run.startedAt} format=\"relative\" />}\n            <span>\n              {progress.label}\n            </span>\n            {Object.entries(run.labels ?? {}).map(([k, v]) => (\n              <span key={k} className=\"font-mono\">\n                {k}={v}\n              </span>\n            ))}\n          </div>\n        </div>\n        <div className=\"w-40 shrink-0\">\n          <ProgressBar\n            segments={taskSegments(progress.counts)}\n            total={progress.total || 1}\n            height=\"h-1.5\"\n          />\n        </div>\n      </button>\n      {open && (\n        <ExpandedRun\n          runId={run.id}\n          basePath={basePath}\n          pollMs={pollMs}\n          runsQueryKey={runsQueryKey}\n          extraTabs={extraTabs}\n          headerExtra={headerExtra}\n        />\n      )}\n    </div>\n  );\n}\n\nfunction ExpandedRun({\n  runId,\n  basePath,\n  pollMs,\n  runsQueryKey,\n  extraTabs,\n  headerExtra,\n}: {\n  runId: string;\n  basePath: string | undefined;\n  pollMs: number | undefined;\n  runsQueryKey: QueryKey;\n  extraTabs: TaskExtraTabs | undefined;\n  headerExtra: TaskHeaderExtra | undefined;\n}) {\n  const { snapshots, status } = useTaskRun({ id: runId, basePath, pollMs });\n  const apiBase = basePath ?? \"/api/v1\";\n  const queryClient = useQueryClient();\n  const pendingControls = useRef(new Map<string, Promise<void>>());\n  const cachedSnapshots = useRef<TaskSnapshot[] | undefined>(undefined);\n  const runQueryKey = useMemo(\n    () => taskQueryKeys.run({ basePath: apiBase, runId }),\n    [apiBase, runId],\n  );\n  const controlMutation = useMutation({\n    mutationKey: taskQueryKeys.control({ basePath: apiBase, runId }),\n    mutationFn: postTaskControl,\n    onSuccess: async () => {\n      await Promise.all([\n        queryClient.invalidateQueries({ queryKey: runsQueryKey, exact: true, refetchType: \"none\" }),\n        queryClient.invalidateQueries({ queryKey: runQueryKey, exact: true, refetchType: \"none\" }),\n      ]);\n    },\n  });\n\n  useEffect(() => {\n    const previous = cachedSnapshots.current;\n    if (previous?.length === snapshots.length && previous.every((snapshot, index) => snapshot === snapshots[index])) {\n      return;\n    }\n    cachedSnapshots.current = snapshots;\n    queryClient.setQueryData(runQueryKey, snapshots);\n  }, [queryClient, runQueryKey, snapshots]);\n\n  const mutateControl = useCallback((request: TaskControlRequest) => {\n    const key = `${request.url}:${request.action}`;\n    const pending = pendingControls.current.get(key);\n    if (pending) return pending;\n    controlMutation.reset();\n    const mutation = controlMutation.mutateAsync(request).finally(() => {\n      if (pendingControls.current.get(key) === mutation) pendingControls.current.delete(key);\n    });\n    pendingControls.current.set(key, mutation);\n    return mutation;\n  }, [controlMutation.mutateAsync, controlMutation.reset]);\n  const control = (action: TaskControlAction, group: TaskSnapshot) =>\n    mutateControl({\n      url: `${apiBase}/tasks/${encodeURIComponent(runId)}/control`,\n      action,\n      target: group,\n    });\n  const controlTask = (action: TaskControlAction, task: TaskSnapshot) =>\n    mutateControl({\n      url: `${apiBase}/tasks/${encodeURIComponent(runId)}/tasks/${encodeURIComponent(task.id)}/control`,\n      action,\n      target: task,\n    });\n  return (\n    <div className=\"border-t bg-muted/30 px-4 py-3\">\n      <TaskProgress\n        snapshots={snapshots}\n        connectionStatus={status}\n        compact\n        onControl={control}\n        onTaskControl={controlTask}\n        metricsBaseUrl={`${apiBase}/tasks/metrics/`}\n        {...(extraTabs ? { extraTabs } : {})}\n        {...(headerExtra ? { headerExtra } : {})}\n      />\n    </div>\n  );\n}\n\ninterface TaskControlRequest {\n  url: string;\n  action: TaskControlAction;\n  target: TaskSnapshot;\n}\n\nasync function postTaskControl({ url, action, target }: TaskControlRequest) {\n  const context = `Failed to ${action} ${target.type} \"${target.name}\"`;\n  let response: Response;\n  try {\n    response = await fetch(url, {\n      method: \"POST\",\n      headers: { \"Content-Type\": \"application/json\" },\n      body: JSON.stringify({ action }),\n    });\n  } catch (cause) {\n    throw new Error(`${context}: ${cause instanceof Error ? cause.message : \"request failed\"}`, { cause });\n  }\n  if (!response.ok) {\n    const detail = (await response.text()).trim() || `HTTP ${response.status}`;\n    throw new Error(`${context}: ${detail}`);\n  }\n}\n"],"names":["useState","useQueryClient","useTaskRuns","useMemo","taskQueryKeys","useEffect","hashKey","cn","jsxs","jsx","taskWorkProgress","Icon","taskStatusIcon","taskStatusColor","taskStatusBg","Timestamp","ProgressBar","taskSegments","useTaskRun","useRef","useMutation","useCallback","TaskProgress"],"mappings":"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"}

package/dist/data/TaskManager.d.ts

@@ -1,3 +1,5 @@
+import { TaskHeaderExtra } from './TaskHeaderExtras';
+import { TaskExtraTabs } from './TaskStreamTabs';
 export interface TaskManagerProps {
     /** Base path of the clicky task API, e.g. "/api/v1". */
     basePath?: string;
@@ -18,6 +20,16 @@ export interface TaskManagerProps {
      * open row is collapsed. Pair with selectedId for URL-driven deep links.
      */
     onSelectRun?: (id: string | null) => void;
+    /**
+     * Contributes host-owned output panes to each task, alongside its own
+     * stdout/stderr — an agent's session transcript, say.
+     */
+    extraTabs?: TaskExtraTabs;
+    /**
+     * Replaces the content beside a task's name in its header row. Returning null
+     * for a task falls back to the default metadata chips.
+     */
+    headerExtra?: TaskHeaderExtra;
 }
-export declare function TaskManager({ basePath, kind, labels, pollMs, className, selectedId, onSelectRun, }: TaskManagerProps): import("react").JSX.Element;
+export declare function TaskManager({ basePath, kind, labels, pollMs, className, selectedId, onSelectRun, extraTabs, headerExtra, }: TaskManagerProps): import("react").JSX.Element;
 //# sourceMappingURL=TaskManager.d.ts.map

package/dist/data/TaskManager.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TaskManager.d.ts","sourceRoot":"","sources":["../../src/data/TaskManager.tsx"],"names":[],"mappings":"AAsBA,MAAM,WAAW,gBAAgB;IAC/B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0EAA0E;IAC1E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAED,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,MAAM,EACN,SAAS,EACT,UAAU,EACV,WAAW,GACZ,EAAE,gBAAgB,+BAqGlB"}
+{"version":3,"file":"TaskManager.d.ts","sourceRoot":"","sources":["../../src/data/TaskManager.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AAC1D,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAatD,MAAM,WAAW,gBAAgB;IAC/B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,0EAA0E;IAC1E,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,MAAM,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChC,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;;;OAIG;IACH,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB;;;OAGG;IACH,WAAW,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC1C;;;OAGG;IACH,SAAS,CAAC,EAAE,aAAa,CAAC;IAC1B;;;OAGG;IACH,WAAW,CAAC,EAAE,eAAe,CAAC;CAC/B;AAED,wBAAgB,WAAW,CAAC,EAC1B,QAAQ,EACR,IAAI,EACJ,MAAM,EACN,MAAM,EACN,SAAS,EACT,UAAU,EACV,WAAW,EACX,SAAS,EACT,WAAW,GACZ,EAAE,gBAAgB,+BAwGlB"}