@morscherlab/mint-sdk 1.0.0-beta.2 → 1.0.0-beta.4

package/src/composables/useBioTemplateComponents.ts

@@ -0,0 +1,105 @@
+import {
+  getBioTemplateComponentBindings,
+  getBioTemplateComponentProps as getTemplateComponentProps,
+  toBioTemplateComponentImports,
+  toBioTemplateComponentBindings,
+  toBioTemplateComponentBindingsById,
+  toBioTemplateComponentProps,
+  toBioTemplateComponentPropsByComponent as toTemplateComponentPropsByComponent,
+  toBioTemplateComponentPropsById,
+  toBioTemplateComponentSnippets,
+  toBioTemplateComponentUsage,
+  type BioTemplateComponentBinding,
+  type BioTemplateComponentBindingsById,
+  type BioTemplateComponentImport,
+  type BioTemplateComponentPropsByComponent,
+  type BioTemplateComponentPropsBinding,
+  type BioTemplateComponentPropsById,
+  type BioTemplateComponentPropsLookupOptions,
+  type BioTemplateResolvedComponentBinding,
+  type BioTemplateComponentSnippet,
+  type BioTemplateComponentTarget,
+  type BioTemplateComponentUsage,
+} from '../templates/componentBindings'
+import type {
+  BioTemplateEnvelope,
+  TemplateCollectionEnvelope,
+} from '../templates/types'
+
+export {
+  getBioTemplateComponentBindings,
+  toBioTemplateComponentBindings,
+  toBioTemplateComponentBindingsById,
+  toBioTemplateComponentImports,
+  toBioTemplateComponentProps,
+  toBioTemplateComponentPropsById,
+  toBioTemplateComponentSnippets,
+  toBioTemplateComponentUsage,
+}
+
+export type {
+  BioTemplateComponentBinding,
+  BioTemplateComponentBindingsById,
+  BioTemplateComponentImport,
+  BioTemplateComponentPropsByComponent,
+  BioTemplateComponentPropsBinding,
+  BioTemplateComponentPropsById,
+  BioTemplateComponentPropsLookupOptions,
+  BioTemplateResolvedComponentBinding,
+  BioTemplateComponentSnippet,
+  BioTemplateComponentTarget,
+  BioTemplateComponentUsage,
+}
+
+export interface UseBioTemplateComponentsReturn {
+  bindings: BioTemplateComponentBinding[]
+  imports: BioTemplateComponentImport[]
+  componentBindings: BioTemplateResolvedComponentBinding[]
+  componentBindingsById: BioTemplateComponentBindingsById
+  componentProps: BioTemplateComponentPropsBinding[]
+  componentPropsById: BioTemplateComponentPropsById
+  componentPropsByComponent: BioTemplateComponentPropsByComponent
+  snippets: BioTemplateComponentSnippet[]
+  usage: BioTemplateComponentUsage | null
+  getComponentProps: (
+    component: string,
+    options?: BioTemplateComponentPropsLookupOptions,
+  ) => Record<string, unknown> | undefined
+}
+
+/** Return component props grouped by SDK component name for direct WellPlate/DoseCalculator binding. */
+export function toBioTemplateComponentPropsByComponent(
+  target: BioTemplateEnvelope<unknown> | TemplateCollectionEnvelope,
+): BioTemplateComponentPropsByComponent {
+  return toTemplateComponentPropsByComponent(target)
+}
+
+/** Return the first props object for an SDK component, optionally restricted by template id or binding id. */
+export function getBioTemplateComponentProps(
+  target: BioTemplateEnvelope<unknown> | TemplateCollectionEnvelope,
+  component: string,
+  options: BioTemplateComponentPropsLookupOptions = {},
+): Record<string, unknown> | undefined {
+  return getTemplateComponentProps(target, component, options)
+}
+
+/** Map built-in biology templates to SDK components such as WellPlate, DataFrame, DoseCalculator, and PlateMapEditor. */
+export function useBioTemplateComponents(
+  target: BioTemplateComponentTarget
+): UseBioTemplateComponentsReturn {
+  return {
+    bindings: getBioTemplateComponentBindings(target),
+    imports: toBioTemplateComponentImports(target),
+    componentBindings: typeof target === 'string' ? [] : toBioTemplateComponentBindings(target),
+    componentBindingsById: typeof target === 'string' ? {} : toBioTemplateComponentBindingsById(target),
+    componentProps: typeof target === 'string' ? [] : toBioTemplateComponentProps(target),
+    componentPropsById: typeof target === 'string' ? {} : toBioTemplateComponentPropsById(target),
+    componentPropsByComponent: typeof target === 'string' ? {} : toBioTemplateComponentPropsByComponent(target),
+    snippets: typeof target === 'string' ? [] : toBioTemplateComponentSnippets(target),
+    usage: typeof target === 'string' ? null : toBioTemplateComponentUsage(target),
+    getComponentProps: (component, options) =>
+      typeof target === 'string'
+        ? undefined
+        : getBioTemplateComponentProps(target, component, options),
+  }
+}

