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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morscherlab/mint-sdk",
-  "version": "1.0.0-beta.4",
+  "version": "1.0.0-beta.5",
   "description": "MINT Platform SDK — Vue 3 components, composables, and types for plugin development. MINT = Mass-spec INtegrated Toolkit.",
   "type": "module",
   "main": "./dist/index.js",

package/src/__tests__/components/AppSidebar.test.ts

@@ -747,11 +747,13 @@ describe('AppSidebar', () => {
       expect(wrapper.find('.mint-sidebar--hidden').exists()).toBe(true)
     })
 
-    it('should handle undefined activeView', () => {
+    it('uses the first non-empty panel view when activeView is omitted', () => {
       const wrapper = mount(AppSidebar, {
         props: { panels: samplePanels },
       })
-      expect(wrapper.find('.mint-sidebar--hidden').exists()).toBe(true)
+      expect(wrapper.find('.mint-sidebar--hidden').exists()).toBe(false)
+      expect(wrapper.findAllComponents(CollapsibleCard)).toHaveLength(2)
+      expect(wrapper.find('.mint-sidebar__sections').exists()).toBe(true)
     })
   })
 

package/src/__tests__/components/AppTopBar.test.ts

@@ -1063,18 +1063,24 @@ describe('AppTopBar', () => {
           version: '1.0',
           route_prefix: '/test',
           api_prefix: '/api/test',
-          nav_items: [{ path: '/stale', label: 'Stale' }],
+          nav_items: [
+            { path: '/stale', label: 'Stale' },
+            { path: '/stale-two', label: 'Stale Two' },
+          ],
         },
       })
 
       const wrapper = createWrapper({
-        pageSelector: [{ id: 'overview', label: 'Overview', to: '/' }],
+        pageSelector: [
+          { id: 'overview', label: 'Overview', to: '/' },
+          { id: 'reports', label: 'Reports', to: '/reports' },
+        ],
         currentPageSelectorId: 'overview',
       })
       await wrapper.get('.mint-page-selector__trigger').trigger('click')
 
       expect(wrapper.get('.mint-page-selector__label').text()).toBe('Overview')
-      expect(wrapper.findAll('.mint-page-selector__item-label').map(item => item.text())).toEqual(['Overview'])
+      expect(wrapper.findAll('.mint-page-selector__item-label').map(item => item.text())).toEqual(['Overview', 'Reports'])
     })
   })
 

package/src/__tests__/components/{AppPageSelector.test.ts → AppTopBarPageSelector.test.ts}

@@ -1,10 +1,10 @@
 import { mount } from '@vue/test-utils'
 import { describe, expect, it } from 'vitest'
-import AppPageSelectorInternal from '../../components/internal/AppPageSelectorInternal.vue'
+import AppTopBarPageSelectorInternal from '../../components/internal/AppTopBarPageSelectorInternal.vue'
 
