@milaboratories/graph-maker 1.1.177 → 1.1.179

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

@@ -1,21 +1,21 @@
 export type AesButtonProps = {
     data: {
-        type: "stroke";
+        type: 'stroke';
         value: string;
     } | {
-        type: "fill";
+        type: 'fill';
         value: string;
     } | {
-        type: "lineType";
+        type: 'lineType';
         value: string;
     } | {
-        type: "dotShape";
+        type: 'dotShape';
         value: string;
     } | {
-        type: "size";
+        type: 'size';
         value: number;
     } | {
-        type: "data";
+        type: 'data';
         value: null;
     };
 };

package/dist/components/AesButton.vue.js

@@ -16,8 +16,8 @@ const b = {
       icon__empty: i && t.data.value.toLowerCase() === "transparent"
     })), r = s(() => t.data.type === "fill" ? { "background-color": t.data.value } : t.data.type === "stroke" && !l.value.icon__empty && !l.value.icon__white ? { "border-color": t.data.value } : {});
     return (u, w) => (a(), o("div", {
-      class: "ui-aes-button",
-      ref: (d) => u.$emit("ref", d)
+      ref: (d) => u.$emit("ref", d),
+      class: "ui-aes-button"
     }, [
       m(C, { class: "ui-multiselect-button__contour" }),
       e.data.type === "fill" ? (a(), o("div", {

package/dist/components/AesButton.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"AesButton.vue.js","sources":["../../src/components/AesButton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from \"vue\";\nimport ColorsIcon from \"../icons/ColorsIcon.vue\";\nimport DoubleContour from \"./DoubleContourTemp.vue\";\n\nexport type AesButtonProps = {data: {\n  type: \"stroke\";\n  value: string;\n}\n  | {\n  type: \"fill\";\n  value: string;\n}\n  | {\n  type: \"lineType\";\n  value: string;\n}\n  | {\n  type: \"dotShape\";\n  value: string;\n}\n  | {\n  type: \"size\";\n  value: number;\n}\n  | {\n  type: \"data\";\n  value: null;\n}}\nconst emit = defineEmits([\"ref\"]);\nconst props = defineProps<AesButtonProps>();\n\nconst isColor = props.data.type === \"fill\" || props.data.type === \"stroke\";\n\nconst strokeOrFillClass = computed(() => ({\n  icon__white: isColor && props.data.value.toLowerCase() === \"#ffffff\",\n  icon__empty: isColor && props.data.value.toLowerCase() === \"transparent\",\n}));\nconst strokeOrFillStyle = computed(() => {\n  if (props.data.type === \"fill\") {\n    return { [\"background-color\"]: props.data.value };\n  }\n  if (\n    props.data.type === \"stroke\" &&\n    !strokeOrFillClass.value.icon__empty &&\n    !strokeOrFillClass.value.icon__white\n  ) {\n    return { [\"border-color\"]: props.data.value };\n  }\n  return {};\n});\n</script>\n\n<template>\n  <div class=\"ui-aes-button\" :ref=\"(el) => $emit('ref', el)\">\n    <double-contour class=\"ui-multiselect-button__contour\" />\n    <div\n      v-if=\"data.type === 'fill'\"\n      class=\"icon icon__fill\"\n      :class=\"strokeOrFillClass\"\n      :style=\"strokeOrFillStyle\"\n    />\n    <div\n      v-else-if=\"data.type === 'stroke'\"\n      class=\"icon icon__stroke\"\n      :class=\"strokeOrFillClass\"\n      :style=\"strokeOrFillStyle\"\n    />\n    <div\n      v-else-if=\"data.type === 'dotShape'\"\n      class=\"icon dot\"\n      :class=\"{ [`dot__${data.value}`]: true}\"\n    />\n    <div\n      v-else-if=\"data.type === 'lineType'\"\n      class=\"icon icon__line\"\n      :class=\"{ [`line__${data.value}`]: true}\"\n    />\n    <span v-else-if=\"data.type === 'size'\" class=\"size\">{{ data.value }}</span>\n    <component v-else-if=\"data.type === 'data'\" class=\"icon\" :is=\"ColorsIcon\" />\n  </div>\n</template>\n"],"names":["props","__props","isColor","strokeOrFillClass","computed","strokeOrFillStyle","_createElementBlock","el","$emit","_createVNode","DoubleContour","_normalizeClass","_openBlock","_hoisted_1","_toDisplayString","_createBlock","_resolveDynamicComponent","ColorsIcon"],"mappings":";;;;;;;;;;;;;AA8BA,UAAMA,IAAQC,GAERC,IAAUF,EAAM,KAAK,SAAS,UAAUA,EAAM,KAAK,SAAS,UAE5DG,IAAoBC,EAAS,OAAO;AAAA,MACxC,aAAaF,KAAWF,EAAM,KAAK,MAAM,kBAAkB;AAAA,MAC3D,aAAaE,KAAWF,EAAM,KAAK,MAAM,kBAAkB;AAAA,IAAA,EAC3D,GACIK,IAAoBD,EAAS,MAC7BJ,EAAM,KAAK,SAAS,SACf,EAAG,oBAAqBA,EAAM,KAAK,MAAA,IAG1CA,EAAM,KAAK,SAAS,YACpB,CAACG,EAAkB,MAAM,eACzB,CAACA,EAAkB,MAAM,cAElB,EAAG,gBAAiBH,EAAM,KAAK,MAAA,IAEjC,CAAA,CACR;2BAICM,EA0BM,OAAA;AAAA,MA1BD,OAAM;AAAA,MAAiB,KAAG,CAAGC,MAAOC,EAAAA,aAAaD,CAAE;AAAA,IAAA;MACtDE,EAAyDC,GAAA,EAAzC,OAAM,kCAAgC;AAAA,MAE9CT,EAAA,KAAK,SAAI,eADjBK,EAKE,OAAA;AAAA;QAHA,OAAKK,EAAA,CAAC,mBACER,EAAA,KAAiB,CAAA;AAAA,QACxB,SAAOE,EAAA,KAAiB;AAAA,MAAA,eAGdJ,EAAA,KAAK,SAAI,iBADtBK,EAKE,OAAA;AAAA;QAHA,OAAKK,EAAA,CAAC,qBACER,EAAA,KAAiB,CAAA;AAAA,QACxB,SAAOE,EAAA,KAAiB;AAAA,MAAA,eAGdJ,EAAA,KAAK,SAAI,mBADtBK,EAIE,OAAA;AAAA;QAFA,OAAKK,EAAA,CAAC,YAAU,EAAA,CAAA,QACGV,EAAA,KAAK,KAAK,EAAA,GAAA,GAAA,CAAA,CAAA;AAAA,MAAA,eAGlBA,EAAA,KAAK,SAAI,mBADtBK,EAIE,OAAA;AAAA;QAFA,OAAKK,EAAA,CAAC,mBAAiB,EAAA,CAAA,SACHV,EAAA,KAAK,KAAK,EAAA,GAAA,GAAA,CAAA,CAAA;AAAA,MAAA,eAEfA,EAAA,KAAK,SAAI,UAA1BW,EAAA,GAAAN,EAA2E,QAA3EO,GAA2EC,EAApBb,EAAA,KAAK,KAAK,GAAA,CAAA,KAC3CA,EAAA,KAAK,SAAI,UAA/BW,EAAA,GAAAG,EAA4EC,EAAdC,CAAU,GAAA;AAAA;QAA5B,OAAM;AAAA,MAAA;;;;"}
+{"version":3,"file":"AesButton.vue.js","sources":["../../src/components/AesButton.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { computed } from 'vue';\nimport ColorsIcon from '../icons/ColorsIcon.vue';\nimport DoubleContour from './DoubleContourTemp.vue';\n\nexport type AesButtonProps = { data: {\n  type: 'stroke';\n  value: string;\n}\n| {\n  type: 'fill';\n  value: string;\n}\n| {\n  type: 'lineType';\n  value: string;\n}\n| {\n  type: 'dotShape';\n  value: string;\n}\n| {\n  type: 'size';\n  value: number;\n}\n| {\n  type: 'data';\n  value: null;\n}; };\nconst _emit = defineEmits(['ref']);\nconst props = defineProps<AesButtonProps>();\n\nconst isColor = props.data.type === 'fill' || props.data.type === 'stroke';\n\nconst strokeOrFillClass = computed(() => ({\n  icon__white: isColor && props.data.value.toLowerCase() === '#ffffff',\n  icon__empty: isColor && props.data.value.toLowerCase() === 'transparent',\n}));\nconst strokeOrFillStyle = computed(() => {\n  if (props.data.type === 'fill') {\n    return { ['background-color']: props.data.value };\n  }\n  if (\n    props.data.type === 'stroke'\n    && !strokeOrFillClass.value.icon__empty\n    && !strokeOrFillClass.value.icon__white\n  ) {\n    return { ['border-color']: props.data.value };\n  }\n  return {};\n});\n</script>\n\n<template>\n  <div :ref=\"(el) => $emit('ref', el)\" class=\"ui-aes-button\">\n    <DoubleContour class=\"ui-multiselect-button__contour\" />\n    <div\n      v-if=\"data.type === 'fill'\"\n      class=\"icon icon__fill\"\n      :class=\"strokeOrFillClass\"\n      :style=\"strokeOrFillStyle\"\n    />\n    <div\n      v-else-if=\"data.type === 'stroke'\"\n      class=\"icon icon__stroke\"\n      :class=\"strokeOrFillClass\"\n      :style=\"strokeOrFillStyle\"\n    />\n    <div\n      v-else-if=\"data.type === 'dotShape'\"\n      class=\"icon dot\"\n      :class=\"{ [`dot__${data.value}`]: true}\"\n    />\n    <div\n      v-else-if=\"data.type === 'lineType'\"\n      class=\"icon icon__line\"\n      :class=\"{ [`line__${data.value}`]: true}\"\n    />\n    <span v-else-if=\"data.type === 'size'\" class=\"size\">{{ data.value }}</span>\n    <component :is=\"ColorsIcon\" v-else-if=\"data.type === 'data'\" class=\"icon\" />\n  </div>\n</template>\n"],"names":["props","__props","isColor","strokeOrFillClass","computed","strokeOrFillStyle","_createElementBlock","el","$emit","_createVNode","DoubleContour","_normalizeClass","_openBlock","_hoisted_1","_toDisplayString","_createBlock","_resolveDynamicComponent","ColorsIcon"],"mappings":";;;;;;;;;;;;;AA8BA,UAAMA,IAAQC,GAERC,IAAUF,EAAM,KAAK,SAAS,UAAUA,EAAM,KAAK,SAAS,UAE5DG,IAAoBC,EAAS,OAAO;AAAA,MACxC,aAAaF,KAAWF,EAAM,KAAK,MAAM,kBAAkB;AAAA,MAC3D,aAAaE,KAAWF,EAAM,KAAK,MAAM,kBAAkB;AAAA,IAAA,EAC3D,GACIK,IAAoBD,EAAS,MAC7BJ,EAAM,KAAK,SAAS,SACf,EAAG,oBAAqBA,EAAM,KAAK,MAAA,IAG1CA,EAAM,KAAK,SAAS,YACjB,CAACG,EAAkB,MAAM,eACzB,CAACA,EAAkB,MAAM,cAErB,EAAG,gBAAiBH,EAAM,KAAK,MAAA,IAEjC,CAAA,CACR;2BAICM,EA0BM,OAAA;AAAA,MA1BA,KAAG,CAAGC,MAAOC,EAAAA,aAAaD,CAAE;AAAA,MAAG,OAAM;AAAA,IAAA;MACzCE,EAAwDC,GAAA,EAAzC,OAAM,kCAAgC;AAAA,MAE7CT,EAAA,KAAK,SAAI,eADjBK,EAKE,OAAA;AAAA;QAHA,OAAKK,EAAA,CAAC,mBACER,EAAA,KAAiB,CAAA;AAAA,QACxB,SAAOE,EAAA,KAAiB;AAAA,MAAA,eAGdJ,EAAA,KAAK,SAAI,iBADtBK,EAKE,OAAA;AAAA;QAHA,OAAKK,EAAA,CAAC,qBACER,EAAA,KAAiB,CAAA;AAAA,QACxB,SAAOE,EAAA,KAAiB;AAAA,MAAA,eAGdJ,EAAA,KAAK,SAAI,mBADtBK,EAIE,OAAA;AAAA;QAFA,OAAKK,EAAA,CAAC,YAAU,EAAA,CAAA,QACGV,EAAA,KAAK,KAAK,EAAA,GAAA,GAAA,CAAA,CAAA;AAAA,MAAA,eAGlBA,EAAA,KAAK,SAAI,mBADtBK,EAIE,OAAA;AAAA;QAFA,OAAKK,EAAA,CAAC,mBAAiB,EAAA,CAAA,SACHV,EAAA,KAAK,KAAK,EAAA,GAAA,GAAA,CAAA,CAAA;AAAA,MAAA,eAEfA,EAAA,KAAK,SAAI,UAA1BW,EAAA,GAAAN,EAA2E,QAA3EO,GAA2EC,EAApBb,EAAA,KAAK,KAAK,GAAA,CAAA,KAC1BA,EAAA,KAAK,SAAI,UAAhDW,EAAA,GAAAG,EAA4EC,EAA5DC,CAAU,GAAA;AAAA;QAAmC,OAAM;AAAA,MAAA;;;;"}

package/dist/components/AesSettings/AesDataMappingContinuous.vue.js

@@ -67,43 +67,43 @@ const F = { class: "aes-mapping-block" }, G = { style: { margin: "0 24px" } }, D
         ]),
         n("div", W, [
           s(m(k), {
-            options: L,
             modelValue: g.value,
-            "onUpdate:modelValue": a[1] || (a[1] = (t) => g.value = t)
+            "onUpdate:modelValue": a[1] || (a[1] = (t) => g.value = t),
+            options: L
           }, null, 8, ["modelValue"])
         ]),
         n("div", j, [
           s(m(k), {
-            label: "Gradient range",
-            options: B,
             modelValue: d.value,
-            "onUpdate:modelValue": a[2] || (a[2] = (t) => d.value = t)
+            "onUpdate:modelValue": a[2] || (a[2] = (t) => d.value = t),
+            label: "Gradient range",
+            options: B
           }, null, 8, ["modelValue"])
         ]),
         n("div", q, [
           d.value === "custom" ? (c(), O(m(C), {
             key: 0,
+            modelValue: V.value,
+            "onUpdate:modelValue": a[3] || (a[3] = (t) => V.value = t),
             label: "From",
             updateOnEnterOrClickOutside: !0,
-            useIncrementButtons: !1,
-            modelValue: V.value,
-            "onUpdate:modelValue": a[3] || (a[3] = (t) => V.value = t)
+            useIncrementButtons: !1
           }, null, 8, ["modelValue"])) : x("", !0),
           s(m(C), {
+            modelValue: f.value,
+            "onUpdate:modelValue": a[4] || (a[4] = (t) => f.value = t),
             label: "Mid point",
             updateOnEnterOrClickOutside: !0,
             useIncrementButtons: !1,
-            style: { flexGrow: 1, maxWidth: "50%" },
-            modelValue: f.value,
-            "onUpdate:modelValue": a[4] || (a[4] = (t) => f.value = t)
+            style: { flexGrow: 1, maxWidth: "50%" }
           }, null, 8, ["modelValue"]),
           d.value === "custom" ? (c(), O(m(C), {
             key: 1,
+            modelValue: v.value,
+            "onUpdate:modelValue": a[5] || (a[5] = (t) => v.value = t),
             label: "To",
             updateOnEnterOrClickOutside: !0,
-            useIncrementButtons: !1,
-            modelValue: v.value,
-            "onUpdate:modelValue": a[5] || (a[5] = (t) => v.value = t)
+            useIncrementButtons: !1
           }, null, 8, ["modelValue"])) : x("", !0)
         ]),
         r.value ? (c(), O(U, {

package/dist/components/AesSettings/AesDataMappingContinuous.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"AesDataMappingContinuous.vue.js","sources":["../../../src/components/AesSettings/AesDataMappingContinuous.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { PlBtnGroup, PlNumberField } from '@platforma-sdk/ui-vue';\nimport { ref, watch } from 'vue';\nimport { ContinuousPalette, Palette } from './types';\nimport { PALETTE_MAP } from '../../constantsAesthetic';\nimport { AestheticMappingContinuous, createContinuousMappingFromPalette } from '../../dataBindAes';\nimport FormWrapper from './FormWrapper.vue';\nimport PalettesForm from './PalettesForm.vue';\nimport MultiselectButton from '../MultiselectButton.vue';\n\nconst props = defineProps<{\n  dataColumnLabel: string;\n  modelValue: AestheticMappingContinuous;\n}>();\n\nconst emit = defineEmits(['update:modelValue']);\n\nconst palettesOpen = ref(false);\nconst palette = ref<Palette>(props.modelValue.palette);\n\nfunction onPaletteSelect(value: Palette) {\n  palette.value = value;\n  palettesOpen.value = false;\n  emit(\n    'update:modelValue',\n    createContinuousMappingFromPalette(value as ContinuousPalette)\n  );\n}\n\nconst MODE_OPTIONS = [{ value: 'auto', label: 'Auto' }, { value: 'custom', label: 'Custom' }];\nconst mode = ref<'auto' | 'custom'>(props.modelValue.range ? 'custom' : 'auto');\n\nconst LOG_LINEAR_OPTIONS = [{ value: 'linear', label: 'Linear' }, { value: 'log', label: 'Log' }];\nconst logOrLinear = ref<'linear' | 'log'>(props.modelValue.log ? 'log' : 'linear');\n\nconst lowerValue = ref<number | undefined>(props.modelValue.range?.minValue ?? undefined);\nconst upperValue = ref<number | undefined>(props.modelValue.range?.maxValue ?? undefined);\n\nconst midPoint = ref<number | undefined>(props.modelValue.midPoint ?? undefined);\n\nwatch(() => mode.value, (v) => {\n  if (v === 'custom') {\n    emit(\n      'update:modelValue',\n      { ...props.modelValue, range: { minValue: lowerValue.value ?? null, maxValue: upperValue.value ?? null } }\n    );\n  }\n  if (v === 'auto') {\n    emit(\n      'update:modelValue',\n      { ...props.modelValue, range: null }\n    );\n  }\n});\nwatch(() => lowerValue.value, (v) => {\n  emit(\n    'update:modelValue',\n    { ...props.modelValue, range: { ...props.modelValue.range, minValue: v } }\n  );\n});\nwatch(() => upperValue.value, (v) => {\n  emit(\n    'update:modelValue',\n    { ...props.modelValue, range: { ...props.modelValue.range, maxValue: v } }\n  );\n});\nwatch(() => midPoint.value, (v) => {\n  emit(\n    'update:modelValue',\n    { ...props.modelValue, midPoint: v ?? null }\n  );\n});\nwatch(() => logOrLinear.value, (v) => {\n  emit(\n    'update:modelValue',\n    { ...props.modelValue, log: v === 'log' }\n  );\n});\n\n</script>\n\n<template>\n  <div class=\"aes-mapping-block\">\n    <div style=\"margin: 0 24px\">\n      <div class=\"section-title\">\n        <span>{{ dataColumnLabel }}</span>\n      </div>\n      <div style=\"margin: 24px 0\">\n        <multiselect-button\n          label=\"Color Palette \"\n          :title=\"PALETTE_MAP[palette].title\"\n          :palette=\"palette\"\n          @button-click=\"palettesOpen = true;\"\n        />\n      </div>\n      <div style=\"margin: 24px 0\">\n        <pl-btn-group\n          :options=\"LOG_LINEAR_OPTIONS\"\n          v-model=\"logOrLinear\"\n        />\n      </div>\n      <div style=\"margin: 24px 0\">\n        <pl-btn-group\n          label=\"Gradient range\"\n          :options=\"MODE_OPTIONS\"\n          v-model=\"mode\"\n        />\n      </div>\n      <div :style=\"{display: 'flex', marginTop: '16px', gap: '8px'}\">\n        <pl-number-field\n          v-if=\"mode === 'custom'\"\n          label=\"From\"\n          :updateOnEnterOrClickOutside=\"true\"\n          :useIncrementButtons=\"false\"\n          v-model=\"lowerValue\"\n        />\n        <pl-number-field\n          label=\"Mid point\"\n          :updateOnEnterOrClickOutside=\"true\"\n          :useIncrementButtons=\"false\"\n          :style=\"{flexGrow: 1, maxWidth: '50%'}\"\n          v-model=\"midPoint\"\n        />\n        <pl-number-field\n          v-if=\"mode === 'custom'\"\n          label=\"To\"\n          :updateOnEnterOrClickOutside=\"true\"\n          :useIncrementButtons=\"false\"\n          v-model=\"upperValue\"\n        />\n      </div>\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>\n  </div>\n</template>\n"],"names":["props","__props","emit","__emit","palettesOpen","ref","palette","onPaletteSelect","value","createContinuousMappingFromPalette","MODE_OPTIONS","mode","LOG_LINEAR_OPTIONS","logOrLinear","lowerValue","_a","upperValue","_b","midPoint","watch","v","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_hoisted_3","_hoisted_4","_createVNode","MultiselectButton","_unref","PALETTE_MAP","_hoisted_5","PlBtnGroup","$event","_hoisted_6","_hoisted_7","_createBlock","PlNumberField","FormWrapper","PalettesForm"],"mappings":"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"}
+{"version":3,"file":"AesDataMappingContinuous.vue.js","sources":["../../../src/components/AesSettings/AesDataMappingContinuous.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { PlBtnGroup, PlNumberField } from '@platforma-sdk/ui-vue';\nimport { ref, watch } from 'vue';\nimport type { ContinuousPalette, Palette } from './types';\nimport { PALETTE_MAP } from '../../constantsAesthetic';\nimport type { AestheticMappingContinuous } from '../../dataBindAes';\nimport { createContinuousMappingFromPalette } from '../../dataBindAes';\nimport FormWrapper from './FormWrapper.vue';\nimport PalettesForm from './PalettesForm.vue';\nimport MultiselectButton from '../MultiselectButton.vue';\n\nconst props = defineProps<{\n  dataColumnLabel: string;\n  modelValue: AestheticMappingContinuous;\n}>();\n\nconst emit = defineEmits(['update:modelValue']);\n\nconst palettesOpen = ref(false);\nconst palette = ref<Palette>(props.modelValue.palette);\n\nfunction onPaletteSelect(value: Palette) {\n  palette.value = value;\n  palettesOpen.value = false;\n  emit(\n    'update:modelValue',\n    createContinuousMappingFromPalette(value as ContinuousPalette),\n  );\n}\n\nconst MODE_OPTIONS = [{ value: 'auto', label: 'Auto' }, { value: 'custom', label: 'Custom' }];\nconst mode = ref<'auto' | 'custom'>(props.modelValue.range ? 'custom' : 'auto');\n\nconst LOG_LINEAR_OPTIONS = [{ value: 'linear', label: 'Linear' }, { value: 'log', label: 'Log' }];\nconst logOrLinear = ref<'linear' | 'log'>(props.modelValue.log ? 'log' : 'linear');\n\nconst lowerValue = ref<number | undefined>(props.modelValue.range?.minValue ?? undefined);\nconst upperValue = ref<number | undefined>(props.modelValue.range?.maxValue ?? undefined);\n\nconst midPoint = ref<number | undefined>(props.modelValue.midPoint ?? undefined);\n\nwatch(() => mode.value, (v) => {\n  if (v === 'custom') {\n    emit(\n      'update:modelValue',\n      { ...props.modelValue, range: { minValue: lowerValue.value ?? null, maxValue: upperValue.value ?? null } },\n    );\n  }\n  if (v === 'auto') {\n    emit(\n      'update:modelValue',\n      { ...props.modelValue, range: null },\n    );\n  }\n});\nwatch(() => lowerValue.value, (v) => {\n  emit(\n    'update:modelValue',\n    { ...props.modelValue, range: { ...props.modelValue.range, minValue: v } },\n  );\n});\nwatch(() => upperValue.value, (v) => {\n  emit(\n    'update:modelValue',\n    { ...props.modelValue, range: { ...props.modelValue.range, maxValue: v } },\n  );\n});\nwatch(() => midPoint.value, (v) => {\n  emit(\n    'update:modelValue',\n    { ...props.modelValue, midPoint: v ?? null },\n  );\n});\nwatch(() => logOrLinear.value, (v) => {\n  emit(\n    'update:modelValue',\n    { ...props.modelValue, log: v === 'log' },\n  );\n});\n\n</script>\n\n<template>\n  <div class=\"aes-mapping-block\">\n    <div style=\"margin: 0 24px\">\n      <div class=\"section-title\">\n        <span>{{ dataColumnLabel }}</span>\n      </div>\n      <div style=\"margin: 24px 0\">\n        <MultiselectButton\n          label=\"Color Palette \"\n          :title=\"PALETTE_MAP[palette].title\"\n          :palette=\"palette\"\n          @button-click=\"palettesOpen = true;\"\n        />\n      </div>\n      <div style=\"margin: 24px 0\">\n        <PlBtnGroup\n          v-model=\"logOrLinear\"\n          :options=\"LOG_LINEAR_OPTIONS\"\n        />\n      </div>\n      <div style=\"margin: 24px 0\">\n        <PlBtnGroup\n          v-model=\"mode\"\n          label=\"Gradient range\"\n          :options=\"MODE_OPTIONS\"\n        />\n      </div>\n      <div :style=\"{display: 'flex', marginTop: '16px', gap: '8px'}\">\n        <PlNumberField\n          v-if=\"mode === 'custom'\"\n          v-model=\"lowerValue\"\n          label=\"From\"\n          :updateOnEnterOrClickOutside=\"true\"\n          :useIncrementButtons=\"false\"\n        />\n        <PlNumberField\n          v-model=\"midPoint\"\n          label=\"Mid point\"\n          :updateOnEnterOrClickOutside=\"true\"\n          :useIncrementButtons=\"false\"\n          :style=\"{flexGrow: 1, maxWidth: '50%'}\"\n        />\n        <PlNumberField\n          v-if=\"mode === 'custom'\"\n          v-model=\"upperValue\"\n          label=\"To\"\n          :updateOnEnterOrClickOutside=\"true\"\n          :useIncrementButtons=\"false\"\n        />\n      </div>\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>\n  </div>\n</template>\n"],"names":["props","__props","emit","__emit","palettesOpen","ref","palette","onPaletteSelect","value","createContinuousMappingFromPalette","MODE_OPTIONS","mode","LOG_LINEAR_OPTIONS","logOrLinear","lowerValue","_a","upperValue","_b","midPoint","watch","v","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_hoisted_3","_hoisted_4","_createVNode","MultiselectButton","_unref","PALETTE_MAP","_hoisted_5","PlBtnGroup","$event","_hoisted_6","_hoisted_7","_createBlock","PlNumberField","FormWrapper","PalettesForm"],"mappings":"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"}

package/dist/components/AesSettings/AesDataMappingDiscrete.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as G, ref as g, computed as m, reactive as J, watch as Q, createElementBlock as p, openBlock as u, createElementVNode as r, createCommentVNode as s, createBlock as v, toDisplayString as M, createVNode as k, unref as S, withCtx as w, Fragment as Z, renderList as ee, normalizeClass as f, resolveDynamicComponent as le, withModifiers as x, normalizeStyle as oe } from "vue";
+import { defineComponent as G, ref as g, computed as m, reactive as J, watch as Q, createElementBlock as p, openBlock as u, createElementVNode as r, createCommentVNode as s, createBlock as v, toDisplayString as M, createVNode as C, unref as S, withCtx as w, Fragment as Z, renderList as ee, normalizeClass as f, resolveDynamicComponent as le, withModifiers as x, normalizeStyle as oe } from "vue";
 import { useSortable as ae, PlTooltip as te, PlIcon24 as ne } from "@platforma-sdk/ui-vue";
 import { scaleLinear as ue } from "d3-scale";
 import { isCategorical as re, PALETTE_MAP as h, FIXED_LINE_TYPES as ie, FIXES_DOT_SHAPES as se, UNKNOWN_COLOR as N } from "../../constantsAesthetic.js";
@@ -13,7 +13,7 @@ import ge from "../MultiselectButton.vue.js";
 import Ve from "../PlColorSlider.vue.js";
 import he from "../Popup.vue.js";
 import ye from "../../icons/Reorder.vue.js";
-const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } }, Se = { class: "section-title" }, we = { style: { margin: "24px 0" } }, xe = {
+const ke = { class: "aes-mapping-block" }, Ce = { style: { margin: "0 24px" } }, Se = { class: "section-title" }, we = { style: { margin: "24px 0" } }, xe = {
   key: 0,
   style: { margin: "24px 0" }
 }, $e = {
@@ -111,8 +111,8 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
       });
     }
     function b(l, a, e = 0, o = 1) {
-      const _ = 1 / (l.length - 1), j = ue().domain(l.map((C, q) => e + q * _ * (o - e))).range(l);
-      return (C) => C > o || C < e ? a : j(C);
+      const _ = 1 / (l.length - 1), j = ue().domain(l.map((k, q) => e + q * _ * (o - e))).range(l);
+      return (k) => k > o || k < e ? a : j(k);
     }
     const X = m(
       () => b(h[c.value].colors, N)
@@ -152,13 +152,13 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
     function Y(l) {
       n.value = "color", i.value = l.status ? t.modelValue.order[l.index] : null;
     }
-    return (l, a) => (u(), p("div", Ce, [
-      r("div", ke, [
+    return (l, a) => (u(), p("div", ke, [
+      r("div", Ce, [
         r("div", Se, [
           r("span", null, M(d.dataColumnLabel), 1)
         ]),
         r("div", we, [
-          k(ge, {
+          C(ge, {
             label: "Color Palette ",
             icon: "chevron-right",
             title: S(h)[c.value].title,
@@ -169,7 +169,7 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
           }, null, 8, ["title", "palette"])
         ]),
         L.value ? s("", !0) : (u(), p("div", xe, [
-          k(Ve, {
+          C(Ve, {
             modelValue: A.value,
             "onUpdate:modelValue": [
               a[1] || (a[1] = (e) => A.value = e),
@@ -188,7 +188,7 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
           "onForm:close": a[2] || (a[2] = (e) => y.value = !1)
         }, {
           default: w(() => [
-            k(_e, {
+            C(_e, {
               selected: c.value,
               onSelect: D
             }, null, 8, ["selected"])
@@ -198,11 +198,12 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
       ]),
       d.allowReordering ? (u(), p("div", $e, " Drag the rows to reorder ")) : s("", !0),
       r("div", {
-        class: "column-values-list",
         ref_key: "optionsListRef",
-        ref: E
+        ref: E,
+        class: "column-values-list"
       }, [
         (u(!0), p(Z, null, ee(B.value, (e) => (u(), p("div", {
+          key: e.value,
           class: f(["column-value", { "column-value__with-reorder": d.allowReordering }])
         }, [
           d.allowReordering ? (u(), p("div", Te, [
@@ -222,11 +223,11 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
                 var o;
                 return [
                   r("div", {
-                    onClick: x((_) => z(e), ["stop"]),
                     style: { cursor: "pointer" },
-                    class: "column-value__aes"
+                    class: "column-value__aes",
+                    onClick: x((_) => z(e), ["stop"])
                   }, [
-                    k(S(ne), {
+                    C(S(ne), {
                       name: (o = d.modelValue.hidden) != null && o[e.value] ? "view-hide" : "view-show"
                     }, null, 8, ["name"])
                   ], 8, Le)
@@ -236,11 +237,11 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
             }, 1024)) : s("", !0),
             d.usedAesInMapping.lineType ? (u(), p("div", {
               key: 1,
+              ref_for: !0,
+              ref: (o) => T("lineType", e, o),
               class: f(["column-value__aes", {
                 aes__selected: i.value === e.value && n.value === "lineType"
               }]),
-              ref_for: !0,
-              ref: (o) => T("lineType", e, o),
               onClick: x((o) => I(e, "lineType"), ["stop"])
             }, [
               r("div", {
@@ -249,11 +250,11 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
             ], 10, Pe)) : s("", !0),
             d.usedAesInMapping.dotShape ? (u(), p("div", {
               key: 2,
+              ref_for: !0,
+              ref: (o) => T("dotShape", e, o),
               class: f(["column-value__aes", {
                 aes__selected: i.value === e.value && n.value === "dotShape"
               }]),
-              ref_for: !0,
-              ref: (o) => T("dotShape", e, o),
               onClick: x((o) => I(e, "dotShape"), ["stop"])
             }, [
               r("div", {
@@ -262,11 +263,11 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
             ], 10, Re)) : s("", !0),
             d.usedAesInMapping.fill || d.usedAesInMapping.stroke ? (u(), p("div", {
               key: 3,
+              ref_for: !0,
+              ref: (o) => T("color", e, o),
               class: f(["column-value__aes", {
                 aes__selected: i.value === e.value && n.value === "color"
               }]),
-              ref_for: !0,
-              ref: (o) => T("color", e, o),
               onClick: x((o) => I(e, "color"), ["stop"])
             }, [
               r("div", {
@@ -277,8 +278,8 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
             (n.value !== "color" || L.value) && n.value !== null && i.value === e.value ? (u(), v(he, {
               key: `${n.value}_${i.value}`,
               targetRef: P[n.value][i.value],
-              "onPopup:close": R,
-              height: H.value
+              height: H.value,
+              "onPopup:close": R
             }, {
               default: w(() => [
                 r("div", {
@@ -286,35 +287,35 @@ const Ce = { class: "aes-mapping-block" }, ke = { style: { margin: "0 24px" } },
                 }, [
                   n.value === "lineType" ? (u(), v(ve, {
                     key: 0,
+                    modelValue: e.lineType,
                     "onUpdate:modelValue": [
-                      (o) => $(e.value, "lineShape", o),
-                      (o) => e.lineType = o
-                    ],
-                    modelValue: e.lineType
-                  }, null, 8, ["onUpdate:modelValue", "modelValue"])) : s("", !0),
+                      (o) => e.lineType = o,
+                      (o) => $(e.value, "lineShape", o)
+                    ]
+                  }, null, 8, ["modelValue", "onUpdate:modelValue"])) : s("", !0),
                   n.value === "dotShape" ? (u(), v(me, {
                     key: 1,
+                    modelValue: e.dotShape,
                     "onUpdate:modelValue": [
-                      (o) => $(e.value, "dotShape", o),
-                      (o) => e.dotShape = o
-                    ],
-                    modelValue: e.dotShape
-                  }, null, 8, ["onUpdate:modelValue", "modelValue"])) : s("", !0),
+                      (o) => e.dotShape = o,
+                      (o) => $(e.value, "dotShape", o)
+                    ]
+                  }, null, 8, ["modelValue", "onUpdate:modelValue"])) : s("", !0),
                   n.value === "color" ? (u(), v(pe, {
                     key: 2,
-                    "colors-list": F.value,
+                    modelValue: e.color,
                     "onUpdate:modelValue": [
-                      (o) => $(e.value, "color", o),
-                      (o) => e.color = o
+                      (o) => e.color = o,
+                      (o) => $(e.value, "color", o)
                     ],
-                    modelValue: e.color
-                  }, null, 8, ["colors-list", "onUpdate:modelValue", "modelValue"])) : s("", !0)
+                    "colors-list": F.value
+                  }, null, 8, ["modelValue", "onUpdate:modelValue", "colors-list"])) : s("", !0)
                 ])
               ]),
               _: 2
             }, 1032, ["targetRef", "height"])) : s("", !0)
           ])
-        ], 2))), 256))
+        ], 2))), 128))
       ], 512)
     ]));
   }

package/dist/components/AesSettings/AesDataMappingDiscrete.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"AesDataMappingDiscrete.vue.js","sources":["../../../src/components/AesSettings/AesDataMappingDiscrete.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { PlIcon24, PlTooltip, useSortable } from '@platforma-sdk/ui-vue';\nimport { scaleLinear } from 'd3-scale';\nimport { ComponentPublicInstance, computed, reactive, ref, watch } from 'vue';\nimport {\n  DotShape,\n  LineType,\n  Palette\n} from './types';\nimport {\n  FIXED_LINE_TYPES,\n  FIXES_DOT_SHAPES,\n  isCategorical,\n  PALETTE_MAP, UNKNOWN_COLOR\n} from '../../constantsAesthetic';\nimport { AesType } from '../../constantsCommon';\nimport {\n  AestheticMappingCategorical,\n  createCategoricalMappingFromPalette\n} from '../../dataBindAes';\nimport { getPopupHeightForFixedAesList } from '../../utils/getPopupHeightForFixedAesList';\nimport FixedColorsList from './FixedColorsList.vue';\nimport FixedDotShapeList from './FixedDotShapeList.vue';\nimport FixedLineTypeList from './FixedLineTypeList.vue';\nimport FormWrapper from './FormWrapper.vue';\nimport PalettesForm from './PalettesForm.vue';\nimport MultiselectButton from '../MultiselectButton.vue';\nimport PlColorSlider from '../PlColorSlider.vue';\nimport Popup from '../Popup.vue';\nimport Reorder from '../../icons/Reorder.vue';\n\nconst props = defineProps<{\n  dataColumnLabel: string;\n  columnValueLabels: Record<string, string>;\n  usedAesInMapping: Record<AesType, boolean>;\n  modelValue: AestheticMappingCategorical;\n  allowReordering?: boolean;\n  allowHiding?: boolean;\n  allowNullOption?: boolean;\n}>();\n\nconst emit = defineEmits(['update:modelValue']);\n\nconst palettesOpen = ref(false);\nconst palette = ref<Palette>(props.modelValue.palette);\nconst categorical = computed(() => isCategorical(palette.value));\n\ntype EditableAesType = 'color' | 'dotShape' | 'lineType';\n\nconst activeValue = ref<string | null>(null);\nconst activeValueIndex = computed(() => {\n  if (activeValue.value === null) {\n    return null;\n  }\n  return props.modelValue.order.indexOf(activeValue.value);\n});\nconst activeAesType = ref<EditableAesType | null>(null);\n\nconst optionsList = computed(() => {\n  const options = props.modelValue.order.map((value: string) => {\n    const aes = props.modelValue.mapping[value]?.aes;\n    return {\n      text: props.columnValueLabels[value],\n      value,\n      dotShape: aes?.dotShape,\n      color: aes?.color,\n      lineType: aes?.lineShape\n    };\n  });\n\n  return props.allowNullOption ? options : options.filter(op => op.value !== 'null')\n});\n\nfunction onPaletteSelect(value: Palette) {\n  palette.value = value;\n  palettesOpen.value = false;\n  emit(\n    'update:modelValue',\n    createCategoricalMappingFromPalette(value, props.modelValue.order)\n  );\n}\n\nfunction onAesValueUpdate(\n  value: string | number,\n  aesField: string,\n  aesValue: string | DotShape | LineType\n) {\n  emit('update:modelValue', {\n    ...props.modelValue,\n    mapping: {\n      ...props.modelValue.mapping,\n      [value]: {\n        ...props.modelValue.mapping[value],\n        aes: {\n          ...props.modelValue.mapping[value].aes,\n          [aesField]: aesValue\n        }\n      }\n    }\n  });\n}\n\nconst itemRefs = reactive<\n  Record<EditableAesType, Record<string, ComponentPublicInstance | Element>>\n>({\n  color: {},\n  dotShape: {},\n  lineType: {}\n});\n\nfunction setRef(\n  type: EditableAesType,\n  item: (typeof optionsList.value)[0],\n  el: ComponentPublicInstance | null | Element\n) {\n  if (el) {\n    itemRefs[type][item.value] = el;\n  }\n}\n\nfunction toggleForm(\n  item: (typeof optionsList.value)[0],\n  valueType: EditableAesType\n) {\n  const isThisFormOpen =\n    activeValue.value === item.value && activeAesType.value === valueType;\n  activeValue.value = isThisFormOpen ? null : item.value;\n  activeAesType.value = isThisFormOpen ? null : valueType;\n}\n\nfunction closeForm() {\n  activeValue.value = null;\n  activeAesType.value = null;\n}\n\nconst selectedColorsList = computed(() =>\n  PALETTE_MAP[palette.value].colors.map((color) => ({ color, name: color }))\n);\n\nconst popupHeight = computed(() => {\n  if (!activeAesType.value) {\n    return 0;\n  }\n  return getPopupHeightForFixedAesList(\n    activeAesType.value === 'lineType' ? FIXED_LINE_TYPES.length : activeAesType.value === 'dotShape' ? FIXES_DOT_SHAPES.length : selectedColorsList.value.length,\n    activeAesType.value\n  );\n});\n\nconst optionsListRef = ref();\n\nif (props.allowReordering) {\n  useSortable(optionsListRef, {\n    handle: '.column-value__reorder-icon',\n    onChange(indices) {\n      emit('update:modelValue', {\n        ...props.modelValue,\n        order: indices.map((idx) => props.modelValue.order[idx])\n      });\n    }\n  });\n}\n\nfunction switchVisibility (option: {value: string}) {\n  emit('update:modelValue', {\n      ...props.modelValue,\n      hidden: {\n        ...props.modelValue.hidden,\n        [option.value]: props.modelValue.hidden?.[option.value] ? false : true\n      }\n    });\n}\n\nfunction getColorScale(colors: string[], unknownColor: string, from = 0, to = 1) {\n  const colorStep = 1 / (colors.length - 1);\n  const scale = scaleLinear<string, string>()\n    .domain(colors.map((_c, idx) => from + idx * colorStep * (to - from)))\n    .range(colors);\n  return (v: number) => {\n    if (v > to || v < from) {\n      return unknownColor;\n    }\n    return scale(v);\n  };\n}\n\nconst continuousColorScale = computed(() =>\n  getColorScale(PALETTE_MAP[palette.value].colors, UNKNOWN_COLOR)\n);\n\nconst colorForPercent = computed(() =>\n  getColorScale(PALETTE_MAP[palette.value].colors, UNKNOWN_COLOR, 0, 100)\n);\nconst continuousMappingItems = ref(\n  props.modelValue.order.map(\n    (item) => props.modelValue.mapping[item].colorIdx * 100\n  )\n);\nwatch(\n  () => props.modelValue,\n  (v) => {\n    continuousMappingItems.value = v.order.map(\n      (item) => v.mapping[item].colorIdx * 100\n    );\n  }\n);\nfunction updateContinuousColors(v: number[]) {\n  v.forEach((value, idx) => {\n    const item = props.modelValue.order[idx];\n    const newColorIdx = value / 100;\n    if (props.modelValue.mapping[item].colorIdx !== newColorIdx) {\n      emit('update:modelValue', {\n        ...props.modelValue,\n        mapping: {\n          ...props.modelValue.mapping,\n          [item]: {\n            colorIdx: newColorIdx,\n            aes: {\n              ...props.modelValue.mapping[item].aes,\n              color: continuousColorScale.value(newColorIdx)\n            }\n          }\n        }\n      });\n    }\n  });\n}\n\nfunction setActiveElementFromColorSlider(e: { index: number, status: boolean }) {\n  activeAesType.value = 'color';\n  activeValue.value = e.status ? props.modelValue.order[e.index] : null;\n}\n</script>\n\n<template>\n  <div class=\"aes-mapping-block\">\n    <div style=\"margin: 0 24px\">\n      <div class=\"section-title\">\n        <span>{{ dataColumnLabel }}</span>\n      </div>\n      <div style=\"margin: 24px 0\">\n        <multiselect-button\n          label=\"Color Palette \"\n          icon=\"chevron-right\"\n          :title=\"PALETTE_MAP[palette].title\"\n          :palette=\"palette\"\n          @button-click=\"\n            palettesOpen = true;\n            closeForm();\n          \"\n        />\n      </div>\n      <div v-if=\"!categorical\" style=\"margin: 24px 0\">\n        <pl-color-slider\n          v-model=\"continuousMappingItems\"\n          :colors=\"PALETTE_MAP[palette].colors\"\n          :get-color-for-percent=\"colorForPercent\"\n          :active=\"activeValueIndex\"\n          @active=\"setActiveElementFromColorSlider\"\n          @update:model-value=\"updateContinuousColors\"\n        />\n      </div>\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\" @select=\"onPaletteSelect\" />\n      </form-wrapper>\n    </div>\n    <div v-if=\"allowReordering\" class=\"aes-settings-hint\">\n      Drag the rows to reorder\n    </div>\n    <div class=\"column-values-list\" ref=\"optionsListRef\">\n      <div\n        v-for=\"item of optionsList\"\n        class=\"column-value\"\n        :class=\"{ 'column-value__with-reorder': allowReordering }\"\n      >\n        <div v-if=\"allowReordering\" class=\"column-value__reorder-icon\">\n          <component :is=\"Reorder\" />\n        </div>\n        <div class=\"column-value__title\">{{ item.text }}</div>\n        <div class=\"column-value__aes-group\">\n          <PlTooltip :open-delay=\"100\" :close-delay=\"100\" v-if=\"allowHiding\">\n            <div @click.stop=\"switchVisibility(item)\" :style=\"{cursor: 'pointer'}\" class=\"column-value__aes\">\n              <PlIcon24 :name=\"modelValue.hidden?.[item.value] ? 'view-hide' : 'view-show'\"/>\n            </div>\n            <template #tooltip>\n              <span> Show / hide </span>\n            </template>\n          </PlTooltip>\n          <div\n            v-if=\"usedAesInMapping.lineType\"\n            class=\"column-value__aes\"\n            :class=\"{\n              aes__selected:\n                activeValue === item.value &&\n                activeAesType === 'lineType'\n            }\"\n            :ref=\"(v) => setRef('lineType', item, v)\"\n            @click.stop=\"toggleForm(item, 'lineType')\"\n          >\n            <div\n              class=\"icon__line line\"\n              :class=\"{ [`line__${item.lineType}`]: true }\"\n            />\n          </div>\n          <div\n            v-if=\"usedAesInMapping.dotShape\"\n            class=\"column-value__aes\"\n            :class=\"{\n              aes__selected: activeValue === item.value && activeAesType === 'dotShape'\n            }\"\n            :ref=\"(v) => setRef('dotShape', item, v)\"\n            @click.stop=\"toggleForm(item, 'dotShape')\"\n          >\n            <div class=\"dot\" :class=\"{ [`dot__${item.dotShape}`]: true }\" />\n          </div>\n          <div\n            v-if=\"usedAesInMapping.fill || usedAesInMapping.stroke\"\n            class=\"column-value__aes\"\n            :class=\"{\n              aes__selected: activeValue === item.value && activeAesType === 'color'\n            }\"\n            :ref=\"(v) => setRef('color', item, v)\"\n            @click.stop=\"toggleForm(item, 'color')\"\n          >\n            <div\n              class=\"column-value__color\"\n              :style=\"{ background: item.color }\"\n            />\n          </div>\n          <popup\n            v-if=\"\n              (activeAesType !== 'color' || categorical) &&\n              activeAesType !== null &&\n              activeValue === item.value\n            \"\n            :key=\"`${activeAesType}_${activeValue}`\"\n            :targetRef=\"itemRefs[activeAesType][activeValue] as HTMLElement\"\n            @popup:close=\"closeForm\"\n            :height=\"popupHeight\"\n          >\n            <div\n              class=\"fixed-aes-list\"\n              :class=\"{ 'fixed-aes-list__rows': false }\"\n            >\n              <fixed-line-type-list\n                v-if=\"activeAesType === 'lineType'\"\n                @update:modelValue=\"\n                  (v) => onAesValueUpdate(item.value, 'lineShape', v)\n                \"\n                v-model=\"item.lineType as LineType\"\n              />\n              <fixed-dot-shape-list\n                v-if=\"activeAesType === 'dotShape'\"\n                @update:modelValue=\"\n                  (v) => onAesValueUpdate(item.value, 'dotShape', v)\n                \"\n                v-model=\"item.dotShape as DotShape\"\n              />\n              <fixed-colors-list\n                v-if=\"activeAesType === 'color'\"\n                :colors-list=\"selectedColorsList\"\n                @update:modelValue=\"\n                  (v) => onAesValueUpdate(item.value, 'color', v)\n                \"\n                v-model=\"item.color as string\"\n              />\n            </div>\n          </popup>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","emit","__emit","palettesOpen","ref","palette","categorical","computed","isCategorical","activeValue","activeValueIndex","activeAesType","optionsList","options","value","aes","_a","op","onPaletteSelect","createCategoricalMappingFromPalette","onAesValueUpdate","aesField","aesValue","itemRefs","reactive","setRef","type","item","el","toggleForm","valueType","isThisFormOpen","closeForm","selectedColorsList","PALETTE_MAP","color","popupHeight","getPopupHeightForFixedAesList","FIXED_LINE_TYPES","FIXES_DOT_SHAPES","optionsListRef","useSortable","indices","idx","switchVisibility","option","getColorScale","colors","unknownColor","from","to","colorStep","scale","scaleLinear","_c","v","continuousColorScale","UNKNOWN_COLOR","colorForPercent","continuousMappingItems","watch","updateContinuousColors","newColorIdx","setActiveElementFromColorSlider","e","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_hoisted_3","_hoisted_4","_createVNode","MultiselectButton","_unref","_cache","$event","_hoisted_5","PlColorSlider","_createBlock","FormWrapper","PalettesForm","_hoisted_6","_Fragment","_renderList","_normalizeClass","_hoisted_7","_resolveDynamicComponent","Reorder","_hoisted_8","_toDisplayString","_hoisted_9","PlTooltip","_withModifiers","PlIcon24","_normalizeStyle","Popup","FixedLineTypeList","FixedDotShapeList","FixedColorsList"],"mappings":"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"}
+{"version":3,"file":"AesDataMappingDiscrete.vue.js","sources":["../../../src/components/AesSettings/AesDataMappingDiscrete.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { PlIcon24, PlTooltip, useSortable } from '@platforma-sdk/ui-vue';\nimport { scaleLinear } from 'd3-scale';\nimport type { ComponentPublicInstance } from 'vue';\nimport { computed, reactive, ref, watch } from 'vue';\nimport type {\n  DotShape,\n  LineType,\n  Palette,\n} from './types';\nimport {\n  FIXED_LINE_TYPES,\n  FIXES_DOT_SHAPES,\n  isCategorical,\n  PALETTE_MAP, UNKNOWN_COLOR,\n} from '../../constantsAesthetic';\nimport type { AesType } from '../../constantsCommon';\nimport type {\n  AestheticMappingCategorical } from '../../dataBindAes';\nimport {\n  createCategoricalMappingFromPalette,\n} from '../../dataBindAes';\nimport { getPopupHeightForFixedAesList } from '../../utils/getPopupHeightForFixedAesList';\nimport FixedColorsList from './FixedColorsList.vue';\nimport FixedDotShapeList from './FixedDotShapeList.vue';\nimport FixedLineTypeList from './FixedLineTypeList.vue';\nimport FormWrapper from './FormWrapper.vue';\nimport PalettesForm from './PalettesForm.vue';\nimport MultiselectButton from '../MultiselectButton.vue';\nimport PlColorSlider from '../PlColorSlider.vue';\nimport Popup from '../Popup.vue';\nimport Reorder from '../../icons/Reorder.vue';\n\nconst props = defineProps<{\n  dataColumnLabel: string;\n  columnValueLabels: Record<string, string>;\n  usedAesInMapping: Record<AesType, boolean>;\n  modelValue: AestheticMappingCategorical;\n  allowReordering?: boolean;\n  allowHiding?: boolean;\n  allowNullOption?: boolean;\n}>();\n\nconst emit = defineEmits(['update:modelValue']);\n\nconst palettesOpen = ref(false);\nconst palette = ref<Palette>(props.modelValue.palette);\nconst categorical = computed(() => isCategorical(palette.value));\n\ntype EditableAesType = 'color' | 'dotShape' | 'lineType';\n\nconst activeValue = ref<string | null>(null);\nconst activeValueIndex = computed(() => {\n  if (activeValue.value === null) {\n    return null;\n  }\n  return props.modelValue.order.indexOf(activeValue.value);\n});\nconst activeAesType = ref<EditableAesType | null>(null);\n\nconst optionsList = computed(() => {\n  const options = props.modelValue.order.map((value: string) => {\n    const aes = props.modelValue.mapping[value]?.aes;\n    return {\n      text: props.columnValueLabels[value],\n      value,\n      dotShape: aes?.dotShape,\n      color: aes?.color,\n      lineType: aes?.lineShape,\n    };\n  });\n\n  return props.allowNullOption ? options : options.filter((op) => op.value !== 'null');\n});\n\nfunction onPaletteSelect(value: Palette) {\n  palette.value = value;\n  palettesOpen.value = false;\n  emit(\n    'update:modelValue',\n    createCategoricalMappingFromPalette(value, props.modelValue.order),\n  );\n}\n\nfunction onAesValueUpdate(\n  value: string | number,\n  aesField: string,\n  aesValue: string | DotShape | LineType,\n) {\n  emit('update:modelValue', {\n    ...props.modelValue,\n    mapping: {\n      ...props.modelValue.mapping,\n      [value]: {\n        ...props.modelValue.mapping[value],\n        aes: {\n          ...props.modelValue.mapping[value].aes,\n          [aesField]: aesValue,\n        },\n      },\n    },\n  });\n}\n\nconst itemRefs = reactive<\n  Record<EditableAesType, Record<string, ComponentPublicInstance | Element>>\n>({\n  color: {},\n  dotShape: {},\n  lineType: {},\n});\n\nfunction setRef(\n  type: EditableAesType,\n  item: (typeof optionsList.value)[0],\n  el: ComponentPublicInstance | null | Element,\n) {\n  if (el) {\n    itemRefs[type][item.value] = el;\n  }\n}\n\nfunction toggleForm(\n  item: (typeof optionsList.value)[0],\n  valueType: EditableAesType,\n) {\n  const isThisFormOpen\n    = activeValue.value === item.value && activeAesType.value === valueType;\n  activeValue.value = isThisFormOpen ? null : item.value;\n  activeAesType.value = isThisFormOpen ? null : valueType;\n}\n\nfunction closeForm() {\n  activeValue.value = null;\n  activeAesType.value = null;\n}\n\nconst selectedColorsList = computed(() =>\n  PALETTE_MAP[palette.value].colors.map((color) => ({ color, name: color })),\n);\n\nconst popupHeight = computed(() => {\n  if (!activeAesType.value) {\n    return 0;\n  }\n  return getPopupHeightForFixedAesList(\n    activeAesType.value === 'lineType' ? FIXED_LINE_TYPES.length : activeAesType.value === 'dotShape' ? FIXES_DOT_SHAPES.length : selectedColorsList.value.length,\n    activeAesType.value,\n  );\n});\n\nconst optionsListRef = ref();\n\nif (props.allowReordering) {\n  useSortable(optionsListRef, {\n    handle: '.column-value__reorder-icon',\n    onChange(indices) {\n      emit('update:modelValue', {\n        ...props.modelValue,\n        order: indices.map((idx) => props.modelValue.order[idx]),\n      });\n    },\n  });\n}\n\nfunction switchVisibility(option: { value: string }) {\n  emit('update:modelValue', {\n    ...props.modelValue,\n    hidden: {\n      ...props.modelValue.hidden,\n      [option.value]: props.modelValue.hidden?.[option.value] ? false : true,\n    },\n  });\n}\n\nfunction getColorScale(colors: string[], unknownColor: string, from = 0, to = 1) {\n  const colorStep = 1 / (colors.length - 1);\n  const scale = scaleLinear<string, string>()\n    .domain(colors.map((_c, idx) => from + idx * colorStep * (to - from)))\n    .range(colors);\n  return (v: number) => {\n    if (v > to || v < from) {\n      return unknownColor;\n    }\n    return scale(v);\n  };\n}\n\nconst continuousColorScale = computed(() =>\n  getColorScale(PALETTE_MAP[palette.value].colors, UNKNOWN_COLOR),\n);\n\nconst colorForPercent = computed(() =>\n  getColorScale(PALETTE_MAP[palette.value].colors, UNKNOWN_COLOR, 0, 100),\n);\nconst continuousMappingItems = ref(\n  props.modelValue.order.map(\n    (item) => props.modelValue.mapping[item].colorIdx * 100,\n  ),\n);\nwatch(\n  () => props.modelValue,\n  (v) => {\n    continuousMappingItems.value = v.order.map(\n      (item) => v.mapping[item].colorIdx * 100,\n    );\n  },\n);\nfunction updateContinuousColors(v: number[]) {\n  v.forEach((value, idx) => {\n    const item = props.modelValue.order[idx];\n    const newColorIdx = value / 100;\n    if (props.modelValue.mapping[item].colorIdx !== newColorIdx) {\n      emit('update:modelValue', {\n        ...props.modelValue,\n        mapping: {\n          ...props.modelValue.mapping,\n          [item]: {\n            colorIdx: newColorIdx,\n            aes: {\n              ...props.modelValue.mapping[item].aes,\n              color: continuousColorScale.value(newColorIdx),\n            },\n          },\n        },\n      });\n    }\n  });\n}\n\nfunction setActiveElementFromColorSlider(e: { index: number; status: boolean }) {\n  activeAesType.value = 'color';\n  activeValue.value = e.status ? props.modelValue.order[e.index] : null;\n}\n</script>\n\n<template>\n  <div class=\"aes-mapping-block\">\n    <div style=\"margin: 0 24px\">\n      <div class=\"section-title\">\n        <span>{{ dataColumnLabel }}</span>\n      </div>\n      <div style=\"margin: 24px 0\">\n        <MultiselectButton\n          label=\"Color Palette \"\n          icon=\"chevron-right\"\n          :title=\"PALETTE_MAP[palette].title\"\n          :palette=\"palette\"\n          @button-click=\"\n            palettesOpen = true;\n            closeForm();\n          \"\n        />\n      </div>\n      <div v-if=\"!categorical\" style=\"margin: 24px 0\">\n        <PlColorSlider\n          v-model=\"continuousMappingItems\"\n          :colors=\"PALETTE_MAP[palette].colors\"\n          :get-color-for-percent=\"colorForPercent\"\n          :active=\"activeValueIndex\"\n          @active=\"setActiveElementFromColorSlider\"\n          @update:model-value=\"updateContinuousColors\"\n        />\n      </div>\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\" @select=\"onPaletteSelect\" />\n      </FormWrapper>\n    </div>\n    <div v-if=\"allowReordering\" class=\"aes-settings-hint\">\n      Drag the rows to reorder\n    </div>\n    <div ref=\"optionsListRef\" class=\"column-values-list\">\n      <div\n        v-for=\"item of optionsList\"\n        :key=\"item.value\"\n        class=\"column-value\"\n        :class=\"{ 'column-value__with-reorder': allowReordering }\"\n      >\n        <div v-if=\"allowReordering\" class=\"column-value__reorder-icon\">\n          <component :is=\"Reorder\" />\n        </div>\n        <div class=\"column-value__title\">{{ item.text }}</div>\n        <div class=\"column-value__aes-group\">\n          <PlTooltip v-if=\"allowHiding\" :open-delay=\"100\" :close-delay=\"100\">\n            <div :style=\"{cursor: 'pointer'}\" class=\"column-value__aes\" @click.stop=\"switchVisibility(item)\">\n              <PlIcon24 :name=\"modelValue.hidden?.[item.value] ? 'view-hide' : 'view-show'\"/>\n            </div>\n            <template #tooltip>\n              <span> Show / hide </span>\n            </template>\n          </PlTooltip>\n          <div\n            v-if=\"usedAesInMapping.lineType\"\n            :ref=\"(v) => setRef('lineType', item, v)\"\n            class=\"column-value__aes\"\n            :class=\"{\n              aes__selected:\n                activeValue === item.value &&\n                activeAesType === 'lineType'\n            }\"\n            @click.stop=\"toggleForm(item, 'lineType')\"\n          >\n            <div\n              class=\"icon__line line\"\n              :class=\"{ [`line__${item.lineType}`]: true }\"\n            />\n          </div>\n          <div\n            v-if=\"usedAesInMapping.dotShape\"\n            :ref=\"(v) => setRef('dotShape', item, v)\"\n            class=\"column-value__aes\"\n            :class=\"{\n              aes__selected: activeValue === item.value && activeAesType === 'dotShape'\n            }\"\n            @click.stop=\"toggleForm(item, 'dotShape')\"\n          >\n            <div class=\"dot\" :class=\"{ [`dot__${item.dotShape}`]: true }\" />\n          </div>\n          <div\n            v-if=\"usedAesInMapping.fill || usedAesInMapping.stroke\"\n            :ref=\"(v) => setRef('color', item, v)\"\n            class=\"column-value__aes\"\n            :class=\"{\n              aes__selected: activeValue === item.value && activeAesType === 'color'\n            }\"\n            @click.stop=\"toggleForm(item, 'color')\"\n          >\n            <div\n              class=\"column-value__color\"\n              :style=\"{ background: item.color }\"\n            />\n          </div>\n          <Popup\n            v-if=\"\n              (activeAesType !== 'color' || categorical) &&\n                activeAesType !== null &&\n                activeValue === item.value\n            \"\n            :key=\"`${activeAesType}_${activeValue}`\"\n            :targetRef=\"itemRefs[activeAesType][activeValue] as HTMLElement\"\n            :height=\"popupHeight\"\n            @popup:close=\"closeForm\"\n          >\n            <div\n              class=\"fixed-aes-list\"\n              :class=\"{ 'fixed-aes-list__rows': false }\"\n            >\n              <FixedLineTypeList\n                v-if=\"activeAesType === 'lineType'\"\n                v-model=\"item.lineType as LineType\"\n                @update:modelValue=\"\n                  (v) => onAesValueUpdate(item.value, 'lineShape', v)\n                \"\n              />\n              <FixedDotShapeList\n                v-if=\"activeAesType === 'dotShape'\"\n                v-model=\"item.dotShape as DotShape\"\n                @update:modelValue=\"\n                  (v) => onAesValueUpdate(item.value, 'dotShape', v)\n                \"\n              />\n              <FixedColorsList\n                v-if=\"activeAesType === 'color'\"\n                v-model=\"item.color as string\"\n                :colors-list=\"selectedColorsList\"\n                @update:modelValue=\"\n                  (v) => onAesValueUpdate(item.value, 'color', v)\n                \"\n              />\n            </div>\n          </Popup>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n"],"names":["props","__props","emit","__emit","palettesOpen","ref","palette","categorical","computed","isCategorical","activeValue","activeValueIndex","activeAesType","optionsList","options","value","aes","_a","op","onPaletteSelect","createCategoricalMappingFromPalette","onAesValueUpdate","aesField","aesValue","itemRefs","reactive","setRef","type","item","el","toggleForm","valueType","isThisFormOpen","closeForm","selectedColorsList","PALETTE_MAP","color","popupHeight","getPopupHeightForFixedAesList","FIXED_LINE_TYPES","FIXES_DOT_SHAPES","optionsListRef","useSortable","indices","idx","switchVisibility","option","getColorScale","colors","unknownColor","from","to","colorStep","scale","scaleLinear","_c","v","continuousColorScale","UNKNOWN_COLOR","colorForPercent","continuousMappingItems","watch","updateContinuousColors","newColorIdx","setActiveElementFromColorSlider","e","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_hoisted_3","_hoisted_4","_createVNode","MultiselectButton","_unref","_cache","$event","_hoisted_5","PlColorSlider","_createBlock","FormWrapper","PalettesForm","_hoisted_6","_Fragment","_renderList","_normalizeClass","_hoisted_7","_resolveDynamicComponent","Reorder","_hoisted_8","_toDisplayString","_hoisted_9","PlTooltip","_withModifiers","PlIcon24","_normalizeStyle","Popup","FixedLineTypeList","FixedDotShapeList","FixedColorsList"],"mappings":"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"}

package/dist/components/AesSettings/FixedColorsList.vue.d.ts

@@ -1,7 +1,7 @@
 import { FIXED_COLORS } from '../../constantsAesthetic';
 type __VLS_Props = {
     modelValue: string;
-    colorUsing?: "fill" | "stroke";
+    colorUsing?: 'fill' | 'stroke';
     colorsList?: typeof FIXED_COLORS;
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {

package/dist/components/AesSettings/FixedColorsList.vue.js

@@ -1,32 +1,33 @@
-import { defineComponent as r, createElementBlock as o, openBlock as n, Fragment as m, renderList as a, normalizeStyle as s, normalizeClass as d, createElementVNode as c } from "vue";
-import { FIXED_COLORS as u } from "../../constantsAesthetic.js";
-const f = ["onClick"], L = /* @__PURE__ */ r({
+import { defineComponent as m, createElementBlock as n, openBlock as r, Fragment as s, renderList as a, normalizeStyle as d, normalizeClass as c, createElementVNode as u } from "vue";
+import { FIXED_COLORS as f } from "../../constantsAesthetic.js";
+const k = ["onClick"], V = /* @__PURE__ */ m({
   __name: "FixedColorsList",
   props: {
     modelValue: {},
     colorUsing: { default: "fill" },
-    colorsList: { default: () => u }
+    colorsList: { default: () => f }
   },
   emits: ["update:modelValue"],
-  setup(t, { emit: k }) {
-    return (i, l) => (n(!0), o(m, null, a(t.colorsList, (e) => (n(), o("div", {
+  setup(t, { emit: p }) {
+    const o = t;
+    return (i, l) => (r(!0), n(s, null, a(o.colorsList, (e) => (r(), n("div", {
       key: e.color,
-      class: d(["color-item", {
-        border: t.colorUsing === "stroke",
+      class: c(["color-item", {
+        border: o.colorUsing === "stroke",
         white: e.name === "White",
         empty: e.name === "None",
         selected: e.color === t.modelValue
       }]),
-      style: s(
+      style: d(
         e.name !== "White" && e.name !== "None" ? `${t.colorUsing === "fill" ? "background" : "border-color"}: ${e.color};` : ""
       ),
       onClick: (C) => i.$emit("update:modelValue", e.color)
     }, [...l[0] || (l[0] = [
-      c("div", { class: "checkmark" }, null, -1)
-    ])], 14, f))), 128));
+      u("div", { class: "checkmark" }, null, -1)
+    ])], 14, k))), 128));
   }
 });
 export {
-  L as default
+  V as default
 };
 //# sourceMappingURL=FixedColorsList.vue.js.map

package/dist/components/AesSettings/FixedColorsList.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"FixedColorsList.vue.js","sources":["../../../src/components/AesSettings/FixedColorsList.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { FIXED_COLORS } from '../../constantsAesthetic';\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: string;\n    colorUsing?: \"fill\" | \"stroke\";\n    colorsList?: typeof FIXED_COLORS;\n  }>(),\n  {\n    colorUsing: \"fill\",\n    colorsList: () => FIXED_COLORS\n  },\n);\n\nconst emit = defineEmits([\"update:modelValue\"]);\n</script>\n\n<template>\n  <div\n    v-for=\"color of colorsList\"\n    :key=\"color.color\"\n    class=\"color-item\"\n    :class=\"{\n      border: colorUsing === 'stroke',\n      white: color.name === 'White',\n      empty: color.name === 'None',\n      selected: color.color === modelValue,\n    }\"\n    :style=\"\n      color.name !== 'White' && color.name !== 'None'\n        ? `${colorUsing === 'fill' ? 'background' : 'border-color'}: ${\n            color.color\n          };`\n        : ''\n    \"\n    @click=\"$emit('update:modelValue', color.color)\"\n  >\n    <div class=\"checkmark\" />\n  </div>\n</template>\n"],"names":["_createElementBlock","_Fragment","_renderList","__props","color","_normalizeStyle","$event","$emit","_createElementVNode"],"mappings":";;;;;;;;;;;6BAmBEA,EAoBMC,GAAA,MAAAC,EAnBYC,EAAA,YAAU,CAAnBC,YADTJ,EAoBM,OAAA;AAAA,MAlBH,KAAKI,EAAM;AAAA,MACZ,UAAM,cAAY;AAAA,gBACMD,EAAA,eAAU;AAAA,QAA4B,OAAAC,EAAM,SAAI;AAAA,QAA2B,OAAAA,EAAM,SAAI;AAAA,kBAA6BA,EAAM,UAAUD,EAAA;AAAA,MAAA;MAMzJ,OAAKE;AAAAA,QAASD,EAAM,SAAI,WAAgBA,EAAM,SAAI,YAAyBD,EAAA,eAAU,SAAA,eAAA,cAAA,KAA6DC,EAAM;;MAOxJ,SAAK,CAAAE,MAAEC,EAAAA,MAAK,qBAAsBH,EAAM,KAAK;AAAA,IAAA;MAE9CI,EAAyB,OAAA,EAApB,OAAM,YAAA,GAAW,MAAA,EAAA;AAAA,IAAA;;;"}
+{"version":3,"file":"FixedColorsList.vue.js","sources":["../../../src/components/AesSettings/FixedColorsList.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { FIXED_COLORS } from '../../constantsAesthetic';\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: string;\n    colorUsing?: 'fill' | 'stroke';\n    colorsList?: typeof FIXED_COLORS;\n  }>(),\n  {\n    colorUsing: 'fill',\n    colorsList: () => FIXED_COLORS,\n  },\n);\n\nconst _emit = defineEmits(['update:modelValue']);\n</script>\n\n<template>\n  <div\n    v-for=\"color of props.colorsList\"\n    :key=\"color.color\"\n    class=\"color-item\"\n    :class=\"{\n      border: props.colorUsing === 'stroke',\n      white: color.name === 'White',\n      empty: color.name === 'None',\n      selected: color.color === modelValue,\n    }\"\n    :style=\"\n      color.name !== 'White' && color.name !== 'None'\n        ? `${colorUsing === 'fill' ? 'background' : 'border-color'}: ${\n          color.color\n        };`\n        : ''\n    \"\n    @click=\"$emit('update:modelValue', color.color)\"\n  >\n    <div class=\"checkmark\" />\n  </div>\n</template>\n"],"names":["props","__props","_openBlock","_createElementBlock","_Fragment","_renderList","color","_normalizeStyle","$event","$emit","_createElementVNode"],"mappings":";;;;;;;;;;;AAGA,UAAMA,IAAQC;sBAgBZC,EAAA,EAAA,GAAAC,EAoBMC,GAAA,MAAAC,EAnBYL,EAAM,aAAfM,YADTH,EAoBM,OAAA;AAAA,MAlBH,KAAKG,EAAM;AAAA,MACZ,UAAM,cAAY;AAAA,QACM,QAAAN,EAAM,eAAU;AAAA,QAA4B,OAAAM,EAAM,SAAI;AAAA,QAA2B,OAAAA,EAAM,SAAI;AAAA,kBAA6BA,EAAM,UAAUL,EAAA;AAAA,MAAA;MAM/J,OAAKM;AAAAA,QAASD,EAAM,SAAI,WAAgBA,EAAM,SAAI,YAAyBL,EAAA,eAAU,SAAA,eAAA,cAAA,KAA2DK,EAAM;;MAOtJ,SAAK,CAAAE,MAAEC,EAAAA,MAAK,qBAAsBH,EAAM,KAAK;AAAA,IAAA;MAE9CI,EAAyB,OAAA,EAApB,OAAM,YAAA,GAAW,MAAA,EAAA;AAAA,IAAA;;;"}

package/dist/components/AesSettings/FixedDotShapeList.vue.js

@@ -1,24 +1,25 @@
-import { defineComponent as i, createElementBlock as l, openBlock as o, Fragment as m, renderList as r, normalizeClass as d } from "vue";
-import { FIXES_DOT_SHAPES as u } from "../../constantsAesthetic.js";
-const a = ["onClick"], k = /* @__PURE__ */ i({
+import { defineComponent as i, createElementBlock as o, openBlock as l, Fragment as m, renderList as d, normalizeClass as u } from "vue";
+import { FIXES_DOT_SHAPES as a } from "../../constantsAesthetic.js";
+const s = ["onClick"], C = /* @__PURE__ */ i({
   __name: "FixedDotShapeList",
   props: {
     modelValue: {},
-    list: { default: () => u }
+    list: { default: () => a }
   },
   emits: ["update:modelValue"],
   setup(t, { emit: c }) {
-    return (n, s) => (o(!0), l(m, null, r(t.list, (e) => (o(), l("div", {
+    const n = t;
+    return (r, _) => (l(!0), o(m, null, d(n.list, (e) => (l(), o("div", {
       key: e,
-      class: d(["color-item dot", {
+      class: u(["color-item dot", {
         selected: e === t.modelValue,
         [`dot__${e}`]: !0
       }]),
-      onClick: (_) => n.$emit("update:modelValue", e)
-    }, null, 10, a))), 128));
+      onClick: (p) => r.$emit("update:modelValue", e)
+    }, null, 10, s))), 128));
   }
 });
 export {
-  k as default
+  C as default
 };
 //# sourceMappingURL=FixedDotShapeList.vue.js.map

package/dist/components/AesSettings/FixedDotShapeList.vue.js.map

@@ -1 +1 @@
-{"version":3,"file":"FixedDotShapeList.vue.js","sources":["../../../src/components/AesSettings/FixedDotShapeList.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { DotShape } from './types';\nimport { FIXES_DOT_SHAPES } from '../../constantsAesthetic';\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: string;\n    list?: DotShape[];\n  }>(),\n  {\n    list: () => FIXES_DOT_SHAPES\n  },\n);\n\nconst emit = defineEmits([\"update:modelValue\"]);\n</script>\n\n<template>\n  <div\n    v-for=\"shape of list\"\n    :key=\"shape\"\n    class=\"color-item dot\"\n    :class=\"{\n      selected: shape === modelValue,\n      [`dot__${shape}`]: true\n    }\"\n    @click=\"$emit('update:modelValue', shape)\"\n  />\n</template>\n"],"names":["_createElementBlock","_Fragment","_renderList","__props","shape","$event","$emit"],"mappings":";;;;;;;;;;6BAkBEA,EASEC,GAAA,MAAAC,EARgBC,EAAA,MAAI,CAAbC,YADTJ,EASE,OAAA;AAAA,MAPC,KAAKI;AAAA,MACN,UAAM,kBAAgB;AAAA,QACI,UAAAA,MAAUD,EAAA;AAAA,iBAA2BC,CAAK,EAAA,GAAA;AAAA,MAAA;MAInE,SAAK,CAAAC,MAAEC,EAAAA,MAAK,qBAAsBF,CAAK;AAAA,IAAA;;;"}
+{"version":3,"file":"FixedDotShapeList.vue.js","sources":["../../../src/components/AesSettings/FixedDotShapeList.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { DotShape } from './types';\nimport { FIXES_DOT_SHAPES } from '../../constantsAesthetic';\n\nconst props = withDefaults(\n  defineProps<{\n    modelValue: string;\n    list?: DotShape[];\n  }>(),\n  {\n    list: () => FIXES_DOT_SHAPES,\n  },\n);\n\nconst _emit = defineEmits(['update:modelValue']);\n</script>\n\n<template>\n  <div\n    v-for=\"shape of props.list\"\n    :key=\"shape\"\n    class=\"color-item dot\"\n    :class=\"{\n      selected: shape === modelValue,\n      [`dot__${shape}`]: true\n    }\"\n    @click=\"$emit('update:modelValue', shape)\"\n  />\n</template>\n"],"names":["props","__props","_openBlock","_createElementBlock","_Fragment","_renderList","shape","$event","$emit"],"mappings":";;;;;;;;;;AAIA,UAAMA,IAAQC;sBAcZC,EAAA,EAAA,GAAAC,EASEC,GAAA,MAAAC,EARgBL,EAAM,OAAfM,YADTH,EASE,OAAA;AAAA,MAPC,KAAKG;AAAA,MACN,UAAM,kBAAgB;AAAA,QACI,UAAAA,MAAUL,EAAA;AAAA,iBAA2BK,CAAK,EAAA,GAAA;AAAA,MAAA;MAInE,SAAK,CAAAC,MAAEC,EAAAA,MAAK,qBAAsBF,CAAK;AAAA,IAAA;;;"}