package/src/composables/useBioTemplateControls.ts

@@ -0,0 +1,41 @@
+import {
+  createBioTemplateControlToolkit,
+  getBioTemplateControlSchema,
+  requireBioTemplateControlSchema,
+  type BioTemplateControlSchema,
+  type BioTemplateControlTarget,
+} from '../templates/controlSchemas'
+import type {
+  ControlSchemaOptions,
+  ControlWorkspaceOptions,
+  UseControlSchemaReturn,
+} from './useControlSchema'
+
+export {
+  getBioTemplateControlSchema,
+  requireBioTemplateControlSchema,
+}
+
+export type {
+  BioTemplateControlSchema,
+  BioTemplateControlTarget,
+}
+
+/** Build FormBuilder schema, AppSidebar panels, and defaults for a built-in biology template or preset. */
+export function useBioTemplateControls(
+  target: BioTemplateControlTarget,
+  options: ControlWorkspaceOptions = {},
+): UseControlSchemaReturn<BioTemplateControlSchema> {
+  const { initialValues, topBarSettings: _topBarSettings, ...schemaOptions } = options
+  const controls = createBioTemplateControlToolkit(target, schemaOptions as ControlSchemaOptions)
+
+  if (initialValues === undefined) return controls
+
+  return {
+    ...controls,
+    initialValues: {
+      ...controls.initialValues,
+      ...initialValues,
+    },
+  }
+}

package/src/composables/useBioTemplatePackWorkspace.ts

