@morscherlab/mld-sdk 0.7.0 → 0.7.1

package/dist/composables/index.d.ts

@@ -16,4 +16,5 @@ export { useSequenceUtils, type SequenceType, type SequenceStats, } from './useS
 export { parseTime, formatTime, generateTimeSlots, rangesOverlap, durationMinutes, formatDuration, isTimeInRange, findAvailableSlots, snapToSlot, addMinutes, compareTime, } from './useTimeUtils';
 export { useScheduleDrag } from './useScheduleDrag';
 export { useFormBuilder, evaluateCondition } from './useFormBuilder';
+export { usePluginConfig, type UsePluginConfigReturn } from './usePluginConfig';
 export { getFieldRegistryEntry, getTypeDefault, type RegistryEntry, } from './formBuilderRegistry';

package/dist/composables/index.js

@@ -16,6 +16,7 @@ import { useSequenceUtils } from "./useSequenceUtils.js";
 import { addMinutes, compareTime, durationMinutes, findAvailableSlots, formatDuration, formatTime, generateTimeSlots, isTimeInRange, parseTime, rangesOverlap, snapToSlot } from "./useTimeUtils.js";
 import { useScheduleDrag } from "./useScheduleDrag.js";
 import { evaluateCondition, useFormBuilder } from "./useFormBuilder.js";
