@morscherlab/mint-sdk 1.1.8 → 1.1.9

package/dist/utils/pluginIcon.d.ts

@@ -1,4 +1,4 @@
-export type PluginIconFormat = 'path' | 'data-url' | 'https-url' | 'structured' | 'fallback';
+export type PluginIconFormat = 'path' | 'data-url' | 'asset-url' | 'structured' | 'fallback';
 export interface StructuredPluginIconStop {
     offset: string;
     color: string;

package/dist/utils/sampleGroupPath.d.ts

@@ -0,0 +1,6 @@
+/** Split a group name into normalized hierarchy segments. */
+export declare function splitSampleGroupPath(groupName: string, separator: string): string[];
+/** First normalized hierarchy segment, used as the reorderable family key. */
+export declare function getSampleGroupMajorPrefix(groupName: string, separator: string): string;
+/** Normalized path above a concrete leaf group. */
+export declare function getSampleGroupParentPath(groupName: string, separator: string): string;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morscherlab/mint-sdk",
-  "version": "1.1.8",
+  "version": "1.1.9",
   "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/AppAvatarMenu.test.ts

@@ -1,8 +1,19 @@
+import { readFileSync } from 'node:fs'
+import { resolve } from 'node:path'
 import { mount } from '@vue/test-utils'
 import { describe, expect, it } from 'vitest'
 import AppAvatarMenu from '../../components/AppAvatarMenu.vue'
 
 describe('AppAvatarMenu', () => {
+  it('should vertically center avatar initials with a compact line box', () => {
+    const styles = readFileSync(
+      resolve(process.cwd(), 'src/styles/components/app-avatar-menu.css'),
+      'utf8',
+    )
+
+    expect(styles).toMatch(/\.mint-avatar-menu__avatar\s*\{[^}]*line-height:\s*1;/s)
+  })
+
   it('renders mixed menu actions and emits selected items', async () => {
     const docs = { id: 'docs', label: 'Docs', href: '/docs' }
     const profile = { id: 'profile', label: 'Profile' }

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

@@ -81,6 +81,12 @@ describe('AppTopBar', () => {
   })
 
   describe('default props behavior', () => {
+    it('should not expose the retired profile-button prop', () => {
+      const wrapper = createWrapper({ title: 'Test App' })
+
+      expect(wrapper.props()).not.toHaveProperty('showProfile')
+    })
+
     it('should render without ThemeToggle by default', () => {
       const wrapper = createWrapper({ title: 'Test App' })
       expect(wrapper.findComponent(ThemeToggle).exists()).toBe(false)
@@ -563,6 +569,46 @@ describe('AppTopBar', () => {
   })
 
   describe('combined features', () => {
+    it('does not bind an experiment when the integrated plugin is static', async () => {
+      vi.mocked(usePlatformContext).mockReturnValueOnce({
+        isIntegrated: computed(() => true),
+        context: ref({ isIntegrated: true, theme: 'system' }),
+        plugin: computed(() => ({
+          id: 'hmdb',
+          name: 'HMDB',
+          version: '1.0.0',
+          route_prefix: '/hmdb',
+          api_prefix: '/api/hmdb',
+          plugin_type: 'static',
+        })),
+        user: computed(() => undefined),
+        theme: computed(() => 'system' as const),
+        features: computed(() => undefined),
+        navigate: vi.fn(),
+        notify: vi.fn(),
+        sendToPlatform: vi.fn(),
+      })
+      const wrapper = mount(AppTopBar, {
+        props: { title: 'HMDB' },
+        global: {
+          plugins: [createPinia()],
+          provide: {
+            [APP_EXPERIMENT_KEY as symbol]: {} as AppExperimentState,
+          },
+          stubs: {
+            'router-link': { template: '<a><slot /></a>' },
+          },
+        },
+      })
+
+      await waitForAsyncComponents(wrapper)
+
+      expect([
+        wrapper.findComponent(ExperimentPopover).exists(),
+        wrapper.findComponent(ExperimentSelectorModal).exists(),
+      ]).toEqual([false, false])
+    })
+
     it('passes injected app experiment bindings to the popover and selector modal', async () => {
       vi.mocked(usePlatformContext).mockReturnValueOnce({
         isIntegrated: computed(() => true),
@@ -717,8 +763,8 @@ describe('AppTopBar', () => {
   describe('navigation prop surface', () => {
     it('renders a title-only layout without navigation props', () => {
       const wrapper = createWrapper({
-        title: 'Classic App',
-        subtitle: 'Old API',
+        title: 'Simple App',
+        subtitle: 'Current API',
       })
 
       expect(wrapper.find('.mint-topbar').exists()).toBe(true)
@@ -824,7 +870,7 @@ describe('AppTopBar', () => {
       expect(icons).toHaveLength(2)
       expect(icons[0].props('icon')).toBe(iconPath)
       expect(icons[1].props('icon')).toBe(pngIcon)
-      expect(icons.every((icon) => icon.props('variant') === 'tinted')).toBe(true)
+      expect(icons.every((icon) => icon.props('variant') === 'solid')).toBe(true)
 
       const pathIcons = wrapper.findAll('.mint-plugin-icon__svg')
       expect(pathIcons.map(icon => icon.find('path').attributes('d'))).toEqual(
@@ -981,10 +1027,16 @@ describe('AppTopBar', () => {
       expect(pluginIcon.exists()).toBe(true)
       expect(pluginIcon.props('icon')).toBe(iconPath)
       expect(pluginIcon.props('variant')).toBe('solid')
-      expect(pluginIcon.props('size')).toBe('md')
+      expect(pluginIcon.props('size')).toBe('topbar')
       expect(wrapper.find('.mint-topbar__logo-text').exists()).toBe(false)
     })
 
+    it('should render the icon inside the shared identity canvas', () => {
+      const wrapper = createWrapper({ title: 'Test App' })
+
+      expect(wrapper.find('.mint-topbar__identity').exists()).toBe(true)
+    })
+
     it('should pass plugin.color to PluginIcon as tone', () => {
       const iconPath = 'M13 10V3L4 14h7v7l9-11h-7z'
       mockPlatformCtx({
@@ -1001,7 +1053,7 @@ describe('AppTopBar', () => {
       expect(wrapper.findComponent({ name: 'PluginIcon' }).props('tone')).toBe('#22C55E')
     })
 
-    it('should not render PluginIcon when #icon slot is provided', () => {
+    it('should ignore the custom icon slot when integrated', () => {
       const iconPath = 'M13 10V3L4 14h7v7l9-11h-7z'
       mockPlatformCtx({
         isIntegrated: true,
@@ -1012,8 +1064,32 @@ describe('AppTopBar', () => {
         icon: '<div class="custom-icon">Custom</div>',
       })
 
+      expect(wrapper.find('.custom-icon').exists()).toBe(false)
+    })
+
+    it('should keep the custom icon slot when standalone', () => {
+      const wrapper = createWrapper({ title: 'Test App' }, {
+        icon: '<div class="custom-icon">Custom</div>',
+      })
+
       expect(wrapper.find('.custom-icon').exists()).toBe(true)
-      expect(wrapper.findComponent({ name: 'PluginIcon' }).exists()).toBe(false)
+    })
+
+    it('should ignore the custom icon slot when integrated metadata is unavailable', () => {
+      mockPlatformCtx({ isIntegrated: true, plugin: undefined })
+      const wrapper = createWrapper({ title: 'Test App' }, {
+        icon: '<div class="custom-icon">Custom</div>',
+      })
+
+      expect(wrapper.find('.custom-icon').exists()).toBe(false)
+    })
+
+    it('should use the shared fallback when integrated metadata is unavailable', () => {
+      mockPlatformCtx({ isIntegrated: true, plugin: undefined })
+
+      const wrapper = createWrapper({ title: 'Test App' })
+
+      expect(wrapper.findComponent({ name: 'PluginIcon' }).exists()).toBe(true)
     })
 
     it('should still render PluginIcon when icon does not start with M (PluginIcon shows fallback)', () => {
@@ -1029,7 +1105,7 @@ describe('AppTopBar', () => {
       expect(wrapper.find('.mint-topbar__logo-text').exists()).toBe(false)
     })
 
-    it('should not render PluginIcon when icon is empty string', () => {
+    it('should render the shared PluginIcon fallback when integrated metadata has no icon', () => {
       mockPlatformCtx({
         isIntegrated: true,
         plugin: { id: 'test', name: 'Test', version: '1.0', icon: '', route_prefix: '/test', api_prefix: '/api/test' },
@@ -1037,9 +1113,7 @@ describe('AppTopBar', () => {
 
       const wrapper = createWrapper({ title: 'Test App' })
 
-      expect(wrapper.findComponent({ name: 'PluginIcon' }).exists()).toBe(false)
-      expect(wrapper.find('.mint-topbar__logo-text').exists()).toBe(true)
-      expect(wrapper.find('.mint-topbar__logo-text').text()).toBe('M')
+      expect(wrapper.findComponent({ name: 'PluginIcon' }).exists()).toBe(true)
     })
 
     it('uses platform plugin nav metadata as the page selector when pageSelector is omitted', async () => {

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

@@ -122,7 +122,7 @@ describe('AppTopBarPageSelectorInternal', () => {
     expect(icons[0].props('icon')).toBe(iconPath)
     expect(icons[1].props('icon')).toBe(iconPath)
     expect(icons[2].props('icon')).toBe(pngIcon)
-    expect(icons.every((icon) => icon.props('variant') === 'tinted')).toBe(true)
+    expect(icons.every((icon) => icon.props('variant') === 'solid')).toBe(true)
 
     const pathIcons = wrapper.findAll('.mint-plugin-icon__svg')
     expect(pathIcons).toHaveLength(2)

package/src/__tests__/components/AutoGroupModal.adapter.test.ts

@@ -1,6 +1,6 @@
 import { describe, expect, it } from 'vitest'
 import {
-  candidateColumnIndices,
+  candidateColumns,
   engineFieldsToCards,
   engineGroupsToRail,
   engineToQcRoute,
@@ -35,7 +35,7 @@ describe('roleLabel', () => {
   })
 })
 
-describe('candidateColumnIndices', () => {
+describe('candidateColumns', () => {
   it('should include factors and replicates and drop constants/ignore', () => {
     const columns = [
       col({ index: 0, role: 'factor' }),
@@ -43,7 +43,7 @@ describe('candidateColumnIndices', () => {
       col({ index: 2, role: 'replicate' }),
       col({ index: 3, role: 'ignore' }),
     ]
-    expect(candidateColumnIndices(columns, new Set())).toEqual([0, 2])
+    expect(candidateColumns(columns, []).map(c => c.index)).toEqual([0, 2])
   })
 
   it('should also include a non-factor column already enabled in groupBy', () => {
@@ -51,7 +51,7 @@ describe('candidateColumnIndices', () => {
       col({ index: 0, role: 'factor' }),
       col({ index: 1, role: 'numeric' }),
     ]
-    expect(candidateColumnIndices(columns, new Set([1]))).toEqual([0, 1])
+    expect(candidateColumns(columns, [1]).map(c => c.index)).toEqual([0, 1])
   })
 })
 
@@ -61,7 +61,7 @@ describe('engineFieldsToCards', () => {
       col({ index: 0, name: 'Condition', role: 'factor', uniqueValues: ['Control', 'Treatment'] }),
       col({ index: 1, name: 'Replicate', role: 'replicate', uniqueValues: ['Rep1', 'Rep2'] }),
     ]
-    const { fields, enabled } = engineFieldsToCards(columns, new Set([0]))
+    const { fields, enabled } = engineFieldsToCards(columns, [0])
     expect(fields).toEqual([
       { key: 'Condition', role: 'Factor', vals: 'Control, Treatment', rep: false },
       { key: 'Replicate', role: 'Replicate', vals: 'Rep1, Rep2', rep: true },
@@ -71,7 +71,17 @@ describe('engineFieldsToCards', () => {
 
   it('should prefer displayName over name when present', () => {
     const columns = [col({ index: 0, name: 'c0', displayName: 'Dose', role: 'factor', uniqueValues: ['Low'] })]
-    expect(engineFieldsToCards(columns, new Set()).fields[0].key).toBe('Dose')
+    expect(engineFieldsToCards(columns, []).fields[0].key).toBe('Dose')
+  })
+
+  it('should map each card to its 1-based hierarchy layer from the groupBy order', () => {
+    const columns = [
+      col({ index: 0, name: 'Tissue', role: 'factor' }),
+      col({ index: 1, name: 'Timepoint', role: 'factor' }),
+      col({ index: 2, name: 'Rep', role: 'replicate' }),
+    ]
+    // Layer 1 = Timepoint (column 1), layer 2 = Tissue (column 0); Rep is off.
+    expect(engineFieldsToCards(columns, [1, 0]).layers).toEqual([2, 1, null])
   })
 })
 

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

@@ -5,6 +5,7 @@ import { PLUGIN_ICON_FALLBACK_PATH } from '../../utils/pluginIcon'
 
 const SAMPLE_PATH = 'M13 10V3L4 14h7v7l9-11h-7z'
 const SAMPLE_HTTPS_URL = 'https://example.com/icon.png'
+const SAMPLE_STATIC_SVG_URL = '/api/plugins/LEAF/assets/icon.svg'
 const SAMPLE_STRUCTURED_ICON = JSON.stringify({
   type: 'mint-icon',
   viewBox: '0 0 24 24',
@@ -138,6 +139,18 @@ describe('PluginIcon', () => {
       expect(img.attributes('loading')).toBe('lazy')
     })
 
+    it('should render same-origin SVG assets as images', () => {
+      const wrapper = mount(PluginIcon, { props: { icon: SAMPLE_STATIC_SVG_URL } })
+
+      expect(wrapper.find('img').attributes('src')).toBe(SAMPLE_STATIC_SVG_URL)
+    })
+
+    it('should reject protocol-relative SVG assets', () => {
+      const wrapper = mount(PluginIcon, { props: { icon: '//example.com/icon.svg' } })
+
+      expect(wrapper.find('img').exists()).toBe(false)
+    })
+
     it('should reject http URLs as fallback (mixed-content)', () => {
       const wrapper = mount(PluginIcon, { props: { icon: 'http://example.com/icon.png' } })
       expect(wrapper.find('img').exists()).toBe(false)
@@ -163,6 +176,12 @@ describe('PluginIcon', () => {
       expect(wrapper.classes()).toContain('mint-plugin-icon--lg')
     })
 
+    it('should apply the dedicated topbar size class', () => {
+      const wrapper = mount(PluginIcon, { props: { icon: SAMPLE_PATH, size: 'topbar' } })
+
+      expect(wrapper.classes()).toContain('mint-plugin-icon--topbar')
+    })
+
     it('should default size to md', () => {
       const wrapper = mount(PluginIcon, { props: { icon: SAMPLE_PATH } })
       expect(wrapper.classes()).toContain('mint-plugin-icon--md')

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

@@ -140,6 +140,14 @@ function mountIntegratedPageSelectorWorkspace(
 }
 
 describe('PluginWorkspaceView', () => {
+  it('should not forward the retired profile-button prop', () => {
+    const wrapper = mount(PluginWorkspaceView, {
+      global: globalOptions,
+    })
+
+    expect(wrapper.props()).not.toHaveProperty('showProfile')
+  })
+
   it('renders the standard AppLayout, AppTopBar, and AppSidebar plugin shell', () => {
     const wrapper = mount(PluginWorkspaceView, {
       props: {

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

@@ -0,0 +1,82 @@
+import { readFileSync } from 'node:fs'
+import { resolve } from 'node:path'
+import { describe, expect, it } from 'vitest'
+
+const retiredSelectors: Record<string, readonly string[]> = {
+  'app-plugin-switcher.css': [
+    'mint-plugin-switcher__swatch',
+  ],
+  'dose-calculator.css': [
+    'mint-dose-calculator__mw-input',
+  ],
+  'experiment-popover.css': [
+    'mint-experiment-popover__check-icon',
+    'mint-experiment-popover__divider',
+    'mint-experiment-popover__footer',
+    'mint-experiment-popover__save-btn',
+    'mint-experiment-popover__save-btn--loading',
+    'mint-experiment-popover__save-btn--success',
+    'mint-experiment-popover__save-hint',
+    'mint-experiment-popover__save-icon',
+    'mint-experiment-popover__spinner',
+  ],
+  'experiment-selector-modal.css': [
+    'mint-experiment-selector__filters',
+    'mint-experiment-selector__status-filter',
+  ],
+  'protocol-step-editor.css': [
+    'mint-protocol-editor__field-row',
+  ],
+  'reagent-editor.css': [
+    'mint-reagent-editor__row',
+  ],
+  'sample-hierarchy-tree.css': [
+    'mint-sample-tree__node--selected',
+  ],
+  'sample-selector.css': [
+    'mint-popover-enter-active',
+    'mint-popover-enter-from',
+    'mint-popover-leave-active',
+    'mint-popover-leave-to',
+    'mint-sample-selector__level-badge',
+    'mint-sample-selector__level-btn',
+    'mint-sample-selector__level-desc',
+    'mint-sample-selector__level-example',
+    'mint-sample-selector__level-info',
+    'mint-sample-selector__level-title',
+    'mint-sample-selector__popover',
+    'mint-sample-selector__popover-body',
+    'mint-sample-selector__popover-header',
+  ],
+  'schedule-calendar.css': [
+    'mint-schedule__grid-line',
+  ],
+  'well-plate.css': [
+    'mint-well-plate__well--blank',
+    'mint-well-plate__well--control',
+    'mint-well-plate__well--iqc',
+    'mint-well-plate__well--qc',
+    'mint-well-plate__well--readonly',
+    'mint-well-plate__well--sample',
+  ],
+}
+
+const cases = Object.entries(retiredSelectors).flatMap(([file, selectors]) =>
+  selectors.map(selector => ({ file, selector })),
+)
+
+function classSelectorPattern(selector: string): RegExp {
+  const escaped = selector.replace(/[.*+?^${}()|[\]\\]/g, '\\$&')
+  return new RegExp(`\\.${escaped}(?![A-Za-z0-9_-])`)
+}
+
+describe('retired component styles', () => {
+  it.each(cases)('should omit $selector from $file', ({ file, selector }) => {
+    const styles = readFileSync(
+      resolve(process.cwd(), 'src/styles/components', file),
+      'utf8',
+    )
+
+    expect(styles).not.toMatch(classSelectorPattern(selector))
+  })
+})

package/src/__tests__/components/SampleSelector.drag.test.ts

@@ -97,4 +97,30 @@ describe('SampleSelector drag helpers', () => {
     expect(drag.draggingGroup.value).toBeNull()
     expect(drag.reorderTarget.value).toBeNull()
   })
+
+  it('rejects leaf reordering across different immediate parents', () => {
+    const state = ref<SampleGroup[]>([
+      { name: 'Liver / High / 5min', color: '#111111', samples: ['L1'] },
+      { name: 'Liver / Low / 10min', color: '#222222', samples: ['L2'] },
+    ])
+    const drag = useSampleSelectorDrag(state)
+
+    drag.handleGroupDragStart('Liver / High / 5min', 'sub', createDragEvent())
+    drag.handleGroupDragOver('Liver / Low / 10min', 'sub', createDragEvent({ clientY: 2 }))
+
+    expect(drag.reorderTarget.value).toBeNull()
+  })
+
+  it('accepts leaf reordering within the same immediate parent', () => {
+    const state = ref<SampleGroup[]>([
+      { name: 'Liver / High / 5min', color: '#111111', samples: ['L1'] },
+      { name: 'Liver / High / 10min', color: '#222222', samples: ['L2'] },
+    ])
+    const drag = useSampleSelectorDrag(state)
+
+    drag.handleGroupDragStart('Liver / High / 5min', 'sub', createDragEvent())
+    drag.handleGroupDragOver('Liver / High / 10min', 'sub', createDragEvent({ clientY: 2 }))
+
+    expect(drag.reorderTarget.value).toBe('Liver / High / 10min')
+  })
 })

package/src/__tests__/components/SampleSelector.groups.test.ts

@@ -5,8 +5,7 @@ import {
   getSampleGroupMajorPrefix,
   moveSampleToGroup,
   removeSampleFromGroup,
-  removeSampleGroup,
-  removeSampleMajorGroup,
+  removeSampleGroups,
   reorderSampleGroup,
   reorderSampleMajorGroup,
 } from '../../components/SampleSelector.groups'
@@ -29,6 +28,10 @@ describe('SampleSelector group helpers', () => {
     expect(getSampleGroupMajorPrefix('Ungrouped', '/')).toBe('Ungrouped')
   })
 
+  it('normalizes whitespace around auto-group path separators', () => {
+    expect(getSampleGroupMajorPrefix('Liver / High / 5min', '/')).toBe('Liver')
+  })
+
   it('moves a sample from one group to another without duplicating target samples', () => {
     const moved = moveSampleToGroup(groups, 'S1', 'Treatment/A', 'Control/A')
 
@@ -37,15 +40,14 @@ describe('SampleSelector group helpers', () => {
   })
 
   it('removes groups and samples without mutating the source array', () => {
-    expect(removeSampleGroup(groups, 'Treatment/B').map(group => group.name)).toEqual([
+    expect(removeSampleGroups(groups, ['Treatment/B']).map(group => group.name)).toEqual([
       'Treatment/A',
       'Control/A',
       'Control/B',
     ])
+    // A whole family or any intermediate level removes as a batch of leaf names.
     expect(
-      removeSampleMajorGroup(groups, {
-        subGroups: [{ name: 'Treatment/A' }, { name: 'Treatment/B' }],
-      }).map(group => group.name),
+      removeSampleGroups(groups, ['Treatment/A', 'Treatment/B']).map(group => group.name),
     ).toEqual(['Control/A', 'Control/B'])
     expect(removeSampleFromGroup(groups, 'S1', 'Treatment/A')[0].samples).toEqual([])
     expect(groups[0].samples).toEqual(['S1'])
@@ -78,4 +80,15 @@ describe('SampleSelector group helpers', () => {
       'Treatment/B',
     ])
   })
+
+  it('reorders auto-group families whose separators include spaces', () => {
+    const autoGroups: SampleGroup[] = [
+      { name: 'Liver / High / 5min', color: '#111111', samples: ['L1'] },
+      { name: 'Kidney / High / 5min', color: '#222222', samples: ['K1'] },
+    ]
+
+    expect(
+      reorderSampleMajorGroup(autoGroups, 'Liver', 'Kidney', 'after').map(group => group.name),
+    ).toEqual(['Kidney / High / 5min', 'Liver / High / 5min'])
+  })
 })

package/src/__tests__/components/SampleSelector.selection.test.ts

@@ -1,21 +1,13 @@
 import { ref } from 'vue'
 import { describe, expect, it } from 'vitest'
-import type { SampleGroup } from '../../types'
-import type { SampleMajorGroup } from '../../composables/useSampleGroups'
 import { useSampleSelectorSelection } from '../../components/SampleSelector.selection'
 
-const groups: SampleGroup[] = [
-  { name: 'Control/A', color: '#111111', samples: ['S1', 'S2'] },
-  { name: 'Treatment/A', color: '#222222', samples: ['S3'] },
-]
-
 function createSelection(selected: string[] = []) {
   const selectedRef = ref(selected)
   const emitted: string[][] = []
   const selection = useSampleSelectorSelection({
     selected: () => selectedRef.value,
     samples: () => ['S1', 'S2', 'S3'],
-    findGroup: groupName => groups.find(group => group.name === groupName),
     emitSelected: samples => {
       emitted.push(samples)
       selectedRef.value = samples
@@ -39,32 +31,26 @@ describe('SampleSelector selection helpers', () => {
     expect(selection.isAllSelected.value).toBe(false)
   })
 
-  it('toggles sample groups and exposes group selection state', () => {
+  it('toggles an arbitrary sample set and exposes its selection state', () => {
     const { emitted, selection } = createSelection(['S1'])
 
-    expect(selection.isGroupPartiallySelected('Control/A')).toBe(true)
-    expect(selection.isGroupFullySelected('Control/A')).toBe(false)
+    expect(selection.isPartiallySelected(['S1', 'S2'])).toBe(true)
+    expect(selection.isFullySelected(['S1', 'S2'])).toBe(false)
 
-    selection.toggleGroupSamples('Control/A')
+    selection.toggleSamplesSelection(['S1', 'S2'])
 
     expect(emitted[0]).toEqual(['S1', 'S2'])
-    expect(selection.isGroupFullySelected('Control/A')).toBe(true)
+    expect(selection.isFullySelected(['S1', 'S2'])).toBe(true)
   })
 
-  it('handles major groups through their aggregate sample list', () => {
-    const majorGroup: SampleMajorGroup = {
-      name: 'Control',
-      color: '#111111',
-      subGroups: [],
-      allSamples: ['S1', 'S2'],
-    }
+  it('clears a fully selected set, so a hierarchy node can deselect its subtree', () => {
     const { emitted, selection } = createSelection(['S1', 'S2'])
 
-    expect(selection.isMajorGroupFullySelected(majorGroup)).toBe(true)
+    expect(selection.isFullySelected(['S1', 'S2'])).toBe(true)
 
-    selection.toggleMajorGroupSamples(majorGroup)
+    selection.toggleSamplesSelection(['S1', 'S2'])
 
     expect(emitted[0]).toEqual([])
-    expect(selection.isMajorGroupPartiallySelected(majorGroup)).toBe(false)
+    expect(selection.isPartiallySelected(['S1', 'S2'])).toBe(false)
   })
 })

package/src/__tests__/components/SmartGroupFieldRecipe.groups.test.ts

@@ -52,6 +52,11 @@ describe('computeFieldGroups', () => {
     const groups = computeFieldGroups(SAMPLES, FIELDS, [true, true, false], PALETTE)
     expect(groups.map(g => g.color)).toEqual(['c1', 'c2', 'c3'])
   })
+
+  it('should join field values following an explicit layer order', () => {
+    const groups = computeFieldGroups(SAMPLES, FIELDS, [true, true, false], PALETTE, [1, 0])
+    expect(groups.map(g => g.name)).toEqual(['Vehicle_Control', 'Low_Treatment', 'High_Treatment'])
+  })
 })
 
 describe('appendQcGroup', () => {

package/src/__tests__/composables/autoGroup/compose.test.ts

@@ -42,15 +42,14 @@ describe('composeGroups', () => {
         },
       ],
     })
-    // Group names carry class context: "Biological / Tissues / <factor>".
-    // The class label is prepended so labels from different classes don't
-    // collide when they share a factor value.
+    // A single experimental class needs no disambiguating prefix: group names
+    // start directly at the first enabled factor layer.
     expect(result.experimentalGroups!.map(g => g.name).sort()).toEqual([
-      'Biological / Tissues / Kidney',
-      'Biological / Tissues / Liver',
+      'Kidney',
+      'Liver',
     ])
     expect(
-      result.experimentalGroups!.find(g => g.name === 'Biological / Tissues / Kidney')!.samples,
+      result.experimentalGroups!.find(g => g.name === 'Kidney')!.samples,
     ).toEqual(['s1', 's2'])
   })
 
@@ -184,8 +183,8 @@ describe('composeGroups', () => {
       ],
     })
     expect(result.experimentalGroups!.length).toBe(1)
-    // Class-prefixed group name (cls.label === 'Biological' → "Biological / Drug-A").
-    expect(result.experimentalGroups![0].name).toBe('Biological / Drug-A')
+    // Single experimental class → unprefixed post-alias factor value.
+    expect(result.experimentalGroups![0].name).toBe('Drug-A')
     expect(result.experimentalGroups![0].samples).toEqual(['s1', 's2'])
     expect(result.excludedSamples).toEqual(['s3'])
   })
@@ -221,7 +220,7 @@ describe('composeGroups', () => {
       ],
     })
     expect(result.metadata[0].fields.Tissue).toBe('kidney_panel')
-    // Group label is class-prefixed: cls.label ("Biological") + post-alias value.
-    expect(result.metadata[0].group).toBe('Biological / kidney_panel')
+    // Single experimental class → unprefixed post-alias value as the group label.
+    expect(result.metadata[0].group).toBe('kidney_panel')
   })
 })