@@ -0,0 +1,185 @@
+import {
+  computed,
+  effectScope,
+  getCurrentScope,
+  onScopeDispose,
+  shallowRef,
+  watch,
+  type ComputedRef,
+  type EffectScope,
+  type Ref,
+} from 'vue'
+import {
+  createBioTemplatePackCollection,
+  getBioTemplatePackInfo,
+  type BioTemplatePackEntry,
+  type TemplateCollectionEnvelope,
+  type TemplatePackId,
+} from '../templates'
+import {
+  useTemplateCollection,
+  type UseTemplateCollectionOptions,
+  type UseTemplateCollectionReturn,
+} from './useTemplateCollection'
+import {
+  useBioTemplateWorkspace,
+  type BioTemplateRendererBinding,
+  type BioTemplateWorkspaceBindings,
+  type UseBioTemplateWorkspaceReturn,
+} from './useBioTemplateWorkspace'
+import type {
+  BioTemplateComponentBinding,
+  BioTemplateComponentBindingsById,
+  BioTemplateComponentImport,
+  BioTemplateComponentPropsByComponent,
+  BioTemplateComponentPropsBinding,
+  BioTemplateComponentPropsById,
+  BioTemplateComponentSnippet,
+  BioTemplateComponentUsage,
+} from './useBioTemplateComponents'
+
+export type UseBioTemplatePackWorkspaceOptions = UseTemplateCollectionOptions
+
+export interface UseBioTemplatePackWorkspaceReturn {
+  packId: TemplatePackId
+  pack: BioTemplatePackEntry
+  collection: Ref<TemplateCollectionEnvelope>
+  templates: UseTemplateCollectionReturn['templates']
+  templateIds: UseTemplateCollectionReturn['templateIds']
+  currentExperimentId: UseTemplateCollectionReturn['currentExperimentId']
+  hasCurrentExperiment: UseTemplateCollectionReturn['hasCurrentExperiment']
+  loading: UseTemplateCollectionReturn['isLoading']
+  saving: UseTemplateCollectionReturn['isSaving']
+  error: UseTemplateCollectionReturn['error']
+  lastLoadedAt: UseTemplateCollectionReturn['lastLoadedAt']
+  lastSavedAt: UseTemplateCollectionReturn['lastSavedAt']
+  renderer: ComputedRef<BioTemplateRendererBinding>
+  workspace: ComputedRef<UseBioTemplateWorkspaceReturn>
+  form: ComputedRef<UseBioTemplateWorkspaceReturn['form']>
+  sidebar: ComputedRef<UseBioTemplateWorkspaceReturn['sidebar']>
+  topBar: ComputedRef<UseBioTemplateWorkspaceReturn['topBar']['value']>
+  pillNav: ComputedRef<UseBioTemplateWorkspaceReturn['pillNav']>
+  topBarSettings: ComputedRef<UseBioTemplateWorkspaceReturn['topBarSettings']>
+  bindings: ComputedRef<BioTemplateWorkspaceBindings>
+  componentBindings: ComputedRef<BioTemplateComponentBinding[]>
+  componentBindingsById: ComputedRef<BioTemplateComponentBindingsById>
+  componentImports: ComputedRef<BioTemplateComponentImport[]>
+  componentProps: ComputedRef<BioTemplateComponentPropsBinding[]>
+  componentPropsById: ComputedRef<BioTemplateComponentPropsById>
+  componentPropsByComponent: ComputedRef<BioTemplateComponentPropsByComponent>
+  componentSnippets: ComputedRef<BioTemplateComponentSnippet[]>
+  componentUsage: ComputedRef<BioTemplateComponentUsage | null>
+  getComponentProps: UseBioTemplateWorkspaceReturn['getComponentProps']
+  applyCollection: (value: unknown, metadata?: Record<string, unknown>) => TemplateCollectionEnvelope
+  resetToDefaultCollection: () => TemplateCollectionEnvelope
+  save: UseTemplateCollectionReturn['save']
+  saveCurrent: UseTemplateCollectionReturn['saveCurrent']
+  load: UseTemplateCollectionReturn['load']
+  loadCurrent: UseTemplateCollectionReturn['loadCurrent']
+  requireCurrentExperimentId: UseTemplateCollectionReturn['requireCurrentExperimentId']
+}
+
+/** Create a complete workspace for a curated biology template pack from a single pack id. */
+export function useBioTemplatePackWorkspace(
+  packId: TemplatePackId | string,
+  options: UseBioTemplatePackWorkspaceOptions = {},
+): UseBioTemplatePackWorkspaceReturn {
+  const pack = getBioTemplatePackInfo(packId)
+  if (!pack) {
+    throw new Error(`Unknown template pack '${packId}'.`)
+  }
+  const resolvedPack = pack
+
+  const templateCollection = useTemplateCollection({
+    ...options,
+    initial: createDefaultCollection,
+  })
+  const collection = templateCollection.templateCollection
+  let workspaceScope: EffectScope | undefined
+
+  function createWorkspace(value: TemplateCollectionEnvelope): UseBioTemplateWorkspaceReturn {
+    workspaceScope?.stop()
+    workspaceScope = effectScope()
+    return workspaceScope.run(() => useBioTemplateWorkspace(value))!
+  }
+
+  const workspaceRef = shallowRef<UseBioTemplateWorkspaceReturn>(createWorkspace(collection.value))
+  const workspace = computed(() => workspaceRef.value)
+  const renderer = computed<BioTemplateRendererBinding>(() => ({ target: collection.value }))
+  const form = computed(() => workspace.value.form)
+  const sidebar = computed(() => workspace.value.sidebar)
+  const topBar = computed(() => workspace.value.topBar.value)
+  const pillNav = computed(() => workspace.value.pillNav)
+  const topBarSettings = computed(() => workspace.value.topBarSettings)
+  const bindings = computed(() => workspace.value.bindings)
+  const componentBindings = computed(() => workspace.value.componentBindings)
+  const componentBindingsById = computed(() => workspace.value.componentBindingsById)
+  const componentImports = computed(() => workspace.value.componentImports)
+  const componentProps = computed(() => workspace.value.componentProps)
+  const componentPropsById = computed(() => workspace.value.componentPropsById)
+  const componentPropsByComponent = computed(() => workspace.value.componentPropsByComponent)
+  const componentSnippets = computed(() => workspace.value.componentSnippets)
+  const componentUsage = computed(() => workspace.value.componentUsage)
+
+  watch(collection, value => {
+    workspaceRef.value = createWorkspace(value)
+  })
+
+  if (getCurrentScope()) {
+    onScopeDispose(() => workspaceScope?.stop())
+  }
+
+  function createDefaultCollection(): TemplateCollectionEnvelope {
+    return createBioTemplatePackCollection(resolvedPack.name)
+  }
+
+  function applyCollection(
+    value: unknown,
+    metadata?: Record<string, unknown>,
+  ): TemplateCollectionEnvelope {
+    return templateCollection.apply(value, metadata)
+  }
+
+  function resetToDefaultCollection(): TemplateCollectionEnvelope {
+    return templateCollection.apply(createDefaultCollection())
+  }
+
+  return {
+    packId: resolvedPack.name,
+    pack: resolvedPack,
+    collection,
+    templates: templateCollection.templates,
+    templateIds: templateCollection.templateIds,
+    currentExperimentId: templateCollection.currentExperimentId,
+    hasCurrentExperiment: templateCollection.hasCurrentExperiment,
+    loading: templateCollection.isLoading,
+    saving: templateCollection.isSaving,
+    error: templateCollection.error,
+    lastLoadedAt: templateCollection.lastLoadedAt,
+    lastSavedAt: templateCollection.lastSavedAt,
+    renderer,
+    workspace,
+    form,
+    sidebar,
+    topBar,
+    pillNav,
+    topBarSettings,
+    bindings,
+    componentBindings,
+    componentBindingsById,
+    componentImports,
+    componentProps,
+    componentPropsById,
+    componentPropsByComponent,
+    componentSnippets,
+    componentUsage,
+    getComponentProps: (component, options) => workspace.value.getComponentProps(component, options),
+    applyCollection,
+    resetToDefaultCollection,
+    save: templateCollection.save,
+    saveCurrent: templateCollection.saveCurrent,
+    load: templateCollection.load,
+    loadCurrent: templateCollection.loadCurrent,
+    requireCurrentExperimentId: templateCollection.requireCurrentExperimentId,
+  }
+}

