@morscherlab/mint-sdk 1.5.0-beta.6 → 1.5.0-beta.7

package/dist/{ExperimentPopover-Bbd6RaoH.js → ExperimentPopover-DyjoXwry.js}

@@ -2,7 +2,7 @@ import { o as __exportAll, t as useDropdownState } from "./useDropdownState-uFIz
 import { A as formatRelativeTime } from "./records-BAymyHAn.js";
 import { t as ConfirmDialog_default } from "./ConfirmDialog-D9QXFpsy.js";
 import { n as format } from "./experimentStatus-DCn2QKG7.js";
-import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, onUnmounted, openBlock, ref, renderList, toDisplayString, unref, useTemplateRef, watch, withModifiers } from "vue";
+import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, nextTick, normalizeClass, normalizeStyle, openBlock, ref, renderList, toDisplayString, unref, useTemplateRef, watch, withModifiers } from "vue";
 import { ArrowLeftRight, Check, ChevronDown, CircleAlert, CloudUpload, ExternalLink, Link, LoaderCircle, Unlink } from "lucide-vue-next";
 //#region src/components/ExperimentPopover.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
@@ -127,7 +127,7 @@ var ExperimentPopover_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*
 			triggerRef: useTemplateRef("trigger"),
 			closeOnEscape: false
 		});
-		const showSuccess = ref(false);
+		const showSuccess = computed(() => !!props.saveSuccessMessage);
 		const showConfirm = ref(false);
 		const panel = useTemplateRef("panel");
 		const panelAlignEnd = ref(false);
@@ -140,7 +140,7 @@ var ExperimentPopover_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*
 		});
 		const saveTitle = computed(() => {
 			if (props.saveDisabled && props.saveDisabledMessage) return props.saveDisabledMessage;
-			if (showSuccess.value && props.saveSuccessMessage) return props.saveSuccessMessage;
+			if (props.saveSuccessMessage) return props.saveSuccessMessage;
 			return `${props.saveLabel} to experiment`;
 		});
 		function metaRows() {
@@ -170,26 +170,13 @@ var ExperimentPopover_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*
 		}
 		function handleConfirmSave() {
 			showConfirm.value = false;
+			if (props.saveDisabled || props.saveLoading) return;
 			emit("save");
 		}
 		function handleDetach() {
 			emit("detach");
 			close();
 		}
