@milaboratories/graph-maker 1.1.177 → 1.1.179

package/dist/forms/LayersForm/Layer/Bubble.vue.js

@@ -1,21 +1,19 @@
-import { defineComponent as B, computed as s, ref as v, createElementBlock as O, openBlock as A, Fragment as x, createVNode as a, createBlock as y, createCommentVNode as E, createElementVNode as u, unref as n, withCtx as U } from "vue";
+import { defineComponent as y, computed as s, ref as v, createElementBlock as B, openBlock as A, Fragment as O, createVNode as a, createBlock as x, createCommentVNode as E, createElementVNode as u, unref as n, withCtx as U } from "vue";
 import { useStore as P } from "../../../store.js";
 import { DEFAULT_CONTINUOUS_PALETTE as _, DEFAULT_BLACK as I, PALETTE_MAP as L } from "../../../constantsAesthetic.js";
 import { createContinuousMappingFromPalette as z } from "../../../dataBindAes.js";
 import D from "../../../components/MultiselectButton.vue.js";
 import F from "../../../components/AesSettings/PalettesForm.vue.js";
 import $ from "../../../components/AesSettings/FormWrapper.vue.js";
-import { PlBtnGroup as p, PlCheckbox as V, PlNumberField as G } from "@platforma-sdk/ui-vue";
-import R from "../AesSelector.vue.js";
-const w = { class: "input-item" }, X = { class: "button-group-item" }, Y = { class: "button-group-item" }, H = { class: "checkbox-item" }, Z = { class: "checkbox-item" }, K = { class: "button-group-item" }, j = {
+import { PlBtnGroup as p, PlCheckbox as V, PlNumberField as R } from "@platforma-sdk/ui-vue";
+import w from "../AesSelector.vue.js";
+const G = { class: "input-item" }, X = { class: "button-group-item" }, Y = { class: "button-group-item" }, H = { class: "checkbox-item" }, Z = { class: "checkbox-item" }, K = { class: "button-group-item" }, j = {
   class: "button-group-item",
   style: { display: "flex", alignItems: "end" }
-}, ue = /* @__PURE__ */ B({
+}, q = "bubble", ne = /* @__PURE__ */ y({
   __name: "Bubble",
-  setup(q) {
-    const i = P(), t = s(() => i.value.reactive.layersSettings.bubble), f = s(() => i.value.reactive.optionsState);
-    s(() => i.value.inputGuide.value);
-    const r = s(() => {
+  setup(J) {
+    const i = P(), t = s(() => i.value.reactive.layersSettings[q]), f = s(() => i.value.reactive.optionsState), r = s(() => {
       var o;
       return (o = f.value.components.valueColor.selectorStates[0]) == null ? void 0 : o.selectedSource;
     }), N = s(() => {
@@ -46,7 +44,7 @@ const w = { class: "input-item" }, X = { class: "button-group-item" }, Y = { cla
       { label: "empty", value: null },
       { label: "Special value", value: "custom" }
     ], g = v(t.value.NAValueAs !== null ? "custom" : t.value.NAValueAs), c = v(t.value.NAValueAs ?? 0);
-    return (o, e) => (A(), O(x, null, [
+    return (o, e) => (A(), B(O, null, [
       a(D, {
         label: "Color Palette ",
         title: n(L)[d.value].title,
@@ -55,7 +53,7 @@ const w = { class: "input-item" }, X = { class: "button-group-item" }, Y = { cla
           m.value = !0;
         })
       }, null, 8, ["title", "palette"]),
-      m.value ? (A(), y($, {
+      m.value ? (A(), x($, {
         key: 0,
         title: "Color Palette",
         "back-title": "Color mapping",
@@ -70,8 +68,8 @@ const w = { class: "input-item" }, X = { class: "button-group-item" }, Y = { cla
         ]),
         _: 1
       })) : E("", !0),
-      u("div", w, [
-        a(R, {
+      u("div", G, [
+        a(w, {
           label: "Stroke color",
           "form-title": "Stroke Color Settings",
           "form-back-title": "Layers",
@@ -83,20 +81,20 @@ const w = { class: "input-item" }, X = { class: "button-group-item" }, Y = { cla
       ]),
       u("div", X, [
         a(n(p), {
+          modelValue: t.value.normalizationDirection,
+          "onUpdate:modelValue": e[3] || (e[3] = (l) => t.value.normalizationDirection = l),
           label: "Normalize by",
           options: k,
-          compact: !0,
-          modelValue: t.value.normalizationDirection,
-          "onUpdate:modelValue": e[3] || (e[3] = (l) => t.value.normalizationDirection = l)
+          compact: !0
         }, null, 8, ["modelValue"])
       ]),
       u("div", Y, [
         a(n(p), {
+          modelValue: t.value.normalizationMethod,
+          "onUpdate:modelValue": e[4] || (e[4] = (l) => t.value.normalizationMethod = l),
           label: "Normalization method",
           options: M,
-          compact: !0,
-          modelValue: t.value.normalizationMethod,
-          "onUpdate:modelValue": e[4] || (e[4] = (l) => t.value.normalizationMethod = l)
+          compact: !0
         }, null, 8, ["modelValue"])
       ]),
       u("div", H, [
@@ -115,44 +113,44 @@ const w = { class: "input-item" }, X = { class: "button-group-item" }, Y = { cla
       ]),
       u("div", K, [
         a(n(p), {
+          modelValue: t.value.aggregationMethod,
+          "onUpdate:modelValue": e[7] || (e[7] = (l) => t.value.aggregationMethod = l),
           label: "Aggregation method",
           options: S,
-          compact: !0,
-          modelValue: t.value.aggregationMethod,
-          "onUpdate:modelValue": e[7] || (e[7] = (l) => t.value.aggregationMethod = l)
+          compact: !0
         }, null, 8, ["modelValue"])
       ]),
       u("div", j, [
         a(n(p), {
-          label: "Treat NA value as:",
-          options: T,
-          compact: !0,
           modelValue: g.value,
           "onUpdate:modelValue": [
             e[8] || (e[8] = (l) => g.value = l),
             e[9] || (e[9] = (l) => {
               l === "custom" ? t.value.NAValueAs = c.value : t.value.NAValueAs = l;
             })
-          ]
+          ],
+          label: "Treat NA value as:",
+          options: T,
+          compact: !0
         }, null, 8, ["modelValue"]),
-        a(n(G), {
-          style: { height: "33px", marginLeft: "16px", width: "75px" },
-          disabled: g.value !== "custom",
-          label: "NA value",
-          useIncrementButtons: !1,
+        a(n(R), {
           modelValue: c.value,
           "onUpdate:modelValue": [
             e[10] || (e[10] = (l) => c.value = l),
             e[11] || (e[11] = (l) => {
               l !== void 0 && (t.value.NAValueAs = l);
             })
-          ]
-        }, null, 8, ["disabled", "modelValue"])
+          ],
+          style: { height: "33px", marginLeft: "16px", width: "75px" },
+          disabled: g.value !== "custom",
+          label: "NA value",
+          useIncrementButtons: !1
+        }, null, 8, ["modelValue", "disabled"])
       ])
     ], 64));
   }
 });
 export {
-  ue as default
+  ne as default
 };
 //# sourceMappingURL=Bubble.vue.js.map

package/dist/forms/LayersForm/Layer/Bubble.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Bubble.vue.js","sources":["../../../../src/forms/LayersForm/Layer/Bubble.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../store';\nimport { BubbleLayer } from '../../../types';\nimport { computed, ref } from 'vue';\nimport {\n  DEFAULT_BLACK,\n  DEFAULT_CONTINUOUS_PALETTE,\n  PALETTE_MAP\n} from '../../../constantsAesthetic';\nimport { ContinuousPalette } from '../../../components/AesSettings/types';\nimport { createContinuousMappingFromPalette } from '../../../dataBindAes';\nimport MultiselectButton from '../../../components/MultiselectButton.vue';\nimport PalettesForm from '../../../components/AesSettings/PalettesForm.vue';\nimport FormWrapper from '../../../components/AesSettings/FormWrapper.vue';\nimport { BubbleUIState, InputGuide } from '@milaboratories/pf-plots';\nimport { PlBtnGroup, PlCheckbox, PlNumberField, SimpleOption } from '@platforma-sdk/ui-vue';\nimport AesSelector from '../AesSelector.vue';\n\nconst store = useStore();\nconst layer: BubbleLayer = 'bubble';\nconst settings = computed(() => store.value.reactive.layersSettings.bubble);\nconst optionsState = computed(() => store.value.reactive.optionsState as BubbleUIState);\nconst inputGuide = computed(() => store.value.inputGuide.value as InputGuide<BubbleUIState>);\n\nconst valueColor = computed(() => optionsState.value.components.valueColor.selectorStates[0]?.selectedSource);\nconst savedDataValuePalette = computed(() => valueColor.value ? store.value.reactive.dataBindAes[valueColor.value]?.palette : undefined);\n\nconst palettesOpen = ref(false);\nconst palette = ref<ContinuousPalette>(savedDataValuePalette.value as ContinuousPalette ?? DEFAULT_CONTINUOUS_PALETTE);\n\nfunction onPaletteSelect(value: ContinuousPalette) {\n  palette.value = value;\n  palettesOpen.value = false;\n  if (valueColor.value) {\n    store.value.reactive.dataBindAes[valueColor.value] = createContinuousMappingFromPalette(value);\n  }\n}\n\nconst NORMALIZATION_DIRECTION:SimpleOption[] = [\n  {label: 'None', value: null},\n  {label: 'Columns', value: 'column'},\n  {label: 'Rows', value: 'row'},\n];\nconst NORMALIZATION_METHOD:SimpleOption[] = [\n  {label: 'z-score', value: 'standardScaling'},\n  {label: 'Min-max', value: 'meanNormalization'},\n];\nconst AGGREGATION_METHOD: SimpleOption[] = [\n  {label: 'Mean', value: 'mean'},\n  {label: 'Min', value: 'min'},\n  {label: 'Max', value: 'max'},\n  {label: 'Median', value: 'median'},\n];\n\nconst stroke = computed({\n  get: () => {\n    return settings.value.strokeColor ?? DEFAULT_BLACK\n  },\n  set: (v:string) => {\n    settings.value.strokeColor = v;\n  }\n});\n\nconst NA_VALUE_OPTIONS: SimpleOption[] = [\n  { label: 'empty', value: null },\n  { label: 'Special value', value: 'custom' }\n];\n\nconst NAValueOption = ref(settings.value.NAValueAs !== null ? 'custom' : settings.value.NAValueAs);\nconst customNA = ref(settings.value.NAValueAs ?? 0);\n\n</script>\n\n<template>\n  <multiselect-button\n    label=\"Color Palette \"\n    :title=\"PALETTE_MAP[palette].title\"\n    :palette=\"palette\"\n    @button-click=\"palettesOpen = true;\"\n  />\n  <form-wrapper\n    v-if=\"palettesOpen\"\n    title=\"Color Palette\"\n    back-title=\"Color mapping\"\n    @form:close=\"palettesOpen = false\"\n  >\n    <palettes-form :selected=\"palette\" :categorical=\"false\" @select=\"onPaletteSelect\" />\n  </form-wrapper>\n  <div class=\"input-item\">\n    <aes-selector\n      label=\"Stroke color\"\n      form-title=\"Stroke Color Settings\"\n      form-back-title=\"Layers\"\n      type=\"stroke\"\n      :possible-aes-source-inputs=\"[]\"\n      :selected=\"stroke\"\n      @aes-update=\"(v:string) => stroke = v\"\n    />\n  </div>\n  <div class=\"button-group-item\">\n    <pl-btn-group\n      label=\"Normalize by\"\n      :options=\"NORMALIZATION_DIRECTION\"\n      :compact=\"true\"\n      v-model=\"settings.normalizationDirection\"\n    />\n  </div>\n  <div class=\"button-group-item\">\n    <pl-btn-group\n      label=\"Normalization method\"\n      :options=\"NORMALIZATION_METHOD\"\n      :compact=\"true\"\n      v-model=\"settings.normalizationMethod\"\n    />\n  </div>\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"settings.aggregateByX\"/>\n    <span>Aggregate X groups</span>\n  </div>\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"settings.aggregateByY\"/>\n    <span>Aggregate Y groups</span>\n  </div>\n  <div class=\"button-group-item\">\n    <pl-btn-group\n      label=\"Aggregation method\"\n      :options=\"AGGREGATION_METHOD\"\n      :compact=\"true\"\n      v-model=\"settings.aggregationMethod\"\n    />\n  </div>\n  <div class=\"button-group-item\" :style=\"{display: 'flex', alignItems: 'end'}\">\n    <pl-btn-group\n      label=\"Treat NA value as:\"\n      :options=\"NA_VALUE_OPTIONS\"\n      :compact=\"true\"\n      v-model=\"NAValueOption\"\n      @update:modelValue=\"(value:unknown) => {\n                if (value === 'custom') {\n          settings.NAValueAs = customNA;\n        } else {\n          settings.NAValueAs = value as number|null;\n        }\n          }\"\n    />\n    <pl-number-field\n      :style=\"{height: '33px', marginLeft: '16px', width: '75px'}\"\n      :disabled=\"NAValueOption !== 'custom'\"\n      label=\"NA value\"\n      :useIncrementButtons=\"false\"\n      v-model=\"customNA\"\n      @update:modelValue=\"(value:unknown) => {\n        if (value !== undefined) {\n          settings.NAValueAs = value as number;\n        }\n      }\"\n    />\n  </div>\n</template>\n"],"names":["store","useStore","settings","computed","optionsState","valueColor","_a","savedDataValuePalette","palettesOpen","ref","palette","DEFAULT_CONTINUOUS_PALETTE","onPaletteSelect","value","createContinuousMappingFromPalette","NORMALIZATION_DIRECTION","NORMALIZATION_METHOD","AGGREGATION_METHOD","stroke","DEFAULT_BLACK","v","NA_VALUE_OPTIONS","NAValueOption","customNA","_createVNode","MultiselectButton","_unref","PALETTE_MAP","_createBlock","FormWrapper","PalettesForm","_createElementVNode","_hoisted_1","AesSelector","_cache","_hoisted_2","PlBtnGroup","$event","_hoisted_3","_hoisted_4","PlCheckbox","_hoisted_5","_hoisted_6","_hoisted_7","PlNumberField"],"mappings":"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"}
+{"version":3,"file":"Bubble.vue.js","sources":["../../../../src/forms/LayersForm/Layer/Bubble.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../store';\nimport type { BubbleLayer } from '../../../types';\nimport { computed, ref } from 'vue';\nimport {\n  DEFAULT_BLACK,\n  DEFAULT_CONTINUOUS_PALETTE,\n  PALETTE_MAP,\n} from '../../../constantsAesthetic';\nimport type { ContinuousPalette } from '../../../components/AesSettings/types';\nimport { createContinuousMappingFromPalette } from '../../../dataBindAes';\nimport MultiselectButton from '../../../components/MultiselectButton.vue';\nimport PalettesForm from '../../../components/AesSettings/PalettesForm.vue';\nimport FormWrapper from '../../../components/AesSettings/FormWrapper.vue';\nimport type { BubbleUIState } from '@milaboratories/pf-plots';\nimport type { SimpleOption } from '@platforma-sdk/ui-vue';\nimport { PlBtnGroup, PlCheckbox, PlNumberField } from '@platforma-sdk/ui-vue';\nimport AesSelector from '../AesSelector.vue';\n\nconst store = useStore();\nconst layer: BubbleLayer = 'bubble';\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(() => store.value.reactive.optionsState as BubbleUIState);\n\nconst valueColor = computed(() => optionsState.value.components.valueColor.selectorStates[0]?.selectedSource);\nconst savedDataValuePalette = computed(() => valueColor.value ? store.value.reactive.dataBindAes[valueColor.value]?.palette : undefined);\n\nconst palettesOpen = ref(false);\nconst palette = ref<ContinuousPalette>(savedDataValuePalette.value as ContinuousPalette ?? DEFAULT_CONTINUOUS_PALETTE);\n\nfunction onPaletteSelect(value: ContinuousPalette) {\n  palette.value = value;\n  palettesOpen.value = false;\n  if (valueColor.value) {\n    store.value.reactive.dataBindAes[valueColor.value] = createContinuousMappingFromPalette(value);\n  }\n}\n\nconst NORMALIZATION_DIRECTION: SimpleOption[] = [\n  { label: 'None', value: null },\n  { label: 'Columns', value: 'column' },\n  { label: 'Rows', value: 'row' },\n];\nconst NORMALIZATION_METHOD: SimpleOption[] = [\n  { label: 'z-score', value: 'standardScaling' },\n  { label: 'Min-max', value: 'meanNormalization' },\n];\nconst AGGREGATION_METHOD: SimpleOption[] = [\n  { label: 'Mean', value: 'mean' },\n  { label: 'Min', value: 'min' },\n  { label: 'Max', value: 'max' },\n  { label: 'Median', value: 'median' },\n];\n\nconst stroke = computed({\n  get: () => {\n    return settings.value.strokeColor ?? DEFAULT_BLACK;\n  },\n  set: (v: string) => {\n    settings.value.strokeColor = v;\n  },\n});\n\nconst NA_VALUE_OPTIONS: SimpleOption[] = [\n  { label: 'empty', value: null },\n  { label: 'Special value', value: 'custom' },\n];\n\nconst NAValueOption = ref(settings.value.NAValueAs !== null ? 'custom' : settings.value.NAValueAs);\nconst customNA = ref(settings.value.NAValueAs ?? 0);\n\n</script>\n\n<template>\n  <MultiselectButton\n    label=\"Color Palette \"\n    :title=\"PALETTE_MAP[palette].title\"\n    :palette=\"palette\"\n    @button-click=\"palettesOpen = true;\"\n  />\n  <FormWrapper\n    v-if=\"palettesOpen\"\n    title=\"Color Palette\"\n    back-title=\"Color mapping\"\n    @form:close=\"palettesOpen = false\"\n  >\n    <PalettesForm :selected=\"palette\" :categorical=\"false\" @select=\"onPaletteSelect\" />\n  </FormWrapper>\n  <div class=\"input-item\">\n    <AesSelector\n      label=\"Stroke color\"\n      form-title=\"Stroke Color Settings\"\n      form-back-title=\"Layers\"\n      type=\"stroke\"\n      :possible-aes-source-inputs=\"[]\"\n      :selected=\"stroke\"\n      @aes-update=\"(v:string) => stroke = v\"\n    />\n  </div>\n  <div class=\"button-group-item\">\n    <PlBtnGroup\n      v-model=\"settings.normalizationDirection\"\n      label=\"Normalize by\"\n      :options=\"NORMALIZATION_DIRECTION\"\n      :compact=\"true\"\n    />\n  </div>\n  <div class=\"button-group-item\">\n    <PlBtnGroup\n      v-model=\"settings.normalizationMethod\"\n      label=\"Normalization method\"\n      :options=\"NORMALIZATION_METHOD\"\n      :compact=\"true\"\n    />\n  </div>\n  <div class=\"checkbox-item\">\n    <PlCheckbox v-model=\"settings.aggregateByX\"/>\n    <span>Aggregate X groups</span>\n  </div>\n  <div class=\"checkbox-item\">\n    <PlCheckbox v-model=\"settings.aggregateByY\"/>\n    <span>Aggregate Y groups</span>\n  </div>\n  <div class=\"button-group-item\">\n    <PlBtnGroup\n      v-model=\"settings.aggregationMethod\"\n      label=\"Aggregation method\"\n      :options=\"AGGREGATION_METHOD\"\n      :compact=\"true\"\n    />\n  </div>\n  <div class=\"button-group-item\" :style=\"{display: 'flex', alignItems: 'end'}\">\n    <PlBtnGroup\n      v-model=\"NAValueOption\"\n      label=\"Treat NA value as:\"\n      :options=\"NA_VALUE_OPTIONS\"\n      :compact=\"true\"\n      @update:modelValue=\"(value:unknown) => {\n        if (value === 'custom') {\n          settings.NAValueAs = customNA;\n        } else {\n          settings.NAValueAs = value as number|null;\n        }\n      }\"\n    />\n    <PlNumberField\n      v-model=\"customNA\"\n      :style=\"{height: '33px', marginLeft: '16px', width: '75px'}\"\n      :disabled=\"NAValueOption !== 'custom'\"\n      label=\"NA value\"\n      :useIncrementButtons=\"false\"\n      @update:modelValue=\"(value:unknown) => {\n        if (value !== undefined) {\n          settings.NAValueAs = value as number;\n        }\n      }\"\n    />\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","valueColor","_a","savedDataValuePalette","palettesOpen","ref","palette","DEFAULT_CONTINUOUS_PALETTE","onPaletteSelect","value","createContinuousMappingFromPalette","NORMALIZATION_DIRECTION","NORMALIZATION_METHOD","AGGREGATION_METHOD","stroke","DEFAULT_BLACK","v","NA_VALUE_OPTIONS","NAValueOption","customNA","_createVNode","MultiselectButton","_unref","PALETTE_MAP","_createBlock","FormWrapper","PalettesForm","_createElementVNode","_hoisted_1","AesSelector","_cache","_hoisted_2","PlBtnGroup","$event","_hoisted_3","_hoisted_4","PlCheckbox","_hoisted_5","_hoisted_6","_hoisted_7","PlNumberField"],"mappings":"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"}

package/dist/forms/LayersForm/Layer/Dendro.vue.js

@@ -77,21 +77,21 @@ const M = { class: "checkbox-item" }, R = { class: "checkbox-item" }, r = "dendr
       d("div", null, [
         u.value.components.nodeSize.selectorStates.length > 0 ? (m(), b(p(B), {
           key: 0,
+          modelValue: c.value,
+          "onUpdate:modelValue": e[3] || (e[3] = (t) => c.value = t),
           min: 3,
           max: 10,
           breakpoints: !0,
-          label: "Node size range",
-          modelValue: c.value,
-          "onUpdate:modelValue": e[3] || (e[3] = (t) => c.value = t)
+          label: "Node size range"
         }, null, 8, ["modelValue"])) : (m(), b(p(F), {
           key: 1,
+          modelValue: y.value,
+          "onUpdate:modelValue": e[4] || (e[4] = (t) => y.value = t),
           min: 3,
           max: 10,
           step: 1,
           breakpoints: !0,
-          label: "Node size",
-          modelValue: y.value,
-          "onUpdate:modelValue": e[4] || (e[4] = (t) => y.value = t)
+          label: "Node size"
         }, null, 8, ["modelValue"]))
       ]),
       d("div", M, [

package/dist/forms/LayersForm/Layer/Dendro.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Dendro.vue.js","sources":["../../../../src/forms/LayersForm/Layer/Dendro.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../store';\nimport { computed, ref } from \"vue\";\nimport AesSelector from '../AesSelector.vue';\nimport { AestheticMappingCategorical } from '../../../dataBindAes';\nimport {\n  AesMappingOption,\n  AesOption,\n  DotShape,\n} from '../../../components/AesSettings/types';\nimport { DendroUIState } from \"@milaboratories/pf-plots\";\nimport { PlCheckbox, SliderRange, Slider } from '@platforma-sdk/ui-vue';\nimport { isNumberRange } from '../../../constantsCommon';\n\nconst store = useStore();\nconst layer = \"dendro\";\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DendroUIState,\n);\n\nconst nodeColor = computed(() => settings.value.dotFill);\nconst nodeShape = computed(() => settings.value.dotShape);\nconst lineColor = computed(() => settings.value.lineColor);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: \"dotFill\" | \"lineColor\",\n) {\n  if (typeof value === \"string\") {\n    store.value.reactive.layersSettings[layer][field] = value;\n  } else if (colorOption.type === \"dataCategorical\") {\n    store.value.reactive.layersSettings[layer][field] = {\n      type: colorOption.inputName,\n      value: colorOption.selectedSource,\n    };\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value !== \"string\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nfunction onUpdateDot(\n  value: DotShape | AestheticMappingCategorical,\n  colorOption: AesMappingOption,\n  field: \"dotShape\",\n) {\n  if (typeof value === \"string\") {\n    store.value.reactive.layersSettings[layer][field] = value;\n  } else if (colorOption.type === \"dataCategorical\") {\n    store.value.reactive.layersSettings[layer][field] = {\n      type: colorOption.inputName,\n      value: colorOption.selectedSource,\n    };\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value !== \"string\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\n// Tree mode 'useAllNodesAsLeaves' - align tree special way to be able to set table line opposite every node\n// const treeAlign = ref(settings.value.mode === 'useAllNodesAsLeaves');\nconst leavesAlign = ref(settings.value.leavesMode === 'alignLeavesToLine');\n\nconst showLegend = computed({\n  get() { return settings.value.showLegend ?? true},\n  set(v) {\n    settings.value.showLegend = v;\n  },\n})\nconst nodeSizeRange = computed<[number, number]>({\n  get() { return isNumberRange(settings.value.dotSize) ? [settings.value.dotSize.min, settings.value.dotSize.max] : [3, 10]},\n  set([min, max]:[number, number]) {\n    settings.value.dotSize = {min, max};\n  }\n})\nconst nodeSize = computed<number>({\n  get() { return isNumberRange(settings.value.dotSize) ? 3 : settings.value.dotSize},\n  set(v:number) {\n    settings.value.dotSize = v;\n  }\n})\n\n</script>\n\n<template>\n  <aes-selector\n    label=\"Node color\"\n    form-title=\"Node Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"nodeColor\"\n    :possible-aes-source-inputs=\"['nodeColor']\"\n    :without-fixed=\"\n      optionsState.components.nodeColor.selectorStates.length > 0\n    \"\n    @aes-update=\"(v:string|AestheticMappingCategorical, c:AesOption) => onUpdate(v, c, 'dotFill')\"\n  />\n  <aes-selector\n    label=\"Node shape\"\n    form-title=\"Node Shape Settings\"\n    form-back-title=\"Layers\"\n    type=\"dotShape\"\n    :selected=\"nodeShape\"\n    :possible-aes-source-inputs=\"['nodeShape']\"\n    :without-fixed=\"\n      optionsState.components.nodeShape.selectorStates.length > 0\n    \"\n    @aes-update=\"(v:DotShape|AestheticMappingCategorical, c:AesMappingOption) => onUpdateDot(v, c, 'dotShape')\"\n  />\n  <aes-selector\n    label=\"Line color\"\n    form-title=\"Line Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"lineColor\"\n    :possible-aes-source-inputs=\"['lineColor']\"\n    :without-fixed=\"\n      optionsState.components.lineColor.selectorStates.length > 0\n    \"\n    @aes-update=\"(v:string|AestheticMappingCategorical, c:AesOption) => onUpdate(v, c, 'lineColor')\"\n  />\n<!--  <div class=\"checkbox-item\">-->\n<!--    <pl-checkbox v-model=\"treeAlign\" @update:modelValue=\"(v) => {-->\n<!--      settings.mode = v ? 'useAllNodesAsLeaves' : 'normal';-->\n<!--    }\"/>-->\n<!--    <span>Align every node with table</span>-->\n<!--  </div>-->\n  <div>\n    <SliderRange v-if=\"optionsState.components.nodeSize.selectorStates.length > 0\"\n                 :min=\"3\"\n                 :max=\"10\"\n                 :breakpoints=\"true\"\n                 label=\"Node size range\"\n                 v-model=\"nodeSizeRange\"\n    />\n    <Slider v-else\n            :min=\"3\"\n            :max=\"10\"\n            :step=\"1\"\n            :breakpoints=\"true\"\n            label=\"Node size\"\n            v-model=\"nodeSize\"\n    />\n  </div>\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"leavesAlign\" @update:modelValue=\"(v) => {\n      settings.leavesMode = v ? 'alignLeavesToLine' : 'normal';\n    }\"/>\n    <span>Move leaves to the right</span>\n  </div>\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"showLegend\"/>\n    <span>Show legend</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","nodeColor","nodeShape","lineColor","onUpdate","value","colorOption","field","onUpdateDot","leavesAlign","ref","showLegend","v","nodeSizeRange","isNumberRange","min","max","nodeSize","_createVNode","AesSelector","_cache","c","_createElementVNode","_createBlock","_unref","SliderRange","$event","Slider","_hoisted_1","PlCheckbox","_hoisted_2"],"mappings":"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"}
+{"version":3,"file":"Dendro.vue.js","sources":["../../../../src/forms/LayersForm/Layer/Dendro.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../store';\nimport { computed, ref } from 'vue';\nimport AesSelector from '../AesSelector.vue';\nimport type { AestheticMappingCategorical } from '../../../dataBindAes';\nimport type {\n  AesMappingOption,\n  AesOption,\n  DotShape,\n} from '../../../components/AesSettings/types';\nimport type { DendroUIState } from '@milaboratories/pf-plots';\nimport { PlCheckbox, SliderRange, Slider } from '@platforma-sdk/ui-vue';\nimport { isNumberRange } from '../../../constantsCommon';\n\nconst store = useStore();\nconst layer = 'dendro';\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DendroUIState,\n);\n\nconst nodeColor = computed(() => settings.value.dotFill);\nconst nodeShape = computed(() => settings.value.dotShape);\nconst lineColor = computed(() => settings.value.lineColor);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'dotFill' | 'lineColor',\n) {\n  if (typeof value === 'string') {\n    store.value.reactive.layersSettings[layer][field] = value;\n  } else if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = {\n      type: colorOption.inputName,\n      value: colorOption.selectedSource,\n    };\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value !== 'string') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nfunction onUpdateDot(\n  value: DotShape | AestheticMappingCategorical,\n  colorOption: AesMappingOption,\n  field: 'dotShape',\n) {\n  if (typeof value === 'string') {\n    store.value.reactive.layersSettings[layer][field] = value;\n  } else if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = {\n      type: colorOption.inputName,\n      value: colorOption.selectedSource,\n    };\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value !== 'string') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\n// Tree mode 'useAllNodesAsLeaves' - align tree special way to be able to set table line opposite every node\n// const treeAlign = ref(settings.value.mode === 'useAllNodesAsLeaves');\nconst leavesAlign = ref(settings.value.leavesMode === 'alignLeavesToLine');\n\nconst showLegend = computed({\n  get() { return settings.value.showLegend ?? true; },\n  set(v) {\n    settings.value.showLegend = v;\n  },\n});\nconst nodeSizeRange = computed<[number, number]>({\n  get() { return isNumberRange(settings.value.dotSize) ? [settings.value.dotSize.min, settings.value.dotSize.max] : [3, 10]; },\n  set([min, max]: [number, number]) {\n    settings.value.dotSize = { min, max };\n  },\n});\nconst nodeSize = computed<number>({\n  get() { return isNumberRange(settings.value.dotSize) ? 3 : settings.value.dotSize; },\n  set(v: number) {\n    settings.value.dotSize = v;\n  },\n});\n\n</script>\n\n<template>\n  <AesSelector\n    label=\"Node color\"\n    form-title=\"Node Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"nodeColor\"\n    :possible-aes-source-inputs=\"['nodeColor']\"\n    :without-fixed=\"\n      optionsState.components.nodeColor.selectorStates.length > 0\n    \"\n    @aes-update=\"(v:string|AestheticMappingCategorical, c:AesOption) => onUpdate(v, c, 'dotFill')\"\n  />\n  <AesSelector\n    label=\"Node shape\"\n    form-title=\"Node Shape Settings\"\n    form-back-title=\"Layers\"\n    type=\"dotShape\"\n    :selected=\"nodeShape\"\n    :possible-aes-source-inputs=\"['nodeShape']\"\n    :without-fixed=\"\n      optionsState.components.nodeShape.selectorStates.length > 0\n    \"\n    @aes-update=\"(v:DotShape|AestheticMappingCategorical, c:AesMappingOption) => onUpdateDot(v, c, 'dotShape')\"\n  />\n  <AesSelector\n    label=\"Line color\"\n    form-title=\"Line Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"lineColor\"\n    :possible-aes-source-inputs=\"['lineColor']\"\n    :without-fixed=\"\n      optionsState.components.lineColor.selectorStates.length > 0\n    \"\n    @aes-update=\"(v:string|AestheticMappingCategorical, c:AesOption) => onUpdate(v, c, 'lineColor')\"\n  />\n  <!--  <div class=\"checkbox-item\">-->\n  <!--    <pl-checkbox v-model=\"treeAlign\" @update:modelValue=\"(v) => {-->\n  <!--      settings.mode = v ? 'useAllNodesAsLeaves' : 'normal';-->\n  <!--    }\"/>-->\n  <!--    <span>Align every node with table</span>-->\n  <!--  </div>-->\n  <div>\n    <SliderRange\n      v-if=\"optionsState.components.nodeSize.selectorStates.length > 0\"\n      v-model=\"nodeSizeRange\"\n      :min=\"3\"\n      :max=\"10\"\n      :breakpoints=\"true\"\n      label=\"Node size range\"\n    />\n    <Slider\n      v-else\n      v-model=\"nodeSize\"\n      :min=\"3\"\n      :max=\"10\"\n      :step=\"1\"\n      :breakpoints=\"true\"\n      label=\"Node size\"\n    />\n  </div>\n  <div class=\"checkbox-item\">\n    <PlCheckbox\n      v-model=\"leavesAlign\" @update:modelValue=\"(v) => {\n        settings.leavesMode = v ? 'alignLeavesToLine' : 'normal';\n      }\"\n    />\n    <span>Move leaves to the right</span>\n  </div>\n  <div class=\"checkbox-item\">\n    <PlCheckbox v-model=\"showLegend\"/>\n    <span>Show legend</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","nodeColor","nodeShape","lineColor","onUpdate","value","colorOption","field","onUpdateDot","leavesAlign","ref","showLegend","v","nodeSizeRange","isNumberRange","min","max","nodeSize","_createVNode","AesSelector","_cache","c","_createElementVNode","_createBlock","_unref","SliderRange","$event","Slider","_hoisted_1","PlCheckbox","_hoisted_2"],"mappings":"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"}

package/dist/forms/LayersForm/Layer/discrete/Bar.vue.js

@@ -51,21 +51,21 @@ const s = "bar", _ = /* @__PURE__ */ C({
         }, ["stop"]))
       }, [
         r(d(U), {
-          label: "Height",
-          options: g,
           modelValue: l.value.height,
-          "onUpdate:modelValue": e[2] || (e[2] = (t) => l.value.height = t)
+          "onUpdate:modelValue": e[2] || (e[2] = (t) => l.value.height = t),
+          label: "Height",
+          options: g
         }, null, 8, ["modelValue"])
       ]),
       r(d(E), {
+        modelValue: p.value,
+        "onUpdate:modelValue": e[4] || (e[4] = (t) => p.value = t),
         label: "Opacity",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: p.value,
-        "onUpdate:modelValue": e[4] || (e[4] = (t) => p.value = t)
+        measure: "%"
       }, null, 8, ["modelValue"])
     ], 64));
   }

package/dist/forms/LayersForm/Layer/discrete/Bar.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Bar.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Bar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport {PlDropdown, Slider} from \"@platforma-sdk/ui-vue\";\nimport { computed } from \"vue\";\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\nimport { DiscreteUIState } from \"@milaboratories/pf-plots\";\nimport {\n  DEFAULT_BLACK,\n  DEFAULT_WHITE,\n} from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\nimport {AesOption} from '../../../../components/AesSettings/types';\n\nconst store = useStore();\nconst layer = \"bar\";\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\n\nconst fillColor = computed(() =>\n  useDefaultAes(settings.value.fillColor, optionsState.value, DEFAULT_WHITE),\n);\nconst lineColor = computed(() =>\n  useDefaultAes(settings.value.lineColor, optionsState.value, DEFAULT_BLACK),\n);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: \"fillColor\" | \"lineColor\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value !== \"string\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nconst HEIGHT_OPTIONS: { text:string, value:string }[] = [\n  { text: \"Min\", value: \"min\" },\n  { text: \"Max\", value: \"max\" },\n  { text: \"Mean\", value: \"mean\" },\n  { text: \"Median\", value: \"median\" },\n];\n\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  }\n})\n</script>\n\n<template>\n  <aes-selector\n    label=\"Fill color\"\n    form-title=\"Fill Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"fillColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'fillColor')\"\n  />\n  <aes-selector\n    label=\"Stroke color\"\n    form-title=\"Stroke Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"stroke\"\n    :selected=\"lineColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'lineColor')\"\n  />\n  <div class=\"input-item\" @click.stop>\n    <pl-dropdown\n      label=\"Height\"\n      :options=\"HEIGHT_OPTIONS\"\n      v-model=\"settings.height\"\n    />\n  </div>\n  <Slider\n      label=\"Opacity\"\n      :min=\"0\"\n      :max=\"100\"\n      :step=\"1\"\n      :breakpoints=\"false\"\n      measure=\"%\"\n      v-model=\"opacity\"\n  />\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","fillColor","useDefaultAes","DEFAULT_WHITE","lineColor","DEFAULT_BLACK","onUpdate","value","colorOption","field","HEIGHT_OPTIONS","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_createElementVNode","_unref","PlDropdown","$event","Slider"],"mappings":";;;;;;AAeA,MAAMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GACpEK,IAAeD;AAAA,MACnB,MAAMH,EAAM,MAAM,SAAS;AAAA,IAAA,GAGvBK,IAAYF;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOG,CAAa;AAAA,IAAA,GAErEC,IAAYL;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOK,CAAa;AAAA,IAAA;AAG3E,aAASC,EACPC,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBZ,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEc,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEZ,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEc,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DX,EAAM,MAAM,SAAS,YAAYY,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,UAAMG,IAAkD;AAAA,MACtD,EAAE,MAAM,OAAO,OAAO,MAAA;AAAA,MACtB,EAAE,MAAM,OAAO,OAAO,MAAA;AAAA,MACtB,EAAE,MAAM,QAAQ,OAAO,OAAA;AAAA,MACvB,EAAE,MAAM,UAAU,OAAO,SAAA;AAAA,IAAS,GAG9BC,IAAUZ,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACc,MAAqB;AACzB,QAAAd,EAAS,MAAM,UAAUc,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUb,EAAA;AAAA,QACV,aAAUc,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMX,EAASU,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCJ,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUV,EAAA;AAAA,QACV,aAAUW,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMX,EAASU,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCC,EAMM,OAAA;AAAA,QAND,OAAM;AAAA,QAAc,2BAAD,MAAA;AAAA,QAAA,GAAW,CAAA,MAAA,CAAA;AAAA,MAAA;QACjCL,EAIEM,EAAAC,CAAA,GAAA;AAAA,UAHA,OAAM;AAAA,UACL,SAASV;AAAA,UACD,YAAAZ,EAAA,MAAS;AAAA,UAAT,uBAAAiB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAM,MAAAvB,EAAA,MAAS,SAAMuB;AAAA,QAAA;;MAG5BR,EAQEM,EAAAG,CAAA,GAAA;AAAA,QAPE,OAAM;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACd,SAAQ;AAAA,oBACCX,EAAA;AAAA,sDAAAA,EAAO,QAAAU;AAAA,MAAA;;;;"}
+{"version":3,"file":"Bar.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Bar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { PlDropdown, Slider } from '@platforma-sdk/ui-vue';\nimport { computed } from 'vue';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\nimport type { DiscreteUIState } from '@milaboratories/pf-plots';\nimport {\n  DEFAULT_BLACK,\n  DEFAULT_WHITE,\n} from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\nimport type { AesOption } from '../../../../components/AesSettings/types';\n\nconst store = useStore();\nconst layer = 'bar';\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\n\nconst fillColor = computed(() =>\n  useDefaultAes(settings.value.fillColor, optionsState.value, DEFAULT_WHITE),\n);\nconst lineColor = computed(() =>\n  useDefaultAes(settings.value.lineColor, optionsState.value, DEFAULT_BLACK),\n);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'fillColor' | 'lineColor',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value !== 'string') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nconst HEIGHT_OPTIONS: { text: string; value: string }[] = [\n  { text: 'Min', value: 'min' },\n  { text: 'Max', value: 'max' },\n  { text: 'Mean', value: 'mean' },\n  { text: 'Median', value: 'median' },\n];\n\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  },\n});\n</script>\n\n<template>\n  <AesSelector\n    label=\"Fill color\"\n    form-title=\"Fill Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"fillColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'fillColor')\"\n  />\n  <AesSelector\n    label=\"Stroke color\"\n    form-title=\"Stroke Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"stroke\"\n    :selected=\"lineColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'lineColor')\"\n  />\n  <div class=\"input-item\" @click.stop>\n    <PlDropdown\n      v-model=\"settings.height\"\n      label=\"Height\"\n      :options=\"HEIGHT_OPTIONS\"\n    />\n  </div>\n  <Slider\n    v-model=\"opacity\"\n    label=\"Opacity\"\n    :min=\"0\"\n    :max=\"100\"\n    :step=\"1\"\n    :breakpoints=\"false\"\n    measure=\"%\"\n  />\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","fillColor","useDefaultAes","DEFAULT_WHITE","lineColor","DEFAULT_BLACK","onUpdate","value","colorOption","field","HEIGHT_OPTIONS","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_createElementVNode","_unref","PlDropdown","$event","Slider"],"mappings":";;;;;;AAeA,MAAMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GACpEK,IAAeD;AAAA,MACnB,MAAMH,EAAM,MAAM,SAAS;AAAA,IAAA,GAGvBK,IAAYF;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOG,CAAa;AAAA,IAAA,GAErEC,IAAYL;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOK,CAAa;AAAA,IAAA;AAG3E,aAASC,EACPC,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBZ,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEc,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEZ,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEc,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DX,EAAM,MAAM,SAAS,YAAYY,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,UAAMG,IAAoD;AAAA,MACxD,EAAE,MAAM,OAAO,OAAO,MAAA;AAAA,MACtB,EAAE,MAAM,OAAO,OAAO,MAAA;AAAA,MACtB,EAAE,MAAM,QAAQ,OAAO,OAAA;AAAA,MACvB,EAAE,MAAM,UAAU,OAAO,SAAA;AAAA,IAAS,GAG9BC,IAAUZ,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACc,MAAqB;AACzB,QAAAd,EAAS,MAAM,UAAUc,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUb,EAAA;AAAA,QACV,aAAUc,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMX,EAASU,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCJ,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUV,EAAA;AAAA,QACV,aAAUW,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMX,EAASU,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCC,EAMM,OAAA;AAAA,QAND,OAAM;AAAA,QAAc,2BAAD,MAAA;AAAA,QAAA,GAAW,CAAA,MAAA,CAAA;AAAA,MAAA;QACjCL,EAIEM,EAAAC,CAAA,GAAA;AAAA,UAHS,YAAAtB,EAAA,MAAS;AAAA,UAAT,uBAAAiB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAM,MAAAvB,EAAA,MAAS,SAAMuB;AAAA,UACxB,OAAM;AAAA,UACL,SAASX;AAAA,QAAA;;MAGdG,EAQEM,EAAAG,CAAA,GAAA;AAAA,oBAPSX,EAAA;AAAA,sDAAAA,EAAO,QAAAU;AAAA,QAChB,OAAM;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACd,SAAQ;AAAA,MAAA;;;;"}

package/dist/forms/LayersForm/Layer/discrete/BinnedDots.vue.js

@@ -41,14 +41,14 @@ const D = { class: "checkbox-item" }, n = "binnedDots", H = /* @__PURE__ */ S({
         onAesUpdate: e[1] || (e[1] = (t, i) => m(t, i, "lineColor"))
       }, null, 8, ["selected"]),
       s(f(A), {
+        modelValue: p.value,
+        "onUpdate:modelValue": e[2] || (e[2] = (t) => p.value = t),
         label: "Opacity",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: p.value,
-        "onUpdate:modelValue": e[2] || (e[2] = (t) => p.value = t)
+        measure: "%"
       }, null, 8, ["modelValue"]),
       d("div", D, [
         s(f(U), {

package/dist/forms/LayersForm/Layer/discrete/BinnedDots.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"BinnedDots.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/BinnedDots.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport {Slider, PlCheckbox} from \"@platforma-sdk/ui-vue\";\nimport { computed } from \"vue\";\nimport type {AesOption} from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\nimport { DiscreteUIState } from \"@milaboratories/pf-plots\";\nimport {\n  DEFAULT_BLACK,\n  DEFAULT_WHITE,\n} from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\n\nconst store = useStore();\nconst layer = \"binnedDots\";\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\n\nconst fillColor = computed(() =>\n  useDefaultAes(settings.value.fillColor, optionsState.value, DEFAULT_WHITE),\n);\nconst lineColor = computed(() =>\n  useDefaultAes(settings.value.lineColor, optionsState.value, DEFAULT_BLACK),\n);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: \"fillColor\" | \"lineColor\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value !== \"string\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  }\n})\n</script>\n\n<template>\n  <aes-selector\n    label=\"Fill color\"\n    form-title=\"Fill Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"fillColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'fillColor')\"\n  />\n  <aes-selector\n    label=\"Stroke color\"\n    form-title=\"Stroke Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"stroke\"\n    :selected=\"lineColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'lineColor')\"\n  />\n  <Slider\n      label=\"Opacity\"\n      :min=\"0\"\n      :max=\"100\"\n      :step=\"1\"\n      :breakpoints=\"false\"\n      measure=\"%\"\n      v-model=\"opacity\"\n  />\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"settings.showOutliers\" />\n    <span>Show outliers</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","fillColor","useDefaultAes","DEFAULT_WHITE","lineColor","DEFAULT_BLACK","onUpdate","value","colorOption","field","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_unref","Slider","$event","_createElementVNode","_hoisted_1","PlCheckbox"],"mappings":";;;;;;sCAeMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GACpEK,IAAeD;AAAA,MACnB,MAAMH,EAAM,MAAM,SAAS;AAAA,IAAA,GAGvBK,IAAYF;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOG,CAAa;AAAA,IAAA,GAErEC,IAAYL;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOK,CAAa;AAAA,IAAA;AAG3E,aAASC,EACPC,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBZ,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEc,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEZ,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEc,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DX,EAAM,MAAM,SAAS,YAAYY,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,UAAMG,IAAUX,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACa,MAAqB;AACzB,QAAAb,EAAS,MAAM,UAAUa,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUZ,EAAA;AAAA,QACV,aAAUa,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMV,EAASS,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCJ,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUT,EAAA;AAAA,QACV,aAAUU,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMV,EAASS,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCJ,EAQEK,EAAAC,CAAA,GAAA;AAAA,QAPE,OAAM;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACd,SAAQ;AAAA,oBACCR,EAAA;AAAA,sDAAAA,EAAO,QAAAS;AAAA,MAAA;MAEpBC,EAGM,OAHNC,GAGM;AAAA,QAFJT,EAA+CK,EAAAK,CAAA,GAAA;AAAA,UAAzB,YAAAxB,EAAA,MAAS;AAAA,UAAT,uBAAAgB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAK,MAAArB,EAAA,MAAS,eAAYqB;AAAA,QAAA;QAC3CL,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAM,EAA0B,cAApB,iBAAa,EAAA;AAAA,MAAA;;;;"}
+{"version":3,"file":"BinnedDots.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/BinnedDots.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { Slider, PlCheckbox } from '@platforma-sdk/ui-vue';\nimport { computed } from 'vue';\nimport type { AesOption } from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\nimport type { DiscreteUIState } from '@milaboratories/pf-plots';\nimport {\n  DEFAULT_BLACK,\n  DEFAULT_WHITE,\n} from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\n\nconst store = useStore();\nconst layer = 'binnedDots';\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\n\nconst fillColor = computed(() =>\n  useDefaultAes(settings.value.fillColor, optionsState.value, DEFAULT_WHITE),\n);\nconst lineColor = computed(() =>\n  useDefaultAes(settings.value.lineColor, optionsState.value, DEFAULT_BLACK),\n);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'fillColor' | 'lineColor',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value !== 'string') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  },\n});\n</script>\n\n<template>\n  <AesSelector\n    label=\"Fill color\"\n    form-title=\"Fill Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"fillColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'fillColor')\"\n  />\n  <AesSelector\n    label=\"Stroke color\"\n    form-title=\"Stroke Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"stroke\"\n    :selected=\"lineColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'lineColor')\"\n  />\n  <Slider\n    v-model=\"opacity\"\n    label=\"Opacity\"\n    :min=\"0\"\n    :max=\"100\"\n    :step=\"1\"\n    :breakpoints=\"false\"\n    measure=\"%\"\n  />\n  <div class=\"checkbox-item\">\n    <PlCheckbox v-model=\"settings.showOutliers\" />\n    <span>Show outliers</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","fillColor","useDefaultAes","DEFAULT_WHITE","lineColor","DEFAULT_BLACK","onUpdate","value","colorOption","field","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_unref","Slider","$event","_createElementVNode","_hoisted_1","PlCheckbox"],"mappings":";;;;;;sCAeMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GACpEK,IAAeD;AAAA,MACnB,MAAMH,EAAM,MAAM,SAAS;AAAA,IAAA,GAGvBK,IAAYF;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOG,CAAa;AAAA,IAAA,GAErEC,IAAYL;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOK,CAAa;AAAA,IAAA;AAG3E,aAASC,EACPC,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBZ,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEc,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEZ,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEc,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DX,EAAM,MAAM,SAAS,YAAYY,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,UAAMG,IAAUX,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACa,MAAqB;AACzB,QAAAb,EAAS,MAAM,UAAUa,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUZ,EAAA;AAAA,QACV,aAAUa,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMV,EAASS,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCJ,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUT,EAAA;AAAA,QACV,aAAUU,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMV,EAASS,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCJ,EAQEK,EAAAC,CAAA,GAAA;AAAA,oBAPSR,EAAA;AAAA,sDAAAA,EAAO,QAAAS;AAAA,QAChB,OAAM;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACd,SAAQ;AAAA,MAAA;MAEVC,EAGM,OAHNC,GAGM;AAAA,QAFJT,EAA8CK,EAAAK,CAAA,GAAA;AAAA,UAAzB,YAAAxB,EAAA,MAAS;AAAA,UAAT,uBAAAgB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAK,MAAArB,EAAA,MAAS,eAAYqB;AAAA,QAAA;QAC1CL,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAM,EAA0B,cAApB,iBAAa,EAAA;AAAA,MAAA;;;;"}

package/dist/forms/LayersForm/Layer/discrete/Boxplot.vue.js

@@ -56,14 +56,14 @@ const D = { class: "checkbox-item" }, r = "box", h = /* @__PURE__ */ U({
         onAesUpdate: e[2] || (e[2] = (t, s) => A(t, s, "lineType"))
       }, null, 8, ["selected"]),
       n(f(N), {
+        modelValue: m.value,
+        "onUpdate:modelValue": e[3] || (e[3] = (t) => m.value = t),
         label: "Opacity",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: m.value,
-        "onUpdate:modelValue": e[3] || (e[3] = (t) => m.value = t)
+        measure: "%"
       }, null, 8, ["modelValue"]),
       y("div", D, [
         n(f(E), {

package/dist/forms/LayersForm/Layer/discrete/Boxplot.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Boxplot.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Boxplot.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { PlCheckbox, Slider } from \"@platforma-sdk/ui-vue\";\nimport { computed } from \"vue\";\nimport type {AesOption, DotShape, LineType} from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\nimport { DiscreteUIState } from \"@milaboratories/pf-plots\";\nimport {\n  DEFAULT_BLACK,\n  DEFAULT_WHITE,\n} from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\n\nconst store = useStore();\nconst layer = \"box\";\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\n\nconst fillColor = computed(() =>\n  useDefaultAes(settings.value.fillColor, optionsState.value, DEFAULT_WHITE),\n);\nconst lineColor = computed(() =>\n  useDefaultAes(settings.value.lineColor, optionsState.value, DEFAULT_BLACK),\n);\nconst outliersShape = computed(() => settings.value.dotShape);\nconst lineType = computed(() => settings.value.lineType);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: \"fillColor\" | \"lineColor\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value !== \"string\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nfunction onUpdateDot(\n  value: DotShape | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: \"dotShape\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value === \"object\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\nfunction onUpdateLineType(\n    value: LineType | AestheticMappingCategorical,\n    colorOption: AesOption,\n    field: \"lineType\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value === \"object\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  }\n})\n</script>\n\n<template>\n  <aes-selector\n    label=\"Fill color\"\n    form-title=\"Fill Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"fillColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'fillColor')\"\n  />\n  <aes-selector\n    label=\"Stroke color\"\n    form-title=\"Stroke Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"stroke\"\n    :selected=\"lineColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'lineColor')\"\n  />\n  <aes-selector\n      label=\"Line Type\"\n      form-title=\"Line Type Settings\"\n      form-back-title=\"Layers\"\n      type=\"lineType\"\n      :possible-aes-source-inputs=\"[]\"\n      :selected=\"lineType\"\n      @aes-update=\"(v, c) => onUpdateLineType(v, c, 'lineType')\"\n  />\n  <Slider\n      label=\"Opacity\"\n      :min=\"0\"\n      :max=\"100\"\n      :step=\"1\"\n      :breakpoints=\"false\"\n      measure=\"%\"\n      v-model=\"opacity\"\n  />\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"settings.showOutliers\" />\n    <span>Show outliers</span>\n  </div>\n  <aes-selector\n    v-if=\"settings.showOutliers\"\n    label=\"Outlier shape\"\n    form-title=\"Outlier Shape Settings\"\n    form-back-title=\"Layers\"\n    type=\"dotShape\"\n    :possible-aes-source-inputs=\"[]\"\n    :selected=\"outliersShape\"\n    @aes-update=\"(v, c) => onUpdateDot(v, c, 'dotShape')\"\n  />\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","fillColor","useDefaultAes","DEFAULT_WHITE","lineColor","DEFAULT_BLACK","outliersShape","lineType","onUpdate","value","colorOption","field","onUpdateDot","onUpdateLineType","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_unref","Slider","$event","_createElementVNode","_hoisted_1","PlCheckbox","_createBlock"],"mappings":"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"}
+{"version":3,"file":"Boxplot.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Boxplot.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { PlCheckbox, Slider } from '@platforma-sdk/ui-vue';\nimport { computed } from 'vue';\nimport type { AesOption, DotShape, LineType } from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\nimport type { DiscreteUIState } from '@milaboratories/pf-plots';\nimport {\n  DEFAULT_BLACK,\n  DEFAULT_WHITE,\n} from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\n\nconst store = useStore();\nconst layer = 'box';\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\n\nconst fillColor = computed(() =>\n  useDefaultAes(settings.value.fillColor, optionsState.value, DEFAULT_WHITE),\n);\nconst lineColor = computed(() =>\n  useDefaultAes(settings.value.lineColor, optionsState.value, DEFAULT_BLACK),\n);\nconst outliersShape = computed(() => settings.value.dotShape);\nconst lineType = computed(() => settings.value.lineType);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'fillColor' | 'lineColor',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value !== 'string') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nfunction onUpdateDot(\n  value: DotShape | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'dotShape',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value === 'object') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\nfunction onUpdateLineType(\n  value: LineType | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'lineType',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value === 'object') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  },\n});\n</script>\n\n<template>\n  <AesSelector\n    label=\"Fill color\"\n    form-title=\"Fill Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"fillColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'fillColor')\"\n  />\n  <AesSelector\n    label=\"Stroke color\"\n    form-title=\"Stroke Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"stroke\"\n    :selected=\"lineColor\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'lineColor')\"\n  />\n  <AesSelector\n    label=\"Line Type\"\n    form-title=\"Line Type Settings\"\n    form-back-title=\"Layers\"\n    type=\"lineType\"\n    :possible-aes-source-inputs=\"[]\"\n    :selected=\"lineType\"\n    @aes-update=\"(v, c) => onUpdateLineType(v, c, 'lineType')\"\n  />\n  <Slider\n    v-model=\"opacity\"\n    label=\"Opacity\"\n    :min=\"0\"\n    :max=\"100\"\n    :step=\"1\"\n    :breakpoints=\"false\"\n    measure=\"%\"\n  />\n  <div class=\"checkbox-item\">\n    <PlCheckbox v-model=\"settings.showOutliers\" />\n    <span>Show outliers</span>\n  </div>\n  <AesSelector\n    v-if=\"settings.showOutliers\"\n    label=\"Outlier shape\"\n    form-title=\"Outlier Shape Settings\"\n    form-back-title=\"Layers\"\n    type=\"dotShape\"\n    :possible-aes-source-inputs=\"[]\"\n    :selected=\"outliersShape\"\n    @aes-update=\"(v, c) => onUpdateDot(v, c, 'dotShape')\"\n  />\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","fillColor","useDefaultAes","DEFAULT_WHITE","lineColor","DEFAULT_BLACK","outliersShape","lineType","onUpdate","value","colorOption","field","onUpdateDot","onUpdateLineType","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_unref","Slider","$event","_createElementVNode","_hoisted_1","PlCheckbox","_createBlock"],"mappings":";;;;;;sCAeMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GACpEK,IAAeD;AAAA,MACnB,MAAMH,EAAM,MAAM,SAAS;AAAA,IAAA,GAGvBK,IAAYF;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOG,CAAa;AAAA,IAAA,GAErEC,IAAYL;AAAA,MAAS,MACzBG,EAAcJ,EAAS,MAAM,WAAWE,EAAa,OAAOK,CAAa;AAAA,IAAA,GAErEC,IAAgBP,EAAS,MAAMD,EAAS,MAAM,QAAQ,GACtDS,IAAWR,EAAS,MAAMD,EAAS,MAAM,QAAQ;AAEvD,aAASU,EACPC,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBd,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEgB,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEd,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEgB,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7Db,EAAM,MAAM,SAAS,YAAYc,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,aAASG,EACPH,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBd,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEgB,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEd,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEgB,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7Db,EAAM,MAAM,SAAS,YAAYc,EAAY,cAAc,IAAID;AAAA,IAEnE;AACA,aAASI,EACPJ,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBd,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEgB,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEd,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEgB,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7Db,EAAM,MAAM,SAAS,YAAYc,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,UAAMK,IAAUf,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACiB,MAAqB;AACzB,QAAAjB,EAAS,MAAM,UAAUiB,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUhB,EAAA;AAAA,QACV,aAAUiB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMZ,EAASW,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCJ,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUb,EAAA;AAAA,QACV,aAAUc,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMZ,EAASW,GAAGC,GAAC,WAAA;AAAA,MAAA;MAEtCJ,EAQEC,GAAA;AAAA,QAPA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,8BAA4B,CAAA;AAAA,QAC5B,UAAUV,EAAA;AAAA,QACV,aAAUW,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMP,EAAiBM,GAAGC,GAAC,UAAA;AAAA,MAAA;MAE9CJ,EAQEK,EAAAC,CAAA,GAAA;AAAA,oBAPSR,EAAA;AAAA,sDAAAA,EAAO,QAAAS;AAAA,QAChB,OAAM;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACd,SAAQ;AAAA,MAAA;MAEVC,EAGM,OAHNC,GAGM;AAAA,QAFJT,EAA8CK,EAAAK,CAAA,GAAA;AAAA,UAAzB,YAAA5B,EAAA,MAAS;AAAA,UAAT,uBAAAoB,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAK,MAAAzB,EAAA,MAAS,eAAYyB;AAAA,QAAA;QAC1CL,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAM,EAA0B,cAApB,iBAAa,EAAA;AAAA,MAAA;MAGb1B,EAAA,MAAS,qBADjB6B,EASEV,GAAA;AAAA;QAPA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,8BAA4B,CAAA;AAAA,QAC5B,UAAUX,EAAA;AAAA,QACV,aAAUY,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMR,EAAYO,GAAGC,GAAC,UAAA;AAAA,MAAA;;;;"}

package/dist/forms/LayersForm/Layer/discrete/Errorbar.vue.js

@@ -77,10 +77,10 @@ const n = "errorbar", R = /* @__PURE__ */ x({
         }, ["stop"]))
       }, [
         s(u(y), {
-          label: "Point value",
-          options: U,
           modelValue: a.value.pointsValues,
-          "onUpdate:modelValue": e[3] || (e[3] = (t) => a.value.pointsValues = t)
+          "onUpdate:modelValue": e[3] || (e[3] = (t) => a.value.pointsValues = t),
+          label: "Point value",
+          options: U
         }, null, 8, ["modelValue"])
       ]),
       f("div", {
@@ -89,21 +89,21 @@ const n = "errorbar", R = /* @__PURE__ */ x({
         }, ["stop"]))
       }, [
         s(u(y), {
-          label: "Interval",
-          options: k,
           modelValue: a.value.interval,
-          "onUpdate:modelValue": e[5] || (e[5] = (t) => a.value.interval = t)
+          "onUpdate:modelValue": e[5] || (e[5] = (t) => a.value.interval = t),
+          label: "Interval",
+          options: k
         }, null, 8, ["modelValue"])
       ]),
       s(u(B), {
+        modelValue: v.value,
+        "onUpdate:modelValue": e[7] || (e[7] = (t) => v.value = t),
         label: "Opacity",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: v.value,
-        "onUpdate:modelValue": e[7] || (e[7] = (t) => v.value = t)
+        measure: "%"
       }, null, 8, ["modelValue"])
     ], 64));
   }

