@morscherlab/mint-sdk 1.2.0-beta.3 → 1.2.0-beta.4

package/src/composables/useBioTemplatePresetWorkspace.ts

@@ -0,0 +1,326 @@
+import {
+  computed,
+  reactive,
+  ref,
+  watch,
+  type ComputedRef,
+  type Ref,
+} from 'vue'
+import type { PillNavItem } from '../types'
+import {
+  createBioTemplatePresetCollectionFromControls,
+  getBioTemplatePresetInfo,
+  type BioTemplateControlValues,
+  type BioTemplatePresetEntry,
+  type TemplateCollectionEnvelope,
+  type TemplatePresetId,
+} from '../templates'
+import type {
+  ControlWorkspaceOptions,
+  ControlWorkspaceFormBinding,
+  ControlWorkspacePillNavBinding,
+  ControlWorkspaceSidebarBinding,
+  ControlWorkspaceTopBarBinding,
+  ControlWorkspaceTopBarSettingsBinding,
+  UseControlSchemaReturn,
+} from './controlSchemaTypes'
+import {
+  useTemplateCollection,
+  type UseTemplateCollectionOptions,
+  type UseTemplateCollectionReturn,
+} from './useTemplateCollection'
+import {
+  useBioTemplateWorkspace,
+  type BioTemplateRendererBinding,
+  type UseBioTemplateWorkspaceReturn,
+} from './useBioTemplateWorkspace'
+import type {
+  BioTemplateComponentBinding,
+  BioTemplateComponentBindingsById,
+  BioTemplateComponentImport,
+  BioTemplateComponentPropsByComponent,
+  BioTemplateComponentPropsBinding,
+  BioTemplateComponentPropsById,
+  BioTemplateComponentSnippet,
+  BioTemplateComponentUsage,
+} from './useBioTemplateComponents'
+import type {
+  BioTemplateControlSchema,
+} from './useBioTemplateControls'
+
+export interface UseBioTemplatePresetWorkspaceOptions extends UseTemplateCollectionOptions {
+  /** Optional schema-rendering options for the generated FormBuilder/AppSidebar controls. */
+  controlOptions?: ControlWorkspaceOptions
+  /** Initial control values for the generated preset. Merged over controlOptions.initialValues. */
+  initialValues?: BioTemplateControlValues
+}
+
+export interface UseBioTemplatePresetWorkspaceReturn {
+  presetId: TemplatePresetId
+  presetInfo: ComputedRef<BioTemplatePresetEntry | undefined>
+  presetLabel: ComputedRef<string>
+  collection: Ref<TemplateCollectionEnvelope>
+  templates: UseTemplateCollectionReturn['templates']
+  templateIds: UseTemplateCollectionReturn['templateIds']
+  currentExperimentId: UseTemplateCollectionReturn['currentExperimentId']
+  hasCurrentExperiment: UseTemplateCollectionReturn['hasCurrentExperiment']
+  saving: UseTemplateCollectionReturn['isSaving']
+  error: UseTemplateCollectionReturn['error']
+  lastSavedAt: UseTemplateCollectionReturn['lastSavedAt']
+  controls: UseControlSchemaReturn<BioTemplateControlSchema>
+  controlSchema: BioTemplateControlSchema
+  controlValues: Ref<BioTemplateControlValues>
+  controlViewIds: ComputedRef<string[]>
+  controlViewItems: ComputedRef<PillNavItem[]>
+  activeControlView: Ref<string>
+  form: ControlWorkspaceFormBinding
+  sidebar: ControlWorkspaceSidebarBinding
+  topBar: ComputedRef<ControlWorkspaceTopBarBinding>
+  pillNav: ControlWorkspacePillNavBinding
+  topBarSettings: ControlWorkspaceTopBarSettingsBinding
+  bindings: BioTemplatePresetWorkspaceBindings
+  renderer: ComputedRef<BioTemplateRendererBinding>
+  workspace: ComputedRef<UseBioTemplateWorkspaceReturn>
+  componentBindings: ComputedRef<BioTemplateComponentBinding[]>
+  componentBindingsById: ComputedRef<BioTemplateComponentBindingsById>
+  componentImports: ComputedRef<BioTemplateComponentImport[]>
+  componentProps: ComputedRef<BioTemplateComponentPropsBinding[]>
+  componentPropsById: ComputedRef<BioTemplateComponentPropsById>
+  componentPropsByComponent: ComputedRef<BioTemplateComponentPropsByComponent>
+  componentSnippets: ComputedRef<BioTemplateComponentSnippet[]>
+  componentUsage: ComputedRef<BioTemplateComponentUsage | null>
+  getComponentProps: UseBioTemplateWorkspaceReturn['getComponentProps']
+  setActiveControlView: (viewId: string) => void
+  setControlValues: (values: BioTemplateControlValues) => TemplateCollectionEnvelope
+  updateControlValues: (values: Partial<BioTemplateControlValues>) => TemplateCollectionEnvelope
+  applyCollection: (value: TemplateCollectionEnvelope) => TemplateCollectionEnvelope
+  resetToDefaultCollection: () => TemplateCollectionEnvelope
+  save: UseTemplateCollectionReturn['save']
+  saveCurrent: UseTemplateCollectionReturn['saveCurrent']
+}
+
+export interface BioTemplatePresetWorkspaceBindings {
+  renderer: ComputedRef<BioTemplateRendererBinding>
+  form: ControlWorkspaceFormBinding
+  sidebar: ControlWorkspaceSidebarBinding
+  topBar: ComputedRef<ControlWorkspaceTopBarBinding>
+  topBarSettings: ControlWorkspaceTopBarSettingsBinding
+  pillNav: ControlWorkspacePillNavBinding
+  componentBindings: ComputedRef<BioTemplateComponentBinding[]>
+  componentBindingsById: ComputedRef<BioTemplateComponentBindingsById>
+  componentProps: ComputedRef<BioTemplateComponentPropsBinding[]>
+  componentPropsById: ComputedRef<BioTemplateComponentPropsById>
+  componentPropsByComponent: ComputedRef<BioTemplateComponentPropsByComponent>
+  componentSnippets: ComputedRef<BioTemplateComponentSnippet[]>
+  componentUsage: ComputedRef<BioTemplateComponentUsage | null>
+  getComponentProps: UseBioTemplateWorkspaceReturn['getComponentProps']
+}
+
+/** Create a complete editable WellPlate/DoseCalculator workspace for dose design from a built-in biology template preset with current-experiment save wiring. */
+export function useBioTemplatePresetWorkspace(
+  presetId: TemplatePresetId,
+  options: UseBioTemplatePresetWorkspaceOptions = {},
+): UseBioTemplatePresetWorkspaceReturn {
+  const { controlOptions, initialValues, ...collectionOptions } = options
+  const resolvedControlOptions = mergeInitialValues(controlOptions, initialValues)
+  const presetWorkspace = useBioTemplateWorkspace(presetId, resolvedControlOptions)
+  const presetInfo = computed(() => getBioTemplatePresetInfo(presetId))
+  const presetLabel = computed(() => presetInfo.value?.label ?? humanizePresetId(presetId))
+  const controls = presetWorkspace.controls
+  const controlValues = ref<BioTemplateControlValues>({ ...controls.initialValues })
+  const controlViewIds = computed(() => controls.viewIds)
+  const controlViewItems = computed(() => controls.viewItems)
+  const activeControlView = ref(controls.defaultView)
+  const templateCollection = useTemplateCollection({
+    ...collectionOptions,
+    initial: createDefaultCollection,
+  })
+  const collection = templateCollection.templateCollection
+  const workspace = computed(() => useBioTemplateWorkspace(collection.value, resolvedControlOptions))
+  const renderer = computed<BioTemplateRendererBinding>(() => ({ target: collection.value }))
+  const componentBindings = computed(() => workspace.value.componentBindings)
+  const componentBindingsById = computed(() => workspace.value.componentBindingsById)
+  const componentImports = computed(() => workspace.value.componentImports)
+  const componentProps = computed(() => workspace.value.componentProps)
+  const componentPropsById = computed(() => workspace.value.componentPropsById)
+  const componentPropsByComponent = computed(() => workspace.value.componentPropsByComponent)
+  const componentSnippets = computed(() => workspace.value.componentSnippets)
+  const componentUsage = computed(() => workspace.value.componentUsage)
+  const form = reactive({
+    ...controls.form,
+    modelValue: controlValues.value,
+    'onUpdate:modelValue': setControlValues,
+  }) as ControlWorkspaceFormBinding
+  const sidebar = reactive({
+    ...controls.sidebar,
+    activeView: activeControlView.value,
+    modelValue: controlValues.value,
+    'onUpdate:modelValue': setControlValues,
+    values: controlValues.value,
+    'onUpdate:values': setControlValues,
+  }) as ControlWorkspaceSidebarBinding
+  const pillNav = reactive({
+    items: controls.viewItems,
+    currentItemId: activeControlView.value,
+    onSelect: (item: { id: string }) => setActiveControlView(item.id),
+  }) as ControlWorkspacePillNavBinding
+  const topBarSettings = reactive({
+    showSettings: true,
+    settingsConfig: {
+      ...controls.topBarSettingsConfig,
+      values: controlValues.value,
+    },
+    onSettingsValuesChange: setControlValues,
+  }) as ControlWorkspaceTopBarSettingsBinding
+  const topBarProps = computed<ControlWorkspaceTopBarBinding>(() => ({
+    pillNav: pillNav.items,
+    currentPillId: pillNav.currentItemId,
+    onPillSelect: pillNav.onSelect,
+    ...topBarSettings,
+  }))
+
+  function getComponentProps(
+    component: string,
+    options?: Parameters<UseBioTemplateWorkspaceReturn['getComponentProps']>[1],
+  ) {
+    return workspace.value.getComponentProps(component, options)
+  }
+
+  const bindings: BioTemplatePresetWorkspaceBindings = {
+    renderer,
+    form,
+    sidebar,
+    topBar: topBarProps,
+    topBarSettings,
+    pillNav,
+    componentBindings,
+    componentBindingsById,
+    componentProps,
+    componentPropsById,
+    componentPropsByComponent,
+    componentSnippets,
+    componentUsage,
+    getComponentProps,
+  }
+
+  function createDefaultCollection(): TemplateCollectionEnvelope {
+    return createBioTemplatePresetCollectionFromControls(presetId, controls.initialValues)
+  }
+
+  watch(
+    controlValues,
+    (values) => {
+      syncControlValueBindings(values)
+      templateCollection.apply(createBioTemplatePresetCollectionFromControls(presetId, values))
+    },
+    { deep: true },
+  )
+
+  watch(activeControlView, (viewId) => {
+    sidebar.activeView = viewId
+    pillNav.currentItemId = viewId
+  }, { flush: 'sync' })
+  watch(() => sidebar.activeView, setActiveControlView, { flush: 'sync' })
+  watch(() => pillNav.currentItemId, setActiveControlView, { flush: 'sync' })
+
+  function applyCollection(value: TemplateCollectionEnvelope): TemplateCollectionEnvelope {
+    return templateCollection.apply(value)
+  }
+
+  function setActiveControlView(viewId: string): void {
+    if (!controlViewIds.value.includes(viewId)) return
+    activeControlView.value = viewId
+  }
+
+  function setControlValues(values: BioTemplateControlValues): TemplateCollectionEnvelope {
+    const nextValues = { ...values }
+    controlValues.value = nextValues
+    syncControlValueBindings(nextValues)
+    return templateCollection.apply(createBioTemplatePresetCollectionFromControls(presetId, nextValues))
+  }
+
+  function updateControlValues(values: Partial<BioTemplateControlValues>): TemplateCollectionEnvelope {
+    return setControlValues({
+      ...controlValues.value,
+      ...values,
+    })
+  }
+
+  function resetToDefaultCollection(): TemplateCollectionEnvelope {
+    return setControlValues({ ...controls.initialValues })
+  }
+
+  function syncControlValueBindings(values: BioTemplateControlValues): void {
+    form.modelValue = values
+    sidebar.modelValue = values
+    sidebar.values = values
+    topBarSettings.settingsConfig = {
+      ...topBarSettings.settingsConfig,
+      values,
+    }
+  }
+
+  return {
+    presetId,
+    presetInfo,
+    presetLabel,
+    collection,
+    templates: templateCollection.templates,
+    templateIds: templateCollection.templateIds,
+    currentExperimentId: templateCollection.currentExperimentId,
+    hasCurrentExperiment: templateCollection.hasCurrentExperiment,
+    saving: templateCollection.isSaving,
+    error: templateCollection.error,
+    lastSavedAt: templateCollection.lastSavedAt,
+    controls,
+    controlSchema: controls.controls,
+    controlValues,
+    controlViewIds,
+    controlViewItems,
+    activeControlView,
+    form,
+    sidebar,
+    topBar: topBarProps,
+    pillNav,
+    topBarSettings,
+    bindings,
+    renderer,
+    workspace,
+    componentBindings,
+    componentBindingsById,
+    componentImports,
+    componentProps,
+    componentPropsById,
+    componentPropsByComponent,
+    componentSnippets,
+    componentUsage,
+    getComponentProps,
+    setActiveControlView,
+    setControlValues,
+    updateControlValues,
+    applyCollection,
+    resetToDefaultCollection,
+    save: templateCollection.save,
+    saveCurrent: templateCollection.saveCurrent,
+  }
+}
+
+function humanizePresetId(value: string): string {
+  return value
+    .replace(/[-_]+/g, ' ')
+    .replace(/\b\w/g, match => match.toUpperCase())
+}
+
+function mergeInitialValues(
+  controlOptions: ControlWorkspaceOptions | undefined,
+  initialValues: BioTemplateControlValues | undefined,
+): ControlWorkspaceOptions | undefined {
+  if (initialValues === undefined) return controlOptions
+  return {
+    ...(controlOptions ?? {}),
+    initialValues: {
+      ...(controlOptions?.initialValues ?? {}),
+      ...initialValues,
+    },
+  }
+}