-		let successTimer = null;
-		watch(() => props.saveSuccessMessage, (msg) => {
-			if (successTimer) clearTimeout(successTimer);
-			if (msg) {
-				showSuccess.value = true;
-				successTimer = setTimeout(() => {
-					showSuccess.value = false;
-					successTimer = null;
-				}, 3e3);
-			}
-		});
-		onUnmounted(() => {
-			if (successTimer) clearTimeout(successTimer);
-		});
 		return (_ctx, _cache) => {
 			return openBlock(), createElementBlock("div", {
 				ref: "popover",
@@ -334,4 +321,4 @@ var ExperimentPopover_default = ExperimentPopover_vue_vue_type_script_setup_true
 //#endregion
 export { ExperimentPopover_exports as n, ExperimentPopover_default as t };
 
-//# sourceMappingURL=ExperimentPopover-Bbd6RaoH.js.map
+//# sourceMappingURL=ExperimentPopover-DyjoXwry.js.map

package/dist/ExperimentPopover-DyjoXwry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExperimentPopover-DyjoXwry.js","names":[],"sources":["../src/components/ExperimentPopover.vue","../src/components/ExperimentPopover.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** Top-bar control for the attached experiment: a trigger joined to an optional Save button, with a summary panel (change, open, detach). */\nimport { ref, computed, watch, nextTick, useTemplateRef } from 'vue'\nimport { ArrowLeftRight, Check, ChevronDown, CircleAlert, CloudUpload, ExternalLink, Link, LoaderCircle, Unlink } from 'lucide-vue-next'\nimport { useDropdownState } from '../composables/useDropdownState'\nimport { format as formatStatus } from '../utils/experimentStatus'\nimport { formatRelativeTime } from '../utils/time'\nimport ConfirmDialog from './ConfirmDialog.vue'\n\ninterface Props {\n  experimentName?: string\n  experimentCode?: string\n  experimentStatus?: string\n  /** Platform id of the bound experiment; enables \"Open in MINT\". */\n  experimentId?: number | null\n  experimentProject?: string\n  experimentOwner?: string\n  /** ISO timestamp of the last update, shown as relative time. */\n  experimentUpdatedAt?: string\n  /** An experiment is bound but the platform has not returned its record yet. */\n  isResolving?: boolean\n  /** Message explaining why the bound experiment could not be resolved. */\n  error?: string\n  showSave?: boolean\n  showDetach?: boolean\n  saveDisabled?: boolean\n  saveLoading?: boolean\n  saveSuccessMessage?: string\n  saveDisabledMessage?: string\n  saveLabel?: string\n  /** Unsaved changes: marks the Save button with a dot. */\n  dirty?: boolean\n  confirmSave?: boolean\n  confirmTitle?: string\n  confirmMessage?: string\n  /** Empty-state trigger label. */\n  placeholder?: string\n  /** The trigger name truncates at this width (px); its title shows code and name in full. */\n  maxNameWidth?: number\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  experimentId: null,\n  isResolving: false,\n  showSave: false,\n  showDetach: false,\n  saveDisabled: false,\n  saveLoading: false,\n  saveLabel: 'Save',\n  dirty: false,\n  confirmSave: true,\n  placeholder: 'Attach experiment',\n  maxNameWidth: 200,\n})\n\n// An experiment is bound but has no name to show — either still resolving or\n// resolution failed. The id is never substituted: a name may only come from the\n// platform, so these states say what is happening instead of inventing a label.\nconst isUnresolved = computed(() => props.isResolving || !!props.error)\nconst hasExperiment = computed(() => !!props.experimentName || !!props.experimentCode)\nconst isEmpty = computed(() => !isUnresolved.value && !hasExperiment.value)\nconst hasSave = computed(() => props.showSave && !isUnresolved.value && hasExperiment.value)\n\nconst triggerLabel = computed(() => {\n  if (props.isResolving) return 'Loading experiment'\n  if (props.error) return 'Experiment unavailable'\n  return [props.experimentCode, props.experimentName].filter(Boolean).join(' · ') || props.placeholder\n})\n\nconst emit = defineEmits<{\n  select: []\n  save: []\n  detach: []\n}>()\n\nconst { isOpen, close, toggle } = useDropdownState({\n  rootRef: useTemplateRef<HTMLElement>('popover'),\n  triggerRef: useTemplateRef<HTMLElement>('trigger'),\n  closeOnEscape: false,\n})\n// The parent owns the success timer; the indicator lasts as long as its message.\nconst showSuccess = computed(() => !!props.saveSuccessMessage)\nconst showConfirm = ref(false)\n\n// The panel hangs from the group's left edge; when that would cross the\n// viewport's right edge (a control at the end of the top bar) it hangs from the right.\nconst panel = useTemplateRef<HTMLElement>('panel')\nconst panelAlignEnd = ref(false)\nwatch(isOpen, async (open) => {\n  if (!open) return\n  panelAlignEnd.value = false\n  await nextTick()\n  const right = panel.value?.getBoundingClientRect().right ?? 0\n  panelAlignEnd.value = right > document.documentElement.clientWidth\n})\n\nconst saveTitle = computed(() => {\n  if (props.saveDisabled && props.saveDisabledMessage) return props.saveDisabledMessage\n  if (props.saveSuccessMessage) return props.saveSuccessMessage\n  return `${props.saveLabel} to experiment`\n})\n\n// A function, not a computed: \"Updated\" is relative to now, so it is\n// re-evaluated each time the panel renders.\nfunction metaRows(): [string, string][] {\n  return ([\n    ['Project', props.experimentProject],\n    ['Status', props.experimentStatus && formatStatus(props.experimentStatus)],\n    ['Owner', props.experimentOwner],\n    ['Updated', props.experimentUpdatedAt && formatRelativeTime(props.experimentUpdatedAt)],\n  ] as [string, string | undefined][]).filter((row): row is [string, string] => !!row[1])\n}\n\nfunction handleTriggerClick() {\n  if (isEmpty.value) {\n    emit('select')\n    return\n  }\n  toggle()\n}\n\nfunction handleSelect() {\n  emit('select')\n  close()\n}\n\nfunction handleSave() {\n  if (props.saveDisabled || props.saveLoading) return\n  close()\n  if (props.confirmSave) {\n    showConfirm.value = true\n  } else {\n    emit('save')\n  }\n}\n\nfunction handleConfirmSave() {\n  showConfirm.value = false\n  if (props.saveDisabled || props.saveLoading) return\n  emit('save')\n}\n\nfunction handleDetach() {\n  emit('detach')\n  close()\n}\n</script>\n\n<template>\n  <div ref=\"popover\" :class=\"['mint-experiment-popover', { 'mint-experiment-popover--save': hasSave }]\">\n    <!-- Trigger: code + name when attached, opens the panel; the empty state selects directly. -->\n    <button\n      ref=\"trigger\"\n      type=\"button\"\n      :class=\"[\n        'mint-experiment-popover__trigger',\n        { 'mint-experiment-popover__trigger--active': isOpen },\n        { 'mint-experiment-popover__trigger--empty': isEmpty },\n        { 'mint-experiment-popover__trigger--loading': isResolving },\n        { 'mint-experiment-popover__trigger--error': !isResolving && !!error },\n      ]\"\n      :title=\"triggerLabel\"\n      :aria-label=\"isUnresolved ? triggerLabel : undefined\"\n      :aria-busy=\"isResolving || undefined\"\n      :aria-expanded=\"isEmpty ? undefined : isOpen\"\n      @click.stop=\"handleTriggerClick\"\n    >\n      <!-- Resolving and error come first: with an experiment bound but no name\n           yet, the empty placeholder would be a lie. -->\n      <span v-if=\"isResolving\" class=\"mint-experiment-popover__trigger-skeleton\" aria-hidden=\"true\" />\n      <template v-else-if=\"error\">\n        <CircleAlert class=\"mint-experiment-popover__trigger-icon\" :size=\"14\" aria-hidden=\"true\" />\n        <span class=\"mint-experiment-popover__trigger-text\">Experiment unavailable</span>\n      </template>\n      <template v-else-if=\"hasExperiment\">\n        <span v-if=\"experimentCode\" class=\"mint-exp-code mint-exp-code--sm\">{{ experimentCode }}</span>\n        <span\n          v-if=\"experimentName\"\n          class=\"mint-experiment-popover__trigger-text\"\n          :style=\"{ maxWidth: `${maxNameWidth}px` }\"\n        >{{ experimentName }}</span>\n      </template>\n      <template v-else>\n        <Link class=\"mint-experiment-popover__trigger-icon\" :size=\"14\" aria-hidden=\"true\" />\n        <span class=\"mint-experiment-popover__trigger-text\">{{ placeholder }}</span>\n      </template>\n      <ChevronDown v-if=\"!isEmpty\" class=\"mint-experiment-popover__trigger-chevron\" :size=\"13\" aria-hidden=\"true\" />\n    </button>\n\n    <!-- Save: joined to the trigger at top-bar level, never inside the panel. -->\n    <button\n      v-if=\"hasSave\"\n      type=\"button\"\n      :class=\"[\n        'mint-experiment-popover__save',\n        { 'mint-experiment-popover__save--loading': saveLoading },\n        { 'mint-experiment-popover__save--success': showSuccess },\n        { 'mint-experiment-popover__save--disabled': saveDisabled && !showSuccess },\n      ]\"\n      :disabled=\"saveLoading || (saveDisabled && !showSuccess)\"\n      :title=\"saveTitle\"\n      :aria-label=\"dirty ? `${saveTitle} (unsaved changes)` : saveTitle\"\n      @click.stop=\"handleSave\"\n    >\n      <LoaderCircle v-if=\"saveLoading\" class=\"mint-experiment-popover__save-spinner\" :size=\"14\" aria-hidden=\"true\" />\n      <Check v-else-if=\"showSuccess\" :size=\"14\" aria-hidden=\"true\" />\n      <CloudUpload v-else :size=\"14\" aria-hidden=\"true\" />\n      <span>{{ saveLoading ? 'Saving…' : saveLabel }}</span>\n      <span v-if=\"dirty && !saveLoading\" class=\"mint-experiment-popover__dirty\" aria-hidden=\"true\" />\n    </button>\n\n    <!-- Summary panel: header, meta, then menu rows. No buttons inside. -->\n    <div\n      v-if=\"isOpen\"\n      ref=\"panel\"\n      :class=\"['mint-experiment-popover__panel', { 'mint-experiment-popover__panel--end': panelAlignEnd }]\"\n    >\n      <!-- Bound, still resolving — placeholders stand in for the record. -->\n      <div v-if=\"isResolving\" class=\"mint-experiment-popover__head\" aria-busy=\"true\">\n        <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--code\" />\n        <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--name\" />\n      </div>\n\n      <!-- Bound, resolution failed — Detach stays reachable below. -->\n      <div v-else-if=\"error\" class=\"mint-experiment-popover__head mint-experiment-popover__head--error\" role=\"alert\">\n        <b class=\"mint-experiment-popover__name\">\n          <CircleAlert :size=\"14\" aria-hidden=\"true\" />\n          Experiment unavailable\n        </b>\n        <span class=\"mint-experiment-popover__message\">{{ error }}</span>\n      </div>\n\n      <template v-else>\n        <div class=\"mint-experiment-popover__head\">\n          <span v-if=\"experimentCode\" class=\"mint-exp-code mint-exp-code--sm\">{{ experimentCode }}</span>\n          <b v-if=\"experimentName\" class=\"mint-experiment-popover__name\">{{ experimentName }}</b>\n        </div>\n        <dl v-if=\"metaRows().length\" class=\"mint-experiment-popover__meta\">\n          <template v-for=\"[label, value] in metaRows()\" :key=\"label\">\n            <dt>{{ label }}</dt>\n            <dd>{{ value }}</dd>\n          </template>\n        </dl>\n      </template>\n\n      <div class=\"mint-experiment-popover__separator\" role=\"separator\" />\n\n      <button type=\"button\" class=\"mint-experiment-popover__option\" @click=\"handleSelect\">\n        <ArrowLeftRight class=\"mint-experiment-popover__option-icon\" :size=\"14\" aria-hidden=\"true\" />\n        Change experiment…\n      </button>\n      <a\n        v-if=\"experimentId != null\"\n        class=\"mint-experiment-popover__option\"\n        :href=\"`/experiments/${experimentId}`\"\n        target=\"_blank\"\n        rel=\"noopener\"\n        @click=\"close()\"\n      >\n        <ExternalLink class=\"mint-experiment-popover__option-icon\" :size=\"14\" aria-hidden=\"true\" />\n        Open in MINT\n      </a>\n      <button\n        v-if=\"showDetach\"\n        type=\"button\"\n        class=\"mint-experiment-popover__option mint-experiment-popover__option--danger\"\n        @click=\"handleDetach\"\n      >\n        <Unlink class=\"mint-experiment-popover__option-icon\" :size=\"14\" aria-hidden=\"true\" />\n        Detach\n      </button>\n    </div>\n\n    <!-- Save confirmation dialog -->\n    <ConfirmDialog\n      v-model:open=\"showConfirm\"\n      :title=\"confirmTitle ?? 'Save to Experiment'\"\n      :message=\"confirmMessage ?? `Save current data to ${experimentName ?? experimentCode}?`\"\n      tone=\"info\"\n      :confirm-label=\"saveLabel\"\n      :loading=\"saveLoading\"\n      @confirm=\"handleConfirmSave\"\n    />\n  </div>\n</template>\n","<script setup lang=\"ts\">\n/** Top-bar control for the attached experiment: a trigger joined to an optional Save button, with a summary panel (change, open, detach). */\nimport { ref, computed, watch, nextTick, useTemplateRef } from 'vue'\nimport { ArrowLeftRight, Check, ChevronDown, CircleAlert, CloudUpload, ExternalLink, Link, LoaderCircle, Unlink } from 'lucide-vue-next'\nimport { useDropdownState } from '../composables/useDropdownState'\nimport { format as formatStatus } from '../utils/experimentStatus'\nimport { formatRelativeTime } from '../utils/time'\nimport ConfirmDialog from './ConfirmDialog.vue'\n\ninterface Props {\n  experimentName?: string\n  experimentCode?: string\n  experimentStatus?: string\n  /** Platform id of the bound experiment; enables \"Open in MINT\". */\n  experimentId?: number | null\n  experimentProject?: string\n  experimentOwner?: string\n  /** ISO timestamp of the last update, shown as relative time. */\n  experimentUpdatedAt?: string\n  /** An experiment is bound but the platform has not returned its record yet. */\n  isResolving?: boolean\n  /** Message explaining why the bound experiment could not be resolved. */\n  error?: string\n  showSave?: boolean\n  showDetach?: boolean\n  saveDisabled?: boolean\n  saveLoading?: boolean\n  saveSuccessMessage?: string\n  saveDisabledMessage?: string\n  saveLabel?: string\n  /** Unsaved changes: marks the Save button with a dot. */\n  dirty?: boolean\n  confirmSave?: boolean\n  confirmTitle?: string\n  confirmMessage?: string\n  /** Empty-state trigger label. */\n  placeholder?: string\n  /** The trigger name truncates at this width (px); its title shows code and name in full. */\n  maxNameWidth?: number\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  experimentId: null,\n  isResolving: false,\n  showSave: false,\n  showDetach: false,\n  saveDisabled: false,\n  saveLoading: false,\n  saveLabel: 'Save',\n  dirty: false,\n  confirmSave: true,\n  placeholder: 'Attach experiment',\n  maxNameWidth: 200,\n})\n\n// An experiment is bound but has no name to show — either still resolving or\n// resolution failed. The id is never substituted: a name may only come from the\n// platform, so these states say what is happening instead of inventing a label.\nconst isUnresolved = computed(() => props.isResolving || !!props.error)\nconst hasExperiment = computed(() => !!props.experimentName || !!props.experimentCode)\nconst isEmpty = computed(() => !isUnresolved.value && !hasExperiment.value)\nconst hasSave = computed(() => props.showSave && !isUnresolved.value && hasExperiment.value)\n\nconst triggerLabel = computed(() => {\n  if (props.isResolving) return 'Loading experiment'\n  if (props.error) return 'Experiment unavailable'\n  return [props.experimentCode, props.experimentName].filter(Boolean).join(' · ') || props.placeholder\n})\n\nconst emit = defineEmits<{\n  select: []\n  save: []\n  detach: []\n}>()\n\nconst { isOpen, close, toggle } = useDropdownState({\n  rootRef: useTemplateRef<HTMLElement>('popover'),\n  triggerRef: useTemplateRef<HTMLElement>('trigger'),\n  closeOnEscape: false,\n})\n// The parent owns the success timer; the indicator lasts as long as its message.\nconst showSuccess = computed(() => !!props.saveSuccessMessage)\nconst showConfirm = ref(false)\n\n// The panel hangs from the group's left edge; when that would cross the\n// viewport's right edge (a control at the end of the top bar) it hangs from the right.\nconst panel = useTemplateRef<HTMLElement>('panel')\nconst panelAlignEnd = ref(false)\nwatch(isOpen, async (open) => {\n  if (!open) return\n  panelAlignEnd.value = false\n  await nextTick()\n  const right = panel.value?.getBoundingClientRect().right ?? 0\n  panelAlignEnd.value = right > document.documentElement.clientWidth\n})\n\nconst saveTitle = computed(() => {\n  if (props.saveDisabled && props.saveDisabledMessage) return props.saveDisabledMessage\n  if (props.saveSuccessMessage) return props.saveSuccessMessage\n  return `${props.saveLabel} to experiment`\n})\n\n// A function, not a computed: \"Updated\" is relative to now, so it is\n// re-evaluated each time the panel renders.\nfunction metaRows(): [string, string][] {\n  return ([\n    ['Project', props.experimentProject],\n    ['Status', props.experimentStatus && formatStatus(props.experimentStatus)],\n    ['Owner', props.experimentOwner],\n    ['Updated', props.experimentUpdatedAt && formatRelativeTime(props.experimentUpdatedAt)],\n  ] as [string, string | undefined][]).filter((row): row is [string, string] => !!row[1])\n}\n\nfunction handleTriggerClick() {\n  if (isEmpty.value) {\n    emit('select')\n    return\n  }\n  toggle()\n}\n\nfunction handleSelect() {\n  emit('select')\n  close()\n}\n\nfunction handleSave() {\n  if (props.saveDisabled || props.saveLoading) return\n  close()\n  if (props.confirmSave) {\n    showConfirm.value = true\n  } else {\n    emit('save')\n  }\n}\n\nfunction handleConfirmSave() {\n  showConfirm.value = false\n  if (props.saveDisabled || props.saveLoading) return\n  emit('save')\n}\n\nfunction handleDetach() {\n  emit('detach')\n  close()\n}\n</script>\n\n<template>\n  <div ref=\"popover\" :class=\"['mint-experiment-popover', { 'mint-experiment-popover--save': hasSave }]\">\n    <!-- Trigger: code + name when attached, opens the panel; the empty state selects directly. -->\n    <button\n      ref=\"trigger\"\n      type=\"button\"\n      :class=\"[\n        'mint-experiment-popover__trigger',\n        { 'mint-experiment-popover__trigger--active': isOpen },\n        { 'mint-experiment-popover__trigger--empty': isEmpty },\n        { 'mint-experiment-popover__trigger--loading': isResolving },\n        { 'mint-experiment-popover__trigger--error': !isResolving && !!error },\n      ]\"\n      :title=\"triggerLabel\"\n      :aria-label=\"isUnresolved ? triggerLabel : undefined\"\n      :aria-busy=\"isResolving || undefined\"\n      :aria-expanded=\"isEmpty ? undefined : isOpen\"\n      @click.stop=\"handleTriggerClick\"\n    >\n      <!-- Resolving and error come first: with an experiment bound but no name\n           yet, the empty placeholder would be a lie. -->\n      <span v-if=\"isResolving\" class=\"mint-experiment-popover__trigger-skeleton\" aria-hidden=\"true\" />\n      <template v-else-if=\"error\">\n        <CircleAlert class=\"mint-experiment-popover__trigger-icon\" :size=\"14\" aria-hidden=\"true\" />\n        <span class=\"mint-experiment-popover__trigger-text\">Experiment unavailable</span>\n      </template>\n      <template v-else-if=\"hasExperiment\">\n        <span v-if=\"experimentCode\" class=\"mint-exp-code mint-exp-code--sm\">{{ experimentCode }}</span>\n        <span\n          v-if=\"experimentName\"\n          class=\"mint-experiment-popover__trigger-text\"\n          :style=\"{ maxWidth: `${maxNameWidth}px` }\"\n        >{{ experimentName }}</span>\n      </template>\n      <template v-else>\n        <Link class=\"mint-experiment-popover__trigger-icon\" :size=\"14\" aria-hidden=\"true\" />\n        <span class=\"mint-experiment-popover__trigger-text\">{{ placeholder }}</span>\n      </template>\n      <ChevronDown v-if=\"!isEmpty\" class=\"mint-experiment-popover__trigger-chevron\" :size=\"13\" aria-hidden=\"true\" />\n    </button>\n\n    <!-- Save: joined to the trigger at top-bar level, never inside the panel. -->\n    <button\n      v-if=\"hasSave\"\n      type=\"button\"\n      :class=\"[\n        'mint-experiment-popover__save',\n        { 'mint-experiment-popover__save--loading': saveLoading },\n        { 'mint-experiment-popover__save--success': showSuccess },\n        { 'mint-experiment-popover__save--disabled': saveDisabled && !showSuccess },\n      ]\"\n      :disabled=\"saveLoading || (saveDisabled && !showSuccess)\"\n      :title=\"saveTitle\"\n      :aria-label=\"dirty ? `${saveTitle} (unsaved changes)` : saveTitle\"\n      @click.stop=\"handleSave\"\n    >\n      <LoaderCircle v-if=\"saveLoading\" class=\"mint-experiment-popover__save-spinner\" :size=\"14\" aria-hidden=\"true\" />\n      <Check v-else-if=\"showSuccess\" :size=\"14\" aria-hidden=\"true\" />\n      <CloudUpload v-else :size=\"14\" aria-hidden=\"true\" />\n      <span>{{ saveLoading ? 'Saving…' : saveLabel }}</span>\n      <span v-if=\"dirty && !saveLoading\" class=\"mint-experiment-popover__dirty\" aria-hidden=\"true\" />\n    </button>\n\n    <!-- Summary panel: header, meta, then menu rows. No buttons inside. -->\n    <div\n      v-if=\"isOpen\"\n      ref=\"panel\"\n      :class=\"['mint-experiment-popover__panel', { 'mint-experiment-popover__panel--end': panelAlignEnd }]\"\n    >\n      <!-- Bound, still resolving — placeholders stand in for the record. -->\n      <div v-if=\"isResolving\" class=\"mint-experiment-popover__head\" aria-busy=\"true\">\n        <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--code\" />\n        <span class=\"mint-experiment-popover__skeleton-line mint-experiment-popover__skeleton-line--name\" />\n      </div>\n\n      <!-- Bound, resolution failed — Detach stays reachable below. -->\n      <div v-else-if=\"error\" class=\"mint-experiment-popover__head mint-experiment-popover__head--error\" role=\"alert\">\n        <b class=\"mint-experiment-popover__name\">\n          <CircleAlert :size=\"14\" aria-hidden=\"true\" />\n          Experiment unavailable\n        </b>\n        <span class=\"mint-experiment-popover__message\">{{ error }}</span>\n      </div>\n\n      <template v-else>\n        <div class=\"mint-experiment-popover__head\">\n          <span v-if=\"experimentCode\" class=\"mint-exp-code mint-exp-code--sm\">{{ experimentCode }}</span>\n          <b v-if=\"experimentName\" class=\"mint-experiment-popover__name\">{{ experimentName }}</b>\n        </div>\n        <dl v-if=\"metaRows().length\" class=\"mint-experiment-popover__meta\">\n          <template v-for=\"[label, value] in metaRows()\" :key=\"label\">\n            <dt>{{ label }}</dt>\n            <dd>{{ value }}</dd>\n          </template>\n        </dl>\n      </template>\n\n      <div class=\"mint-experiment-popover__separator\" role=\"separator\" />\n\n      <button type=\"button\" class=\"mint-experiment-popover__option\" @click=\"handleSelect\">\n        <ArrowLeftRight class=\"mint-experiment-popover__option-icon\" :size=\"14\" aria-hidden=\"true\" />\n        Change experiment…\n      </button>\n      <a\n        v-if=\"experimentId != null\"\n        class=\"mint-experiment-popover__option\"\n        :href=\"`/experiments/${experimentId}`\"\n        target=\"_blank\"\n        rel=\"noopener\"\n        @click=\"close()\"\n      >\n        <ExternalLink class=\"mint-experiment-popover__option-icon\" :size=\"14\" aria-hidden=\"true\" />\n        Open in MINT\n      </a>\n      <button\n        v-if=\"showDetach\"\n        type=\"button\"\n        class=\"mint-experiment-popover__option mint-experiment-popover__option--danger\"\n        @click=\"handleDetach\"\n      >\n        <Unlink class=\"mint-experiment-popover__option-icon\" :size=\"14\" aria-hidden=\"true\" />\n        Detach\n      </button>\n    </div>\n\n    <!-- Save confirmation dialog -->\n    <ConfirmDialog\n      v-model:open=\"showConfirm\"\n      :title=\"confirmTitle ?? 'Save to Experiment'\"\n      :message=\"confirmMessage ?? `Save current data to ${experimentName ?? experimentCode}?`\"\n      tone=\"info\"\n      :confirm-label=\"saveLabel\"\n      :loading=\"saveLoading\"\n      @confirm=\"handleConfirmSave\"\n    />\n  </div>\n</template>\n"],"mappings":"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"}

package/dist/{SettingsModal-BIC0dAYc.js → SettingsModal-B1ltysmg.js}

@@ -3,7 +3,7 @@ import { s as colorPalettes, u as useSettingsStore } from "./experiment-DyO54FQB
 import { K as BaseInput_default } from "./records-BAymyHAn.js";
 import { M as usePlatform } from "./useListReorder-W1bzK_bo.js";
 import { t as SegmentedControl_default } from "./SegmentedControl-C-sckoJZ.js";
-import { P as controlsToSettingsSchema, a as pickExistingRecordKeys, b as normalizeItemInput, c as valuesEqual, i as formSchemaFieldNames, l as useFormBuilder, o as pickRecordKeys, r as FormFieldRendererInternal_default, s as recordValuesEqualForKeys } from "./AppSidebar-FxlF5_dI.js";
+import { P as controlsToSettingsSchema, a as pickExistingRecordKeys, b as normalizeItemInput, c as valuesEqual, i as formSchemaFieldNames, l as useFormBuilder, o as pickRecordKeys, r as FormFieldRendererInternal_default, s as recordValuesEqualForKeys } from "./AppSidebar-C4qQLHcH.js";
 import { r as useAuthStore } from "./auth-SliLnFre.js";
 import { canAccessByPolicy } from "./permissions.js";
 import { n as isControlModelBinding } from "./controlSchemaModel-C_XqpkgE.js";
@@ -664,4 +664,4 @@ var SettingsModal_default = SettingsModal_vue_vue_type_script_setup_true_lang_de
 //#endregion
 export { SettingsModal_exports as n, SettingsModal_default as t };
 
-//# sourceMappingURL=SettingsModal-BIC0dAYc.js.map
+//# sourceMappingURL=SettingsModal-B1ltysmg.js.map

package/dist/{SettingsModal-BIC0dAYc.js.map → SettingsModal-B1ltysmg.js.map}

@@ -1 +1 @@
-{"version":3,"file":"SettingsModal-BIC0dAYc.js","names":[],"sources":["../src/components/internal/SettingsPaneHeadInternal.vue","../src/components/internal/SettingsPaneHeadInternal.vue","../src/components/SettingsModal.schema.ts","../src/components/SettingsModal.vue","../src/components/SettingsModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** SettingsModal pane header: title + description or mono count, and an optional \"Restore group defaults\" action. */\ninterface Props {\n  title: string\n  description?: string\n  /** Mono count after the title (search results). */\n  count?: string\n  /** Modified fields in the group. Omit to hide the restore action; 0 renders it disabled. */\n  modifiedCount?: number\n}\n\ndefineProps<Props>()\n\nconst emit = defineEmits<{\n  restore: []\n}>()\n</script>\n\n<template>\n  <div class=\"mint-settings-modal__head\">\n    <div class=\"mint-settings-modal__head-text\">\n      <h4 class=\"mint-settings-modal__head-title\">\n        {{ title }}\n        <span v-if=\"count\" class=\"mint-settings-modal__head-count\">{{ count }}</span>\n      </h4>\n      <p v-if=\"description\" class=\"mint-settings-modal__head-description\">{{ description }}</p>\n    </div>\n    <button\n      v-if=\"modifiedCount !== undefined\"\n      type=\"button\"\n      class=\"mint-settings-modal__restore-group\"\n      :disabled=\"modifiedCount === 0\"\n      @click=\"emit('restore')\"\n    >\n      <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n        <path d=\"M3 8a5 5 0 1 0 1.5-3.5M3 3v2.5h2.5\" />\n      </svg>\n      Restore group defaults\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\n/** SettingsModal pane header: title + description or mono count, and an optional \"Restore group defaults\" action. */\ninterface Props {\n  title: string\n  description?: string\n  /** Mono count after the title (search results). */\n  count?: string\n  /** Modified fields in the group. Omit to hide the restore action; 0 renders it disabled. */\n  modifiedCount?: number\n}\n\ndefineProps<Props>()\n\nconst emit = defineEmits<{\n  restore: []\n}>()\n</script>\n\n<template>\n  <div class=\"mint-settings-modal__head\">\n    <div class=\"mint-settings-modal__head-text\">\n      <h4 class=\"mint-settings-modal__head-title\">\n        {{ title }}\n        <span v-if=\"count\" class=\"mint-settings-modal__head-count\">{{ count }}</span>\n      </h4>\n      <p v-if=\"description\" class=\"mint-settings-modal__head-description\">{{ description }}</p>\n    </div>\n    <button\n      v-if=\"modifiedCount !== undefined\"\n      type=\"button\"\n      class=\"mint-settings-modal__restore-group\"\n      :disabled=\"modifiedCount === 0\"\n      @click=\"emit('restore')\"\n    >\n      <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n        <path d=\"M3 8a5 5 0 1 0 1.5-3.5M3 3v2.5h2.5\" />\n      </svg>\n      Restore group defaults\n    </button>\n  </div>\n</template>\n","import type {\n  FormSchema,\n  FormSectionSchema,\n  SettingsGroup,\n  SettingsModalSchema,\n  SettingsTab,\n  SettingsTabInput,\n} from '../types'\nimport type { AccessControlled } from '../permissions'\nimport { normalizeItemInput } from '../utils/items'\n\nexport const APPEARANCE_TAB_ID = 'appearance'\n\nexport const APPEARANCE_TAB: SettingsTab = {\n  id: APPEARANCE_TAB_ID,\n  label: 'Appearance',\n  // Heroicons \"swatch\" — the built-in tab sits beside plugin tabs that all\n  // carry icons, so it needs one of its own to keep the rail consistent.\n  icon: '<svg fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4.098 19.902a3.75 3.75 0 0 0 5.304 0l6.401-6.402M6.75 21A3.75 3.75 0 0 1 3 17.25V4.125C3 3.504 3.504 3 4.125 3h5.25c.621 0 1.125.504 1.125 1.125v4.072M6.75 21a3.75 3.75 0 0 0 3.75-3.75V8.197M6.75 21h13.125c.621 0 1.125-.504 1.125-1.125v-5.25c0-.621-.504-1.125-1.125-1.125h-4.072M10.5 8.197l2.88-2.88c.438-.439 1.15-.439 1.59 0l3.712 3.713c.44.44.44 1.152 0 1.59l-2.879 2.88M6.75 17.25h.008v.008H6.75v-.008Z\"></path></svg>',\n  description: 'Theme, color palette, and density',\n}\n\n// Map settings groups onto the form-builder's flat-section shape.\n// `title: ''` because the rail/pane header already shows the group name.\nexport function buildFlatSettingsSchema(schema: SettingsModalSchema): FormSchema {\n  return {\n    sections: schema.groups.map<FormSectionSchema>((group) => ({\n      id: group.id,\n      title: '',\n      fields: group.fields,\n      columns: group.columns,\n      condition: group.condition,\n    })),\n  }\n}\n\nexport function filterSettingsSchemaByAccess(\n  schema: SettingsModalSchema,\n  canShow: (item: AccessControlled) => boolean\n): SettingsModalSchema {\n  const groups = schema.groups.flatMap((group) => {\n    if (!canShow(group)) return []\n\n    const fields = group.fields.filter(canShow)\n    if (fields.length === 0) return []\n\n    return [{ ...group, fields }]\n  })\n\n  return { groups }\n}\n\nexport function settingsGroupToTab(group: SettingsGroup): SettingsTab {\n  return {\n    id: group.id,\n    label: group.label,\n    icon: group.icon,\n    description: group.description,\n  }\n}\n\nexport function normalizeVisibleSettingsTabs(\n  tabs: SettingsTabInput[],\n  canShow: (item: AccessControlled) => boolean\n): SettingsTab[] {\n  return tabs.map(normalizeItemInput).filter(canShow)\n}\n\nexport function buildSettingsTabs(\n  baseTabs: SettingsTab[],\n  showAppearance: boolean,\n  appearanceFirst = false\n): SettingsTab[] {\n  if (!showAppearance) return baseTabs\n  return appearanceFirst ? [APPEARANCE_TAB, ...baseTabs] : [...baseTabs, APPEARANCE_TAB]\n}\n","<script setup lang=\"ts\">\n/**\n * Tabbed settings modal with three usage modes:\n *\n *   1. Schema-driven (recommended) — pass a `defineControlModel()` result or a\n *      `SettingsModalSchema` as `spec`, plus `v-model:values`. Each\n *      group/section becomes a tab; fields auto-render via the SDK form field\n *      registry (text, select, number, toggle, molecule, concentration, …).\n *      Conditional visibility, validation, and dynamic options come for free.\n *\n *   2. Manual tabs + slots — pass `tabs` and a `<template #tab-{id}>` slot\n *      per tab. Use this when you need bespoke widgets the form-builder\n *      registry doesn't cover (or for legacy plugins).\n *\n *   3. Appearance only — `showAppearance` (default true) renders the built-in\n *      theme / palette / table-density tab. Works alongside both modes above.\n *\n * Layout: omitted (default) renders a sidebar rail split into \"Plugin\" and\n * \"Personal\" (Appearance) sections when there are more than three groups, and\n * stacks every group on one page otherwise. `vertical` always uses the rail;\n * `horizontal` keeps the underline tab strip.\n *\n * Schema-driven settings also get a search across groups (label + hint), a\n * modified-from-default marker with a per-row reset for every field with a\n * non-null `defaultValue` (every control model field gets one), and a \"Restore group defaults\" action. Changes\n * apply immediately; the default footer says so and closes with \"Done\".\n *\n * @example Recommended\n * ```vue\n * <SettingsModal v-model:open=\"open\" v-model:values=\"values\" :spec=\"settingsModel\" />\n * ```\n */\nimport { ref, computed, watch } from 'vue'\nimport BaseModal from './BaseModal.vue'\nimport BaseButton from './BaseButton.vue'\nimport BaseInput from './BaseInput.vue'\nimport SegmentedControl from './SegmentedControl.vue'\nimport FormFieldRendererInternal from './internal/FormFieldRendererInternal.vue'\nimport SettingsPaneHeadInternal from './internal/SettingsPaneHeadInternal.vue'\nimport { useFormBuilder } from '../composables/useFormBuilder'\nimport {\n  controlsToSettingsSchema,\n  isControlModelBinding,\n  type ControlModelBinding,\n} from '../composables/useControlSchema'\nimport { useSettingsStore, colorPalettes } from '../stores/settings'\nimport { useAuthStore } from '../stores/auth'\nimport { usePlatform } from '../composables/usePlatform'\nimport { canAccessByPolicy } from '../permissions'\nimport {\n  formSchemaFieldNames,\n  pickExistingRecordKeys,\n  pickRecordKeys,\n  recordValuesEqualForKeys,\n  valuesEqual,\n} from '../utils/formModelSync'\nimport type {\n  ThemeMode,\n  ColorPalette,\n  TableDensity,\n  ModalLayout,\n  ModalTab,\n  SettingsGroup,\n  SettingsTab,\n  SettingsTabInput,\n  SettingsModalLayout,\n  SettingsModalSchema,\n  SettingsUserType,\n  FormFieldSchema,\n} from '../types'\nimport type { AccessControlled, PermissionUser } from '../permissions'\nimport {\n  APPEARANCE_TAB,\n  APPEARANCE_TAB_ID,\n  buildFlatSettingsSchema,\n  buildSettingsTabs,\n  filterSettingsSchemaByAccess,\n  normalizeVisibleSettingsTabs,\n  settingsGroupToTab,\n} from './SettingsModal.schema'\n\ninterface Props {\n  open: boolean\n  title?: string\n  /** Manual tab descriptors. Ignored when `spec` is set (groups become tabs). */\n  tabs?: SettingsTabInput[]\n  showAppearance?: boolean\n  /** List Appearance before the other tabs and open on it. */\n  appearanceFirst?: boolean\n  size?: 'md' | 'lg' | 'xl'\n  layout?: SettingsModalLayout\n  /** Control model built with defineControlModel(), or a SettingsModalSchema (e.g. the generated `settingsForm`). Fields auto-render via SDK form components. */\n  spec?: ControlModelBinding | SettingsModalSchema\n  /** Two-way bound values when `spec` is set. */\n  values?: Record<string, unknown>\n  /** Optional user type override for permission-filtered settings content. Defaults to SDK auth/platform context. */\n  userType?: SettingsUserType\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Settings',\n  tabs: () => [],\n  showAppearance: true,\n  size: 'lg',\n  layout: undefined,\n  spec: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean]\n  'update:values': [data: Record<string, unknown>]\n  close: []\n}>()\n\nconst settings = useSettingsStore()\nconst auth = useAuthStore()\nconst { user: platformUser, integrated, isAdmin: platformIsAdmin } = usePlatform()\n// With sign-in turned off (`authRequired: false`) every caller of an integrated page is the\n// implicit administrator, and usePlatform reports a page with no user as admin.\nconst implicitPlatformAdmin = computed(() => integrated.value && !platformUser.value && platformIsAdmin.value)\n\nconst resolvedModel = computed<ControlModelBinding | undefined>(() =>\n  isControlModelBinding(props.spec) ? props.spec : undefined,\n)\nconst sourceSettingsSchema = computed<SettingsModalSchema | undefined>(() =>\n  resolvedModel.value\n    ? controlsToSettingsSchema(resolvedModel.value.controls, resolvedModel.value.controlOptions)\n    : props.spec as SettingsModalSchema | undefined,\n)\nconst currentAccessUser = computed<PermissionUser | null>(() => {\n  if (props.userType) {\n    return { role: props.userType === 'admin' ? 'admin' : 'user' }\n  }\n  return auth.userInfo ?? platformUser.value ?? (implicitPlatformAdmin.value ? { role: 'admin' } : null)\n})\nconst isAccessUserAuthenticated = computed(() =>\n  props.userType !== undefined || auth.isAuthenticated || !!platformUser.value || implicitPlatformAdmin.value,\n)\nconst settingsSchema = computed<SettingsModalSchema | undefined>(() => {\n  if (!sourceSettingsSchema.value) return undefined\n  return filterSettingsSchemaByAccess(sourceSettingsSchema.value, canShowForCurrentUser)\n})\nconst isSchemaDriven = computed(() => !!settingsSchema.value)\nconst resolvedValues = computed<Record<string, unknown>>(() => ({\n  ...(resolvedModel.value?.controlOptions.initialValues ?? {}),\n  ...(props.values ?? {}),\n}))\n\n// Schema-driven mode keeps one form-builder instance and syncs schema changes\n// into it, so callers can swap groups/fields without remounting the modal.\nconst builder = useFormBuilder(\n  settingsSchema.value ? buildFlatSettingsSchema(settingsSchema.value) : { sections: [] },\n  resolvedValues.value,\n  resolvedModel.value?.controlOptions.enhancements,\n)\n\nwatch(\n  () => settingsSchema.value,\n  (schema) => {\n    if (!schema) {\n      builder.updateSchema({ sections: [] }, {})\n      return\n    }\n\n    const flatSchema = buildFlatSettingsSchema(schema)\n    const fieldNames = formSchemaFieldNames(flatSchema)\n    const sourceValues = props.values === undefined\n      ? {\n          ...resolvedValues.value,\n          ...(builder.form.data as Record<string, unknown>),\n        }\n      : resolvedValues.value\n\n    builder.updateSchema(flatSchema, pickExistingRecordKeys(sourceValues ?? {}, fieldNames))\n  },\n  { deep: true },\n)\n\nwatch(\n  () => ({ ...resolvedValues.value }),\n  (data) => {\n    if (!settingsSchema.value) return\n    const fieldNames = builderFieldNames()\n    if (recordValuesEqualForKeys(data, builder.form.data as Record<string, unknown>, fieldNames)) return\n    builder.reset(pickRecordKeys(data, fieldNames))\n  },\n  { deep: true },\n)\n\n// Changes apply immediately; the footer confirms it once the user changed something.\nconst applied = ref(false)\n\nwatch(\n  () => ({ ...builder.form.data }),\n  (data) => {\n    // A reset to the parent's values (async load, schema swap) is not a user change.\n    if (!recordValuesEqualForKeys(data, resolvedValues.value, builderFieldNames())) applied.value = true\n    if (settingsSchema.value) {\n      emit('update:values', {\n        ...resolvedValues.value,\n        ...data,\n      })\n    }\n  },\n  { deep: true },\n)\n\n// Schema groups whose `condition` evaluates false against the current data are\n// dropped from the rail entirely — same semantics as section visibility in\n// FormBuilder. Manual `tabs` have no condition mechanism, so they pass through.\nconst visibleSchemaGroups = computed(() =>\n  settingsSchema.value\n    ? settingsSchema.value.groups.filter((g) => builder.isSectionVisible(g.id))\n    : [],\n)\n\nconst manualTabs = computed<SettingsTab[]>(() =>\n  normalizeVisibleSettingsTabs(props.tabs, canShowForCurrentUser)\n)\n\nconst allTabs = computed<SettingsTab[]>(() => {\n  const base: SettingsTab[] = settingsSchema.value\n    ? visibleSchemaGroups.value.map(settingsGroupToTab)\n    : manualTabs.value\n  return buildSettingsTabs(base, props.showAppearance, props.appearanceFirst)\n})\n\nconst activeTab = ref(allTabs.value[0]?.id || APPEARANCE_TAB_ID)\n\n/** Above this many plugin groups the default layout switches from one stacked page to the rail. */\nconst STACKED_GROUP_LIMIT = 3\n\n// BaseModal owns the tab chrome: 'vertical' keeps its public name and maps to\n// the shell rail; horizontal maps to the shell strip (plain when single-tab).\nconst baseLayout = computed<ModalLayout>(() => {\n  if (props.layout === 'vertical') return 'rail'\n  if (props.layout === 'horizontal') return allTabs.value.length > 1 ? 'tabs' : 'plain'\n  const pluginTabCount = settingsSchema.value ? visibleSchemaGroups.value.length : manualTabs.value.length\n  return pluginTabCount > STACKED_GROUP_LIMIT ? 'rail' : 'plain'\n})\nconst isRail = computed(() => baseLayout.value === 'rail')\nconst isStacked = computed(() => baseLayout.value === 'plain')\n\nconst query = ref('')\nconst searchTerm = computed(() => query.value.trim().toLowerCase())\nconst isSearching = computed(() => isSchemaDriven.value && searchTerm.value !== '')\n\nconst modalTabs = computed<ModalTab[]>(() =>\n  allTabs.value.map((tab) => {\n    const group = visibleSchemaGroups.value.find((g) => g.id === tab.id)\n    const modified = group ? modifiedCount(group) : 0\n    return {\n      id: tab.id,\n      label: tab.label,\n      icon: tab.icon,\n      description: tab.description,\n      meta: group ? (modified ? String(modified) : undefined) : tab.meta,\n      // Sections only split plugin groups from Appearance; without it there is nothing to split.\n      section: props.showAppearance ? (tab.id === APPEARANCE_TAB_ID ? 'Personal' : tab.section ?? 'Plugin') : undefined,\n    }\n  }),\n)\n\nfunction selectTab(id: string) {\n  activeTab.value = id\n  query.value = ''\n}\n\nfunction handleSearchKeydown(event: KeyboardEvent) {\n  // First Escape clears the search; the next one closes the modal.\n  if (event.key === 'Escape' && query.value) {\n    event.stopPropagation()\n    query.value = ''\n  }\n}\n\n// If the active tab vanishes (group hidden by condition), drop back to the first available.\nwatch(allTabs, (tabs) => {\n  if (!tabs.some((t) => t.id === activeTab.value)) {\n    activeTab.value = tabs[0]?.id ?? APPEARANCE_TAB_ID\n  }\n})\n\nconst activeGroup = computed(() =>\n  visibleSchemaGroups.value.find((g) => g.id === activeTab.value),\n)\n\nfunction visibleFields(group: SettingsGroup): FormFieldSchema[] {\n  return group.fields.filter((f) => builder.isFieldVisible(f.name))\n}\n\n/**\n * Modified = differs from the field's own `defaultValue`. A field without one, or with a `null`\n * default (a secret, or an optional setting), never is: restoring `null` would clear a stored value.\n */\nfunction isModified(field: FormFieldSchema): boolean {\n  return field.defaultValue != null\n    && !valuesEqual((builder.form.data as Record<string, unknown>)[field.name], field.defaultValue)\n}\n\nfunction modifiedCount(group: SettingsGroup): number {\n  return visibleFields(group).filter(isModified).length\n}\n\nfunction resetField(field: FormFieldSchema) {\n  builder.form.setFieldValue(field.name, field.defaultValue)\n}\n\nfunction restoreGroup(group: SettingsGroup | undefined) {\n  if (group) visibleFields(group).filter(isModified).forEach(resetField)\n}\n\nfunction isBooleanField(field: FormFieldSchema): boolean {\n  return field.type === 'checkbox' || field.type === 'toggle'\n}\n\n/** Booleans are always toggles inside settings rows; their hint is printed under the row, not in a tooltip. */\nfunction settingsField(field: FormFieldSchema): FormFieldSchema {\n  return isBooleanField(field) ? { ...field, type: 'toggle', hint: undefined } : field\n}\n\ninterface SettingsRow {\n  field: FormFieldSchema\n  group: SettingsGroup\n}\n\nconst searchResults = computed<SettingsRow[]>(() => {\n  if (!isSearching.value) return []\n  return visibleSchemaGroups.value.flatMap((group) =>\n    visibleFields(group)\n      .filter((field) => [field.label, field.hint, group.label].join(' ').toLowerCase().includes(searchTerm.value))\n      .map((field) => ({ field, group })),\n  )\n})\n\nconst resultCount = computed(() =>\n  `${searchResults.value.length} result${searchResults.value.length === 1 ? '' : 's'}`,\n)\n\n/** What the pane renders: one list of search hits, every group (stacked) or the active group. */\nconst paneSections = computed<{ key: string; group?: SettingsGroup; rows: SettingsRow[] }[]>(() => {\n  if (isSearching.value) {\n    return searchResults.value.length ? [{ key: 'search', rows: searchResults.value }] : []\n  }\n  const groups = isStacked.value\n    ? visibleSchemaGroups.value\n    : activeGroup.value ? [activeGroup.value] : []\n  return groups.map((group) => ({\n    key: group.id,\n    group,\n    rows: visibleFields(group).map((field) => ({ field, group })),\n  }))\n})\n\nconst themeOptions: { value: ThemeMode; label: string; halves: ('light' | 'dark')[] }[] = [\n  { value: 'light', label: 'Light', halves: ['light'] },\n  { value: 'dark', label: 'Dark', halves: ['dark'] },\n  { value: 'system', label: 'System', halves: ['light', 'dark'] },\n]\n\n/** Accent tokens a palette swatch shows; `data-palette` on the strip resolves them per palette. */\nconst paletteSwatchTokens = ['--color-primary', '--color-primary-hover', '--color-primary-soft', '--color-primary-border']\n\nconst densityPreviewRows = [\n  ['S-0012', '2.41', '12.5'],\n  ['S-0013', '7.90', '3.25'],\n  ['S-0014', '10.60', '0.80'],\n]\n\nconst densityOptions: { value: TableDensity; label: string }[] = [\n  { value: 'compact', label: 'Compact' },\n  { value: 'normal', label: 'Normal' },\n  { value: 'comfortable', label: 'Comfortable' },\n]\n\nwatch(\n  () => [settings.theme, settings.colorPalette, settings.tableDensity],\n  () => { applied.value = true },\n)\n\nfunction handleClose() {\n  emit('update:open', false)\n  emit('close')\n}\n\nfunction builderFieldNames(): string[] {\n  return builder.fields.map(field => field.name)\n}\n\nfunction canShowForCurrentUser(item: AccessControlled): boolean {\n  return canAccessByPolicy(\n    currentAccessUser.value,\n    item.access,\n    isAccessUserAuthenticated.value,\n  )\n}\n</script>\n\n<template>\n  <BaseModal\n    :open=\"open\"\n    :title=\"title\"\n    :size=\"size\"\n    :layout=\"baseLayout\"\n    :tabs=\"modalTabs\"\n    :active-tab=\"isSearching ? '' : activeTab\"\n    @update:active-tab=\"selectTab\"\n    @update:open=\"emit('update:open', $event)\"\n    @close=\"handleClose\"\n  >\n    <template #header>\n      <div class=\"mint-settings-modal__header\">\n        <h3 class=\"mint-modal__title\">{{ title }}</h3>\n        <div v-if=\"isSchemaDriven\" class=\"mint-settings-modal__search\">\n          <svg class=\"mint-settings-modal__search-icon\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" aria-hidden=\"true\">\n            <circle cx=\"7\" cy=\"7\" r=\"4.5\" /><path d=\"M10.5 10.5L14 14\" />\n          </svg>\n          <BaseInput\n            :model-value=\"query\"\n            type=\"search\"\n            size=\"sm\"\n            placeholder=\"Search settings\"\n            aria-label=\"Search settings\"\n            @update:model-value=\"query = String($event ?? '')\"\n            @keydown=\"handleSearchKeydown\"\n          />\n        </div>\n      </div>\n    </template>\n\n    <template v-if=\"isRail && isSchemaDriven\" #pane-header=\"{ tab }\">\n      <SettingsPaneHeadInternal v-if=\"isSearching\" title=\"Search results\" :count=\"resultCount\" />\n      <SettingsPaneHeadInternal\n        v-else\n        :title=\"tab?.label ?? ''\"\n        :description=\"tab?.description\"\n        :modified-count=\"activeGroup ? modifiedCount(activeGroup) : undefined\"\n        @restore=\"restoreGroup(activeGroup)\"\n      />\n    </template>\n\n    <!-- Body: the active pane only — tab strip / rail / footer are BaseModal's shell. -->\n    <div :class=\"['mint-settings-modal', { 'mint-settings-modal--schema': isSchemaDriven }]\">\n      <template v-if=\"isSchemaDriven\">\n        <SettingsPaneHeadInternal v-if=\"isSearching && !isRail\" title=\"Search results\" :count=\"resultCount\" />\n        <section v-for=\"section in paneSections\" :key=\"section.key\" class=\"mint-settings-modal__group\">\n          <SettingsPaneHeadInternal\n            v-if=\"section.group && !isRail\"\n            :title=\"section.group.label\"\n            :description=\"section.group.description\"\n            :modified-count=\"modifiedCount(section.group)\"\n            @restore=\"restoreGroup(section.group)\"\n          />\n          <div\n            class=\"mint-settings-modal__group-grid\"\n            :style=\"{ '--mint-settings-cols': section.group?.columns ?? 1 }\"\n          >\n            <div\n              v-for=\"row in section.rows\"\n              :key=\"row.field.name\"\n              :class=\"['mint-settings-modal__row', { 'mint-settings-modal__row--modified': isModified(row.field) }]\"\n              :style=\"row.field.colSpan ? { gridColumn: `span ${row.field.colSpan}` } : undefined\"\n            >\n              <span v-if=\"!section.group\" class=\"mint-settings-modal__row-group\">{{ row.group.label }}</span>\n              <div class=\"mint-settings-modal__row-field\">\n                <slot\n                  :name=\"`field:${row.field.name}`\"\n                  :field=\"row.field\"\n                  :form=\"builder.form\"\n                  :field-props=\"builder.form.getFieldProps(row.field.name)\"\n                >\n                  <FormFieldRendererInternal\n                    :field=\"settingsField(row.field)\"\n                    :resolved-props=\"builder.getResolvedFieldProps(settingsField(row.field))\"\n                    :form=\"builder.form\"\n                  />\n                </slot>\n                <p v-if=\"isBooleanField(row.field) && row.field.hint\" class=\"mint-settings-modal__row-hint\">\n                  {{ row.field.hint }}\n                </p>\n                <button\n                  v-if=\"isModified(row.field)\"\n                  type=\"button\"\n                  class=\"mint-settings-modal__reset\"\n                  title=\"Restore default\"\n                  :aria-label=\"`Restore default for ${row.field.label}`\"\n                  @click=\"resetField(row.field)\"\n                >\n                  <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                    <path d=\"M3 8a5 5 0 1 0 1.5-3.5M3 3v2.5h2.5\" />\n                  </svg>\n                </button>\n              </div>\n            </div>\n          </div>\n        </section>\n        <p v-if=\"isSearching && searchResults.length === 0\" class=\"mint-settings-modal__empty\">\n          No settings match \"{{ query.trim() }}\"\n        </p>\n      </template>\n\n      <template v-else>\n        <section\n          v-for=\"tab in manualTabs\"\n          v-show=\"isStacked || activeTab === tab.id\"\n          :key=\"tab.id\"\n          class=\"mint-settings-modal__group\"\n        >\n          <SettingsPaneHeadInternal v-if=\"isStacked\" :title=\"tab.label\" :description=\"tab.description\" />\n          <slot :name=\"`tab-${tab.id}`\" />\n        </section>\n      </template>\n\n      <section\n        v-if=\"showAppearance\"\n        v-show=\"!isSearching && (isStacked || activeTab === APPEARANCE_TAB_ID)\"\n        class=\"mint-settings-modal__group mint-settings-modal__appearance\"\n      >\n        <SettingsPaneHeadInternal\n          v-if=\"isStacked\"\n          :title=\"APPEARANCE_TAB.label\"\n          :description=\"APPEARANCE_TAB.description\"\n        />\n\n        <div class=\"mint-settings-modal__setting\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Theme</span>\n            <span class=\"mint-settings-modal__setting-hint\">Applies to this browser only</span>\n          </div>\n          <div class=\"mint-settings-modal__themes\">\n            <button\n              v-for=\"opt in themeOptions\"\n              :key=\"opt.value\"\n              type=\"button\"\n              :aria-pressed=\"settings.theme === opt.value\"\n              :class=\"['mint-settings-modal__theme', { 'mint-settings-modal__theme--active': settings.theme === opt.value }]\"\n              @click=\"settings.theme = opt.value\"\n            >\n              <span class=\"mint-settings-modal__theme-preview\" aria-hidden=\"true\">\n                <span\n                  v-for=\"half in opt.halves\"\n                  :key=\"half\"\n                  :class=\"['mint-settings-modal__theme-half', `mint-settings-modal__theme-half--${half}`]\"\n                >\n                  <span class=\"mint-settings-modal__theme-line\" />\n                  <span class=\"mint-settings-modal__theme-card\" />\n                </span>\n              </span>\n              <span class=\"mint-settings-modal__theme-label\">\n                <span class=\"mint-settings-modal__theme-radio\" aria-hidden=\"true\" />\n                {{ opt.label }}\n              </span>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"mint-settings-modal__setting\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Color palette</span>\n            <span class=\"mint-settings-modal__setting-hint\">Accent colour across the interface</span>\n          </div>\n          <div class=\"mint-settings-modal__palettes\">\n            <button\n              v-for=\"(palette, key) in colorPalettes\"\n              :key=\"key\"\n              type=\"button\"\n              :aria-pressed=\"settings.colorPalette === key\"\n              :class=\"['mint-settings-modal__palette', { 'mint-settings-modal__palette--active': settings.colorPalette === key }]\"\n              @click=\"settings.colorPalette = key as ColorPalette\"\n            >\n              <span class=\"mint-settings-modal__swatches\" :data-palette=\"key\" aria-hidden=\"true\">\n                <span\n                  v-for=\"token in paletteSwatchTokens\"\n                  :key=\"token\"\n                  class=\"mint-settings-modal__swatch\"\n                  :style=\"{ backgroundColor: `var(${token})` }\"\n                />\n              </span>\n              <span class=\"mint-settings-modal__palette-name\">{{ palette.name }}</span>\n              <svg class=\"mint-settings-modal__palette-check\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                <path d=\"M3.5 8.5l3 3 6-7\" />\n              </svg>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"mint-settings-modal__setting mint-settings-modal__setting--inline\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Density</span>\n            <span class=\"mint-settings-modal__setting-hint\">Adjusts control and table row height</span>\n          </div>\n          <SegmentedControl\n            :model-value=\"settings.tableDensity\"\n            :options=\"densityOptions\"\n            size=\"sm\"\n            @update:model-value=\"settings.tableDensity = $event as TableDensity\"\n          />\n          <div\n            :class=\"['mint-settings-modal__density-preview', `mint-settings-modal__density-preview--${settings.tableDensity}`]\"\n            aria-hidden=\"true\"\n          >\n            <div class=\"mint-settings-modal__density-row mint-settings-modal__density-row--head\">\n              <span>Sample</span><span>RT</span><span>IC50</span>\n            </div>\n            <div v-for=\"cells in densityPreviewRows\" :key=\"cells[0]\" class=\"mint-settings-modal__density-row\">\n              <span>{{ cells[0] }}</span><span>{{ cells[1] }}</span><span>{{ cells[2] }}</span>\n            </div>\n          </div>\n        </div>\n\n        <slot name=\"appearance\" />\n      </section>\n    </div>\n\n    <template #footer>\n      <slot\n        name=\"footer\"\n        :values=\"builder.form.data\"\n        :close=\"handleClose\"\n      >\n        <span class=\"mint-settings-modal__status\" role=\"status\">\n          <svg v-if=\"applied\" class=\"mint-settings-modal__status-icon\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n            <path d=\"M3.5 8.5l3 3 6-7\" />\n          </svg>\n          {{ applied ? 'Applied · changes take effect immediately' : 'Changes take effect immediately' }}\n        </span>\n        <BaseButton class=\"mint-settings-modal__done\" variant=\"primary\" @click=\"handleClose\">Done</BaseButton>\n      </slot>\n    </template>\n  </BaseModal>\n</template>\n","<script setup lang=\"ts\">\n/**\n * Tabbed settings modal with three usage modes:\n *\n *   1. Schema-driven (recommended) — pass a `defineControlModel()` result or a\n *      `SettingsModalSchema` as `spec`, plus `v-model:values`. Each\n *      group/section becomes a tab; fields auto-render via the SDK form field\n *      registry (text, select, number, toggle, molecule, concentration, …).\n *      Conditional visibility, validation, and dynamic options come for free.\n *\n *   2. Manual tabs + slots — pass `tabs` and a `<template #tab-{id}>` slot\n *      per tab. Use this when you need bespoke widgets the form-builder\n *      registry doesn't cover (or for legacy plugins).\n *\n *   3. Appearance only — `showAppearance` (default true) renders the built-in\n *      theme / palette / table-density tab. Works alongside both modes above.\n *\n * Layout: omitted (default) renders a sidebar rail split into \"Plugin\" and\n * \"Personal\" (Appearance) sections when there are more than three groups, and\n * stacks every group on one page otherwise. `vertical` always uses the rail;\n * `horizontal` keeps the underline tab strip.\n *\n * Schema-driven settings also get a search across groups (label + hint), a\n * modified-from-default marker with a per-row reset for every field with a\n * non-null `defaultValue` (every control model field gets one), and a \"Restore group defaults\" action. Changes\n * apply immediately; the default footer says so and closes with \"Done\".\n *\n * @example Recommended\n * ```vue\n * <SettingsModal v-model:open=\"open\" v-model:values=\"values\" :spec=\"settingsModel\" />\n * ```\n */\nimport { ref, computed, watch } from 'vue'\nimport BaseModal from './BaseModal.vue'\nimport BaseButton from './BaseButton.vue'\nimport BaseInput from './BaseInput.vue'\nimport SegmentedControl from './SegmentedControl.vue'\nimport FormFieldRendererInternal from './internal/FormFieldRendererInternal.vue'\nimport SettingsPaneHeadInternal from './internal/SettingsPaneHeadInternal.vue'\nimport { useFormBuilder } from '../composables/useFormBuilder'\nimport {\n  controlsToSettingsSchema,\n  isControlModelBinding,\n  type ControlModelBinding,\n} from '../composables/useControlSchema'\nimport { useSettingsStore, colorPalettes } from '../stores/settings'\nimport { useAuthStore } from '../stores/auth'\nimport { usePlatform } from '../composables/usePlatform'\nimport { canAccessByPolicy } from '../permissions'\nimport {\n  formSchemaFieldNames,\n  pickExistingRecordKeys,\n  pickRecordKeys,\n  recordValuesEqualForKeys,\n  valuesEqual,\n} from '../utils/formModelSync'\nimport type {\n  ThemeMode,\n  ColorPalette,\n  TableDensity,\n  ModalLayout,\n  ModalTab,\n  SettingsGroup,\n  SettingsTab,\n  SettingsTabInput,\n  SettingsModalLayout,\n  SettingsModalSchema,\n  SettingsUserType,\n  FormFieldSchema,\n} from '../types'\nimport type { AccessControlled, PermissionUser } from '../permissions'\nimport {\n  APPEARANCE_TAB,\n  APPEARANCE_TAB_ID,\n  buildFlatSettingsSchema,\n  buildSettingsTabs,\n  filterSettingsSchemaByAccess,\n  normalizeVisibleSettingsTabs,\n  settingsGroupToTab,\n} from './SettingsModal.schema'\n\ninterface Props {\n  open: boolean\n  title?: string\n  /** Manual tab descriptors. Ignored when `spec` is set (groups become tabs). */\n  tabs?: SettingsTabInput[]\n  showAppearance?: boolean\n  /** List Appearance before the other tabs and open on it. */\n  appearanceFirst?: boolean\n  size?: 'md' | 'lg' | 'xl'\n  layout?: SettingsModalLayout\n  /** Control model built with defineControlModel(), or a SettingsModalSchema (e.g. the generated `settingsForm`). Fields auto-render via SDK form components. */\n  spec?: ControlModelBinding | SettingsModalSchema\n  /** Two-way bound values when `spec` is set. */\n  values?: Record<string, unknown>\n  /** Optional user type override for permission-filtered settings content. Defaults to SDK auth/platform context. */\n  userType?: SettingsUserType\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Settings',\n  tabs: () => [],\n  showAppearance: true,\n  size: 'lg',\n  layout: undefined,\n  spec: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean]\n  'update:values': [data: Record<string, unknown>]\n  close: []\n}>()\n\nconst settings = useSettingsStore()\nconst auth = useAuthStore()\nconst { user: platformUser, integrated, isAdmin: platformIsAdmin } = usePlatform()\n// With sign-in turned off (`authRequired: false`) every caller of an integrated page is the\n// implicit administrator, and usePlatform reports a page with no user as admin.\nconst implicitPlatformAdmin = computed(() => integrated.value && !platformUser.value && platformIsAdmin.value)\n\nconst resolvedModel = computed<ControlModelBinding | undefined>(() =>\n  isControlModelBinding(props.spec) ? props.spec : undefined,\n)\nconst sourceSettingsSchema = computed<SettingsModalSchema | undefined>(() =>\n  resolvedModel.value\n    ? controlsToSettingsSchema(resolvedModel.value.controls, resolvedModel.value.controlOptions)\n    : props.spec as SettingsModalSchema | undefined,\n)\nconst currentAccessUser = computed<PermissionUser | null>(() => {\n  if (props.userType) {\n    return { role: props.userType === 'admin' ? 'admin' : 'user' }\n  }\n  return auth.userInfo ?? platformUser.value ?? (implicitPlatformAdmin.value ? { role: 'admin' } : null)\n})\nconst isAccessUserAuthenticated = computed(() =>\n  props.userType !== undefined || auth.isAuthenticated || !!platformUser.value || implicitPlatformAdmin.value,\n)\nconst settingsSchema = computed<SettingsModalSchema | undefined>(() => {\n  if (!sourceSettingsSchema.value) return undefined\n  return filterSettingsSchemaByAccess(sourceSettingsSchema.value, canShowForCurrentUser)\n})\nconst isSchemaDriven = computed(() => !!settingsSchema.value)\nconst resolvedValues = computed<Record<string, unknown>>(() => ({\n  ...(resolvedModel.value?.controlOptions.initialValues ?? {}),\n  ...(props.values ?? {}),\n}))\n\n// Schema-driven mode keeps one form-builder instance and syncs schema changes\n// into it, so callers can swap groups/fields without remounting the modal.\nconst builder = useFormBuilder(\n  settingsSchema.value ? buildFlatSettingsSchema(settingsSchema.value) : { sections: [] },\n  resolvedValues.value,\n  resolvedModel.value?.controlOptions.enhancements,\n)\n\nwatch(\n  () => settingsSchema.value,\n  (schema) => {\n    if (!schema) {\n      builder.updateSchema({ sections: [] }, {})\n      return\n    }\n\n    const flatSchema = buildFlatSettingsSchema(schema)\n    const fieldNames = formSchemaFieldNames(flatSchema)\n    const sourceValues = props.values === undefined\n      ? {\n          ...resolvedValues.value,\n          ...(builder.form.data as Record<string, unknown>),\n        }\n      : resolvedValues.value\n\n    builder.updateSchema(flatSchema, pickExistingRecordKeys(sourceValues ?? {}, fieldNames))\n  },\n  { deep: true },\n)\n\nwatch(\n  () => ({ ...resolvedValues.value }),\n  (data) => {\n    if (!settingsSchema.value) return\n    const fieldNames = builderFieldNames()\n    if (recordValuesEqualForKeys(data, builder.form.data as Record<string, unknown>, fieldNames)) return\n    builder.reset(pickRecordKeys(data, fieldNames))\n  },\n  { deep: true },\n)\n\n// Changes apply immediately; the footer confirms it once the user changed something.\nconst applied = ref(false)\n\nwatch(\n  () => ({ ...builder.form.data }),\n  (data) => {\n    // A reset to the parent's values (async load, schema swap) is not a user change.\n    if (!recordValuesEqualForKeys(data, resolvedValues.value, builderFieldNames())) applied.value = true\n    if (settingsSchema.value) {\n      emit('update:values', {\n        ...resolvedValues.value,\n        ...data,\n      })\n    }\n  },\n  { deep: true },\n)\n\n// Schema groups whose `condition` evaluates false against the current data are\n// dropped from the rail entirely — same semantics as section visibility in\n// FormBuilder. Manual `tabs` have no condition mechanism, so they pass through.\nconst visibleSchemaGroups = computed(() =>\n  settingsSchema.value\n    ? settingsSchema.value.groups.filter((g) => builder.isSectionVisible(g.id))\n    : [],\n)\n\nconst manualTabs = computed<SettingsTab[]>(() =>\n  normalizeVisibleSettingsTabs(props.tabs, canShowForCurrentUser)\n)\n\nconst allTabs = computed<SettingsTab[]>(() => {\n  const base: SettingsTab[] = settingsSchema.value\n    ? visibleSchemaGroups.value.map(settingsGroupToTab)\n    : manualTabs.value\n  return buildSettingsTabs(base, props.showAppearance, props.appearanceFirst)\n})\n\nconst activeTab = ref(allTabs.value[0]?.id || APPEARANCE_TAB_ID)\n\n/** Above this many plugin groups the default layout switches from one stacked page to the rail. */\nconst STACKED_GROUP_LIMIT = 3\n\n// BaseModal owns the tab chrome: 'vertical' keeps its public name and maps to\n// the shell rail; horizontal maps to the shell strip (plain when single-tab).\nconst baseLayout = computed<ModalLayout>(() => {\n  if (props.layout === 'vertical') return 'rail'\n  if (props.layout === 'horizontal') return allTabs.value.length > 1 ? 'tabs' : 'plain'\n  const pluginTabCount = settingsSchema.value ? visibleSchemaGroups.value.length : manualTabs.value.length\n  return pluginTabCount > STACKED_GROUP_LIMIT ? 'rail' : 'plain'\n})\nconst isRail = computed(() => baseLayout.value === 'rail')\nconst isStacked = computed(() => baseLayout.value === 'plain')\n\nconst query = ref('')\nconst searchTerm = computed(() => query.value.trim().toLowerCase())\nconst isSearching = computed(() => isSchemaDriven.value && searchTerm.value !== '')\n\nconst modalTabs = computed<ModalTab[]>(() =>\n  allTabs.value.map((tab) => {\n    const group = visibleSchemaGroups.value.find((g) => g.id === tab.id)\n    const modified = group ? modifiedCount(group) : 0\n    return {\n      id: tab.id,\n      label: tab.label,\n      icon: tab.icon,\n      description: tab.description,\n      meta: group ? (modified ? String(modified) : undefined) : tab.meta,\n      // Sections only split plugin groups from Appearance; without it there is nothing to split.\n      section: props.showAppearance ? (tab.id === APPEARANCE_TAB_ID ? 'Personal' : tab.section ?? 'Plugin') : undefined,\n    }\n  }),\n)\n\nfunction selectTab(id: string) {\n  activeTab.value = id\n  query.value = ''\n}\n\nfunction handleSearchKeydown(event: KeyboardEvent) {\n  // First Escape clears the search; the next one closes the modal.\n  if (event.key === 'Escape' && query.value) {\n    event.stopPropagation()\n    query.value = ''\n  }\n}\n\n// If the active tab vanishes (group hidden by condition), drop back to the first available.\nwatch(allTabs, (tabs) => {\n  if (!tabs.some((t) => t.id === activeTab.value)) {\n    activeTab.value = tabs[0]?.id ?? APPEARANCE_TAB_ID\n  }\n})\n\nconst activeGroup = computed(() =>\n  visibleSchemaGroups.value.find((g) => g.id === activeTab.value),\n)\n\nfunction visibleFields(group: SettingsGroup): FormFieldSchema[] {\n  return group.fields.filter((f) => builder.isFieldVisible(f.name))\n}\n\n/**\n * Modified = differs from the field's own `defaultValue`. A field without one, or with a `null`\n * default (a secret, or an optional setting), never is: restoring `null` would clear a stored value.\n */\nfunction isModified(field: FormFieldSchema): boolean {\n  return field.defaultValue != null\n    && !valuesEqual((builder.form.data as Record<string, unknown>)[field.name], field.defaultValue)\n}\n\nfunction modifiedCount(group: SettingsGroup): number {\n  return visibleFields(group).filter(isModified).length\n}\n\nfunction resetField(field: FormFieldSchema) {\n  builder.form.setFieldValue(field.name, field.defaultValue)\n}\n\nfunction restoreGroup(group: SettingsGroup | undefined) {\n  if (group) visibleFields(group).filter(isModified).forEach(resetField)\n}\n\nfunction isBooleanField(field: FormFieldSchema): boolean {\n  return field.type === 'checkbox' || field.type === 'toggle'\n}\n\n/** Booleans are always toggles inside settings rows; their hint is printed under the row, not in a tooltip. */\nfunction settingsField(field: FormFieldSchema): FormFieldSchema {\n  return isBooleanField(field) ? { ...field, type: 'toggle', hint: undefined } : field\n}\n\ninterface SettingsRow {\n  field: FormFieldSchema\n  group: SettingsGroup\n}\n\nconst searchResults = computed<SettingsRow[]>(() => {\n  if (!isSearching.value) return []\n  return visibleSchemaGroups.value.flatMap((group) =>\n    visibleFields(group)\n      .filter((field) => [field.label, field.hint, group.label].join(' ').toLowerCase().includes(searchTerm.value))\n      .map((field) => ({ field, group })),\n  )\n})\n\nconst resultCount = computed(() =>\n  `${searchResults.value.length} result${searchResults.value.length === 1 ? '' : 's'}`,\n)\n\n/** What the pane renders: one list of search hits, every group (stacked) or the active group. */\nconst paneSections = computed<{ key: string; group?: SettingsGroup; rows: SettingsRow[] }[]>(() => {\n  if (isSearching.value) {\n    return searchResults.value.length ? [{ key: 'search', rows: searchResults.value }] : []\n  }\n  const groups = isStacked.value\n    ? visibleSchemaGroups.value\n    : activeGroup.value ? [activeGroup.value] : []\n  return groups.map((group) => ({\n    key: group.id,\n    group,\n    rows: visibleFields(group).map((field) => ({ field, group })),\n  }))\n})\n\nconst themeOptions: { value: ThemeMode; label: string; halves: ('light' | 'dark')[] }[] = [\n  { value: 'light', label: 'Light', halves: ['light'] },\n  { value: 'dark', label: 'Dark', halves: ['dark'] },\n  { value: 'system', label: 'System', halves: ['light', 'dark'] },\n]\n\n/** Accent tokens a palette swatch shows; `data-palette` on the strip resolves them per palette. */\nconst paletteSwatchTokens = ['--color-primary', '--color-primary-hover', '--color-primary-soft', '--color-primary-border']\n\nconst densityPreviewRows = [\n  ['S-0012', '2.41', '12.5'],\n  ['S-0013', '7.90', '3.25'],\n  ['S-0014', '10.60', '0.80'],\n]\n\nconst densityOptions: { value: TableDensity; label: string }[] = [\n  { value: 'compact', label: 'Compact' },\n  { value: 'normal', label: 'Normal' },\n  { value: 'comfortable', label: 'Comfortable' },\n]\n\nwatch(\n  () => [settings.theme, settings.colorPalette, settings.tableDensity],\n  () => { applied.value = true },\n)\n\nfunction handleClose() {\n  emit('update:open', false)\n  emit('close')\n}\n\nfunction builderFieldNames(): string[] {\n  return builder.fields.map(field => field.name)\n}\n\nfunction canShowForCurrentUser(item: AccessControlled): boolean {\n  return canAccessByPolicy(\n    currentAccessUser.value,\n    item.access,\n    isAccessUserAuthenticated.value,\n  )\n}\n</script>\n\n<template>\n  <BaseModal\n    :open=\"open\"\n    :title=\"title\"\n    :size=\"size\"\n    :layout=\"baseLayout\"\n    :tabs=\"modalTabs\"\n    :active-tab=\"isSearching ? '' : activeTab\"\n    @update:active-tab=\"selectTab\"\n    @update:open=\"emit('update:open', $event)\"\n    @close=\"handleClose\"\n  >\n    <template #header>\n      <div class=\"mint-settings-modal__header\">\n        <h3 class=\"mint-modal__title\">{{ title }}</h3>\n        <div v-if=\"isSchemaDriven\" class=\"mint-settings-modal__search\">\n          <svg class=\"mint-settings-modal__search-icon\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" aria-hidden=\"true\">\n            <circle cx=\"7\" cy=\"7\" r=\"4.5\" /><path d=\"M10.5 10.5L14 14\" />\n          </svg>\n          <BaseInput\n            :model-value=\"query\"\n            type=\"search\"\n            size=\"sm\"\n            placeholder=\"Search settings\"\n            aria-label=\"Search settings\"\n            @update:model-value=\"query = String($event ?? '')\"\n            @keydown=\"handleSearchKeydown\"\n          />\n        </div>\n      </div>\n    </template>\n\n    <template v-if=\"isRail && isSchemaDriven\" #pane-header=\"{ tab }\">\n      <SettingsPaneHeadInternal v-if=\"isSearching\" title=\"Search results\" :count=\"resultCount\" />\n      <SettingsPaneHeadInternal\n        v-else\n        :title=\"tab?.label ?? ''\"\n        :description=\"tab?.description\"\n        :modified-count=\"activeGroup ? modifiedCount(activeGroup) : undefined\"\n        @restore=\"restoreGroup(activeGroup)\"\n      />\n    </template>\n\n    <!-- Body: the active pane only — tab strip / rail / footer are BaseModal's shell. -->\n    <div :class=\"['mint-settings-modal', { 'mint-settings-modal--schema': isSchemaDriven }]\">\n      <template v-if=\"isSchemaDriven\">\n        <SettingsPaneHeadInternal v-if=\"isSearching && !isRail\" title=\"Search results\" :count=\"resultCount\" />\n        <section v-for=\"section in paneSections\" :key=\"section.key\" class=\"mint-settings-modal__group\">\n          <SettingsPaneHeadInternal\n            v-if=\"section.group && !isRail\"\n            :title=\"section.group.label\"\n            :description=\"section.group.description\"\n            :modified-count=\"modifiedCount(section.group)\"\n            @restore=\"restoreGroup(section.group)\"\n          />\n          <div\n            class=\"mint-settings-modal__group-grid\"\n            :style=\"{ '--mint-settings-cols': section.group?.columns ?? 1 }\"\n          >\n            <div\n              v-for=\"row in section.rows\"\n              :key=\"row.field.name\"\n              :class=\"['mint-settings-modal__row', { 'mint-settings-modal__row--modified': isModified(row.field) }]\"\n              :style=\"row.field.colSpan ? { gridColumn: `span ${row.field.colSpan}` } : undefined\"\n            >\n              <span v-if=\"!section.group\" class=\"mint-settings-modal__row-group\">{{ row.group.label }}</span>\n              <div class=\"mint-settings-modal__row-field\">\n                <slot\n                  :name=\"`field:${row.field.name}`\"\n                  :field=\"row.field\"\n                  :form=\"builder.form\"\n                  :field-props=\"builder.form.getFieldProps(row.field.name)\"\n                >\n                  <FormFieldRendererInternal\n                    :field=\"settingsField(row.field)\"\n                    :resolved-props=\"builder.getResolvedFieldProps(settingsField(row.field))\"\n                    :form=\"builder.form\"\n                  />\n                </slot>\n                <p v-if=\"isBooleanField(row.field) && row.field.hint\" class=\"mint-settings-modal__row-hint\">\n                  {{ row.field.hint }}\n                </p>\n                <button\n                  v-if=\"isModified(row.field)\"\n                  type=\"button\"\n                  class=\"mint-settings-modal__reset\"\n                  title=\"Restore default\"\n                  :aria-label=\"`Restore default for ${row.field.label}`\"\n                  @click=\"resetField(row.field)\"\n                >\n                  <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                    <path d=\"M3 8a5 5 0 1 0 1.5-3.5M3 3v2.5h2.5\" />\n                  </svg>\n                </button>\n              </div>\n            </div>\n          </div>\n        </section>\n        <p v-if=\"isSearching && searchResults.length === 0\" class=\"mint-settings-modal__empty\">\n          No settings match \"{{ query.trim() }}\"\n        </p>\n      </template>\n\n      <template v-else>\n        <section\n          v-for=\"tab in manualTabs\"\n          v-show=\"isStacked || activeTab === tab.id\"\n          :key=\"tab.id\"\n          class=\"mint-settings-modal__group\"\n        >\n          <SettingsPaneHeadInternal v-if=\"isStacked\" :title=\"tab.label\" :description=\"tab.description\" />\n          <slot :name=\"`tab-${tab.id}`\" />\n        </section>\n      </template>\n\n      <section\n        v-if=\"showAppearance\"\n        v-show=\"!isSearching && (isStacked || activeTab === APPEARANCE_TAB_ID)\"\n        class=\"mint-settings-modal__group mint-settings-modal__appearance\"\n      >\n        <SettingsPaneHeadInternal\n          v-if=\"isStacked\"\n          :title=\"APPEARANCE_TAB.label\"\n          :description=\"APPEARANCE_TAB.description\"\n        />\n\n        <div class=\"mint-settings-modal__setting\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Theme</span>\n            <span class=\"mint-settings-modal__setting-hint\">Applies to this browser only</span>\n          </div>\n          <div class=\"mint-settings-modal__themes\">\n            <button\n              v-for=\"opt in themeOptions\"\n              :key=\"opt.value\"\n              type=\"button\"\n              :aria-pressed=\"settings.theme === opt.value\"\n              :class=\"['mint-settings-modal__theme', { 'mint-settings-modal__theme--active': settings.theme === opt.value }]\"\n              @click=\"settings.theme = opt.value\"\n            >\n              <span class=\"mint-settings-modal__theme-preview\" aria-hidden=\"true\">\n                <span\n                  v-for=\"half in opt.halves\"\n                  :key=\"half\"\n                  :class=\"['mint-settings-modal__theme-half', `mint-settings-modal__theme-half--${half}`]\"\n                >\n                  <span class=\"mint-settings-modal__theme-line\" />\n                  <span class=\"mint-settings-modal__theme-card\" />\n                </span>\n              </span>\n              <span class=\"mint-settings-modal__theme-label\">\n                <span class=\"mint-settings-modal__theme-radio\" aria-hidden=\"true\" />\n                {{ opt.label }}\n              </span>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"mint-settings-modal__setting\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Color palette</span>\n            <span class=\"mint-settings-modal__setting-hint\">Accent colour across the interface</span>\n          </div>\n          <div class=\"mint-settings-modal__palettes\">\n            <button\n              v-for=\"(palette, key) in colorPalettes\"\n              :key=\"key\"\n              type=\"button\"\n              :aria-pressed=\"settings.colorPalette === key\"\n              :class=\"['mint-settings-modal__palette', { 'mint-settings-modal__palette--active': settings.colorPalette === key }]\"\n              @click=\"settings.colorPalette = key as ColorPalette\"\n            >\n              <span class=\"mint-settings-modal__swatches\" :data-palette=\"key\" aria-hidden=\"true\">\n                <span\n                  v-for=\"token in paletteSwatchTokens\"\n                  :key=\"token\"\n                  class=\"mint-settings-modal__swatch\"\n                  :style=\"{ backgroundColor: `var(${token})` }\"\n                />\n              </span>\n              <span class=\"mint-settings-modal__palette-name\">{{ palette.name }}</span>\n              <svg class=\"mint-settings-modal__palette-check\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                <path d=\"M3.5 8.5l3 3 6-7\" />\n              </svg>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"mint-settings-modal__setting mint-settings-modal__setting--inline\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Density</span>\n            <span class=\"mint-settings-modal__setting-hint\">Adjusts control and table row height</span>\n          </div>\n          <SegmentedControl\n            :model-value=\"settings.tableDensity\"\n            :options=\"densityOptions\"\n            size=\"sm\"\n            @update:model-value=\"settings.tableDensity = $event as TableDensity\"\n          />\n          <div\n            :class=\"['mint-settings-modal__density-preview', `mint-settings-modal__density-preview--${settings.tableDensity}`]\"\n            aria-hidden=\"true\"\n          >\n            <div class=\"mint-settings-modal__density-row mint-settings-modal__density-row--head\">\n              <span>Sample</span><span>RT</span><span>IC50</span>\n            </div>\n            <div v-for=\"cells in densityPreviewRows\" :key=\"cells[0]\" class=\"mint-settings-modal__density-row\">\n              <span>{{ cells[0] }}</span><span>{{ cells[1] }}</span><span>{{ cells[2] }}</span>\n            </div>\n          </div>\n        </div>\n\n        <slot name=\"appearance\" />\n      </section>\n    </div>\n\n    <template #footer>\n      <slot\n        name=\"footer\"\n        :values=\"builder.form.data\"\n        :close=\"handleClose\"\n      >\n        <span class=\"mint-settings-modal__status\" role=\"status\">\n          <svg v-if=\"applied\" class=\"mint-settings-modal__status-icon\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n            <path d=\"M3.5 8.5l3 3 6-7\" />\n          </svg>\n          {{ applied ? 'Applied · changes take effect immediately' : 'Changes take effect immediately' }}\n        </span>\n        <BaseButton class=\"mint-settings-modal__done\" variant=\"primary\" @click=\"handleClose\">Done</BaseButton>\n      </slot>\n    </template>\n  </BaseModal>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"SettingsModal-B1ltysmg.js","names":[],"sources":["../src/components/internal/SettingsPaneHeadInternal.vue","../src/components/internal/SettingsPaneHeadInternal.vue","../src/components/SettingsModal.schema.ts","../src/components/SettingsModal.vue","../src/components/SettingsModal.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** SettingsModal pane header: title + description or mono count, and an optional \"Restore group defaults\" action. */\ninterface Props {\n  title: string\n  description?: string\n  /** Mono count after the title (search results). */\n  count?: string\n  /** Modified fields in the group. Omit to hide the restore action; 0 renders it disabled. */\n  modifiedCount?: number\n}\n\ndefineProps<Props>()\n\nconst emit = defineEmits<{\n  restore: []\n}>()\n</script>\n\n<template>\n  <div class=\"mint-settings-modal__head\">\n    <div class=\"mint-settings-modal__head-text\">\n      <h4 class=\"mint-settings-modal__head-title\">\n        {{ title }}\n        <span v-if=\"count\" class=\"mint-settings-modal__head-count\">{{ count }}</span>\n      </h4>\n      <p v-if=\"description\" class=\"mint-settings-modal__head-description\">{{ description }}</p>\n    </div>\n    <button\n      v-if=\"modifiedCount !== undefined\"\n      type=\"button\"\n      class=\"mint-settings-modal__restore-group\"\n      :disabled=\"modifiedCount === 0\"\n      @click=\"emit('restore')\"\n    >\n      <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n        <path d=\"M3 8a5 5 0 1 0 1.5-3.5M3 3v2.5h2.5\" />\n      </svg>\n      Restore group defaults\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\n/** SettingsModal pane header: title + description or mono count, and an optional \"Restore group defaults\" action. */\ninterface Props {\n  title: string\n  description?: string\n  /** Mono count after the title (search results). */\n  count?: string\n  /** Modified fields in the group. Omit to hide the restore action; 0 renders it disabled. */\n  modifiedCount?: number\n}\n\ndefineProps<Props>()\n\nconst emit = defineEmits<{\n  restore: []\n}>()\n</script>\n\n<template>\n  <div class=\"mint-settings-modal__head\">\n    <div class=\"mint-settings-modal__head-text\">\n      <h4 class=\"mint-settings-modal__head-title\">\n        {{ title }}\n        <span v-if=\"count\" class=\"mint-settings-modal__head-count\">{{ count }}</span>\n      </h4>\n      <p v-if=\"description\" class=\"mint-settings-modal__head-description\">{{ description }}</p>\n    </div>\n    <button\n      v-if=\"modifiedCount !== undefined\"\n      type=\"button\"\n      class=\"mint-settings-modal__restore-group\"\n      :disabled=\"modifiedCount === 0\"\n      @click=\"emit('restore')\"\n    >\n      <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n        <path d=\"M3 8a5 5 0 1 0 1.5-3.5M3 3v2.5h2.5\" />\n      </svg>\n      Restore group defaults\n    </button>\n  </div>\n</template>\n","import type {\n  FormSchema,\n  FormSectionSchema,\n  SettingsGroup,\n  SettingsModalSchema,\n  SettingsTab,\n  SettingsTabInput,\n} from '../types'\nimport type { AccessControlled } from '../permissions'\nimport { normalizeItemInput } from '../utils/items'\n\nexport const APPEARANCE_TAB_ID = 'appearance'\n\nexport const APPEARANCE_TAB: SettingsTab = {\n  id: APPEARANCE_TAB_ID,\n  label: 'Appearance',\n  // Heroicons \"swatch\" — the built-in tab sits beside plugin tabs that all\n  // carry icons, so it needs one of its own to keep the rail consistent.\n  icon: '<svg fill=\"none\" viewBox=\"0 0 24 24\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><path d=\"M4.098 19.902a3.75 3.75 0 0 0 5.304 0l6.401-6.402M6.75 21A3.75 3.75 0 0 1 3 17.25V4.125C3 3.504 3.504 3 4.125 3h5.25c.621 0 1.125.504 1.125 1.125v4.072M6.75 21a3.75 3.75 0 0 0 3.75-3.75V8.197M6.75 21h13.125c.621 0 1.125-.504 1.125-1.125v-5.25c0-.621-.504-1.125-1.125-1.125h-4.072M10.5 8.197l2.88-2.88c.438-.439 1.15-.439 1.59 0l3.712 3.713c.44.44.44 1.152 0 1.59l-2.879 2.88M6.75 17.25h.008v.008H6.75v-.008Z\"></path></svg>',\n  description: 'Theme, color palette, and density',\n}\n\n// Map settings groups onto the form-builder's flat-section shape.\n// `title: ''` because the rail/pane header already shows the group name.\nexport function buildFlatSettingsSchema(schema: SettingsModalSchema): FormSchema {\n  return {\n    sections: schema.groups.map<FormSectionSchema>((group) => ({\n      id: group.id,\n      title: '',\n      fields: group.fields,\n      columns: group.columns,\n      condition: group.condition,\n    })),\n  }\n}\n\nexport function filterSettingsSchemaByAccess(\n  schema: SettingsModalSchema,\n  canShow: (item: AccessControlled) => boolean\n): SettingsModalSchema {\n  const groups = schema.groups.flatMap((group) => {\n    if (!canShow(group)) return []\n\n    const fields = group.fields.filter(canShow)\n    if (fields.length === 0) return []\n\n    return [{ ...group, fields }]\n  })\n\n  return { groups }\n}\n\nexport function settingsGroupToTab(group: SettingsGroup): SettingsTab {\n  return {\n    id: group.id,\n    label: group.label,\n    icon: group.icon,\n    description: group.description,\n  }\n}\n\nexport function normalizeVisibleSettingsTabs(\n  tabs: SettingsTabInput[],\n  canShow: (item: AccessControlled) => boolean\n): SettingsTab[] {\n  return tabs.map(normalizeItemInput).filter(canShow)\n}\n\nexport function buildSettingsTabs(\n  baseTabs: SettingsTab[],\n  showAppearance: boolean,\n  appearanceFirst = false\n): SettingsTab[] {\n  if (!showAppearance) return baseTabs\n  return appearanceFirst ? [APPEARANCE_TAB, ...baseTabs] : [...baseTabs, APPEARANCE_TAB]\n}\n","<script setup lang=\"ts\">\n/**\n * Tabbed settings modal with three usage modes:\n *\n *   1. Schema-driven (recommended) — pass a `defineControlModel()` result or a\n *      `SettingsModalSchema` as `spec`, plus `v-model:values`. Each\n *      group/section becomes a tab; fields auto-render via the SDK form field\n *      registry (text, select, number, toggle, molecule, concentration, …).\n *      Conditional visibility, validation, and dynamic options come for free.\n *\n *   2. Manual tabs + slots — pass `tabs` and a `<template #tab-{id}>` slot\n *      per tab. Use this when you need bespoke widgets the form-builder\n *      registry doesn't cover (or for legacy plugins).\n *\n *   3. Appearance only — `showAppearance` (default true) renders the built-in\n *      theme / palette / table-density tab. Works alongside both modes above.\n *\n * Layout: omitted (default) renders a sidebar rail split into \"Plugin\" and\n * \"Personal\" (Appearance) sections when there are more than three groups, and\n * stacks every group on one page otherwise. `vertical` always uses the rail;\n * `horizontal` keeps the underline tab strip.\n *\n * Schema-driven settings also get a search across groups (label + hint), a\n * modified-from-default marker with a per-row reset for every field with a\n * non-null `defaultValue` (every control model field gets one), and a \"Restore group defaults\" action. Changes\n * apply immediately; the default footer says so and closes with \"Done\".\n *\n * @example Recommended\n * ```vue\n * <SettingsModal v-model:open=\"open\" v-model:values=\"values\" :spec=\"settingsModel\" />\n * ```\n */\nimport { ref, computed, watch } from 'vue'\nimport BaseModal from './BaseModal.vue'\nimport BaseButton from './BaseButton.vue'\nimport BaseInput from './BaseInput.vue'\nimport SegmentedControl from './SegmentedControl.vue'\nimport FormFieldRendererInternal from './internal/FormFieldRendererInternal.vue'\nimport SettingsPaneHeadInternal from './internal/SettingsPaneHeadInternal.vue'\nimport { useFormBuilder } from '../composables/useFormBuilder'\nimport {\n  controlsToSettingsSchema,\n  isControlModelBinding,\n  type ControlModelBinding,\n} from '../composables/useControlSchema'\nimport { useSettingsStore, colorPalettes } from '../stores/settings'\nimport { useAuthStore } from '../stores/auth'\nimport { usePlatform } from '../composables/usePlatform'\nimport { canAccessByPolicy } from '../permissions'\nimport {\n  formSchemaFieldNames,\n  pickExistingRecordKeys,\n  pickRecordKeys,\n  recordValuesEqualForKeys,\n  valuesEqual,\n} from '../utils/formModelSync'\nimport type {\n  ThemeMode,\n  ColorPalette,\n  TableDensity,\n  ModalLayout,\n  ModalTab,\n  SettingsGroup,\n  SettingsTab,\n  SettingsTabInput,\n  SettingsModalLayout,\n  SettingsModalSchema,\n  SettingsUserType,\n  FormFieldSchema,\n} from '../types'\nimport type { AccessControlled, PermissionUser } from '../permissions'\nimport {\n  APPEARANCE_TAB,\n  APPEARANCE_TAB_ID,\n  buildFlatSettingsSchema,\n  buildSettingsTabs,\n  filterSettingsSchemaByAccess,\n  normalizeVisibleSettingsTabs,\n  settingsGroupToTab,\n} from './SettingsModal.schema'\n\ninterface Props {\n  open: boolean\n  title?: string\n  /** Manual tab descriptors. Ignored when `spec` is set (groups become tabs). */\n  tabs?: SettingsTabInput[]\n  showAppearance?: boolean\n  /** List Appearance before the other tabs and open on it. */\n  appearanceFirst?: boolean\n  size?: 'md' | 'lg' | 'xl'\n  layout?: SettingsModalLayout\n  /** Control model built with defineControlModel(), or a SettingsModalSchema (e.g. the generated `settingsForm`). Fields auto-render via SDK form components. */\n  spec?: ControlModelBinding | SettingsModalSchema\n  /** Two-way bound values when `spec` is set. */\n  values?: Record<string, unknown>\n  /** Optional user type override for permission-filtered settings content. Defaults to SDK auth/platform context. */\n  userType?: SettingsUserType\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Settings',\n  tabs: () => [],\n  showAppearance: true,\n  size: 'lg',\n  layout: undefined,\n  spec: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean]\n  'update:values': [data: Record<string, unknown>]\n  close: []\n}>()\n\nconst settings = useSettingsStore()\nconst auth = useAuthStore()\nconst { user: platformUser, integrated, isAdmin: platformIsAdmin } = usePlatform()\n// With sign-in turned off (`authRequired: false`) every caller of an integrated page is the\n// implicit administrator, and usePlatform reports a page with no user as admin.\nconst implicitPlatformAdmin = computed(() => integrated.value && !platformUser.value && platformIsAdmin.value)\n\nconst resolvedModel = computed<ControlModelBinding | undefined>(() =>\n  isControlModelBinding(props.spec) ? props.spec : undefined,\n)\nconst sourceSettingsSchema = computed<SettingsModalSchema | undefined>(() =>\n  resolvedModel.value\n    ? controlsToSettingsSchema(resolvedModel.value.controls, resolvedModel.value.controlOptions)\n    : props.spec as SettingsModalSchema | undefined,\n)\nconst currentAccessUser = computed<PermissionUser | null>(() => {\n  if (props.userType) {\n    return { role: props.userType === 'admin' ? 'admin' : 'user' }\n  }\n  return auth.userInfo ?? platformUser.value ?? (implicitPlatformAdmin.value ? { role: 'admin' } : null)\n})\nconst isAccessUserAuthenticated = computed(() =>\n  props.userType !== undefined || auth.isAuthenticated || !!platformUser.value || implicitPlatformAdmin.value,\n)\nconst settingsSchema = computed<SettingsModalSchema | undefined>(() => {\n  if (!sourceSettingsSchema.value) return undefined\n  return filterSettingsSchemaByAccess(sourceSettingsSchema.value, canShowForCurrentUser)\n})\nconst isSchemaDriven = computed(() => !!settingsSchema.value)\nconst resolvedValues = computed<Record<string, unknown>>(() => ({\n  ...(resolvedModel.value?.controlOptions.initialValues ?? {}),\n  ...(props.values ?? {}),\n}))\n\n// Schema-driven mode keeps one form-builder instance and syncs schema changes\n// into it, so callers can swap groups/fields without remounting the modal.\nconst builder = useFormBuilder(\n  settingsSchema.value ? buildFlatSettingsSchema(settingsSchema.value) : { sections: [] },\n  resolvedValues.value,\n  resolvedModel.value?.controlOptions.enhancements,\n)\n\nwatch(\n  () => settingsSchema.value,\n  (schema) => {\n    if (!schema) {\n      builder.updateSchema({ sections: [] }, {})\n      return\n    }\n\n    const flatSchema = buildFlatSettingsSchema(schema)\n    const fieldNames = formSchemaFieldNames(flatSchema)\n    const sourceValues = props.values === undefined\n      ? {\n          ...resolvedValues.value,\n          ...(builder.form.data as Record<string, unknown>),\n        }\n      : resolvedValues.value\n\n    builder.updateSchema(flatSchema, pickExistingRecordKeys(sourceValues ?? {}, fieldNames))\n  },\n  { deep: true },\n)\n\nwatch(\n  () => ({ ...resolvedValues.value }),\n  (data) => {\n    if (!settingsSchema.value) return\n    const fieldNames = builderFieldNames()\n    if (recordValuesEqualForKeys(data, builder.form.data as Record<string, unknown>, fieldNames)) return\n    builder.reset(pickRecordKeys(data, fieldNames))\n  },\n  { deep: true },\n)\n\n// Changes apply immediately; the footer confirms it once the user changed something.\nconst applied = ref(false)\n\nwatch(\n  () => ({ ...builder.form.data }),\n  (data) => {\n    // A reset to the parent's values (async load, schema swap) is not a user change.\n    if (!recordValuesEqualForKeys(data, resolvedValues.value, builderFieldNames())) applied.value = true\n    if (settingsSchema.value) {\n      emit('update:values', {\n        ...resolvedValues.value,\n        ...data,\n      })\n    }\n  },\n  { deep: true },\n)\n\n// Schema groups whose `condition` evaluates false against the current data are\n// dropped from the rail entirely — same semantics as section visibility in\n// FormBuilder. Manual `tabs` have no condition mechanism, so they pass through.\nconst visibleSchemaGroups = computed(() =>\n  settingsSchema.value\n    ? settingsSchema.value.groups.filter((g) => builder.isSectionVisible(g.id))\n    : [],\n)\n\nconst manualTabs = computed<SettingsTab[]>(() =>\n  normalizeVisibleSettingsTabs(props.tabs, canShowForCurrentUser)\n)\n\nconst allTabs = computed<SettingsTab[]>(() => {\n  const base: SettingsTab[] = settingsSchema.value\n    ? visibleSchemaGroups.value.map(settingsGroupToTab)\n    : manualTabs.value\n  return buildSettingsTabs(base, props.showAppearance, props.appearanceFirst)\n})\n\nconst activeTab = ref(allTabs.value[0]?.id || APPEARANCE_TAB_ID)\n\n/** Above this many plugin groups the default layout switches from one stacked page to the rail. */\nconst STACKED_GROUP_LIMIT = 3\n\n// BaseModal owns the tab chrome: 'vertical' keeps its public name and maps to\n// the shell rail; horizontal maps to the shell strip (plain when single-tab).\nconst baseLayout = computed<ModalLayout>(() => {\n  if (props.layout === 'vertical') return 'rail'\n  if (props.layout === 'horizontal') return allTabs.value.length > 1 ? 'tabs' : 'plain'\n  const pluginTabCount = settingsSchema.value ? visibleSchemaGroups.value.length : manualTabs.value.length\n  return pluginTabCount > STACKED_GROUP_LIMIT ? 'rail' : 'plain'\n})\nconst isRail = computed(() => baseLayout.value === 'rail')\nconst isStacked = computed(() => baseLayout.value === 'plain')\n\nconst query = ref('')\nconst searchTerm = computed(() => query.value.trim().toLowerCase())\nconst isSearching = computed(() => isSchemaDriven.value && searchTerm.value !== '')\n\nconst modalTabs = computed<ModalTab[]>(() =>\n  allTabs.value.map((tab) => {\n    const group = visibleSchemaGroups.value.find((g) => g.id === tab.id)\n    const modified = group ? modifiedCount(group) : 0\n    return {\n      id: tab.id,\n      label: tab.label,\n      icon: tab.icon,\n      description: tab.description,\n      meta: group ? (modified ? String(modified) : undefined) : tab.meta,\n      // Sections only split plugin groups from Appearance; without it there is nothing to split.\n      section: props.showAppearance ? (tab.id === APPEARANCE_TAB_ID ? 'Personal' : tab.section ?? 'Plugin') : undefined,\n    }\n  }),\n)\n\nfunction selectTab(id: string) {\n  activeTab.value = id\n  query.value = ''\n}\n\nfunction handleSearchKeydown(event: KeyboardEvent) {\n  // First Escape clears the search; the next one closes the modal.\n  if (event.key === 'Escape' && query.value) {\n    event.stopPropagation()\n    query.value = ''\n  }\n}\n\n// If the active tab vanishes (group hidden by condition), drop back to the first available.\nwatch(allTabs, (tabs) => {\n  if (!tabs.some((t) => t.id === activeTab.value)) {\n    activeTab.value = tabs[0]?.id ?? APPEARANCE_TAB_ID\n  }\n})\n\nconst activeGroup = computed(() =>\n  visibleSchemaGroups.value.find((g) => g.id === activeTab.value),\n)\n\nfunction visibleFields(group: SettingsGroup): FormFieldSchema[] {\n  return group.fields.filter((f) => builder.isFieldVisible(f.name))\n}\n\n/**\n * Modified = differs from the field's own `defaultValue`. A field without one, or with a `null`\n * default (a secret, or an optional setting), never is: restoring `null` would clear a stored value.\n */\nfunction isModified(field: FormFieldSchema): boolean {\n  return field.defaultValue != null\n    && !valuesEqual((builder.form.data as Record<string, unknown>)[field.name], field.defaultValue)\n}\n\nfunction modifiedCount(group: SettingsGroup): number {\n  return visibleFields(group).filter(isModified).length\n}\n\nfunction resetField(field: FormFieldSchema) {\n  builder.form.setFieldValue(field.name, field.defaultValue)\n}\n\nfunction restoreGroup(group: SettingsGroup | undefined) {\n  if (group) visibleFields(group).filter(isModified).forEach(resetField)\n}\n\nfunction isBooleanField(field: FormFieldSchema): boolean {\n  return field.type === 'checkbox' || field.type === 'toggle'\n}\n\n/** Booleans are always toggles inside settings rows; their hint is printed under the row, not in a tooltip. */\nfunction settingsField(field: FormFieldSchema): FormFieldSchema {\n  return isBooleanField(field) ? { ...field, type: 'toggle', hint: undefined } : field\n}\n\ninterface SettingsRow {\n  field: FormFieldSchema\n  group: SettingsGroup\n}\n\nconst searchResults = computed<SettingsRow[]>(() => {\n  if (!isSearching.value) return []\n  return visibleSchemaGroups.value.flatMap((group) =>\n    visibleFields(group)\n      .filter((field) => [field.label, field.hint, group.label].join(' ').toLowerCase().includes(searchTerm.value))\n      .map((field) => ({ field, group })),\n  )\n})\n\nconst resultCount = computed(() =>\n  `${searchResults.value.length} result${searchResults.value.length === 1 ? '' : 's'}`,\n)\n\n/** What the pane renders: one list of search hits, every group (stacked) or the active group. */\nconst paneSections = computed<{ key: string; group?: SettingsGroup; rows: SettingsRow[] }[]>(() => {\n  if (isSearching.value) {\n    return searchResults.value.length ? [{ key: 'search', rows: searchResults.value }] : []\n  }\n  const groups = isStacked.value\n    ? visibleSchemaGroups.value\n    : activeGroup.value ? [activeGroup.value] : []\n  return groups.map((group) => ({\n    key: group.id,\n    group,\n    rows: visibleFields(group).map((field) => ({ field, group })),\n  }))\n})\n\nconst themeOptions: { value: ThemeMode; label: string; halves: ('light' | 'dark')[] }[] = [\n  { value: 'light', label: 'Light', halves: ['light'] },\n  { value: 'dark', label: 'Dark', halves: ['dark'] },\n  { value: 'system', label: 'System', halves: ['light', 'dark'] },\n]\n\n/** Accent tokens a palette swatch shows; `data-palette` on the strip resolves them per palette. */\nconst paletteSwatchTokens = ['--color-primary', '--color-primary-hover', '--color-primary-soft', '--color-primary-border']\n\nconst densityPreviewRows = [\n  ['S-0012', '2.41', '12.5'],\n  ['S-0013', '7.90', '3.25'],\n  ['S-0014', '10.60', '0.80'],\n]\n\nconst densityOptions: { value: TableDensity; label: string }[] = [\n  { value: 'compact', label: 'Compact' },\n  { value: 'normal', label: 'Normal' },\n  { value: 'comfortable', label: 'Comfortable' },\n]\n\nwatch(\n  () => [settings.theme, settings.colorPalette, settings.tableDensity],\n  () => { applied.value = true },\n)\n\nfunction handleClose() {\n  emit('update:open', false)\n  emit('close')\n}\n\nfunction builderFieldNames(): string[] {\n  return builder.fields.map(field => field.name)\n}\n\nfunction canShowForCurrentUser(item: AccessControlled): boolean {\n  return canAccessByPolicy(\n    currentAccessUser.value,\n    item.access,\n    isAccessUserAuthenticated.value,\n  )\n}\n</script>\n\n<template>\n  <BaseModal\n    :open=\"open\"\n    :title=\"title\"\n    :size=\"size\"\n    :layout=\"baseLayout\"\n    :tabs=\"modalTabs\"\n    :active-tab=\"isSearching ? '' : activeTab\"\n    @update:active-tab=\"selectTab\"\n    @update:open=\"emit('update:open', $event)\"\n    @close=\"handleClose\"\n  >\n    <template #header>\n      <div class=\"mint-settings-modal__header\">\n        <h3 class=\"mint-modal__title\">{{ title }}</h3>\n        <div v-if=\"isSchemaDriven\" class=\"mint-settings-modal__search\">\n          <svg class=\"mint-settings-modal__search-icon\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" aria-hidden=\"true\">\n            <circle cx=\"7\" cy=\"7\" r=\"4.5\" /><path d=\"M10.5 10.5L14 14\" />\n          </svg>\n          <BaseInput\n            :model-value=\"query\"\n            type=\"search\"\n            size=\"sm\"\n            placeholder=\"Search settings\"\n            aria-label=\"Search settings\"\n            @update:model-value=\"query = String($event ?? '')\"\n            @keydown=\"handleSearchKeydown\"\n          />\n        </div>\n      </div>\n    </template>\n\n    <template v-if=\"isRail && isSchemaDriven\" #pane-header=\"{ tab }\">\n      <SettingsPaneHeadInternal v-if=\"isSearching\" title=\"Search results\" :count=\"resultCount\" />\n      <SettingsPaneHeadInternal\n        v-else\n        :title=\"tab?.label ?? ''\"\n        :description=\"tab?.description\"\n        :modified-count=\"activeGroup ? modifiedCount(activeGroup) : undefined\"\n        @restore=\"restoreGroup(activeGroup)\"\n      />\n    </template>\n\n    <!-- Body: the active pane only — tab strip / rail / footer are BaseModal's shell. -->\n    <div :class=\"['mint-settings-modal', { 'mint-settings-modal--schema': isSchemaDriven }]\">\n      <template v-if=\"isSchemaDriven\">\n        <SettingsPaneHeadInternal v-if=\"isSearching && !isRail\" title=\"Search results\" :count=\"resultCount\" />\n        <section v-for=\"section in paneSections\" :key=\"section.key\" class=\"mint-settings-modal__group\">\n          <SettingsPaneHeadInternal\n            v-if=\"section.group && !isRail\"\n            :title=\"section.group.label\"\n            :description=\"section.group.description\"\n            :modified-count=\"modifiedCount(section.group)\"\n            @restore=\"restoreGroup(section.group)\"\n          />\n          <div\n            class=\"mint-settings-modal__group-grid\"\n            :style=\"{ '--mint-settings-cols': section.group?.columns ?? 1 }\"\n          >\n            <div\n              v-for=\"row in section.rows\"\n              :key=\"row.field.name\"\n              :class=\"['mint-settings-modal__row', { 'mint-settings-modal__row--modified': isModified(row.field) }]\"\n              :style=\"row.field.colSpan ? { gridColumn: `span ${row.field.colSpan}` } : undefined\"\n            >\n              <span v-if=\"!section.group\" class=\"mint-settings-modal__row-group\">{{ row.group.label }}</span>\n              <div class=\"mint-settings-modal__row-field\">\n                <slot\n                  :name=\"`field:${row.field.name}`\"\n                  :field=\"row.field\"\n                  :form=\"builder.form\"\n                  :field-props=\"builder.form.getFieldProps(row.field.name)\"\n                >\n                  <FormFieldRendererInternal\n                    :field=\"settingsField(row.field)\"\n                    :resolved-props=\"builder.getResolvedFieldProps(settingsField(row.field))\"\n                    :form=\"builder.form\"\n                  />\n                </slot>\n                <p v-if=\"isBooleanField(row.field) && row.field.hint\" class=\"mint-settings-modal__row-hint\">\n                  {{ row.field.hint }}\n                </p>\n                <button\n                  v-if=\"isModified(row.field)\"\n                  type=\"button\"\n                  class=\"mint-settings-modal__reset\"\n                  title=\"Restore default\"\n                  :aria-label=\"`Restore default for ${row.field.label}`\"\n                  @click=\"resetField(row.field)\"\n                >\n                  <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                    <path d=\"M3 8a5 5 0 1 0 1.5-3.5M3 3v2.5h2.5\" />\n                  </svg>\n                </button>\n              </div>\n            </div>\n          </div>\n        </section>\n        <p v-if=\"isSearching && searchResults.length === 0\" class=\"mint-settings-modal__empty\">\n          No settings match \"{{ query.trim() }}\"\n        </p>\n      </template>\n\n      <template v-else>\n        <section\n          v-for=\"tab in manualTabs\"\n          v-show=\"isStacked || activeTab === tab.id\"\n          :key=\"tab.id\"\n          class=\"mint-settings-modal__group\"\n        >\n          <SettingsPaneHeadInternal v-if=\"isStacked\" :title=\"tab.label\" :description=\"tab.description\" />\n          <slot :name=\"`tab-${tab.id}`\" />\n        </section>\n      </template>\n\n      <section\n        v-if=\"showAppearance\"\n        v-show=\"!isSearching && (isStacked || activeTab === APPEARANCE_TAB_ID)\"\n        class=\"mint-settings-modal__group mint-settings-modal__appearance\"\n      >\n        <SettingsPaneHeadInternal\n          v-if=\"isStacked\"\n          :title=\"APPEARANCE_TAB.label\"\n          :description=\"APPEARANCE_TAB.description\"\n        />\n\n        <div class=\"mint-settings-modal__setting\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Theme</span>\n            <span class=\"mint-settings-modal__setting-hint\">Applies to this browser only</span>\n          </div>\n          <div class=\"mint-settings-modal__themes\">\n            <button\n              v-for=\"opt in themeOptions\"\n              :key=\"opt.value\"\n              type=\"button\"\n              :aria-pressed=\"settings.theme === opt.value\"\n              :class=\"['mint-settings-modal__theme', { 'mint-settings-modal__theme--active': settings.theme === opt.value }]\"\n              @click=\"settings.theme = opt.value\"\n            >\n              <span class=\"mint-settings-modal__theme-preview\" aria-hidden=\"true\">\n                <span\n                  v-for=\"half in opt.halves\"\n                  :key=\"half\"\n                  :class=\"['mint-settings-modal__theme-half', `mint-settings-modal__theme-half--${half}`]\"\n                >\n                  <span class=\"mint-settings-modal__theme-line\" />\n                  <span class=\"mint-settings-modal__theme-card\" />\n                </span>\n              </span>\n              <span class=\"mint-settings-modal__theme-label\">\n                <span class=\"mint-settings-modal__theme-radio\" aria-hidden=\"true\" />\n                {{ opt.label }}\n              </span>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"mint-settings-modal__setting\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Color palette</span>\n            <span class=\"mint-settings-modal__setting-hint\">Accent colour across the interface</span>\n          </div>\n          <div class=\"mint-settings-modal__palettes\">\n            <button\n              v-for=\"(palette, key) in colorPalettes\"\n              :key=\"key\"\n              type=\"button\"\n              :aria-pressed=\"settings.colorPalette === key\"\n              :class=\"['mint-settings-modal__palette', { 'mint-settings-modal__palette--active': settings.colorPalette === key }]\"\n              @click=\"settings.colorPalette = key as ColorPalette\"\n            >\n              <span class=\"mint-settings-modal__swatches\" :data-palette=\"key\" aria-hidden=\"true\">\n                <span\n                  v-for=\"token in paletteSwatchTokens\"\n                  :key=\"token\"\n                  class=\"mint-settings-modal__swatch\"\n                  :style=\"{ backgroundColor: `var(${token})` }\"\n                />\n              </span>\n              <span class=\"mint-settings-modal__palette-name\">{{ palette.name }}</span>\n              <svg class=\"mint-settings-modal__palette-check\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                <path d=\"M3.5 8.5l3 3 6-7\" />\n              </svg>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"mint-settings-modal__setting mint-settings-modal__setting--inline\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Density</span>\n            <span class=\"mint-settings-modal__setting-hint\">Adjusts control and table row height</span>\n          </div>\n          <SegmentedControl\n            :model-value=\"settings.tableDensity\"\n            :options=\"densityOptions\"\n            size=\"sm\"\n            @update:model-value=\"settings.tableDensity = $event as TableDensity\"\n          />\n          <div\n            :class=\"['mint-settings-modal__density-preview', `mint-settings-modal__density-preview--${settings.tableDensity}`]\"\n            aria-hidden=\"true\"\n          >\n            <div class=\"mint-settings-modal__density-row mint-settings-modal__density-row--head\">\n              <span>Sample</span><span>RT</span><span>IC50</span>\n            </div>\n            <div v-for=\"cells in densityPreviewRows\" :key=\"cells[0]\" class=\"mint-settings-modal__density-row\">\n              <span>{{ cells[0] }}</span><span>{{ cells[1] }}</span><span>{{ cells[2] }}</span>\n            </div>\n          </div>\n        </div>\n\n        <slot name=\"appearance\" />\n      </section>\n    </div>\n\n    <template #footer>\n      <slot\n        name=\"footer\"\n        :values=\"builder.form.data\"\n        :close=\"handleClose\"\n      >\n        <span class=\"mint-settings-modal__status\" role=\"status\">\n          <svg v-if=\"applied\" class=\"mint-settings-modal__status-icon\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n            <path d=\"M3.5 8.5l3 3 6-7\" />\n          </svg>\n          {{ applied ? 'Applied · changes take effect immediately' : 'Changes take effect immediately' }}\n        </span>\n        <BaseButton class=\"mint-settings-modal__done\" variant=\"primary\" @click=\"handleClose\">Done</BaseButton>\n      </slot>\n    </template>\n  </BaseModal>\n</template>\n","<script setup lang=\"ts\">\n/**\n * Tabbed settings modal with three usage modes:\n *\n *   1. Schema-driven (recommended) — pass a `defineControlModel()` result or a\n *      `SettingsModalSchema` as `spec`, plus `v-model:values`. Each\n *      group/section becomes a tab; fields auto-render via the SDK form field\n *      registry (text, select, number, toggle, molecule, concentration, …).\n *      Conditional visibility, validation, and dynamic options come for free.\n *\n *   2. Manual tabs + slots — pass `tabs` and a `<template #tab-{id}>` slot\n *      per tab. Use this when you need bespoke widgets the form-builder\n *      registry doesn't cover (or for legacy plugins).\n *\n *   3. Appearance only — `showAppearance` (default true) renders the built-in\n *      theme / palette / table-density tab. Works alongside both modes above.\n *\n * Layout: omitted (default) renders a sidebar rail split into \"Plugin\" and\n * \"Personal\" (Appearance) sections when there are more than three groups, and\n * stacks every group on one page otherwise. `vertical` always uses the rail;\n * `horizontal` keeps the underline tab strip.\n *\n * Schema-driven settings also get a search across groups (label + hint), a\n * modified-from-default marker with a per-row reset for every field with a\n * non-null `defaultValue` (every control model field gets one), and a \"Restore group defaults\" action. Changes\n * apply immediately; the default footer says so and closes with \"Done\".\n *\n * @example Recommended\n * ```vue\n * <SettingsModal v-model:open=\"open\" v-model:values=\"values\" :spec=\"settingsModel\" />\n * ```\n */\nimport { ref, computed, watch } from 'vue'\nimport BaseModal from './BaseModal.vue'\nimport BaseButton from './BaseButton.vue'\nimport BaseInput from './BaseInput.vue'\nimport SegmentedControl from './SegmentedControl.vue'\nimport FormFieldRendererInternal from './internal/FormFieldRendererInternal.vue'\nimport SettingsPaneHeadInternal from './internal/SettingsPaneHeadInternal.vue'\nimport { useFormBuilder } from '../composables/useFormBuilder'\nimport {\n  controlsToSettingsSchema,\n  isControlModelBinding,\n  type ControlModelBinding,\n} from '../composables/useControlSchema'\nimport { useSettingsStore, colorPalettes } from '../stores/settings'\nimport { useAuthStore } from '../stores/auth'\nimport { usePlatform } from '../composables/usePlatform'\nimport { canAccessByPolicy } from '../permissions'\nimport {\n  formSchemaFieldNames,\n  pickExistingRecordKeys,\n  pickRecordKeys,\n  recordValuesEqualForKeys,\n  valuesEqual,\n} from '../utils/formModelSync'\nimport type {\n  ThemeMode,\n  ColorPalette,\n  TableDensity,\n  ModalLayout,\n  ModalTab,\n  SettingsGroup,\n  SettingsTab,\n  SettingsTabInput,\n  SettingsModalLayout,\n  SettingsModalSchema,\n  SettingsUserType,\n  FormFieldSchema,\n} from '../types'\nimport type { AccessControlled, PermissionUser } from '../permissions'\nimport {\n  APPEARANCE_TAB,\n  APPEARANCE_TAB_ID,\n  buildFlatSettingsSchema,\n  buildSettingsTabs,\n  filterSettingsSchemaByAccess,\n  normalizeVisibleSettingsTabs,\n  settingsGroupToTab,\n} from './SettingsModal.schema'\n\ninterface Props {\n  open: boolean\n  title?: string\n  /** Manual tab descriptors. Ignored when `spec` is set (groups become tabs). */\n  tabs?: SettingsTabInput[]\n  showAppearance?: boolean\n  /** List Appearance before the other tabs and open on it. */\n  appearanceFirst?: boolean\n  size?: 'md' | 'lg' | 'xl'\n  layout?: SettingsModalLayout\n  /** Control model built with defineControlModel(), or a SettingsModalSchema (e.g. the generated `settingsForm`). Fields auto-render via SDK form components. */\n  spec?: ControlModelBinding | SettingsModalSchema\n  /** Two-way bound values when `spec` is set. */\n  values?: Record<string, unknown>\n  /** Optional user type override for permission-filtered settings content. Defaults to SDK auth/platform context. */\n  userType?: SettingsUserType\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  title: 'Settings',\n  tabs: () => [],\n  showAppearance: true,\n  size: 'lg',\n  layout: undefined,\n  spec: undefined,\n})\n\nconst emit = defineEmits<{\n  'update:open': [value: boolean]\n  'update:values': [data: Record<string, unknown>]\n  close: []\n}>()\n\nconst settings = useSettingsStore()\nconst auth = useAuthStore()\nconst { user: platformUser, integrated, isAdmin: platformIsAdmin } = usePlatform()\n// With sign-in turned off (`authRequired: false`) every caller of an integrated page is the\n// implicit administrator, and usePlatform reports a page with no user as admin.\nconst implicitPlatformAdmin = computed(() => integrated.value && !platformUser.value && platformIsAdmin.value)\n\nconst resolvedModel = computed<ControlModelBinding | undefined>(() =>\n  isControlModelBinding(props.spec) ? props.spec : undefined,\n)\nconst sourceSettingsSchema = computed<SettingsModalSchema | undefined>(() =>\n  resolvedModel.value\n    ? controlsToSettingsSchema(resolvedModel.value.controls, resolvedModel.value.controlOptions)\n    : props.spec as SettingsModalSchema | undefined,\n)\nconst currentAccessUser = computed<PermissionUser | null>(() => {\n  if (props.userType) {\n    return { role: props.userType === 'admin' ? 'admin' : 'user' }\n  }\n  return auth.userInfo ?? platformUser.value ?? (implicitPlatformAdmin.value ? { role: 'admin' } : null)\n})\nconst isAccessUserAuthenticated = computed(() =>\n  props.userType !== undefined || auth.isAuthenticated || !!platformUser.value || implicitPlatformAdmin.value,\n)\nconst settingsSchema = computed<SettingsModalSchema | undefined>(() => {\n  if (!sourceSettingsSchema.value) return undefined\n  return filterSettingsSchemaByAccess(sourceSettingsSchema.value, canShowForCurrentUser)\n})\nconst isSchemaDriven = computed(() => !!settingsSchema.value)\nconst resolvedValues = computed<Record<string, unknown>>(() => ({\n  ...(resolvedModel.value?.controlOptions.initialValues ?? {}),\n  ...(props.values ?? {}),\n}))\n\n// Schema-driven mode keeps one form-builder instance and syncs schema changes\n// into it, so callers can swap groups/fields without remounting the modal.\nconst builder = useFormBuilder(\n  settingsSchema.value ? buildFlatSettingsSchema(settingsSchema.value) : { sections: [] },\n  resolvedValues.value,\n  resolvedModel.value?.controlOptions.enhancements,\n)\n\nwatch(\n  () => settingsSchema.value,\n  (schema) => {\n    if (!schema) {\n      builder.updateSchema({ sections: [] }, {})\n      return\n    }\n\n    const flatSchema = buildFlatSettingsSchema(schema)\n    const fieldNames = formSchemaFieldNames(flatSchema)\n    const sourceValues = props.values === undefined\n      ? {\n          ...resolvedValues.value,\n          ...(builder.form.data as Record<string, unknown>),\n        }\n      : resolvedValues.value\n\n    builder.updateSchema(flatSchema, pickExistingRecordKeys(sourceValues ?? {}, fieldNames))\n  },\n  { deep: true },\n)\n\nwatch(\n  () => ({ ...resolvedValues.value }),\n  (data) => {\n    if (!settingsSchema.value) return\n    const fieldNames = builderFieldNames()\n    if (recordValuesEqualForKeys(data, builder.form.data as Record<string, unknown>, fieldNames)) return\n    builder.reset(pickRecordKeys(data, fieldNames))\n  },\n  { deep: true },\n)\n\n// Changes apply immediately; the footer confirms it once the user changed something.\nconst applied = ref(false)\n\nwatch(\n  () => ({ ...builder.form.data }),\n  (data) => {\n    // A reset to the parent's values (async load, schema swap) is not a user change.\n    if (!recordValuesEqualForKeys(data, resolvedValues.value, builderFieldNames())) applied.value = true\n    if (settingsSchema.value) {\n      emit('update:values', {\n        ...resolvedValues.value,\n        ...data,\n      })\n    }\n  },\n  { deep: true },\n)\n\n// Schema groups whose `condition` evaluates false against the current data are\n// dropped from the rail entirely — same semantics as section visibility in\n// FormBuilder. Manual `tabs` have no condition mechanism, so they pass through.\nconst visibleSchemaGroups = computed(() =>\n  settingsSchema.value\n    ? settingsSchema.value.groups.filter((g) => builder.isSectionVisible(g.id))\n    : [],\n)\n\nconst manualTabs = computed<SettingsTab[]>(() =>\n  normalizeVisibleSettingsTabs(props.tabs, canShowForCurrentUser)\n)\n\nconst allTabs = computed<SettingsTab[]>(() => {\n  const base: SettingsTab[] = settingsSchema.value\n    ? visibleSchemaGroups.value.map(settingsGroupToTab)\n    : manualTabs.value\n  return buildSettingsTabs(base, props.showAppearance, props.appearanceFirst)\n})\n\nconst activeTab = ref(allTabs.value[0]?.id || APPEARANCE_TAB_ID)\n\n/** Above this many plugin groups the default layout switches from one stacked page to the rail. */\nconst STACKED_GROUP_LIMIT = 3\n\n// BaseModal owns the tab chrome: 'vertical' keeps its public name and maps to\n// the shell rail; horizontal maps to the shell strip (plain when single-tab).\nconst baseLayout = computed<ModalLayout>(() => {\n  if (props.layout === 'vertical') return 'rail'\n  if (props.layout === 'horizontal') return allTabs.value.length > 1 ? 'tabs' : 'plain'\n  const pluginTabCount = settingsSchema.value ? visibleSchemaGroups.value.length : manualTabs.value.length\n  return pluginTabCount > STACKED_GROUP_LIMIT ? 'rail' : 'plain'\n})\nconst isRail = computed(() => baseLayout.value === 'rail')\nconst isStacked = computed(() => baseLayout.value === 'plain')\n\nconst query = ref('')\nconst searchTerm = computed(() => query.value.trim().toLowerCase())\nconst isSearching = computed(() => isSchemaDriven.value && searchTerm.value !== '')\n\nconst modalTabs = computed<ModalTab[]>(() =>\n  allTabs.value.map((tab) => {\n    const group = visibleSchemaGroups.value.find((g) => g.id === tab.id)\n    const modified = group ? modifiedCount(group) : 0\n    return {\n      id: tab.id,\n      label: tab.label,\n      icon: tab.icon,\n      description: tab.description,\n      meta: group ? (modified ? String(modified) : undefined) : tab.meta,\n      // Sections only split plugin groups from Appearance; without it there is nothing to split.\n      section: props.showAppearance ? (tab.id === APPEARANCE_TAB_ID ? 'Personal' : tab.section ?? 'Plugin') : undefined,\n    }\n  }),\n)\n\nfunction selectTab(id: string) {\n  activeTab.value = id\n  query.value = ''\n}\n\nfunction handleSearchKeydown(event: KeyboardEvent) {\n  // First Escape clears the search; the next one closes the modal.\n  if (event.key === 'Escape' && query.value) {\n    event.stopPropagation()\n    query.value = ''\n  }\n}\n\n// If the active tab vanishes (group hidden by condition), drop back to the first available.\nwatch(allTabs, (tabs) => {\n  if (!tabs.some((t) => t.id === activeTab.value)) {\n    activeTab.value = tabs[0]?.id ?? APPEARANCE_TAB_ID\n  }\n})\n\nconst activeGroup = computed(() =>\n  visibleSchemaGroups.value.find((g) => g.id === activeTab.value),\n)\n\nfunction visibleFields(group: SettingsGroup): FormFieldSchema[] {\n  return group.fields.filter((f) => builder.isFieldVisible(f.name))\n}\n\n/**\n * Modified = differs from the field's own `defaultValue`. A field without one, or with a `null`\n * default (a secret, or an optional setting), never is: restoring `null` would clear a stored value.\n */\nfunction isModified(field: FormFieldSchema): boolean {\n  return field.defaultValue != null\n    && !valuesEqual((builder.form.data as Record<string, unknown>)[field.name], field.defaultValue)\n}\n\nfunction modifiedCount(group: SettingsGroup): number {\n  return visibleFields(group).filter(isModified).length\n}\n\nfunction resetField(field: FormFieldSchema) {\n  builder.form.setFieldValue(field.name, field.defaultValue)\n}\n\nfunction restoreGroup(group: SettingsGroup | undefined) {\n  if (group) visibleFields(group).filter(isModified).forEach(resetField)\n}\n\nfunction isBooleanField(field: FormFieldSchema): boolean {\n  return field.type === 'checkbox' || field.type === 'toggle'\n}\n\n/** Booleans are always toggles inside settings rows; their hint is printed under the row, not in a tooltip. */\nfunction settingsField(field: FormFieldSchema): FormFieldSchema {\n  return isBooleanField(field) ? { ...field, type: 'toggle', hint: undefined } : field\n}\n\ninterface SettingsRow {\n  field: FormFieldSchema\n  group: SettingsGroup\n}\n\nconst searchResults = computed<SettingsRow[]>(() => {\n  if (!isSearching.value) return []\n  return visibleSchemaGroups.value.flatMap((group) =>\n    visibleFields(group)\n      .filter((field) => [field.label, field.hint, group.label].join(' ').toLowerCase().includes(searchTerm.value))\n      .map((field) => ({ field, group })),\n  )\n})\n\nconst resultCount = computed(() =>\n  `${searchResults.value.length} result${searchResults.value.length === 1 ? '' : 's'}`,\n)\n\n/** What the pane renders: one list of search hits, every group (stacked) or the active group. */\nconst paneSections = computed<{ key: string; group?: SettingsGroup; rows: SettingsRow[] }[]>(() => {\n  if (isSearching.value) {\n    return searchResults.value.length ? [{ key: 'search', rows: searchResults.value }] : []\n  }\n  const groups = isStacked.value\n    ? visibleSchemaGroups.value\n    : activeGroup.value ? [activeGroup.value] : []\n  return groups.map((group) => ({\n    key: group.id,\n    group,\n    rows: visibleFields(group).map((field) => ({ field, group })),\n  }))\n})\n\nconst themeOptions: { value: ThemeMode; label: string; halves: ('light' | 'dark')[] }[] = [\n  { value: 'light', label: 'Light', halves: ['light'] },\n  { value: 'dark', label: 'Dark', halves: ['dark'] },\n  { value: 'system', label: 'System', halves: ['light', 'dark'] },\n]\n\n/** Accent tokens a palette swatch shows; `data-palette` on the strip resolves them per palette. */\nconst paletteSwatchTokens = ['--color-primary', '--color-primary-hover', '--color-primary-soft', '--color-primary-border']\n\nconst densityPreviewRows = [\n  ['S-0012', '2.41', '12.5'],\n  ['S-0013', '7.90', '3.25'],\n  ['S-0014', '10.60', '0.80'],\n]\n\nconst densityOptions: { value: TableDensity; label: string }[] = [\n  { value: 'compact', label: 'Compact' },\n  { value: 'normal', label: 'Normal' },\n  { value: 'comfortable', label: 'Comfortable' },\n]\n\nwatch(\n  () => [settings.theme, settings.colorPalette, settings.tableDensity],\n  () => { applied.value = true },\n)\n\nfunction handleClose() {\n  emit('update:open', false)\n  emit('close')\n}\n\nfunction builderFieldNames(): string[] {\n  return builder.fields.map(field => field.name)\n}\n\nfunction canShowForCurrentUser(item: AccessControlled): boolean {\n  return canAccessByPolicy(\n    currentAccessUser.value,\n    item.access,\n    isAccessUserAuthenticated.value,\n  )\n}\n</script>\n\n<template>\n  <BaseModal\n    :open=\"open\"\n    :title=\"title\"\n    :size=\"size\"\n    :layout=\"baseLayout\"\n    :tabs=\"modalTabs\"\n    :active-tab=\"isSearching ? '' : activeTab\"\n    @update:active-tab=\"selectTab\"\n    @update:open=\"emit('update:open', $event)\"\n    @close=\"handleClose\"\n  >\n    <template #header>\n      <div class=\"mint-settings-modal__header\">\n        <h3 class=\"mint-modal__title\">{{ title }}</h3>\n        <div v-if=\"isSchemaDriven\" class=\"mint-settings-modal__search\">\n          <svg class=\"mint-settings-modal__search-icon\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" aria-hidden=\"true\">\n            <circle cx=\"7\" cy=\"7\" r=\"4.5\" /><path d=\"M10.5 10.5L14 14\" />\n          </svg>\n          <BaseInput\n            :model-value=\"query\"\n            type=\"search\"\n            size=\"sm\"\n            placeholder=\"Search settings\"\n            aria-label=\"Search settings\"\n            @update:model-value=\"query = String($event ?? '')\"\n            @keydown=\"handleSearchKeydown\"\n          />\n        </div>\n      </div>\n    </template>\n\n    <template v-if=\"isRail && isSchemaDriven\" #pane-header=\"{ tab }\">\n      <SettingsPaneHeadInternal v-if=\"isSearching\" title=\"Search results\" :count=\"resultCount\" />\n      <SettingsPaneHeadInternal\n        v-else\n        :title=\"tab?.label ?? ''\"\n        :description=\"tab?.description\"\n        :modified-count=\"activeGroup ? modifiedCount(activeGroup) : undefined\"\n        @restore=\"restoreGroup(activeGroup)\"\n      />\n    </template>\n\n    <!-- Body: the active pane only — tab strip / rail / footer are BaseModal's shell. -->\n    <div :class=\"['mint-settings-modal', { 'mint-settings-modal--schema': isSchemaDriven }]\">\n      <template v-if=\"isSchemaDriven\">\n        <SettingsPaneHeadInternal v-if=\"isSearching && !isRail\" title=\"Search results\" :count=\"resultCount\" />\n        <section v-for=\"section in paneSections\" :key=\"section.key\" class=\"mint-settings-modal__group\">\n          <SettingsPaneHeadInternal\n            v-if=\"section.group && !isRail\"\n            :title=\"section.group.label\"\n            :description=\"section.group.description\"\n            :modified-count=\"modifiedCount(section.group)\"\n            @restore=\"restoreGroup(section.group)\"\n          />\n          <div\n            class=\"mint-settings-modal__group-grid\"\n            :style=\"{ '--mint-settings-cols': section.group?.columns ?? 1 }\"\n          >\n            <div\n              v-for=\"row in section.rows\"\n              :key=\"row.field.name\"\n              :class=\"['mint-settings-modal__row', { 'mint-settings-modal__row--modified': isModified(row.field) }]\"\n              :style=\"row.field.colSpan ? { gridColumn: `span ${row.field.colSpan}` } : undefined\"\n            >\n              <span v-if=\"!section.group\" class=\"mint-settings-modal__row-group\">{{ row.group.label }}</span>\n              <div class=\"mint-settings-modal__row-field\">\n                <slot\n                  :name=\"`field:${row.field.name}`\"\n                  :field=\"row.field\"\n                  :form=\"builder.form\"\n                  :field-props=\"builder.form.getFieldProps(row.field.name)\"\n                >\n                  <FormFieldRendererInternal\n                    :field=\"settingsField(row.field)\"\n                    :resolved-props=\"builder.getResolvedFieldProps(settingsField(row.field))\"\n                    :form=\"builder.form\"\n                  />\n                </slot>\n                <p v-if=\"isBooleanField(row.field) && row.field.hint\" class=\"mint-settings-modal__row-hint\">\n                  {{ row.field.hint }}\n                </p>\n                <button\n                  v-if=\"isModified(row.field)\"\n                  type=\"button\"\n                  class=\"mint-settings-modal__reset\"\n                  title=\"Restore default\"\n                  :aria-label=\"`Restore default for ${row.field.label}`\"\n                  @click=\"resetField(row.field)\"\n                >\n                  <svg viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.6\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                    <path d=\"M3 8a5 5 0 1 0 1.5-3.5M3 3v2.5h2.5\" />\n                  </svg>\n                </button>\n              </div>\n            </div>\n          </div>\n        </section>\n        <p v-if=\"isSearching && searchResults.length === 0\" class=\"mint-settings-modal__empty\">\n          No settings match \"{{ query.trim() }}\"\n        </p>\n      </template>\n\n      <template v-else>\n        <section\n          v-for=\"tab in manualTabs\"\n          v-show=\"isStacked || activeTab === tab.id\"\n          :key=\"tab.id\"\n          class=\"mint-settings-modal__group\"\n        >\n          <SettingsPaneHeadInternal v-if=\"isStacked\" :title=\"tab.label\" :description=\"tab.description\" />\n          <slot :name=\"`tab-${tab.id}`\" />\n        </section>\n      </template>\n\n      <section\n        v-if=\"showAppearance\"\n        v-show=\"!isSearching && (isStacked || activeTab === APPEARANCE_TAB_ID)\"\n        class=\"mint-settings-modal__group mint-settings-modal__appearance\"\n      >\n        <SettingsPaneHeadInternal\n          v-if=\"isStacked\"\n          :title=\"APPEARANCE_TAB.label\"\n          :description=\"APPEARANCE_TAB.description\"\n        />\n\n        <div class=\"mint-settings-modal__setting\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Theme</span>\n            <span class=\"mint-settings-modal__setting-hint\">Applies to this browser only</span>\n          </div>\n          <div class=\"mint-settings-modal__themes\">\n            <button\n              v-for=\"opt in themeOptions\"\n              :key=\"opt.value\"\n              type=\"button\"\n              :aria-pressed=\"settings.theme === opt.value\"\n              :class=\"['mint-settings-modal__theme', { 'mint-settings-modal__theme--active': settings.theme === opt.value }]\"\n              @click=\"settings.theme = opt.value\"\n            >\n              <span class=\"mint-settings-modal__theme-preview\" aria-hidden=\"true\">\n                <span\n                  v-for=\"half in opt.halves\"\n                  :key=\"half\"\n                  :class=\"['mint-settings-modal__theme-half', `mint-settings-modal__theme-half--${half}`]\"\n                >\n                  <span class=\"mint-settings-modal__theme-line\" />\n                  <span class=\"mint-settings-modal__theme-card\" />\n                </span>\n              </span>\n              <span class=\"mint-settings-modal__theme-label\">\n                <span class=\"mint-settings-modal__theme-radio\" aria-hidden=\"true\" />\n                {{ opt.label }}\n              </span>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"mint-settings-modal__setting\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Color palette</span>\n            <span class=\"mint-settings-modal__setting-hint\">Accent colour across the interface</span>\n          </div>\n          <div class=\"mint-settings-modal__palettes\">\n            <button\n              v-for=\"(palette, key) in colorPalettes\"\n              :key=\"key\"\n              type=\"button\"\n              :aria-pressed=\"settings.colorPalette === key\"\n              :class=\"['mint-settings-modal__palette', { 'mint-settings-modal__palette--active': settings.colorPalette === key }]\"\n              @click=\"settings.colorPalette = key as ColorPalette\"\n            >\n              <span class=\"mint-settings-modal__swatches\" :data-palette=\"key\" aria-hidden=\"true\">\n                <span\n                  v-for=\"token in paletteSwatchTokens\"\n                  :key=\"token\"\n                  class=\"mint-settings-modal__swatch\"\n                  :style=\"{ backgroundColor: `var(${token})` }\"\n                />\n              </span>\n              <span class=\"mint-settings-modal__palette-name\">{{ palette.name }}</span>\n              <svg class=\"mint-settings-modal__palette-check\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n                <path d=\"M3.5 8.5l3 3 6-7\" />\n              </svg>\n            </button>\n          </div>\n        </div>\n\n        <div class=\"mint-settings-modal__setting mint-settings-modal__setting--inline\">\n          <div class=\"mint-settings-modal__setting-text\">\n            <span class=\"mint-settings-modal__setting-label\">Density</span>\n            <span class=\"mint-settings-modal__setting-hint\">Adjusts control and table row height</span>\n          </div>\n          <SegmentedControl\n            :model-value=\"settings.tableDensity\"\n            :options=\"densityOptions\"\n            size=\"sm\"\n            @update:model-value=\"settings.tableDensity = $event as TableDensity\"\n          />\n          <div\n            :class=\"['mint-settings-modal__density-preview', `mint-settings-modal__density-preview--${settings.tableDensity}`]\"\n            aria-hidden=\"true\"\n          >\n            <div class=\"mint-settings-modal__density-row mint-settings-modal__density-row--head\">\n              <span>Sample</span><span>RT</span><span>IC50</span>\n            </div>\n            <div v-for=\"cells in densityPreviewRows\" :key=\"cells[0]\" class=\"mint-settings-modal__density-row\">\n              <span>{{ cells[0] }}</span><span>{{ cells[1] }}</span><span>{{ cells[2] }}</span>\n            </div>\n          </div>\n        </div>\n\n        <slot name=\"appearance\" />\n      </section>\n    </div>\n\n    <template #footer>\n      <slot\n        name=\"footer\"\n        :values=\"builder.form.data\"\n        :close=\"handleClose\"\n      >\n        <span class=\"mint-settings-modal__status\" role=\"status\">\n          <svg v-if=\"applied\" class=\"mint-settings-modal__status-icon\" viewBox=\"0 0 16 16\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\">\n            <path d=\"M3.5 8.5l3 3 6-7\" />\n          </svg>\n          {{ applied ? 'Applied · changes take effect immediately' : 'Changes take effect immediately' }}\n        </span>\n        <BaseButton class=\"mint-settings-modal__done\" variant=\"primary\" @click=\"handleClose\">Done</BaseButton>\n      </slot>\n    </template>\n  </BaseModal>\n</template>\n"],"mappings":"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"}

package/dist/{data-CfY7o8QC.js → data-CgIcnf9D.js}

@@ -9,7 +9,7 @@ import { i as JobsStatusTray_default, r as useRealtime } from "./useRealtime-jOe
 import { r as useExperimentSelector, t as ExperimentSelectorModal_default } from "./ExperimentSelectorModal-CUkKmgfr.js";
 import { t as experimentStatus_exports } from "./experimentStatus-DCn2QKG7.js";
 import { t as ANALYSIS_FILE_ARTIFACT_SCHEMA } from "./analysisArtifactTypes-Cy3D0Ipg.js";
-import { t as ExperimentPopover_default } from "./ExperimentPopover-Bbd6RaoH.js";
+import { t as ExperimentPopover_default } from "./ExperimentPopover-DyjoXwry.js";
 import { a as readTableFileAsCsv, c as useExperimentData, d as unwrapExperimentDesignData, i as readFileAsText, l as extractSampleNamesFromDesignData, n as detectDelimiter, o as useFileImport, r as parseDelimitedText, s as validateImportFile, t as useExperimentSamples, u as extractSampleOptionsFromDesignData } from "./useExperimentSamples-DEDAKa2E.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, getCurrentInstance, getCurrentScope, h, isRef, nextTick, normalizeClass, normalizeStyle, onBeforeUnmount, onScopeDispose, openBlock, readonly, ref, renderList, renderSlot, resolveDynamicComponent, shallowRef, toDisplayString, toRaw, toValue, unref, useTemplateRef, watch, withCtx, withModifiers } from "vue";
 import { CircleCheck, CircleDashed, CircleMinus, CircleX, CloudUpload, File, Loader, RefreshCw, TriangleAlert, X } from "lucide-vue-next";
@@ -3863,4 +3863,4 @@ var data_exports = /* @__PURE__ */ __exportAll({
 //#endregion
 export { ArtifactSaveDialog_default as _, usePlatformFilePickerAdapter as a, encodePlatformPickerPath as c, StaleFormBanner_default as d, VersionConflictDialog_default as f, ExperimentCodeBadge_default as g, FilePicker_default as h, useFileBrowser as i, fieldNameLabel as l, AuditTrail_default as m, buildAnalysisArtifactTargetQuery as n, createFilePickerAdapter as o, BatchProgressList_default as p, parseAnalysisArtifactTarget as r, decodePlatformPickerPath as s, data_exports as t, useVersionedSave as u, ArtifactSelectorModal_default as v, useArtifacts as y };
 
-//# sourceMappingURL=data-CfY7o8QC.js.map
+//# sourceMappingURL=data-CgIcnf9D.js.map