package/dist/forms/LayersForm/Layer/discrete/Errorbar.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"Errorbar.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Errorbar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport {PlDropdown, Slider} from \"@platforma-sdk/ui-vue\";\nimport { computed } from \"vue\";\nimport type {AesOption, DotShape} from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\nimport { DiscreteUIState } from \"@milaboratories/pf-plots\";\nimport {DEFAULT_BLACK} from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\n\nconst store = useStore();\nconst layer = \"errorbar\";\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\nconst lineColor = computed(() =>\n  useDefaultAes(\n    settings.value.lineColor,\n    optionsState.value,\n    DEFAULT_BLACK,\n    true,\n  ),\n);\nconst dotFill = computed(() => useDefaultAes(\n    settings.value.dotFill,\n    optionsState.value,\n    DEFAULT_BLACK,\n    true\n  )\n);\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: \"lineColor\" | \"dotFill\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value !== \"string\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\nfunction onUpdateDot(\n    value: DotShape | AestheticMappingCategorical,\n    colorOption: AesOption,\n    field: \"dotShape\" | \"dotFill\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value === \"object\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nconst ERROR_OPTIONS: { text:string, value:string }[] = [\n  { text: \"Standard deviation\", value: \"sd\" },\n  { text: \"Standard error\", value: \"se\" },\n  { text: \"Confident interval\", value: \"ci\" },\n];\n\nconst POINT_OPTIONS: { text:string, value:string }[] = [\n  { text: \"Mean\", value: \"mean\" },\n  { text: \"Median\", value: \"median\" },\n];\n\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  }\n})\n</script>\n\n<template>\n  <aes-selector\n    label=\"Stroke color\"\n    form-title=\"Stroke Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"stroke\"\n    :selected=\"lineColor\"\n    :possible-aes-source-inputs=\"['secondaryGrouping']\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'lineColor')\"\n  />\n  <aes-selector\n      label=\"Dot fill\"\n      form-title=\"Dot Fill Settings\"\n      form-back-title=\"Layers\"\n      type=\"fill\"\n      :selected=\"dotFill\"\n      :possible-aes-source-inputs=\"['secondaryGrouping']\"\n      @aes-update=\"(v, c) => onUpdate(v, c, 'dotFill')\"\n  />\n  <aes-selector\n      label=\"Dot shape\"\n      form-title=\"Dot Shape Settings\"\n      form-back-title=\"Layers\"\n      type=\"dotShape\"\n      :selected=\"settings.dotShape\"\n      :possible-aes-source-inputs=\"['secondaryGrouping']\"\n      @aes-update=\"(v, c) => onUpdateDot(v, c, 'dotShape')\"\n  />\n  <div class=\"input-item\" @click.stop>\n    <pl-dropdown\n      label=\"Point value\"\n      :options=\"POINT_OPTIONS\"\n      v-model=\"settings.pointsValues\"\n    />\n  </div>\n  <div class=\"input-item\" @click.stop>\n    <pl-dropdown\n      label=\"Interval\"\n      :options=\"ERROR_OPTIONS\"\n      v-model=\"settings.interval\"\n    />\n  </div>\n  <Slider\n      label=\"Opacity\"\n      :min=\"0\"\n      :max=\"100\"\n      :step=\"1\"\n      :breakpoints=\"false\"\n      measure=\"%\"\n      v-model=\"opacity\"\n  />\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","lineColor","useDefaultAes","DEFAULT_BLACK","dotFill","onUpdate","value","colorOption","field","onUpdateDot","ERROR_OPTIONS","POINT_OPTIONS","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_createElementVNode","_unref","PlDropdown","$event","Slider"],"mappings":"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"}
+{"version":3,"file":"Errorbar.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Errorbar.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { PlDropdown, Slider } from '@platforma-sdk/ui-vue';\nimport { computed } from 'vue';\nimport type { AesOption, DotShape } from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\nimport type { DiscreteUIState } from '@milaboratories/pf-plots';\nimport { DEFAULT_BLACK } from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\n\nconst store = useStore();\nconst layer = 'errorbar';\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\nconst lineColor = computed(() =>\n  useDefaultAes(\n    settings.value.lineColor,\n    optionsState.value,\n    DEFAULT_BLACK,\n    true,\n  ),\n);\nconst dotFill = computed(() => useDefaultAes(\n  settings.value.dotFill,\n  optionsState.value,\n  DEFAULT_BLACK,\n  true,\n),\n);\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'lineColor' | 'dotFill',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value !== 'string') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\nfunction onUpdateDot(\n  value: DotShape | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'dotShape' | 'dotFill',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value === 'object') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\n\nconst ERROR_OPTIONS: { text: string; value: string }[] = [\n  { text: 'Standard deviation', value: 'sd' },\n  { text: 'Standard error', value: 'se' },\n  { text: 'Confident interval', value: 'ci' },\n];\n\nconst POINT_OPTIONS: { text: string; value: string }[] = [\n  { text: 'Mean', value: 'mean' },\n  { text: 'Median', value: 'median' },\n];\n\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  },\n});\n</script>\n\n<template>\n  <AesSelector\n    label=\"Stroke color\"\n    form-title=\"Stroke Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"stroke\"\n    :selected=\"lineColor\"\n    :possible-aes-source-inputs=\"['secondaryGrouping']\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'lineColor')\"\n  />\n  <AesSelector\n    label=\"Dot fill\"\n    form-title=\"Dot Fill Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"dotFill\"\n    :possible-aes-source-inputs=\"['secondaryGrouping']\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'dotFill')\"\n  />\n  <AesSelector\n    label=\"Dot shape\"\n    form-title=\"Dot Shape Settings\"\n    form-back-title=\"Layers\"\n    type=\"dotShape\"\n    :selected=\"settings.dotShape\"\n    :possible-aes-source-inputs=\"['secondaryGrouping']\"\n    @aes-update=\"(v, c) => onUpdateDot(v, c, 'dotShape')\"\n  />\n  <div class=\"input-item\" @click.stop>\n    <PlDropdown\n      v-model=\"settings.pointsValues\"\n      label=\"Point value\"\n      :options=\"POINT_OPTIONS\"\n    />\n  </div>\n  <div class=\"input-item\" @click.stop>\n    <PlDropdown\n      v-model=\"settings.interval\"\n      label=\"Interval\"\n      :options=\"ERROR_OPTIONS\"\n    />\n  </div>\n  <Slider\n    v-model=\"opacity\"\n    label=\"Opacity\"\n    :min=\"0\"\n    :max=\"100\"\n    :step=\"1\"\n    :breakpoints=\"false\"\n    measure=\"%\"\n  />\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","lineColor","useDefaultAes","DEFAULT_BLACK","dotFill","onUpdate","value","colorOption","field","onUpdateDot","ERROR_OPTIONS","POINT_OPTIONS","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_createElementVNode","_unref","PlDropdown","$event","Slider"],"mappings":"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"}

