@morscherlab/mint-sdk 1.4.0-beta.11 → 1.4.0-beta.13

package/dist/{SegmentedControl-BtnnjWzs.js.map → SegmentedControl-BkwYOKpG.js.map}

@@ -1 +1 @@
-{"version":3,"file":"SegmentedControl-BtnnjWzs.js","names":[],"sources":["../src/components/SegmentedControl.vue","../src/components/SegmentedControl.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** Renders a segmented button group for single-option selection, defaulting to the card variant. */\nimport { computed, type ComponentPublicInstance } from 'vue'\nimport type { OptionPrimitive, SelectOption, SelectOptionInput, SegmentedControlVariant, SegmentedControlSize } from '../types'\nimport { normalizeOptionInput } from '../utils/options'\nimport { useRovingFocus } from '../composables/useRovingFocus'\n\ninterface Props {\n  modelValue: string | number\n  options: SelectOptionInput[]\n  variant?: SegmentedControlVariant\n  size?: SegmentedControlSize\n  fullWidth?: boolean\n  disabled?: boolean\n  disabledValues?: Array<string | number>\n}\n\ntype SegmentedOption = SelectOption<OptionPrimitive>\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'card',\n  size: 'md',\n  fullWidth: false,\n  disabled: false,\n  disabledValues: () => [],\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | number]\n}>()\n\nconst normalizedOptions = computed<SegmentedOption[]>(() => props.options.map(normalizeOptionInput<OptionPrimitive, SegmentedOption>))\nconst disabledValueSet = computed(() => new Set(props.disabledValues))\n\nfunction isOptionDisabled(option: SegmentedOption) {\n  return option.disabled === true || disabledValueSet.value.has(option.value)\n}\n\nfunction isSelectionDisabled(option: SegmentedOption) {\n  return props.disabled || isOptionDisabled(option)\n}\n\nfunction handleSelect(option: SegmentedOption) {\n  if (isSelectionDisabled(option)) return\n  emit('update:modelValue', option.value)\n}\n\n// Roving tabindex over the radio group: only the checked option is tabbable and\n// Left/Right (plus Home/End) move between the selectable options, matching BaseTabs.\nconst optionRefs = new Map<string, HTMLElement>()\n\nfunction optionId(option: SegmentedOption): string {\n  return String(option.value)\n}\n\nfunction setOptionRef(id: string, el: Element | ComponentPublicInstance | null) {\n  if (el instanceof HTMLElement) {\n    optionRefs.set(id, el)\n  } else {\n    optionRefs.delete(id)\n  }\n}\n\nconst selectableOptions = computed(() =>\n  normalizedOptions.value.filter(option => !isSelectionDisabled(option)),\n)\n\n/** The one option carrying `tabindex=\"0\"`: the checked one, else the first selectable. */\nconst tabbableId = computed(() => {\n  const checked = selectableOptions.value.find(option => option.value === props.modelValue)\n  const target = checked ?? selectableOptions.value[0]\n  return target ? optionId(target) : ''\n})\n\nfunction isTabbable(option: SegmentedOption): boolean {\n  return optionId(option) === tabbableId.value\n}\n\nconst { handleKeydown: handleArrowKeydown } = useRovingFocus({\n  ids: () => selectableOptions.value.map(optionId),\n  activeId: () => tabbableId.value,\n  activate: (id) => {\n    const option = selectableOptions.value.find(candidate => optionId(candidate) === id)\n    if (option) handleSelect(option)\n  },\n  getElement: (id) => optionRefs.get(id),\n  orientation: 'horizontal',\n})\n\nfunction handleKeydown(event: KeyboardEvent, option: SegmentedOption) {\n  if (event.key === 'Enter' || event.key === ' ') {\n    event.preventDefault()\n    handleSelect(option)\n    return\n  }\n  handleArrowKeydown(event)\n}\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'mint-segmented-control',\n      `mint-segmented-control--${variant}`,\n      `mint-segmented-control--${size}`,\n      fullWidth ? 'mint-segmented-control--full-width' : '',\n      disabled ? 'mint-segmented-control--disabled' : '',\n    ]\"\n    role=\"radiogroup\"\n  >\n    <button\n      v-for=\"option in normalizedOptions\"\n      :key=\"String(option.value)\"\n      :ref=\"(el) => setOptionRef(String(option.value), el)\"\n      type=\"button\"\n      role=\"radio\"\n      :aria-checked=\"modelValue === option.value\"\n      :tabindex=\"isTabbable(option) ? 0 : -1\"\n      :disabled=\"isSelectionDisabled(option)\"\n      :class=\"[\n        'mint-segmented-control__option',\n        `mint-segmented-control__option--${variant}`,\n        `mint-segmented-control__option--${size}`,\n        modelValue === option.value ? 'mint-segmented-control__option--active' : '',\n        isOptionDisabled(option) ? 'mint-segmented-control__option--disabled' : '',\n      ]\"\n      @click=\"handleSelect(option)\"\n      @keydown=\"handleKeydown($event, option)\"\n    >\n      <span class=\"mint-segmented-control__label\"><span\n        v-if=\"option.color\"\n        class=\"mint-segmented-control__swatch\"\n        :style=\"{ background: option.color }\"\n        aria-hidden=\"true\"\n      />{{ option.label }}</span>\n      <span\n        v-if=\"option.description && variant === 'card'\"\n        class=\"mint-segmented-control__description\"\n      >\n        {{ option.description }}\n      </span>\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\n/** Renders a segmented button group for single-option selection, defaulting to the card variant. */\nimport { computed, type ComponentPublicInstance } from 'vue'\nimport type { OptionPrimitive, SelectOption, SelectOptionInput, SegmentedControlVariant, SegmentedControlSize } from '../types'\nimport { normalizeOptionInput } from '../utils/options'\nimport { useRovingFocus } from '../composables/useRovingFocus'\n\ninterface Props {\n  modelValue: string | number\n  options: SelectOptionInput[]\n  variant?: SegmentedControlVariant\n  size?: SegmentedControlSize\n  fullWidth?: boolean\n  disabled?: boolean\n  disabledValues?: Array<string | number>\n}\n\ntype SegmentedOption = SelectOption<OptionPrimitive>\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'card',\n  size: 'md',\n  fullWidth: false,\n  disabled: false,\n  disabledValues: () => [],\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | number]\n}>()\n\nconst normalizedOptions = computed<SegmentedOption[]>(() => props.options.map(normalizeOptionInput<OptionPrimitive, SegmentedOption>))\nconst disabledValueSet = computed(() => new Set(props.disabledValues))\n\nfunction isOptionDisabled(option: SegmentedOption) {\n  return option.disabled === true || disabledValueSet.value.has(option.value)\n}\n\nfunction isSelectionDisabled(option: SegmentedOption) {\n  return props.disabled || isOptionDisabled(option)\n}\n\nfunction handleSelect(option: SegmentedOption) {\n  if (isSelectionDisabled(option)) return\n  emit('update:modelValue', option.value)\n}\n\n// Roving tabindex over the radio group: only the checked option is tabbable and\n// Left/Right (plus Home/End) move between the selectable options, matching BaseTabs.\nconst optionRefs = new Map<string, HTMLElement>()\n\nfunction optionId(option: SegmentedOption): string {\n  return String(option.value)\n}\n\nfunction setOptionRef(id: string, el: Element | ComponentPublicInstance | null) {\n  if (el instanceof HTMLElement) {\n    optionRefs.set(id, el)\n  } else {\n    optionRefs.delete(id)\n  }\n}\n\nconst selectableOptions = computed(() =>\n  normalizedOptions.value.filter(option => !isSelectionDisabled(option)),\n)\n\n/** The one option carrying `tabindex=\"0\"`: the checked one, else the first selectable. */\nconst tabbableId = computed(() => {\n  const checked = selectableOptions.value.find(option => option.value === props.modelValue)\n  const target = checked ?? selectableOptions.value[0]\n  return target ? optionId(target) : ''\n})\n\nfunction isTabbable(option: SegmentedOption): boolean {\n  return optionId(option) === tabbableId.value\n}\n\nconst { handleKeydown: handleArrowKeydown } = useRovingFocus({\n  ids: () => selectableOptions.value.map(optionId),\n  activeId: () => tabbableId.value,\n  activate: (id) => {\n    const option = selectableOptions.value.find(candidate => optionId(candidate) === id)\n    if (option) handleSelect(option)\n  },\n  getElement: (id) => optionRefs.get(id),\n  orientation: 'horizontal',\n})\n\nfunction handleKeydown(event: KeyboardEvent, option: SegmentedOption) {\n  if (event.key === 'Enter' || event.key === ' ') {\n    event.preventDefault()\n    handleSelect(option)\n    return\n  }\n  handleArrowKeydown(event)\n}\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'mint-segmented-control',\n      `mint-segmented-control--${variant}`,\n      `mint-segmented-control--${size}`,\n      fullWidth ? 'mint-segmented-control--full-width' : '',\n      disabled ? 'mint-segmented-control--disabled' : '',\n    ]\"\n    role=\"radiogroup\"\n  >\n    <button\n      v-for=\"option in normalizedOptions\"\n      :key=\"String(option.value)\"\n      :ref=\"(el) => setOptionRef(String(option.value), el)\"\n      type=\"button\"\n      role=\"radio\"\n      :aria-checked=\"modelValue === option.value\"\n      :tabindex=\"isTabbable(option) ? 0 : -1\"\n      :disabled=\"isSelectionDisabled(option)\"\n      :class=\"[\n        'mint-segmented-control__option',\n        `mint-segmented-control__option--${variant}`,\n        `mint-segmented-control__option--${size}`,\n        modelValue === option.value ? 'mint-segmented-control__option--active' : '',\n        isOptionDisabled(option) ? 'mint-segmented-control__option--disabled' : '',\n      ]\"\n      @click=\"handleSelect(option)\"\n      @keydown=\"handleKeydown($event, option)\"\n    >\n      <span class=\"mint-segmented-control__label\"><span\n        v-if=\"option.color\"\n        class=\"mint-segmented-control__swatch\"\n        :style=\"{ background: option.color }\"\n        aria-hidden=\"true\"\n      />{{ option.label }}</span>\n      <span\n        v-if=\"option.description && variant === 'card'\"\n        class=\"mint-segmented-control__description\"\n      >\n        {{ option.description }}\n      </span>\n    </button>\n  </div>\n</template>\n"],"mappings":"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"}
+{"version":3,"file":"SegmentedControl-BkwYOKpG.js","names":[],"sources":["../src/components/SegmentedControl.vue","../src/components/SegmentedControl.vue"],"sourcesContent":["<script setup lang=\"ts\">\n/** Renders a segmented button group for single-option selection, defaulting to the card variant. */\nimport { computed, type ComponentPublicInstance } from 'vue'\nimport type { OptionPrimitive, SelectOption, SelectOptionInput, SegmentedControlVariant, SegmentedControlSize } from '../types'\nimport { normalizeOptionInput } from '../utils/options'\nimport { useRovingFocus } from '../composables/useRovingFocus'\n\ninterface Props {\n  modelValue: string | number\n  options: SelectOptionInput[]\n  variant?: SegmentedControlVariant\n  size?: SegmentedControlSize\n  fullWidth?: boolean\n  disabled?: boolean\n  disabledValues?: Array<string | number>\n}\n\ntype SegmentedOption = SelectOption<OptionPrimitive>\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'card',\n  size: 'md',\n  fullWidth: false,\n  disabled: false,\n  disabledValues: () => [],\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | number]\n}>()\n\nconst normalizedOptions = computed<SegmentedOption[]>(() => props.options.map(normalizeOptionInput<OptionPrimitive, SegmentedOption>))\nconst disabledValueSet = computed(() => new Set(props.disabledValues))\n\nfunction isOptionDisabled(option: SegmentedOption) {\n  return option.disabled === true || disabledValueSet.value.has(option.value)\n}\n\nfunction isSelectionDisabled(option: SegmentedOption) {\n  return props.disabled || isOptionDisabled(option)\n}\n\nfunction handleSelect(option: SegmentedOption) {\n  if (isSelectionDisabled(option)) return\n  emit('update:modelValue', option.value)\n}\n\n// Roving tabindex over the radio group: only the checked option is tabbable and\n// Left/Right (plus Home/End) move between the selectable options, matching BaseTabs.\nconst optionRefs = new Map<string, HTMLElement>()\n\nfunction optionId(option: SegmentedOption): string {\n  return String(option.value)\n}\n\nfunction setOptionRef(id: string, el: Element | ComponentPublicInstance | null) {\n  if (el instanceof HTMLElement) {\n    optionRefs.set(id, el)\n  } else {\n    optionRefs.delete(id)\n  }\n}\n\nconst selectableOptions = computed(() =>\n  normalizedOptions.value.filter(option => !isSelectionDisabled(option)),\n)\n\n/** The one option carrying `tabindex=\"0\"`: the checked one, else the first selectable. */\nconst tabbableId = computed(() => {\n  const checked = selectableOptions.value.find(option => option.value === props.modelValue)\n  const target = checked ?? selectableOptions.value[0]\n  return target ? optionId(target) : ''\n})\n\nfunction isTabbable(option: SegmentedOption): boolean {\n  return optionId(option) === tabbableId.value\n}\n\nconst { handleKeydown: handleArrowKeydown } = useRovingFocus({\n  ids: () => selectableOptions.value.map(optionId),\n  activeId: () => tabbableId.value,\n  activate: (id) => {\n    const option = selectableOptions.value.find(candidate => optionId(candidate) === id)\n    if (option) handleSelect(option)\n  },\n  getElement: (id) => optionRefs.get(id),\n  orientation: 'horizontal',\n})\n\nfunction handleKeydown(event: KeyboardEvent, option: SegmentedOption) {\n  if (event.key === 'Enter' || event.key === ' ') {\n    event.preventDefault()\n    handleSelect(option)\n    return\n  }\n  handleArrowKeydown(event)\n}\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'mint-segmented-control',\n      `mint-segmented-control--${variant}`,\n      `mint-segmented-control--${size}`,\n      fullWidth ? 'mint-segmented-control--full-width' : '',\n      disabled ? 'mint-segmented-control--disabled' : '',\n    ]\"\n    role=\"radiogroup\"\n  >\n    <button\n      v-for=\"option in normalizedOptions\"\n      :key=\"String(option.value)\"\n      :ref=\"(el) => setOptionRef(String(option.value), el)\"\n      type=\"button\"\n      role=\"radio\"\n      :aria-checked=\"modelValue === option.value\"\n      :tabindex=\"isTabbable(option) ? 0 : -1\"\n      :disabled=\"isSelectionDisabled(option)\"\n      :class=\"[\n        'mint-segmented-control__option',\n        `mint-segmented-control__option--${variant}`,\n        `mint-segmented-control__option--${size}`,\n        modelValue === option.value ? 'mint-segmented-control__option--active' : '',\n        isOptionDisabled(option) ? 'mint-segmented-control__option--disabled' : '',\n      ]\"\n      @click=\"handleSelect(option)\"\n      @keydown=\"handleKeydown($event, option)\"\n    >\n      <span class=\"mint-segmented-control__label\"><span\n        v-if=\"option.color\"\n        class=\"mint-segmented-control__swatch\"\n        :style=\"{ background: option.color }\"\n        aria-hidden=\"true\"\n      />{{ option.label }}</span>\n      <span\n        v-if=\"option.description && variant === 'card'\"\n        class=\"mint-segmented-control__description\"\n      >\n        {{ option.description }}\n      </span>\n    </button>\n  </div>\n</template>\n","<script setup lang=\"ts\">\n/** Renders a segmented button group for single-option selection, defaulting to the card variant. */\nimport { computed, type ComponentPublicInstance } from 'vue'\nimport type { OptionPrimitive, SelectOption, SelectOptionInput, SegmentedControlVariant, SegmentedControlSize } from '../types'\nimport { normalizeOptionInput } from '../utils/options'\nimport { useRovingFocus } from '../composables/useRovingFocus'\n\ninterface Props {\n  modelValue: string | number\n  options: SelectOptionInput[]\n  variant?: SegmentedControlVariant\n  size?: SegmentedControlSize\n  fullWidth?: boolean\n  disabled?: boolean\n  disabledValues?: Array<string | number>\n}\n\ntype SegmentedOption = SelectOption<OptionPrimitive>\n\nconst props = withDefaults(defineProps<Props>(), {\n  variant: 'card',\n  size: 'md',\n  fullWidth: false,\n  disabled: false,\n  disabledValues: () => [],\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [value: string | number]\n}>()\n\nconst normalizedOptions = computed<SegmentedOption[]>(() => props.options.map(normalizeOptionInput<OptionPrimitive, SegmentedOption>))\nconst disabledValueSet = computed(() => new Set(props.disabledValues))\n\nfunction isOptionDisabled(option: SegmentedOption) {\n  return option.disabled === true || disabledValueSet.value.has(option.value)\n}\n\nfunction isSelectionDisabled(option: SegmentedOption) {\n  return props.disabled || isOptionDisabled(option)\n}\n\nfunction handleSelect(option: SegmentedOption) {\n  if (isSelectionDisabled(option)) return\n  emit('update:modelValue', option.value)\n}\n\n// Roving tabindex over the radio group: only the checked option is tabbable and\n// Left/Right (plus Home/End) move between the selectable options, matching BaseTabs.\nconst optionRefs = new Map<string, HTMLElement>()\n\nfunction optionId(option: SegmentedOption): string {\n  return String(option.value)\n}\n\nfunction setOptionRef(id: string, el: Element | ComponentPublicInstance | null) {\n  if (el instanceof HTMLElement) {\n    optionRefs.set(id, el)\n  } else {\n    optionRefs.delete(id)\n  }\n}\n\nconst selectableOptions = computed(() =>\n  normalizedOptions.value.filter(option => !isSelectionDisabled(option)),\n)\n\n/** The one option carrying `tabindex=\"0\"`: the checked one, else the first selectable. */\nconst tabbableId = computed(() => {\n  const checked = selectableOptions.value.find(option => option.value === props.modelValue)\n  const target = checked ?? selectableOptions.value[0]\n  return target ? optionId(target) : ''\n})\n\nfunction isTabbable(option: SegmentedOption): boolean {\n  return optionId(option) === tabbableId.value\n}\n\nconst { handleKeydown: handleArrowKeydown } = useRovingFocus({\n  ids: () => selectableOptions.value.map(optionId),\n  activeId: () => tabbableId.value,\n  activate: (id) => {\n    const option = selectableOptions.value.find(candidate => optionId(candidate) === id)\n    if (option) handleSelect(option)\n  },\n  getElement: (id) => optionRefs.get(id),\n  orientation: 'horizontal',\n})\n\nfunction handleKeydown(event: KeyboardEvent, option: SegmentedOption) {\n  if (event.key === 'Enter' || event.key === ' ') {\n    event.preventDefault()\n    handleSelect(option)\n    return\n  }\n  handleArrowKeydown(event)\n}\n</script>\n\n<template>\n  <div\n    :class=\"[\n      'mint-segmented-control',\n      `mint-segmented-control--${variant}`,\n      `mint-segmented-control--${size}`,\n      fullWidth ? 'mint-segmented-control--full-width' : '',\n      disabled ? 'mint-segmented-control--disabled' : '',\n    ]\"\n    role=\"radiogroup\"\n  >\n    <button\n      v-for=\"option in normalizedOptions\"\n      :key=\"String(option.value)\"\n      :ref=\"(el) => setOptionRef(String(option.value), el)\"\n      type=\"button\"\n      role=\"radio\"\n      :aria-checked=\"modelValue === option.value\"\n      :tabindex=\"isTabbable(option) ? 0 : -1\"\n      :disabled=\"isSelectionDisabled(option)\"\n      :class=\"[\n        'mint-segmented-control__option',\n        `mint-segmented-control__option--${variant}`,\n        `mint-segmented-control__option--${size}`,\n        modelValue === option.value ? 'mint-segmented-control__option--active' : '',\n        isOptionDisabled(option) ? 'mint-segmented-control__option--disabled' : '',\n      ]\"\n      @click=\"handleSelect(option)\"\n      @keydown=\"handleKeydown($event, option)\"\n    >\n      <span class=\"mint-segmented-control__label\"><span\n        v-if=\"option.color\"\n        class=\"mint-segmented-control__swatch\"\n        :style=\"{ background: option.color }\"\n        aria-hidden=\"true\"\n      />{{ option.label }}</span>\n      <span\n        v-if=\"option.description && variant === 'card'\"\n        class=\"mint-segmented-control__description\"\n      >\n        {{ option.description }}\n      </span>\n    </button>\n  </div>\n</template>\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAmBA,MAAM,QAAQ;EAQd,MAAM,OAAO;EAIb,MAAM,oBAAoB,eAAkC,MAAM,QAAQ,IAAI,oBAAsD,CAAC;EACrI,MAAM,mBAAmB,eAAe,IAAI,IAAI,MAAM,cAAc,CAAC;EAErE,SAAS,iBAAiB,QAAyB;GACjD,OAAO,OAAO,aAAa,QAAQ,iBAAiB,MAAM,IAAI,OAAO,KAAK;EAC5E;EAEA,SAAS,oBAAoB,QAAyB;GACpD,OAAO,MAAM,YAAY,iBAAiB,MAAM;EAClD;EAEA,SAAS,aAAa,QAAyB;GAC7C,IAAI,oBAAoB,MAAM,GAAG;GACjC,KAAK,qBAAqB,OAAO,KAAK;EACxC;EAIA,MAAM,6BAAa,IAAI,IAAyB;EAEhD,SAAS,SAAS,QAAiC;GACjD,OAAO,OAAO,OAAO,KAAK;EAC5B;EAEA,SAAS,aAAa,IAAY,IAA8C;GAC9E,IAAI,cAAc,aAChB,WAAW,IAAI,IAAI,EAAE;QAErB,WAAW,OAAO,EAAE;EAExB;EAEA,MAAM,oBAAoB,eACxB,kBAAkB,MAAM,QAAO,WAAU,CAAC,oBAAoB,MAAM,CAAC,CACvE;;EAGA,MAAM,aAAa,eAAe;GAEhC,MAAM,SADU,kBAAkB,MAAM,MAAK,WAAU,OAAO,UAAU,MAAM,UAC/D,KAAW,kBAAkB,MAAM;GAClD,OAAO,SAAS,SAAS,MAAM,IAAI;EACrC,CAAC;EAED,SAAS,WAAW,QAAkC;GACpD,OAAO,SAAS,MAAM,MAAM,WAAW;EACzC;EAEA,MAAM,EAAE,eAAe,uBAAuB,eAAe;GAC3D,WAAW,kBAAkB,MAAM,IAAI,QAAQ;GAC/C,gBAAgB,WAAW;GAC3B,WAAW,OAAO;IAChB,MAAM,SAAS,kBAAkB,MAAM,MAAK,cAAa,SAAS,SAAS,MAAM,EAAE;IACnF,IAAI,QAAQ,aAAa,MAAM;GACjC;GACA,aAAa,OAAO,WAAW,IAAI,EAAE;GACrC,aAAa;EACf,CAAC;EAED,SAAS,cAAc,OAAsB,QAAyB;GACpE,IAAI,MAAM,QAAQ,WAAW,MAAM,QAAQ,KAAK;IAC9C,MAAM,eAAe;IACrB,aAAa,MAAM;IACnB;GACF;GACA,mBAAmB,KAAK;EAC1B;;GAIE,OAAA,UAAA,GAAA,mBA0CM,OAAA;IAzCH,OAAK,eAAA;;KAAqE,2BAAA,QAAA;KAA4C,2BAAA,QAAA;KAAc,QAAA,YAAS,uCAAA;KAAoD,QAAA,WAAQ,qCAAA;;IAO1M,MAAK;GAEL,GAAA,EAAA,UAAA,IAAA,GAAA,mBA+BS,UAAA,MAAA,WA9BU,kBAAA,QAAV,WAAM;IADf,OAAA,UAAA,GAAA,mBA+BS,UAAA;KA7BN,KAAK,OAAO,OAAO,KAAK;;KACxB,MAAM,OAAO,aAAa,OAAO,OAAO,KAAK,GAAG,EAAE;KACnD,MAAK;KACL,MAAK;KACJ,gBAAc,QAAA,eAAe,OAAO;KACpC,UAAU,WAAW,MAAM,IAAA,IAAA;KAC3B,UAAU,oBAAoB,MAAM;KACpC,OAAK,eAAA;;MAAyF,mCAAA,QAAA;MAAsD,mCAAA,QAAA;MAAgB,QAAA,eAAe,OAAO,QAAK,2CAAA;MAA0D,iBAAiB,MAAM,IAAA,6CAAA;;KAOhR,UAAK,WAAE,aAAa,MAAM;KAC1B,YAAO,WAAE,cAAc,QAAQ,MAAM;IAEtC,GAAA,CAAA,mBAK2B,QAL3B,YAK2B,CAJnB,OAAO,SAD6B,UAAA,GAAA,mBAK1C,QAAA;;KAHA,OAAM;KACL,OAAK,eAAA,EAAA,YAAgB,OAAO,MAAK,CAAA;KAClC,eAAY;IACT,GAAA,MAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,GAAA,gBAAA,gBAAA,OAAO,KAAK,GAAA,CAAA,CAAA,CAAA,GAET,OAAO,eAAe,QAAA,YAAO,UADrC,UAAA,GAAA,mBAKO,QALP,YAKO,gBADF,OAAO,WAAW,GAAA,CAAA,KAAA,mBAAA,IAAA,IAAA,CAAA,GAAA,IAAA,UAAA"}

package/dist/{SettingsModal-DO3IZ7qz.js → SettingsModal-CdhFMi8j.js}

@@ -1,11 +1,11 @@
 import { a as BaseButton_default, n as BaseModal_default, o as __exportAll } from "./useDropdownState-8yWMu-7_.js";
-import { c as colorPalettes, f as useSettingsStore } from "./experiment-43OJtH7R.js";
-import { G as BaseInput_default } from "./records-B6gpM_3e.js";
-import { o as usePlatform } from "./useListReorder-BitdUhxn.js";
-import { t as SegmentedControl_default } from "./SegmentedControl-BtnnjWzs.js";
-import { a as pickExistingRecordKeys, c as valuesEqual, h as normalizeItemInput, i as formSchemaFieldNames, k as controlsToSettingsSchema, l as useFormBuilder, o as pickRecordKeys, r as FormFieldRendererInternal_default, s as recordValuesEqualForKeys } from "./AppSidebar-mvm--GxN.js";
+import { s as colorPalettes, u as useSettingsStore } from "./experiment-DyO54FQB.js";
+import { G as BaseInput_default } from "./records-DnK_1Q_S.js";
+import { o as usePlatform } from "./useListReorder-DPynGrCj.js";
+import { t as SegmentedControl_default } from "./SegmentedControl-BkwYOKpG.js";
+import { a as pickExistingRecordKeys, c as valuesEqual, h as normalizeItemInput, i as formSchemaFieldNames, k as controlsToSettingsSchema, l as useFormBuilder, o as pickRecordKeys, r as FormFieldRendererInternal_default, s as recordValuesEqualForKeys } from "./AppSidebar-CIXJBzDv.js";
 import { r as useAuthStore } from "./auth-SliLnFre.js";
-import { n as isControlModelBinding } from "./controlSchemaModel-B8CTXagP.js";
+import { n as isControlModelBinding } from "./controlSchemaModel-BF5g4wRC.js";
 import { canAccessByPolicy } from "./permissions.js";
 import { Fragment, computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createSlots, createTextVNode, createVNode, defineComponent, normalizeClass, normalizeStyle, openBlock, ref, renderList, renderSlot, toDisplayString, unref, vShow, watch, withCtx, withDirectives } from "vue";
 //#region src/components/internal/SettingsPaneHeadInternal.vue?vue&type=script&setup=true&lang.ts
@@ -132,10 +132,7 @@ var _hoisted_14 = { class: "mint-settings-modal__theme-label" };
 var _hoisted_15 = { class: "mint-settings-modal__setting" };
 var _hoisted_16 = { class: "mint-settings-modal__palettes" };
 var _hoisted_17 = ["aria-pressed", "onClick"];
-var _hoisted_18 = {
-	class: "mint-settings-modal__swatches",
-	"aria-hidden": "true"
-};
+var _hoisted_18 = ["data-palette"];
 var _hoisted_19 = { class: "mint-settings-modal__palette-name" };
 var _hoisted_20 = { class: "mint-settings-modal__setting mint-settings-modal__setting--inline" };
 var _hoisted_21 = {
@@ -375,13 +372,13 @@ var SettingsModal_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 				halves: ["light", "dark"]
 			}
 		];