-describe('AppPageSelectorInternal', () => {
+describe('AppTopBarPageSelectorInternal', () => {
   it('accepts string shorthand pages', async () => {
-    const wrapper = mount(AppPageSelectorInternal, {
+    const wrapper = mount(AppTopBarPageSelectorInternal, {
       props: {
         currentPageId: 'Workspace',
         pages: ['Workspace', 'Results'],
@@ -25,7 +25,7 @@ describe('AppPageSelectorInternal', () => {
   })
 
   it('closes linked page actions without emitting select', async () => {
-    const wrapper = mount(AppPageSelectorInternal, {
+    const wrapper = mount(AppTopBarPageSelectorInternal, {
       props: {
         currentPageId: 'workspace',
         pages: [
@@ -43,7 +43,7 @@ describe('AppPageSelectorInternal', () => {
   })
 
   it('keeps disabled linked page actions inert', async () => {
-    const wrapper = mount(AppPageSelectorInternal, {
+    const wrapper = mount(AppTopBarPageSelectorInternal, {
       props: {
         currentPageId: 'workspace',
         pages: [
@@ -66,7 +66,7 @@ describe('AppPageSelectorInternal', () => {
 
   it('emits select for button page actions', async () => {
     const page = { id: 'workspace', label: 'Workspace' }
-    const wrapper = mount(AppPageSelectorInternal, {
+    const wrapper = mount(AppTopBarPageSelectorInternal, {
       props: {
         pages: [page],
       },
@@ -81,7 +81,7 @@ describe('AppPageSelectorInternal', () => {
   it('renders PluginIcon-compatible metadata icons and keeps symbolic icons as fallback initials', async () => {
     const iconPath = 'M4 19h16M7 16V8m5 8V4m5 12v-6'
     const pngIcon = 'data:image/png;base64,iVBORw0KGgo='
-    const wrapper = mount(AppPageSelectorInternal, {
+    const wrapper = mount(AppTopBarPageSelectorInternal, {
       props: {
         pages: [
           { id: 'analysis', label: 'Analysis', icon: iconPath },
@@ -117,7 +117,7 @@ describe('AppPageSelectorInternal', () => {
 
   it('renders https page icons through PluginIcon', async () => {
     const httpsIcon = 'https://example.com/plugin-icon.png'
-    const wrapper = mount(AppPageSelectorInternal, {
+    const wrapper = mount(AppTopBarPageSelectorInternal, {
       props: {
         pages: [
           { id: 'docs', label: 'Docs', icon: httpsIcon },

package/src/__tests__/components/{AppPillNav.test.ts → AppTopBarPillNav.test.ts}

@@ -1,10 +1,10 @@
 import { mount } from '@vue/test-utils'
 import { describe, expect, it } from 'vitest'
-import AppPillNavInternal from '../../components/internal/AppPillNavInternal.vue'
+import AppTopBarPillNavInternal from '../../components/internal/AppTopBarPillNavInternal.vue'
 
-describe('AppPillNavInternal', () => {
+describe('AppTopBarPillNavInternal', () => {
   it('accepts string shorthand items', async () => {
-    const wrapper = mount(AppPillNavInternal, {
+    const wrapper = mount(AppTopBarPillNavInternal, {
       props: {
         currentItemId: 'Overview',
         items: ['Overview', 'Analysis'],
@@ -22,7 +22,7 @@ describe('AppPillNavInternal', () => {
   })
 
   it('emits select for button items but not linked items', async () => {
-    const wrapper = mount(AppPillNavInternal, {
+    const wrapper = mount(AppTopBarPillNavInternal, {
       props: {
         currentItemId: 'overview',
         items: [
@@ -40,7 +40,7 @@ describe('AppPillNavInternal', () => {
 
   it('renders SVG icons from item metadata', () => {
     const icon = ['M4 12h16', 'M12 4v16']
-    const wrapper = mount(AppPillNavInternal, {
+    const wrapper = mount(AppTopBarPillNavInternal, {
       props: {
         items: [
           { id: 'run', label: 'Run', icon },
@@ -59,7 +59,7 @@ describe('AppPillNavInternal', () => {
   })
 
   it('prevents disabled link navigation and selection', async () => {
-    const wrapper = mount(AppPillNavInternal, {
+    const wrapper = mount(AppTopBarPillNavInternal, {
       props: {
         items: [
           { id: 'docs', label: 'Docs', href: '/docs', disabled: true },
@@ -77,7 +77,7 @@ describe('AppPillNavInternal', () => {
   })
 
   it('supports dropdown child items for grouped pill navigation', async () => {
-    const wrapper = mount(AppPillNavInternal, {
+    const wrapper = mount(AppTopBarPillNavInternal, {
       props: {
         currentItemId: 'pca',
         items: [

package/src/__tests__/components/BioTemplatePackWorkspaceView.test.ts

@@ -21,8 +21,10 @@ const globalOptions = {
   stubs: {
     DataFrame: true,
     DoseCalculator: true,
+    ExperimentTimeline: true,
     PlateMapEditor: true,
     SampleSelector: true,
+    ScheduleCalendar: true,
     WellPlate: true,
   },
 }
@@ -172,4 +174,19 @@ describe('BioTemplatePackWorkspaceView', () => {
     })
     expect(wrapper.find('.mint-bio-template-renderer').exists()).toBe(false)
   })
+
+  it('renders metabolism pack run queues as timeline and calendar previews', () => {
+    const wrapper = mount(BioTemplatePackWorkspaceView, {
+      props: {
+        pack: 'metabolism',
+      },
+      global: globalOptions,
+    })
+
+    expect(wrapper.text()).toContain('Omics assay saves the full template collection')
+    expect(wrapper.find('[data-component-binding-id="instrument-run:ExperimentTimeline"]').exists()).toBe(true)
+    expect(wrapper.find('[data-component-binding-id="instrument-run:ScheduleCalendar"]').exists()).toBe(true)
+    expect(wrapper.find('[data-template-component="ExperimentTimeline"]').exists()).toBe(true)
+    expect(wrapper.find('[data-template-component="ScheduleCalendar"]').exists()).toBe(true)
+  })
 })

package/src/__tests__/components/BioTemplatePresetWorkspaceView.test.ts

@@ -303,4 +303,26 @@ describe('BioTemplatePresetWorkspaceView', () => {
     expect(workspace.activeControlView.value).toBe('analysis')
     expect(wrapper.findComponent(AppSidebar).props('activeView')).toBe('analysis')
   })
+
+  it('renders LC-MS batch timeline and calendar previews from one preset prop', () => {
+    const wrapper = mount(BioTemplatePresetWorkspaceView, {
+      props: {
+        preset: 'lcms-batch',
+      },
+      global: {
+        stubs: {
+          DataFrame: true,
+          ExperimentTimeline: true,
+          ScheduleCalendar: true,
+          SampleSelector: true,
+        },
+      },
+    })
+
+    expect(wrapper.text()).toContain('LC-MS batch preset saves')
+    expect(wrapper.find('[data-component-binding-id="instrument-run:ExperimentTimeline"]').exists()).toBe(true)
+    expect(wrapper.find('[data-component-binding-id="instrument-run:ScheduleCalendar"]').exists()).toBe(true)
+    expect(wrapper.find('[data-template-component="ExperimentTimeline"]').exists()).toBe(true)
+    expect(wrapper.find('[data-template-component="ScheduleCalendar"]').exists()).toBe(true)
+  })
 })

package/src/__tests__/components/BioTemplateRenderer.test.ts

@@ -33,6 +33,31 @@ describe('BioTemplateRenderer', () => {
     expect(wrapper.text()).toContain('dose-response')
   })
 
+  it('renders instrument-run timelines from LC-MS template collections', () => {
+    const collection = createLcmsBatchCollection({
+      samples: ['S001', 'S002'],
+      instrument: 'LC-MS',
+    })
+    const wrapper = mount(BioTemplateRenderer, {
+      props: { target: collection },
+      global: {
+        stubs: {
+          DataFrame: true,
+          ExperimentTimeline: true,
+          SampleSelector: true,
+          ScheduleCalendar: true,
+        },
+      },
+    })
+
+    expect(wrapper.find('[data-component-binding-id="instrument-run:ScheduleCalendar"]').exists()).toBe(true)
+    expect(wrapper.find('[data-component-binding-id="instrument-run:ExperimentTimeline"]').exists()).toBe(true)
+    expect(wrapper.find('[data-component-binding-id="assay-matrix:SampleSelector"]').exists()).toBe(true)
+    expect(wrapper.find('[data-template-component="ScheduleCalendar"]').exists()).toBe(true)
+    expect(wrapper.find('[data-template-component="ExperimentTimeline"]').exists()).toBe(true)
+    expect(wrapper.find('[data-template-id="instrument-run"]').exists()).toBe(true)
+  })
+
   it('filters rendered components with include and exclude lists', () => {
     const collection = createWellPlateScreenCollection()
     const wrapper = mount(BioTemplateRenderer, {

package/src/__tests__/components/ComponentBindingRenderer.test.ts

@@ -46,11 +46,48 @@ const PlateMapEditorStub = defineComponent({
   template: '<div data-test="plate-map-editor" />',
 })
 
+const ExperimentTimelineStub = defineComponent({
+  name: 'ExperimentTimeline',
+  props: {
+    modelValue: { type: Array, default: () => [] },
+    editable: { type: Boolean, default: true },
+    size: { type: String, default: undefined },
+  },
+  template: '<div data-test="experiment-timeline" />',
+})
+
+const ScheduleCalendarStub = defineComponent({
+  name: 'ScheduleCalendar',
+  props: {
+    modelValue: { type: [String, Date], default: undefined },
+    events: { type: Array, default: () => [] },
+    readonly: { type: Boolean, default: false },
+    showNavigation: { type: Boolean, default: true },
+    showViewToggle: { type: Boolean, default: true },
+    view: { type: String, default: undefined },
+  },
+  template: '<div data-test="schedule-calendar" />',
+})
+
+const SampleSelectorStub = defineComponent({
+  name: 'SampleSelector',
+  props: {
+    samples: { type: Array, default: () => [] },
+    modelValue: { type: Array, default: () => [] },
+    enableGrouping: { type: Boolean, default: true },
+    enableSmartGroup: { type: Boolean, default: true },
+  },
+  template: '<div data-test="sample-selector" />',
+})
+
 const globalOptions = {
   stubs: {
     DataFrame: DataFrameStub,
     DoseCalculator: DoseCalculatorStub,
+    ExperimentTimeline: ExperimentTimelineStub,
     PlateMapEditor: PlateMapEditorStub,
+    SampleSelector: SampleSelectorStub,
+    ScheduleCalendar: ScheduleCalendarStub,
     WellPlate: WellPlateStub,
   },
 }
@@ -158,4 +195,84 @@ describe('ComponentBindingRenderer', () => {
       maxHeight: '280px',
     })
   })
+
+  it('renders ExperimentTimeline bindings with preview-safe props', () => {
+    const wrapper = mount(ComponentBindingRenderer, {
+      props: {
+        binding: {
+          id: 'instrument-run:ExperimentTimeline',
+          component: 'ExperimentTimeline',
+          propsObject: {
+            modelValue: [{ id: 's001-run', name: 'S001', type: 'measurement', status: 'pending', order: 1 }],
+            editable: true,
+          },
+        },
+        dense: true,
+      },
+      global: globalOptions,
+    })
+
+    expect(wrapper.find('[data-component-binding-id="instrument-run:ExperimentTimeline"]').exists()).toBe(true)
+    expect(wrapper.findComponent(ExperimentTimelineStub).props()).toMatchObject({
+      modelValue: [{ id: 's001-run', name: 'S001', type: 'measurement', status: 'pending', order: 1 }],
+      editable: false,
+      size: 'sm',
+    })
+  })
+
+  it('renders ScheduleCalendar bindings with preview-safe props', () => {
+    const events = [{ id: 's001-run', title: 'S001', start: '2024-01-01T08:00:00.000Z', end: '2024-01-01T08:10:00.000Z' }]
+    const wrapper = mount(ComponentBindingRenderer, {
+      props: {
+        binding: {
+          id: 'instrument-run:ScheduleCalendar',
+          component: 'ScheduleCalendar',
+          propsObject: {
+            modelValue: events[0].start,
+            events,
+            readonly: false,
+            showNavigation: true,
+            showViewToggle: true,
+            view: 'day',
+          },
+        },
+        dense: true,
+      },
+      global: globalOptions,
+    })
+
+    expect(wrapper.find('[data-component-binding-id="instrument-run:ScheduleCalendar"]').exists()).toBe(true)
+    expect(wrapper.findComponent(ScheduleCalendarStub).props()).toMatchObject({
+      modelValue: events[0].start,
+      events,
+      readonly: true,
+      showNavigation: false,
+      showViewToggle: false,
+      view: 'day',
+    })
+  })
+
+  it('renders SampleSelector bindings with preview-safe grouping props', () => {
+    const wrapper = mount(ComponentBindingRenderer, {
+      props: {
+        binding: {
+          id: 'assay-matrix:SampleSelector',
+          component: 'SampleSelector',
+          propsObject: {
+            samples: ['S001', 'S002'],
+            modelValue: [],
+          },
+        },
+      },
+      global: globalOptions,
+    })
+
+    expect(wrapper.find('[data-component-binding-id="assay-matrix:SampleSelector"]').exists()).toBe(true)
+    expect(wrapper.findComponent(SampleSelectorStub).props()).toMatchObject({
+      samples: ['S001', 'S002'],
+      modelValue: [],
+      enableGrouping: false,
+      enableSmartGroup: false,
+    })
+  })
 })

package/src/__tests__/composables/useBioTemplatePackWorkspace.test.ts

@@ -68,7 +68,7 @@ describe('useBioTemplatePackWorkspace', () => {
     expect(workspace.componentUsage.value?.template).toContain('<DoseCalculator')
   })
 
-  it('exposes live AppSidebar, AppTopBar, and AppPillNav bindings for mixed-view packs', () => {
+  it('exposes live AppSidebar, AppTopBar, and pillNav bindings for mixed-view packs', () => {
     const workspace = useBioTemplatePackWorkspace('omics-assay')
     const inner = workspace.workspace.value
 

package/src/__tests__/composables/useBioTemplatePresetWorkspace.test.ts

@@ -91,7 +91,7 @@ describe('useBioTemplatePresetWorkspace', () => {
     expect(workspace.activeControlView.value).toBe('analysis')
   })
 
-  it('exposes live FormBuilder, AppSidebar, AppTopBar, and AppPillNav bindings', () => {
+  it('exposes live FormBuilder, AppSidebar, AppTopBar, and pillNav bindings', () => {
     const workspace = useBioTemplatePresetWorkspace('lcms-batch')
 
     workspace.form['onUpdate:modelValue']({

package/src/__tests__/composables/useControlSchema.test.ts

@@ -194,7 +194,7 @@ describe('useControlSchema', () => {
     ])
   })
 
-  it('returns view helpers that can drive AppPillNav and AppSidebar together', () => {
+  it('returns view helpers that can drive AppTopBar pillNav and AppSidebar together', () => {
     expect(controlsToViewIds(controls)).toEqual(['analysis'])
     expect(controlsToViewItems(controls)).toEqual([{ id: 'analysis', label: 'Analysis' }])
     expect(getDefaultControlView(controls)).toBe('analysis')

package/src/__tests__/templates/templates.test.ts

@@ -54,6 +54,7 @@ import {
   toAssayMatrixColumns,
   toAssayMatrixDataFrame,
   toAssayMatrixRows,
+  toAssayMatrixSampleOptions,
   toCalibrationCurveDataFrame,
   toCalibrationCurveRows,
   toDoseConditions,
@@ -62,6 +63,8 @@ import {
   toFlowPanelRows,
   toInstrumentRunDataFrame,
   toInstrumentRunRows,
+  toInstrumentRunScheduleEvents,
+  toInstrumentRunSteps,
   toPlateMapEditorState,
   toProtocolDataFrame,
   toProtocolSteps,
@@ -87,6 +90,7 @@ import bioTemplateCatalogContract from '../../../../bio-template-catalog.contrac
 import bioTemplatePacksContract from '../../../../bio-template-packs.contract.json'
 import bioTemplatePresetsContract from '../../../../bio-template-presets.contract.json'
 import type {
+  AssayMatrixTemplate,
   DoseResponseTemplate,
   FlowCytometryPanelTemplate,
   InstrumentRunTemplate,
@@ -158,6 +162,9 @@ describe('bio data templates', () => {
       'flow-cytometry-panel',
     ])
     expect(getBioTemplatePackInfo('metabolomics')?.name).toBe('omics-assay')
+    expect(getBioTemplatePackInfo('metabolism')?.name).toBe('omics-assay')
+    expect(getBioTemplatePackInfo('metabolite profiling')?.name).toBe('omics-assay')
+    expect(getBioTemplatePackInfo('metabolomics')?.components).toContain('ExperimentTimeline')
     expect(getBioTemplatePackInfo('longitudinal')?.init_command).toBe('mint init --template longitudinal-study')
     expect(getBioTemplatePackInfo('gene expression')?.templates.at(-1)).toBe('qpcr-plate')
     expect(getBioTemplatePackInfo('gene-expression')?.templates.at(-1)).toBe('qpcr-plate')
@@ -214,6 +221,9 @@ describe('bio data templates', () => {
       'qpcr-plate',
     ])
     expect(searchBioTemplatePresets('run queue')[0].name).toBe('lcms-batch')
+    expect(getBioTemplatePresetInfo('metabolomics')?.name).toBe('lcms-batch')
+    expect(getBioTemplatePresetInfo('metabolism')?.name).toBe('lcms-batch')
+    expect(getBioTemplatePresetInfo('metabolite profiling')?.name).toBe('lcms-batch')
     expect(getBioTemplatePresetInfo('immunoassay')?.templates).toEqual([
       'plate-map',
       'sample-sheet',
@@ -288,6 +298,7 @@ describe('bio data templates', () => {
     const qpcrBindings = getBioTemplateComponentBindings('gene expression')
     const elisaBindings = getBioTemplateComponentBindings('elisa-assay')
     const flowBindings = getBioTemplateComponentBindings('flow-cytometry-assay')
+    const lcmsBindings = getBioTemplateComponentBindings('lcms-batch')
     const westernBindings = getBioTemplateComponentBindings('western-blot-assay')
     const wellplateImports = toBioTemplateComponentImports('wellplate-screen')
 
@@ -298,11 +309,14 @@ describe('bio data templates', () => {
     expect(qpcrBindings.map(binding => binding.component)).toContain('DataFrame')
     expect(elisaBindings.map(binding => binding.component)).toContain('PlateMapEditor')
     expect(elisaBindings.map(binding => binding.component)).toContain('DataFrame')
+    expect(lcmsBindings.map(binding => binding.component)).toContain('ScheduleCalendar')
+    expect(lcmsBindings.map(binding => binding.component)).toContain('ExperimentTimeline')
     expect(flowBindings.map(binding => binding.template_id)).toEqual([
       'sample-sheet',
       'sample-sheet',
       'flow-cytometry-panel',
       'assay-matrix',
+      'assay-matrix',
     ])
     expect(westernBindings.map(binding => binding.component)).toContain('ReagentList')
     expect(westernBindings.map(binding => binding.component)).toContain('ExperimentTimeline')
@@ -412,6 +426,7 @@ describe('bio data templates', () => {
     expect(componentPropsById['plate-map:WellPlate'].wells).toBeDefined()
     expect(componentPropsById['calibration-curve:DataFrame'].data).toBeDefined()
     expect(componentPropsById['assay-matrix:DataFrame'].columns).toBeDefined()
+    expect(componentPropsById['assay-matrix:SampleSelector'].samples).toEqual(['Control', 'Treatment'])
   })
 
   it('generates Vue snippets for concrete template component props', () => {
@@ -556,6 +571,7 @@ describe('bio data templates', () => {
     expect(toInstrumentRunRows(lcmsTemplates['instrument-run'] as InstrumentRunTemplate)[0].kind).toBe('blank')
     expect(toInstrumentRunRows(lcmsTemplates['instrument-run'] as InstrumentRunTemplate)[2].sampleId).toBe('s001')
     expect(toTemplateDataFrame(lcmsTemplates['assay-matrix']).columns.map(column => column.key)).toContain('glucose')
+    expect(toAssayMatrixSampleOptions(lcmsTemplates['assay-matrix'] as AssayMatrixTemplate).map(option => option.label)).toEqual(['S001', 'S002'])
     expect(Object.keys(flowTemplates)).toEqual(['sample-sheet', 'flow-cytometry-panel', 'assay-matrix'])
     expect(flow.metadata?.preset).toBe('flow-cytometry-assay')
     expect(flowTemplates['flow-cytometry-panel'].data).toMatchObject({
@@ -921,6 +937,10 @@ describe('bio data templates', () => {
     const assayFrame = toAssayMatrixDataFrame(template)
     expect(assayFrame.rowKey).toBe('sampleId')
     expect(assayFrame.data[0].lactate).toBe(1.2)
+    expect(toAssayMatrixSampleOptions(template)).toEqual([
+      { value: 's001', label: 'S001', description: undefined },
+      { value: 's002', label: 'S002', description: undefined },
+    ])
     expect(toTemplateDataFrame(template).columns.map(column => column.key)).toContain('glucose')
   })
 
@@ -978,6 +998,11 @@ describe('bio data templates', () => {
     })
     const rows = toInstrumentRunRows(template)
     const frame = toInstrumentRunDataFrame(template)
+    const steps = toInstrumentRunSteps(template)
+    const events = toInstrumentRunScheduleEvents(template)
+    const componentProps = toBioTemplateComponentProps(template)
+    const calendar = componentProps.find(binding => binding.component === 'ScheduleCalendar')
+    const timeline = componentProps.find(binding => binding.component === 'ExperimentTimeline')
 
     expect(template.template_id).toBe('instrument-run')
     expect(template.data.items.map(item => item.kind)).toEqual(['blank', 'qc', 'sample', 'sample', 'qc'])
@@ -987,6 +1012,25 @@ describe('bio data templates', () => {
     expect(frame.rowKey).toBe('id')
     expect(frame.columns.map(column => column.key)).toContain('status')
     expect(toTemplateDataFrame(template).data[3].sampleId).toBe('s002')
+    expect(steps[2]).toMatchObject({
+      id: 's001-run',
+      type: 'measurement',
+      name: 'S001',
+      status: 'pending',
+      order: 3,
+    })
+    expect(steps[2].parameters?.method).toBe('Default method')
+    expect(events[0]).toMatchObject({
+      id: 'blank-start',
+      title: 'Blank start',
+      start: '2024-01-01T08:00:00.000Z',
+      end: '2024-01-01T08:10:00.000Z',
+      status: 'pending',
+    })
+    expect(events[2].title).toBe('S001')
+    expect(calendar?.propsObject.modelValue).toBe(events[0].start)
+    expect(calendar?.propsObject.events).toEqual(events)
+    expect(timeline?.propsObject.modelValue).toEqual(steps)
   })
 
   it('creates qPCR plate templates and adapts reactions to dataframe and wells', () => {

package/src/components/AppSidebar.vue

@@ -6,7 +6,8 @@
  * the `panels` config and rendered as CollapsibleCards. Controls can be
  * provided through named slots or auto-rendered from FormBuilder schemas.
  *
- * When the active view has no matching panels, the sidebar hides entirely.
+ * When activeView is omitted, the first non-empty panel view is selected.
+ * When no view has matching panels, the sidebar hides entirely.
  *
  * @example
  * ```vue
@@ -52,7 +53,7 @@ interface Props {
   variant?: 'default' | 'analysis'
   /** Map of view IDs to their tool sections */
   panels?: Record<string, SidebarToolSection[]>
-  /** Which view's panels to display */
+  /** Which view's panels to display. Defaults to the first non-empty panel view. */
   activeView?: string
   /** Floating variant with absolute positioning. Defaults to false for analysis variant. */
   floating?: boolean
@@ -219,7 +220,6 @@ const resolvedValues = computed<Record<string, unknown>>(() => ({
 const resolvedActiveView = computed(() => {
   if (props.activeView) return props.activeView
   if (props.defaultView) return props.defaultView
-  if (!resolvedControls.value) return ''
   return firstVisibleViewId(resolvedPanels.value)
 })
 

package/src/components/AppTopBar.vue

@@ -20,8 +20,8 @@ import ThemeToggle from './ThemeToggle.vue'
 import SettingsModal from './SettingsModal.vue'
 import ExperimentPopover from './ExperimentPopover.vue'
 import ExperimentSelectorModal from './ExperimentSelectorModal.vue'
-import AppPageSelectorInternal from './internal/AppPageSelectorInternal.vue'
-import AppPillNavInternal from './internal/AppPillNavInternal.vue'
+import AppTopBarPageSelectorInternal from './internal/AppTopBarPageSelectorInternal.vue'
+import AppTopBarPillNavInternal from './internal/AppTopBarPillNavInternal.vue'
 import AppAvatarMenu from './AppAvatarMenu.vue'
 import AppPluginSwitcher from './AppPluginSwitcher.vue'
 import PluginIcon from './PluginIcon.vue'
@@ -126,9 +126,9 @@ const profileInitial = computed(() => {
 })
 
 const hasPlatformPageSelector = computed(() =>
-  props.pageSelector === undefined && !!plugin.value?.nav_items?.length,
+  props.pageSelector === undefined && (plugin.value?.nav_items?.length ?? 0) > 1,
 )
-const hasPageSelector = computed(() => !!props.pageSelector?.length || hasPlatformPageSelector.value)
+const hasPageSelector = computed(() => (props.pageSelector?.length ?? 0) > 1 || hasPlatformPageSelector.value)
 const hasPluginSwitcher = computed(() => !!props.pluginSwitcher)
 const hasPillNav = computed(() => !!props.pillNav?.length)
 const hasAccountMenu = computed(() => !!props.accountMenu?.length)
@@ -295,7 +295,7 @@ function currentItemIdFromLocation(pages: Array<Pick<PageSelectorItem, 'id' | 't
         @select="emit('plugin-switcher-select', $event)"
         @install-click="emit('plugin-switcher-install')"
       />
-      <AppPageSelectorInternal
+      <AppTopBarPageSelectorInternal
         v-else-if="hasPageSelector"
         :pages="normalizedPageSelector"
         :current-page-id="effectiveCurrentPageSelectorId"
@@ -307,7 +307,7 @@ function currentItemIdFromLocation(pages: Array<Pick<PageSelectorItem, 'id' | 't
         <template v-if="$slots['page-selector-item-icon']" #item-icon="slotProps">
           <slot name="page-selector-item-icon" v-bind="slotProps" />
         </template>
-      </AppPageSelectorInternal>
+      </AppTopBarPageSelectorInternal>
 
       <!-- Left: title -->
       <div v-if="hasTitleGroup" class="mint-topbar-title-group">
@@ -323,7 +323,7 @@ function currentItemIdFromLocation(pages: Array<Pick<PageSelectorItem, 'id' | 't
       <!-- Center: pill nav (new) -->
       <div v-if="hasPillNav || $slots.center" class="mint-topbar__center">
         <slot name="center">
-          <AppPillNavInternal
+          <AppTopBarPillNavInternal
             v-if="hasPillNav && pillNav"
             :items="normalizedPillNav"
             :current-item-id="currentPillId"

package/src/components/BioTemplatePresetWorkspaceView.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-/** Complete editable WellPlate/DoseCalculator workspace for dose design that rebuilds generated AppSidebar preset wiring when preset props load late. */
+/** Complete editable biology template preset workspace for WellPlate/DoseCalculator, LC-MS, qPCR, generated controls, preview components, and current-experiment save wiring. */
 import { computed, effectScope, onScopeDispose, shallowRef, toRaw, unref, watch, type EffectScope } from 'vue'
 import type { BioTemplateControlValues, TemplatePresetId } from '../templates'
 import type {
@@ -11,7 +11,7 @@ import AlertBox from './AlertBox.vue'
 import AppSidebar from './AppSidebar.vue'
 import BaseButton from './BaseButton.vue'
 import BioTemplateRenderer from './BioTemplateRenderer.vue'
-import AppPillNavInternal from './internal/AppPillNavInternal.vue'
+import AppTopBarPillNavInternal from './internal/AppTopBarPillNavInternal.vue'
 
 type BioTemplatePresetSidebarVariant = 'default' | 'analysis'
 
@@ -256,7 +256,7 @@ function isPlainRecord(value: unknown): value is Record<string, unknown> {
           <p class="mint-bio-template-preset-workspace__sidebar-title">
             Controls
           </p>
-          <AppPillNavInternal
+          <AppTopBarPillNavInternal
             v-if="resolvedWorkspace.pillNav.items.length > 1"
             class="mint-bio-template-preset-workspace__view-nav"
             :items="resolvedWorkspace.pillNav.items"