@morscherlab/mint-sdk 1.5.0-beta.1 → 1.5.0-beta.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/{AlertBox-CIhqsWbN.js → AlertBox-CexONPhA.js} +2 -2
- package/dist/{AlertBox-CIhqsWbN.js.map → AlertBox-CexONPhA.js.map} +1 -1
- package/dist/{AppSidebar-BDrd7Kwn.js → AppSidebar-FxlF5_dI.js} +55 -40
- package/dist/AppSidebar-FxlF5_dI.js.map +1 -0
- package/dist/{ConfirmDialog-CjWoxAD1.js → ConfirmDialog-D9QXFpsy.js} +2 -2
- package/dist/ConfirmDialog-D9QXFpsy.js.map +1 -0
- package/dist/{ExperimentPopover-BM92LlrQ.js → ExperimentPopover-Bbd6RaoH.js} +3 -3
- package/dist/{ExperimentPopover-BM92LlrQ.js.map → ExperimentPopover-Bbd6RaoH.js.map} +1 -1
- package/dist/{ExperimentSelectorModal-LsB1ABmh.js → ExperimentSelectorModal-CUkKmgfr.js} +35 -6
- package/dist/ExperimentSelectorModal-CUkKmgfr.js.map +1 -0
- package/dist/{SegmentedControl-Dz41vAFM.js → SegmentedControl-C-sckoJZ.js} +2 -2
- package/dist/{SegmentedControl-Dz41vAFM.js.map → SegmentedControl-C-sckoJZ.js.map} +1 -1
- package/dist/{SettingsModal-C-MSR-bk.js → SettingsModal-BIC0dAYc.js} +6 -6
- package/dist/{SettingsModal-C-MSR-bk.js.map → SettingsModal-BIC0dAYc.js.map} +1 -1
- package/dist/components/FormBuilder.vue.d.ts +1 -1
- package/dist/components/PluginIcon.vue.d.ts +2 -2
- package/dist/components/SectionCard.vue.d.ts +13 -1
- package/dist/components/SettingsModal.vue.d.ts +1 -1
- package/dist/components/internal/FormSchemaInternal.vue.d.ts +9 -9
- package/dist/components/internal/FormSectionRenderer.vue.d.ts +4 -4
- package/dist/composables/useExperimentSelector.d.ts +2 -0
- package/dist/composables/useOnboarding.d.ts +1 -1
- package/dist/{controlSchemaModel-BbXbMgc6.js → controlSchemaModel-C_XqpkgE.js} +2 -2
- package/dist/{controlSchemaModel-BbXbMgc6.js.map → controlSchemaModel-C_XqpkgE.js.map} +1 -1
- package/dist/{data-LzdkEZJ-.js → data-CfY7o8QC.js} +9 -9
- package/dist/{data-LzdkEZJ-.js.map → data-CfY7o8QC.js.map} +1 -1
- package/dist/data.js +7 -7
- package/dist/index.d.ts +0 -1
- package/dist/index.js +14 -19
- package/dist/index.js.map +1 -1
- package/dist/{install-UTqrAgHe.js → install-QF3Sh82O.js} +15 -39
- package/dist/install-QF3Sh82O.js.map +1 -0
- package/dist/install.js +1 -1
- package/dist/{lab-CbdDLAVr.js → lab-BcX5JBSY.js} +34 -112
- package/dist/lab-BcX5JBSY.js.map +1 -0
- package/dist/lab.js +4 -4
- package/dist/{records-CWRztE5M.js → records-BAymyHAn.js} +10 -110
- package/dist/records-BAymyHAn.js.map +1 -0
- package/dist/{runtime-DrL6lKAb.js → runtime-DngeJtdq.js} +82 -45
- package/dist/runtime-DngeJtdq.js.map +1 -0
- package/dist/runtime.js +6 -6
- package/dist/{shell-Ch7cJnjo.js → shell-CWZi97nW.js} +4 -4
- package/dist/{shell-Ch7cJnjo.js.map → shell-CWZi97nW.js.map} +1 -1
- package/dist/shell.js +4 -4
- package/dist/styles.css +181 -125
- package/dist/styles.d.ts +1 -0
- package/dist/types/index.d.ts +1 -1
- package/dist/types/instrument.d.ts +5 -17
- package/dist/{useExperimentSamples-Cz2v3V_q.js → useExperimentSamples-DEDAKa2E.js} +3 -3
- package/dist/{useExperimentSamples-Cz2v3V_q.js.map → useExperimentSamples-DEDAKa2E.js.map} +1 -1
- package/dist/{useListReorder-QqJc1dpX.js → useListReorder-W1bzK_bo.js} +15 -3
- package/dist/useListReorder-W1bzK_bo.js.map +1 -0
- package/dist/{useRackEditor-BHGM1Ngz.js → useRackEditor-Bmtuo0aj.js} +155 -26
- package/dist/useRackEditor-Bmtuo0aj.js.map +1 -0
- package/dist/{useRealtime-CNQbrS01.js → useRealtime-jOetF2mM.js} +3 -3
- package/dist/{useRealtime-CNQbrS01.js.map → useRealtime-jOetF2mM.js.map} +1 -1
- package/dist/{useRequest-Bfsh7gIm.js → useRequest-D9-3BS-3.js} +2 -2
- package/dist/{useRequest-Bfsh7gIm.js.map → useRequest-D9-3BS-3.js.map} +1 -1
- package/package.json +7 -4
- package/src/__tests__/components/AppTopBarOnboarding.test.ts +10 -0
- package/src/__tests__/components/ConfirmDialog.test.ts +2 -2
- package/src/__tests__/components/ExperimentSelectorModal.test.ts +16 -0
- package/src/__tests__/components/SectionCard.test.ts +33 -0
- package/src/__tests__/components/deprecationTags.test.ts +4 -18
- package/src/__tests__/composables/useJobsEndpoint.test.ts +50 -0
- package/src/__tests__/composables/useOnboarding.test.ts +2 -2
- package/src/__tests__/docs/frontendDocsCatalog.test.ts +3 -3
- package/src/components/AppSidebar.vue +2 -2
- package/src/components/CollapsibleCard.vue +1 -1
- package/src/components/ConfirmDialog.vue +1 -1
- package/src/components/ExperimentSelectorModal.vue +35 -0
- package/src/components/FileUploader.vue +3 -35
- package/src/components/GeneratedPluginView.vue +35 -81
- package/src/components/GeneratedResultRenderer.vue +2 -1
- package/src/components/InstrumentStatusPanels.vue +3 -3
- package/src/components/PlotlyChart.vue +1 -1
- package/src/components/PluginIcon.story.vue +2 -2
- package/src/components/PluginIcon.vue +2 -2
- package/src/components/SectionCard.vue +42 -6
- package/src/components/internal/AppTopBarOnboardingInternal.vue +30 -14
- package/src/composables/index.ts +1 -2
- package/src/composables/useExperimentSelector.ts +4 -0
- package/src/composables/useJobsEndpoint.ts +15 -4
- package/src/composables/useOnboarding.ts +3 -3
- package/src/generated-ui/main.ts +3 -1
- package/src/index.ts +0 -3
- package/src/styles/components/alert-box.css +1 -1
- package/src/styles/components/app-sidebar.css +5 -5
- package/src/styles/components/button.css +3 -3
- package/src/styles/components/checkbox.css +1 -1
- package/src/styles/components/collapsible-card.css +1 -1
- package/src/styles/components/confirm-dialog.css +2 -2
- package/src/styles/components/file-uploader.css +3 -3
- package/src/styles/components/icon-button.css +3 -3
- package/src/styles/components/loading-spinner.css +1 -1
- package/src/styles/components/onboarding.css +39 -0
- package/src/styles/components/pill.css +1 -1
- package/src/styles/components/plugin-icon.css +2 -2
- package/src/styles/components/presence-avatars.css +4 -4
- package/src/styles/components/progress-bar.css +1 -1
- package/src/styles/components/section-card.css +65 -6
- package/src/styles/components/sequence-input.css +1 -1
- package/src/styles/components/slider.css +1 -1
- package/src/styles/components/toggle.css +1 -1
- package/src/styles/variables.css +10 -4
- package/src/types/index.ts +0 -1
- package/src/types/instrument.ts +5 -18
- package/dist/AppSidebar-BDrd7Kwn.js.map +0 -1
- package/dist/ConfirmDialog-CjWoxAD1.js.map +0 -1
- package/dist/ExperimentSelectorModal-LsB1ABmh.js.map +0 -1
- package/dist/deprecatedRootExports.d.ts +0 -191
- package/dist/install-UTqrAgHe.js.map +0 -1
- package/dist/lab-CbdDLAVr.js.map +0 -1
- package/dist/records-CWRztE5M.js.map +0 -1
- package/dist/runtime-DrL6lKAb.js.map +0 -1
- package/dist/useListReorder-QqJc1dpX.js.map +0 -1
- package/dist/useRackEditor-BHGM1Ngz.js.map +0 -1
- package/src/deprecatedRootExports.ts +0 -226
package/src/composables/index.ts
CHANGED
|
@@ -1,6 +1,5 @@
|
|
|
1
1
|
// Package-root composables: the L1 and L2 names of spec 3.3. Subpath composables are
|
|
2
|
-
// exported from `lab.ts`, `shell.ts`, `data.ts` and `runtime.ts
|
|
3
|
-
// keeps the other 1.3 root names until MINT 1.5.
|
|
2
|
+
// exported from `lab.ts`, `shell.ts`, `data.ts` and `runtime.ts`.
|
|
4
3
|
export { useTheme } from './useTheme'
|
|
5
4
|
export { useToast } from './useToast'
|
|
6
5
|
export { usePlatform } from './usePlatform'
|
|
@@ -30,6 +30,8 @@ export interface UseExperimentSelectorOptions {
|
|
|
30
30
|
immediate?: boolean
|
|
31
31
|
/** Keep `statusCounts` in step with the non-status filters (one stats request per change). */
|
|
32
32
|
withStatusCounts?: boolean
|
|
33
|
+
/** Filter values to start from, for example the ones a caller saved at the last visit. */
|
|
34
|
+
initialFilters?: Partial<ExperimentFilters>
|
|
33
35
|
}
|
|
34
36
|
|
|
35
37
|
export interface UseExperimentSelectorReturn {
|
|
@@ -89,6 +91,7 @@ export function useExperimentSelector(
|
|
|
89
91
|
allowedExperimentTypes: optionAllowedExperimentTypes,
|
|
90
92
|
apiBaseUrl,
|
|
91
93
|
withStatusCounts = false,
|
|
94
|
+
initialFilters,
|
|
92
95
|
} = options
|
|
93
96
|
const platformBase = apiBaseUrl ?? getPlatformApiUrl()
|
|
94
97
|
const api = useApi()
|
|
@@ -124,6 +127,7 @@ export function useExperimentSelector(
|
|
|
124
127
|
experimentType: undefined,
|
|
125
128
|
datePreset: undefined,
|
|
126
129
|
mine: undefined,
|
|
130
|
+
...initialFilters,
|
|
127
131
|
})
|
|
128
132
|
|
|
129
133
|
function normalizeExperimentTypes(values: string[] | null | undefined): string[] | null {
|
|
@@ -677,16 +677,27 @@ export function useJobsEndpoint(
|
|
|
677
677
|
]))
|
|
678
678
|
jobs.value = nextJobs
|
|
679
679
|
for (const job of nextJobs) settleJobWaiters(job)
|
|
680
|
-
for (const jobId of
|
|
681
|
-
if (!nextJobIds.has(jobId))
|
|
682
|
-
rejectJobWaiters(jobId, new Error(`Job ${jobId} is no longer available`))
|
|
683
|
-
}
|
|
680
|
+
for (const jobId of [...jobWaiters.keys()]) {
|
|
681
|
+
if (!nextJobIds.has(jobId)) void confirmMissingJob(jobId)
|
|
684
682
|
}
|
|
685
683
|
pruneResultState()
|
|
686
684
|
pruneJobRevisions()
|
|
687
685
|
return nextJobs
|
|
688
686
|
}
|
|
689
687
|
|
|
688
|
+
/**
|
|
689
|
+
* A stream snapshot built before a submit can arrive after the submit reply,
|
|
690
|
+
* so a waited job missing from it is gone only once the server says so.
|
|
691
|
+
*/
|
|
692
|
+
async function confirmMissingJob(jobId: string): Promise<void> {
|
|
693
|
+
try {
|
|
694
|
+
await getJob(jobId)
|
|
695
|
+
} catch (cause) {
|
|
696
|
+
if (isRetryableJobLookupError(cause)) return
|
|
697
|
+
rejectJobWaiters(jobId, new Error(`Job ${jobId} is no longer available`))
|
|
698
|
+
}
|
|
699
|
+
}
|
|
700
|
+
|
|
690
701
|
function upsertJob(
|
|
691
702
|
input: GeneratedAnalysisJobInput,
|
|
692
703
|
fallbackDefinitionId?: string,
|
|
@@ -108,7 +108,7 @@ export interface OnboardingState {
|
|
|
108
108
|
showNews: (id: string) => void
|
|
109
109
|
next: () => void
|
|
110
110
|
back: () => void
|
|
111
|
-
/** End the run (× or Esc). Every step of
|
|
111
|
+
/** End the run (× or Esc). Every step of every tour of the app counts as seen; Help can still play them. */
|
|
112
112
|
dismiss: () => void
|
|
113
113
|
complete: (taskId: string) => void
|
|
114
114
|
setChecklistHidden: (hidden: boolean) => void
|
|
@@ -381,8 +381,8 @@ export function provideOnboarding(definition: OnboardingDefinition, options: Pro
|
|
|
381
381
|
|
|
382
382
|
function dismiss() {
|
|
383
383
|
autoStartAbort?.abort()
|
|
384
|
-
|
|
385
|
-
if (tour) markSeen(...tour.steps.map((step) => stepKey(tour, step)))
|
|
384
|
+
// × on a tour ends all tours of the app, so the user closes tours at most once per app.
|
|
385
|
+
if (run?.tour) markSeen(...(definition.tours ?? []).flatMap((tour) => tour.steps.map((step) => stepKey(tour, step))))
|
|
386
386
|
stop()
|
|
387
387
|
}
|
|
388
388
|
|
package/src/generated-ui/main.ts
CHANGED
|
@@ -2,6 +2,7 @@ import { createPinia } from 'pinia'
|
|
|
2
2
|
import { createApp, h } from 'vue'
|
|
3
3
|
|
|
4
4
|
import GeneratedPluginView from '../components/GeneratedPluginView.vue'
|
|
5
|
+
import { useSettingsStore } from '../stores/settings'
|
|
5
6
|
import '../styles/index.css'
|
|
6
7
|
|
|
7
8
|
function generatedApiBase(location: Location): string {
|
|
@@ -13,9 +14,10 @@ const app = createApp({
|
|
|
13
14
|
name: 'MintGeneratedUiApp',
|
|
14
15
|
render: () => h(GeneratedPluginView, {
|
|
15
16
|
baseUrl: generatedApiBase(window.location),
|
|
16
|
-
showStandaloneLabel: true,
|
|
17
17
|
}),
|
|
18
18
|
})
|
|
19
19
|
|
|
20
20
|
app.use(createPinia())
|
|
21
|
+
// Theme, palette and density apply before the first paint, as in the platform.
|
|
22
|
+
useSettingsStore().initialize()
|
|
21
23
|
app.mount('#app')
|
package/src/index.ts
CHANGED
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
.mint-alert__icon--info { background-color: var(--mint-info-bg); color: var(--mint-info); }
|
|
32
32
|
.mint-alert__icon--neutral { background-color: var(--bg-tertiary); color: var(--text-secondary); }
|
|
33
33
|
.mint-alert__icon--primary { background-color: var(--color-primary-soft); color: var(--color-primary); }
|
|
34
|
-
.mint-alert__icon--cta { background-color: var(--color-primary-soft); color: var(--
|
|
34
|
+
.mint-alert__icon--cta { background-color: var(--color-primary-soft); color: var(--_ink-primary); }
|
|
35
35
|
|
|
36
36
|
.mint-alert__content {
|
|
37
37
|
flex: 1;
|
|
@@ -97,8 +97,8 @@
|
|
|
97
97
|
min-width: 1.375rem;
|
|
98
98
|
padding: 0.125rem 0.375rem;
|
|
99
99
|
border-radius: var(--radius);
|
|
100
|
-
background: color-mix(in srgb, var(--color-
|
|
101
|
-
color: var(--color-
|
|
100
|
+
background: color-mix(in srgb, var(--color-primary) 14%, transparent);
|
|
101
|
+
color: var(--color-primary);
|
|
102
102
|
font-size: 0.6875rem;
|
|
103
103
|
font-weight: 700;
|
|
104
104
|
line-height: 1.1;
|
|
@@ -369,7 +369,7 @@
|
|
|
369
369
|
width: 11px;
|
|
370
370
|
height: 11px;
|
|
371
371
|
border-radius: 9999px;
|
|
372
|
-
background:
|
|
372
|
+
background: var(--control-knob);
|
|
373
373
|
box-shadow: var(--shadow-sm);
|
|
374
374
|
transition: left 180ms var(--mint-ease-out-quart);
|
|
375
375
|
}
|
|
@@ -469,7 +469,7 @@
|
|
|
469
469
|
padding: 0 0.25rem;
|
|
470
470
|
border-radius: var(--radius);
|
|
471
471
|
background: var(--mint-sidebar-tone);
|
|
472
|
-
color:
|
|
472
|
+
color: var(--text-on-accent);
|
|
473
473
|
font-size: 0.6875rem;
|
|
474
474
|
font-weight: 700;
|
|
475
475
|
line-height: 1rem;
|
|
@@ -492,7 +492,7 @@
|
|
|
492
492
|
.mint-sidebar__rail-badge--cta,
|
|
493
493
|
.mint-sidebar__tag--cta,
|
|
494
494
|
.mint-sidebar__group-action--cta {
|
|
495
|
-
--mint-sidebar-tone: var(--color-
|
|
495
|
+
--mint-sidebar-tone: var(--color-primary);
|
|
496
496
|
}
|
|
497
497
|
|
|
498
498
|
.mint-sidebar__rail-badge--success,
|
|
@@ -68,17 +68,17 @@
|
|
|
68
68
|
}
|
|
69
69
|
|
|
70
70
|
.mint-button--cta {
|
|
71
|
-
background-color: var(--color-
|
|
71
|
+
background-color: var(--color-primary);
|
|
72
72
|
color: var(--text-on-accent);
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
.mint-button--cta:hover:not(.mint-button--disabled) {
|
|
76
|
-
background-color: var(--color-
|
|
76
|
+
background-color: var(--color-primary-hover);
|
|
77
77
|
}
|
|
78
78
|
|
|
79
79
|
.mint-button--danger {
|
|
80
80
|
background-color: var(--mint-error);
|
|
81
|
-
color:
|
|
81
|
+
color: var(--text-on-danger);
|
|
82
82
|
}
|
|
83
83
|
|
|
84
84
|
.mint-button--danger:hover:not(.mint-button--disabled) {
|
|
@@ -133,7 +133,7 @@
|
|
|
133
133
|
.mint-checkbox__native:disabled + .mint-checkbox__box.mint-checkbox__box--indeterminate {
|
|
134
134
|
background-color: var(--text-muted);
|
|
135
135
|
border-color: var(--text-muted);
|
|
136
|
-
color:
|
|
136
|
+
color: var(--control-knob);
|
|
137
137
|
}
|
|
138
138
|
|
|
139
139
|
.mint-checkbox__box--sm {
|
|
@@ -48,8 +48,8 @@
|
|
|
48
48
|
}
|
|
49
49
|
|
|
50
50
|
.mint-confirm__icon--cta {
|
|
51
|
-
background-color: color-mix(in srgb, var(--color-
|
|
52
|
-
color: var(--color-
|
|
51
|
+
background-color: color-mix(in srgb, var(--color-primary) 12%, transparent);
|
|
52
|
+
color: var(--color-primary);
|
|
53
53
|
}
|
|
54
54
|
|
|
55
55
|
.mint-confirm__icon--neutral {
|
|
@@ -160,9 +160,9 @@
|
|
|
160
160
|
font-size: 0.6875rem;
|
|
161
161
|
font-weight: 700;
|
|
162
162
|
font-family: var(--font-mono);
|
|
163
|
-
color: var(--
|
|
164
|
-
background-color:
|
|
165
|
-
border: 1px solid
|
|
163
|
+
color: var(--text-secondary);
|
|
164
|
+
background-color: var(--bg-tertiary);
|
|
165
|
+
border: 1px solid var(--border-color);
|
|
166
166
|
}
|
|
167
167
|
|
|
168
168
|
.mint-file-uploader__file-meta {
|
|
@@ -57,17 +57,17 @@
|
|
|
57
57
|
}
|
|
58
58
|
|
|
59
59
|
.mint-icon-button--cta {
|
|
60
|
-
background-color: var(--color-
|
|
60
|
+
background-color: var(--color-primary);
|
|
61
61
|
color: var(--text-on-accent);
|
|
62
62
|
}
|
|
63
63
|
|
|
64
64
|
.mint-icon-button--cta:hover:not(.mint-icon-button--disabled) {
|
|
65
|
-
background-color: var(--color-
|
|
65
|
+
background-color: var(--color-primary-hover);
|
|
66
66
|
}
|
|
67
67
|
|
|
68
68
|
.mint-icon-button--danger {
|
|
69
69
|
background-color: var(--mint-error);
|
|
70
|
-
color:
|
|
70
|
+
color: var(--text-on-danger);
|
|
71
71
|
}
|
|
72
72
|
|
|
73
73
|
.mint-icon-button--danger:hover:not(.mint-icon-button--disabled) {
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
|
|
34
34
|
/* Tones */
|
|
35
35
|
.mint-spinner--primary { color: var(--color-primary); }
|
|
36
|
-
.mint-spinner--cta { color: var(--color-
|
|
36
|
+
.mint-spinner--cta { color: var(--color-primary); }
|
|
37
37
|
.mint-spinner--success { color: var(--mint-success); }
|
|
38
38
|
.mint-spinner--warning { color: var(--mint-warning); }
|
|
39
39
|
.mint-spinner--error { color: var(--mint-error); }
|
|
@@ -39,6 +39,44 @@ html.dark {
|
|
|
39
39
|
transition: background-color var(--mint-transition), border-color var(--mint-transition);
|
|
40
40
|
}
|
|
41
41
|
|
|
42
|
+
/* The close button sits inside the chip border, so the chip keeps room for it. */
|
|
43
|
+
.mint-onboarding-help__chip-group {
|
|
44
|
+
position: relative;
|
|
45
|
+
display: inline-flex;
|
|
46
|
+
}
|
|
47
|
+
|
|
48
|
+
.mint-onboarding-help__chip-group .mint-onboarding-help__chip {
|
|
49
|
+
padding-right: 2rem;
|
|
50
|
+
}
|
|
51
|
+
|
|
52
|
+
.mint-onboarding-help__chip-close {
|
|
53
|
+
position: absolute;
|
|
54
|
+
top: 50%;
|
|
55
|
+
right: 0.25rem;
|
|
56
|
+
display: grid;
|
|
57
|
+
place-items: center;
|
|
58
|
+
width: 1.5rem;
|
|
59
|
+
height: 1.5rem;
|
|
60
|
+
padding: 0;
|
|
61
|
+
border: 0;
|
|
62
|
+
border-radius: var(--radius-sm);
|
|
63
|
+
background: transparent;
|
|
64
|
+
color: var(--text-muted);
|
|
65
|
+
cursor: pointer;
|
|
66
|
+
transform: translateY(-50%);
|
|
67
|
+
transition: background-color var(--mint-transition), color var(--mint-transition);
|
|
68
|
+
}
|
|
69
|
+
|
|
70
|
+
.mint-onboarding-help__chip-close:hover {
|
|
71
|
+
background: var(--bg-tertiary);
|
|
72
|
+
color: var(--text-primary);
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
.mint-onboarding-help__chip-close:focus-visible {
|
|
76
|
+
outline: none;
|
|
77
|
+
box-shadow: var(--focus-ring-offset);
|
|
78
|
+
}
|
|
79
|
+
|
|
42
80
|
.mint-onboarding-help__chip:hover {
|
|
43
81
|
background: var(--bg-hover);
|
|
44
82
|
}
|
|
@@ -360,6 +398,7 @@ html.dark {
|
|
|
360
398
|
|
|
361
399
|
@media (prefers-reduced-motion: reduce) {
|
|
362
400
|
.mint-onboarding-help__chip,
|
|
401
|
+
.mint-onboarding-help__chip-close,
|
|
363
402
|
.mint-onboarding-help__bar > span,
|
|
364
403
|
.mint-onboarding-help__progress > span,
|
|
365
404
|
.mint-onboarding__hole {
|
|
@@ -33,7 +33,7 @@
|
|
|
33
33
|
(soft-tint background, dot, outline border); `--mint-pill-ink` the text. A
|
|
34
34
|
`color` prop sets `--mint-pill-tone` inline. */
|
|
35
35
|
.mint-pill--primary { --mint-pill-tone: var(--color-primary); --mint-pill-ink: var(--color-primary-hover); }
|
|
36
|
-
.mint-pill--cta { --mint-pill-tone: var(--color-
|
|
36
|
+
.mint-pill--cta { --mint-pill-tone: var(--color-primary); --mint-pill-ink: var(--color-primary-hover); }
|
|
37
37
|
.mint-pill--success { --mint-pill-tone: var(--mint-success); --mint-pill-ink: var(--mint-success-hover); }
|
|
38
38
|
.mint-pill--warning { --mint-pill-tone: var(--mint-warning); --mint-pill-ink: var(--mint-warning-text); }
|
|
39
39
|
.mint-pill--error { --mint-pill-tone: var(--mint-error); --mint-pill-ink: var(--mint-error-hover); }
|
|
@@ -16,10 +16,10 @@
|
|
|
16
16
|
.mint-plugin-icon--topbar { width: 2.25rem; height: 2.25rem; }
|
|
17
17
|
.mint-plugin-icon--lg { width: 3rem; height: 3rem; }
|
|
18
18
|
|
|
19
|
-
/* Tones (deprecated with the tone/color props, removed in
|
|
19
|
+
/* Tones (deprecated with the tone/color props, removed in 2.0): the v2 tile no longer reads the variable. */
|
|
20
20
|
.mint-plugin-icon--neutral { --mint-plugin-icon-tone: var(--text-secondary); }
|
|
21
21
|
.mint-plugin-icon--primary { --mint-plugin-icon-tone: var(--color-primary); }
|
|
22
|
-
.mint-plugin-icon--cta { --mint-plugin-icon-tone: var(--color-
|
|
22
|
+
.mint-plugin-icon--cta { --mint-plugin-icon-tone: var(--color-primary); }
|
|
23
23
|
.mint-plugin-icon--success { --mint-plugin-icon-tone: var(--mint-success); }
|
|
24
24
|
.mint-plugin-icon--warning { --mint-plugin-icon-tone: var(--mint-warning); }
|
|
25
25
|
.mint-plugin-icon--error { --mint-plugin-icon-tone: var(--mint-error); }
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
/* PresenceAvatars: an avatar stack that opens a list of who is here.
|
|
2
2
|
* The editing cue is a ring plus a pencil badge, so it does not depend on
|
|
3
|
-
* colour only. Light mode uses --color-
|
|
4
|
-
* mode --color-
|
|
3
|
+
* colour only. Light mode uses --color-primary-hover (3:1 on the card), dark
|
|
4
|
+
* mode --color-primary. --mint-presence-surface is the colour the avatars are
|
|
5
5
|
* cut out of; set it when the stack sits on another surface. */
|
|
6
6
|
|
|
7
7
|
.mint-presence {
|
|
8
|
-
--mint-presence-editing: var(--color-
|
|
8
|
+
--mint-presence-editing: var(--color-primary-hover);
|
|
9
9
|
--mint-presence-surface: var(--bg-secondary);
|
|
10
10
|
position: relative;
|
|
11
11
|
display: inline-flex;
|
|
12
12
|
}
|
|
13
13
|
|
|
14
14
|
:where(html.dark) .mint-presence {
|
|
15
|
-
--mint-presence-editing: var(--color-
|
|
15
|
+
--mint-presence-editing: var(--color-primary);
|
|
16
16
|
}
|
|
17
17
|
|
|
18
18
|
.mint-presence__trigger {
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
.mint-progress__bar--success { background-color: var(--mint-success); }
|
|
47
47
|
.mint-progress__bar--warning { background-color: var(--mint-warning); }
|
|
48
48
|
.mint-progress__bar--error { background-color: var(--mint-error); }
|
|
49
|
-
.mint-progress__bar--cta { background-color: var(--color-
|
|
49
|
+
.mint-progress__bar--cta { background-color: var(--color-primary); }
|
|
50
50
|
.mint-progress__bar--neutral { background-color: var(--text-muted); }
|
|
51
51
|
.mint-progress__bar--info { background-color: var(--color-primary); } /* 6b: progress fill is always primary; --mint-info is for the running dot */
|
|
52
52
|
|
|
@@ -27,6 +27,11 @@
|
|
|
27
27
|
min-height: 0;
|
|
28
28
|
}
|
|
29
29
|
|
|
30
|
+
/* A collapsed fill card gives its track back to its siblings. */
|
|
31
|
+
.mint-section-card--fill.mint-section-card--collapsed {
|
|
32
|
+
flex: none;
|
|
33
|
+
}
|
|
34
|
+
|
|
30
35
|
.mint-section-card--fill .mint-section-card__body {
|
|
31
36
|
flex: 1;
|
|
32
37
|
min-height: 0;
|
|
@@ -41,7 +46,7 @@
|
|
|
41
46
|
min-height: 2.5rem;
|
|
42
47
|
/* 4px block padding: a 28px header control plus padding plus the 1px rule
|
|
43
48
|
stays inside the 40px strip (6px made it 41px). */
|
|
44
|
-
padding: 0.25rem 0.625rem 0.25rem
|
|
49
|
+
padding: 0.25rem 0.625rem 0.25rem var(--mint-section-card-inset);
|
|
45
50
|
border-bottom: 1px solid var(--border-color);
|
|
46
51
|
flex-shrink: 0;
|
|
47
52
|
}
|
|
@@ -50,6 +55,45 @@
|
|
|
50
55
|
border-bottom-color: var(--border-light);
|
|
51
56
|
}
|
|
52
57
|
|
|
58
|
+
/* A collapsed card is its header alone: no rule under it. */
|
|
59
|
+
.mint-section-card__header--collapsed {
|
|
60
|
+
border-bottom-color: transparent;
|
|
61
|
+
}
|
|
62
|
+
|
|
63
|
+
.mint-section-card__toggle {
|
|
64
|
+
display: inline-flex;
|
|
65
|
+
align-items: center;
|
|
66
|
+
gap: var(--mint-section-card-gap);
|
|
67
|
+
margin: 0;
|
|
68
|
+
padding: 0;
|
|
69
|
+
border: 0;
|
|
70
|
+
background: none;
|
|
71
|
+
color: inherit;
|
|
72
|
+
font: inherit;
|
|
73
|
+
cursor: pointer;
|
|
74
|
+
}
|
|
75
|
+
|
|
76
|
+
.mint-section-card__toggle:focus-visible {
|
|
77
|
+
outline: none;
|
|
78
|
+
box-shadow: var(--focus-ring-offset);
|
|
79
|
+
border-radius: var(--radius-sm);
|
|
80
|
+
}
|
|
81
|
+
|
|
82
|
+
.mint-section-card__chevron {
|
|
83
|
+
width: 0.875rem;
|
|
84
|
+
height: 0.875rem;
|
|
85
|
+
color: var(--text-muted);
|
|
86
|
+
transition: transform var(--mint-transition);
|
|
87
|
+
}
|
|
88
|
+
|
|
89
|
+
.mint-section-card__toggle[aria-expanded="false"] .mint-section-card__chevron {
|
|
90
|
+
transform: rotate(-90deg);
|
|
91
|
+
}
|
|
92
|
+
|
|
93
|
+
.mint-section-card__toggle:hover .mint-section-card__chevron {
|
|
94
|
+
color: var(--text-secondary);
|
|
95
|
+
}
|
|
96
|
+
|
|
53
97
|
/* Muted icon, no tinted chip: every accent renders the same. */
|
|
54
98
|
.mint-section-card__icon-chip {
|
|
55
99
|
display: inline-flex;
|
|
@@ -97,7 +141,8 @@
|
|
|
97
141
|
display: flex;
|
|
98
142
|
align-items: center;
|
|
99
143
|
justify-content: space-between;
|
|
100
|
-
|
|
144
|
+
/* Text starts on the card inset; controls end where the header's do. */
|
|
145
|
+
padding: 0.5rem 0.625rem 0.5rem var(--mint-section-card-inset);
|
|
101
146
|
border-top: 1px solid var(--border-color);
|
|
102
147
|
background: var(--bg-primary);
|
|
103
148
|
font-size: 0.75rem;
|
|
@@ -118,7 +163,7 @@
|
|
|
118
163
|
display: flex;
|
|
119
164
|
align-items: center;
|
|
120
165
|
gap: var(--mint-section-card-gap);
|
|
121
|
-
padding: 0.375rem
|
|
166
|
+
padding: 0.375rem var(--mint-section-card-inset);
|
|
122
167
|
background: var(--bg-secondary);
|
|
123
168
|
transition: background-color var(--mint-transition);
|
|
124
169
|
}
|
|
@@ -153,12 +198,26 @@ button.mint-section-card__row:hover {
|
|
|
153
198
|
/* Comfortable density gives the header and rows back their height. */
|
|
154
199
|
[data-density="comfortable"] .mint-section-card__header {
|
|
155
200
|
min-height: 2.75rem;
|
|
156
|
-
padding: 0.
|
|
201
|
+
padding-right: 0.75rem;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
[data-density="comfortable"] .mint-section-card__footer {
|
|
205
|
+
padding-right: 0.75rem;
|
|
157
206
|
}
|
|
158
207
|
|
|
159
208
|
[data-density="comfortable"] .mint-section-card__row {
|
|
160
209
|
padding-top: 0.5rem;
|
|
161
210
|
padding-bottom: 0.5rem;
|
|
162
|
-
|
|
163
|
-
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
/* A table that is the card body's own child starts and ends on the card's text
|
|
214
|
+
inset, so its first column lines up under the header title. A table inside a
|
|
215
|
+
padded wrapper keeps its padding, and the checkbox and actions columns stay
|
|
216
|
+
centred controls. The table's size padding uses !important, so this must too. */
|
|
217
|
+
.mint-section-card__body > .mint-dataframe :is(.mint-dataframe__th, .mint-dataframe__td):first-child:not(.mint-dataframe__th--checkbox, .mint-dataframe__td--checkbox) {
|
|
218
|
+
padding-left: var(--mint-section-card-inset) !important;
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
.mint-section-card__body > .mint-dataframe :is(.mint-dataframe__th, .mint-dataframe__td):last-child:not(.mint-dataframe__th--actions, .mint-dataframe__td--actions) {
|
|
222
|
+
padding-right: var(--mint-section-card-inset) !important;
|
|
164
223
|
}
|
|
@@ -226,7 +226,7 @@
|
|
|
226
226
|
.mint-sequence-input__problem--error .mint-sequence-input__problem-shape { fill: var(--mint-error); }
|
|
227
227
|
|
|
228
228
|
.mint-sequence-input__problem-mark {
|
|
229
|
-
stroke:
|
|
229
|
+
stroke: var(--text-on-danger);
|
|
230
230
|
stroke-width: 1.6;
|
|
231
231
|
stroke-linecap: round;
|
|
232
232
|
}
|
|
@@ -56,7 +56,7 @@
|
|
|
56
56
|
box-sizing: border-box;
|
|
57
57
|
transform: translateX(-50%) translateY(-50%);
|
|
58
58
|
border-radius: 9999px;
|
|
59
|
-
background-color:
|
|
59
|
+
background-color: var(--control-knob);
|
|
60
60
|
border: 1px solid color-mix(in srgb, var(--text-secondary) 40%, transparent);
|
|
61
61
|
box-shadow: var(--shadow-sm);
|
|
62
62
|
pointer-events: none;
|
|
@@ -151,7 +151,7 @@
|
|
|
151
151
|
top: 50%;
|
|
152
152
|
left: 2px;
|
|
153
153
|
border-radius: 9999px;
|
|
154
|
-
background-color:
|
|
154
|
+
background-color: var(--control-knob);
|
|
155
155
|
box-shadow: var(--shadow-sm);
|
|
156
156
|
transition: transform 180ms cubic-bezier(0.25, 1, 0.5, 1);
|
|
157
157
|
pointer-events: none;
|
package/src/styles/variables.css
CHANGED
|
@@ -3,8 +3,6 @@
|
|
|
3
3
|
* @import '@morscherlab/mint-sdk/styles';
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
|
-
@import url('https://fonts.googleapis.com/css2?family=Geist:wght@400;500;600;700&family=Geist+Mono:wght@400;500;600&display=swap');
|
|
7
|
-
|
|
8
6
|
/* Tailwind v4's layer order, declared first so the SDK's base and utilities
|
|
9
7
|
layers sort the same way with or without Tailwind in the host. */
|
|
10
8
|
@layer theme, base, components, utilities;
|
|
@@ -61,12 +59,16 @@
|
|
|
61
59
|
--mint-primary: var(--color-primary);
|
|
62
60
|
/* Text and icons on an accent fill (filled buttons, Save). */
|
|
63
61
|
--text-on-accent: #FFFFFF;
|
|
64
|
-
/*
|
|
62
|
+
/* Text on a --mint-error fill (danger buttons); white in both themes, 3.76:1 on #EF4444. */
|
|
63
|
+
--text-on-danger: #FFFFFF;
|
|
64
|
+
/* Knob of a toggle or slider, and the mark of a disabled checkbox; white in both themes. */
|
|
65
|
+
--control-knob: #FFFFFF;
|
|
66
|
+
/* Retired hues, aliased to the accent until 2.0 (mint doctor warns on use). */
|
|
65
67
|
--color-cta: var(--color-primary);
|
|
66
68
|
--color-cta-hover: var(--color-primary-hover);
|
|
67
69
|
--color-purple: var(--color-primary);
|
|
68
70
|
|
|
69
|
-
/* Entity colors — retired hues, aliased to slate until
|
|
71
|
+
/* Entity colors — retired hues, aliased to slate until 2.0. Entities are told
|
|
70
72
|
apart by icon and label, not by hue. Only -hover has no neutral token. */
|
|
71
73
|
--color-experiment: var(--text-secondary-strong);
|
|
72
74
|
--color-experiment-hover: #334155;
|
|
@@ -136,6 +138,9 @@
|
|
|
136
138
|
--mint-gutter: 0.5rem;
|
|
137
139
|
/* Distance from the outermost cards to the window edge, in every density. */
|
|
138
140
|
--mint-page-inset: 1rem;
|
|
141
|
+
/* Text inset of a SectionCard: its title, row text and table edge columns
|
|
142
|
+
start here, and page chrome over a card (breadcrumbs) can line up with it. */
|
|
143
|
+
--mint-section-card-inset: 0.75rem;
|
|
139
144
|
|
|
140
145
|
/* Semantic colors */
|
|
141
146
|
--mint-success: #10B981;
|
|
@@ -379,6 +384,7 @@ html.dark [data-palette="forest"] {
|
|
|
379
384
|
/* Comfortable density (html[data-density], written by the settings store):
|
|
380
385
|
the pre-v2 control heights and a wider gutter. */
|
|
381
386
|
[data-density="comfortable"] {
|
|
387
|
+
--mint-section-card-inset: 0.875rem;
|
|
382
388
|
--form-height-sm: 2rem;
|
|
383
389
|
--form-height-md: 2.25rem;
|
|
384
390
|
--form-height-lg: 3rem;
|
package/src/types/index.ts
CHANGED
package/src/types/instrument.ts
CHANGED
|
@@ -24,24 +24,6 @@ export interface SequenceProgress {
|
|
|
24
24
|
sample_durations?: readonly number[]
|
|
25
25
|
}
|
|
26
26
|
|
|
27
|
-
/** @deprecated Scheduled for removal in MINT 1.4; instrument monitor types move to the mld-ms plugins. */
|
|
28
|
-
export interface InstrumentStatus {
|
|
29
|
-
instrument_id: string
|
|
30
|
-
instrument_name?: string | null
|
|
31
|
-
monitor_id?: string | null
|
|
32
|
-
state: InstrumentState
|
|
33
|
-
active_method?: string | null
|
|
34
|
-
current_sample?: SampleInfo | null
|
|
35
|
-
sequence_progress?: SequenceProgress | null
|
|
36
|
-
timestamp?: string | Date
|
|
37
|
-
last_seen?: string | Date | null
|
|
38
|
-
connected?: boolean
|
|
39
|
-
sequence_file?: string | null
|
|
40
|
-
sequence_row_index?: number | null
|
|
41
|
-
current_raw_file?: string | null
|
|
42
|
-
method_elapsed_pct?: number | null
|
|
43
|
-
}
|
|
44
|
-
|
|
45
27
|
/** A state the platform derives for an instrument: its reported state, `never` (no report yet) or `inactive`. */
|
|
46
28
|
export type InstrumentBadgeState = InstrumentState | 'never' | 'inactive'
|
|
47
29
|
|
|
@@ -91,7 +73,12 @@ export interface InstrumentLiveStatus {
|
|
|
91
73
|
current_sample?: SampleInfo | null
|
|
92
74
|
sequence_progress?: InstrumentLiveProgress | null
|
|
93
75
|
has_unacknowledged_alerts: boolean
|
|
76
|
+
/** False when `latest_critical_at` is before `alerts_since`. */
|
|
94
77
|
has_unacknowledged_critical: boolean
|
|
78
|
+
/** Time of the newest unacknowledged critical alert, as the plugin reported it (ISO 8601). */
|
|
79
|
+
latest_critical_at?: string | null
|
|
80
|
+
/** Start of the platform alert window (ISO 8601); null when the window is off. */
|
|
81
|
+
alerts_since?: string | null
|
|
95
82
|
/** Server receive time of the latest report (ISO 8601). */
|
|
96
83
|
last_seen: string
|
|
97
84
|
/** When the state last changed (ISO 8601). */
|