@morscherlab/mint-sdk 1.2.0-beta.9 → 1.2.1

package/src/styles/components/toast.css

@@ -1,4 +1,4 @@
-/* ToastNotification Component Styles */
+/* ToastNotification Component Styles — neutral surface, accent only on icon + TTL bar */
 
 .mint-toast__container {
   position: fixed;
@@ -14,54 +14,153 @@
 .mint-toast__item {
   position: relative;
   display: flex;
-  align-items: center;
-  gap: 0.5rem;
-  padding: 0.75rem 1rem;
+  align-items: flex-start;
+  gap: 0.625rem;
+  width: 22rem;
+  max-width: calc(100vw - 2rem);
+  padding: 0.625rem 1.75rem 0.6875rem 0.75rem;
   border-radius: var(--radius-md);
   background-color: var(--bg-card);
   border: 1px solid var(--border-color);
-  border-left: 4px solid;
-  box-shadow: var(--shadow-md);
+  box-shadow: var(--card-shadow);
   pointer-events: auto;
   cursor: pointer;
-  max-width: 24rem;
   overflow: hidden;
 }
 
-/* Dark mode: near-black bg + white text — toast always contrasts with page */
+/* Dark mode: near-black bg so the toast always contrasts with the page */
 html.dark .mint-toast__item {
-  background-color: #0F172A;
-  border-color: rgba(255, 255, 255, 0.08);
+  background-color: var(--bg-primary);
+}
+
+/* Severity reads from the icon and the TTL bar only */
+.mint-toast__item--success { --mint-toast-tone: var(--mint-success); }
+.mint-toast__item--error   { --mint-toast-tone: var(--mint-error); }
+.mint-toast__item--warning { --mint-toast-tone: var(--mint-warning); }
+.mint-toast__item--info    { --mint-toast-tone: var(--mint-info); }
+
+/* Collapsed stack: one offset sheet drawn with box-shadow, not a second node. */
+.mint-toast__item--stacked {
+  box-shadow:
+    0 3px 0 -1px var(--bg-card),
+    0 3px 0 0 var(--border-color),
+    var(--card-shadow);
 }
 
 .mint-toast__icon {
   width: 1rem;
   height: 1rem;
   flex-shrink: 0;
+  margin-top: 0.0625rem;
+  color: var(--mint-toast-tone);
 }
 
-/* In dark mode, shift icons to 400-level (lighter) for contrast against near-black */
-html.dark .mint-toast__item--success .mint-toast__icon { color: #34D399 !important; }
-html.dark .mint-toast__item--error   .mint-toast__icon { color: #F87171 !important; }
-html.dark .mint-toast__item--warning .mint-toast__icon { color: #FBBF24 !important; }
-html.dark .mint-toast__item--info    .mint-toast__icon { color: #60A5FA !important; }
-
-.mint-toast__message {
-  font-size: 0.875rem;
-  color: var(--text-primary);
+.mint-toast__body {
   flex: 1;
   min-width: 0;
 }
 
-/* Light mode: keep semantic-colored message text (existing behavior) */
-.mint-toast__item--success .mint-toast__message { color: var(--mint-success-hover); }
-.mint-toast__item--error   .mint-toast__message { color: var(--mint-error-hover); }
-.mint-toast__item--warning .mint-toast__message { color: var(--mint-warning-hover); }
-.mint-toast__item--info    .mint-toast__message { color: var(--color-primary-hover); }
+.mint-toast__title {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  font-size: 0.8125rem;
+  font-weight: 600;
+  line-height: 1.35;
+  color: var(--text-primary);
+}
 
-/* Dark mode: white text, accent stays on left stripe + icon */
-html.dark .mint-toast__item .mint-toast__message {
-  color: #FFFFFF;
+.mint-toast__count {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  flex-shrink: 0;
+  min-width: 1.125rem;
+  height: 1rem;
+  padding: 0 0.25rem;
+  border-radius: 0.1875rem;
+  background: var(--bg-tertiary);
+  color: var(--text-secondary);
+  font-family: var(--font-mono);
+  font-size: 0.625rem;
+  font-weight: 600;
+  font-variant-numeric: tabular-nums;
+}
+
+.mint-toast__detail {
+  margin-top: 0.125rem;
+  font-size: 0.75rem;
+  line-height: 1.45;
+  color: var(--text-secondary);
+}
+
+.mint-toast__actions {
+  display: flex;
+  align-items: center;
+  gap: 0.5rem;
+  margin-top: 0.4375rem;
+}
+
+.mint-toast__action {
+  padding: 0.1875rem 0.5rem;
+  border: 1px solid var(--border-color);
+  border-radius: var(--radius-sm);
+  background: var(--bg-secondary);
+  font-family: inherit;
+  font-size: 0.75rem;
+  font-weight: 500;
+  color: var(--text-secondary-strong);
+  cursor: pointer;
+  transition: background-color 0.12s ease, border-color 0.12s ease;
+}
+
+.mint-toast__action:hover {
+  background: var(--bg-hover);
+  border-color: var(--text-muted);
+}
+
+.mint-toast__action--primary {
+  background: var(--color-primary);
+  border-color: var(--color-primary);
+  color: white;
+}
+
+.mint-toast__action--primary:hover {
+  background: var(--color-primary-hover);
+  border-color: var(--color-primary-hover);
+}
+
+.mint-toast__action:focus-visible,
+.mint-toast__close:focus-visible {
+  outline: none;
+  box-shadow: var(--focus-ring);
+}
+
+.mint-toast__close {
+  position: absolute;
+  top: 0.3125rem;
+  right: 0.3125rem;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 1.25rem;
+  height: 1.25rem;
+  border: 0;
+  border-radius: var(--radius-sm);
+  background: transparent;
+  color: var(--text-muted);
+  cursor: pointer;
+  transition: color 0.12s ease, background-color 0.12s ease;
+}
+
+.mint-toast__close:hover {
+  color: var(--text-primary);
+  background: var(--bg-hover);
+}
+
+.mint-toast__close svg {
+  width: 0.75rem;
+  height: 0.75rem;
 }
 
 /* TTL progress bar — shrinks 100% → 0 over duration */
@@ -71,16 +170,26 @@ html.dark .mint-toast__item .mint-toast__message {
   bottom: 0;
   height: 2px;
   width: 100%;
+  background: var(--mint-toast-tone);
   transform-origin: left center;
   animation: mint-toast-progress linear forwards;
   /* animation-duration set inline via toast.duration */
 }
 
+.mint-toast__progress--indeterminate {
+  animation: mint-toast-indeterminate 1.4s ease-in-out infinite;
+}
+
 @keyframes mint-toast-progress {
   from { transform: scaleX(1); }
   to   { transform: scaleX(0); }
 }
 
+@keyframes mint-toast-indeterminate {
+  0%   { transform: translateX(-100%) scaleX(0.4); }
+  100% { transform: translateX(250%) scaleX(0.4); }
+}
+
 @media (prefers-reduced-motion: reduce) {
   .mint-toast__progress { animation: none; opacity: 0.4; }
 }

package/src/styles/index.css

@@ -90,6 +90,7 @@
 @import './components/experiment-code-badge.css';
 @import './components/experiment-selector-modal.css';
 @import './components/artifact-selector-modal.css';
+@import './components/file-browser-modal.css';
 @import './components/artifact-save-dialog.css';
 @import './components/experiment-popover.css';
 @import './components/fit-panel.css';
@@ -100,3 +101,5 @@
 @import './components/mobile-support-gate.css';
 @import './components/plugin-icon.css';
 @import './components/reagent-editor.css';
+
+@import './components/file-picker.css';

package/src/styles/variables.css

@@ -528,23 +528,43 @@ code, pre {
 /* ==========================================================================
    Scrollbar Styling
    ========================================================================== */
+/* Hidden until hover: the thumb is transparent by default and appears on hover
+   (or focus) of the scroll area. The gutter is always reserved so the reveal
+   never reflows content. Standard properties first; the ::-webkit-* rules are
+   the Safari fallback (Chrome ignores them once scrollbar-color is set). */
+* {
+  scrollbar-width: thin;
+  scrollbar-color: transparent transparent;
+}
+
+*:hover,
+*:focus-within {
+  scrollbar-color: var(--scrollbar-thumb) transparent;
+}
+
 ::-webkit-scrollbar {
   width: 8px;
   height: 8px;
 }
 
 ::-webkit-scrollbar-track {
-  background: var(--scrollbar-track);
-  border-radius: 4px;
+  background: transparent;
 }
 
 ::-webkit-scrollbar-thumb {
-  background: var(--scrollbar-thumb);
-  border-radius: 4px;
+  background: transparent;
+  border: 2px solid transparent;
+  border-radius: 9999px;
+  background-clip: content-box;
+}
+
+:hover::-webkit-scrollbar-thumb,
+:focus-within::-webkit-scrollbar-thumb {
+  background-color: var(--scrollbar-thumb);
 }
 
 ::-webkit-scrollbar-thumb:hover {
-  background: var(--scrollbar-hover);
+  background-color: var(--scrollbar-hover);
 }
 
 /* ==========================================================================

package/src/types/components.ts

@@ -54,11 +54,34 @@ export interface ModalTab {
 export type AlertType = 'success' | 'error' | 'warning' | 'info'
 
 // Toast types
+export interface ToastAction {
+  label: string
+  onClick: () => void
+  primary?: boolean
+}
+
 export interface Toast {
   id: number
+  /** Legacy single-line body; kept as an alias of `title`. */
   message: string
   type: 'success' | 'error' | 'warning' | 'info'
   duration?: number
+  title?: string
+  detail?: string
+  /** At most two; extra entries are dropped. */
+  actions?: ToastAction[]
+  /** Render the close button (default true). */
+  dismissible?: boolean
+  /** `ttl` (default) shrinks over `duration`; `indeterminate` never auto-dismisses; `none` hides the bar. */
+  progress?: 'ttl' | 'indeterminate' | 'none'
+  /** Collapsed-stack count; renders the `×N` pill when above 1. */
+  count?: number
+}
+
+export type ToastOptions = Omit<Toast, 'id' | 'message' | 'type'> & {
+  title: string
+  type?: Toast['type']
+  message?: string
 }
 
 // Tab types

package/src/types/fileBrowserTypes.ts

@@ -0,0 +1,85 @@
+/**
+ * Types for browsing read-only server mounts.
+ *
+ * These mirror the `mint_sdk.filesystem` wire models. MINT records the path of
+ * data that already sits on a mount; it never copies it.
+ */
+
+/** What a listing row is. */
+export type FileEntryKind = 'file' | 'directory'
+
+/** Field a listing is ordered by, after directories are grouped first. */
+export type FileBrowserSortKey = 'name' | 'size' | 'modified'
+
+/** One read-only directory tree exposed by the server. */
+export interface ServerMount {
+  id: string
+  label: string
+  read_only?: boolean
+  /** False when the mount is configured but currently unreachable. */
+  available?: boolean
+  /** Child mounts, used to render the sidebar tree. */
+  children?: ServerMount[]
+  /** Item count shown beside the mount; free-form so callers can send "1.2k". */
+  count?: string | number
+}
+
+/** One step of the trail from a mount root to the current directory. */
+export interface FilePathCrumb {
+  label: string
+  path: string
+}
+
+/** A single file or directory inside a mount. */
+export interface FileEntry {
+  name: string
+  /** Mount-relative POSIX path. */
+  path: string
+  kind: FileEntryKind
+  /** Null for directories. */
+  size_bytes?: number | null
+  modified_at?: string | null
+  extension?: string
+  /**
+   * False when the entry fails the active type rules. Non-matching entries are
+   * still listed — they dim rather than vanish.
+   */
+  matches_type_rules?: boolean
+  /** Directories only. */
+  child_count?: number | null
+}
+
+/** The contents of one directory inside a mount. */
+export interface FileDirectoryListing {
+  mount_id: string
+  path: string
+  /** Null at the mount root. */
+  parent?: string | null
+  breadcrumbs?: FilePathCrumb[]
+  entries?: FileEntry[]
+  /** Directory size before any search filter. */
+  total_count?: number
+  /** How many entries satisfy the type rules. */
+  match_count?: number
+  /** How many entries this response carries, after search and any cap. */
+  shown_count?: number
+  /** True when the directory held more entries than the server will return. */
+  truncated?: boolean
+}
+
+/** One item the user has picked. */
+export interface FileSelection {
+  mount_id: string
+  path: string
+  name: string
+  kind: FileEntryKind
+  /** For a directory pick, how many files it contains. */
+  child_count?: number | null
+  size_bytes?: number | null
+}
+
+/** Where the user is standing in the browser. */
+export interface FileBrowserLocation {
+  mount_id: string
+  path: string
+}

package/src/types/filePicker.ts

@@ -0,0 +1,72 @@
+/** Sources are supplied by the host; the SDK never infers a host filesystem path. */
+export type PickerSource = 'server' | 'localFile'
+export type PickerSelectionMode = 'single-file' | 'multi-file' | 'folder' | 'folder+files'
+
+interface PickerNodeBase {
+  path: string
+  name: string
+  parentPath?: string | null
+  parentName?: string
+  bytes?: number | null
+  /** An explicit adapter failure makes a row inert, including its disclosure. */
+  unavailableReason?: string
+}
+export interface PickerFolder extends PickerNodeBase {
+  kind: 'folder'
+  fileCount?: number | null
+  formats?: Record<string, number>
+  hasChildren?: boolean
+}
+export interface PickerFile extends PickerNodeBase {
+  kind: 'file'
+  format: string
+  /** Present only for browser-selected files. The picker does not read its bytes. */
+  file?: File
+}
+export type PickerNode = PickerFolder | PickerFile
+export interface PickerRequest {
+  signal?: AbortSignal
+  source?: PickerSource
+  /**
+   * Set only when the user pressed Refresh. Adapters that cache listings (or
+   * ask a server to bypass its own cache) should re-read the location then and
+   * serve cached data otherwise; the picker keeps folder contents while it is
+   * open and re-reads the current location on each open.
+   */
+  refresh?: true
+}
+export interface PickerAdapter {
+  listRoot(request?: PickerRequest): Promise<PickerNode[]>
+  listChildren(path: string, request?: PickerRequest): Promise<PickerNode[]>
+  search(
+    query: string,
+    scope: { path: string; recursive: boolean },
+    request?: PickerRequest,
+  ): Promise<PickerNode[]>
+}
+export interface PickerCapability {
+  /** Case-insensitive suffixes, including compound extensions such as mzML.gz. */
+  formats: string[]
+  maxBytes?: number
+  /** Optional host-owned blank classification; no filename heuristics in the SDK. */
+  isBlank?: (node: PickerNode) => boolean
+}
+export type PickerCapabilities = Partial<Record<PickerSource, PickerCapability>>
+export type PickerExclusionReason =
+  'deselected' | 'unsupported' | 'tooLarge' | 'blank' | 'unreadable' | 'forbidden'
+export interface PickerExcluded {
+  /** Opaque identity prevents collisions between equal filenames in different folders. */
+  path: string
+  name: string
+  reason: PickerExclusionReason
+}
+export type PickerSelection =
+  | { source: 'server'; folders: string[]; files: PickerFile[]; excluded: PickerExcluded[] }
+  | { source: 'localFile'; files: File[]; relativePaths?: string[] }
+export interface PickerTreeRow {
+  node: PickerNode
+  depth: number
+  expanded: boolean
+  loading: boolean
+  error?: string
+}

package/src/types/form-builder.ts

@@ -93,6 +93,8 @@ export interface FormFieldSchema extends AccessControlled {
   colSpan?: number
   /** Extra props passed directly to the underlying component. */
   props?: Record<string, unknown>
+  /** Element type for `tags` fields; `number` parses each entered tag back to a number. */
+  itemType?: 'string' | 'number'
 }
 
 export type FormOptionInput = SelectOption<unknown> | OptionPrimitive

package/src/types/generated-ui.ts

@@ -11,6 +11,8 @@ export interface GeneratedJsonSchema {
   minimum?: number
   maximum?: number
   exclusiveMinimum?: number
+  exclusiveMaximum?: number
+  multipleOf?: number
   minLength?: number
   maxLength?: number
   pattern?: string

package/src/types/index.ts

@@ -11,6 +11,8 @@ export type {
   ModalTab,
   AlertType,
   Toast,
+  ToastAction,
+  ToastOptions,
   TabItem,
   TabItemInput,
   OptionPrimitive,
@@ -208,6 +210,18 @@ export type {
 } from './analysisArtifactTypes'
 export { ANALYSIS_FILE_ARTIFACT_SCHEMA } from './analysisArtifactTypes'
 
+// File browser types
+export type {
+  FileBrowserLocation,
+  FileBrowserSortKey,
+  FileDirectoryListing,
+  FileEntry,
+  FileEntryKind,
+  FilePathCrumb,
+  FileSelection,
+  ServerMount,
+} from './fileBrowserTypes'
+
 export type {
   JobListPayload,
   JobProgress,
@@ -297,3 +311,5 @@ export type {
   TableDensity,
   UserSummary,
 } from './platform'
+
+export type * from './filePicker'

package/dist/ExperimentPopover-oL0fg_A0.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"ExperimentPopover-oL0fg_A0.js","names":["$slots"],"sources":["../src/components/ConfirmDialog.vue","../src/components/ConfirmDialog.vue","../src/components/ExperimentPopover.vue","../src/components/ExperimentPopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** Confirm/cancel dialog with danger, warning, and info variants; blocks close while loading. */\nimport { computed } from 'vue'\nimport type { ButtonVariant } from '../types'\nimport BaseModal from './BaseModal.vue'\nimport BaseButton from './BaseButton.vue'\n\ninterface Props {\n  modelValue: boolean\n  title?: string\n  subtitle?: string\n  message?: string\n  variant?: 'danger' | 'warning' | 'info'\n  confirmLabel?: string\n  cancelLabel?: string\n  loading?: boolean\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Confirm',\n  variant: 'danger',\n  confirmLabel: 'Confirm',\n  cancelLabel: 'Cancel',\n  loading: false,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n  confirm: []\n  cancel: []\n}>()\n\nfunction handleCancel() {\n  emit('update:modelValue', false)\n  emit('cancel')\n}\n\nfunction handleConfirm() {\n  emit('confirm')\n}\n\nconst confirmVariant = computed<ButtonVariant>(() => {\n  if (props.variant === 'info') return 'primary'\n  if (props.variant === 'warning') return 'cta'\n  return 'danger'\n})\n</script>\n\n<template>\n  <BaseModal\n    :model-value=\"modelValue\"\n    :title=\"title\"\n    :subtitle=\"subtitle\"\n    size=\"sm\"\n    :closable=\"!loading\"\n    :close-on-overlay=\"!loading\"\n    :close-on-escape=\"!loading\"\n    @update:model-value=\"emit('update:modelValue', $event)\"\n  >\n    <div class=\"mint-confirm\">\n      <!-- Icon is now opt-in via slot. Refresh design keeps the body focused on\n           the message; variant intent is carried by the confirm button's color. -->\n      <div\n        v-if=\"$slots.icon\"\n        :class=\"['mint-confirm__icon', `mint-confirm__icon--${variant}`]\"\n      >\n        <slot name=\"icon\" />\n      </div>\n      <p v-if=\"message\" class=\"mint-confirm__message\">{{ message }}</p>\n      <slot />\n    </div>\n\n    <template #footer>\n      <div class=\"mint-confirm__footer\">\n        <BaseButton\n          type=\"button\"\n          variant=\"secondary\"\n          size=\"md\"\n          :disabled=\"loading\"\n          @click=\"handleCancel\"\n        >\n          {{ cancelLabel }}\n        </BaseButton>\n        <BaseButton\n          type=\"button\"\n          :variant=\"confirmVariant\"\n          size=\"md\"\n          :loading=\"loading\"\n          @click=\"handleConfirm\"\n        >\n          {{ confirmLabel }}\n        </BaseButton>\n      </div>\n    </template>\n  </BaseModal>\n</template>\n","<script setup lang=\"ts\">\n/** Confirm/cancel dialog with danger, warning, and info variants; blocks close while loading. */\nimport { computed } from 'vue'\nimport type { ButtonVariant } from '../types'\nimport BaseModal from './BaseModal.vue'\nimport BaseButton from './BaseButton.vue'\n\ninterface Props {\n  modelValue: boolean\n  title?: string\n  subtitle?: string\n  message?: string\n  variant?: 'danger' | 'warning' | 'info'\n  confirmLabel?: string\n  cancelLabel?: string\n  loading?: boolean\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Confirm',\n  variant: 'danger',\n  confirmLabel: 'Confirm',\n  cancelLabel: 'Cancel',\n  loading: false,\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: boolean]\n  confirm: []\n  cancel: []\n}>()\n\nfunction handleCancel() {\n  emit('update:modelValue', false)\n  emit('cancel')\n}\n\nfunction handleConfirm() {\n  emit('confirm')\n}\n\nconst confirmVariant = computed<ButtonVariant>(() => {\n  if (props.variant === 'info') return 'primary'\n  if (props.variant === 'warning') return 'cta'\n  return 'danger'\n})\n</script>\n\n<template>\n  <BaseModal\n    :model-value=\"modelValue\"\n    :title=\"title\"\n    :subtitle=\"subtitle\"\n    size=\"sm\"\n    :closable=\"!loading\"\n    :close-on-overlay=\"!loading\"\n    :close-on-escape=\"!loading\"\n    @update:model-value=\"emit('update:modelValue', $event)\"\n  >\n    <div class=\"mint-confirm\">\n      <!-- Icon is now opt-in via slot. Refresh design keeps the body focused on\n           the message; variant intent is carried by the confirm button's color. -->\n      <div\n        v-if=\"$slots.icon\"\n        :class=\"['mint-confirm__icon', `mint-confirm__icon--${variant}`]\"\n      >\n        <slot name=\"icon\" />\n      </div>\n      <p v-if=\"message\" class=\"mint-confirm__message\">{{ message }}</p>\n      <slot />\n    </div>\n\n    <template #footer>\n      <div class=\"mint-confirm__footer\">\n        <BaseButton\n          type=\"button\"\n          variant=\"secondary\"\n          size=\"md\"\n          :disabled=\"loading\"\n          @click=\"handleCancel\"\n        >\n          {{ cancelLabel }}\n        </BaseButton>\n        <BaseButton\n          type=\"button\"\n          :variant=\"confirmVariant\"\n          size=\"md\"\n          :loading=\"loading\"\n          @click=\"handleConfirm\"\n        >\n          {{ confirmLabel }}\n        </BaseButton>\n      </div>\n    </template>\n  </BaseModal>\n</template>\n","<script setup lang=\"ts\">\n/** Floating popover showing the active experiment with save, detach, and select actions. */\nimport { ref, computed, watch, onUnmounted } from 'vue'\nimport { useDropdownState } from '../composables/useDropdownState'\nimport { formatExperimentStatus } from '../composables/experiment-utils'\nimport ConfirmDialog from './ConfirmDialog.vue'\n\ninterface Props {\n  experimentName?: string\n  experimentCode?: string\n  experimentStatus?: string\n  /** An experiment is bound but the platform has not returned its record yet. */\n  isResolving?: boolean\n  /** Message explaining why the bound experiment could not be resolved. */\n  error?: string\n  showSave?: boolean\n  showDetach?: boolean\n  saveDisabled?: boolean\n  saveLoading?: boolean\n  saveSuccessMessage?: string\n  saveDisabledMessage?: string\n  confirmSave?: boolean\n  confirmTitle?: string\n  confirmMessage?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  isResolving: false,\n  showSave: false,\n  showDetach: false,\n  saveDisabled: false,\n  saveLoading: false,\n  confirmSave: true,\n})\n\n// An experiment is bound but has no name to show — either still resolving or\n// resolution failed. The id is never substituted: a name may only come from the\n// platform, so these states say what is happening instead of inventing a label.\nconst isUnresolved = computed(() => props.isResolving || !!props.error)\nconst hasExperiment = computed(() => !!props.experimentName || !!props.experimentCode)\n\nconst panelSubtitle = computed(() => {\n  if (props.isResolving) return 'Loading experiment…'\n  if (props.error) return 'Could not load this experiment'\n  return hasExperiment.value ? 'Linked experiment context' : 'Link to an MINT experiment'\n})\n\nconst triggerLabel = computed(() => {\n  if (props.isResolving) return 'Loading experiment'\n  if (props.error) return 'Experiment unavailable'\n  return props.experimentName || props.experimentCode || 'No experiment'\n})\n\nconst emit = defineEmits<{\n  select: []\n  save: []\n  detach: []\n}>()\n\nconst { isOpen, rootRef: popoverRef, triggerRef, close, toggle } = useDropdownState({\n  closeOnEscape: false,\n})\nconst showSuccess = ref(false)\nconst showConfirm = ref(false)\n\nfunction handleSelect() {\n  emit('select')\n  close()\n}\n\nfunction handleSave() {\n  if (props.saveDisabled || props.saveLoading) return\n  if (props.confirmSave) {\n    showConfirm.value = true\n  } else {\n    emit('save')\n  }\n}\n\nfunction handleConfirmSave() {\n  showConfirm.value = false\n  emit('save')\n}\n\nfunction handleDetach() {\n  emit('detach')\n  close()\n}\n\nlet successTimer: ReturnType<typeof setTimeout> | null = null\n\n// Show success state when saveSuccessMessage changes from empty to a value\nwatch(() => props.saveSuccessMessage, (msg) => {\n  if (successTimer) clearTimeout(successTimer)\n  if (msg) {\n    showSuccess.value = true\n    successTimer = setTimeout(() => {\n      showSuccess.value = false\n      successTimer = null\n    }, 3000)\n  }\n})\n\nonUnmounted(() => {\n  if (successTimer) clearTimeout(successTimer)\n})\n</script>\n\n<template>\n  <div ref=\"popoverRef\" class=\"mint-experiment-popover\">\n    <!-- Split trigger: experiment pill + inline save -->\n    <div\n      :class=\"[\n        'mint-experiment-popover__split',\n        { 'mint-experiment-popover__split--with-save': showSave && experimentName },\n      ]\"\n    >\n      <!-- Left: experiment trigger (opens popover). Prefer the human-readable\n           name; the formal code, when present, stays in the detail panel. -->\n      <button\n        ref=\"triggerRef\"\n        type=\"button\"\n        :class=\"[\n          'mint-experiment-popover__trigger',\n          { 'mint-experiment-popover__trigger--active': isOpen },\n          { 'mint-experiment-popover__trigger--empty': !isUnresolved && !hasExperiment },\n          { 'mint-experiment-popover__trigger--loading': isResolving },\n          { 'mint-experiment-popover__trigger--error': !isResolving && !!error },\n        ]\"\n        :title=\"isUnresolved ? triggerLabel : experimentName || experimentCode || undefined\"\n        :aria-label=\"isUnresolved ? triggerLabel : undefined\"\n        :aria-busy=\"isResolving || undefined\"\n        :aria-expanded=\"isOpen\"\n        @click.stop=\"toggle\"\n      >\n        <!-- Flask icon -->\n        <svg class=\"mint-experiment-popover__trigger-icon\" aria-hidden=\"true\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n          <path\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            stroke-width=\"1.75\"\n            d=\"M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z\"\n          />\n        </svg>\n        <!-- Resolving and error come first: with an experiment bound but no name\n             yet, \"No experiment\" would be a lie. -->\n        <span v-if=\"isResolving\" class=\"mint-experiment-popover__trigger-skeleton\" aria-hidden=\"true\" />\n        <span v-else-if=\"error\" class=\"mint-experiment-popover__trigger-text\">Experiment unavailable</span>\n        <!-- Name preferred, code as fallback, \"No experiment\" as empty state -->\n        <span v-else-if=\"experimentName\" class=\"mint-experiment-popover__trigger-text\">{{ experimentName }}</span>\n        <span v-else-if=\"experimentCode\" class=\"mint-experiment-popover__trigger-code\">{{ experimentCode }}</span>\n        <span v-else class=\"mint-experiment-popover__trigger-text\">No experiment</span>\n        <!-- Chevron -->\n        <svg class=\"mint-experiment-popover__trigger-chevron\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n          <path d=\"m6 9 6 6 6-6\" />\n        </svg>\n      </button>\n\n      <!-- Right: inline save button (direct action) -->\n      <button\n        v-if=\"showSave && experimentName\"\n        type=\"button\"\n        :class=\"[\n          'mint-experiment-popover__save-trigger',\n          { 'mint-experiment-popover__save-trigger--loading': saveLoading },\n          { 'mint-experiment-popover__save-trigger--success': showSuccess },\n          { 'mint-experiment-popover__save-trigger--disabled': saveDisabled && !showSuccess },\n        ]\"\n        :disabled=\"saveDisabled && !showSuccess\"\n        :title=\"saveDisabled && saveDisabledMessage ? saveDisabledMessage : showSuccess && saveSuccessMessage ? saveSuccessMessage : 'Save to Experiment'\"\n        aria-label=\"Save to experiment\"\n        @click.stop=\"handleSave\"\n      >\n        <!-- Loading spinner -->\n        <span v-if=\"saveLoading\" class=\"mint-experiment-popover__spinner--inline\" />\n        <!-- Success check -->\n        <svg v-else-if=\"showSuccess\" class=\"mint-experiment-popover__save-trigger-icon\" aria-hidden=\"true\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" d=\"M5 13l4 4L19 7\" />\n        </svg>\n        <!-- Save icon -->\n        <svg v-else class=\"mint-experiment-popover__save-trigger-icon\" aria-hidden=\"true\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 7H5a2 2 0 00-2 2v9a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-3m-1 4l-3 3m0 0l-3-3m3 3V4\" />\n        </svg>\n      </button>\n    </div>\n\n    <!-- Popover panel -->\n    <div v-if=\"isOpen\" class=\"mint-experiment-popover__panel\">\n      <!-- Header -->\n      <div class=\"mint-experiment-popover__header\">\n        <div class=\"mint-experiment-popover__title\">Experiment</div>\n        <div class=\"mint-experiment-popover__subtitle\">\n          {{ panelSubtitle }}\n        </div>\n      </div>\n\n      <!-- Bound, still resolving — placeholders stand in for the record the\n           platform has not returned yet. -->\n      <div v-if=\"isResolving\" class=\"mint-experiment-popover__body\">\n        <div class=\"mint-experiment-popover__card\" aria-busy=\"true\">\n          <div class=\"mint-experiment-popover__card-icon\">\n            <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                stroke-width=\"1.75\"\n                d=\"M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z\"\n              />\n            </svg>\n          </div>\n          <div class=\"mint-experiment-popover__card-info\">\n            <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--code\" />\n            <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--name\" />\n            <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--status\" />\n          </div>\n        </div>\n        <div class=\"mint-experiment-popover__card-actions\">\n          <button type=\"button\" class=\"mint-experiment-popover__change-btn\" @click=\"handleSelect\">\n            Change\n          </button>\n          <button v-if=\"showDetach\" type=\"button\" class=\"mint-experiment-popover__detach-btn\" @click=\"handleDetach\">\n            Detach\n          </button>\n        </div>\n      </div>\n\n      <!-- Bound, resolution failed — Detach stays reachable so the user is not\n           stuck on an experiment the platform cannot describe. -->\n      <div v-else-if=\"error\" class=\"mint-experiment-popover__body\">\n        <div class=\"mint-experiment-popover__card mint-experiment-popover__card--error\" role=\"alert\">\n          <div class=\"mint-experiment-popover__card-icon mint-experiment-popover__card-icon--error\">\n            <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                stroke-width=\"1.75\"\n                d=\"M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z\"\n              />\n            </svg>\n          </div>\n          <div class=\"mint-experiment-popover__card-info\">\n            <div class=\"mint-experiment-popover__card-name\">Experiment unavailable</div>\n            <div class=\"mint-experiment-popover__card-message\">{{ error }}</div>\n          </div>\n        </div>\n        <div class=\"mint-experiment-popover__card-actions\">\n          <button type=\"button\" class=\"mint-experiment-popover__change-btn\" @click=\"handleSelect\">\n            Change\n          </button>\n          <button v-if=\"showDetach\" type=\"button\" class=\"mint-experiment-popover__detach-btn\" @click=\"handleDetach\">\n            Detach\n          </button>\n        </div>\n      </div>\n\n      <!-- No experiment selected -->\n      <div v-else-if=\"!experimentName\" class=\"mint-experiment-popover__body\">\n        <button type=\"button\" class=\"mint-experiment-popover__select-btn\" @click=\"handleSelect\">\n          <svg width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 4v16m8-8H4\" />\n          </svg>\n          Select Experiment\n        </button>\n      </div>\n\n      <!-- Experiment selected -->\n      <div v-else class=\"mint-experiment-popover__body\">\n        <div class=\"mint-experiment-popover__card\">\n          <div class=\"mint-experiment-popover__card-icon\">\n            <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                stroke-width=\"1.75\"\n                d=\"M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z\"\n              />\n            </svg>\n          </div>\n          <div class=\"mint-experiment-popover__card-info\">\n            <span v-if=\"experimentCode\" class=\"mint-experiment-popover__card-code\">{{ experimentCode }}</span>\n            <div class=\"mint-experiment-popover__card-name\">{{ experimentName }}</div>\n            <div v-if=\"experimentStatus\" class=\"mint-experiment-popover__card-status\">\n              {{ formatExperimentStatus(experimentStatus) }}\n            </div>\n          </div>\n        </div>\n        <div class=\"mint-experiment-popover__card-actions\">\n          <button type=\"button\" class=\"mint-experiment-popover__change-btn\" @click=\"handleSelect\">\n            Change\n          </button>\n          <button v-if=\"showDetach\" type=\"button\" class=\"mint-experiment-popover__detach-btn\" @click=\"handleDetach\">\n            Detach\n          </button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Save confirmation dialog -->\n    <ConfirmDialog\n      v-model=\"showConfirm\"\n      :title=\"confirmTitle ?? 'Save to Experiment'\"\n      :message=\"confirmMessage ?? `Save current data to ${experimentName}?`\"\n      variant=\"info\"\n      confirm-label=\"Save\"\n      :loading=\"saveLoading\"\n      @confirm=\"handleConfirmSave\"\n    />\n  </div>\n</template>\n","<script setup lang=\"ts\">\n/** Floating popover showing the active experiment with save, detach, and select actions. */\nimport { ref, computed, watch, onUnmounted } from 'vue'\nimport { useDropdownState } from '../composables/useDropdownState'\nimport { formatExperimentStatus } from '../composables/experiment-utils'\nimport ConfirmDialog from './ConfirmDialog.vue'\n\ninterface Props {\n  experimentName?: string\n  experimentCode?: string\n  experimentStatus?: string\n  /** An experiment is bound but the platform has not returned its record yet. */\n  isResolving?: boolean\n  /** Message explaining why the bound experiment could not be resolved. */\n  error?: string\n  showSave?: boolean\n  showDetach?: boolean\n  saveDisabled?: boolean\n  saveLoading?: boolean\n  saveSuccessMessage?: string\n  saveDisabledMessage?: string\n  confirmSave?: boolean\n  confirmTitle?: string\n  confirmMessage?: string\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  isResolving: false,\n  showSave: false,\n  showDetach: false,\n  saveDisabled: false,\n  saveLoading: false,\n  confirmSave: true,\n})\n\n// An experiment is bound but has no name to show — either still resolving or\n// resolution failed. The id is never substituted: a name may only come from the\n// platform, so these states say what is happening instead of inventing a label.\nconst isUnresolved = computed(() => props.isResolving || !!props.error)\nconst hasExperiment = computed(() => !!props.experimentName || !!props.experimentCode)\n\nconst panelSubtitle = computed(() => {\n  if (props.isResolving) return 'Loading experiment…'\n  if (props.error) return 'Could not load this experiment'\n  return hasExperiment.value ? 'Linked experiment context' : 'Link to an MINT experiment'\n})\n\nconst triggerLabel = computed(() => {\n  if (props.isResolving) return 'Loading experiment'\n  if (props.error) return 'Experiment unavailable'\n  return props.experimentName || props.experimentCode || 'No experiment'\n})\n\nconst emit = defineEmits<{\n  select: []\n  save: []\n  detach: []\n}>()\n\nconst { isOpen, rootRef: popoverRef, triggerRef, close, toggle } = useDropdownState({\n  closeOnEscape: false,\n})\nconst showSuccess = ref(false)\nconst showConfirm = ref(false)\n\nfunction handleSelect() {\n  emit('select')\n  close()\n}\n\nfunction handleSave() {\n  if (props.saveDisabled || props.saveLoading) return\n  if (props.confirmSave) {\n    showConfirm.value = true\n  } else {\n    emit('save')\n  }\n}\n\nfunction handleConfirmSave() {\n  showConfirm.value = false\n  emit('save')\n}\n\nfunction handleDetach() {\n  emit('detach')\n  close()\n}\n\nlet successTimer: ReturnType<typeof setTimeout> | null = null\n\n// Show success state when saveSuccessMessage changes from empty to a value\nwatch(() => props.saveSuccessMessage, (msg) => {\n  if (successTimer) clearTimeout(successTimer)\n  if (msg) {\n    showSuccess.value = true\n    successTimer = setTimeout(() => {\n      showSuccess.value = false\n      successTimer = null\n    }, 3000)\n  }\n})\n\nonUnmounted(() => {\n  if (successTimer) clearTimeout(successTimer)\n})\n</script>\n\n<template>\n  <div ref=\"popoverRef\" class=\"mint-experiment-popover\">\n    <!-- Split trigger: experiment pill + inline save -->\n    <div\n      :class=\"[\n        'mint-experiment-popover__split',\n        { 'mint-experiment-popover__split--with-save': showSave && experimentName },\n      ]\"\n    >\n      <!-- Left: experiment trigger (opens popover). Prefer the human-readable\n           name; the formal code, when present, stays in the detail panel. -->\n      <button\n        ref=\"triggerRef\"\n        type=\"button\"\n        :class=\"[\n          'mint-experiment-popover__trigger',\n          { 'mint-experiment-popover__trigger--active': isOpen },\n          { 'mint-experiment-popover__trigger--empty': !isUnresolved && !hasExperiment },\n          { 'mint-experiment-popover__trigger--loading': isResolving },\n          { 'mint-experiment-popover__trigger--error': !isResolving && !!error },\n        ]\"\n        :title=\"isUnresolved ? triggerLabel : experimentName || experimentCode || undefined\"\n        :aria-label=\"isUnresolved ? triggerLabel : undefined\"\n        :aria-busy=\"isResolving || undefined\"\n        :aria-expanded=\"isOpen\"\n        @click.stop=\"toggle\"\n      >\n        <!-- Flask icon -->\n        <svg class=\"mint-experiment-popover__trigger-icon\" aria-hidden=\"true\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n          <path\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            stroke-width=\"1.75\"\n            d=\"M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z\"\n          />\n        </svg>\n        <!-- Resolving and error come first: with an experiment bound but no name\n             yet, \"No experiment\" would be a lie. -->\n        <span v-if=\"isResolving\" class=\"mint-experiment-popover__trigger-skeleton\" aria-hidden=\"true\" />\n        <span v-else-if=\"error\" class=\"mint-experiment-popover__trigger-text\">Experiment unavailable</span>\n        <!-- Name preferred, code as fallback, \"No experiment\" as empty state -->\n        <span v-else-if=\"experimentName\" class=\"mint-experiment-popover__trigger-text\">{{ experimentName }}</span>\n        <span v-else-if=\"experimentCode\" class=\"mint-experiment-popover__trigger-code\">{{ experimentCode }}</span>\n        <span v-else class=\"mint-experiment-popover__trigger-text\">No experiment</span>\n        <!-- Chevron -->\n        <svg class=\"mint-experiment-popover__trigger-chevron\" aria-hidden=\"true\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n          <path d=\"m6 9 6 6 6-6\" />\n        </svg>\n      </button>\n\n      <!-- Right: inline save button (direct action) -->\n      <button\n        v-if=\"showSave && experimentName\"\n        type=\"button\"\n        :class=\"[\n          'mint-experiment-popover__save-trigger',\n          { 'mint-experiment-popover__save-trigger--loading': saveLoading },\n          { 'mint-experiment-popover__save-trigger--success': showSuccess },\n          { 'mint-experiment-popover__save-trigger--disabled': saveDisabled && !showSuccess },\n        ]\"\n        :disabled=\"saveDisabled && !showSuccess\"\n        :title=\"saveDisabled && saveDisabledMessage ? saveDisabledMessage : showSuccess && saveSuccessMessage ? saveSuccessMessage : 'Save to Experiment'\"\n        aria-label=\"Save to experiment\"\n        @click.stop=\"handleSave\"\n      >\n        <!-- Loading spinner -->\n        <span v-if=\"saveLoading\" class=\"mint-experiment-popover__spinner--inline\" />\n        <!-- Success check -->\n        <svg v-else-if=\"showSuccess\" class=\"mint-experiment-popover__save-trigger-icon\" aria-hidden=\"true\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2.5\" d=\"M5 13l4 4L19 7\" />\n        </svg>\n        <!-- Save icon -->\n        <svg v-else class=\"mint-experiment-popover__save-trigger-icon\" aria-hidden=\"true\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M8 7H5a2 2 0 00-2 2v9a2 2 0 002 2h14a2 2 0 002-2V9a2 2 0 00-2-2h-3m-1 4l-3 3m0 0l-3-3m3 3V4\" />\n        </svg>\n      </button>\n    </div>\n\n    <!-- Popover panel -->\n    <div v-if=\"isOpen\" class=\"mint-experiment-popover__panel\">\n      <!-- Header -->\n      <div class=\"mint-experiment-popover__header\">\n        <div class=\"mint-experiment-popover__title\">Experiment</div>\n        <div class=\"mint-experiment-popover__subtitle\">\n          {{ panelSubtitle }}\n        </div>\n      </div>\n\n      <!-- Bound, still resolving — placeholders stand in for the record the\n           platform has not returned yet. -->\n      <div v-if=\"isResolving\" class=\"mint-experiment-popover__body\">\n        <div class=\"mint-experiment-popover__card\" aria-busy=\"true\">\n          <div class=\"mint-experiment-popover__card-icon\">\n            <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                stroke-width=\"1.75\"\n                d=\"M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z\"\n              />\n            </svg>\n          </div>\n          <div class=\"mint-experiment-popover__card-info\">\n            <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--code\" />\n            <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--name\" />\n            <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--status\" />\n          </div>\n        </div>\n        <div class=\"mint-experiment-popover__card-actions\">\n          <button type=\"button\" class=\"mint-experiment-popover__change-btn\" @click=\"handleSelect\">\n            Change\n          </button>\n          <button v-if=\"showDetach\" type=\"button\" class=\"mint-experiment-popover__detach-btn\" @click=\"handleDetach\">\n            Detach\n          </button>\n        </div>\n      </div>\n\n      <!-- Bound, resolution failed — Detach stays reachable so the user is not\n           stuck on an experiment the platform cannot describe. -->\n      <div v-else-if=\"error\" class=\"mint-experiment-popover__body\">\n        <div class=\"mint-experiment-popover__card mint-experiment-popover__card--error\" role=\"alert\">\n          <div class=\"mint-experiment-popover__card-icon mint-experiment-popover__card-icon--error\">\n            <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                stroke-width=\"1.75\"\n                d=\"M12 9v3.75m9-.75a9 9 0 11-18 0 9 9 0 0118 0zm-9 3.75h.008v.008H12v-.008z\"\n              />\n            </svg>\n          </div>\n          <div class=\"mint-experiment-popover__card-info\">\n            <div class=\"mint-experiment-popover__card-name\">Experiment unavailable</div>\n            <div class=\"mint-experiment-popover__card-message\">{{ error }}</div>\n          </div>\n        </div>\n        <div class=\"mint-experiment-popover__card-actions\">\n          <button type=\"button\" class=\"mint-experiment-popover__change-btn\" @click=\"handleSelect\">\n            Change\n          </button>\n          <button v-if=\"showDetach\" type=\"button\" class=\"mint-experiment-popover__detach-btn\" @click=\"handleDetach\">\n            Detach\n          </button>\n        </div>\n      </div>\n\n      <!-- No experiment selected -->\n      <div v-else-if=\"!experimentName\" class=\"mint-experiment-popover__body\">\n        <button type=\"button\" class=\"mint-experiment-popover__select-btn\" @click=\"handleSelect\">\n          <svg width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n            <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 4v16m8-8H4\" />\n          </svg>\n          Select Experiment\n        </button>\n      </div>\n\n      <!-- Experiment selected -->\n      <div v-else class=\"mint-experiment-popover__body\">\n        <div class=\"mint-experiment-popover__card\">\n          <div class=\"mint-experiment-popover__card-icon\">\n            <svg fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n              <path\n                stroke-linecap=\"round\"\n                stroke-linejoin=\"round\"\n                stroke-width=\"1.75\"\n                d=\"M19.428 15.428a2 2 0 00-1.022-.547l-2.387-.477a6 6 0 00-3.86.517l-.318.158a6 6 0 01-3.86.517L6.05 15.21a2 2 0 00-1.806.547M8 4h8l-1 1v5.172a2 2 0 00.586 1.414l5 5c1.26 1.26.367 3.414-1.415 3.414H4.828c-1.782 0-2.674-2.154-1.414-3.414l5-5A2 2 0 009 10.172V5L8 4z\"\n              />\n            </svg>\n          </div>\n          <div class=\"mint-experiment-popover__card-info\">\n            <span v-if=\"experimentCode\" class=\"mint-experiment-popover__card-code\">{{ experimentCode }}</span>\n            <div class=\"mint-experiment-popover__card-name\">{{ experimentName }}</div>\n            <div v-if=\"experimentStatus\" class=\"mint-experiment-popover__card-status\">\n              {{ formatExperimentStatus(experimentStatus) }}\n            </div>\n          </div>\n        </div>\n        <div class=\"mint-experiment-popover__card-actions\">\n          <button type=\"button\" class=\"mint-experiment-popover__change-btn\" @click=\"handleSelect\">\n            Change\n          </button>\n          <button v-if=\"showDetach\" type=\"button\" class=\"mint-experiment-popover__detach-btn\" @click=\"handleDetach\">\n            Detach\n          </button>\n        </div>\n      </div>\n    </div>\n\n    <!-- Save confirmation dialog -->\n    <ConfirmDialog\n      v-model=\"showConfirm\"\n      :title=\"confirmTitle ?? 'Save to Experiment'\"\n      :message=\"confirmMessage ?? `Save current data to ${experimentName}?`\"\n      variant=\"info\"\n      confirm-label=\"Save\"\n      :loading=\"saveLoading\"\n      @confirm=\"handleConfirmSave\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}