-		/** Five stops along the palette's primary → accent hue arc (shortest way round), as in the board. */
-		function paletteSwatches(key) {
-			const [from, to] = colorPalettes[key].hues;
-			const span = (to - from + 540) % 360 - 180;
-			const tone = key === "pastel" ? "60% 72%" : "65% 48%";
-			return Array.from({ length: 5 }, (_, i) => `hsl(${Math.round(from + span * i / 4)} ${tone})`);
-		}
+		/** Accent tokens a palette swatch shows; `data-palette` on the strip resolves them per palette. */
+		const paletteSwatchTokens = [
+			"--color-primary",
+			"--color-primary-hover",
+			"--color-primary-soft",
+			"--color-primary-border"
+		];
 		const densityPreviewRows = [
 			[
 				"S-0012",
@@ -570,7 +567,7 @@ var SettingsModal_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 							"aria-hidden": "true"
 						}, null, -1)), createTextVNode(" " + toDisplayString(opt.label), 1)])], 10, _hoisted_12);
 					}), 64))])]),
-					createElementVNode("div", _hoisted_15, [_cache[10] || (_cache[10] = createElementVNode("div", { class: "mint-settings-modal__setting-text" }, [createElementVNode("span", { class: "mint-settings-modal__setting-label" }, "Color palette"), createElementVNode("span", { class: "mint-settings-modal__setting-hint" }, "Primary and accent hues across the interface")], -1)), createElementVNode("div", _hoisted_16, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(colorPalettes), (palette, key) => {
+					createElementVNode("div", _hoisted_15, [_cache[10] || (_cache[10] = createElementVNode("div", { class: "mint-settings-modal__setting-text" }, [createElementVNode("span", { class: "mint-settings-modal__setting-label" }, "Color palette"), createElementVNode("span", { class: "mint-settings-modal__setting-hint" }, "Accent colour across the interface")], -1)), createElementVNode("div", _hoisted_16, [(openBlock(true), createElementBlock(Fragment, null, renderList(unref(colorPalettes), (palette, key) => {
 						return openBlock(), createElementBlock("button", {
 							key,
 							type: "button",
@@ -578,13 +575,17 @@ var SettingsModal_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ de
 							class: normalizeClass(["mint-settings-modal__palette", { "mint-settings-modal__palette--active": unref(settings).colorPalette === key }]),
 							onClick: ($event) => unref(settings).colorPalette = key
 						}, [
-							createElementVNode("span", _hoisted_18, [(openBlock(true), createElementBlock(Fragment, null, renderList(paletteSwatches(key), (color) => {
-								return openBlock(), createElementBlock("span", {
-									key: color,
+							createElementVNode("span", {
+								class: "mint-settings-modal__swatches",
+								"data-palette": key,
+								"aria-hidden": "true"
+							}, [(openBlock(), createElementBlock(Fragment, null, renderList(paletteSwatchTokens, (token) => {
+								return createElementVNode("span", {
+									key: token,
 									class: "mint-settings-modal__swatch",
-									style: normalizeStyle({ backgroundColor: color })
+									style: normalizeStyle({ backgroundColor: `var(${token})` })
 								}, null, 4);
-							}), 128))]),
+							}), 64))], 8, _hoisted_18),
 							createElementVNode("span", _hoisted_19, toDisplayString(palette.name), 1),
 							_cache[9] || (_cache[9] = createElementVNode("svg", {
 								class: "mint-settings-modal__palette-check",
@@ -663,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-DO3IZ7qz.js.map
+//# sourceMappingURL=SettingsModal-CdhFMi8j.js.map

package/dist/SettingsModal-CdhFMi8j.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SettingsModal-CdhFMi8j.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/__stories__/experiment-helpers.d.ts

@@ -12,6 +12,7 @@ export declare function installMockInterceptor(): void;
  * Props:
  *   preselect (boolean, default true) - pre-select the first mock experiment
  *   plugin (PluginInfo, optional)      - the integrated plugin, shown as AppTopBar's static identity
+ *   save (boolean, default true)       - show the Save half of the experiment chip
  */
 export declare const ExperimentProvider: import('vue').DefineComponent<import('vue').ExtractPropTypes<{
     preselect: {
@@ -22,6 +23,10 @@ export declare const ExperimentProvider: import('vue').DefineComponent<import('v
         type: PropType<PluginInfo>;
         default: undefined;
     };
+    save: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, () => import('vue').VNode<import('vue').RendererNode, import('vue').RendererElement, {
     [key: string]: any;
 }>[] | undefined, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<import('vue').ExtractPropTypes<{
@@ -33,7 +38,12 @@ export declare const ExperimentProvider: import('vue').DefineComponent<import('v
         type: PropType<PluginInfo>;
         default: undefined;
     };
+    save: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{}>, {
     plugin: PluginInfo;
+    save: boolean;
     preselect: boolean;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;

package/dist/__tests__/styles/paletteTokens.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/components/AppTopBar.vue.d.ts

@@ -1,4 +1,5 @@
 import { PillNavOption, PillNavItem, PageSelectorItem, PageSelectorItemInput, PluginWorkspaceTopBarSpec } from '../types/components';
+import { TopBarJob } from '../types/jobs';
 interface Props {
     /** App or plugin title shown in the left title group when no page selector is present. */
     title?: string;
@@ -12,14 +13,19 @@ interface Props {
     pageSelector?: PageSelectorItemInput[];
     /** Active id of the platform page selector. */
     currentPageSelectorId?: string;
+    /**
+     * The viewer's own job, joined to the experiment chip. Omit it for no jobs control;
+     * `null` shows the idle Jobs button. Both emit `job-click`.
+     */
+    job?: TopBarJob | null;
 }
 declare var __VLS_6: {}, __VLS_13: {}, __VLS_26: {}, __VLS_33: {}, __VLS_40: {}, __VLS_47: {}, __VLS_58: {
     page: PageSelectorItem;
 }, __VLS_61: {
     page: PageSelectorItem;
-}, __VLS_63: {}, __VLS_65: {}, __VLS_84: {}, __VLS_91: {}, __VLS_103: `settings-tab-${string}`, __VLS_104: {}, __VLS_107: {};
+}, __VLS_63: {}, __VLS_65: {}, __VLS_103: {}, __VLS_110: {}, __VLS_122: `settings-tab-${string}`, __VLS_123: {}, __VLS_126: {};
 type __VLS_Slots = {} & {
-    [K in NonNullable<typeof __VLS_103>]?: (props: typeof __VLS_104) => any;
+    [K in NonNullable<typeof __VLS_122>]?: (props: typeof __VLS_123) => any;
 } & {
     icon?: (props: typeof __VLS_6) => any;
 } & {
@@ -41,11 +47,11 @@ type __VLS_Slots = {} & {
 } & {
     center?: (props: typeof __VLS_65) => any;
 } & {
-    actions?: (props: typeof __VLS_84) => any;
+    actions?: (props: typeof __VLS_103) => any;
 } & {
-    account?: (props: typeof __VLS_91) => any;
+    account?: (props: typeof __VLS_110) => any;
 } & {
-    'settings-appearance'?: (props: typeof __VLS_107) => any;
+    'settings-appearance'?: (props: typeof __VLS_126) => any;
 };
 declare const __VLS_base: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:pill": (pillId: string) => any;
@@ -53,12 +59,14 @@ declare const __VLS_base: import('vue').DefineComponent<Props, {}, {}, {}, {}, i
     "pill-option-select": (option: PillNavOption, item: PillNavItem) => any;
     "settings-values-change": (data: Record<string, unknown>) => any;
     "page-selector-select": (page: PageSelectorItem) => any;
+    "job-click": () => any;
 }, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
     "onUpdate:pill"?: ((pillId: string) => any) | undefined;
     "onPill-select"?: ((item: PillNavItem) => any) | undefined;
     "onPill-option-select"?: ((option: PillNavOption, item: PillNavItem) => any) | undefined;
     "onSettings-values-change"?: ((data: Record<string, unknown>) => any) | undefined;
     "onPage-selector-select"?: ((page: PageSelectorItem) => any) | undefined;
+    "onJob-click"?: (() => any) | undefined;
 }>, {
     spec: PluginWorkspaceTopBarSpec;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;

package/dist/components/ExperimentSelectorModal.vue.d.ts

@@ -7,7 +7,15 @@ interface Props {
     title?: string;
     size?: ModalSize;
 }
-declare const __VLS_export: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+type __VLS_Slots = {
+    /** Text above the experiment list: why the caller asks for an experiment. */
+    description?: () => unknown;
+    /** Extra footer content, before Clear selection. `close()` closes the modal without a selection. */
+    footer?: (props: {
+        close: () => void;
+    }) => unknown;
+};
+declare const __VLS_base: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
     "update:open": (value: boolean) => any;
 }, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
     "onUpdate:open"?: ((value: boolean) => any) | undefined;
@@ -16,5 +24,11 @@ declare const __VLS_export: import('vue').DefineComponent<Props, {}, {}, {}, {},
     title: string;
     currentExperimentId: number | null;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;
 export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/components/SmartGroupFieldRecipe.vue.d.ts

@@ -28,8 +28,8 @@ declare const __VLS_export: import('vue').DefineComponent<SmartGroupFieldRecipeP
     "onDownload-prefilled"?: (() => any) | undefined;
 }>, {
     loading: boolean;
-    fields: SmartGroupField[];
     palette: string[];
+    fields: SmartGroupField[];
     samples: SmartGroupSampleRecord[];
     experimentLabel: string;
     headerCount: number;

package/dist/components/internal/AppTopBarPageSelectorInternal.vue.d.ts

@@ -4,6 +4,8 @@ interface Props {
     currentPageId?: string;
     placeholder?: string;
     minWidth?: string;
+    /** Plugin name shown before the trigger and in the menu title. */
+    pluginName?: string;
 }
 declare var __VLS_1: {
     page: PageSelectorItem;
@@ -21,7 +23,6 @@ declare const __VLS_base: import('vue').DefineComponent<Props, {}, {}, {}, {}, i
     onSelect?: ((page: PageSelectorItem) => any) | undefined;
 }>, {
     placeholder: string;
-    minWidth: string;
 }, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/dist/{controlSchemaModel-B8CTXagP.js → controlSchemaModel-BF5g4wRC.js}

@@ -1,4 +1,4 @@
-import { c as normalizeControlDefinition, p as omitUndefined } from "./useListReorder-BitdUhxn.js";
+import { c as normalizeControlDefinition, p as omitUndefined } from "./useListReorder-DPynGrCj.js";
 //#region src/composables/controlSchemaModel.ts
 function isControlModelBinding(model) {
 	return typeof model === "object" && model !== null && "controls" in model && "controlOptions" in model;
@@ -92,4 +92,4 @@ function registerSectionOptions(target, sectionId, options) {
 //#endregion
 export { isControlModelBinding as n, defineControlModel as t };
 
-//# sourceMappingURL=controlSchemaModel-B8CTXagP.js.map
+//# sourceMappingURL=controlSchemaModel-BF5g4wRC.js.map

package/dist/{controlSchemaModel-B8CTXagP.js.map → controlSchemaModel-BF5g4wRC.js.map}

@@ -1 +1 @@
-{"version":3,"file":"controlSchemaModel-B8CTXagP.js","names":[],"sources":["../src/composables/controlSchemaModel.ts"],"sourcesContent":["import type {\n  ControlModel,\n  ControlModelBinding,\n  ControlModelSectionConfig,\n  ControlSchema,\n  ControlSectionConfig,\n  ControlSidebarConfig,\n  ControlViewConfig,\n  ControlWorkspaceOptions,\n} from './controlSchemaTypes'\nimport {\n  normalizeControlDefinition,\n} from './controlSchemaNormalize'\nimport {\n  omitUndefined,\n} from './controlSchemaUtils'\n\nexport function isControlModelBinding<TBinding extends ControlModelBinding = ControlModelBinding>(\n  model: unknown,\n): model is TBinding {\n  return (\n    typeof model === 'object'\n    && model !== null\n    && 'controls' in model\n    && 'controlOptions' in model\n  )\n}\n\nexport function resolveControlModel(\n  model: ControlModel | ControlModelBinding | undefined,\n): ControlModelBinding | undefined {\n  if (model === undefined) return undefined\n  return isControlModelBinding(model) ? model : defineControlModel(model)\n}\n\n/**\n * Create a complete control model binding for FormBuilder, SettingsModal and the PluginWorkspaceView sidebar from a simple controls data model.\n *\n * @example Recommended\n * ```ts\n * const workspaceModel = defineControlModel({\n *   controls: { threshold: { type: 'number', default: 0.05 } },\n * })\n * ```\n */\nexport function defineControlModel(model: ControlModel): ControlModelBinding {\n  const {\n    controls: rootControls,\n    sections: rootSections,\n    views: modelViews,\n    components,\n    componentBindings,\n    componentProps,\n    componentPropsById,\n    ...baseOptions\n  } = model\n  const resolvedComponentBindings = componentBindings ?? components\n  const controls: ControlSchema = {}\n  const views: Record<string, ControlViewConfig> = {}\n  const sections: Record<string, ControlSectionConfig> = {}\n\n  const defaultViewId = model.view ?? 'default'\n  const defaultSectionId = model.section ?? 'controls'\n\n  if (rootControls) {\n    registerSectionOptions(sections, defaultSectionId, {\n      id: defaultSectionId,\n      label: model.sectionLabel,\n      title: model.sectionLabel,\n      columns: model.columns,\n    })\n    appendModelControls(controls, rootControls, defaultViewId, defaultSectionId)\n  }\n\n  for (const [sectionId, section] of Object.entries(rootSections ?? {})) {\n    registerSectionOptions(sections, sectionId, controlModelSectionOptions(section))\n    appendModelControls(controls, section.controls, defaultViewId, sectionId, section.sidebar)\n  }\n\n  for (const [viewId, view] of Object.entries(modelViews ?? {})) {\n    const {\n      controls: viewControls,\n      sections: viewSections,\n      section,\n      sectionLabel,\n      sectionDescription,\n      ...viewConfig\n    } = view\n\n    views[viewId] = omitUndefined(viewConfig)\n\n    if (viewControls) {\n      const sectionId = section ?? `${viewId}-controls`\n      const label = sectionLabel ?? view.label\n      registerSectionOptions(sections, sectionId, {\n        id: sectionId,\n        label,\n        title: label,\n        description: sectionDescription,\n        columns: model.columns,\n      })\n      appendModelControls(controls, viewControls, viewId, sectionId)\n    }\n\n    for (const [sectionKey, sectionConfig] of Object.entries(viewSections ?? {})) {\n      const sectionId = sectionConfig.id ?? `${viewId}-${sectionKey}`\n      registerSectionOptions(sections, sectionId, controlModelSectionOptions(sectionConfig))\n      appendModelControls(controls, sectionConfig.controls, viewId, sectionId, sectionConfig.sidebar)\n    }\n  }\n\n  const controlOptions: ControlWorkspaceOptions = {\n    ...baseOptions,\n  }\n\n  if (Object.keys(views).length > 0) {\n    controlOptions.views = views\n  }\n\n  if (Object.keys(sections).length > 0) {\n    controlOptions.sections = sections\n  }\n\n  return {\n    controls,\n    controlOptions,\n    ...(resolvedComponentBindings === undefined ? {} : { componentBindings: resolvedComponentBindings }),\n    ...(componentProps === undefined ? {} : { componentProps }),\n    ...(componentPropsById === undefined ? {} : { componentPropsById }),\n  }\n}\n\nfunction appendModelControls(\n  target: ControlSchema,\n  source: ControlSchema,\n  viewId: string,\n  sectionId: string,\n  sidebar?: boolean | ControlSidebarConfig,\n): void {\n  for (const [name, input] of Object.entries(source)) {\n    if (Object.prototype.hasOwnProperty.call(target, name)) {\n      throw new Error(\n        `Duplicate control \"${name}\" in defineControlModel(). Control names must be unique across views and sections.`,\n      )\n    }\n\n    const definition = normalizeControlDefinition(input)\n    target[name] = omitUndefined({\n      ...definition,\n      view: definition.view ?? viewId,\n      section: definition.section ?? sectionId,\n      sidebar: definition.sidebar ?? sidebar,\n    })\n  }\n}\n\nfunction controlModelSectionOptions(section: ControlModelSectionConfig): ControlSectionConfig {\n  const { controls: _controls, sidebar: _sidebar, ...options } = section\n  return omitUndefined(options)\n}\n\nfunction registerSectionOptions(\n  target: Record<string, ControlSectionConfig>,\n  sectionId: string,\n  options: ControlSectionConfig,\n): void {\n  target[sectionId] = omitUndefined({\n    ...(target[sectionId] ?? {}),\n    ...options,\n    id: sectionId,\n  })\n}\n"],"mappings":"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"}
+{"version":3,"file":"controlSchemaModel-BF5g4wRC.js","names":[],"sources":["../src/composables/controlSchemaModel.ts"],"sourcesContent":["import type {\n  ControlModel,\n  ControlModelBinding,\n  ControlModelSectionConfig,\n  ControlSchema,\n  ControlSectionConfig,\n  ControlSidebarConfig,\n  ControlViewConfig,\n  ControlWorkspaceOptions,\n} from './controlSchemaTypes'\nimport {\n  normalizeControlDefinition,\n} from './controlSchemaNormalize'\nimport {\n  omitUndefined,\n} from './controlSchemaUtils'\n\nexport function isControlModelBinding<TBinding extends ControlModelBinding = ControlModelBinding>(\n  model: unknown,\n): model is TBinding {\n  return (\n    typeof model === 'object'\n    && model !== null\n    && 'controls' in model\n    && 'controlOptions' in model\n  )\n}\n\nexport function resolveControlModel(\n  model: ControlModel | ControlModelBinding | undefined,\n): ControlModelBinding | undefined {\n  if (model === undefined) return undefined\n  return isControlModelBinding(model) ? model : defineControlModel(model)\n}\n\n/**\n * Create a complete control model binding for FormBuilder, SettingsModal and the PluginWorkspaceView sidebar from a simple controls data model.\n *\n * @example Recommended\n * ```ts\n * const workspaceModel = defineControlModel({\n *   controls: { threshold: { type: 'number', default: 0.05 } },\n * })\n * ```\n */\nexport function defineControlModel(model: ControlModel): ControlModelBinding {\n  const {\n    controls: rootControls,\n    sections: rootSections,\n    views: modelViews,\n    components,\n    componentBindings,\n    componentProps,\n    componentPropsById,\n    ...baseOptions\n  } = model\n  const resolvedComponentBindings = componentBindings ?? components\n  const controls: ControlSchema = {}\n  const views: Record<string, ControlViewConfig> = {}\n  const sections: Record<string, ControlSectionConfig> = {}\n\n  const defaultViewId = model.view ?? 'default'\n  const defaultSectionId = model.section ?? 'controls'\n\n  if (rootControls) {\n    registerSectionOptions(sections, defaultSectionId, {\n      id: defaultSectionId,\n      label: model.sectionLabel,\n      title: model.sectionLabel,\n      columns: model.columns,\n    })\n    appendModelControls(controls, rootControls, defaultViewId, defaultSectionId)\n  }\n\n  for (const [sectionId, section] of Object.entries(rootSections ?? {})) {\n    registerSectionOptions(sections, sectionId, controlModelSectionOptions(section))\n    appendModelControls(controls, section.controls, defaultViewId, sectionId, section.sidebar)\n  }\n\n  for (const [viewId, view] of Object.entries(modelViews ?? {})) {\n    const {\n      controls: viewControls,\n      sections: viewSections,\n      section,\n      sectionLabel,\n      sectionDescription,\n      ...viewConfig\n    } = view\n\n    views[viewId] = omitUndefined(viewConfig)\n\n    if (viewControls) {\n      const sectionId = section ?? `${viewId}-controls`\n      const label = sectionLabel ?? view.label\n      registerSectionOptions(sections, sectionId, {\n        id: sectionId,\n        label,\n        title: label,\n        description: sectionDescription,\n        columns: model.columns,\n      })\n      appendModelControls(controls, viewControls, viewId, sectionId)\n    }\n\n    for (const [sectionKey, sectionConfig] of Object.entries(viewSections ?? {})) {\n      const sectionId = sectionConfig.id ?? `${viewId}-${sectionKey}`\n      registerSectionOptions(sections, sectionId, controlModelSectionOptions(sectionConfig))\n      appendModelControls(controls, sectionConfig.controls, viewId, sectionId, sectionConfig.sidebar)\n    }\n  }\n\n  const controlOptions: ControlWorkspaceOptions = {\n    ...baseOptions,\n  }\n\n  if (Object.keys(views).length > 0) {\n    controlOptions.views = views\n  }\n\n  if (Object.keys(sections).length > 0) {\n    controlOptions.sections = sections\n  }\n\n  return {\n    controls,\n    controlOptions,\n    ...(resolvedComponentBindings === undefined ? {} : { componentBindings: resolvedComponentBindings }),\n    ...(componentProps === undefined ? {} : { componentProps }),\n    ...(componentPropsById === undefined ? {} : { componentPropsById }),\n  }\n}\n\nfunction appendModelControls(\n  target: ControlSchema,\n  source: ControlSchema,\n  viewId: string,\n  sectionId: string,\n  sidebar?: boolean | ControlSidebarConfig,\n): void {\n  for (const [name, input] of Object.entries(source)) {\n    if (Object.prototype.hasOwnProperty.call(target, name)) {\n      throw new Error(\n        `Duplicate control \"${name}\" in defineControlModel(). Control names must be unique across views and sections.`,\n      )\n    }\n\n    const definition = normalizeControlDefinition(input)\n    target[name] = omitUndefined({\n      ...definition,\n      view: definition.view ?? viewId,\n      section: definition.section ?? sectionId,\n      sidebar: definition.sidebar ?? sidebar,\n    })\n  }\n}\n\nfunction controlModelSectionOptions(section: ControlModelSectionConfig): ControlSectionConfig {\n  const { controls: _controls, sidebar: _sidebar, ...options } = section\n  return omitUndefined(options)\n}\n\nfunction registerSectionOptions(\n  target: Record<string, ControlSectionConfig>,\n  sectionId: string,\n  options: ControlSectionConfig,\n): void {\n  target[sectionId] = omitUndefined({\n    ...(target[sectionId] ?? {}),\n    ...options,\n    id: sectionId,\n  })\n}\n"],"mappings":"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"}

package/dist/{data-CgILxDLW.js → data-DUt0TIp5.js}

@@ -1,16 +1,16 @@
 import { a as BaseButton_default, n as BaseModal_default, o as __exportAll } from "./useDropdownState-8yWMu-7_.js";
-import { o as useApi, p as MintApiError, t as useExperimentStore } from "./experiment-43OJtH7R.js";
-import { A as formatRelativeTime, C as formatExperimentDate, G as BaseInput_default, I as FormField_default, S as experimentIdFromRoute, T as FileUploader_default, V as BaseSelect_default, _ as APP_EXPERIMENT_KEY, b as SORT_OPTIONS, g as pluginSecrets_exports, i as getInjectedPlatformContext, m as SecretInput_default, n as ResourcePickerListInternal_default, p as TagsInput_default, r as Skeleton_default, v as useAppExperiment, w as resolveExperimentCode, x as datePresetToISO, y as DATE_PRESET_OPTIONS, z as BaseCheckbox_default } from "./records-B6gpM_3e.js";
-import { t as SegmentedControl_default } from "./SegmentedControl-BtnnjWzs.js";
-import { a as normalizeSearchQuery, i as candidateMatchesSearch, n as DataStateInternal_default, o as useTextSearch, t as AlertBox_default } from "./AlertBox-B2Bgr3ei.js";
-import { n as ActionMenu_default, t as useRequest } from "./useRequest-D506eHi8.js";
+import { d as MintApiError, o as useApi, t as useExperimentStore } from "./experiment-DyO54FQB.js";
+import { A as formatRelativeTime, C as formatExperimentDate, G as BaseInput_default, I as FormField_default, S as experimentIdFromRoute, T as FileUploader_default, V as BaseSelect_default, _ as APP_EXPERIMENT_KEY, b as SORT_OPTIONS, g as pluginSecrets_exports, i as getInjectedPlatformContext, m as SecretInput_default, n as ResourcePickerListInternal_default, p as TagsInput_default, r as Skeleton_default, v as useAppExperiment, w as resolveExperimentCode, x as datePresetToISO, y as DATE_PRESET_OPTIONS, z as BaseCheckbox_default } from "./records-DnK_1Q_S.js";
+import { t as SegmentedControl_default } from "./SegmentedControl-BkwYOKpG.js";
+import { a as normalizeSearchQuery, i as candidateMatchesSearch, n as DataStateInternal_default, o as useTextSearch, t as AlertBox_default } from "./AlertBox-BdoZqANv.js";
+import { n as ActionMenu_default, t as useRequest } from "./useRequest-Dqw12k2s.js";
 import { hasAllPermissions } from "./permissions.js";
-import { r as useExperimentSelector, t as ExperimentSelectorModal_default } from "./ExperimentSelectorModal-65peG4Up.js";
+import { r as useExperimentSelector, t as ExperimentSelectorModal_default } from "./ExperimentSelectorModal-BbFtr1Fr.js";
 import { t as experimentStatus_exports } from "./experimentStatus-Cqp6qNrR.js";
 import { t as ANALYSIS_FILE_ARTIFACT_SCHEMA } from "./analysisArtifactTypes-Cy3D0Ipg.js";
-import { t as ExperimentPopover_default } from "./ExperimentPopover-5T1fAq2L.js";
-import { i as JobsStatusTray_default, r as useRealtime } from "./useRealtime-C3iy9QkU.js";
-import { a as useFileImport, c as extractSampleNamesFromDesignData, i as readFileAsText, l as extractSampleOptionsFromDesignData, n as detectDelimiter, o as validateImportFile, r as parseDelimitedText, s as useExperimentData, t as useExperimentSamples, u as unwrapExperimentDesignData } from "./useExperimentSamples-DHnxKFAF.js";
+import { t as ExperimentPopover_default } from "./ExperimentPopover-CbD7BR_s.js";
+import { i as JobsStatusTray_default, r as useRealtime } from "./useRealtime-yWjTTnc9.js";
+import { a as useFileImport, c as extractSampleNamesFromDesignData, i as readFileAsText, l as extractSampleOptionsFromDesignData, n as detectDelimiter, o as validateImportFile, r as parseDelimitedText, s as useExperimentData, t as useExperimentSamples, u as unwrapExperimentDesignData } from "./useExperimentSamples-BGN1dmcR.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";
 //#region src/composables/useArtifacts.ts
@@ -3862,4 +3862,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-CgILxDLW.js.map
+//# sourceMappingURL=data-DUt0TIp5.js.map