+import { usePluginConfig } from "./usePluginConfig.js";
 import { getFieldRegistryEntry, getTypeDefault } from "./formBuilderRegistry.js";
 export {
   ATOMIC_WEIGHTS,
@@ -44,6 +45,7 @@ export {
   useFormBuilder,
   usePasskey,
   usePlatformContext,
+  usePluginConfig,
   useProtocolTemplates,
   useRackEditor,
   useScheduleDrag,

package/dist/composables/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;"}

package/dist/composables/usePluginConfig.d.ts

@@ -0,0 +1,12 @@
+import { Ref, ComputedRef } from 'vue';
+export interface UsePluginConfigReturn {
+    config: Ref<Record<string, unknown>>;
+    isLoading: Ref<boolean>;
+    isSaving: Ref<boolean>;
+    error: Ref<string | null>;
+    isDirty: ComputedRef<boolean>;
+    load: () => Promise<void>;
+    save: () => Promise<boolean>;
+    reset: () => void;
+}
+export declare function usePluginConfig(pluginName?: string): UsePluginConfigReturn;

package/dist/composables/usePluginConfig.js

@@ -0,0 +1,77 @@
+import { computed, ref, onMounted } from "vue";
+import { useApi } from "./useApi.js";
+import { usePlatformContext } from "./usePlatformContext.js";
+function usePluginConfig(pluginName) {
+  const api = useApi();
+  const { plugin } = usePlatformContext();
+  const resolvedName = computed(() => {
+    var _a;
+    return pluginName ?? ((_a = plugin.value) == null ? void 0 : _a.name) ?? "";
+  });
+  const config = ref({});
+  const savedConfig = ref({});
+  const isLoading = ref(false);
+  const isSaving = ref(false);
+  const error = ref(null);
+  const isDirty = computed(() => {
+    return JSON.stringify(config.value) !== JSON.stringify(savedConfig.value);
+  });
+  async function load() {
+    const name = resolvedName.value;
+    if (!name) return;
+    isLoading.value = true;
+    error.value = null;
+    try {
+      const response = await api.get(
+        `/api/plugins/${encodeURIComponent(name)}/config`
+      );
+      config.value = { ...response.config };
+      savedConfig.value = { ...response.config };
+    } catch (e) {
+      error.value = e instanceof Error ? e.message : "Failed to load plugin config";
+    } finally {
+      isLoading.value = false;
+    }
+  }
+  async function save() {
+    const name = resolvedName.value;
+    if (!name) return false;
+    isSaving.value = true;
+    error.value = null;
+    try {
+      const response = await api.put(
+        `/api/plugins/${encodeURIComponent(name)}/config`,
+        { config: config.value }
+      );
+      config.value = { ...response.config };
+      savedConfig.value = { ...response.config };
+      return true;
+    } catch (e) {
+      error.value = e instanceof Error ? e.message : "Failed to save plugin config";
+      return false;
+    } finally {
+      isSaving.value = false;
+    }
+  }
+  function reset() {
+    config.value = { ...savedConfig.value };
+    error.value = null;
+  }
+  onMounted(() => {
+    load();
+  });
+  return {
+    config,
+    isLoading,
+    isSaving,
+    error,
+    isDirty,
+    load,
+    save,
+    reset
+  };
+}
+export {
+  usePluginConfig
+};
+//# sourceMappingURL=usePluginConfig.js.map

package/dist/composables/usePluginConfig.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"usePluginConfig.js","sources":["../../src/composables/usePluginConfig.ts"],"sourcesContent":["import { ref, computed, onMounted, type Ref, type ComputedRef } from 'vue'\nimport { useApi } from './useApi'\nimport { usePlatformContext } from './usePlatformContext'\n\nexport interface UsePluginConfigReturn {\n  config: Ref<Record<string, unknown>>\n  isLoading: Ref<boolean>\n  isSaving: Ref<boolean>\n  error: Ref<string | null>\n  isDirty: ComputedRef<boolean>\n  load: () => Promise<void>\n  save: () => Promise<boolean>\n  reset: () => void\n}\n\nexport function usePluginConfig(pluginName?: string): UsePluginConfigReturn {\n  const api = useApi()\n  const { plugin } = usePlatformContext()\n\n  const resolvedName = computed(() => pluginName ?? plugin.value?.name ?? '')\n\n  const config = ref<Record<string, unknown>>({})\n  const savedConfig = ref<Record<string, unknown>>({})\n  const isLoading = ref(false)\n  const isSaving = ref(false)\n  const error = ref<string | null>(null)\n\n  const isDirty = computed(() => {\n    return JSON.stringify(config.value) !== JSON.stringify(savedConfig.value)\n  })\n\n  async function load(): Promise<void> {\n    const name = resolvedName.value\n    if (!name) return\n\n    isLoading.value = true\n    error.value = null\n    try {\n      const response = await api.get<{ plugin_name: string; config: Record<string, unknown> }>(\n        `/api/plugins/${encodeURIComponent(name)}/config`,\n      )\n      config.value = { ...response.config }\n      savedConfig.value = { ...response.config }\n    } catch (e) {\n      error.value = e instanceof Error ? e.message : 'Failed to load plugin config'\n    } finally {\n      isLoading.value = false\n    }\n  }\n\n  async function save(): Promise<boolean> {\n    const name = resolvedName.value\n    if (!name) return false\n\n    isSaving.value = true\n    error.value = null\n    try {\n      const response = await api.put<{ plugin_name: string; config: Record<string, unknown> }>(\n        `/api/plugins/${encodeURIComponent(name)}/config`,\n        { config: config.value },\n      )\n      config.value = { ...response.config }\n      savedConfig.value = { ...response.config }\n      return true\n    } catch (e) {\n      error.value = e instanceof Error ? e.message : 'Failed to save plugin config'\n      return false\n    } finally {\n      isSaving.value = false\n    }\n  }\n\n  function reset(): void {\n    config.value = { ...savedConfig.value }\n    error.value = null\n  }\n\n  onMounted(() => {\n    load()\n  })\n\n  return {\n    config,\n    isLoading,\n    isSaving,\n    error,\n    isDirty,\n    load,\n    save,\n    reset,\n  }\n}\n"],"names":[],"mappings":";;;AAeO,SAAS,gBAAgB,YAA4C;AAC1E,QAAM,MAAM,OAAA;AACZ,QAAM,EAAE,OAAA,IAAW,mBAAA;AAEnB,QAAM,eAAe,SAAS,MAAA;;AAAM,2BAAc,YAAO,UAAP,mBAAc,SAAQ;AAAA,GAAE;AAE1E,QAAM,SAAS,IAA6B,EAAE;AAC9C,QAAM,cAAc,IAA6B,EAAE;AACnD,QAAM,YAAY,IAAI,KAAK;AAC3B,QAAM,WAAW,IAAI,KAAK;AAC1B,QAAM,QAAQ,IAAmB,IAAI;AAErC,QAAM,UAAU,SAAS,MAAM;AAC7B,WAAO,KAAK,UAAU,OAAO,KAAK,MAAM,KAAK,UAAU,YAAY,KAAK;AAAA,EAC1E,CAAC;AAED,iBAAe,OAAsB;AACnC,UAAM,OAAO,aAAa;AAC1B,QAAI,CAAC,KAAM;AAEX,cAAU,QAAQ;AAClB,UAAM,QAAQ;AACd,QAAI;AACF,YAAM,WAAW,MAAM,IAAI;AAAA,QACzB,gBAAgB,mBAAmB,IAAI,CAAC;AAAA,MAAA;AAE1C,aAAO,QAAQ,EAAE,GAAG,SAAS,OAAA;AAC7B,kBAAY,QAAQ,EAAE,GAAG,SAAS,OAAA;AAAA,IACpC,SAAS,GAAG;AACV,YAAM,QAAQ,aAAa,QAAQ,EAAE,UAAU;AAAA,IACjD,UAAA;AACE,gBAAU,QAAQ;AAAA,IACpB;AAAA,EACF;AAEA,iBAAe,OAAyB;AACtC,UAAM,OAAO,aAAa;AAC1B,QAAI,CAAC,KAAM,QAAO;AAElB,aAAS,QAAQ;AACjB,UAAM,QAAQ;AACd,QAAI;AACF,YAAM,WAAW,MAAM,IAAI;AAAA,QACzB,gBAAgB,mBAAmB,IAAI,CAAC;AAAA,QACxC,EAAE,QAAQ,OAAO,MAAA;AAAA,MAAM;AAEzB,aAAO,QAAQ,EAAE,GAAG,SAAS,OAAA;AAC7B,kBAAY,QAAQ,EAAE,GAAG,SAAS,OAAA;AAClC,aAAO;AAAA,IACT,SAAS,GAAG;AACV,YAAM,QAAQ,aAAa,QAAQ,EAAE,UAAU;AAC/C,aAAO;AAAA,IACT,UAAA;AACE,eAAS,QAAQ;AAAA,IACnB;AAAA,EACF;AAEA,WAAS,QAAc;AACrB,WAAO,QAAQ,EAAE,GAAG,YAAY,MAAA;AAChC,UAAM,QAAQ;AAAA,EAChB;AAEA,YAAU,MAAM;AACd,SAAA;AAAA,EACF,CAAC;AAED,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EAAA;AAEJ;"}

package/dist/index.d.ts

@@ -1,5 +1,5 @@
 export { MLDSdk, default } from './install';
 export { BaseButton, BaseInput, BaseTextarea, BaseSelect, BaseCheckbox, BaseToggle, BaseRadioGroup, BaseSlider, ColorSlider, BaseTabs, BaseModal, FormField, DatePicker, TimePicker, TagsInput, NumberInput, FileUploader, AlertBox, ToastNotification, IconButton, ThemeToggle, SettingsButton, CollapsibleCard, AppTopBar, AppSidebar, AppLayout, AppContainer, Skeleton, WellPlate, RackEditor, SampleLegend, PlateMapEditor, ExperimentTimeline, SampleSelector, GroupingModal, GroupAssigner, MoleculeInput, ConcentrationInput, DoseCalculator, ReagentList, SampleHierarchyTree, ProtocolStepEditor, SegmentedControl, MultiSelect, BasePill, DropdownButton, Calendar, DataFrame, LoadingSpinner, Divider, StatusIndicator, ProgressBar, Avatar, EmptyState, Breadcrumb, Tooltip, ConfirmDialog, ChartContainer, SettingsModal, ScientificNumber, ChemicalFormula, FormulaInput, SequenceInput, UnitInput, StepWizard, AuditTrail, BatchProgressList, DateTimePicker, TimeRangeInput, ScheduleCalendar, ResourceCard, } from './components';
-export { useApi, useAuth, usePasskey, useTheme, useToast, usePlatformContext, useWellPlateEditor, useConcentrationUnits, useDoseCalculator, useProtocolTemplates, useRackEditor, useChemicalFormula, ATOMIC_WEIGHTS, useSequenceUtils, type ApiClientOptions, type UseWellPlateEditorOptions, type UseWellPlateEditorReturn, type UseRackEditorOptions, type UseRackEditorReturn, type ConcentrationValue, type ConcentrationUnit, type VolumeValue, type VolumeUnit, type StepTemplate, type FormulaParseResult, type FormulaPart, type SequenceType, type SequenceStats, parseTime, formatTime, generateTimeSlots, rangesOverlap, durationMinutes, formatDuration, isTimeInRange, findAvailableSlots, snapToSlot, addMinutes, compareTime, useScheduleDrag, } from './composables';
+export { useApi, useAuth, usePasskey, useTheme, useToast, usePlatformContext, useWellPlateEditor, useConcentrationUnits, useDoseCalculator, useProtocolTemplates, useRackEditor, useChemicalFormula, ATOMIC_WEIGHTS, useSequenceUtils, type ApiClientOptions, type UseWellPlateEditorOptions, type UseWellPlateEditorReturn, type UseRackEditorOptions, type UseRackEditorReturn, type ConcentrationValue, type ConcentrationUnit, type VolumeValue, type VolumeUnit, type StepTemplate, type FormulaParseResult, type FormulaPart, type SequenceType, type SequenceStats, parseTime, formatTime, generateTimeSlots, rangesOverlap, durationMinutes, formatDuration, isTimeInRange, findAvailableSlots, snapToSlot, addMinutes, compareTime, useScheduleDrag, usePluginConfig, type UsePluginConfigReturn, } from './composables';
 export { useAuthStore, useSettingsStore, colorPalettes, type SettingsState, } from './stores';
 export type { ContainerDirection, ButtonVariant, ButtonSize, InputType, ModalSize, AlertType, Toast, TabItem, SelectOption, RadioOption, FormFieldProps, SidebarToolSection, CollapsibleState, TopBarVariant, TopBarPage, TopBarTab, TopBarTabOption, TopBarSettingsConfig, WellPlateFormat, WellState, WellPlateSelectionMode, Well, HeatmapColorScale, HeatmapConfig, SlotPosition, WellExtendedData, WellEditData, WellEditField, WellLegendItem, Rack, SampleType, PlateMap, PlateMapEditorState, ProtocolStepType, ProtocolStepStatus, ProtocolStep, SampleGroup, GroupItem, FileUploaderMode, SegmentedOption, SegmentedControlVariant, SegmentedControlSize, MultiSelectOption, MultiSelectSize, PillVariant, PillSize, CalendarSelectionMode, CalendarMarker, CalendarDayContext, SortDirection, SortState, DataFrameColumn, PaginationState, SpinnerSize, SpinnerVariant, DividerSpacing, StatusType, ProgressVariant, ProgressSize, AvatarSize, EmptyStateColor, EmptyStateSize, BreadcrumbItem, TooltipPosition, ConfirmVariant, SettingsTab, NumberNotation, TimePickerFormat, TimeRange, ScheduleView, ScheduleEventStatus, ScheduleEvent, ScheduleBlockedSlot, ScheduleSlotContext, ScheduleEventCreateContext, ScheduleEventUpdateContext, ResourceStatus, ResourceSpec, UnitOption, WizardStep, WizardStepState, AuditEntryType, AuditEntry, BatchItemStatus, BatchItem, BatchSummary, AuthConfig, UserInfo, LoginResponse, TokenVerifyResponse, RegisterRequest, UpdateProfileRequest, CredentialInfo, PluginInfo, PluginNavItem, PluginSettings, PluginSettingField, PlatformContext, PlatformEventType, PlatformEvent, ThemeMode, ColorPalette, TableDensity, } from './types';

package/dist/index.js

@@ -156,6 +156,7 @@ import { ATOMIC_WEIGHTS, useChemicalFormula } from "./composables/useChemicalFor
 import { useSequenceUtils } from "./composables/useSequenceUtils.js";
 import { addMinutes, compareTime, durationMinutes, findAvailableSlots, formatDuration, formatTime, generateTimeSlots, isTimeInRange, parseTime, rangesOverlap, snapToSlot } from "./composables/useTimeUtils.js";
 import { useScheduleDrag } from "./composables/useScheduleDrag.js";
+import { usePluginConfig } from "./composables/usePluginConfig.js";
 import { useAuthStore } from "./stores/auth.js";
 import { colorPalettes, useSettingsStore } from "./stores/settings.js";
 export {
@@ -253,6 +254,7 @@ export {
   useDoseCalculator,
   usePasskey,
   usePlatformContext,
+  usePluginConfig,
   useProtocolTemplates,
   useRackEditor,
   useScheduleDrag,

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/styles.css

@@ -3363,6 +3363,7 @@ html.dark .mld-checkbox__native:focus-visible + .mld-checkbox__box {
 /* NumberInput Component Styles */
 .mld-number-input {
   display: inline-flex;
+  max-width: 100%;
   border-radius: 0.5rem;
   border: 1px solid var(--border-color);
   overflow: hidden;
@@ -3395,6 +3396,7 @@ html.dark .mld-checkbox__native:focus-visible + .mld-checkbox__box {
   display: flex;
   align-items: center;
   justify-content: center;
+  flex-shrink: 0;
   background-color: var(--bg-tertiary);
   color: var(--text-muted);
   border: none;
@@ -3429,7 +3431,8 @@ html.dark .mld-checkbox__native:focus-visible + .mld-checkbox__box {
   height: 1rem;
 }
 .mld-number-input__input {
-  width: 5rem;
+  flex: 1;
+  min-width: 0;
   text-align: center;
   background-color: var(--bg-secondary);
   color: var(--text-primary);
@@ -14652,6 +14655,7 @@ to { transform: rotate(360deg);
 /* NumberInput Component Styles */
 .mld-number-input {
   display: inline-flex;
+  max-width: 100%;
   border-radius: 0.5rem;
   border: 1px solid var(--border-color);
   overflow: hidden;
@@ -14684,6 +14688,7 @@ to { transform: rotate(360deg);
   display: flex;
   align-items: center;
   justify-content: center;
+  flex-shrink: 0;
   background-color: var(--bg-tertiary);
   color: var(--text-muted);
   border: none;
@@ -14718,7 +14723,8 @@ to { transform: rotate(360deg);
   height: 1rem;
 }
 .mld-number-input__input {
-  width: 5rem;
+  flex: 1;
+  min-width: 0;
   text-align: center;
   background-color: var(--bg-secondary);
   color: var(--text-primary);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@morscherlab/mld-sdk",
-  "version": "0.7.0",
+  "version": "0.7.1",
   "description": "MLD Platform SDK - Vue 3 components, composables, and types for plugin development",
   "type": "module",
   "main": "./dist/index.js",

package/src/composables/index.ts

@@ -86,6 +86,7 @@ export {
 } from './useTimeUtils'
 export { useScheduleDrag } from './useScheduleDrag'
 export { useFormBuilder, evaluateCondition } from './useFormBuilder'
+export { usePluginConfig, type UsePluginConfigReturn } from './usePluginConfig'
 export {
   getFieldRegistryEntry,
   getTypeDefault,

package/src/composables/usePluginConfig.ts

@@ -0,0 +1,92 @@
+import { ref, computed, onMounted, type Ref, type ComputedRef } from 'vue'
+import { useApi } from './useApi'
+import { usePlatformContext } from './usePlatformContext'
+
+export interface UsePluginConfigReturn {
+  config: Ref<Record<string, unknown>>
+  isLoading: Ref<boolean>
+  isSaving: Ref<boolean>
+  error: Ref<string | null>
+  isDirty: ComputedRef<boolean>
+  load: () => Promise<void>
+  save: () => Promise<boolean>
+  reset: () => void
+}
+
+export function usePluginConfig(pluginName?: string): UsePluginConfigReturn {
+  const api = useApi()
+  const { plugin } = usePlatformContext()
+
+  const resolvedName = computed(() => pluginName ?? plugin.value?.name ?? '')
+
+  const config = ref<Record<string, unknown>>({})
+  const savedConfig = ref<Record<string, unknown>>({})
+  const isLoading = ref(false)
+  const isSaving = ref(false)
+  const error = ref<string | null>(null)
+
+  const isDirty = computed(() => {
+    return JSON.stringify(config.value) !== JSON.stringify(savedConfig.value)
+  })
+
+  async function load(): Promise<void> {
+    const name = resolvedName.value
+    if (!name) return
+
+    isLoading.value = true
+    error.value = null
+    try {
+      const response = await api.get<{ plugin_name: string; config: Record<string, unknown> }>(
+        `/api/plugins/${encodeURIComponent(name)}/config`,
+      )
+      config.value = { ...response.config }
+      savedConfig.value = { ...response.config }
+    } catch (e) {
+      error.value = e instanceof Error ? e.message : 'Failed to load plugin config'
+    } finally {
+      isLoading.value = false
+    }
+  }
+
+  async function save(): Promise<boolean> {
+    const name = resolvedName.value
+    if (!name) return false
+
+    isSaving.value = true
+    error.value = null
+    try {
+      const response = await api.put<{ plugin_name: string; config: Record<string, unknown> }>(
+        `/api/plugins/${encodeURIComponent(name)}/config`,
+        { config: config.value },
+      )
+      config.value = { ...response.config }
+      savedConfig.value = { ...response.config }
+      return true
+    } catch (e) {
+      error.value = e instanceof Error ? e.message : 'Failed to save plugin config'
+      return false
+    } finally {
+      isSaving.value = false
+    }
+  }
+
+  function reset(): void {
+    config.value = { ...savedConfig.value }
+    error.value = null
+  }
+
+  onMounted(() => {
+    load()
+  })
+
+  return {
+    config,
+    isLoading,
+    isSaving,
+    error,
+    isDirty,
+    load,
+    save,
+    reset,
+  }
+}

package/src/index.ts

@@ -133,6 +133,9 @@ export {
   compareTime,
   // Schedule drag
   useScheduleDrag,
+  // Plugin config
+  usePluginConfig,
+  type UsePluginConfigReturn,
 } from './composables'
 
 // Stores

package/src/styles/components/number-input.css

@@ -2,6 +2,7 @@
 
 .mld-number-input {
   display: inline-flex;
+  max-width: 100%;
   border-radius: 0.5rem;
   border: 1px solid var(--border-color);
   overflow: hidden;
@@ -42,6 +43,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
+  flex-shrink: 0;
   background-color: var(--bg-tertiary);
   color: var(--text-muted);
   border: none;
@@ -85,7 +87,8 @@
 }
 
 .mld-number-input__input {
-  width: 5rem;
+  flex: 1;
+  min-width: 0;
   text-align: center;
   background-color: var(--bg-secondary);
   color: var(--text-primary);