@morscherlab/mint-sdk 1.3.11 → 1.4.0-beta.10

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

@@ -8,7 +8,7 @@ function rack(id: string): Rack {
   return { id, name: id, format: 96, slot: 'R', injectionVolume: 5, wells: {} }
 }
 
-function mountBinding(props: { modelValue: Rack[]; activeRackId?: string }) {
+function mountBinding(props: { modelValue: Rack[]; activeRack?: string }) {
   return mount(PlateEditorBindingInternal, { props, global: { stubs: { teleport: true } } })
 }
 
@@ -25,31 +25,31 @@ describe('PlateEditorBindingInternal', () => {
   it('should show the history buttons', () => {
     const wrapper = mountBinding({ modelValue: [rack('r1')] })
 
-    expect(wrapper.findComponent(PlateEditor).props('history')).toBe(true)
+    expect(wrapper.findComponent(PlateEditor).props('spec')?.history).toBe(true)
   })
 
-  it('should follow a changed activeRackId', async () => {
-    const wrapper = mountBinding({ modelValue: [rack('r1'), rack('r2')], activeRackId: 'r1' })
+  it('should follow a changed activeRack', async () => {
+    const wrapper = mountBinding({ modelValue: [rack('r1'), rack('r2')], activeRack: 'r1' })
 
-    await wrapper.setProps({ activeRackId: 'r2' })
+    await wrapper.setProps({ activeRack: 'r2' })
 
-    expect(wrapper.findComponent(PlateEditor).props('activeRackId')).toBe('r2')
+    expect(wrapper.findComponent(PlateEditor).props('activeRack')).toBe('r2')
   })
 
   it('should select a rack that arrives with the reloaded plates', async () => {
-    const wrapper = mountBinding({ modelValue: [rack('r1')], activeRackId: 'r1' })
+    const wrapper = mountBinding({ modelValue: [rack('r1')], activeRack: 'r1' })
 
-    await wrapper.setProps({ modelValue: [rack('r1'), rack('r9')], activeRackId: 'r9' })
+    await wrapper.setProps({ modelValue: [rack('r1'), rack('r9')], activeRack: 'r9' })
 
-    expect(wrapper.findComponent(PlateEditor).props('activeRackId')).toBe('r9')
+    expect(wrapper.findComponent(PlateEditor).props('activeRack')).toBe('r9')
   })
 
-  it('should select a reloaded rack when activeRackId is passed before the plates', async () => {
-    const wrapper = mountBinding({ activeRackId: 'r1', modelValue: [rack('r1')] })
+  it('should select a reloaded rack when activeRack is passed before the plates', async () => {
+    const wrapper = mountBinding({ activeRack: 'r1', modelValue: [rack('r1')] })
 
-    await wrapper.setProps({ modelValue: [rack('r1'), rack('r9')], activeRackId: 'r9' })
+    await wrapper.setProps({ modelValue: [rack('r1'), rack('r9')], activeRack: 'r9' })
 
-    expect(wrapper.findComponent(PlateEditor).props('activeRackId')).toBe('r9')
+    expect(wrapper.findComponent(PlateEditor).props('activeRack')).toBe('r9')
   })
 
   it('should not undo into the plates of a previous binding', async () => {

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

@@ -59,7 +59,7 @@ describe('PlotlyChart', () => {
 
   it('should render the shared chart empty state when explicitly empty', async () => {
     const wrapper = mount(PlotlyChart, {
-      props: { data: [], empty: true, emptyMessage: 'No peaks found' },
+      props: { data: [], empty: true, emptyText: 'No peaks found' },
     })
     await flushPromises()
 

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

@@ -198,15 +198,20 @@ describe('PluginIcon', () => {
     })
   })
 
-  describe('tone', () => {
-    it('should apply tone via inline custom property', () => {
-      const wrapper = mount(PluginIcon, { props: { icon: SAMPLE_PATH, tone: '#0EA5E9' } })
+  describe('tone and color', () => {
+    it('should apply the tone class when tone is set', () => {
+      const wrapper = mount(PluginIcon, { props: { icon: SAMPLE_PATH, tone: 'success' } })
+      expect(wrapper.classes()).toContain('mint-plugin-icon--success')
+    })
+
+    it('should apply color via inline custom property', () => {
+      const wrapper = mount(PluginIcon, { props: { icon: SAMPLE_PATH, color: '#0EA5E9' } })
       const style = wrapper.attributes('style') || ''
       expect(style).toContain('--mint-plugin-icon-tone')
       expect(style).toContain('#0EA5E9')
     })
 
-    it('should not apply tone style when undefined', () => {
+    it('should not apply tone style when color is undefined', () => {
       const wrapper = mount(PluginIcon, { props: { icon: SAMPLE_PATH } })
       const style = wrapper.attributes('style') || ''
       expect(style).not.toContain('--mint-plugin-icon-tone')

package/src/__tests__/components/PluginWorkspaceView.controls.test.ts

@@ -1,6 +1,6 @@
 import { nextTick, ref } from 'vue'
 import { describe, expect, it, vi } from 'vitest'
-import { defineDoseDesignControlModel } from '../../composables/useControlSchema'
+import { defineControlModel, defineDoseDesignControlModel } from '../../composables/useControlSchema'
 import { usePluginWorkspaceControls } from '../../components/PluginWorkspaceView.controls'
 import type {
   ControlComponentBindingsConfig,
@@ -10,33 +10,26 @@ import type {
 } from '../../composables/useControlSchema'
 
 interface CreateControlsOptions {
-  controls?: ControlSchema
-  modelValue?: () => Record<string, unknown> | undefined
+  controls: ControlSchema
   values?: () => Record<string, unknown> | undefined
-  componentProps?: () => ControlComponentPropsMap | undefined
-  componentPropsById?: () => ControlComponentPropsByIdMap | undefined
-  componentBindings?: () => ControlComponentBindingsConfig | undefined
+  componentProps?: ControlComponentPropsMap
+  componentPropsById?: ControlComponentPropsByIdMap
+  componentBindings?: ControlComponentBindingsConfig
   emitValues?: (values: Record<string, unknown>) => void
 }
 
 function createControls({
   controls,
-  modelValue,
   values,
   componentProps,
   componentPropsById,
   componentBindings,
   emitValues = vi.fn(),
-}: CreateControlsOptions = {}) {
+}: CreateControlsOptions) {
+  const model = defineControlModel({ controls, componentProps, componentPropsById, componentBindings })
   return usePluginWorkspaceControls({
-    model: () => undefined,
-    controls: () => controls,
-    controlOptions: () => ({}),
-    modelValue: modelValue ?? (() => undefined),
+    model: () => model,
     values: values ?? (() => undefined),
-    componentBindings: componentBindings ?? (() => undefined),
-    componentProps: componentProps ?? (() => undefined),
-    componentPropsById: componentPropsById ?? (() => undefined),
     emitValues,
   })
 }
@@ -49,7 +42,7 @@ describe('PluginWorkspaceView control state helpers', () => {
         threshold: { label: 'Threshold', default: 0.05 },
         mode: { label: 'Mode', default: 'fast' },
       },
-      modelValue: () => externalValues.value,
+      values: () => externalValues.value,
     })
 
     expect(state.internalControlValues).toEqual({
@@ -94,16 +87,16 @@ describe('PluginWorkspaceView control state helpers', () => {
         threshold: { label: 'Threshold', default: 0.05 },
         mode: { label: 'Mode', default: 'fast' },
       },
-      componentProps: () => ['threshold'],
-      componentPropsById: () => ({
+      componentProps: ['threshold'],
+      componentPropsById: {
         chart: ['threshold', 'mode'],
-      }),
-      componentBindings: () => ({
+      },
+      componentBindings: {
         chart: {
           component: 'ChartContainer',
           props: ['threshold'],
         },
-      }),
+      },
     })
 
     expect(state.resolvedComponentProps.value).toEqual({ threshold: 0.05 })
@@ -123,19 +116,13 @@ describe('PluginWorkspaceView control state helpers', () => {
     })
     const state = usePluginWorkspaceControls({
       model: () => model,
-      controls: () => undefined,
-      controlOptions: () => ({}),
-      modelValue: () => ({
+      values: () => ({
         selectedWells: ['C1'],
         plateFormat: 384,
         doseMode: 'dilution',
         disabled: true,
         molecularWeight: 450,
       }),
-      values: () => undefined,
-      componentBindings: () => undefined,
-      componentProps: () => undefined,
-      componentPropsById: () => undefined,
       emitValues: vi.fn(),
     })
 
@@ -143,7 +130,7 @@ describe('PluginWorkspaceView control state helpers', () => {
     expect(state.generatedDefaultView.value).toBe('design')
     expect(state.resolvedComponentBindingsById.value.plate.props).toMatchObject({
       modelValue: ['C1'],
-      format: 384,
+      spec: { format: 384 },
       disabled: true,
     })
     expect(state.resolvedComponentPropsById.value.dose).toMatchObject({

package/src/__tests__/components/PluginWorkspaceView.internal.test.ts

@@ -11,17 +11,15 @@ import WorkspaceShellInternal from '../../components/internal/WorkspaceShellInte
 import WorkspaceSidebarInternal from '../../components/internal/WorkspaceSidebarInternal.vue'
 import type { PillNavItem, SidebarToolSection } from '../../types'
 
-vi.mock('../../composables/usePlatformContext', () => ({
-  usePlatformContext: vi.fn(() => ({
-    isIntegrated: computed(() => false),
-    context: { value: { isIntegrated: false, theme: 'system' } },
+vi.mock('../../composables/usePlatform', () => ({
+  usePlatform: vi.fn(() => ({
+    integrated: computed(() => false),
+    isAdmin: computed(() => true),
+    can: () => true,
     plugin: computed(() => undefined),
     user: computed(() => undefined),
     theme: computed(() => 'system' as const),
     features: computed(() => undefined),
-    navigate: vi.fn(),
-    notify: vi.fn(),
-    sendToPlatform: vi.fn(),
   })),
 }))
 
@@ -76,12 +74,12 @@ describe('PluginWorkspaceView internal split', () => {
   it('renders through WorkspaceShellInternal, WorkspaceSidebarInternal and WorkspaceControlsInternal', () => {
     const wrapper = mount(PluginWorkspaceView, {
       props: {
-        title: 'MS Uploader',
-        subtitle: 'Import and visualize',
-        pillNav,
-        panels,
-        sidebarTitle: 'Tools',
-        sidebarSubtitle: 'Current file',
+        spec: {
+          title: 'MS Uploader',
+          subtitle: 'Import and visualize',
+          topBar: { pills: pillNav },
+          sidebar: { title: 'Tools', subtitle: 'Current file', panels },
+        },
       },
       slots: {
         actions: () => h('button', { 'data-test': 'topbar-action' }, 'Run'),
@@ -106,16 +104,12 @@ describe('PluginWorkspaceView internal split', () => {
     expect(wrapper.findComponent(AppTopBar).props()).toMatchObject({
       title: 'MS Uploader',
       subtitle: 'Import and visualize',
-      pillNav,
-      currentPillId: 'data',
+      spec: { pills: pillNav },
+      pill: 'data',
     })
     expect(wrapper.findComponent(AppSidebar).props()).toMatchObject({
-      panels,
+      spec: { panels, title: 'Tools', subtitle: 'Current file', floating: false },
       activeView: 'data',
-      title: 'Tools',
-      subtitle: 'Current file',
-      floating: false,
-      density: 'compact',
     })
     expect(wrapper.get('[data-test="topbar-action"]').text()).toBe('Run')
     expect(wrapper.get('[data-test="import-action"]').text()).toBe('Upload')
@@ -131,9 +125,7 @@ describe('PluginWorkspaceView internal split', () => {
   it('keeps topbar navigation and sidebar panels synchronized through the internal split', async () => {
     const wrapper = mount(PluginWorkspaceView, {
       props: {
-        title: 'Analysis',
-        pillNav,
-        panels,
+        spec: { title: 'Analysis', topBar: { pills: pillNav }, sidebar: { panels } },
       },
       slots: {
         default: ({ activeView }: WorkspaceSlotProps) => h('main', { 'data-test': 'content' }, activeView),
@@ -144,21 +136,25 @@ describe('PluginWorkspaceView internal split', () => {
     wrapper.findComponent(AppTopBar).vm.$emit('pill-select', { id: 'results', label: 'Results' })
     await nextTick()
 
-    expect(wrapper.findComponent(AppTopBar).props('currentPillId')).toBe('results')
+    expect(wrapper.findComponent(AppTopBar).props('pill')).toBe('results')
     expect(wrapper.findComponent(AppSidebar).props('activeView')).toBe('results')
     expect(wrapper.findComponent(WorkspaceSidebarInternal).props('sidebar')).toMatchObject({ activeView: 'results' })
     expect(wrapper.get('[data-test="content"]').text()).toBe('results')
-    expect(wrapper.emitted('update:activeView')).toEqual([['results']])
+    expect(wrapper.emitted('update:view')).toEqual([['results']])
     expect(wrapper.emitted('pill-select')).toEqual([[{ id: 'results', label: 'Results' }]])
   })
 
   it('relays sidebar collapse, toggle, and form events unchanged through WorkspaceSidebarInternal', async () => {
     const wrapper = mount(PluginWorkspaceView, {
       props: {
-        title: 'Analysis',
-        panels,
-        forms: {
-          data: { sections: [] },
+        spec: {
+          title: 'Analysis',
+          sidebar: {
+            panels,
+            forms: {
+              data: { sections: [] },
+            },
+          },
         },
       },
       global: globalOptions,
@@ -182,8 +178,7 @@ describe('PluginWorkspaceView internal split', () => {
   it('can render without a sidebar surface, omitting WorkspaceSidebarInternal entirely', () => {
     const wrapper = mount(PluginWorkspaceView, {
       props: {
-        title: 'Simple Plugin',
-        showSidebar: false,
+        spec: { title: 'Simple Plugin', sidebar: false },
       },
       slots: {
         default: () => h('main', { 'data-test': 'content' }, 'Ready'),
@@ -200,8 +195,7 @@ describe('PluginWorkspaceView internal split', () => {
   it('lets a consumer-supplied sidebar slot override WorkspaceSidebarInternal', () => {
     const wrapper = mount(PluginWorkspaceView, {
       props: {
-        title: 'Custom Sidebar',
-        panels,
+        spec: { title: 'Custom Sidebar', sidebar: { panels } },
       },
       slots: {
         sidebar: () => h('aside', { 'data-test': 'custom-sidebar' }, 'Custom'),
@@ -216,7 +210,7 @@ describe('PluginWorkspaceView internal split', () => {
 
   it('lets a consumer-supplied topbar slot override WorkspaceShellInternal default AppTopBar rendering', () => {
     const wrapper = mount(PluginWorkspaceView, {
-      props: { title: 'Custom Top Bar' },
+      props: { spec: { title: 'Custom Top Bar' } },
       slots: {
         topbar: () => h('header', { 'data-test': 'custom-topbar' }, 'Custom'),
       },

package/src/__tests__/components/PluginWorkspaceView.navigation.test.ts

@@ -1,8 +1,6 @@
 import { ref } from 'vue'
 import { describe, expect, it } from 'vitest'
 import type {
-  PageSelectorItem,
-  PageSelectorItemInput,
   PillNavItem,
   PillNavItemInput,
 } from '../../types'
@@ -10,42 +8,31 @@ import { usePluginWorkspaceNavigation } from '../../components/PluginWorkspaceVi
 
 function makeNavigation(overrides: {
   activeView?: string
-  defaultActiveView?: string
   currentPillId?: string
-  currentPageSelectorId?: string
   pillNav?: PillNavItemInput[]
-  pageSelector?: PageSelectorItemInput[]
   panelIds?: string[]
   generatedPillNav?: PillNavItem[]
   generatedDefaultView?: string
 } = {}) {
   const activeView = ref(overrides.activeView)
-  const defaultActiveView = ref(overrides.defaultActiveView)
   const currentPillId = ref(overrides.currentPillId)
-  const currentPageSelectorId = ref(overrides.currentPageSelectorId)
   const pillNav = ref(overrides.pillNav)
-  const pageSelector = ref(overrides.pageSelector)
   const panelIds = ref(overrides.panelIds ?? [])
   const generatedPillNav = ref<PillNavItem[]>(overrides.generatedPillNav ?? [])
   const generatedDefaultView = ref(overrides.generatedDefaultView ?? '')
   const emitted = {
     activeView: [] as string[],
-    page: [] as PageSelectorItem[],
     pill: [] as PillNavItem[],
   }
 
   const navigation = usePluginWorkspaceNavigation({
     activeView: () => activeView.value,
-    defaultActiveView: () => defaultActiveView.value,
     currentPillId: () => currentPillId.value,
-    currentPageSelectorId: () => currentPageSelectorId.value,
     pillNav: () => pillNav.value,
-    pageSelector: () => pageSelector.value,
     panelIds: () => panelIds.value,
     generatedPillNav,
     generatedDefaultView,
     emitActiveView: viewId => emitted.activeView.push(viewId),
-    emitPageSelectorSelect: page => emitted.page.push(page),
     emitPillSelect: item => emitted.pill.push(item),
   })
 
@@ -71,20 +58,19 @@ describe('usePluginWorkspaceNavigation', () => {
     expect(emitted.pill).toEqual([results])
   })
 
-  it('emits page selector changes while keeping controlled active view stable', () => {
+  it('emits pill selections while keeping a controlled active view stable', () => {
     const overview = { id: 'overview', label: 'Overview' }
     const { navigation, emitted } = makeNavigation({
       activeView: 'controlled',
-      pageSelector: [overview],
+      pillNav: [overview],
       generatedDefaultView: 'generated',
     })
 
-    navigation.handlePageSelectorSelect(overview)
+    navigation.handlePillSelect(overview)
 
     expect(navigation.resolvedActiveView.value).toBe('controlled')
-    expect(navigation.resolvedCurrentPageSelectorId.value).toBe('controlled')
     expect(emitted.activeView).toEqual(['overview'])
-    expect(emitted.page).toEqual([overview])
+    expect(emitted.pill).toEqual([overview])
   })
 
   it('uses generated navigation when explicit pill nav is absent', () => {
@@ -92,7 +78,6 @@ describe('usePluginWorkspaceNavigation', () => {
     const { navigation } = makeNavigation({
       generatedPillNav: [generated],
       generatedDefaultView: 'design',
-      pageSelector: ['page-fallback'],
     })
 
     expect(navigation.resolvedPillNav.value).toEqual([generated])

package/src/__tests__/components/PluginWorkspaceView.shell.test.ts

@@ -30,12 +30,7 @@ describe('PluginWorkspaceView shell helpers', () => {
 
   it('keeps the sidebar surface hidden when all sidebar inputs are empty', () => {
     expect(hasPluginWorkspaceSidebarSurface({
-      showSidebar: true,
-      panels: {},
-      forms: {},
-      model: undefined,
-      controls: undefined,
-      showSidebarWhenEmpty: false,
+      sidebar: {},
       hasSidebarSlot: false,
       sidebarSlotCount: 0,
     })).toBe(false)