@morscherlab/mint-sdk 1.1.25 → 1.2.0-beta.10

package/src/components/WellPlate.vue

@@ -32,6 +32,7 @@ import {
   wellStyle,
 } from './WellPlate.rendering'
 import { DEFAULT_WELL_LEGEND_ITEMS } from './WellPlate.legend'
+import DataStateInternal from './internal/DataStateInternal.vue'
 
 interface Props {
   modelValue?: string[]
@@ -59,6 +60,19 @@ interface Props {
   rowConditions?: RowCondition[]
   allowSampleDrop?: boolean
   sampleDropParser?: WellSampleDropParser
+  /** Replace the plate grid with a loading placeholder. */
+  loading?: boolean
+  /**
+   * Error message. When set, the plate grid is replaced by an error state.
+   * `null`/`undefined` renders normally.
+   */
+  error?: string | null
+  /**
+   * Opt-in empty-state headline. A blank plate is meaningful, so the empty
+   * state only replaces the grid when this message is supplied and no wells
+   * carry data.
+   */
+  emptyMessage?: string
 }
 
 const props = withDefaults(defineProps<Props>(), {
@@ -114,6 +128,12 @@ interface WellEditorSlotProps {
 
 defineSlots<{
   'well-editor'?: (props: WellEditorSlotProps) => unknown
+  /** Replaces the default loading placeholder. */
+  loading?: () => unknown
+  /** Replaces the default error placeholder. */
+  error?: (props: { error: string }) => unknown
+  /** Replaces the default empty placeholder. */
+  empty?: () => unknown
 }>()
 
 const plateRef = ref<HTMLElement | null>(null)
@@ -166,7 +186,10 @@ const {
   handleDragLeave,
   handleDrop,
   handleDragEnd,
+  handleWellMoveKeydown,
   handleKeyDown,
+  moveAnnouncement,
+  moveAnnouncerStyle,
 } = useWellPlateInteraction({
   modelValue: () => props.modelValue,
   selectionMode: () => props.selectionMode,
@@ -233,6 +256,11 @@ const containerStyle = computed(() =>
   }
 )
 
+/** Empty state is opt-in: it needs an `emptyMessage` and a plate with no well data. */
+const showEmptyState = computed(() =>
+  Boolean(props.emptyMessage) && Object.keys(props.wells).length === 0,
+)
+
 const tableStyle = computed(() => ({
   borderCollapse: 'separate' as const,
   borderSpacing: sizeConfig.value.gap,
@@ -246,7 +274,25 @@ const tableStyle = computed(() => ({
     :class="['mint-well-plate', isFillMode ? 'mint-well-plate--fill' : 'mint-well-plate--inline']"
     :style="containerStyle"
   >
-    <div class="mint-well-plate__scroll">
+    <div v-if="error" class="mint-well-plate__state">
+      <slot name="error" :error="error">
+        <DataStateInternal state="error" :title="error" />
+      </slot>
+    </div>
+
+    <div v-else-if="loading" class="mint-well-plate__state">
+      <slot name="loading">
+        <DataStateInternal state="loading" loading-label="Loading plate" />
+      </slot>
+    </div>
+
+    <div v-else-if="showEmptyState" class="mint-well-plate__state">
+      <slot name="empty">
+        <DataStateInternal state="empty" :title="emptyMessage" />
+      </slot>
+    </div>
+
+    <div v-else class="mint-well-plate__scroll">
       <div class="mint-well-plate__content">
         <table
           ref="tableRef"
@@ -390,8 +436,9 @@ const tableStyle = computed(() => ({
                 @dragleave="handleDragLeave"
                 @drop="handleDrop(well, $event)"
                 @dragend="handleDragEnd"
-                @keydown.enter="handleWellClick(well, $event as unknown as MouseEvent)"
-                @keydown.space.prevent="handleWellClick(well, $event as unknown as MouseEvent)"
+                @keydown="handleWellMoveKeydown(well, $event)"
+                @keydown.enter.exact="handleWellClick(well, $event as unknown as MouseEvent)"
+                @keydown.space.exact.prevent="handleWellClick(well, $event as unknown as MouseEvent)"
               >
                 <!-- Well label text (from metadata.label) -->
                 <span
@@ -489,9 +536,8 @@ const tableStyle = computed(() => ({
         />
       </slot>
     </template>
+
+    <!-- Keyboard well-move announcements for screen readers -->
+    <div role="status" aria-live="polite" :style="moveAnnouncerStyle">{{ moveAnnouncement }}</div>
   </div>
 </template>
-
-<style>
-@import '../styles/components/well-plate.css';
-</style>

package/src/components/index.ts

@@ -7,12 +7,14 @@ export { default as BaseCheckbox } from './BaseCheckbox.vue'
 export { default as BaseToggle } from './BaseToggle.vue'
 export { default as BaseRadioGroup } from './BaseRadioGroup.vue'
 export { default as BaseSlider } from './BaseSlider.vue'
+/** Range slider with a gradient color track and color-coded value badge for threshold visualization. @deprecated Unused by the MINT platform and scheduled for removal in MINT 1.3; use `BaseSlider` instead. */
 export { default as ColorSlider } from './ColorSlider.vue'
 export { default as BaseTabs } from './BaseTabs.vue'
 export { default as BaseModal } from './BaseModal.vue'
 export { default as SegmentedControl } from './SegmentedControl.vue'
 export { default as MultiSelect } from './MultiSelect.vue'
 export { default as BasePill } from './BasePill.vue'
+/** Button that opens a dropdown menu for selecting one option from a list. @deprecated Unused by the MINT platform and scheduled for removal in MINT 1.3; use `ActionMenu` instead. */
 export { default as DropdownButton } from './DropdownButton.vue'
 export { default as Calendar } from './Calendar.vue'
 export { default as DataFrame } from './DataFrame.vue'
@@ -22,6 +24,7 @@ export { default as FormField } from './FormField.vue'
 export { default as DatePicker } from './DatePicker.vue'
 export { default as TimePicker } from './TimePicker.vue'
 export { default as TagsInput } from './TagsInput.vue'
+export { default as SecretInput } from './SecretInput.vue'
 export { default as NumberInput } from './NumberInput.vue'
 export { default as FileUploader } from './FileUploader.vue'
 
@@ -97,11 +100,15 @@ export { default as ProtocolStepEditor } from './ProtocolStepEditor.vue'
 
 // Scientific display components
 export { default as ScientificNumber } from './ScientificNumber.vue'
+/** Renders a chemical formula string (H₂O, C₆H₁₂O₆, Ca(OH)₂) with typographically correct subscripts and superscripts for charges. @deprecated Unused by the MINT platform and scheduled for removal in MINT 1.3; no platform replacement is planned. */
 export { default as ChemicalFormula } from './ChemicalFormula.vue'
 export { default as SequenceProgressBar } from './SequenceProgressBar.vue'
+/** Filterable instrument alert/event list keyed by each alert's required stable event_key. @deprecated Unused by the MINT platform and scheduled for removal in MINT 1.3; instrument UI moves to the mld-ms plugins. */
 export { default as InstrumentAlertLog } from './InstrumentAlertLog.vue'
 export { default as InstrumentStateBadge } from './InstrumentStateBadge.vue'
+/** Compact card for live instrument monitor status, sample, method, sequence progress, and ETA. @deprecated Unused by the MINT platform and scheduled for removal in MINT 1.3; instrument UI moves to the mld-ms plugins. */
 export { default as InstrumentStatusCard } from './InstrumentStatusCard.vue'
+/** Table for Xcalibur-compatible LCMS sequence rows with optional reorder/remove/duplicate controls. @deprecated Unused by the MINT platform and scheduled for removal in MINT 1.3; instrument UI moves to the mld-ms plugins. */
 export { default as LcmsSequenceTable } from './LcmsSequenceTable.vue'
 
 // Scientific input components
@@ -125,8 +132,10 @@ export { default as ExperimentCodeBadge } from './ExperimentCodeBadge.vue'
 
 // Scheduling / booking components
 export { default as DateTimePicker } from './DateTimePicker.vue'
+/** Paired start/end time pickers that validate range order and display computed duration. @deprecated Unused by the MINT platform and scheduled for removal in MINT 1.3; use `TimePicker` instead. */
 export { default as TimeRangeInput } from './TimeRangeInput.vue'
 export { default as ScheduleCalendar } from './ScheduleCalendar.vue'
+/** Card displaying a lab resource with availability status, specs, tags, and a book action. @deprecated Unused by the MINT platform and scheduled for removal in MINT 1.3; no platform replacement is planned. */
 export { default as ResourceCard } from './ResourceCard.vue'
 export { default as SectionCard } from './SectionCard.vue'
 

package/src/components/internal/AppTopBarPageSelectorInternal.vue

@@ -24,7 +24,7 @@ const emit = defineEmits<{
   select: [page: PageSelectorItem]
 }>()
 
-const { isOpen, rootRef, close, toggle } = useDropdownState()
+const { isOpen, rootRef, triggerRef, close, toggle } = useDropdownState()
 const normalizedPages = computed<PageSelectorItem[]>(() => props.pages.map(normalizeItemInput))
 
 const current = computed<PageSelectorItem | undefined>(() =>
@@ -45,6 +45,7 @@ function handleSelect(page: PageSelectorItem) {
 <template>
   <div ref="rootRef" class="mint-page-selector" :style="{ minWidth }">
     <button
+      ref="triggerRef"
       type="button"
       class="mint-page-selector__trigger"
       :class="{ 'mint-page-selector__trigger--open': isOpen }"
@@ -121,7 +122,3 @@ function handleSelect(page: PageSelectorItem) {
     </div>
   </div>
 </template>
-
-<style>
-@import '../../styles/components/app-page-selector.css';
-</style>

package/src/components/internal/AppTopBarPillNavInternal.vue

@@ -188,7 +188,3 @@ useEventListener(() => document, 'click', handleClickOutside)
     </div>
   </nav>
 </template>
-
-<style>
-@import '../../styles/components/app-pill-nav.css';
-</style>

package/src/components/internal/DataStateInternal.vue

@@ -0,0 +1,74 @@
+<script setup lang="ts">
+/**
+ * Shared loading / error / empty presentation for the SDK data components.
+ *
+ * Internal: not exported from the package entrypoints. Data components render
+ * this instead of hand-rolling their own placeholder markup so that the
+ * loading, error and empty states look the same everywhere.
+ */
+import { computed } from 'vue'
+import EmptyState from '../EmptyState.vue'
+import LoadingSpinner from '../LoadingSpinner.vue'
+
+/** Single-path warning triangle used for the error state. */
+const ERROR_ICON_PATH
+  = 'M10.29 3.86 1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z'
+  + 'M12 9v4M12 17h.01'
+
+interface Props {
+  /** Which of the three placeholder states to render. */
+  state: 'loading' | 'error' | 'empty'
+  /** Headline for the empty/error state. */
+  title?: string
+  /** Supporting copy for the empty/error state. */
+  description?: string
+  /** Custom `<path d>` for the empty state icon (the error state has its own). */
+  iconPath?: string
+  /** Placeholder scale; also drives the loading spinner size. */
+  size?: 'sm' | 'md' | 'lg'
+  /** `EmptyState` layout variant. */
+  variant?: 'illustrated' | 'inline'
+  /** Accessible label (and visible caption) for the loading state. */
+  loadingLabel?: string
+  /** Optional call-to-action rendered under the empty/error copy. */
+  actionLabel?: string
+}
+
+const props = withDefaults(defineProps<Props>(), {
+  size: 'md',
+  variant: 'illustrated',
+  loadingLabel: 'Loading',
+})
+
+const emit = defineEmits<{
+  action: []
+}>()
+
+const spinnerSize = computed(() => (props.size === 'sm' ? 'sm' : props.size === 'lg' ? 'lg' : 'md'))
+</script>
+
+<template>
+  <div
+    :class="['mint-data-state', `mint-data-state--${state}`, `mint-data-state--${size}`]"
+    :data-state="state"
+  >
+    <template v-if="state === 'loading'">
+      <LoadingSpinner :size="spinnerSize" :label="loadingLabel" />
+      <p class="mint-data-state__loading-text" aria-hidden="true">{{ loadingLabel }}</p>
+    </template>
+    <EmptyState
+      v-else
+      :title="title"
+      :description="description"
+      :icon-path="state === 'error' ? ERROR_ICON_PATH : iconPath"
+      :color="state === 'error' ? 'error' : 'muted'"
+      :size="size"
+      :variant="variant"
+      :action-label="actionLabel"
+      @action="emit('action')"
+    >
+      <slot />
+    </EmptyState>
+  </div>
+</template>
+

package/src/components/internal/FormSectionRenderer.vue

@@ -72,7 +72,3 @@ const gridStyle = computed(() => ({
     <slot :name="`section:${section.id}:after`" :form="builder.form" />
   </div>
 </template>
-
-<style>
-@import '../../styles/components/form-builder.css';
-</style>

package/src/components/internal/WellEditPopupInternal.vue

@@ -1,7 +1,8 @@
 <script setup lang="ts">
-import { ref, watch, computed } from 'vue'
+import { onBeforeUnmount, onMounted, ref, watch, computed } from 'vue'
 import type { Well, WellEditData, WellEditField } from '../../types'
 import { useEventListener } from '../../composables/useEventListener'
+import { useFocusTrap } from '../../composables/useFocusTrap'
 
 interface Props {
   wellId: string
@@ -86,6 +87,22 @@ function handleKeydown(e: KeyboardEvent) {
 
 useEventListener(() => document, 'keydown', handleKeydown)
 
+// The popup has no open/close prop of its own — the parent mounts and unmounts it —
+// so the trap activates on mount and releases (restoring focus) just before unmount,
+// the same lifecycle BaseModal drives off `modelValue`.
+const containerRef = ref<HTMLElement | null>(null)
+const trapActive = ref(false)
+
+useFocusTrap({ containerRef, active: trapActive })
+
+onMounted(() => {
+  trapActive.value = true
+})
+
+onBeforeUnmount(() => {
+  trapActive.value = false
+})
+
 const sampleTypeButtons = [
   { type: 'sample', label: 'S', tooltip: 'Sample' },
   { type: 'blank', label: 'B', tooltip: 'Blank' },
@@ -101,8 +118,10 @@ const sampleTypeButtons = [
 
     <!-- Popup -->
     <div
+      ref="containerRef"
       class="mint-well-edit-popup"
       :style="popupStyle"
+      tabindex="-1"
       @click.stop
     >
       <!-- Header -->
@@ -224,7 +243,3 @@ const sampleTypeButtons = [
     </div>
   </Teleport>
 </template>
-
-<style>
-@import '../../styles/components/well-edit-popup.css';
-</style>

package/src/components/internal/WorkspaceControlsInternal.vue

@@ -0,0 +1,20 @@
+<script setup lang="ts">
+/**
+ * Internal: renders PluginWorkspaceView's default (main content) slot bound to the
+ * control-schema-derived scoped-slot payload (active view, values, component bindings/props).
+ * Not part of the public SDK surface — see PluginWorkspaceView.vue for the public component.
+ */
+import type { PluginWorkspaceControlsModel } from '../../composables/pluginWorkspaceModel'
+
+defineProps<{
+  controls: PluginWorkspaceControlsModel
+}>()
+
+defineSlots<{
+  default?: (props: PluginWorkspaceControlsModel) => unknown
+}>()
+</script>
+
+<template>
+  <slot v-bind="controls" />
+</template>

package/src/components/internal/WorkspaceShellInternal.vue

@@ -0,0 +1,125 @@
+<script setup lang="ts">
+/**
+ * Internal: AppLayout + AppTopBar for PluginWorkspaceView, driven by a single `shell` model.
+ * Owns the responsive/collapse layout props and the top bar's default rendering; the caller
+ * decides whether to override the `topbar`/`sidebar` slots and supplies the sidebar content.
+ * Not part of the public SDK surface — see PluginWorkspaceView.vue for the public component.
+ */
+import type {
+  AccountMenuItem,
+  PageSelectorItem,
+  PillNavItem,
+  PillNavOption,
+  PluginSwitcherPlugin,
+} from '../../types'
+import AppLayout from '../AppLayout.vue'
+import AppTopBar from '../AppTopBar.vue'
+import type { PluginWorkspaceShellModel } from '../../composables/pluginWorkspaceModel'
+
+defineProps<{
+  shell: PluginWorkspaceShellModel
+}>()
+
+const emit = defineEmits<{
+  'page-selector-select': [page: PageSelectorItem]
+  'pill-select': [item: PillNavItem]
+  'pill-option-select': [option: PillNavOption, item: PillNavItem]
+  'plugin-switcher-select': [plugin: PluginSwitcherPlugin]
+  'plugin-switcher-install': []
+  'account-menu-select': [item: AccountMenuItem]
+  'sign-out': []
+  'notifications-click': []
+  'settings-values-change': [data: Record<string, unknown>]
+  'admin-click': []
+}>()
+
+function handlePillOptionSelect(option: PillNavOption, item: PillNavItem) {
+  emit('pill-option-select', option, item)
+}
+
+defineSlots<{
+  topbar?: (props: PluginWorkspaceShellModel['controls']) => unknown
+  sidebar?: (props: PluginWorkspaceShellModel['controls']) => unknown
+  default?: (props: PluginWorkspaceShellModel['controls']) => unknown
+  icon?: (props: Record<string, unknown>) => unknown
+  logo?: (props: Record<string, unknown>) => unknown
+  'page-selector-icon'?: (props: Record<string, unknown>) => unknown
+  'page-selector-item-icon'?: (props: Record<string, unknown>) => unknown
+  nav?: (props: Record<string, unknown>) => unknown
+  center?: (props: Record<string, unknown>) => unknown
+  actions?: (props: Record<string, unknown>) => unknown
+  'account-menu-items'?: (props: Record<string, unknown>) => unknown
+  'account-menu-item-icon'?: (props: Record<string, unknown>) => unknown
+  'settings-appearance'?: (props: Record<string, unknown>) => unknown
+}>()
+</script>
+
+<template>
+  <AppLayout
+    class="mint-plugin-workspace-view"
+    :sidebar-position="shell.sidebarPosition"
+    :sidebar-width="shell.sidebarWidth"
+    :floating="shell.floating"
+    :responsive-sidebar="shell.responsiveSidebar"
+    :sidebar-toggle-label="shell.sidebarToggleLabel"
+    :sidebar-close-label="shell.sidebarCloseLabel"
+  >
+    <template #topbar>
+      <slot name="topbar" v-bind="shell.controls">
+        <AppTopBar
+          :title="shell.title"
+          :subtitle="shell.subtitle"
+          :variant="shell.topBarVariant"
+          :home-path="shell.homePath"
+          :show-logo="shell.showLogo"
+          :page-selector="shell.pageSelector"
+          :current-page-selector-id="shell.currentPageSelectorId"
+          :plugin-switcher="shell.pluginSwitcher"
+          :pill-nav="shell.pillNav"
+          :current-pill-id="shell.currentPillId"
+          :show-theme-toggle="shell.showThemeToggle"
+          :show-settings="shell.showSettings"
+          :settings-config="shell.settingsConfig"
+          :show-standalone-label="shell.showStandaloneLabel"
+          :standalone-label="shell.standaloneLabel"
+          :account-menu="shell.accountMenu"
+          :show-notifications="shell.showNotifications"
+          :has-notification-dot="shell.hasNotificationDot"
+          :show-admin="shell.showAdmin"
+          :admin-path="shell.adminPath"
+          :user-name="shell.userName"
+          :user-initial="shell.userInitial"
+          :user-email="shell.userEmail"
+          @page-selector-select="emit('page-selector-select', $event)"
+          @pill-select="emit('pill-select', $event)"
+          @pill-option-select="handlePillOptionSelect"
+          @plugin-switcher-select="emit('plugin-switcher-select', $event)"
+          @plugin-switcher-install="emit('plugin-switcher-install')"
+          @account-menu-select="emit('account-menu-select', $event)"
+          @sign-out="emit('sign-out')"
+          @notifications-click="emit('notifications-click')"
+          @settings-values-change="emit('settings-values-change', $event)"
+          @admin-click="emit('admin-click')"
+        >
+          <template
+            v-for="slotName in shell.topBarSlotNames"
+            :key="slotName"
+            #[slotName]="slotProps"
+          >
+            <!-- @vue-ignore dynamic SDK slot forwarding for AppTopBar passthrough slots -->
+            <slot
+              :name="slotName"
+              v-bind="slotProps ?? {}"
+            />
+          </template>
+        </AppTopBar>
+      </slot>
+    </template>
+
+    <template v-if="shell.hasSidebarSurface" #sidebar>
+      <slot name="sidebar" v-bind="shell.controls" />
+    </template>
+
+    <slot v-bind="shell.controls" />
+  </AppLayout>
+</template>

package/src/components/internal/WorkspaceSidebarInternal.vue

@@ -0,0 +1,82 @@
+<script setup lang="ts">
+/**
+ * Internal: AppSidebar for PluginWorkspaceView, driven by a single `sidebar` model covering
+ * chrome, panels/forms, collapse behavior, and the compact control-schema props that drive
+ * AppSidebar's auto-generated form.
+ * Not part of the public SDK surface — see PluginWorkspaceView.vue for the public component.
+ */
+import AppSidebar from '../AppSidebar.vue'
+import type { PluginWorkspaceSidebarModel } from '../../composables/pluginWorkspaceModel'
+
+defineProps<{
+  sidebar: PluginWorkspaceSidebarModel
+}>()
+
+defineEmits<{
+  'update:modelValue': [values: Record<string, unknown>]
+  'update:collapsed': [value: boolean]
+  'update:toggle': [sectionId: string, value: boolean]
+  'section-action': [sectionId: string, actionId: string]
+  'form-submit': [sectionId: string, values: Record<string, unknown>]
+  'form-cancel': [sectionId: string]
+}>()
+
+defineSlots<{
+  header?: (props: Record<string, unknown>) => unknown
+  collapsed?: (props: Record<string, unknown>) => unknown
+  'collapsed-footer'?: (props: Record<string, unknown>) => unknown
+  footer?: (props: Record<string, unknown>) => unknown
+}>()
+</script>
+
+<template>
+  <AppSidebar
+    :title="sidebar.title"
+    :subtitle="sidebar.subtitle"
+    :badge="sidebar.badge"
+    :variant="sidebar.variant"
+    :panels="sidebar.panels"
+    :active-view="sidebar.activeView"
+    :floating="sidebar.floating"
+    :dense="sidebar.dense"
+    :width="sidebar.width"
+    :side="sidebar.side"
+    :forms="sidebar.forms"
+    :content-id="sidebar.contentId"
+    :show-when-empty="sidebar.showWhenEmpty"
+    :model="sidebar.model"
+    :controls="sidebar.controlSchema"
+    :control-options="sidebar.controlOptions"
+    :values="sidebar.values"
+    :form-enhancements="sidebar.formEnhancements"
+    :show-form-actions="sidebar.showFormActions"
+    :form-loading="sidebar.formLoading"
+    :form-disabled="sidebar.formDisabled"
+    :form-readonly="sidebar.formReadonly"
+    :form-size="sidebar.formSize"
+    :collapsible="sidebar.collapsible"
+    :collapsed="sidebar.collapsed"
+    :default-collapsed="sidebar.defaultCollapsed"
+    :collapsed-width="sidebar.collapsedWidth"
+    :collapse-button-label="sidebar.collapseButtonLabel"
+    :expand-button-label="sidebar.expandButtonLabel"
+    @update:model-value="$emit('update:modelValue', $event)"
+    @update:collapsed="$emit('update:collapsed', $event)"
+    @update:toggle="(sectionId, value) => $emit('update:toggle', sectionId, value)"
+    @section-action="(sectionId, actionId) => $emit('section-action', sectionId, actionId)"
+    @form-submit="(sectionId, values) => $emit('form-submit', sectionId, values)"
+    @form-cancel="$emit('form-cancel', $event)"
+  >
+    <template
+      v-for="slotName in sidebar.slotNames"
+      :key="slotName"
+      #[slotName]="slotProps"
+    >
+      <!-- @vue-ignore dynamic SDK slot forwarding for AppSidebar section-* passthrough slots -->
+      <slot
+        :name="slotName"
+        v-bind="slotProps ?? {}"
+      />
+    </template>
+  </AppSidebar>
+</template>

package/src/composables/controlSchemaTypes.ts

@@ -42,10 +42,27 @@ export interface ControlSectionConfig {
   actions?: SidebarToolSectionAction[]
   columns?: 1 | 2 | 3
   condition?: FieldCondition
+  /** The access policy. Preferred over the flat fields below. */
   access?: AccessPolicy
+  /**
+   * @deprecated Since MINT 1.2; use `access.visibleFor` instead. The flat
+   * duplicate is removed in 1.3.
+   */
   visibleFor?: AccessAudienceInput
+  /**
+   * @deprecated Since MINT 1.2; use `access.requiresAdmin` instead. The flat
+   * duplicate is removed in 1.3.
+   */
   requiresAdmin?: boolean
+  /**
+   * @deprecated Since MINT 1.2; use `access.permissions` instead. The flat
+   * duplicate is removed in 1.3.
+   */
   permissions?: readonly string[]
+  /**
+   * @deprecated Since MINT 1.2; use `access.anyPermissions` instead. The flat
+   * duplicate is removed in 1.3.
+   */
   anyPermissions?: readonly string[]
   defaultOpen?: boolean
   showToggle?: boolean
@@ -86,10 +103,27 @@ export interface ControlDefinition {
   pattern?: string | { value: string; message: string }
   validation?: FieldValidation
   condition?: FieldCondition
+  /** The access policy. Preferred over the flat fields below. */
   access?: AccessPolicy
+  /**
+   * @deprecated Since MINT 1.2; use `access.visibleFor` instead. The flat
+   * duplicate is removed in 1.3.
+   */
   visibleFor?: AccessAudienceInput
+  /**
+   * @deprecated Since MINT 1.2; use `access.requiresAdmin` instead. The flat
+   * duplicate is removed in 1.3.
+   */
   requiresAdmin?: boolean
+  /**
+   * @deprecated Since MINT 1.2; use `access.permissions` instead. The flat
+   * duplicate is removed in 1.3.
+   */
   permissions?: readonly string[]
+  /**
+   * @deprecated Since MINT 1.2; use `access.anyPermissions` instead. The flat
+   * duplicate is removed in 1.3.
+   */
   anyPermissions?: readonly string[]
   options?: readonly ControlOption[]
   section?: string

package/src/composables/experimentDesignData.ts

@@ -1,4 +1,5 @@
 import type { SelectOption } from '../types'
+import { isRecord } from '../utils/records'
 
 export interface ExperimentDesignDataResponse {
   experiment_id?: number
@@ -12,9 +13,6 @@ export interface ExtractExperimentSamplesOptions {
   includeControls?: boolean
 }
 
-function isRecord(value: unknown): value is Record<string, unknown> {
-  return value !== null && typeof value === 'object' && !Array.isArray(value)
-}
 
 function isPlatformDesignDataResponse(value: Record<string, unknown>): boolean {
   return (