package/src/composables/useBioTemplateWorkspace.ts

@@ -0,0 +1,141 @@
+import type {
+  BioTemplateEnvelope,
+  TemplateCollectionEnvelope,
+} from '../templates'
+import type {
+  ControlWorkspaceFormBinding,
+  ControlWorkspaceOptions,
+  ControlWorkspacePillNavBinding,
+  ControlWorkspaceSidebarBinding,
+  ControlWorkspaceTopBarSettingsBinding,
+  UseControlSchemaReturn,
+  UseControlWorkspaceReturn,
+} from './controlSchemaTypes'
+import {
+  useControlWorkspace,
+} from './useControlSchema'
+import {
+  useBioTemplateControls,
+  type BioTemplateControlSchema,
+  type BioTemplateControlTarget,
+} from './useBioTemplateControls'
+import {
+  useBioTemplateComponents,
+  type BioTemplateComponentBinding,
+  type BioTemplateComponentBindingsById,
+  type BioTemplateComponentImport,
+  type BioTemplateComponentPropsByComponent,
+  type BioTemplateComponentPropsBinding,
+  type BioTemplateComponentPropsById,
+  type BioTemplateComponentSnippet,
+  type BioTemplateComponentUsage,
+  type UseBioTemplateComponentsReturn,
+} from './useBioTemplateComponents'
+
+export type BioTemplateWorkspaceTarget = BioTemplateControlTarget
+
+export interface BioTemplateRendererBinding {
+  target: BioTemplateEnvelope<unknown> | TemplateCollectionEnvelope
+}
+
+export interface BioTemplateWorkspaceBindings {
+  renderer: BioTemplateRendererBinding | null
+  form: ControlWorkspaceFormBinding
+  sidebar: ControlWorkspaceSidebarBinding
+  topBar: UseControlWorkspaceReturn<BioTemplateControlSchema>['bindings']['topBar']
+  topBarSettings: ControlWorkspaceTopBarSettingsBinding
+  pillNav: ControlWorkspacePillNavBinding
+  componentBindings: BioTemplateComponentBinding[]
+  componentBindingsById: BioTemplateComponentBindingsById
+  componentProps: BioTemplateComponentPropsBinding[]
+  componentPropsById: BioTemplateComponentPropsById
+  componentPropsByComponent: BioTemplateComponentPropsByComponent
+  componentSnippets: BioTemplateComponentSnippet[]
+  componentUsage: BioTemplateComponentUsage | null
+  getComponentProps: UseBioTemplateComponentsReturn['getComponentProps']
+}
+
+export interface UseBioTemplateWorkspaceReturn {
+  target: BioTemplateWorkspaceTarget
+  controls: UseControlSchemaReturn<BioTemplateControlSchema>
+  workspace: UseControlWorkspaceReturn<BioTemplateControlSchema>
+  controlSchema: BioTemplateControlSchema
+  components: UseBioTemplateComponentsReturn
+  values: UseControlWorkspaceReturn<BioTemplateControlSchema>['values']
+  activeView: UseControlWorkspaceReturn<BioTemplateControlSchema>['activeView']
+  form: ControlWorkspaceFormBinding
+  sidebar: ControlWorkspaceSidebarBinding
+  topBar: UseControlWorkspaceReturn<BioTemplateControlSchema>['topBar']
+  pillNav: ControlWorkspacePillNavBinding
+  topBarSettings: ControlWorkspaceTopBarSettingsBinding
+  bindings: BioTemplateWorkspaceBindings
+  renderer: BioTemplateRendererBinding | null
+  componentBindings: BioTemplateComponentBinding[]
+  componentBindingsById: BioTemplateComponentBindingsById
+  componentImports: BioTemplateComponentImport[]
+  componentProps: BioTemplateComponentPropsBinding[]
+  componentPropsById: BioTemplateComponentPropsById
+  componentPropsByComponent: BioTemplateComponentPropsByComponent
+  componentSnippets: BioTemplateComponentSnippet[]
+  componentUsage: BioTemplateComponentUsage | null
+  getComponentProps: UseBioTemplateComponentsReturn['getComponentProps']
+}
+
+/** One-stop wiring for BioTemplateRenderer, FormBuilder, AppSidebar, and template-aware SDK components. */
+export function useBioTemplateWorkspace(
+  target: BioTemplateWorkspaceTarget,
+  options: ControlWorkspaceOptions = {}
+): UseBioTemplateWorkspaceReturn {
+  const controls = useBioTemplateControls(target, options)
+  const workspace = useControlWorkspace(controls.controls, options)
+  const components = useBioTemplateComponents(target)
+  const renderer = isTemplateObjectTarget(target) ? { target } : null
+  const bindings: BioTemplateWorkspaceBindings = {
+    renderer,
+    form: workspace.bindings.form,
+    sidebar: workspace.bindings.sidebar,
+    topBar: workspace.bindings.topBar,
+    topBarSettings: workspace.bindings.topBarSettings,
+    pillNav: workspace.bindings.pillNav,
+    componentBindings: components.bindings,
+    componentBindingsById: components.componentBindingsById,
+    componentProps: components.componentProps,
+    componentPropsById: components.componentPropsById,
+    componentPropsByComponent: components.componentPropsByComponent,
+    componentSnippets: components.snippets,
+    componentUsage: components.usage,
+    getComponentProps: components.getComponentProps,
+  }
+
+  return {
+    target,
+    controls,
+    workspace,
+    controlSchema: controls.controls,
+    components,
+    values: workspace.values,
+    activeView: workspace.activeView,
+    form: workspace.form,
+    sidebar: workspace.sidebar,
+    topBar: workspace.topBar,
+    pillNav: workspace.pillNav,
+    topBarSettings: workspace.topBarSettings,
+    bindings,
+    renderer,
+    componentBindings: components.bindings,
+    componentBindingsById: components.componentBindingsById,
+    componentImports: components.imports,
+    componentProps: components.componentProps,
+    componentPropsById: components.componentPropsById,
+    componentPropsByComponent: components.componentPropsByComponent,
+    componentSnippets: components.snippets,
+    componentUsage: components.usage,
+    getComponentProps: components.getComponentProps,
+  }
+}
+
+function isTemplateObjectTarget(
+  target: BioTemplateWorkspaceTarget
+): target is BioTemplateEnvelope<unknown> | TemplateCollectionEnvelope {
+  return typeof target !== 'string'
+}