package/src/composables/useBioTemplatePresetWorkspace.ts

@@ -0,0 +1,326 @@
+import {
+  computed,
+  reactive,
+  ref,
+  watch,
+  type ComputedRef,
+  type Ref,
+} from 'vue'
+import type { PillNavItem } from '../types'
+import {
+  createBioTemplatePresetCollectionFromControls,
+  getBioTemplatePresetInfo,
+  type BioTemplateControlValues,
+  type BioTemplatePresetEntry,
+  type TemplateCollectionEnvelope,
+  type TemplatePresetId,
+} from '../templates'
+import type {
+  ControlWorkspaceOptions,
+  ControlWorkspaceFormBinding,
+  ControlWorkspacePillNavBinding,
+  ControlWorkspaceSidebarBinding,
+  ControlWorkspaceTopBarBinding,
+  ControlWorkspaceTopBarSettingsBinding,
+  UseControlSchemaReturn,
+} from './useControlSchema'
+import {
+  useTemplateCollection,
+  type UseTemplateCollectionOptions,
+  type UseTemplateCollectionReturn,
+} from './useTemplateCollection'
+import {
+  useBioTemplateWorkspace,
+  type BioTemplateRendererBinding,
+  type UseBioTemplateWorkspaceReturn,
+} from './useBioTemplateWorkspace'
+import type {
+  BioTemplateComponentBinding,
+  BioTemplateComponentBindingsById,
+  BioTemplateComponentImport,
+  BioTemplateComponentPropsByComponent,
+  BioTemplateComponentPropsBinding,
+  BioTemplateComponentPropsById,
+  BioTemplateComponentSnippet,
+  BioTemplateComponentUsage,
+} from './useBioTemplateComponents'
+import type {
+  BioTemplateControlSchema,
+} from './useBioTemplateControls'
+
+export interface UseBioTemplatePresetWorkspaceOptions extends UseTemplateCollectionOptions {
+  /** Optional schema-rendering options for the generated FormBuilder/AppSidebar controls. */
+  controlOptions?: ControlWorkspaceOptions
+  /** Initial control values for the generated preset. Merged over controlOptions.initialValues. */
+  initialValues?: BioTemplateControlValues
+}
+
+export interface UseBioTemplatePresetWorkspaceReturn {
+  presetId: TemplatePresetId
+  presetInfo: ComputedRef<BioTemplatePresetEntry | undefined>
+  presetLabel: ComputedRef<string>
+  collection: Ref<TemplateCollectionEnvelope>
+  templates: UseTemplateCollectionReturn['templates']
+  templateIds: UseTemplateCollectionReturn['templateIds']
+  currentExperimentId: UseTemplateCollectionReturn['currentExperimentId']
+  hasCurrentExperiment: UseTemplateCollectionReturn['hasCurrentExperiment']
+  saving: UseTemplateCollectionReturn['isSaving']
+  error: UseTemplateCollectionReturn['error']
+  lastSavedAt: UseTemplateCollectionReturn['lastSavedAt']
+  controls: UseControlSchemaReturn<BioTemplateControlSchema>
+  controlSchema: BioTemplateControlSchema
+  controlValues: Ref<BioTemplateControlValues>
+  controlViewIds: ComputedRef<string[]>
+  controlViewItems: ComputedRef<PillNavItem[]>
+  activeControlView: Ref<string>
+  form: ControlWorkspaceFormBinding
+  sidebar: ControlWorkspaceSidebarBinding
+  topBar: ComputedRef<ControlWorkspaceTopBarBinding>
+  pillNav: ControlWorkspacePillNavBinding
+  topBarSettings: ControlWorkspaceTopBarSettingsBinding
+  bindings: BioTemplatePresetWorkspaceBindings
+  renderer: ComputedRef<BioTemplateRendererBinding>
+  workspace: ComputedRef<UseBioTemplateWorkspaceReturn>
+  componentBindings: ComputedRef<BioTemplateComponentBinding[]>
+  componentBindingsById: ComputedRef<BioTemplateComponentBindingsById>
+  componentImports: ComputedRef<BioTemplateComponentImport[]>
+  componentProps: ComputedRef<BioTemplateComponentPropsBinding[]>
+  componentPropsById: ComputedRef<BioTemplateComponentPropsById>
+  componentPropsByComponent: ComputedRef<BioTemplateComponentPropsByComponent>
+  componentSnippets: ComputedRef<BioTemplateComponentSnippet[]>
+  componentUsage: ComputedRef<BioTemplateComponentUsage | null>
+  getComponentProps: UseBioTemplateWorkspaceReturn['getComponentProps']
+  setActiveControlView: (viewId: string) => void
+  setControlValues: (values: BioTemplateControlValues) => TemplateCollectionEnvelope
+  updateControlValues: (values: Partial<BioTemplateControlValues>) => TemplateCollectionEnvelope
+  applyCollection: (value: TemplateCollectionEnvelope) => TemplateCollectionEnvelope
+  resetToDefaultCollection: () => TemplateCollectionEnvelope
+  save: UseTemplateCollectionReturn['save']
+  saveCurrent: UseTemplateCollectionReturn['saveCurrent']
+}
+
+export interface BioTemplatePresetWorkspaceBindings {
+  renderer: ComputedRef<BioTemplateRendererBinding>
+  form: ControlWorkspaceFormBinding
+  sidebar: ControlWorkspaceSidebarBinding
+  topBar: ComputedRef<ControlWorkspaceTopBarBinding>
+  topBarSettings: ControlWorkspaceTopBarSettingsBinding
+  pillNav: ControlWorkspacePillNavBinding
+  componentBindings: ComputedRef<BioTemplateComponentBinding[]>
+  componentBindingsById: ComputedRef<BioTemplateComponentBindingsById>
+  componentProps: ComputedRef<BioTemplateComponentPropsBinding[]>
+  componentPropsById: ComputedRef<BioTemplateComponentPropsById>
+  componentPropsByComponent: ComputedRef<BioTemplateComponentPropsByComponent>
+  componentSnippets: ComputedRef<BioTemplateComponentSnippet[]>
+  componentUsage: ComputedRef<BioTemplateComponentUsage | null>
+  getComponentProps: UseBioTemplateWorkspaceReturn['getComponentProps']
+}
+
+/** Create a complete editable WellPlate/DoseCalculator workspace for dose design from a built-in biology template preset with current-experiment save wiring. */
+export function useBioTemplatePresetWorkspace(
+  presetId: TemplatePresetId,
+  options: UseBioTemplatePresetWorkspaceOptions = {},
+): UseBioTemplatePresetWorkspaceReturn {
+  const { controlOptions, initialValues, ...collectionOptions } = options
+  const resolvedControlOptions = mergeInitialValues(controlOptions, initialValues)
+  const presetWorkspace = useBioTemplateWorkspace(presetId, resolvedControlOptions)
+  const presetInfo = computed(() => getBioTemplatePresetInfo(presetId))
+  const presetLabel = computed(() => presetInfo.value?.label ?? humanizePresetId(presetId))
+  const controls = presetWorkspace.controls
+  const controlValues = ref<BioTemplateControlValues>({ ...controls.initialValues })
+  const controlViewIds = computed(() => controls.viewIds)
+  const controlViewItems = computed(() => controls.viewItems)
+  const activeControlView = ref(controls.defaultView)
+  const templateCollection = useTemplateCollection({
+    ...collectionOptions,
+    initial: createDefaultCollection,
+  })
+  const collection = templateCollection.templateCollection
+  const workspace = computed(() => useBioTemplateWorkspace(collection.value, resolvedControlOptions))
+  const renderer = computed<BioTemplateRendererBinding>(() => ({ target: collection.value }))
+  const componentBindings = computed(() => workspace.value.componentBindings)
+  const componentBindingsById = computed(() => workspace.value.componentBindingsById)
+  const componentImports = computed(() => workspace.value.componentImports)
+  const componentProps = computed(() => workspace.value.componentProps)
+  const componentPropsById = computed(() => workspace.value.componentPropsById)
+  const componentPropsByComponent = computed(() => workspace.value.componentPropsByComponent)
+  const componentSnippets = computed(() => workspace.value.componentSnippets)
+  const componentUsage = computed(() => workspace.value.componentUsage)
+  const form = reactive({
+    ...controls.form,
+    modelValue: controlValues.value,
+    'onUpdate:modelValue': setControlValues,
+  }) as ControlWorkspaceFormBinding
+  const sidebar = reactive({
+    ...controls.sidebar,
+    activeView: activeControlView.value,
+    modelValue: controlValues.value,
+    'onUpdate:modelValue': setControlValues,
+    values: controlValues.value,
+    'onUpdate:values': setControlValues,
+  }) as ControlWorkspaceSidebarBinding
+  const pillNav = reactive({
+    items: controls.viewItems,
+    currentItemId: activeControlView.value,
+    onSelect: (item: { id: string }) => setActiveControlView(item.id),
+  }) as ControlWorkspacePillNavBinding
+  const topBarSettings = reactive({
+    showSettings: true,
+    settingsConfig: {
+      ...controls.topBarSettingsConfig,
+      values: controlValues.value,
+    },
+    onSettingsValuesChange: setControlValues,
+  }) as ControlWorkspaceTopBarSettingsBinding
+  const topBarProps = computed<ControlWorkspaceTopBarBinding>(() => ({
+    pillNav: pillNav.items,
+    currentPillId: pillNav.currentItemId,
+    onPillSelect: pillNav.onSelect,
+    ...topBarSettings,
+  }))
+
+  function getComponentProps(
+    component: string,
+    options?: Parameters<UseBioTemplateWorkspaceReturn['getComponentProps']>[1],
+  ) {
+    return workspace.value.getComponentProps(component, options)
+  }
+
+  const bindings: BioTemplatePresetWorkspaceBindings = {
+    renderer,
+    form,
+    sidebar,
+    topBar: topBarProps,
+    topBarSettings,
+    pillNav,
+    componentBindings,
+    componentBindingsById,
+    componentProps,
+    componentPropsById,
+    componentPropsByComponent,
+    componentSnippets,
+    componentUsage,
+    getComponentProps,
+  }
+
+  function createDefaultCollection(): TemplateCollectionEnvelope {
+    return createBioTemplatePresetCollectionFromControls(presetId, controls.initialValues)
+  }
+
+  watch(
+    controlValues,
+    (values) => {
+      syncControlValueBindings(values)
+      templateCollection.apply(createBioTemplatePresetCollectionFromControls(presetId, values))
+    },
+    { deep: true },
+  )
+
+  watch(activeControlView, (viewId) => {
+    sidebar.activeView = viewId
+    pillNav.currentItemId = viewId
+  }, { flush: 'sync' })
+  watch(() => sidebar.activeView, setActiveControlView, { flush: 'sync' })
+  watch(() => pillNav.currentItemId, setActiveControlView, { flush: 'sync' })
+
+  function applyCollection(value: TemplateCollectionEnvelope): TemplateCollectionEnvelope {
+    return templateCollection.apply(value)
+  }
+
+  function setActiveControlView(viewId: string): void {
+    if (!controlViewIds.value.includes(viewId)) return
+    activeControlView.value = viewId
+  }
+
+  function setControlValues(values: BioTemplateControlValues): TemplateCollectionEnvelope {
+    const nextValues = { ...values }
+    controlValues.value = nextValues
+    syncControlValueBindings(nextValues)
+    return templateCollection.apply(createBioTemplatePresetCollectionFromControls(presetId, nextValues))
+  }
+
+  function updateControlValues(values: Partial<BioTemplateControlValues>): TemplateCollectionEnvelope {
+    return setControlValues({
+      ...controlValues.value,
+      ...values,
+    })
+  }
+
+  function resetToDefaultCollection(): TemplateCollectionEnvelope {
+    return setControlValues({ ...controls.initialValues })
+  }
+
+  function syncControlValueBindings(values: BioTemplateControlValues): void {
+    form.modelValue = values
+    sidebar.modelValue = values
+    sidebar.values = values
+    topBarSettings.settingsConfig = {
+      ...topBarSettings.settingsConfig,
+      values,
+    }
+  }
+
+  return {
+    presetId,
+    presetInfo,
+    presetLabel,
+    collection,
+    templates: templateCollection.templates,
+    templateIds: templateCollection.templateIds,
+    currentExperimentId: templateCollection.currentExperimentId,
+    hasCurrentExperiment: templateCollection.hasCurrentExperiment,
+    saving: templateCollection.isSaving,
+    error: templateCollection.error,
+    lastSavedAt: templateCollection.lastSavedAt,
+    controls,
+    controlSchema: controls.controls,
+    controlValues,
+    controlViewIds,
+    controlViewItems,
+    activeControlView,
+    form,
+    sidebar,
+    topBar: topBarProps,
+    pillNav,
+    topBarSettings,
+    bindings,
+    renderer,
+    workspace,
+    componentBindings,
+    componentBindingsById,
+    componentImports,
+    componentProps,
+    componentPropsById,
+    componentPropsByComponent,
+    componentSnippets,
+    componentUsage,
+    getComponentProps,
+    setActiveControlView,
+    setControlValues,
+    updateControlValues,
+    applyCollection,
+    resetToDefaultCollection,
+    save: templateCollection.save,
+    saveCurrent: templateCollection.saveCurrent,
+  }
+}
+
+function humanizePresetId(value: string): string {
+  return value
+    .replace(/[-_]+/g, ' ')
+    .replace(/\b\w/g, match => match.toUpperCase())
+}
+
+function mergeInitialValues(
+  controlOptions: ControlWorkspaceOptions | undefined,
+  initialValues: BioTemplateControlValues | undefined,
+): ControlWorkspaceOptions | undefined {
+  if (initialValues === undefined) return controlOptions
+  return {
+    ...(controlOptions ?? {}),
+    initialValues: {
+      ...(controlOptions?.initialValues ?? {}),
+      ...initialValues,
+    },
+  }
+}