@morscherlab/mint-sdk 1.3.9 → 1.4.0-beta.1

package/src/components/BioTemplateExperimentWorkspaceView.vue

@@ -1,339 +0,0 @@
-<script setup lang="ts">
-/**
- * Current-experiment template workspace with load/save/reset controls and WellPlate/DataFrame/DoseCalculator previews.
- *
- * @example Recommended
- * ```vue
- * <BioTemplateExperimentWorkspaceView :target="collection" label="Assay" kind="collection" />
- * ```
- */
-import { computed } from 'vue'
-import {
-  extractTemplateCollection,
-  getBioTemplateComponentProps,
-  toBioTemplateComponentBindingsById,
-  toBioTemplateComponentProps,
-  toBioTemplateComponentPropsByComponent,
-  toBioTemplateComponentPropsById,
-  type BioTemplateEnvelope,
-  type BioTemplateComponentPropsLookupOptions,
-  type TemplateCollectionEnvelope,
-} from '../templates'
-import { bioTemplateExperimentWorkspaceProps } from '../composables/workspaceRecipes'
-import AlertBox from './AlertBox.vue'
-import BaseButton from './BaseButton.vue'
-import BioTemplateRenderer from './BioTemplateRenderer.vue'
-
-type BioTemplateWorkspaceTarget = BioTemplateEnvelope<unknown> | TemplateCollectionEnvelope
-type WorkspaceKind = 'template' | 'collection'
-
-interface TemplateWorkspaceStatus {
-  loading?: boolean
-  saving?: boolean
-  error?: string | null
-  hasExperiment?: boolean
-  currentExperimentId?: number
-  lastLoadedAt?: Date | null
-  lastSavedAt?: Date | null
-}
-
-interface TemplateWorkspaceActions {
-  load?: () => unknown
-  reset?: () => unknown
-  save?: () => unknown
-}
-
-interface Props {
-  /** Template envelope or template collection shown in BioTemplateRenderer. */
-  target: BioTemplateWorkspaceTarget
-  /** Human-readable workspace label. */
-  label: string
-  /** Grouped request and current-experiment state for generated plugin pages. */
-  status?: TemplateWorkspaceStatus
-  /** Grouped load/reset/save handlers for generated plugin pages. */
-  actions?: TemplateWorkspaceActions
-  /** Copy shown in the status banner. */
-  message?: string
-  /** Whether the load/save request is active. */
-  loading?: boolean
-  /** Current request error. */
-  error?: string | null
-  /** Whether a current experiment id is available. */
-  hasExperiment?: boolean
-  /** Current experiment id displayed in the footer. */
-  currentExperimentId?: number
-  /** Last successful load timestamp. */
-  lastLoadedAt?: Date | null
-  /** Last successful save timestamp. */
-  lastSavedAt?: Date | null
-  /** Template vs collection copy defaults. */
-  kind?: WorkspaceKind
-  /** Compact preview layout. */
-  dense?: boolean
-  /** Render preview components in read-only mode. */
-  readonly?: boolean
-  /** Show load/save timestamps. */
-  showStatus?: boolean
-  /** Show template id/version cards for collection targets. */
-  showTemplateSummary?: boolean
-  loadLabel?: string
-  resetLabel?: string
-  saveLabel?: string
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  status: undefined,
-  actions: undefined,
-  message: undefined,
-  loading: false,
-  error: null,
-  hasExperiment: false,
-  currentExperimentId: undefined,
-  lastLoadedAt: null,
-  lastSavedAt: null,
-  kind: 'template',
-  dense: true,
-  readonly: true,
-  showStatus: true,
-  showTemplateSummary: false,
-  loadLabel: 'Load',
-  resetLabel: 'Reset defaults',
-  saveLabel: 'Save',
-})
-
-const emit = defineEmits<{
-  load: []
-  reset: []
-  save: []
-}>()
-
-const statusMessage = computed(() => {
-  if (props.message) return props.message
-  if (props.kind === 'collection') {
-    return `${props.label} saves the full template collection to the current experiment.`
-  }
-  return `${props.label} template data saves to experiment design_data.`
-})
-
-// Thin recipe over bioTemplateExperimentWorkspaceProps(): merges the grouped `status` prop
-// over the individual loading/error/experiment props (see workspaceRecipes.ts).
-const resolvedStatus = computed(() => bioTemplateExperimentWorkspaceProps(props))
-const resolvedLoading = computed(() => resolvedStatus.value.loading)
-const resolvedError = computed(() => resolvedStatus.value.error)
-const resolvedHasExperiment = computed(() => resolvedStatus.value.hasExperiment)
-const resolvedCurrentExperimentId = computed(() => resolvedStatus.value.currentExperimentId)
-const resolvedLastLoadedAt = computed(() => resolvedStatus.value.lastLoadedAt)
-const resolvedLastSavedAt = computed(() => resolvedStatus.value.lastSavedAt)
-
-const templateSummaries = computed(() =>
-  Object.values(extractTemplateCollection(props.target)).map(template => ({
-    id: String(template.template_id),
-    version: String(template.template_version ?? 'unknown'),
-  }))
-)
-const componentProps = computed(() => toBioTemplateComponentProps(props.target))
-const componentBindingsById = computed(() => toBioTemplateComponentBindingsById(props.target))
-const componentPropsById = computed(() => toBioTemplateComponentPropsById(props.target))
-const componentPropsByComponent = computed(() => toBioTemplateComponentPropsByComponent(props.target))
-const renderer = computed(() => ({ target: props.target }))
-
-function getComponentProps(component: string, options?: BioTemplateComponentPropsLookupOptions) {
-  return getBioTemplateComponentProps(props.target, component, options)
-}
-
-interface BioTemplateExperimentWorkspaceBindings {
-  renderer: { target: BioTemplateWorkspaceTarget }
-  componentProps: ReturnType<typeof toBioTemplateComponentProps>
-  componentBindingsById: ReturnType<typeof toBioTemplateComponentBindingsById>
-  componentPropsById: ReturnType<typeof toBioTemplateComponentPropsById>
-  componentPropsByComponent: ReturnType<typeof toBioTemplateComponentPropsByComponent>
-  getComponentProps: typeof getComponentProps
-}
-
-const bindings = computed<BioTemplateExperimentWorkspaceBindings>(() => ({
-  renderer: renderer.value,
-  componentProps: componentProps.value,
-  componentBindingsById: componentBindingsById.value,
-  componentPropsById: componentPropsById.value,
-  componentPropsByComponent: componentPropsByComponent.value,
-  getComponentProps,
-}))
-
-interface BioTemplateExperimentWorkspaceSlotProps {
-  target: BioTemplateWorkspaceTarget
-  bindings: BioTemplateExperimentWorkspaceBindings
-  componentProps: ReturnType<typeof toBioTemplateComponentProps>
-  componentBindingsById: ReturnType<typeof toBioTemplateComponentBindingsById>
-  componentPropsById: ReturnType<typeof toBioTemplateComponentPropsById>
-  componentPropsByComponent: ReturnType<typeof toBioTemplateComponentPropsByComponent>
-  getComponentProps: typeof getComponentProps
-}
-
-defineSlots<{
-  default?: (props: BioTemplateExperimentWorkspaceSlotProps) => unknown
-}>()
-
-function handleLoad() {
-  if (props.actions?.load) {
-    return props.actions.load()
-  }
-  emit('load')
-}
-
-function handleReset() {
-  if (props.actions?.reset) {
-    return props.actions.reset()
-  }
-  emit('reset')
-}
-
-function handleSave() {
-  if (props.actions?.save) {
-    return props.actions.save()
-  }
-  emit('save')
-}
-</script>
-
-<template>
-  <div class="mint-bio-template-experiment-workspace">
-    <div class="mint-bio-template-experiment-workspace__toolbar">
-      <AlertBox type="info" class="mint-bio-template-experiment-workspace__status">
-        {{ statusMessage }}
-      </AlertBox>
-
-      <div class="mint-bio-template-experiment-workspace__actions">
-        <BaseButton
-          variant="secondary"
-          :loading="resolvedLoading"
-          :disabled="!resolvedHasExperiment"
-          @click="handleLoad"
-        >
-          {{ loadLabel }}
-        </BaseButton>
-        <BaseButton variant="secondary" :loading="resolvedLoading" @click="handleReset">
-          {{ resetLabel }}
-        </BaseButton>
-        <BaseButton
-          variant="primary"
-          :loading="resolvedLoading"
-          :disabled="!resolvedHasExperiment"
-          @click="handleSave"
-        >
-          {{ saveLabel }}
-        </BaseButton>
-      </div>
-    </div>
-
-    <AlertBox v-if="resolvedError" type="error">
-      {{ resolvedError }}
-    </AlertBox>
-
-    <p v-if="showStatus" class="mint-bio-template-experiment-workspace__meta">
-      loaded: {{ resolvedLastLoadedAt?.toLocaleString() ?? 'not loaded' }} -
-      saved: {{ resolvedLastSavedAt?.toLocaleString() ?? 'not saved' }}
-    </p>
-
-    <div
-      v-if="showTemplateSummary"
-      class="mint-bio-template-experiment-workspace__templates"
-    >
-      <div
-        v-for="template in templateSummaries"
-        :key="template.id"
-        class="mint-bio-template-experiment-workspace__template"
-      >
-        <p class="mint-bio-template-experiment-workspace__template-id">
-          {{ template.id }}
-        </p>
-        <p class="mint-bio-template-experiment-workspace__template-version">
-          v{{ template.version }}
-        </p>
-      </div>
-    </div>
-
-    <slot
-      :target="target"
-      :bindings="bindings"
-      :component-props="componentProps"
-      :component-bindings-by-id="componentBindingsById"
-      :component-props-by-id="componentPropsById"
-      :component-props-by-component="componentPropsByComponent"
-      :get-component-props="getComponentProps"
-    >
-      <BioTemplateRenderer
-        :target="target"
-        :dense="dense"
-        :readonly="readonly"
-      />
-    </slot>
-
-    <p class="mint-bio-template-experiment-workspace__meta">
-      experiment: {{ resolvedCurrentExperimentId ?? 'not selected' }}
-    </p>
-  </div>
-</template>
-
-<style scoped>
-.mint-bio-template-experiment-workspace {
-  display: flex;
-  flex-direction: column;
-  gap: 1rem;
-  min-width: 0;
-}
-
-.mint-bio-template-experiment-workspace__toolbar {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: 0.75rem;
-}
-
-.mint-bio-template-experiment-workspace__status {
-  flex: 1 1 auto;
-  min-width: 0;
-}
-
-.mint-bio-template-experiment-workspace__actions {
-  display: flex;
-  flex: 0 0 auto;
-  gap: 0.5rem;
-}
-
-.mint-bio-template-experiment-workspace__meta,
-.mint-bio-template-experiment-workspace__template-version {
-  margin: 0;
-  color: var(--text-secondary, #64748b);
-  font-family: var(--font-mono, 'Fira Code', monospace);
-  font-size: 0.75rem;
-}
-
-.mint-bio-template-experiment-workspace__templates {
-  display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr));
-  gap: 0.75rem;
-}
-
-.mint-bio-template-experiment-workspace__template {
-  min-width: 0;
-  padding: 1rem;
-  border: 1px solid var(--border-color, #e5e7eb);
-  border-radius: 0.5rem;
-  background: var(--bg-primary, #ffffff);
-}
-
-.mint-bio-template-experiment-workspace__template-id {
-  margin: 0;
-  color: var(--text-primary, #0f172a);
-  font-family: var(--font-mono, 'Fira Code', monospace);
-  font-size: 0.875rem;
-}
-
-@media (max-width: 48rem) {
-  .mint-bio-template-experiment-workspace__toolbar,
-  .mint-bio-template-experiment-workspace__actions {
-    align-items: stretch;
-    flex-direction: column;
-  }
-}
-</style>

package/src/components/BioTemplatePackWorkspaceView.story.vue

@@ -1,107 +0,0 @@
-<script setup lang="ts">
-import BioTemplatePackWorkspaceView from './BioTemplatePackWorkspaceView.vue'
-import DoseCalculator from './DoseCalculator.vue'
-import WellPlate from './WellPlate.vue'
-
-function initState() {
-  return {
-    pack: 'cell-culture-screen',
-    hasCustomLayout: false,
-    showTemplateSummary: true,
-    dense: true,
-  }
-}
-</script>
-
-<template>
-  <Story title="Templates/BioTemplatePackWorkspaceView" :init-state="initState">
-    <Variant title="Playground">
-      <template #default="{ state }">
-        <div style="padding: 2rem; min-height: 720px; background: var(--bg-primary, #f8fafc);">
-          <BioTemplatePackWorkspaceView
-            v-if="state.hasCustomLayout"
-            :pack="state.pack"
-            :show-template-summary="state.showTemplateSummary"
-            :dense="state.dense"
-            v-slot="{ bindings }"
-          >
-            <div class="pack-component-layout">
-              <div class="pack-component-panel pack-component-panel--plate">
-                <WellPlate
-                  v-if="bindings.componentBindingsById['plate-map:WellPlate']"
-                  v-bind="bindings.componentBindingsById['plate-map:WellPlate'].props"
-                  size="sm"
-                  readonly
-                />
-              </div>
-              <div class="pack-component-panel pack-component-panel--dose">
-                <DoseCalculator
-                  v-if="bindings.componentBindingsById['dose-response:DoseCalculator']"
-                  v-bind="bindings.componentBindingsById['dose-response:DoseCalculator'].props"
-                />
-              </div>
-            </div>
-          </BioTemplatePackWorkspaceView>
-          <BioTemplatePackWorkspaceView
-            v-else
-            :pack="state.pack"
-            :show-template-summary="state.showTemplateSummary"
-            :dense="state.dense"
-          />
-        </div>
-      </template>
-
-      <template #controls="{ state }">
-        <HstSelect
-          v-model="state.pack"
-          title="Pack"
-          :options="[
-            { label: 'Cell culture screen', value: 'cell-culture-screen' },
-            { label: 'Omics assay', value: 'omics-assay' },
-            { label: 'Longitudinal study', value: 'longitudinal-study' },
-            { label: 'Molecular assay', value: 'molecular-assay' },
-          ]"
-        />
-        <HstCheckbox v-model="state.hasCustomLayout" title="Custom component layout" />
-        <HstCheckbox v-model="state.showTemplateSummary" title="Template summary" />
-        <HstCheckbox v-model="state.dense" title="Dense" />
-      </template>
-    </Variant>
-  </Story>
-</template>
-
-<style scoped>
-.pack-component-layout {
-  display: grid;
-  grid-template-columns: minmax(0, 1.35fr) minmax(18rem, 0.65fr);
-  gap: 1rem;
-  align-items: start;
-  min-width: 0;
-}
-
-.pack-component-panel {
-  min-width: 0;
-  padding: 1rem;
-  border: 1px solid var(--border-color);
-  border-radius: var(--radius-lg, 0.75rem);
-  background: var(--bg-primary);
-}
-
-.pack-component-panel--plate {
-  overflow-x: auto;
-}
-
-.pack-component-panel--dose {
-  max-width: 24rem;
-}
-
-@media (max-width: 960px) {
-  .pack-component-layout {
-    grid-template-columns: 1fr;
-  }
-
-  .pack-component-panel--dose {
-    max-width: none;
-  }
-}
-</style>

package/src/components/BioTemplatePackWorkspaceView.vue

@@ -1,180 +0,0 @@
-<script setup lang="ts">
-/**
- * Complete current-experiment workspace for a curated biology template pack with save/load controls and component-prop slots.
- *
- * @example Recommended
- * ```vue
- * <BioTemplatePackWorkspaceView pack="cell-culture-screen" />
- * ```
- */
-import { computed, effectScope, onScopeDispose, shallowRef, unref, useSlots, watch, type EffectScope } from 'vue'
-import type { BioTemplateEnvelope, TemplateCollectionEnvelope, TemplatePackId } from '../templates'
-import type {
-  UseBioTemplatePackWorkspaceOptions,
-  UseBioTemplatePackWorkspaceReturn,
-} from '../composables/useBioTemplatePackWorkspace'
-import { useBioTemplatePackWorkspace } from '../composables/useBioTemplatePackWorkspace'
-import { bioTemplatePackWorkspaceProps } from '../composables/workspaceRecipes'
-import BioTemplateExperimentWorkspaceView from './BioTemplateExperimentWorkspaceView.vue'
-
-interface BioTemplatePackWorkspaceSlotProps {
-  workspace: UseBioTemplatePackWorkspaceReturn
-  bindings: UseBioTemplatePackWorkspaceReturn['bindings']['value']
-  pack: UseBioTemplatePackWorkspaceReturn['pack']
-  target: BioTemplateEnvelope<unknown> | TemplateCollectionEnvelope
-  componentBindingsById: UseBioTemplatePackWorkspaceReturn['componentBindingsById']['value']
-  componentProps: UseBioTemplatePackWorkspaceReturn['componentProps']['value']
-  componentPropsById: UseBioTemplatePackWorkspaceReturn['componentPropsById']['value']
-  componentPropsByComponent: UseBioTemplatePackWorkspaceReturn['componentPropsByComponent']['value']
-  getComponentProps: UseBioTemplatePackWorkspaceReturn['getComponentProps']
-  form: UseBioTemplatePackWorkspaceReturn['form']['value']
-  sidebar: UseBioTemplatePackWorkspaceReturn['sidebar']['value']
-  topBar: UseBioTemplatePackWorkspaceReturn['topBar']['value']
-  pillNav: UseBioTemplatePackWorkspaceReturn['pillNav']['value']
-  topBarSettings: UseBioTemplatePackWorkspaceReturn['topBarSettings']['value']
-}
-
-interface PackWorkspaceStatus {
-  loading?: boolean
-  saving?: boolean
-  error?: string | null
-  hasExperiment?: boolean
-  currentExperimentId?: number
-  lastLoadedAt?: Date | null
-  lastSavedAt?: Date | null
-}
-
-interface PackWorkspaceActions {
-  load?: () => unknown
-  reset?: () => unknown
-  save?: () => unknown
-}
-
-interface Props {
-  /** Workspace returned by useBioTemplatePackWorkspace(). Use for full manual control. */
-  workspace?: UseBioTemplatePackWorkspaceReturn
-  /** Built-in template pack id or alias used when workspace is not provided. */
-  pack?: TemplatePackId | string
-  /** Options passed to the internally generated useBioTemplatePackWorkspace() call. */
-  workspaceOptions?: UseBioTemplatePackWorkspaceOptions
-  /** External request state when plugin endpoints handle pack persistence. */
-  status?: PackWorkspaceStatus
-  /** External load/reset/save handlers when plugin endpoints handle pack persistence. */
-  actions?: PackWorkspaceActions
-  /** Human-readable workspace label. Defaults to the pack catalog label. */
-  label?: string
-  /** Copy shown in the status banner. */
-  message?: string
-  /** Compact preview layout. */
-  dense?: boolean
-  /** Render preview components in read-only mode. */
-  readonly?: boolean
-  /** Show load/save timestamps. */
-  showStatus?: boolean
-  /** Show template id/version cards for the generated collection. */
-  showTemplateSummary?: boolean
-  loadLabel?: string
-  resetLabel?: string
-  saveLabel?: string
-}
-
-const props = withDefaults(defineProps<Props>(), {
-  workspace: undefined,
-  pack: 'cell-culture-screen',
-  workspaceOptions: () => ({}),
-  status: undefined,
-  actions: undefined,
-  label: undefined,
-  message: undefined,
-  dense: true,
-  readonly: true,
-  showStatus: true,
-  showTemplateSummary: true,
-  loadLabel: 'Load',
-  resetLabel: 'Reset defaults',
-  saveLabel: 'Save',
-})
-
-defineSlots<{
-  default?: (props: BioTemplatePackWorkspaceSlotProps) => unknown
-}>()
-
-const slots = useSlots()
-const hasDefaultSlot = computed(() => Boolean(slots.default))
-
-let generatedWorkspaceScope: EffectScope | undefined
-
-function createGeneratedWorkspace(): UseBioTemplatePackWorkspaceReturn {
-  generatedWorkspaceScope?.stop()
-  generatedWorkspaceScope = effectScope()
-  return generatedWorkspaceScope.run(() => useBioTemplatePackWorkspace(props.pack, props.workspaceOptions))!
-}
-
-const generatedWorkspace = shallowRef<UseBioTemplatePackWorkspaceReturn>(createGeneratedWorkspace())
-const resolvedWorkspace = computed(() => props.workspace ?? generatedWorkspace.value)
-const target = computed(() => unref(resolvedWorkspace.value.collection))
-const label = computed(() => props.label ?? resolvedWorkspace.value.pack.label)
-const form = computed(() => unref(resolvedWorkspace.value.form))
-const sidebar = computed(() => unref(resolvedWorkspace.value.sidebar))
-const topBar = computed(() => unref(resolvedWorkspace.value.topBar))
-const pillNav = computed(() => unref(resolvedWorkspace.value.pillNav))
-const topBarSettings = computed(() => unref(resolvedWorkspace.value.topBarSettings))
-const bindings = computed(() => unref(resolvedWorkspace.value.bindings))
-const resolvedStatus = computed<PackWorkspaceStatus>(() => ({
-  loading: props.status?.loading ?? unref(resolvedWorkspace.value.loading),
-  saving: props.status?.saving ?? unref(resolvedWorkspace.value.saving),
-  error: props.status?.error !== undefined
-    ? props.status.error
-    : unref(resolvedWorkspace.value.error),
-  hasExperiment: props.status?.hasExperiment ?? unref(resolvedWorkspace.value.hasCurrentExperiment),
-  currentExperimentId: props.status?.currentExperimentId ?? unref(resolvedWorkspace.value.currentExperimentId),
-  lastLoadedAt: props.status?.lastLoadedAt !== undefined
-    ? props.status.lastLoadedAt
-    : unref(resolvedWorkspace.value.lastLoadedAt),
-  lastSavedAt: props.status?.lastSavedAt !== undefined
-    ? props.status.lastSavedAt
-    : unref(resolvedWorkspace.value.lastSavedAt),
-}))
-const resolvedActions = computed<PackWorkspaceActions>(() => ({
-  load: props.actions?.load ?? (() => resolvedWorkspace.value.loadCurrent()),
-  reset: props.actions?.reset ?? (() => resolvedWorkspace.value.resetToDefaultCollection()),
-  save: props.actions?.save ?? (() => resolvedWorkspace.value.saveCurrent()),
-}))
-
-// Thin recipe over bioTemplatePackWorkspaceProps(): forwards this view's own display props
-// plus the pack-derived target/label/status/actions to BioTemplateExperimentWorkspaceView.
-const experimentWorkspaceRecipe = computed(() => bioTemplatePackWorkspaceProps(props, {
-  target: target.value,
-  label: label.value,
-  status: resolvedStatus.value,
-  actions: resolvedActions.value,
-}))
-
-watch(
-  [() => props.pack, () => props.workspaceOptions],
-  () => {
-    generatedWorkspace.value = createGeneratedWorkspace()
-  },
-  { deep: true },
-)
-
-onScopeDispose(() => generatedWorkspaceScope?.stop())
-</script>
-
-<template>
-  <BioTemplateExperimentWorkspaceView v-bind="experimentWorkspaceRecipe">
-    <template v-if="hasDefaultSlot" #default="slotProps">
-      <slot
-        v-bind="slotProps"
-        :workspace="resolvedWorkspace"
-        :bindings="bindings"
-        :pack="resolvedWorkspace.pack"
-        :form="form"
-        :sidebar="sidebar"
-        :top-bar="topBar"
-        :pill-nav="pillNav"
-        :top-bar-settings="topBarSettings"
-      />
-    </template>
-  </BioTemplateExperimentWorkspaceView>
-</template>