package/dist/forms/LayersForm/Layer/discrete/JitteredDots.vue.js

@@ -42,14 +42,14 @@ const U = { class: "checkbox-item" }, s = "jitteredDots", h = /* @__PURE__ */ S(
         onAesUpdate: e[1] || (e[1] = (t, n) => y(t, n, "dotShape"))
       }, null, 8, ["selected"]),
       r(p(k), {
+        modelValue: u.value,
+        "onUpdate:modelValue": e[2] || (e[2] = (t) => u.value = t),
         label: "Opacity",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: u.value,
-        "onUpdate:modelValue": e[2] || (e[2] = (t) => u.value = t)
+        measure: "%"
       }, null, 8, ["modelValue"]),
       d("div", U, [
         r(p(A), {

package/dist/forms/LayersForm/Layer/discrete/JitteredDots.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"JitteredDots.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/JitteredDots.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport {Slider, PlCheckbox} from \"@platforma-sdk/ui-vue\";\nimport { computed } from \"vue\";\nimport type {AesOption, DotShape} from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport {\n  useDefaultAes,\n} from './utils';\nimport { DiscreteUIState } from \"@milaboratories/pf-plots\";\nimport {DEFAULT_BLACK} from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\n\nconst store = useStore();\nconst layer = \"jitteredDots\";\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\n\nconst dotFill = computed(() =>\n  useDefaultAes(settings.value.dotFill, optionsState.value, DEFAULT_BLACK),\n);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: \"dotFill\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value !== \"string\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\nfunction onUpdateDot(\n    value: DotShape | AestheticMappingCategorical,\n    colorOption: AesOption,\n    field: \"dotShape\",\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === \"dataCategorical\" && typeof value === \"object\") {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  }\n})\n</script>\n\n<template>\n  <aes-selector\n      label=\"Fill color\"\n      form-title=\"Fill Color Settings\"\n      form-back-title=\"Layers\"\n      type=\"fill\"\n      :selected=\"dotFill\"\n      @aes-update=\"(v, c) => onUpdate(v, c, 'dotFill')\"\n  />\n  <aes-selector\n      label=\"Dot shape\"\n      form-title=\"Dot Shape Settings\"\n      form-back-title=\"Layers\"\n      type=\"dotShape\"\n      :selected=\"settings.dotShape\"\n      @aes-update=\"(v, c) => onUpdateDot(v, c, 'dotShape')\"\n  />\n  <Slider\n      label=\"Opacity\"\n      :min=\"0\"\n      :max=\"100\"\n      :step=\"1\"\n      :breakpoints=\"false\"\n      measure=\"%\"\n      v-model=\"opacity\"\n  />\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"settings.showOutliers\" />\n    <span>Show outliers</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","dotFill","useDefaultAes","DEFAULT_BLACK","onUpdate","value","colorOption","field","onUpdateDot","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_unref","Slider","$event","_createElementVNode","_hoisted_1","PlCheckbox"],"mappings":";;;;;;sCAcMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GACpEK,IAAeD;AAAA,MACnB,MAAMH,EAAM,MAAM,SAAS;AAAA,IAAA,GAGvBK,IAAUF;AAAA,MAAS,MACvBG,EAAcJ,EAAS,MAAM,SAASE,EAAa,OAAOG,CAAa;AAAA,IAAA;AAGzE,aAASC,EACPC,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DT,EAAM,MAAM,SAAS,YAAYU,EAAY,cAAc,IAAID;AAAA,IAEnE;AACA,aAASG,EACLH,GACAC,GACAC,GACF;AACA,MAAID,EAAY,SAAS,oBACvBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DT,EAAM,MAAM,SAAS,YAAYU,EAAY,cAAc,IAAID;AAAA,IAEnE;AACA,UAAMI,IAAUV,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACY,MAAqB;AACzB,QAAAZ,EAAS,MAAM,UAAUY,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAOEC,GAAA;AAAA,QANE,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUX,EAAA;AAAA,QACV,aAAUY,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMX,EAASU,GAAGC,GAAC,SAAA;AAAA,MAAA;MAExCJ,EAOEC,GAAA;AAAA,QANE,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUd,EAAA,MAAS;AAAA,QACnB,aAAUe,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMP,EAAYM,GAAGC,GAAC,UAAA;AAAA,MAAA;MAE3CJ,EAQEK,EAAAC,CAAA,GAAA;AAAA,QAPE,OAAM;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACd,SAAQ;AAAA,oBACCR,EAAA;AAAA,sDAAAA,EAAO,QAAAS;AAAA,MAAA;MAEpBC,EAGM,OAHNC,GAGM;AAAA,QAFJT,EAA+CK,EAAAK,CAAA,GAAA;AAAA,UAAzB,YAAAvB,EAAA,MAAS;AAAA,UAAT,uBAAAe,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAK,MAAApB,EAAA,MAAS,eAAYoB;AAAA,QAAA;QAC3CL,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAM,EAA0B,cAApB,iBAAa,EAAA;AAAA,MAAA;;;;"}
+{"version":3,"file":"JitteredDots.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/JitteredDots.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { Slider, PlCheckbox } from '@platforma-sdk/ui-vue';\nimport { computed } from 'vue';\nimport type { AesOption, DotShape } from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport {\n  useDefaultAes,\n} from './utils';\nimport type { DiscreteUIState } from '@milaboratories/pf-plots';\nimport { DEFAULT_BLACK } from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\n\nconst store = useStore();\nconst layer = 'jitteredDots';\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\nconst optionsState = computed(\n  () => store.value.reactive.optionsState as DiscreteUIState,\n);\n\nconst dotFill = computed(() =>\n  useDefaultAes(settings.value.dotFill, optionsState.value, DEFAULT_BLACK),\n);\n\nfunction onUpdate(\n  value: string | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'dotFill',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value !== 'string') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\nfunction onUpdateDot(\n  value: DotShape | AestheticMappingCategorical,\n  colorOption: AesOption,\n  field: 'dotShape',\n) {\n  if (colorOption.type === 'dataCategorical') {\n    store.value.reactive.layersSettings[layer][field] = { type: colorOption.inputName };\n  } else {\n    store.value.reactive.layersSettings[layer][field] = value;\n  }\n  if (colorOption.type === 'dataCategorical' && typeof value === 'object') {\n    store.value.reactive.dataBindAes[colorOption.selectedSource] = value;\n  }\n}\nconst opacity = computed({\n  get: () => settings.value.opacity * 100,\n  set: (newValue: number) => {\n    settings.value.opacity = newValue / 100;\n  },\n});\n</script>\n\n<template>\n  <AesSelector\n    label=\"Fill color\"\n    form-title=\"Fill Color Settings\"\n    form-back-title=\"Layers\"\n    type=\"fill\"\n    :selected=\"dotFill\"\n    @aes-update=\"(v, c) => onUpdate(v, c, 'dotFill')\"\n  />\n  <AesSelector\n    label=\"Dot shape\"\n    form-title=\"Dot Shape Settings\"\n    form-back-title=\"Layers\"\n    type=\"dotShape\"\n    :selected=\"settings.dotShape\"\n    @aes-update=\"(v, c) => onUpdateDot(v, c, 'dotShape')\"\n  />\n  <Slider\n    v-model=\"opacity\"\n    label=\"Opacity\"\n    :min=\"0\"\n    :max=\"100\"\n    :step=\"1\"\n    :breakpoints=\"false\"\n    measure=\"%\"\n  />\n  <div class=\"checkbox-item\">\n    <PlCheckbox v-model=\"settings.showOutliers\" />\n    <span>Show outliers</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","dotFill","useDefaultAes","DEFAULT_BLACK","onUpdate","value","colorOption","field","onUpdateDot","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_unref","Slider","$event","_createElementVNode","_hoisted_1","PlCheckbox"],"mappings":";;;;;;sCAcMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GACpEK,IAAeD;AAAA,MACnB,MAAMH,EAAM,MAAM,SAAS;AAAA,IAAA,GAGvBK,IAAUF;AAAA,MAAS,MACvBG,EAAcJ,EAAS,MAAM,SAASE,EAAa,OAAOG,CAAa;AAAA,IAAA;AAGzE,aAASC,EACPC,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DT,EAAM,MAAM,SAAS,YAAYU,EAAY,cAAc,IAAID;AAAA,IAEnE;AACA,aAASG,EACPH,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAI,EAAE,MAAMD,EAAY,UAAA,IAExEV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DT,EAAM,MAAM,SAAS,YAAYU,EAAY,cAAc,IAAID;AAAA,IAEnE;AACA,UAAMI,IAAUV,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACY,MAAqB;AACzB,QAAAZ,EAAS,MAAM,UAAUY,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUX,EAAA;AAAA,QACV,aAAUY,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMX,EAASU,GAAGC,GAAC,SAAA;AAAA,MAAA;MAEtCJ,EAOEC,GAAA;AAAA,QANA,OAAM;AAAA,QACN,cAAW;AAAA,QACX,mBAAgB;AAAA,QAChB,MAAK;AAAA,QACJ,UAAUd,EAAA,MAAS;AAAA,QACnB,aAAUe,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAGC,GAAGC,MAAMP,EAAYM,GAAGC,GAAC,UAAA;AAAA,MAAA;MAEzCJ,EAQEK,EAAAC,CAAA,GAAA;AAAA,oBAPSR,EAAA;AAAA,sDAAAA,EAAO,QAAAS;AAAA,QAChB,OAAM;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACd,SAAQ;AAAA,MAAA;MAEVC,EAGM,OAHNC,GAGM;AAAA,QAFJT,EAA8CK,EAAAK,CAAA,GAAA;AAAA,UAAzB,YAAAvB,EAAA,MAAS;AAAA,UAAT,uBAAAe,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAK,MAAApB,EAAA,MAAS,eAAYoB;AAAA,QAAA;QAC1CL,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAM,EAA0B,cAApB,iBAAa,EAAA;AAAA,MAAA;;;;"}