@milaboratories/graph-maker 1.1.176 → 1.1.178

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":"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"}

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;;;;"}

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

@@ -85,10 +85,10 @@ const n = "line", K = /* @__PURE__ */ A({
         }, ["stop"]))
       }, [
         i(p(F), {
-          label: "Point value",
-          options: U,
           modelValue: o.value.pointsValues,
-          "onUpdate:modelValue": e[4] || (e[4] = (t) => o.value.pointsValues = t)
+          "onUpdate:modelValue": e[4] || (e[4] = (t) => o.value.pointsValues = t),
+          label: "Point value",
+          options: U
         }, null, 8, ["modelValue"])
       ]),
       v("div", {
@@ -97,20 +97,20 @@ const n = "line", K = /* @__PURE__ */ A({
         }, ["stop"]))
       }, [
         i(p(B), {
-          label: "Empty group value",
           modelValue: o.value.emptyGroupValue,
-          "onUpdate:modelValue": e[6] || (e[6] = (t) => o.value.emptyGroupValue = t)
+          "onUpdate:modelValue": e[6] || (e[6] = (t) => o.value.emptyGroupValue = t),
+          label: "Empty group value"
         }, null, 8, ["modelValue"])
       ]),
       i(p(G), {
+        modelValue: y.value,
+        "onUpdate:modelValue": e[8] || (e[8] = (t) => y.value = t),
         label: "Opacity",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: y.value,
-        "onUpdate:modelValue": e[8] || (e[8] = (t) => y.value = t)
+        measure: "%"
       }, null, 8, ["modelValue"])
     ], 64));
   }

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

@@ -1 +1 @@
-{"version":3,"file":"Line.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Line.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { PlDropdown, Slider, PlNumberField } from '@platforma-sdk/ui-vue';\nimport { computed } from 'vue';\nimport type {\n  AesOption,\n  DotShape\n} from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\n\nimport { DiscreteUIState } from '@milaboratories/pf-plots';\nimport { DEFAULT_BLACK } from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\nimport { LineType } from '../../../../components/AesSettings/types';\n\nconst store = useStore();\nconst layer = 'line';\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);\nconst lineType = computed(() => settings.value.lineType);\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}\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}\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 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=\"Line Type\"\n    form-title=\"Line Type Settings\"\n    form-back-title=\"Layers\"\n    type=\"lineType\"\n    :possible-aes-source-inputs=\"['secondaryGrouping']\"\n    :selected=\"lineType\"\n    @aes-update=\"(v, c) => onUpdateLineType(v, c, 'lineType')\"\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    <PlNumberField\n      label=\"Empty group value\"\n      v-model=\"settings.emptyGroupValue\"\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","lineType","onUpdate","value","colorOption","field","onUpdateDot","onUpdateLineType","POINT_OPTIONS","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_createElementVNode","_unref","PlDropdown","$event","PlNumberField","Slider"],"mappings":"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"}
+{"version":3,"file":"Line.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Line.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { PlDropdown, Slider, PlNumberField } from '@platforma-sdk/ui-vue';\nimport { computed } from 'vue';\nimport type {\n  AesOption,\n  DotShape,\n} from '../../../../components/AesSettings/types';\nimport type { AestheticMappingCategorical } from '../../../../dataBindAes';\nimport { useDefaultAes } from './utils';\n\nimport type { DiscreteUIState } from '@milaboratories/pf-plots';\nimport { DEFAULT_BLACK } from '../../../../constantsAesthetic';\nimport AesSelector from '../../AesSelector.vue';\nimport type { LineType } from '../../../../components/AesSettings/types';\n\nconst store = useStore();\nconst layer = 'line';\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);\nconst lineType = computed(() => settings.value.lineType);\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}\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}\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 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=\"Line Type\"\n    form-title=\"Line Type Settings\"\n    form-back-title=\"Layers\"\n    type=\"lineType\"\n    :possible-aes-source-inputs=\"['secondaryGrouping']\"\n    :selected=\"lineType\"\n    @aes-update=\"(v, c) => onUpdateLineType(v, c, 'lineType')\"\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    <PlNumberField\n      v-model=\"settings.emptyGroupValue\"\n      label=\"Empty group value\"\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","lineType","onUpdate","value","colorOption","field","onUpdateDot","onUpdateLineType","POINT_OPTIONS","opacity","newValue","_createVNode","AesSelector","_cache","v","c","_createElementVNode","_unref","PlDropdown","$event","PlNumberField","Slider"],"mappings":"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"}

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

