@milaboratories/graph-maker 1.2.0 → 1.2.2

package/dist/components/Chart.vue.js

@@ -1,4 +1,4 @@
-import { defineComponent as X, ref as h, watch as y, computed as p, createElementBlock as C, openBlock as s, createElementVNode as S, createVNode as k, createCommentVNode as c, createBlock as d, withKeys as J, resolveDynamicComponent as Q, renderSlot as Y, unref as r, withCtx as B, createTextVNode as D, normalizeClass as R, withModifiers as U } from "vue";
+import { defineComponent as X, ref as h, watch as y, computed as p, createElementBlock as C, openBlock as s, createElementVNode as S, createBlock as c, createCommentVNode as d, withKeys as J, resolveDynamicComponent as Q, renderSlot as Y, unref as l, withCtx as k, createTextVNode as B, normalizeClass as O, createVNode as R, withModifiers as U } from "vue";
 import { PlNotificationAlert as _, PlDropdown as ee, PlAutocomplete as te, PlBtnGhost as $ } from "@platforma-sdk/ui-vue";
 import ae from "./DendroTable.vue.js";
 import oe from "./DendroTooltip.vue.js";
@@ -9,10 +9,10 @@ import ne from "../icons/EditIcon.vue.js";
 import { useStore as ie } from "../store.js";
 import se from "./GraphStatusScreen.vue.js";
 const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["value", "disabled"], ve = { class: "chart_titleLineSlot" }, me = {
-  key: 0,
+  key: 1,
   class: "chart_tabBy"
 }, pe = {
-  key: 1,
+  key: 2,
   class: "chart_controls"
 }, ke = /* @__PURE__ */ X({
   __name: "Chart",
@@ -29,20 +29,20 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
   },
   emits: ["graph-title-update", "dendro-node-select", "dendro-tooltip-btn-click"],
   setup(n, { emit: I }) {
-    const x = I, o = ie(), P = n, g = h(P.graphTitle);
-    y(() => P.graphTitle, (t) => {
+    const D = I, o = ie(), x = n, g = h(x.graphTitle);
+    y(() => x.graphTitle, (t) => {
       g.value = t;
     });
-    const G = p(() => {
+    const P = p(() => {
       var t;
       return (t = o.value.reactive.optionsState.components.tabBy) == null ? void 0 : t.selectorStates[0];
     }), v = p(() => {
       var t;
-      return (t = G.value) == null ? void 0 : t.selectedSource;
+      return (t = P.value) == null ? void 0 : t.selectedSource;
     }), b = p(() => {
       var t, e;
-      return (e = (t = G.value) == null ? void 0 : t.selectedFilterValues) == null ? void 0 : e[0];
-    }), L = p(() => {
+      return (e = (t = P.value) == null ? void 0 : t.selectedFilterValues) == null ? void 0 : e[0];
+    }), G = p(() => {
       var t;
       return (t = o.value.reactive.optionsState.components.filters) == null ? void 0 : t.selectorStates;
     }), m = h(b.value);
@@ -53,18 +53,18 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
       var a;
       if (!o.value.columnsDataStore.value)
         return Promise.resolve([]);
-      const e = L.value.find((i) => i.selectedSource === t);
+      const e = G.value.find((i) => i.selectedSource === t);
       if (e && (((a = e.selectedFilterValues) == null ? void 0 : a.length) ?? 0) > 0) {
         const i = e.selectedFilterValues ?? [];
-        return Promise.all(i.map((u) => H(t, u)));
+        return Promise.all(i.map((u) => F(t, u)));
       }
-      const l = await o.value.controller.getUniqueSourceValuesWithLabels(
+      const r = await o.value.controller.getUniqueSourceValuesWithLabels(
         o.value.columnsDataStore.value,
         o.value.inputGuide.value,
         t,
         A
       );
-      return l.overflow ? null : l.values;
+      return r.overflow ? null : r.values;
     }
     const f = h();
     y([
@@ -76,9 +76,9 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
       if (v.value === void 0 || m.value !== void 0 || t === void 0)
         return;
       let e = t;
-      if (t === null && (e = await F(v.value, "")), e != null && e.length) {
-        const l = e[0].value;
-        m.value = l, T(l);
+      if (t === null && (e = await L(v.value, "")), e != null && e.length) {
+        const r = e[0].value;
+        m.value = r, T(r);
       }
     }, { immediate: !0 });
     function T(t) {
@@ -91,24 +91,24 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
     }
     function q(t) {
       const e = t.currentTarget;
-      g.value = e.value, x("graph-title-update", e.value);
+      g.value = e.value, D("graph-title-update", e.value);
     }
     function Z(t) {
-      x("dendro-node-select", t);
+      D("dendro-node-select", t);
     }
-    async function F(t, e, l = "label") {
-      var N;
+    async function L(t, e, r = "label") {
+      var E;
       if (!o.value.columnsDataStore.value)
         return Promise.resolve([]);
-      const a = L.value.find((V) => V.selectedSource === t);
-      if (a && (((N = a.selectedFilterValues) == null ? void 0 : N.length) ?? 0) > 0) {
-        const V = a.selectedFilterValues ?? [], O = await Promise.all(V.map((w) => H(t, w)));
-        return e ? O.filter((w) => w.label.toLowerCase().includes(e.toLowerCase())) : O;
+      const a = G.value.find((V) => V.selectedSource === t);
+      if (a && (((E = a.selectedFilterValues) == null ? void 0 : E.length) ?? 0) > 0) {
+        const V = a.selectedFilterValues ?? [], N = await Promise.all(V.map((w) => F(t, w)));
+        return e ? N.filter((w) => w.label.toLowerCase().includes(e.toLowerCase())) : N;
       }
-      const i = l === "label" ? e : void 0, u = l === "value" ? e : void 0;
+      const i = r === "label" ? e : void 0, u = r === "value" ? e : void 0;
       return (await o.value.controller.getUniqueSourceValuesWithLabels(o.value.columnsDataStore.value, o.value.inputGuide.value, t, A, i, u)).values;
     }
-    async function H(t, e) {
+    async function F(t, e) {
       return o.value.columnsDataStore.value ? await o.value.controller.getUniqueSourceValuesWithLabels(
         o.value.columnsDataStore.value,
         o.value.inputGuide.value,
@@ -118,13 +118,13 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
         e
       ).then((a) => a.values[0]) : Promise.resolve({ value: e, label: " " });
     }
-    const E = h(), j = p(() => {
+    const H = h(), j = p(() => {
       var e;
       if (o.value.reactive.chartType !== "discrete")
         return !1;
       const t = o.value.reactive.optionsState.components;
       if ((e = t.primaryGrouping) != null && e.selectorStates.length) {
-        const l = t.primaryGrouping.selectorStates[0].selectedSource, a = o.value.reactive.dataBindAes[l];
+        const r = t.primaryGrouping.selectorStates[0].selectedSource, a = o.value.reactive.dataBindAes[r];
         if ((a == null ? void 0 : a.type) === "categorical" && a.hidden)
           return Object.values(a.hidden).length > 0 && a.order.some((i) => {
             var u;
@@ -138,7 +138,7 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
         return !1;
       const t = o.value.reactive.optionsState.components;
       if ((e = t.secondaryGrouping) != null && e.selectorStates.length) {
-        const l = t.secondaryGrouping.selectorStates[0].selectedSource, a = o.value.reactive.dataBindAes[l];
+        const r = t.secondaryGrouping.selectorStates[0].selectedSource, a = o.value.reactive.dataBindAes[r];
         if ((a == null ? void 0 : a.type) === "categorical" && a.hidden)
           return Object.values(a.hidden).length > 0 && a.order.some((i) => {
             var u;
@@ -154,7 +154,7 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
       o.value.reactive.tabDefaultState.axes.reorderSecondaryOpen = !0, o.value.reactive.currentTab = "axes";
     }
     return (t, e) => {
-      var l;
+      var r;
       return s(), C("div", ue, [
         S("div", ce, [
           S("input", {
@@ -167,28 +167,29 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
               (i = a.target) == null || i.blur();
             }, ["enter"]))
           }, null, 40, de),
-          n.allowTitleEditing ? (s(), d(Q(ne), {
+          n.allowTitleEditing ? (s(), c(Q(ne), {
             key: 0,
             class: "chart_titleEdit"
-          })) : c("", !0),
+          })) : d("", !0),
           S("div", ve, [
             Y(t.$slots, "default")
           ])
         ]),
-        k(r(_), {
-          modelValue: r(o).reactive.showTooltipHint,
-          "onUpdate:modelValue": e[1] || (e[1] = (a) => r(o).reactive.showTooltipHint = a),
+        l(o).reactive.tooltipHintWasShown ? d("", !0) : (s(), c(l(_), {
+          key: 0,
+          modelValue: l(o).reactive.showTooltipHint,
+          "onUpdate:modelValue": e[1] || (e[1] = (a) => l(o).reactive.showTooltipHint = a),
           type: "success",
           class: "chart_tooltipHint",
           width: "170px"
         }, {
-          default: B(() => [...e[10] || (e[10] = [
-            D(" Hit enter to pin tooltip ", -1)
+          default: k(() => [...e[10] || (e[10] = [
+            B(" Hit enter to pin tooltip ", -1)
           ])]),
           _: 1
-        }, 8, ["modelValue"]),
+        }, 8, ["modelValue"])),
         v.value ? (s(), C("div", me, [
-          f.value || f.value === void 0 && r(o).loading.inputGuide ? (s(), d(r(ee), {
+          f.value || f.value === void 0 && l(o).loading.inputGuide ? (s(), c(l(ee), {
             key: 0,
             modelValue: m.value,
             "onUpdate:modelValue": [
@@ -197,7 +198,7 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
             ],
             label: "Show for",
             options: f.value
-          }, null, 8, ["modelValue", "options"])) : (s(), d(r(te), {
+          }, null, 8, ["modelValue", "options"])) : (s(), c(l(te), {
             key: 1,
             modelValue: m.value,
             "onUpdate:modelValue": [
@@ -205,73 +206,73 @@ const ue = { class: "chart_container" }, ce = { class: "chart_header" }, de = ["
               e[5] || (e[5] = (a) => T(a))
             ],
             label: "Show for",
-            "options-search": (a, i) => F(v.value, a, i)
+            "options-search": (a, i) => L(v.value, a, i)
           }, null, 8, ["modelValue", "options-search"]))
-        ])) : c("", !0),
+        ])) : d("", !0),
         S("div", {
           ref_key: "chartContainerRef",
-          ref: E,
-          class: R(["chart_main-content", [{ "chart_main-content__dendro": r(o).reactive.chartType === "dendro" }, "pl-scrollable"]])
+          ref: H,
+          class: O(["chart_main-content", [{ "chart_main-content__dendro": l(o).reactive.chartType === "dendro" }, "pl-scrollable"]])
         }, [
           S("div", {
             id: "chartSvgContainer",
-            class: R({
+            class: O({
               chart_ready: n.graphStatus === "ready",
               chart_loading: n.graphStatus === "loading",
-              chart_activeLassoSelection: ((l = r(o).reactive.lassoControlsState) == null ? void 0 : l.mode) === "selection"
+              chart_activeLassoSelection: ((r = l(o).reactive.lassoControlsState) == null ? void 0 : r.mode) === "selection"
             })
           }, null, 2),
-          k(se, {
+          R(se, {
             graphStatus: n.graphStatus,
             top: v.value ? 24 : 0,
             bottom: 11,
             customStatusText: n.customStatusText,
             errorInfo: n.errorInfo
           }, null, 8, ["graphStatus", "top", "customStatusText", "errorInfo"]),
-          r(o).reactive.chartType === "dendro" && n.chartData && r(o).reactive.layersSettings.dendro.showTable ? (s(), d(ae, {
+          l(o).reactive.chartType === "dendro" && n.chartData && l(o).reactive.layersSettings.dendro.showTable ? (s(), c(ae, {
             key: 0,
             chartData: n.chartData,
             onRowSelect: Z
-          }, null, 8, ["chartData"])) : c("", !0),
-          r(o).reactive.dendroInfoByClick ? (s(), d(oe, {
+          }, null, 8, ["chartData"])) : d("", !0),
+          l(o).reactive.dendroInfoByClick ? (s(), c(oe, {
             key: 1,
-            info: r(o).reactive.dendroInfoByClick,
-            containerRef: E.value,
+            info: l(o).reactive.dendroInfoByClick,
+            containerRef: H.value,
             tooltipBtn: n.dendroTooltipButton,
             onTooltipBtnClick: e[6] || (e[6] = (a) => t.$emit("dendro-tooltip-btn-click", a)),
             onClose: e[7] || (e[7] = (a) => {
-              r(o).reactive.dendroInfoByClick = null, t.$emit("dendro-node-select", null);
+              l(o).reactive.dendroInfoByClick = null, t.$emit("dendro-node-select", null);
             })
-          }, null, 8, ["info", "containerRef", "tooltipBtn"])) : c("", !0)
+          }, null, 8, ["info", "containerRef", "tooltipBtn"])) : d("", !0)
         ], 2),
         n.graphStatus === "ready" ? (s(), C("div", pe, [
-          k(re),
-          r(o).reactive.chartType === "scatterplot-umap" ? (s(), d(le, {
+          R(re),
+          l(o).reactive.chartType === "scatterplot-umap" ? (s(), c(le, {
             key: 0,
             "chart-ref": n.chartRef,
             isScatterplotZoomChanged: n.isScatterplotZoomChanged
-          }, null, 8, ["chart-ref", "isScatterplotZoomChanged"])) : c("", !0),
-          j.value ? (s(), d(r($), {
+          }, null, 8, ["chart-ref", "isScatterplotZoomChanged"])) : d("", !0),
+          j.value ? (s(), c(l($), {
             key: 1,
             icon: "view-hide",
             onClick: e[8] || (e[8] = U(() => M(), ["stop"]))
           }, {
-            default: B(() => [...e[11] || (e[11] = [
-              D(" Hidden (primary) ", -1)
+            default: k(() => [...e[11] || (e[11] = [
+              B(" Hidden (primary) ", -1)
             ])]),
             _: 1
-          })) : c("", !0),
-          K.value ? (s(), d(r($), {
+          })) : d("", !0),
+          K.value ? (s(), c(l($), {
             key: 2,
             icon: "view-hide",
             onClick: e[9] || (e[9] = U(() => z(), ["stop"]))
           }, {
-            default: B(() => [...e[12] || (e[12] = [
-              D(" Hidden (secondary) ", -1)
+            default: k(() => [...e[12] || (e[12] = [
+              B(" Hidden (secondary) ", -1)
             ])]),
             _: 1
-          })) : c("", !0)
-        ])) : c("", !0)
+          })) : d("", !0)
+        ])) : d("", !0)
       ]);
     };
   }

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

@@ -1 +1 @@
-{"version":3,"file":"Chart.vue.js","sources":["../../src/components/Chart.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ChartInterface, ErrorInfo } from '@milaboratories/miplots4';\nimport type { SelectorStateFilter } from '@milaboratories/pf-plots';\nimport type { ListOption } from '@platforma-sdk/ui-vue';\nimport { PlAutocomplete, PlBtnGhost, PlDropdown, PlNotificationAlert } from '@platforma-sdk/ui-vue';\nimport { computed, ref, watch } from 'vue';\nimport DendroTable from '../components/DendroTable.vue';\nimport DendroTooltip from '../components/DendroTooltip.vue';\nimport LassoControls from '../components/LassoControls/index.vue';\nimport Zoom from '../components/Zoom/index.vue';\nimport { MAX_SEARCH_OPTIONS_LIST_LENGTH } from '../constantsCommon.ts';\nimport EditIcon from '../icons/EditIcon.vue';\nimport { useStore } from '../store.ts';\nimport type { GraphStatus, StatusTextData } from '../types.ts';\nimport GraphStatusScreen from './GraphStatusScreen.vue';\n\nconst emit = defineEmits(['graph-title-update', 'dendro-node-select', 'dendro-tooltip-btn-click']);\n\nconst store = useStore();\n\nconst props = defineProps<{\n  graphStatus: GraphStatus;\n  graphTitle: string;\n  dendroTooltipButton?: string;\n  chartData: Record<string, unknown> | null;\n  chartRef: ChartInterface | null;\n  errorInfo: ErrorInfo | null;\n  customStatusText?: Partial<StatusTextData>;\n  allowTitleEditing?: boolean;\n  isScatterplotZoomChanged?: boolean;\n}>();\n\nconst title = ref(props.graphTitle);\n// title can be updated from graph-maker settings\nwatch(() => props.graphTitle, (graphTitle) => {\n  title.value = graphTitle;\n});\n\nconst tabByState = computed(() => store.value.reactive.optionsState.components.tabBy?.selectorStates[0] as SelectorStateFilter | undefined);\nconst tabBySource = computed(() => tabByState.value?.selectedSource);\nconst tabByFilterValue = computed(() => tabByState.value?.selectedFilterValues?.[0]);\nconst filtersStates = computed(() => store.value.reactive.optionsState.components.filters?.selectorStates as SelectorStateFilter[]);\n\nconst tabByLocalValue = ref(tabByFilterValue.value);\nwatch([() => tabBySource.value, () => tabByFilterValue.value], () => { // tabBy column changed, needs to update selected value\n  tabByLocalValue.value = tabByFilterValue.value;\n}, { deep: true });\n\n// try to load full options list, without search query; if result is not overflow, use values from it in regular dropdown, no autocomplete;\nasync function loadOptions(sourceId: string) {\n  if (!store.value.columnsDataStore.value) {\n    return Promise.resolve([]);\n  }\n  // if the same source is selected in filters, return only selected values;\n  const filtersStateWithTheSameSource = filtersStates.value.find((state) => state.selectedSource === sourceId) as SelectorStateFilter | undefined;\n  if (filtersStateWithTheSameSource && (filtersStateWithTheSameSource.selectedFilterValues?.length ?? 0) > 0) {\n    const selectedValues = filtersStateWithTheSameSource.selectedFilterValues ?? [];\n    return Promise.all(selectedValues.map((selectedValue) => searchSelectedFilterValueOptions(sourceId, selectedValue)));\n  }\n  const response = await store.value.controller.getUniqueSourceValuesWithLabels(\n    store.value.columnsDataStore.value,\n    store.value.inputGuide.value,\n    sourceId,\n    MAX_SEARCH_OPTIONS_LIST_LENGTH,\n  );\n  return response.overflow ? null : response.values;\n}\nconst preloadedOptions = ref<ListOption[] | null | undefined>();\nwatch([\n  () => tabBySource.value,\n  () => store.value.loading.inputGuide,\n], async ([v, loading]) => {\n  if (v === undefined || loading || !store.value.columnsDataStore.value) {\n    return undefined;\n  }\n  preloadedOptions.value = await loadOptions(v);\n}, { immediate: true });\n\nwatch(() => preloadedOptions.value, async (opts) => {\n  if (\n    tabBySource.value === undefined // no tabBy selected\n    || tabByLocalValue.value !== undefined // tabBy selected and has selected value\n    || opts === undefined // options not loaded yet\n  ) {\n    return;\n  }\n  let availableOptions = opts;\n  if (opts === null) { // options loaded but too many unique values\n    availableOptions = await searchFilterOptions(tabBySource.value, '');\n  }\n  if (availableOptions?.length) {\n    const nextFilterValue = availableOptions[0].value as string;\n    tabByLocalValue.value = nextFilterValue;\n    onFilterValueUpdate(nextFilterValue);\n  }\n}, { immediate: true });\n\nfunction onFilterValueUpdate(value: string) {\n  const prevSelectorStates = store.value.reactive.optionsState.components.tabBy.selectorStates;\n  if (prevSelectorStates.length) {\n    store.value.reactive.optionsState.components.tabBy.selectorStates = [{\n      ...prevSelectorStates[0],\n      type: 'equals',\n      selectedFilterValues: [value],\n    }];\n  }\n}\n\nfunction onTitleChange(e: Event) {\n  const target = e.currentTarget as HTMLInputElement;\n  title.value = target.value;\n  emit('graph-title-update', target.value);\n}\n\nfunction onTableRowSelect(id: number) {\n  emit('dendro-node-select', id);\n}\n\n// search options for autocomplete component; use label-mode search for options and value-mode for search of label of selected by default value;\nasync function searchFilterOptions(sourceId: string, searchStr: string, type: 'value' | 'label' = 'label') {\n  if (!store.value.columnsDataStore.value) {\n    return Promise.resolve([]);\n  }\n  // if the same source is selected in filters, return only selected values;\n  const filtersStateWithTheSameSource = filtersStates.value.find((state) => state.selectedSource === sourceId) as SelectorStateFilter | undefined;\n  if (filtersStateWithTheSameSource && (filtersStateWithTheSameSource.selectedFilterValues?.length ?? 0) > 0) {\n    const selectedValues = filtersStateWithTheSameSource.selectedFilterValues ?? [];\n    const results = await Promise.all(selectedValues.map((selectedValue) => searchSelectedFilterValueOptions(sourceId, selectedValue)));\n    return searchStr ? results.filter((v) => v.label.toLowerCase().includes(searchStr.toLowerCase())) : results;\n  }\n  const searchLabelStr = type === 'label' ? searchStr : undefined;\n  const searchValueStr = type === 'value' ? searchStr : undefined;\n  return (await store.value.controller.getUniqueSourceValuesWithLabels(store.value.columnsDataStore.value, store.value.inputGuide.value, sourceId, MAX_SEARCH_OPTIONS_LIST_LENGTH, searchLabelStr, searchValueStr)).values;\n}\n\n// search by value, not by label;\nasync function searchSelectedFilterValueOptions(sourceId: string, selectedValue: string) {\n  if (!store.value.columnsDataStore.value) {\n    return Promise.resolve({ value: selectedValue, label: ' ' }); // don't show non-human-readable value\n  }\n  const value = await store.value.controller.getUniqueSourceValuesWithLabels(\n    store.value.columnsDataStore.value, store.value.inputGuide.value,\n    sourceId, 1, undefined, selectedValue).then((v) => v.values[0]);\n  return value;\n}\n\nconst chartContainerRef = ref();\n\nconst hasPrimaryHidden = computed(() => {\n  if (store.value.reactive.chartType !== 'discrete') {\n    return false;\n  }\n  const optionsState = store.value.reactive.optionsState.components;\n  if (optionsState.primaryGrouping?.selectorStates.length) {\n    const columnName = optionsState.primaryGrouping.selectorStates[0].selectedSource;\n    const dataBindAes = store.value.reactive.dataBindAes[columnName];\n    if (dataBindAes?.type === 'categorical' && dataBindAes.hidden) {\n      return Object.values(dataBindAes.hidden).length > 0 && dataBindAes.order.some((v) => dataBindAes.hidden?.[v]);\n    }\n  }\n  return false;\n});\nconst hasSecondaryHidden = computed(() => {\n  if (store.value.reactive.chartType !== 'discrete') {\n    return false;\n  }\n  const optionsState = store.value.reactive.optionsState.components;\n  if (optionsState.secondaryGrouping?.selectorStates.length) {\n    const columnName = optionsState.secondaryGrouping.selectorStates[0].selectedSource;\n    const dataBindAes = store.value.reactive.dataBindAes[columnName];\n    if (dataBindAes?.type === 'categorical' && dataBindAes.hidden) {\n      return Object.values(dataBindAes.hidden).length > 0 && dataBindAes.order.some((v) => dataBindAes.hidden?.[v]);\n    }\n  }\n  return false;\n});\nfunction openAxesSettingsPrimary() {\n  store.value.reactive.tabDefaultState['axes'].reorderPrimaryOpen = true;\n  store.value.reactive.currentTab = 'axes';\n}\nfunction openAxesSettingsSecondary() {\n  store.value.reactive.tabDefaultState['axes'].reorderSecondaryOpen = true;\n  store.value.reactive.currentTab = 'axes';\n}\n\n</script>\n\n<template>\n  <div class=\"chart_container\">\n    <div class=\"chart_header\">\n      <input\n        class=\"chart_title\"\n        :value=\"title\"\n        :disabled=\"!allowTitleEditing\"\n        @change=\"onTitleChange\"\n        @keyup.enter=\"(e) => { (e.target as HTMLInputElement)?.blur() }\"\n      />\n      <component :is=\"EditIcon\" v-if=\"allowTitleEditing\" class=\"chart_titleEdit\" />\n      <div class=\"chart_titleLineSlot\">\n        <slot />\n      </div>\n    </div>\n    <PlNotificationAlert\n      v-model=\"store.reactive.showTooltipHint\" type=\"success\" class=\"chart_tooltipHint\"\n      width=\"170px\"\n    >\n      Hit enter to pin tooltip\n    </PlNotificationAlert>\n    <div v-if=\"tabBySource\" class=\"chart_tabBy\">\n      <PlDropdown\n        v-if=\"preloadedOptions || (preloadedOptions === undefined && store.loading.inputGuide)\"\n        v-model=\"tabByLocalValue\" label=\"Show for\" :options=\"preloadedOptions\"\n        @update:modelValue=\"(v) => onFilterValueUpdate(v as string)\"\n      />\n      <PlAutocomplete\n        v-else v-model=\"tabByLocalValue\" label=\"Show for\"\n        :options-search=\"(str, type) => searchFilterOptions(tabBySource as string, str, type)\"\n        @update:modelValue=\"(v) => onFilterValueUpdate(v as string)\"\n      />\n    </div>\n    <div\n      ref=\"chartContainerRef\" class=\"chart_main-content\"\n      :class=\"[{ 'chart_main-content__dendro': store.reactive.chartType === 'dendro' }, 'pl-scrollable']\"\n    >\n      <div\n        id=\"chartSvgContainer\" :class=\"{\n          'chart_ready': graphStatus === 'ready',\n          'chart_loading': graphStatus === 'loading',\n          'chart_activeLassoSelection': store.reactive.lassoControlsState?.mode === 'selection'\n        }\"\n      />\n      <GraphStatusScreen :graphStatus=\"graphStatus\" :top=\"tabBySource ? 24 : 0\" :bottom=\"11\" :customStatusText=\"customStatusText\" :errorInfo=\"errorInfo\"/>\n      <DendroTable\n        v-if=\"store.reactive.chartType === 'dendro' && chartData && store.reactive.layersSettings.dendro.showTable\"\n        :chartData=\"chartData\" @row-select=\"onTableRowSelect\"\n      />\n      <DendroTooltip\n        v-if=\"store.reactive.dendroInfoByClick\" :info=\"store.reactive.dendroInfoByClick\"\n        :containerRef=\"chartContainerRef\" :tooltipBtn=\"dendroTooltipButton\"\n        @tooltip-btn-click=\"(id: string) => $emit('dendro-tooltip-btn-click', id)\" @close=\"\n          store.reactive.dendroInfoByClick = null;\n          $emit('dendro-node-select', null);\n        \"\n      />\n    </div>\n    <div v-if=\"graphStatus === 'ready'\" class=\"chart_controls\">\n      <Zoom />\n      <LassoControls v-if=\"store.reactive.chartType === 'scatterplot-umap'\" :chart-ref=\"chartRef\" :isScatterplotZoomChanged=\"isScatterplotZoomChanged\"/>\n      <PlBtnGhost v-if=\"hasPrimaryHidden\" icon=\"view-hide\" @click.stop=\"() => openAxesSettingsPrimary()\">\n        Hidden (primary)\n      </PlBtnGhost>\n      <PlBtnGhost v-if=\"hasSecondaryHidden\" icon=\"view-hide\" @click.stop=\"() => openAxesSettingsSecondary()\">\n        Hidden (secondary)\n      </PlBtnGhost>\n    </div>\n  </div>\n</template>\n"],"names":["emit","__emit","store","useStore","props","__props","title","ref","watch","graphTitle","tabByState","computed","_a","tabBySource","tabByFilterValue","_b","filtersStates","tabByLocalValue","loadOptions","sourceId","filtersStateWithTheSameSource","state","selectedValues","selectedValue","searchSelectedFilterValueOptions","response","MAX_SEARCH_OPTIONS_LIST_LENGTH","preloadedOptions","v","loading","opts","availableOptions","searchFilterOptions","nextFilterValue","onFilterValueUpdate","value","prevSelectorStates","onTitleChange","e","target","onTableRowSelect","id","searchStr","type","results","searchLabelStr","searchValueStr","chartContainerRef","hasPrimaryHidden","optionsState","columnName","dataBindAes","hasSecondaryHidden","openAxesSettingsPrimary","openAxesSettingsSecondary","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_createBlock","_resolveDynamicComponent","EditIcon","_hoisted_4","_renderSlot","_ctx","_createVNode","_unref","PlNotificationAlert","$event","_cache","_hoisted_5","PlDropdown","PlAutocomplete","str","_normalizeClass","GraphStatusScreen","DendroTable","DendroTooltip","$emit","_hoisted_6","Zoom","LassoControls","PlBtnGhost"],"mappings":"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"}
+{"version":3,"file":"Chart.vue.js","sources":["../../src/components/Chart.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { ChartInterface, ErrorInfo } from '@milaboratories/miplots4';\nimport type { SelectorStateFilter } from '@milaboratories/pf-plots';\nimport type { ListOption } from '@platforma-sdk/ui-vue';\nimport { PlAutocomplete, PlBtnGhost, PlDropdown, PlNotificationAlert } from '@platforma-sdk/ui-vue';\nimport { computed, ref, watch } from 'vue';\nimport DendroTable from '../components/DendroTable.vue';\nimport DendroTooltip from '../components/DendroTooltip.vue';\nimport LassoControls from '../components/LassoControls/index.vue';\nimport Zoom from '../components/Zoom/index.vue';\nimport { MAX_SEARCH_OPTIONS_LIST_LENGTH } from '../constantsCommon.ts';\nimport EditIcon from '../icons/EditIcon.vue';\nimport { useStore } from '../store.ts';\nimport type { GraphStatus, StatusTextData } from '../types.ts';\nimport GraphStatusScreen from './GraphStatusScreen.vue';\n\nconst emit = defineEmits(['graph-title-update', 'dendro-node-select', 'dendro-tooltip-btn-click']);\n\nconst store = useStore();\n\nconst props = defineProps<{\n  graphStatus: GraphStatus;\n  graphTitle: string;\n  dendroTooltipButton?: string;\n  chartData: Record<string, unknown> | null;\n  chartRef: ChartInterface | null;\n  errorInfo: ErrorInfo | null;\n  customStatusText?: Partial<StatusTextData>;\n  allowTitleEditing?: boolean;\n  isScatterplotZoomChanged?: boolean;\n}>();\n\nconst title = ref(props.graphTitle);\n// title can be updated from graph-maker settings\nwatch(() => props.graphTitle, (graphTitle) => {\n  title.value = graphTitle;\n});\n\nconst tabByState = computed(() => store.value.reactive.optionsState.components.tabBy?.selectorStates[0] as SelectorStateFilter | undefined);\nconst tabBySource = computed(() => tabByState.value?.selectedSource);\nconst tabByFilterValue = computed(() => tabByState.value?.selectedFilterValues?.[0]);\nconst filtersStates = computed(() => store.value.reactive.optionsState.components.filters?.selectorStates as SelectorStateFilter[]);\n\nconst tabByLocalValue = ref(tabByFilterValue.value);\nwatch([() => tabBySource.value, () => tabByFilterValue.value], () => { // tabBy column changed, needs to update selected value\n  tabByLocalValue.value = tabByFilterValue.value;\n}, { deep: true });\n\n// try to load full options list, without search query; if result is not overflow, use values from it in regular dropdown, no autocomplete;\nasync function loadOptions(sourceId: string) {\n  if (!store.value.columnsDataStore.value) {\n    return Promise.resolve([]);\n  }\n  // if the same source is selected in filters, return only selected values;\n  const filtersStateWithTheSameSource = filtersStates.value.find((state) => state.selectedSource === sourceId) as SelectorStateFilter | undefined;\n  if (filtersStateWithTheSameSource && (filtersStateWithTheSameSource.selectedFilterValues?.length ?? 0) > 0) {\n    const selectedValues = filtersStateWithTheSameSource.selectedFilterValues ?? [];\n    return Promise.all(selectedValues.map((selectedValue) => searchSelectedFilterValueOptions(sourceId, selectedValue)));\n  }\n  const response = await store.value.controller.getUniqueSourceValuesWithLabels(\n    store.value.columnsDataStore.value,\n    store.value.inputGuide.value,\n    sourceId,\n    MAX_SEARCH_OPTIONS_LIST_LENGTH,\n  );\n  return response.overflow ? null : response.values;\n}\nconst preloadedOptions = ref<ListOption[] | null | undefined>();\nwatch([\n  () => tabBySource.value,\n  () => store.value.loading.inputGuide,\n], async ([v, loading]) => {\n  if (v === undefined || loading || !store.value.columnsDataStore.value) {\n    return undefined;\n  }\n  preloadedOptions.value = await loadOptions(v);\n}, { immediate: true });\n\nwatch(() => preloadedOptions.value, async (opts) => {\n  if (\n    tabBySource.value === undefined // no tabBy selected\n    || tabByLocalValue.value !== undefined // tabBy selected and has selected value\n    || opts === undefined // options not loaded yet\n  ) {\n    return;\n  }\n  let availableOptions = opts;\n  if (opts === null) { // options loaded but too many unique values\n    availableOptions = await searchFilterOptions(tabBySource.value, '');\n  }\n  if (availableOptions?.length) {\n    const nextFilterValue = availableOptions[0].value as string;\n    tabByLocalValue.value = nextFilterValue;\n    onFilterValueUpdate(nextFilterValue);\n  }\n}, { immediate: true });\n\nfunction onFilterValueUpdate(value: string) {\n  const prevSelectorStates = store.value.reactive.optionsState.components.tabBy.selectorStates;\n  if (prevSelectorStates.length) {\n    store.value.reactive.optionsState.components.tabBy.selectorStates = [{\n      ...prevSelectorStates[0],\n      type: 'equals',\n      selectedFilterValues: [value],\n    }];\n  }\n}\n\nfunction onTitleChange(e: Event) {\n  const target = e.currentTarget as HTMLInputElement;\n  title.value = target.value;\n  emit('graph-title-update', target.value);\n}\n\nfunction onTableRowSelect(id: number) {\n  emit('dendro-node-select', id);\n}\n\n// search options for autocomplete component; use label-mode search for options and value-mode for search of label of selected by default value;\nasync function searchFilterOptions(sourceId: string, searchStr: string, type: 'value' | 'label' = 'label') {\n  if (!store.value.columnsDataStore.value) {\n    return Promise.resolve([]);\n  }\n  // if the same source is selected in filters, return only selected values;\n  const filtersStateWithTheSameSource = filtersStates.value.find((state) => state.selectedSource === sourceId) as SelectorStateFilter | undefined;\n  if (filtersStateWithTheSameSource && (filtersStateWithTheSameSource.selectedFilterValues?.length ?? 0) > 0) {\n    const selectedValues = filtersStateWithTheSameSource.selectedFilterValues ?? [];\n    const results = await Promise.all(selectedValues.map((selectedValue) => searchSelectedFilterValueOptions(sourceId, selectedValue)));\n    return searchStr ? results.filter((v) => v.label.toLowerCase().includes(searchStr.toLowerCase())) : results;\n  }\n  const searchLabelStr = type === 'label' ? searchStr : undefined;\n  const searchValueStr = type === 'value' ? searchStr : undefined;\n  return (await store.value.controller.getUniqueSourceValuesWithLabels(store.value.columnsDataStore.value, store.value.inputGuide.value, sourceId, MAX_SEARCH_OPTIONS_LIST_LENGTH, searchLabelStr, searchValueStr)).values;\n}\n\n// search by value, not by label;\nasync function searchSelectedFilterValueOptions(sourceId: string, selectedValue: string) {\n  if (!store.value.columnsDataStore.value) {\n    return Promise.resolve({ value: selectedValue, label: ' ' }); // don't show non-human-readable value\n  }\n  const value = await store.value.controller.getUniqueSourceValuesWithLabels(\n    store.value.columnsDataStore.value, store.value.inputGuide.value,\n    sourceId, 1, undefined, selectedValue).then((v) => v.values[0]);\n  return value;\n}\n\nconst chartContainerRef = ref();\n\nconst hasPrimaryHidden = computed(() => {\n  if (store.value.reactive.chartType !== 'discrete') {\n    return false;\n  }\n  const optionsState = store.value.reactive.optionsState.components;\n  if (optionsState.primaryGrouping?.selectorStates.length) {\n    const columnName = optionsState.primaryGrouping.selectorStates[0].selectedSource;\n    const dataBindAes = store.value.reactive.dataBindAes[columnName];\n    if (dataBindAes?.type === 'categorical' && dataBindAes.hidden) {\n      return Object.values(dataBindAes.hidden).length > 0 && dataBindAes.order.some((v) => dataBindAes.hidden?.[v]);\n    }\n  }\n  return false;\n});\nconst hasSecondaryHidden = computed(() => {\n  if (store.value.reactive.chartType !== 'discrete') {\n    return false;\n  }\n  const optionsState = store.value.reactive.optionsState.components;\n  if (optionsState.secondaryGrouping?.selectorStates.length) {\n    const columnName = optionsState.secondaryGrouping.selectorStates[0].selectedSource;\n    const dataBindAes = store.value.reactive.dataBindAes[columnName];\n    if (dataBindAes?.type === 'categorical' && dataBindAes.hidden) {\n      return Object.values(dataBindAes.hidden).length > 0 && dataBindAes.order.some((v) => dataBindAes.hidden?.[v]);\n    }\n  }\n  return false;\n});\nfunction openAxesSettingsPrimary() {\n  store.value.reactive.tabDefaultState['axes'].reorderPrimaryOpen = true;\n  store.value.reactive.currentTab = 'axes';\n}\nfunction openAxesSettingsSecondary() {\n  store.value.reactive.tabDefaultState['axes'].reorderSecondaryOpen = true;\n  store.value.reactive.currentTab = 'axes';\n}\n\n</script>\n\n<template>\n  <div class=\"chart_container\">\n    <div class=\"chart_header\">\n      <input\n        class=\"chart_title\"\n        :value=\"title\"\n        :disabled=\"!allowTitleEditing\"\n        @change=\"onTitleChange\"\n        @keyup.enter=\"(e) => { (e.target as HTMLInputElement)?.blur() }\"\n      />\n      <component :is=\"EditIcon\" v-if=\"allowTitleEditing\" class=\"chart_titleEdit\" />\n      <div class=\"chart_titleLineSlot\">\n        <slot />\n      </div>\n    </div>\n    <PlNotificationAlert\n      v-if=\"!store.reactive.tooltipHintWasShown\"\n      v-model=\"store.reactive.showTooltipHint\"\n      type=\"success\"\n      class=\"chart_tooltipHint\"\n      width=\"170px\"\n    >\n      Hit enter to pin tooltip\n    </PlNotificationAlert>\n    <div v-if=\"tabBySource\" class=\"chart_tabBy\">\n      <PlDropdown\n        v-if=\"preloadedOptions || (preloadedOptions === undefined && store.loading.inputGuide)\"\n        v-model=\"tabByLocalValue\" label=\"Show for\" :options=\"preloadedOptions\"\n        @update:modelValue=\"(v) => onFilterValueUpdate(v as string)\"\n      />\n      <PlAutocomplete\n        v-else v-model=\"tabByLocalValue\" label=\"Show for\"\n        :options-search=\"(str, type) => searchFilterOptions(tabBySource as string, str, type)\"\n        @update:modelValue=\"(v) => onFilterValueUpdate(v as string)\"\n      />\n    </div>\n    <div\n      ref=\"chartContainerRef\" class=\"chart_main-content\"\n      :class=\"[{ 'chart_main-content__dendro': store.reactive.chartType === 'dendro' }, 'pl-scrollable']\"\n    >\n      <div\n        id=\"chartSvgContainer\" :class=\"{\n          'chart_ready': graphStatus === 'ready',\n          'chart_loading': graphStatus === 'loading',\n          'chart_activeLassoSelection': store.reactive.lassoControlsState?.mode === 'selection'\n        }\"\n      />\n      <GraphStatusScreen :graphStatus=\"graphStatus\" :top=\"tabBySource ? 24 : 0\" :bottom=\"11\" :customStatusText=\"customStatusText\" :errorInfo=\"errorInfo\"/>\n      <DendroTable\n        v-if=\"store.reactive.chartType === 'dendro' && chartData && store.reactive.layersSettings.dendro.showTable\"\n        :chartData=\"chartData\" @row-select=\"onTableRowSelect\"\n      />\n      <DendroTooltip\n        v-if=\"store.reactive.dendroInfoByClick\" :info=\"store.reactive.dendroInfoByClick\"\n        :containerRef=\"chartContainerRef\" :tooltipBtn=\"dendroTooltipButton\"\n        @tooltip-btn-click=\"(id: string) => $emit('dendro-tooltip-btn-click', id)\" @close=\"\n          store.reactive.dendroInfoByClick = null;\n          $emit('dendro-node-select', null);\n        \"\n      />\n    </div>\n    <div v-if=\"graphStatus === 'ready'\" class=\"chart_controls\">\n      <Zoom />\n      <LassoControls v-if=\"store.reactive.chartType === 'scatterplot-umap'\" :chart-ref=\"chartRef\" :isScatterplotZoomChanged=\"isScatterplotZoomChanged\"/>\n      <PlBtnGhost v-if=\"hasPrimaryHidden\" icon=\"view-hide\" @click.stop=\"() => openAxesSettingsPrimary()\">\n        Hidden (primary)\n      </PlBtnGhost>\n      <PlBtnGhost v-if=\"hasSecondaryHidden\" icon=\"view-hide\" @click.stop=\"() => openAxesSettingsSecondary()\">\n        Hidden (secondary)\n      </PlBtnGhost>\n    </div>\n  </div>\n</template>\n"],"names":["emit","__emit","store","useStore","props","__props","title","ref","watch","graphTitle","tabByState","computed","_a","tabBySource","tabByFilterValue","_b","filtersStates","tabByLocalValue","loadOptions","sourceId","filtersStateWithTheSameSource","state","selectedValues","selectedValue","searchSelectedFilterValueOptions","response","MAX_SEARCH_OPTIONS_LIST_LENGTH","preloadedOptions","v","loading","opts","availableOptions","searchFilterOptions","nextFilterValue","onFilterValueUpdate","value","prevSelectorStates","onTitleChange","e","target","onTableRowSelect","id","searchStr","type","results","searchLabelStr","searchValueStr","chartContainerRef","hasPrimaryHidden","optionsState","columnName","dataBindAes","hasSecondaryHidden","openAxesSettingsPrimary","openAxesSettingsSecondary","_openBlock","_createElementBlock","_hoisted_1","_createElementVNode","_hoisted_2","_createBlock","_resolveDynamicComponent","EditIcon","_hoisted_4","_renderSlot","_ctx","_unref","PlNotificationAlert","$event","_cache","_hoisted_5","PlDropdown","PlAutocomplete","str","_normalizeClass","_createVNode","GraphStatusScreen","DendroTable","DendroTooltip","$emit","_hoisted_6","Zoom","LassoControls","PlBtnGhost"],"mappings":"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"}

package/dist/components/ChartTruncationWarningAlert.css

@@ -0,0 +1 @@
+._alert_1fz73_2{position:fixed;bottom:12px;right:12px;width:256px;height:auto;z-index:1}

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

@@ -0,0 +1,7 @@
+import { ChartTruncationWarning } from '../utils/createChartSettingsForRender/composeChartSettings';
+type __VLS_Props = {
+    truncationWarning: ChartTruncationWarning;
+};
+declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, HTMLDivElement>;
+export default _default;
+//# sourceMappingURL=ChartTruncationWarningAlert.vue.d.ts.map

package/dist/components/ChartTruncationWarningAlert.vue.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTruncationWarningAlert.vue.d.ts","sourceRoot":"","sources":["../../src/components/ChartTruncationWarningAlert.vue"],"names":[],"mappings":"AA4DA,OAAO,KAAK,EAAE,sBAAsB,EAAE,MAAM,4DAA4D,CAAC;AAIzG,KAAK,WAAW,GAAG;IAAE,iBAAiB,EAAE,sBAAsB,CAAA;CAAE,CAAC;;AAyHjE,wBAOG"}

package/dist/components/ChartTruncationWarningAlert.vue.js

@@ -0,0 +1,10 @@
+import o from "./ChartTruncationWarningAlert.vue2.js";
+import s from "./ChartTruncationWarningAlert.vue3.js";
+import t from "../_virtual/_plugin-vue_export-helper.js";
+const r = {
+  $style: s
+}, n = /* @__PURE__ */ t(o, [["__cssModules", r]]);
+export {
+  n as default
+};
+//# sourceMappingURL=ChartTruncationWarningAlert.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTruncationWarningAlert.vue.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;;"}

package/dist/components/ChartTruncationWarningAlert.vue2.js

@@ -0,0 +1,54 @@
+import { defineComponent as T, ref as x, computed as V, createElementBlock as $, openBlock as b, normalizeClass as h, createVNode as s, unref as r, withCtx as a, createTextVNode as u, toDisplayString as v, withModifiers as S } from "vue";
+import { PlNotificationAlert as w, PlBtnPrimary as A, PlSpacer as C } from "@platforma-sdk/ui-vue";
+import { formatTruncationTotal as c } from "../utils/createChartSettingsForRender/composeChartSettings.js";
+import { useStore as P } from "../store.js";
+const j = /* @__PURE__ */ T({
+  __name: "ChartTruncationWarningAlert",
+  props: {
+    truncationWarning: {}
+  },
+  setup(p) {
+    const f = p, i = P(), l = x(!0), m = V(() => {
+      const t = f.truncationWarning, e = [];
+      t.groups && e.push("Some groups are hidden"), t.facets && e.push("Some facets are hidden");
+      const n = e.join(". "), o = [];
+      t.groups && t.groupsVisible != null && t.groupsTotal != null && o.push(`${t.groupsVisible} of ${c(t.groupsTotal)} groups`), t.facets && t.facetsVisible != null && t.facetsTotal != null && o.push(`${t.facetsVisible} of ${c(t.facetsTotal)} facets`);
+      const g = o.length ? ` Showing ${o.join("; ")}.` : "";
+      return `${n}.${g} Limits can be changed in Axes settings.`;
+    });
+    function d() {
+      i.value.reactive.currentTab = "axes", i.value.reactive.tabDefaultState.axes.scrollToBottom = !0;
+    }
+    return (t, e) => (b(), $("div", {
+      class: h(t.$style.alert)
+    }, [
+      s(r(w), {
+        modelValue: l.value,
+        "onUpdate:modelValue": e[1] || (e[1] = (n) => l.value = n),
+        type: "warning",
+        closable: ""
+      }, {
+        actions: a(() => [
+          s(r(A), {
+            icon: "arrow-right",
+            onClick: e[0] || (e[0] = S(() => d(), ["stop"]))
+          }, {
+            default: a(() => [...e[2] || (e[2] = [
+              u("Open Axes settings", -1)
+            ])]),
+            _: 1
+          }),
+          s(r(C))
+        ]),
+        default: a(() => [
+          u(v(m.value) + " ", 1)
+        ]),
+        _: 1
+      }, 8, ["modelValue"])
+    ], 2));
+  }
+});
+export {
+  j as default
+};
+//# sourceMappingURL=ChartTruncationWarningAlert.vue2.js.map

package/dist/components/ChartTruncationWarningAlert.vue2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTruncationWarningAlert.vue2.js","sources":["../../src/components/ChartTruncationWarningAlert.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { PlBtnPrimary, PlNotificationAlert, PlSpacer } from '@platforma-sdk/ui-vue';\nimport { computed, ref } from 'vue';\nimport type { ChartTruncationWarning } from '../utils/createChartSettingsForRender/composeChartSettings';\nimport { formatTruncationTotal } from '../utils/createChartSettingsForRender/composeChartSettings';\nimport { useStore } from '../store';\n\nconst props = defineProps<{ truncationWarning: ChartTruncationWarning }>();\n\nconst store = useStore();\nconst isAlertOpen = ref(true);\n\nconst message = computed(() => {\n  const w = props.truncationWarning;\n  const intro: string[] = [];\n  if (w.groups) intro.push('Some groups are hidden');\n  if (w.facets) intro.push('Some facets are hidden');\n  const lead = intro.join('. ');\n  const countParts: string[] = [];\n  if (w.groups && w.groupsVisible != null && w.groupsTotal != null) {\n    countParts.push(`${w.groupsVisible} of ${formatTruncationTotal(w.groupsTotal)} groups`);\n  }\n  if (w.facets && w.facetsVisible != null && w.facetsTotal != null) {\n    countParts.push(`${w.facetsVisible} of ${formatTruncationTotal(w.facetsTotal)} facets`);\n  }\n  const countText = countParts.length ? ` Showing ${countParts.join('; ')}.` : '';\n  const end = 'Limits can be changed in Axes settings.';\n  return `${lead}.${countText} ${end}`;\n});\n\nfunction openAxesSettings() {\n  store.value.reactive.currentTab = 'axes';\n  store.value.reactive.tabDefaultState.axes.scrollToBottom = true;\n}\n</script>\n<template>\n  <div :class=\"$style.alert\">\n    <PlNotificationAlert v-model=\"isAlertOpen\" type=\"warning\" closable>\n      {{ message }}\n      <template #actions>\n        <PlBtnPrimary icon=\"arrow-right\" @click.stop=\"() => openAxesSettings()\">Open Axes settings</PlBtnPrimary>\n        <PlSpacer />\n      </template>\n    </PlNotificationAlert>\n  </div>\n</template>\n<style module>\n.alert {\n  position: fixed;\n  bottom: 12px;\n  right: 12px;\n  width: 256px;\n  height: auto;\n  z-index: 1;\n}\n</style>\n"],"names":["props","__props","store","useStore","isAlertOpen","ref","message","computed","w","intro","lead","countParts","formatTruncationTotal","countText","openAxesSettings","_createElementBlock","_normalizeClass","$style","_createVNode","_unref","PlNotificationAlert","$event","PlBtnPrimary","_cache","PlSpacer","_createTextVNode","_toDisplayString"],"mappings":";;;;;;;;;;AAOA,UAAMA,IAAQC,GAERC,IAAQC,EAAA,GACRC,IAAcC,EAAI,EAAI,GAEtBC,IAAUC,EAAS,MAAM;AAC7B,YAAMC,IAAIR,EAAM,mBACVS,IAAkB,CAAA;AACxB,MAAID,EAAE,UAAQC,EAAM,KAAK,wBAAwB,GAC7CD,EAAE,UAAQC,EAAM,KAAK,wBAAwB;AACjD,YAAMC,IAAOD,EAAM,KAAK,IAAI,GACtBE,IAAuB,CAAA;AAC7B,MAAIH,EAAE,UAAUA,EAAE,iBAAiB,QAAQA,EAAE,eAAe,QAC1DG,EAAW,KAAK,GAAGH,EAAE,aAAa,OAAOI,EAAsBJ,EAAE,WAAW,CAAC,SAAS,GAEpFA,EAAE,UAAUA,EAAE,iBAAiB,QAAQA,EAAE,eAAe,QAC1DG,EAAW,KAAK,GAAGH,EAAE,aAAa,OAAOI,EAAsBJ,EAAE,WAAW,CAAC,SAAS;AAExF,YAAMK,IAAYF,EAAW,SAAS,YAAYA,EAAW,KAAK,IAAI,CAAC,MAAM;AAE7E,aAAO,GAAGD,CAAI,IAAIG,CAAS;AAAA,IAC7B,CAAC;AAED,aAASC,IAAmB;AAC1B,MAAAZ,EAAM,MAAM,SAAS,aAAa,QAClCA,EAAM,MAAM,SAAS,gBAAgB,KAAK,iBAAiB;AAAA,IAC7D;2BAGEa,EAQM,OAAA;AAAA,MARA,OAAKC,EAAEC,EAAAA,OAAO,KAAK;AAAA,IAAA;MACvBC,EAMsBC,EAAAC,CAAA,GAAA;AAAA,oBANQhB,EAAA;AAAA,sDAAAA,EAAW,QAAAiB;AAAA,QAAE,MAAK;AAAA,QAAU,UAAA;AAAA,MAAA;QAE7C,WACT,MAAyG;AAAA,UAAzGH,EAAyGC,EAAAG,CAAA,GAAA;AAAA,YAA3F,MAAK;AAAA,YAAe,iCAAkBR,KAAgB,CAAA,MAAA,CAAA;AAAA,UAAA;uBAAI,MAAkB,CAAA,GAAAS,EAAA,CAAA,MAAAA,EAAA,CAAA,IAAA;AAAA,gBAAlB,sBAAkB,EAAA;AAAA,YAAA;;;UAC1FL,EAAYC,EAAAK,CAAA,CAAA;AAAA,QAAA;mBAHd,MAAa;AAAA,UAAVC,EAAAC,EAAApB,EAAA,KAAO,IAAG,KACb,CAAA;AAAA,QAAA;;;;;;"}

package/dist/components/ChartTruncationWarningAlert.vue3.js

@@ -0,0 +1,8 @@
+import './ChartTruncationWarningAlert.css';const t = "_alert_1fz73_2", e = {
+  alert: t
+};
+export {
+  t as alert,
+  e as default
+};
+//# sourceMappingURL=ChartTruncationWarningAlert.vue3.js.map

package/dist/components/ChartTruncationWarningAlert.vue3.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ChartTruncationWarningAlert.vue3.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;"}

package/dist/components/DragAndDrop/DnDBasketChip.vue.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DnDBasketChip.vue.d.ts","sourceRoot":"","sources":["../../../src/components/DragAndDrop/DnDBasketChip.vue"],"names":[],"mappings":"AA4DA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAG3C,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,OAAO,CAAC;IACf,IAAI,EAAE,QAAQ,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;;;;;;;;AAoIF,wBASG"}
+{"version":3,"file":"DnDBasketChip.vue.d.ts","sourceRoot":"","sources":["../../../src/components/DragAndDrop/DnDBasketChip.vue"],"names":[],"mappings":"AA4DA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AAE3C,KAAK,WAAW,GAAG;IACjB,KAAK,EAAE,OAAO,CAAC;IACf,IAAI,EAAE,QAAQ,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB,CAAC;;;;;;;;AAmJF,wBASG"}

package/dist/components/DragAndDrop/DnDBasketChip.vue.js

@@ -1,10 +1,9 @@
-import { defineComponent as b, ref as p, computed as y, createElementBlock as i, openBlock as t, createElementVNode as n, normalizeClass as s, createCommentVNode as a, createVNode as v, createBlock as d, unref as o, toDisplayString as m } from "vue";
-import { PlIcon16 as l } from "@platforma-sdk/ui-vue";
-import _ from "../../assets/drag-and-drop/img/chip-close.svg.js";
+import { defineComponent as p, ref as y, computed as v, createElementBlock as s, openBlock as t, createElementVNode as o, normalizeClass as c, createCommentVNode as d, createVNode as m, createBlock as u, unref as i, toDisplayString as h } from "vue";
+import { PlIcon16 as n } from "@platforma-sdk/ui-vue";
 const C = {
   key: 0,
   class: "dnd-basket-chip__handler"
-}, g = { class: "dnd-basket-chip__title-wrapper" }, B = ["title"], V = ["title"], x = ["innerHTML"], w = /* @__PURE__ */ b({
+}, _ = { class: "dnd-basket-chip__title-wrapper" }, g = ["title"], B = ["title"], S = /* @__PURE__ */ p({
   __name: "DnDBasketChip",
   props: {
     error: { type: Boolean },
@@ -12,56 +11,60 @@ const C = {
     sortable: { type: Boolean }
   },
   emits: ["close-chip"],
-  setup(e, { emit: u }) {
-    const c = e, h = u, f = p(), r = y(
-      () => c.info.uniqueValues.join("/")
+  setup(e, { emit: k }) {
+    const l = e, f = k, b = y(), a = v(
+      () => l.info.uniqueValues.join("/")
     );
-    function k() {
-      h("close-chip", c.info.id);
+    function r() {
+      f("close-chip", l.info.id);
     }
-    return (D, H) => (t(), i("div", {
+    return (V, x) => (t(), s("div", {
       ref_key: "chipRoot",
-      ref: f,
+      ref: b,
       class: "dnd-basket-chip__group"
     }, [
-      n("div", {
-        class: s([{ error: e.error, sortable: e.sortable }, "dnd-basket-chip"])
+      o("div", {
+        class: c([{ error: e.error, sortable: e.sortable }, "dnd-basket-chip"])
       }, [
-        n("div", {
-          class: s(["dnd-basket-chip__icon", { error: e.error }])
+        o("div", {
+          class: c(["dnd-basket-chip__icon", { error: e.error }])
         }, [
-          e.error ? (t(), d(o(l), {
+          e.error ? (t(), u(i(n), {
             key: 0,
             name: "warning",
-            class: s({ error: e.error })
-          }, null, 8, ["class"])) : (t(), d(o(l), {
+            class: c({ error: e.error })
+          }, null, 8, ["class"])) : (t(), u(i(n), {
             key: 1,
             name: e.info.isSubsetFilter ? "cell-type-subset" : e.info.type === "String" ? "cell-type-txt" : "cell-type-num"
           }, null, 8, ["name"]))
         ], 2),
-        e.sortable ? (t(), i("div", C)) : a("", !0),
-        v(o(l), { name: "drag-dots" }),
-        n("div", g, [
-          n("div", {
+        e.sortable ? (t(), s("div", C)) : d("", !0),
+        m(i(n), { name: "drag-dots" }),
+        o("div", _, [
+          o("div", {
             class: "dnd-basket-chip__title",
             title: e.info.title
-          }, m(e.info.title), 9, B),
-          e.info.nonHomogenous ? (t(), i("div", {
+          }, h(e.info.title), 9, g),
+          e.info.nonHomogenous ? (t(), s("div", {
             key: 0,
             class: "dnd-basket-chip__sub-title",
-            title: r.value
-          }, m(r.value), 9, V)) : a("", !0)
+            title: a.value
+          }, h(a.value), 9, B)) : d("", !0)
         ]),
-        n("div", {
+        o("div", {
           class: "dnd-basket-chip__icon-close",
-          onClick: k,
-          innerHTML: o(_)
-        }, null, 8, x)
+          onClick: r
+        }, [
+          m(i(n), {
+            name: "close",
+            onClick: r
+          })
+        ])
       ], 2)
     ], 512));
   }
 });
 export {
-  w as default
+  S as default
 };
 //# sourceMappingURL=DnDBasketChip.vue.js.map