@morscherlab/mint-sdk 1.2.10 → 1.3.0-beta.10

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morscherlab/mint-sdk",
-  "version": "1.2.10",
+  "version": "1.3.0-beta.10",
   "description": "MINT Platform SDK — Vue 3 components, composables, and types for plugin development. MINT = Mass-spec INtegrated Toolkit.",
   "type": "module",
   "main": "./dist/index.js",
@@ -67,42 +67,36 @@
     "story:preview": "histoire preview"
   },
   "peerDependencies": {
-    "@simplewebauthn/browser": "^10.0.0",
-    "pinia": "^2.1.0 || ^3.0.0",
-    "tailwindcss": "^4.1.0",
-    "vue": "^3.4.0",
-    "vue-router": "^4.2.0"
+    "pinia": "^4.0.3",
+    "tailwindcss": "^4.3.3",
+    "vue": "^3.5.43",
+    "vue-router": "^5.3.1"
   },
   "peerDependenciesMeta": {
-    "@simplewebauthn/browser": {
-      "optional": true
-    },
     "vue-router": {
       "optional": true
     }
   },
   "dependencies": {
-    "@floating-ui/dom": "^1.7.6",
+    "@floating-ui/dom": "^1.8.0",
     "axios": "1.20.0",
     "lucide-vue-next": "1.0.0",
-    "plotly.js-dist-min": "^3.7.0"
+    "plotly.js-dist-min": "^4.1.1"
   },
   "devDependencies": {
     "@histoire/plugin-vue": "1.0.0-beta.1",
-    "@simplewebauthn/browser": "10.0.0",
-    "@simplewebauthn/types": "10.0.0",
-    "@types/node": "22.19.13",
-    "@types/plotly.js": "^3.0.10",
-    "@vitejs/plugin-vue": "6.0.5",
-    "@vue/test-utils": "2.4.6",
-    "happy-dom": "15.11.7",
+    "@types/node": "22.20.4",
+    "@vitejs/plugin-vue": "6.0.9",
+    "@vue/language-core": "3.3.11",
+    "@vue/test-utils": "2.5.1",
+    "happy-dom": "20.14.5",
     "histoire": "1.0.0-beta.1",
     "typescript": "5.9.3",
-    "vite": "8.0.0",
-    "vite-plugin-dts": "4.5.4",
-    "vitest": "4.1.0",
-    "vue-router": "4.6.4",
-    "vue-tsc": "2.2.12"
+    "vite": "8.3.1",
+    "vite-plugin-dts": "5.1.1",
+    "vitest": "5.0.2",
+    "vue-router": "5.3.1",
+    "vue-tsc": "3.3.11"
   },
   "repository": {
     "type": "git",

package/src/__stories__/experiment-helpers.ts

@@ -2,11 +2,11 @@
  * Shared helpers for story files that need experiment selector integration.
  * Provides mock data, API interceptors, and a provider wrapper component.
  */
-import { defineComponent, onUnmounted } from 'vue'
+import { defineComponent, onUnmounted, type PropType } from 'vue'
 import { useAppExperiment } from '../composables/useAppExperiment'
 import { useApi } from '../composables/useApi'
 import { useExperimentStore } from '../stores/experiment'
-import type { ExperimentSummary } from '../types'
+import type { ExperimentSummary, PluginInfo } from '../types'
 
 export const mockExperiments: ExperimentSummary[] = [
   { id: 1, experiment_code: 'DR-HeLa-DOX-001', name: 'Doxorubicin dose-response in HeLa cells', status: 'completed', experiment_type: 'dose_response', project: 'Oncology Screen Q1', project_name: 'Oncology Screen Q1', created_at: '2026-02-28T14:30:00Z', updated_at: '2026-03-01T09:15:00Z', has_design_data: true },
@@ -64,11 +64,15 @@ export function installMockInterceptor() {
  *
  * Props:
  *   preselect (boolean, default true) - pre-select the first mock experiment
+ *   plugin (PluginInfo, optional)      - the integrated plugin, shown as AppTopBar's static identity
  */
 export const ExperimentProvider = defineComponent({
-  props: { preselect: { type: Boolean, default: true } },
+  props: {
+    preselect: { type: Boolean, default: true },
+    plugin: { type: Object as PropType<PluginInfo>, default: undefined },
+  },
   setup(props, { slots }) {
-    ;(window as any).__MINT_PLATFORM__ = { isIntegrated: true, theme: 'system' }
+    ;(window as any).__MINT_PLATFORM__ = { isIntegrated: true, theme: 'system', plugin: props.plugin }
     installMockInterceptor()
     const experimentStore = useExperimentStore()
     useAppExperiment({

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

@@ -12,6 +12,20 @@ const items = [
 enableAutoUnmount(afterEach)
 
 describe('ActionMenu', () => {
+  it('should open the menu from a #trigger slot button', async () => {
+    const wrapper = mount(ActionMenu, {
+      attachTo: document.body,
+      props: { label: 'Import / Export', items },
+      slots: {
+        trigger: `<template #trigger="{ toggle }"><button type="button" class="custom" @click="toggle">Import / Export</button></template>`,
+      },
+    })
+
+    await wrapper.get('.custom').trigger('click')
+
+    expect(document.body.querySelector('.mint-action-menu__panel')).not.toBeNull()
+  })
+
   it('should render the default trigger with the Lucide ellipsis icon', () => {
     const wrapper = mount(ActionMenu, {
       props: { label: 'More user actions', items },
@@ -89,6 +103,48 @@ describe('ActionMenu', () => {
     expect(menuItems[1]?.classList.contains('mint-action-menu__item--danger')).toBe(true)
   })
 
+  it('should render the panel on the shared popover surface when opened', async () => {
+    const wrapper = mount(ActionMenu, {
+      attachTo: document.body,
+      props: { label: 'More user actions', items },
+    })
+    await wrapper.get('button').trigger('click')
+
+    expect(document.body.querySelector('.mint-action-menu__panel')?.classList.contains('mint-popover')).toBe(true)
+  })
+
+  it('should render items as shared menu items when opened', async () => {
+    const wrapper = mount(ActionMenu, {
+      attachTo: document.body,
+      props: { label: 'More user actions', items },
+    })
+    await wrapper.get('button').trigger('click')
+
+    expect(document.body.querySelectorAll('.mint-action-menu__item.mint-menu-item')).toHaveLength(2)
+  })
+
+  it('should precede a danger item with a separator when other items come first', async () => {
+    const wrapper = mount(ActionMenu, {
+      attachTo: document.body,
+      props: { label: 'More user actions', items },
+    })
+    await wrapper.get('button').trigger('click')
+
+    const danger = document.body.querySelector('.mint-action-menu__item--danger')
+
+    expect(danger?.previousElementSibling?.classList.contains('mint-menu-separator')).toBe(true)
+  })
+
+  it('should not render a separator when the danger item is first', async () => {
+    const wrapper = mount(ActionMenu, {
+      attachTo: document.body,
+      props: { label: 'More user actions', items: [items[1], items[0]] },
+    })
+    await wrapper.get('button').trigger('click')
+
+    expect(document.body.querySelector('.mint-menu-separator')).toBeNull()
+  })
+
   it('should close an open menu when its scroll context moves', async () => {
     const wrapper = mount(ActionMenu, {
       attachTo: document.body,
@@ -211,4 +267,14 @@ describe('ActionMenu', () => {
 
     expect(document.activeElement).toBe(trigger.element)
   })
+
+  it('should render a checked item as a checked menu radio when checked is set', async () => {
+    const wrapper = mount(ActionMenu, {
+      attachTo: document.body,
+      props: { label: 'Sort', items: [{ id: 'a', label: 'A', checked: true }, { id: 'b', label: 'B', checked: false }] },
+    })
+    await wrapper.get('button').trigger('click')
+    const radios = [...document.body.querySelectorAll('[role="menuitemradio"]')]
+    expect(radios.map((item) => item.getAttribute('aria-checked'))).toEqual(['true', 'false'])
+  })
 })

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

@@ -0,0 +1,21 @@
+import { mount } from '@vue/test-utils'
+import { describe, expect, it } from 'vitest'
+import AlertBox from '../../components/AlertBox.vue'
+
+describe('AlertBox', () => {
+  it('should render the action as a small secondary BaseButton when actionLabel is set (1h)', () => {
+    const wrapper = mount(AlertBox, { props: { type: 'warning', actionLabel: 'Recalibrate' } })
+
+    expect(wrapper.get('.mint-alert__actions button').classes()).toEqual(
+      expect.arrayContaining(['mint-button', 'mint-button--secondary', 'mint-button--sm']),
+    )
+  })
+
+  it('should emit action when the action button is clicked', async () => {
+    const wrapper = mount(AlertBox, { props: { actionLabel: 'Retry' } })
+
+    await wrapper.get('.mint-alert__actions button').trigger('click')
+
+    expect(wrapper.emitted('action')).toHaveLength(1)
+  })
+})

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

@@ -158,4 +158,29 @@ describe('AppAvatarMenu', () => {
       wrapper.unmount()
     })
   })
+
+  it('should render the panel on the shared popover surface when opened', async () => {
+    const wrapper = mount(AppAvatarMenu, { props: { userName: 'Ada Lovelace', items: [{ id: 'profile', label: 'Profile' }] } })
+
+    await wrapper.get('.mint-avatar-menu__trigger').trigger('click')
+
+    expect(wrapper.get('.mint-avatar-menu__panel').classes()).toContain('mint-popover')
+  })
+
+  it('should give sign out the shared danger menu item treatment when opened', async () => {
+    const wrapper = mount(AppAvatarMenu, { props: { userName: 'Ada Lovelace', items: [{ id: 'profile', label: 'Profile' }] } })
+
+    await wrapper.get('.mint-avatar-menu__trigger').trigger('click')
+
+    expect(wrapper.findAll('.mint-avatar-menu__item').at(-1)?.classes()).toContain('mint-menu-item--danger')
+  })
+
+  it('should paint the avatar with a solid primary fill', () => {
+    const styles = readFileSync(
+      resolve(process.cwd(), 'src/styles/components/app-avatar-menu.css'),
+      'utf8',
+    )
+
+    expect(styles).toMatch(/\.mint-avatar-menu__avatar\s*\{[^}]*background:\s*var\(--color-primary\);/s)
+  })
 })

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

@@ -89,6 +89,12 @@ describe('AppTopBar', () => {
       expect(wrapper.props()).not.toHaveProperty('showProfile')
     })
 
+    it('should not expose the retired pluginSwitcher prop (5a)', () => {
+      const wrapper = createWrapper({ title: 'Test App' })
+
+      expect(wrapper.props()).not.toHaveProperty('pluginSwitcher')
+    })
+
     it('should render without ThemeToggle by default', () => {
       const wrapper = createWrapper({ title: 'Test App' })
       expect(wrapper.findComponent(ThemeToggle).exists()).toBe(false)
@@ -1187,6 +1193,79 @@ describe('AppTopBar', () => {
       expect(wrapper.get('.mint-page-selector__label').text()).toBe('Overview')
       expect(wrapper.findAll('.mint-page-selector__item-label').map(item => item.text())).toEqual(['Overview', 'Reports'])
     })
+    describe('static plugin identity (5a)', () => {
+      const integratedPlugin = {
+        id: 'lcms', name: 'LC-MS Analysis', version: '2.4.0',
+        route_prefix: '/lcms', api_prefix: '/api/lcms',
+      }
+      const pages = [
+        { id: 'peaks', label: 'Peaks', to: '/' },
+        { id: 'report', label: 'Report', to: '/report' },
+      ]
+
+      it('should render the plugin name when integrated', () => {
+        mockPlatformCtx({ isIntegrated: true, plugin: integratedPlugin })
+
+        const wrapper = createWrapper()
+
+        expect(wrapper.get('.mint-topbar__plugin-name').text()).toBe('LC-MS Analysis')
+      })
+
+      it('should render the platform display name when integrated', () => {
+        mockPlatformCtx({ isIntegrated: true, plugin: { ...integratedPlugin, display_name: 'LC-MS Peak Review' } })
+
+        const wrapper = createWrapper()
+
+        expect(wrapper.get('.mint-topbar__plugin-name').text()).toBe('LC-MS Peak Review')
+      })
+
+      it('should not render the plugin version when integrated', () => {
+        mockPlatformCtx({ isIntegrated: true, plugin: integratedPlugin })
+
+        const wrapper = createWrapper()
+
+        expect(wrapper.text()).not.toContain('v2.4.0')
+      })
+
+      it('should not render the plugin identity text when standalone', () => {
+        const wrapper = createWrapper({ title: 'Test App' })
+
+        expect(wrapper.find('.mint-topbar__plugin-name').exists()).toBe(false)
+      })
+
+      it('should hide the plugin name when a page selector is shown', () => {
+        mockPlatformCtx({ isIntegrated: true, plugin: integratedPlugin })
+
+        const wrapper = createWrapper({ pageSelector: pages, currentPageSelectorId: 'peaks' })
+
+        expect(wrapper.find('.mint-topbar__plugin-name').exists()).toBe(false)
+      })
+
+      it('should hide the plugin name when the plugin declares several nav items', () => {
+        mockPlatformCtx({
+          isIntegrated: true,
+          plugin: {
+            ...integratedPlugin,
+            nav_items: [
+              { id: 'peaks', path: '/', label: 'Peaks' },
+              { id: 'report', path: '/report', label: 'Report' },
+            ],
+          },
+        })
+
+        const wrapper = createWrapper()
+
+        expect(wrapper.find('.mint-topbar__plugin-name').exists()).toBe(false)
+      })
+
+      it('should not repeat the title next to the integrated identity', () => {
+        mockPlatformCtx({ isIntegrated: true, plugin: integratedPlugin })
+
+        const wrapper = createWrapper({ title: 'LC-MS Analysis' })
+
+        expect(wrapper.find('.mint-topbar__title-only').exists()).toBe(false)
+      })
+    })
   })
 
   describe('shorthand navigation items', () => {

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

@@ -153,4 +153,24 @@ describe('AppTopBarPageSelectorInternal', () => {
     expect(icon.props('icon')).toBe(httpsIcon)
     expect(wrapper.get('.mint-plugin-icon__img').attributes('src')).toBe(httpsIcon)
   })
+
+  it('should render the menu on the shared popover surface when opened', async () => {
+    const wrapper = mount(AppTopBarPageSelectorInternal, {
+      props: { currentPageId: 'Workspace', pages: ['Workspace', 'Results'] },
+    })
+
+    await wrapper.get('.mint-page-selector__trigger').trigger('click')
+
+    expect(wrapper.get('.mint-page-selector__menu').classes()).toContain('mint-popover')
+  })
+
+  it('should mark the current page as a selected menu item when opened', async () => {
+    const wrapper = mount(AppTopBarPageSelectorInternal, {
+      props: { currentPageId: 'Workspace', pages: ['Workspace', 'Results'] },
+    })
+
+    await wrapper.get('.mint-page-selector__trigger').trigger('click')
+
+    expect(wrapper.findAll('.mint-page-selector__item')[0].classes()).toContain('mint-menu-item--selected')
+  })
 })

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

@@ -122,4 +122,78 @@ describe('AppTopBarPillNavInternal', () => {
       ],
     ])
   })
+
+  it('should render option dropdowns on the shared popover surface when opened', async () => {
+    const wrapper = mount(AppTopBarPillNavInternal, {
+      props: {
+        items: [{ id: 'visualize', label: 'Visualize', children: [{ id: 'pca', label: 'PCA' }] }],
+      },
+    })
+
+    await wrapper.get('.mint-pill-nav__item').trigger('click')
+
+    expect(wrapper.get('.mint-pill-nav__dropdown').classes()).toContain('mint-popover')
+  })
+
+  it('should render a dot when the item sets dot', () => {
+    const wrapper = mount(AppTopBarPillNavInternal, {
+      props: {
+        items: [
+          { id: 'home', label: 'Home' },
+          { id: 'instruments', label: 'Instruments', dot: true },
+        ],
+      },
+    })
+
+    expect(wrapper.findAll('.mint-pill-nav__item')[1].find('.mint-pill-nav__dot').exists()).toBe(true)
+  })
+
+  it('should name the dot for assistive technology', () => {
+    const wrapper = mount(AppTopBarPillNavInternal, {
+      props: { items: [{ id: 'instruments', label: 'Instruments', dot: true }] },
+    })
+    const dot = wrapper.get('.mint-pill-nav__dot')
+    expect([dot.attributes('role'), dot.attributes('aria-label'), dot.attributes('aria-hidden')]).toEqual(['img', 'Needs attention', undefined])
+  })
+
+  it('should not render a dot when the item leaves dot unset', () => {
+    const wrapper = mount(AppTopBarPillNavInternal, {
+      props: { items: [{ id: 'home', label: 'Home' }] },
+    })
+
+    expect(wrapper.find('.mint-pill-nav__dot').exists()).toBe(false)
+  })
+
+  it('should label a dropdown parent with its active child when a child is current', () => {
+    const wrapper = mount(AppTopBarPillNavInternal, {
+      props: {
+        currentItemId: 'projects',
+        items: [{
+          id: 'records',
+          label: 'Records',
+          children: [
+            { id: 'experiments', label: 'Experiments' },
+            { id: 'projects', label: 'Projects' },
+          ],
+        }],
+      },
+    })
+
+    expect(wrapper.find('.mint-pill-nav__item').text()).toBe('Projects')
+  })
+
+  it('should label a dropdown parent with its own label when no child is current', () => {
+    const wrapper = mount(AppTopBarPillNavInternal, {
+      props: {
+        currentItemId: 'home',
+        items: [{
+          id: 'records',
+          label: 'Records',
+          children: [{ id: 'projects', label: 'Projects' }],
+        }],
+      },
+    })
+
+    expect(wrapper.find('.mint-pill-nav__item').text()).toBe('Records')
+  })
 })

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

@@ -56,7 +56,7 @@ describe('ArtifactSelectorModal', () => {
   it('should emit the summary and close on select', async () => {
     const wrapper = await mountModal()
 
-    await wrapper.get('.mint-artifact-selector__row').trigger('click')
+    await wrapper.get('.mint-resource-picker__row').trigger('click')
     await flushPromises()
 
     expect(wrapper.emitted('select')?.[0]?.[0]).toMatchObject({ id: 1 })
@@ -67,7 +67,7 @@ describe('ArtifactSelectorModal', () => {
     const wrapper = await mountModal({ fetchDetailOnSelect: true })
     mockGet.mockResolvedValueOnce({ ...makeArtifact(), result: { x: 1 }, tree: [], summary: null })
 
-    await wrapper.get('.mint-artifact-selector__row').trigger('click')
+    await wrapper.get('.mint-resource-picker__row').trigger('click')
     await flushPromises()
 
     expect(wrapper.emitted('selectDetail')).toHaveLength(1)
@@ -79,13 +79,13 @@ describe('ArtifactSelectorModal', () => {
     const wrapper = await mountModal({ fetchDetailOnSelect: true })
     mockGet.mockRejectedValueOnce(new Error('Detail unavailable'))
 
-    await wrapper.get('.mint-artifact-selector__row').trigger('click')
+    await wrapper.get('.mint-resource-picker__row').trigger('click')
     await flushPromises()
 
     expect(wrapper.emitted('selectDetail')).toBeUndefined()
     expect(wrapper.emitted('select')).toBeUndefined()
     expect(wrapper.emitted('update:modelValue')).toBeUndefined()
-    expect(wrapper.get('.mint-artifact-selector__error').text()).toContain('Detail unavailable')
+    expect(wrapper.get('.mint-resource-picker__error').text()).toContain('Detail unavailable')
   })
 
   it('should archive a row without selecting it', async () => {
@@ -164,14 +164,28 @@ describe('ArtifactSelectorModal', () => {
     expect(wrapper.find('.mint-artifact-selector__action').exists()).toBe(true)
   })
 
+  it('should say Archived on the second line of an archived row', async () => {
+    mockGet.mockImplementation(async () => ({ artifacts: [makeArtifact({ status: 'archived' })] }))
+    const wrapper = await mountModal({ includeArchived: true })
+
+    expect(wrapper.get('.mint-resource-picker__meta').text()).toContain('Archived')
+  })
+
+  it('should label the action Restore on an archived row', async () => {
+    mockGet.mockImplementation(async () => ({ artifacts: [makeArtifact({ status: 'archived' })] }))
+    const wrapper = await mountModal({ includeArchived: true })
+
+    expect(wrapper.get('.mint-artifact-selector__action').text()).toBe('Restore')
+  })
+
   it('should scope rows to a reactive pluginId prop', async () => {
     const wrapper = await mountModal({ pluginId: 'plugin-a' })
-    expect(wrapper.findAll('.mint-artifact-selector__row')).toHaveLength(1)
+    expect(wrapper.findAll('.mint-resource-picker__row')).toHaveLength(1)
 
     await wrapper.setProps({ pluginId: 'plugin-b' })
     await flushPromises()
 
-    const rows = wrapper.findAll('.mint-artifact-selector__row')
+    const rows = wrapper.findAll('.mint-resource-picker__row')
     expect(rows).toHaveLength(1)
     expect(rows[0].text()).toContain('Peak Table')
   })

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

@@ -0,0 +1,38 @@
+import { mount } from '@vue/test-utils'
+import { describe, expect, it } from 'vitest'
+import AuditTrail from '../../components/AuditTrail.vue'
+import BaseSelect from '../../components/BaseSelect.vue'
+import type { AuditEntry } from '../../types'
+
+const entries: AuditEntry[] = [
+  { id: '1', type: 'update', action: 'updated S-0012', detail: 'Conc 12.5 µM → 25 µM', user: 'Lin Zhang', timestamp: '2026-09-24T14:32:00Z' },
+  { id: '2', type: 'create', action: 'created S-0012', user: 'Kai Wang', timestamp: '2026-09-24T09:05:00Z' },
+]
+
+describe('AuditTrail', () => {
+  it('should put who and what in one sentence when the entry has a user', () => {
+    const wrapper = mount(AuditTrail, { props: { entries } })
+
+    expect(wrapper.find('.mint-audit-trail__sentence').text()).toBe('Lin Zhang updated S-0012')
+  })
+
+  it('should render the detail text unchanged', () => {
+    const wrapper = mount(AuditTrail, { props: { entries } })
+
+    expect(wrapper.find('.mint-audit-trail__detail').text()).toBe('Conc 12.5 µM → 25 µM')
+  })
+
+  it('should filter with small BaseSelects when filters are shown', () => {
+    const wrapper = mount(AuditTrail, { props: { entries, showFilters: true } })
+
+    expect(wrapper.findAllComponents(BaseSelect).map(select => select.props('size'))).toEqual(['sm', 'sm'])
+  })
+
+  it('should narrow the list when a type filter is chosen', async () => {
+    const wrapper = mount(AuditTrail, { props: { entries, showFilters: true } })
+
+    await wrapper.findAllComponents(BaseSelect)[0].vm.$emit('update:modelValue', 'create')
+
+    expect(wrapper.findAll('.mint-audit-trail__entry')).toHaveLength(1)
+  })
+})

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

@@ -0,0 +1,43 @@
+import { describe, expect, it } from 'vitest'
+import { mount } from '@vue/test-utils'
+import BaseCheckbox from '../../components/BaseCheckbox.vue'
+
+describe('BaseCheckbox indeterminate', () => {
+  it('should set aria-checked="mixed" when indeterminate', () => {
+    const wrapper = mount(BaseCheckbox, { props: { indeterminate: true } })
+    expect(wrapper.find('input').attributes('aria-checked')).toBe('mixed')
+  })
+
+  it('should set the native indeterminate property when indeterminate', () => {
+    const wrapper = mount(BaseCheckbox, { props: { indeterminate: true } })
+    expect((wrapper.find('input').element as HTMLInputElement).indeterminate).toBe(true)
+  })
+
+  it('should render the dash mark when indeterminate', () => {
+    const wrapper = mount(BaseCheckbox, { props: { indeterminate: true } })
+    expect(wrapper.find('.mint-checkbox__box--indeterminate').exists()).toBe(true)
+  })
+
+  it('should omit aria-checked when not indeterminate', () => {
+    const wrapper = mount(BaseCheckbox, { props: { modelValue: true } })
+    expect(wrapper.find('input').attributes('aria-checked')).toBeUndefined()
+  })
+
+  it('should emit true when an indeterminate unchecked box is clicked', async () => {
+    const wrapper = mount(BaseCheckbox, { props: { modelValue: false, indeterminate: true } })
+    await wrapper.find('input').setValue(true)
+    expect(wrapper.emitted('update:modelValue')?.[0]).toEqual([true])
+  })
+})
+
+describe('BaseCheckbox ariaLabel', () => {
+  it('should name the native input from ariaLabel when there is no visible label', () => {
+    const wrapper = mount(BaseCheckbox, { props: { ariaLabel: 'Select sample S1' } })
+    expect(wrapper.find('input').attributes('aria-label')).toBe('Select sample S1')
+  })
+
+  it('should keep the aria-label off the root label when ariaLabel is set', () => {
+    const wrapper = mount(BaseCheckbox, { props: { ariaLabel: 'Select sample S1' } })
+    expect(wrapper.attributes('aria-label')).toBeUndefined()
+  })
+})

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

@@ -97,3 +97,46 @@ describe('BaseInput', () => {
     })
   })
 })
+
+describe('BaseInput prefix / suffix slots (1e)', () => {
+  it('should keep the bare input as the root when no slot is given', () => {
+    const wrapper = mount(BaseInput)
+    expect(wrapper.element.tagName).toBe('INPUT')
+  })
+
+  it('should render the suffix segment when a suffix slot is given', () => {
+    const wrapper = mount(BaseInput, { slots: { suffix: 'µL' } })
+    expect(wrapper.find('.mint-input-group__suffix').text()).toBe('µL')
+  })
+
+  it('should render the prefix segment when a prefix slot is given', () => {
+    const wrapper = mount(BaseInput, { slots: { prefix: '$' } })
+    expect(wrapper.find('.mint-input-group__prefix').text()).toBe('$')
+  })
+
+  it('should put fallthrough attributes on the inner input when wrapped', () => {
+    const wrapper = mount(BaseInput, { attrs: { id: 'vol' }, slots: { suffix: 'µL' } })
+    expect(wrapper.find('input').attributes('id')).toBe('vol')
+  })
+
+  it('should put a fallthrough class on the group when wrapped', () => {
+    const wrapper = mount(BaseInput, { attrs: { class: 'extra' }, slots: { suffix: 'µL' } })
+    expect(wrapper.classes()).toContain('extra')
+  })
+
+  it('should mark the group as errored when error is set', () => {
+    const wrapper = mount(BaseInput, { props: { error: true }, slots: { suffix: 'µL' } })
+    expect(wrapper.classes()).toContain('mint-input-group--error')
+  })
+
+  it('should mark the group as disabled when disabled is set', () => {
+    const wrapper = mount(BaseInput, { props: { disabled: true }, slots: { suffix: 'µL' } })
+    expect(wrapper.classes()).toContain('mint-input-group--disabled')
+  })
+
+  it('should emit update:modelValue from the inner input when wrapped', async () => {
+    const wrapper = mount(BaseInput, { slots: { suffix: 'µL' } })
+    await wrapper.find('input').setValue('250')
+    expect(wrapper.emitted('update:modelValue')?.[0]).toEqual(['250'])
+  })
+})