@@ -12,14 +12,14 @@ const g = { class: "checkbox-item" }, y = "logo", z = /* @__PURE__ */ i({
     });
     return (a, e) => (d(), p(c, null, [
       r(s(f), {
+        modelValue: t.value,
+        "onUpdate:modelValue": e[0] || (e[0] = (l) => t.value = l),
         label: "Opacity",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: t.value,
-        "onUpdate:modelValue": e[0] || (e[0] = (l) => t.value = l)
+        measure: "%"
       }, null, 8, ["modelValue"]),
       m("div", g, [
         r(s(V), {

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

@@ -1 +1 @@
-{"version":3,"file":"Logo.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Logo.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { computed } from \"vue\";\nimport { PlCheckbox, Slider } from '@platforma-sdk/ui-vue';\n\nconst store = useStore();\nconst layer = \"logo\";\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\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  <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.normalize\" />\n    <span>Normalize</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","opacity","newValue","_createVNode","_unref","Slider","$event","_createElementVNode","_hoisted_1","PlCheckbox","_cache"],"mappings":";;;sCAMMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GAEpEK,IAAUD,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACG,MAAqB;AACzB,QAAAH,EAAS,MAAM,UAAUG,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAQEC,EAAAC,CAAA,GAAA;AAAA,QAPE,OAAM;AAAA,QACL,KAAK;AAAA,QACL,KAAK;AAAA,QACL,MAAM;AAAA,QACN,aAAa;AAAA,QACd,SAAQ;AAAA,oBACCJ,EAAA;AAAA,sDAAAA,EAAO,QAAAK;AAAA,MAAA;MAEpBC,EAGM,OAHNC,GAGM;AAAA,QAFJL,EAA4CC,EAAAK,CAAA,GAAA;AAAA,UAAtB,YAAAV,EAAA,MAAS;AAAA,UAAT,uBAAAW,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAJ,MAAAP,EAAA,MAAS,YAASO;AAAA,QAAA;QACxCI,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAH,EAAsB,cAAhB,aAAS,EAAA;AAAA,MAAA;;;;"}
+{"version":3,"file":"Logo.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Logo.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { computed } from 'vue';\nimport { PlCheckbox, Slider } from '@platforma-sdk/ui-vue';\n\nconst store = useStore();\nconst layer = 'logo';\nconst settings = computed(() => store.value.reactive.layersSettings[layer]);\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  <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.normalize\" />\n    <span>Normalize</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","opacity","newValue","_createVNode","_unref","Slider","$event","_createElementVNode","_hoisted_1","PlCheckbox","_cache"],"mappings":";;;sCAMMA,IAAQ;;;AADd,UAAMC,IAAQC,EAAA,GAERC,IAAWC,EAAS,MAAMH,EAAM,MAAM,SAAS,eAAeD,CAAK,CAAC,GAEpEK,IAAUD,EAAS;AAAA,MACvB,KAAK,MAAMD,EAAS,MAAM,UAAU;AAAA,MACpC,KAAK,CAACG,MAAqB;AACzB,QAAAH,EAAS,MAAM,UAAUG,IAAW;AAAA,MACtC;AAAA,IAAA,CACD;;MAICC,EAQEC,EAAAC,CAAA,GAAA;AAAA,oBAPSJ,EAAA;AAAA,sDAAAA,EAAO,QAAAK;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,QAFJL,EAA2CC,EAAAK,CAAA,GAAA;AAAA,UAAtB,YAAAV,EAAA,MAAS;AAAA,UAAT,uBAAAW,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA,CAAAJ,MAAAP,EAAA,MAAS,YAASO;AAAA,QAAA;QACvCI,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAAH,EAAsB,cAAhB,aAAS,EAAA;AAAA,MAAA;;;;"}

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

@@ -46,14 +46,14 @@ const o = "sina", N = /* @__PURE__ */ y({
         onAesUpdate: e[1] || (e[1] = (t, r) => f(t, r, "dotShape"))
       }, null, 8, ["selected"]),
       n(b(U), {
+        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"])
     ], 64));
   }

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

@@ -1 +1 @@
-{"version":3,"file":"Sina.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Sina.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { computed } from \"vue\";\nimport type {\n  AesOption,\n  DotShape,\n} 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';\nimport {Slider} from \"@platforma-sdk/ui-vue\";\n\nconst store = useStore();\nconst layer = \"sina\";\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] = {\n      type: colorOption.inputName,\n    };\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] = {\n      type: colorOption.inputName,\n    };\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=\"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</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"],"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,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;AAAA,QAClD,MAAMD,EAAY;AAAA,MAAA,IAGpBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DT,EAAM,MAAM,SAAS,YAAYU,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,aAASG,EACPH,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAI;AAAA,QAClD,MAAMD,EAAY;AAAA,MAAA,IAGpBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DT,EAAM,MAAM,SAAS,YAAYU,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,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,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;;;;"}
+{"version":3,"file":"Sina.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/Sina.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\nimport { computed } from 'vue';\nimport type {\n  AesOption,\n  DotShape,\n} 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';\nimport { Slider } from '@platforma-sdk/ui-vue';\n\nconst store = useStore();\nconst layer = 'sina';\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] = {\n      type: colorOption.inputName,\n    };\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] = {\n      type: colorOption.inputName,\n    };\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=\"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</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"],"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,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;AAAA,QAClD,MAAMD,EAAY;AAAA,MAAA,IAGpBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DT,EAAM,MAAM,SAAS,YAAYU,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,aAASG,EACPH,GACAC,GACAC,GACA;AACA,MAAID,EAAY,SAAS,oBACvBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAI;AAAA,QAClD,MAAMD,EAAY;AAAA,MAAA,IAGpBV,EAAM,MAAM,SAAS,eAAeD,CAAK,EAAEY,CAAK,IAAIF,GAElDC,EAAY,SAAS,qBAAqB,OAAOD,KAAU,aAC7DT,EAAM,MAAM,SAAS,YAAYU,EAAY,cAAc,IAAID;AAAA,IAEnE;AAEA,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;;;;"}

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

@@ -59,31 +59,31 @@ const L = { class: "checkbox-item" }, M = { class: "checkbox-item" }, m = "stack
         }, ["stop"]))
       }, [
         o(n(F), {
-          label: "Height",
-          options: k,
           modelValue: t.value.height,
-          "onUpdate:modelValue": e[2] || (e[2] = (l) => t.value.height = l)
+          "onUpdate:modelValue": e[2] || (e[2] = (l) => t.value.height = l),
+          label: "Height",
+          options: k
         }, null, 8, ["modelValue"])
       ]),
       o(n(c), {
+        modelValue: v.value,
+        "onUpdate:modelValue": e[4] || (e[4] = (l) => v.value = l),
         label: "Opacity of bars",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: v.value,
-        "onUpdate:modelValue": e[4] || (e[4] = (l) => v.value = l)
+        measure: "%"
       }, null, 8, ["modelValue"]),
       o(n(c), {
+        modelValue: f.value,
+        "onUpdate:modelValue": e[5] || (e[5] = (l) => f.value = l),
         label: "Opacity of areas",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: f.value,
-        "onUpdate:modelValue": e[5] || (e[5] = (l) => f.value = l)
+        measure: "%"
       }, null, 8, ["modelValue"]),
       i("div", L, [
         o(n(V), {

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

@@ -1 +1 @@
-{"version":3,"file":"StackedArea.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/StackedArea.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\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';\nimport { PlCheckbox, Slider, PlDropdown } from '@platforma-sdk/ui-vue';\n\nconst store = useStore();\nconst layer = \"stackedArea\";\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] = {\n      type: colorOption.inputName,\n    };\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: \"Sum\", value: \"sum\" },\n  { text: \"Min\", value: \"min\" },\n  { text: \"Max\", value: \"max\" },\n  { text: \"Mean\", value: \"mean\" },\n  { text: \"Median\", value: \"median\" },\n];\n\nconst barOpacity = computed({\n  get: () => settings.value.barsOpacity * 100,\n  set: (newValue: number) => {\n    settings.value.barsOpacity = newValue / 100;\n  }\n});\nconst areaOpacity = computed({\n  get: () => settings.value.areaOpacity * 100,\n  set: (newValue: number) => {\n    settings.value.areaOpacity = 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 of bars\"\n      :min=\"0\"\n      :max=\"100\"\n      :step=\"1\"\n      :breakpoints=\"false\"\n      measure=\"%\"\n      v-model=\"barOpacity\"\n  />\n  <Slider\n      label=\"Opacity of areas\"\n      :min=\"0\"\n      :max=\"100\"\n      :step=\"1\"\n      :breakpoints=\"false\"\n      measure=\"%\"\n      v-model=\"areaOpacity\"\n  />\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"settings.normalize\" />\n    <span>Normalize</span>\n  </div>\n  <div class=\"checkbox-item\">\n    <pl-checkbox v-model=\"settings.showBars\" />\n    <span>Show bars</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","fillColor","useDefaultAes","DEFAULT_WHITE","lineColor","DEFAULT_BLACK","onUpdate","value","colorOption","field","HEIGHT_OPTIONS","barOpacity","newValue","areaOpacity","_createVNode","AesSelector","_cache","v","c","_createElementVNode","_unref","PlDropdown","$event","Slider","_hoisted_1","PlCheckbox","_hoisted_2"],"mappings":"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"}
+{"version":3,"file":"StackedArea.vue.js","sources":["../../../../../src/forms/LayersForm/Layer/discrete/StackedArea.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { useStore } from '../../../../store';\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';\nimport { PlCheckbox, Slider, PlDropdown } from '@platforma-sdk/ui-vue';\n\nconst store = useStore();\nconst layer = 'stackedArea';\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] = {\n      type: colorOption.inputName,\n    };\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: 'Sum', value: 'sum' },\n  { text: 'Min', value: 'min' },\n  { text: 'Max', value: 'max' },\n  { text: 'Mean', value: 'mean' },\n  { text: 'Median', value: 'median' },\n];\n\nconst barOpacity = computed({\n  get: () => settings.value.barsOpacity * 100,\n  set: (newValue: number) => {\n    settings.value.barsOpacity = newValue / 100;\n  },\n});\nconst areaOpacity = computed({\n  get: () => settings.value.areaOpacity * 100,\n  set: (newValue: number) => {\n    settings.value.areaOpacity = 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=\"barOpacity\"\n    label=\"Opacity of bars\"\n    :min=\"0\"\n    :max=\"100\"\n    :step=\"1\"\n    :breakpoints=\"false\"\n    measure=\"%\"\n  />\n  <Slider\n    v-model=\"areaOpacity\"\n    label=\"Opacity of areas\"\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.normalize\" />\n    <span>Normalize</span>\n  </div>\n  <div class=\"checkbox-item\">\n    <PlCheckbox v-model=\"settings.showBars\" />\n    <span>Show bars</span>\n  </div>\n</template>\n"],"names":["layer","store","useStore","settings","computed","optionsState","fillColor","useDefaultAes","DEFAULT_WHITE","lineColor","DEFAULT_BLACK","onUpdate","value","colorOption","field","HEIGHT_OPTIONS","barOpacity","newValue","areaOpacity","_createVNode","AesSelector","_cache","v","c","_createElementVNode","_unref","PlDropdown","$event","Slider","_hoisted_1","PlCheckbox","_hoisted_2"],"mappings":"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"}

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

@@ -54,21 +54,21 @@ const M = { class: "checkbox-item" }, m = "stackedBar", w = /* @__PURE__ */ C({
         }, ["stop"]))
       }, [
         n(u(E), {
-          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"])
       ]),
       n(u(F), {
+        modelValue: v.value,
+        "onUpdate:modelValue": e[4] || (e[4] = (t) => v.value = t),
         label: "Opacity",
         min: 0,
         max: 100,
         step: 1,
         breakpoints: !1,
-        measure: "%",
-        modelValue: v.value,
-        "onUpdate:modelValue": e[4] || (e[4] = (t) => v.value = t)
+        measure: "%"
       }, null, 8, ["modelValue"]),
       s("div", M, [
         n(u(L), {