package/src/composables/useCalendarGrid.ts

@@ -0,0 +1,140 @@
+import { computed, ref, type ComputedRef, type Ref } from 'vue'
+
+export interface CalendarGridDay {
+  date: Date
+  isCurrentMonth: boolean
+  isDisabled: boolean
+}
+
+export interface UseCalendarGridOptions {
+  min?: () => string | undefined
+  max?: () => string | undefined
+  locale?: () => string | undefined
+}
+
+export interface UseCalendarGridReturn {
+  currentMonth: Ref<Date>
+  weekDays: readonly string[]
+  monthYear: ComputedRef<string>
+  calendarDays: ComputedRef<CalendarGridDay[]>
+  isDateDisabled: (date: Date) => boolean
+  isSameDay: (date: Date, other: Date | null | undefined) => boolean
+  isToday: (date: Date) => boolean
+  formatDateValue: (date: Date) => string
+  setCurrentMonthFromDate: (date: Date) => void
+  prevMonth: () => void
+  nextMonth: () => void
+}
+
+const WEEK_DAYS = ['Su', 'Mo', 'Tu', 'We', 'Th', 'Fr', 'Sa'] as const
+
+/** Shared calendar grid state for date and datetime pickers. */
+export function useCalendarGrid(options: UseCalendarGridOptions = {}): UseCalendarGridReturn {
+  const currentMonth = ref(new Date())
+
+  const monthYear = computed(() => {
+    return currentMonth.value.toLocaleDateString(options.locale?.() ?? 'en-US', {
+      year: 'numeric',
+      month: 'long',
+    })
+  })
+
+  const calendarDays = computed<CalendarGridDay[]>(() => {
+    const year = currentMonth.value.getFullYear()
+    const month = currentMonth.value.getMonth()
+    const firstDay = new Date(year, month, 1)
+    const lastDay = new Date(year, month + 1, 0)
+    const days: CalendarGridDay[] = []
+
+    const startPadding = firstDay.getDay()
+    for (let i = startPadding - 1; i >= 0; i--) {
+      const date = new Date(year, month, -i)
+      days.push({ date, isCurrentMonth: false, isDisabled: isDateDisabled(date) })
+    }
+
+    for (let i = 1; i <= lastDay.getDate(); i++) {
+      const date = new Date(year, month, i)
+      days.push({ date, isCurrentMonth: true, isDisabled: isDateDisabled(date) })
+    }
+
+    const endPadding = 42 - days.length
+    for (let i = 1; i <= endPadding; i++) {
+      const date = new Date(year, month + 1, i)
+      days.push({ date, isCurrentMonth: false, isDisabled: isDateDisabled(date) })
+    }
+
+    return days
+  })
+
+  function isDateDisabled(date: Date): boolean {
+    const minDate = parseBoundaryDate(options.min?.())
+    if (minDate && startOfDay(date) < startOfDay(minDate)) return true
+
+    const maxDate = parseBoundaryDate(options.max?.())
+    if (maxDate && startOfDay(date) > startOfDay(maxDate)) return true
+
+    return false
+  }
+
+  function isSameDay(date: Date, other: Date | null | undefined): boolean {
+    if (!other) return false
+    return date.toDateString() === other.toDateString()
+  }
+
+  function isToday(date: Date): boolean {
+    return isSameDay(date, new Date())
+  }
+
+  function formatDateValue(date: Date): string {
+    const year = date.getFullYear()
+    const month = String(date.getMonth() + 1).padStart(2, '0')
+    const day = String(date.getDate()).padStart(2, '0')
+    return `${year}-${month}-${day}`
+  }
+
+  function setCurrentMonthFromDate(date: Date): void {
+    currentMonth.value = new Date(date.getFullYear(), date.getMonth(), 1)
+  }
+
+  function prevMonth(): void {
+    currentMonth.value = new Date(
+      currentMonth.value.getFullYear(),
+      currentMonth.value.getMonth() - 1,
+      1,
+    )
+  }
+
+  function nextMonth(): void {
+    currentMonth.value = new Date(
+      currentMonth.value.getFullYear(),
+      currentMonth.value.getMonth() + 1,
+      1,
+    )
+  }
+
+  return {
+    currentMonth,
+    weekDays: WEEK_DAYS,
+    monthYear,
+    calendarDays,
+    isDateDisabled,
+    isSameDay,
+    isToday,
+    formatDateValue,
+    setCurrentMonthFromDate,
+    prevMonth,
+    nextMonth,
+  }
+}
+
+function parseBoundaryDate(value: string | undefined): Date | null {
+  if (!value) return null
+  const date = value.includes('T') ? new Date(value) : new Date(`${value}T00:00:00`)
+  return Number.isNaN(date.getTime()) ? null : date
+}
+
+function startOfDay(date: Date): Date {
+  const copy = new Date(date)
+  copy.setHours(0, 0, 0, 0)
+  return copy
+}