@platforma-sdk/ui-vue 1.45.34 → 1.45.36

package/dist/components/PlMultiSequenceAlignment/Consensus.vue.d.ts

@@ -1,9 +0,0 @@
-import { ResidueCounts } from './types';
-type __VLS_Props = {
-    residueCounts: ResidueCounts;
-    labelsClass: string;
-};
-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, {
-    plotEl: HTMLDivElement;
-}, any>;
-export default _default;

package/dist/components/PlMultiSequenceAlignment/Consensus.vue.js

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

package/dist/components/PlMultiSequenceAlignment/Consensus.vue.js.map

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

package/dist/components/PlMultiSequenceAlignment/Consensus.vue2.js

@@ -1,122 +0,0 @@
-import { defineComponent as x, useCssModule as k, useTemplateRef as E, computed as c, shallowRef as _, watchEffect as A, onBeforeUnmount as O, createBlock as S, createElementBlock as j, unref as u, openBlock as y, withCtx as B, createTextVNode as D, toDisplayString as C, normalizeClass as v, createElementVNode as b } from "vue";
-import { PlAlert as G } from "@milaboratories/uikit";
-import { cellSize as K } from "./cell-size.js";
-import { useMiPlots as T } from "./useMiPlots.js";
-const U = /* @__PURE__ */ x({
-  __name: "Consensus",
-  props: {
-    residueCounts: {},
-    labelsClass: {}
-  },
-  setup(g) {
-    const s = g, w = k(), a = E("plotEl"), f = c(
-      () => s.residueCounts.map((e) => {
-        let o = 0, t = { label: "", count: 0 };
-        for (const [r, n] of Object.entries(e))
-          o += n, r !== "-" && n > t.count && (t = { label: r, count: n });
-        const i = CSS.percent(t.count / o * 100);
-        return {
-          label: t.label,
-          color: `color-mix(in oklab, ${i} #3056AE, #C1CDE9)`
-        };
-      })
-    ), m = c(() => {
-      const e = s.residueCounts.length * K.inline;
-      return {
-        type: "discrete",
-        y: {
-          type: "column",
-          value: "countKey"
-        },
-        legend: { show: !1 },
-        primaryGrouping: {
-          columnName: {
-            type: "column",
-            value: "columnKey"
-          },
-          order: s.residueCounts.map((o, t) => t),
-          inheritedAes: Object.fromEntries(
-            f.value.map(({ color: o }) => ({ fillColor: o })).entries()
-          )
-        },
-        layers: [{
-          type: "bar",
-          height: "max",
-          aes: {
-            ...s.residueCounts.length && {
-              width: (e - s.residueCounts.length + 1) / s.residueCounts.length
-            },
-            fillColor: {
-              type: "primaryGrouping"
-            },
-            lineColor: "#ffffff"
-          }
-        }],
-        title: {
-          name: "",
-          show: !1
-        },
-        size: {
-          width: e,
-          height: 60,
-          outerOffset: 0,
-          innerOffset: 0
-        },
-        xAxis: {
-          title: "",
-          showGrid: !1,
-          showTicks: !1,
-          hiddenLabels: !0
-        },
-        yAxis: {
-          title: "",
-          showGrid: !1,
-          showTicks: !1,
-          hiddenLabels: !0
-        },
-        frame: {
-          type: "empty"
-        }
-      };
-    }), p = c(() => {
-      const e = [], o = [];
-      for (const [t, i] of s.residueCounts.entries())
-        for (const [r, n] of Object.entries(i))
-          r !== "-" && (e.push(n), o.push(t));
-      return {
-        type: "columns",
-        id: `consensus-${crypto.randomUUID()}`,
-        values: { countKey: e, columnKey: o }
-      };
-    }), l = _(), { miplots: d, error: h } = T();
-    return A(async () => {
-      !a.value || !d.value || (l.value ? l.value.updateSettingsAndData(p.value, m.value) : (l.value = d.value.newPlot(p.value, m.value), l.value.mount(a.value)));
-    }), O(() => {
-      var e;
-      (e = l.value) == null || e.unmount();
-    }), (e, o) => u(h) ? (y(), S(u(G), {
-      key: 0,
-      type: "error"
-    }, {
-      default: B(() => [
-        D(C(u(h).message), 1)
-      ]),
-      _: 1
-    })) : (y(), j("div", {
-      key: 1,
-      class: v(u(w).container)
-    }, [
-      b("div", {
-        class: v(s.labelsClass)
-      }, C(f.value.map((t) => t.label).join("")), 3),
-      b("div", {
-        ref_key: "plotEl",
-        ref: a
-      }, null, 512)
-    ], 2));
-  }
-});
-export {
-  U as default
-};
-//# sourceMappingURL=Consensus.vue2.js.map

package/dist/components/PlMultiSequenceAlignment/Consensus.vue2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Consensus.vue2.js","sources":["../../../src/components/PlMultiSequenceAlignment/Consensus.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type {\n  ChartInterface,\n  DataByColumns,\n  Settings,\n} from '@milaboratories/miplots4';\nimport { PlAlert } from '@milaboratories/uikit';\nimport {\n  computed,\n  onBeforeUnmount,\n  shallowRef,\n  useCssModule,\n  useTemplateRef,\n  watchEffect,\n} from 'vue';\nimport { cellSize } from './cell-size';\nimport type { ResidueCounts } from './types';\nimport { useMiPlots } from './useMiPlots';\n\nconst props = defineProps<{\n  residueCounts: ResidueCounts;\n  labelsClass: string;\n}>();\n\nconst classes = useCssModule();\n\nconst plotEl = useTemplateRef('plotEl');\n\nconst columns = computed(() =>\n  props.residueCounts.map((column) => {\n    let totalCount = 0;\n    let topResidue = { label: '', count: 0 };\n    for (const [residue, count] of Object.entries(column)) {\n      totalCount += count;\n      if (residue === '-') continue;\n      if (count > topResidue.count) topResidue = { label: residue, count };\n    }\n    const confidence = CSS.percent(topResidue.count / totalCount * 100);\n    return {\n      label: topResidue.label,\n      color: `color-mix(in oklab, ${confidence} #3056AE, #C1CDE9)`,\n    };\n  }),\n);\n\nconst settings = computed(() => {\n  const width = props.residueCounts.length * cellSize.inline;\n  return ({\n    type: 'discrete',\n    y: {\n      type: 'column',\n      value: 'countKey',\n    },\n    legend: { show: false },\n    primaryGrouping: {\n      columnName: {\n        type: 'column',\n        value: 'columnKey',\n      },\n      order: props.residueCounts.map((_, i) => i),\n      inheritedAes: Object.fromEntries(\n        columns.value.map(({ color }) => ({ fillColor: color })).entries(),\n      ),\n    },\n    layers: [{\n      type: 'bar',\n      height: 'max',\n      aes: {\n        ...props.residueCounts.length && {\n          width: (width - props.residueCounts.length + 1)\n            / props.residueCounts.length,\n        },\n        fillColor: {\n          type: 'primaryGrouping',\n        },\n        lineColor: '#ffffff',\n      },\n    }],\n    title: {\n      name: '',\n      show: false,\n    },\n    size: {\n      width,\n      height: 60,\n      outerOffset: 0,\n      innerOffset: 0,\n    },\n    xAxis: {\n      title: '',\n      showGrid: false,\n      showTicks: false,\n      hiddenLabels: true,\n    },\n    yAxis: {\n      title: '',\n      showGrid: false,\n      showTicks: false,\n      hiddenLabels: true,\n    },\n    frame: {\n      type: 'empty',\n    },\n  } satisfies Settings);\n});\n\nconst data = computed<DataByColumns>(() => {\n  const countKey: number[] = [];\n  const columnKey: number[] = [];\n  for (const [columnIndex, column] of props.residueCounts.entries()) {\n    for (const [residue, count] of Object.entries(column)) {\n      if (residue === '-') continue;\n      countKey.push(count);\n      columnKey.push(columnIndex);\n    }\n  }\n  return ({\n    type: 'columns',\n    id: `consensus-${crypto.randomUUID()}`,\n    values: { countKey, columnKey },\n  });\n});\n\nconst plot = shallowRef<ChartInterface>();\n\nconst { miplots, error } = useMiPlots();\n\nwatchEffect(async () => {\n  if (!plotEl.value || !miplots.value) return;\n  if (!plot.value) {\n    plot.value = miplots.value.newPlot(data.value, settings.value);\n    plot.value.mount(plotEl.value);\n  } else {\n    plot.value.updateSettingsAndData(data.value, settings.value);\n  }\n});\n\nonBeforeUnmount(() => {\n  plot.value?.unmount();\n});\n</script>\n\n<template>\n  <PlAlert v-if=\"error\" type=\"error\">\n    {{ error.message }}\n  </PlAlert>\n  <div v-else :class=\"classes.container\">\n    <div :class=\"props.labelsClass\">\n      {{ columns.map(column => column.label).join('') }}\n    </div>\n    <div ref=\"plotEl\" />\n  </div>\n</template>\n\n<style module>\n.container {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n\n  svg {\n    display: block;\n  }\n}\n</style>\n"],"names":["props","__props","classes","useCssModule","plotEl","useTemplateRef","columns","computed","column","totalCount","topResidue","residue","count","confidence","settings","width","cellSize","_","i","color","data","countKey","columnKey","columnIndex","plot","shallowRef","miplots","error","useMiPlots","watchEffect","onBeforeUnmount","_a"],"mappings":"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"}

package/dist/components/PlMultiSequenceAlignment/Consensus.vue3.js

@@ -1,9 +0,0 @@
-(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("._container_1vnon_2{display:flex;flex-direction:column;gap:4px}._container_1vnon_2 svg{display:block}")),document.head.appendChild(e)}}catch(n){console.error("vite-plugin-css-injected-by-js",n)}})();
-const n = "_container_1vnon_2", t = {
-  container: n
-};
-export {
-  n as container,
-  t as default
-};
-//# sourceMappingURL=Consensus.vue3.js.map

package/dist/components/PlMultiSequenceAlignment/Consensus.vue3.js.map

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

package/dist/components/PlMultiSequenceAlignment/Legend.vue.js

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

package/dist/components/PlMultiSequenceAlignment/Legend.vue.js.map

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

package/dist/components/PlMultiSequenceAlignment/Legend.vue2.js

@@ -1,28 +0,0 @@
-import { defineComponent as i, useCssModule as m, createElementBlock as n, openBlock as t, normalizeClass as r, unref as l, Fragment as u, renderList as p, createElementVNode as g, createTextVNode as _, normalizeStyle as f, toDisplayString as C } from "vue";
-const y = /* @__PURE__ */ i({
-  __name: "Legend",
-  props: {
-    legend: {}
-  },
-  setup(o) {
-    const s = o, e = m();
-    return (k, v) => (t(), n("div", {
-      class: r(l(e).container)
-    }, [
-      (t(!0), n(u, null, p(s.legend, ({ label: a, color: c }, d) => (t(), n("div", {
-        key: d,
-        class: r(l(e).item)
-      }, [
-        g("div", {
-          class: r(l(e).colorSample),
-          style: f({ backgroundColor: c })
-        }, null, 6),
-        _(" " + C(a), 1)
-      ], 2))), 128))
-    ], 2));
-  }
-});
-export {
-  y as default
-};
-//# sourceMappingURL=Legend.vue2.js.map

package/dist/components/PlMultiSequenceAlignment/Legend.vue2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"Legend.vue2.js","sources":["../../../src/components/PlMultiSequenceAlignment/Legend.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { useCssModule } from 'vue';\nimport type { HighlightLegend } from './types';\n\nconst props = defineProps<{\n  legend: HighlightLegend;\n}>();\n\nconst classes = useCssModule();\n</script>\n\n<template>\n  <div :class=\"classes.container\">\n    <div\n      v-for=\"({ label, color }, key) of props.legend\"\n      :key=\"key\"\n      :class=\"classes.item\"\n    >\n      <div :class=\"classes.colorSample\" :style=\"{ backgroundColor: color }\" />\n      {{ label }}\n    </div>\n  </div>\n</template>\n\n<style module>\n.container {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 12px;\n  max-inline-size: fit-content;\n}\n\n.item {\n  display: flex;\n  gap: 4px;\n}\n\n.colorSample {\n  display: inline-block;\n  block-size: 18px;\n  inline-size: 18px;\n  border-radius: 3px;\n}\n</style>\n"],"names":["props","__props","classes","useCssModule"],"mappings":";;;;;;;AAIA,UAAMA,IAAQC,GAIRC,IAAUC,EAAA;;;;;;;;;;;;;;;;;"}

package/dist/components/PlMultiSequenceAlignment/Legend.vue3.js

@@ -1,13 +0,0 @@
-(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("._container_5klj5_2{display:flex;flex-wrap:wrap;gap:12px;max-inline-size:fit-content}._item_5klj5_9{display:flex;gap:4px}._colorSample_5klj5_14{display:inline-block;block-size:18px;inline-size:18px;border-radius:3px}")),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
-const o = "_container_5klj5_2", t = "_item_5klj5_9", e = "_colorSample_5klj5_14", l = {
-  container: o,
-  item: t,
-  colorSample: e
-};
-export {
-  e as colorSample,
-  o as container,
-  l as default,
-  t as item
-};
-//# sourceMappingURL=Legend.vue3.js.map

package/dist/components/PlMultiSequenceAlignment/Legend.vue3.js.map

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

package/dist/components/PlMultiSequenceAlignment/MultiSequenceAlignmentView.vue.d.ts

@@ -1,25 +0,0 @@
-import { PlMultiSequenceAlignmentWidget } from '@platforma-sdk/model';
-import { TreeNodeData } from './phylogenetic-tree.worker';
-import { HighlightLegend, ResidueCounts } from './types';
-type __VLS_Props = {
-    sequences: {
-        name: string;
-        rows: string[];
-        residueCounts: ResidueCounts;
-        highlightImageUrl?: string;
-    }[];
-    labels: {
-        rows: string[];
-    }[];
-    highlightLegend: HighlightLegend | undefined;
-    phylogeneticTree: TreeNodeData[] | undefined;
-    widgets: PlMultiSequenceAlignmentWidget[];
-};
-declare const _default: import('vue').DefineComponent<__VLS_Props, {
-    rootEl: Readonly<import('vue').ShallowRef<HTMLDivElement | null>>;
-}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
-    rootRef: HTMLDivElement;
-    referenceCell: HTMLDivElement;
-    corner: HTMLDivElement;
-}, HTMLDivElement>;
-export default _default;

package/dist/components/PlMultiSequenceAlignment/MultiSequenceAlignmentView.vue.js

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

package/dist/components/PlMultiSequenceAlignment/MultiSequenceAlignmentView.vue.js.map

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

package/dist/components/PlMultiSequenceAlignment/MultiSequenceAlignmentView.vue2.js

@@ -1,138 +0,0 @@
-import { defineComponent as M, useCssVars as U, unref as n, computed as C, useCssModule as D, useTemplateRef as b, ref as I, onBeforeMount as E, onBeforeUnmount as A, watch as F, onWatcherCleanup as H, createElementBlock as c, openBlock as t, normalizeClass as l, createElementVNode as i, createBlock as f, createCommentVNode as u, Fragment as d, renderList as v, toDisplayString as y, withDirectives as O, vShow as P, normalizeStyle as W } from "vue";
-import { cellSize as k } from "./cell-size.js";
-import $ from "./Consensus.vue.js";
-import j from "./Legend.vue.js";
-import G from "./PhylogeneticTree.vue.js";
-import J from "./SeqLogo.vue.js";
-const ne = /* @__PURE__ */ M({
-  __name: "MultiSequenceAlignmentView",
-  props: {
-    sequences: {},
-    labels: {},
-    highlightLegend: {},
-    phylogeneticTree: {},
-    widgets: {}
-  },
-  setup(R, { expose: B }) {
-    U((o) => ({
-      e405b06c: n(N),
-      "0c44921e": s.sequences.length,
-      "6aab37c6": _.value,
-      "2e72cab4": s.labels.length,
-      "1ad5abe9": V.value,
-      "3c16a76c": x.value,
-      "1406981e": n(T)
-    }));
-    const s = R, r = D(), L = b("rootRef");
-    B({ rootEl: L });
-    const _ = C(() => {
-      var o;
-      return ((o = s.sequences.at(0)) == null ? void 0 : o.rows.length) ?? 0;
-    }), T = CSS.px(k.inline).toString(), N = CSS.px(k.block).toString(), w = b("referenceCell"), h = I(), q = b("corner"), z = I(), x = C(
-      () => h.value ? CSS.px(k.inline - h.value).toString() : void 0
-    ), V = C(
-      () => CSS.px(z.value ?? 0).toString()
-    );
-    let g;
-    E(() => {
-      const o = (a) => {
-        var e;
-        return (e = a.borderBoxSize.find(Boolean)) == null ? void 0 : e.inlineSize;
-      };
-      g = new ResizeObserver((a) => {
-        for (const e of a)
-          switch (e.target) {
-            case w.value:
-              h.value = o(e);
-              break;
-            case q.value:
-              z.value = o(e);
-              break;
-          }
-      });
-    }), A(() => {
-      g.disconnect();
-    });
-    for (const o of [w, q])
-      F(o, (a, e) => {
-        a && g.observe(a), H(() => {
-          e && g.unobserve(e);
-        });
-      });
-    return (o, a) => (t(), c("div", {
-      ref: "rootRef",
-      class: l(n(r).root)
-    }, [
-      i("div", {
-        ref: "referenceCell",
-        class: l(n(r).referenceCell)
-      }, "x", 2),
-      i("div", {
-        class: l(["pl-scrollable", n(r).table])
-      }, [
-        i("div", {
-          class: l(n(r).sidebar)
-        }, [
-          s.widgets.includes("tree") && s.phylogeneticTree ? (t(), f(G, {
-            key: 0,
-            tree: s.phylogeneticTree,
-            class: l(n(r).phylogeneticTree)
-          }, null, 8, ["tree", "class"])) : u("", !0),
-          i("div", {
-            class: l(n(r).labels)
-          }, [
-            (t(!0), c(d, null, v(s.labels, ({ rows: e }, m) => (t(), c(d, { key: m }, [
-              (t(!0), c(d, null, v(e, (p, S) => (t(), c("div", { key: S }, y(p), 1))), 128))
-            ], 64))), 128))
-          ], 2)
-        ], 2),
-        x.value !== void 0 ? (t(!0), c(d, { key: 0 }, v(s.sequences, (e, m) => (t(), c("div", {
-          key: m,
-          class: l(n(r).sequenceColumn)
-        }, [
-          i("div", {
-            class: l(n(r).sequenceHeader)
-          }, [
-            O(i("div", {
-              class: l(n(r).sequenceName)
-            }, y(e.name), 3), [
-              [P, s.sequences.length > 1]
-            ]),
-            s.widgets.includes("consensus") ? (t(), f($, {
-              key: 0,
-              "residue-counts": e.residueCounts,
-              "labels-class": n(r).sequenceRow
-            }, null, 8, ["residue-counts", "labels-class"])) : u("", !0),
-            s.widgets.includes("seqLogo") ? (t(), f(J, {
-              key: 1,
-              "residue-counts": e.residueCounts
-            }, null, 8, ["residue-counts"])) : u("", !0)
-          ], 2),
-          i("div", {
-            class: l(n(r).sequenceRowsContainer),
-            style: W({
-              backgroundImage: e.highlightImageUrl ? `url(${e.highlightImageUrl})` : void 0
-            })
-          }, [
-            (t(!0), c(d, null, v(e.rows, (p, S) => (t(), c("div", {
-              key: S,
-              class: l(n(r).sequenceRow)
-            }, y(p), 3))), 128))
-          ], 6)
-        ], 2))), 128)) : u("", !0),
-        i("div", {
-          ref: "corner",
-          class: l(n(r).corner)
-        }, null, 2)
-      ], 2),
-      s.widgets.includes("legend") && s.highlightLegend ? (t(), f(j, {
-        key: 0,
-        legend: s.highlightLegend
-      }, null, 8, ["legend"])) : u("", !0)
-    ], 2));
-  }
-});
-export {
-  ne as default
-};
-//# sourceMappingURL=MultiSequenceAlignmentView.vue2.js.map

package/dist/components/PlMultiSequenceAlignment/MultiSequenceAlignmentView.vue2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"MultiSequenceAlignmentView.vue2.js","sources":["../../../src/components/PlMultiSequenceAlignment/MultiSequenceAlignmentView.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type { PlMultiSequenceAlignmentWidget } from '@platforma-sdk/model';\nimport {\n  computed,\n  onBeforeMount,\n  onBeforeUnmount,\n  onWatcherCleanup,\n  ref,\n  useCssModule,\n  useTemplateRef,\n  watch,\n} from 'vue';\nimport { cellSize } from './cell-size';\nimport Consensus from './Consensus.vue';\nimport Legend from './Legend.vue';\nimport type { TreeNodeData } from './phylogenetic-tree.worker';\nimport PhylogeneticTree from './PhylogeneticTree.vue';\nimport SeqLogo from './SeqLogo.vue';\nimport type { HighlightLegend, ResidueCounts } from './types';\n\nconst props = defineProps<{\n  sequences: {\n    name: string;\n    rows: string[];\n    residueCounts: ResidueCounts;\n    highlightImageUrl?: string;\n  }[];\n  labels: {\n    rows: string[];\n  }[];\n  highlightLegend: HighlightLegend | undefined;\n  phylogeneticTree: TreeNodeData[] | undefined;\n  widgets: PlMultiSequenceAlignmentWidget[];\n}>();\n\nconst classes = useCssModule();\n\nconst rootEl = useTemplateRef('rootRef');\ndefineExpose({ rootEl });\n\nconst rowCount = computed(() => props.sequences.at(0)?.rows.length ?? 0);\n\nconst targetCellInlineSize = CSS.px(cellSize.inline).toString();\nconst targetCellBlockSize = CSS.px(cellSize.block).toString();\n\nconst referenceCellRef = useTemplateRef('referenceCell');\nconst referenceCellInlineSize = ref<number>();\n\nconst cornerRef = useTemplateRef('corner');\nconst cornerInlineSize = ref<number>();\n\nconst letterSpacing = computed(() =>\n  referenceCellInlineSize.value\n    ? CSS.px(cellSize.inline - referenceCellInlineSize.value).toString()\n    : undefined,\n);\n\nconst sequenceNameInsetInlineStart = computed(() =>\n  CSS.px(cornerInlineSize.value ?? 0).toString(),\n);\n\nlet observer: ResizeObserver;\n\nonBeforeMount(() => {\n  const getInlineSize = (entry: ResizeObserverEntry) =>\n    entry.borderBoxSize.find(Boolean)?.inlineSize;\n\n  observer = new ResizeObserver((entries) => {\n    for (const entry of entries) {\n      switch (entry.target) {\n        case referenceCellRef.value:\n          referenceCellInlineSize.value = getInlineSize(entry);\n          break;\n        case cornerRef.value:\n          cornerInlineSize.value = getInlineSize(entry);\n          break;\n      }\n    }\n  });\n});\n\nonBeforeUnmount(() => {\n  observer.disconnect();\n});\n\nfor (const ref of [referenceCellRef, cornerRef]) {\n  watch(ref, (el, prevEl) => {\n    if (el) observer.observe(el);\n    onWatcherCleanup(() => {\n      if (prevEl) observer.unobserve(prevEl);\n    });\n  });\n}\n</script>\n\n<template>\n  <div ref=\"rootRef\" :class=\"classes.root\">\n    <div ref=\"referenceCell\" :class=\"classes.referenceCell\">x</div>\n    <div :class=\"['pl-scrollable', classes.table]\">\n      <div :class=\"classes.sidebar\">\n        <PhylogeneticTree\n          v-if=\"props.widgets.includes('tree') && props.phylogeneticTree\"\n          :tree=\"props.phylogeneticTree\"\n          :class=\"classes.phylogeneticTree\"\n        />\n        <div :class=\"classes.labels\">\n          <template\n            v-for=\"({ rows }, columnIndex) of props.labels\"\n            :key=\"columnIndex\"\n          >\n            <div v-for=\"(row, rowIndex) of rows\" :key=\"rowIndex\">\n              {{ row }}\n            </div>\n          </template>\n        </div>\n      </div>\n      <template v-if=\"letterSpacing !== undefined\">\n        <div\n          v-for=\"(column, columnIndex) of props.sequences\"\n          :key=\"columnIndex\"\n          :class=\"classes.sequenceColumn\"\n        >\n          <div :class=\"classes.sequenceHeader\">\n            <div\n              v-show=\"props.sequences.length > 1\"\n              :class=\"classes.sequenceName\"\n            >\n              {{ column.name }}\n            </div>\n            <Consensus\n              v-if=\"props.widgets.includes('consensus')\"\n              :residue-counts=\"column.residueCounts\"\n              :labels-class=\"classes.sequenceRow\"\n            />\n            <SeqLogo\n              v-if=\"props.widgets.includes('seqLogo')\"\n              :residue-counts=\"column.residueCounts\"\n            />\n          </div>\n          <div\n            :class=\"classes.sequenceRowsContainer\"\n            :style=\"{\n              backgroundImage: column.highlightImageUrl\n                ? `url(${column.highlightImageUrl})`\n                : undefined,\n            }\"\n          >\n            <div\n              v-for=\"(row, rowIndex) of column.rows\"\n              :key=\"rowIndex\"\n              :class=\"classes.sequenceRow\"\n            >\n              {{ row }}\n            </div>\n          </div>\n        </div>\n      </template>\n      <div ref=\"corner\" :class=\"classes.corner\" />\n    </div>\n    <Legend\n      v-if=\"props.widgets.includes('legend') && props.highlightLegend\"\n      :legend=\"props.highlightLegend\"\n    />\n  </div>\n</template>\n\n<style module>\n.root {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n  min-block-size: 0;\n  -webkit-print-color-adjust: exact;\n  print-color-adjust: exact;\n  container-type: inline-size;\n\n  &[data-pre-print] {\n    container-type: unset;\n\n    .sidebar {\n      max-inline-size: unset;\n    }\n  }\n}\n\n.referenceCell {\n  position: fixed;\n  visibility: hidden;\n  font-family: Spline Sans Mono;\n  font-weight: 600;\n  line-height: v-bind('targetCellBlockSize');\n}\n\n.table {\n  display: grid;\n  grid-template-columns:\n    [sidebar-start] auto [sidebar-end] repeat(\n    v-bind('props.sequences.length'),\n    [column-start] auto [column-end]\n  );\n  grid-template-rows:\n    [header-start] auto [header-end]\n    repeat(v-bind('rowCount'), [row-start] auto [row-end]);\n  justify-content: start;\n  position: relative;\n  @media print {\n    overflow: visible;\n  }\n}\n\n.sidebar {\n  grid-column: sidebar;\n  grid-row: 1 row-start / -1 row-end;\n  display: grid;\n  grid-template-rows: subgrid;\n  position: sticky;\n  inset-inline-start: 0;\n  background-color: #fff;\n  inline-size: min-content;\n  max-inline-size: 30cqi;\n  overflow: scroll;\n  overscroll-behavior-inline: none;\n  scrollbar-width: none;\n}\n\n.phylogeneticTree {\n  grid-row: 1 row-start / -1 row-end;\n}\n\n.labels {\n  grid-row: 1 row-start / -1 row-end;\n  display: grid;\n  grid-template-columns: repeat(v-bind('props.labels.length'), auto);\n  grid-template-rows: subgrid;\n  grid-auto-flow: column;\n  column-gap: 12px;\n  padding-inline-end: 12px;\n  font-family: Spline Sans Mono;\n  line-height: v-bind('targetCellBlockSize');\n  white-space: nowrap;\n}\n\n.sequenceColumn {\n  grid-row: header-start / -1 row-end;\n  display: grid;\n  grid-template-rows: subgrid;\n  & + & {\n    margin-inline-start: 24px;\n  }\n}\n\n.sequenceHeader {\n  grid-row: header;\n  display: flex;\n  flex-direction: column;\n  justify-content: end;\n  min-inline-size: 0;\n  position: sticky;\n  inset-block-start: 0;\n  background-color: #fff;\n}\n\n.sequenceName {\n  margin-block-end: 4px;\n  font-weight: 700;\n  line-height: 20px;\n  inline-size: fit-content;\n  position: sticky;\n  inset-inline-start: v-bind('sequenceNameInsetInlineStart');\n}\n\n.sequenceRowsContainer {\n  grid-row: 1 row-start / -1 row-end;\n  display: grid;\n  grid-template-rows: subgrid;\n}\n\n.sequenceRow {\n  font-family: Spline Sans Mono;\n  font-weight: 600;\n  line-height: v-bind('targetCellBlockSize');\n  letter-spacing: v-bind('letterSpacing');\n  text-indent: calc(v-bind('letterSpacing') / 2);\n  inline-size: calc-size(\n    min-content,\n    round(down, size, v-bind('targetCellInlineSize'))\n  );\n  white-space: nowrap;\n}\n\n.corner {\n  grid-column: sidebar;\n  grid-row: header;\n  position: sticky;\n  inset-inline-start: 0;\n  inset-block-start: 0;\n  background-color: #fff;\n}\n</style>\n"],"names":["props","__props","classes","useCssModule","rootEl","useTemplateRef","__expose","rowCount","computed","_a","targetCellInlineSize","cellSize","targetCellBlockSize","referenceCellRef","referenceCellInlineSize","ref","cornerRef","cornerInlineSize","letterSpacing","sequenceNameInsetInlineStart","observer","onBeforeMount","getInlineSize","entry","entries","onBeforeUnmount","watch","el","prevEl","onWatcherCleanup"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAoBA,UAAMA,IAAQC,GAeRC,IAAUC,EAAA,GAEVC,IAASC,EAAe,SAAS;AACvC,IAAAC,EAAa,EAAE,QAAAF,GAAQ;AAEvB,UAAMG,IAAWC,EAAS,MAAA;;AAAM,eAAAC,IAAAT,EAAM,UAAU,GAAG,CAAC,MAApB,gBAAAS,EAAuB,KAAK,WAAU;AAAA,KAAC,GAEjEC,IAAuB,IAAI,GAAGC,EAAS,MAAM,EAAE,SAAA,GAC/CC,IAAsB,IAAI,GAAGD,EAAS,KAAK,EAAE,SAAA,GAE7CE,IAAmBR,EAAe,eAAe,GACjDS,IAA0BC,EAAA,GAE1BC,IAAYX,EAAe,QAAQ,GACnCY,IAAmBF,EAAA,GAEnBG,IAAgBV;AAAA,MAAS,MAC7BM,EAAwB,QACpB,IAAI,GAAGH,EAAS,SAASG,EAAwB,KAAK,EAAE,aACxD;AAAA,IAAA,GAGAK,IAA+BX;AAAA,MAAS,MAC5C,IAAI,GAAGS,EAAiB,SAAS,CAAC,EAAE,SAAA;AAAA,IAAS;AAG/C,QAAIG;AAEJ,IAAAC,EAAc,MAAM;AAClB,YAAMC,IAAgB,CAACC,MAAA;;AACrB,gBAAAd,IAAAc,EAAM,cAAc,KAAK,OAAO,MAAhC,gBAAAd,EAAmC;AAAA;AAErC,MAAAW,IAAW,IAAI,eAAe,CAACI,MAAY;AACzC,mBAAWD,KAASC;AAClB,kBAAQD,EAAM,QAAA;AAAA,YACZ,KAAKV,EAAiB;AACpB,cAAAC,EAAwB,QAAQQ,EAAcC,CAAK;AACnD;AAAA,YACF,KAAKP,EAAU;AACb,cAAAC,EAAiB,QAAQK,EAAcC,CAAK;AAC5C;AAAA,UAAA;AAAA,MAGR,CAAC;AAAA,IACH,CAAC,GAEDE,EAAgB,MAAM;AACpB,MAAAL,EAAS,WAAA;AAAA,IACX,CAAC;AAED,eAAWL,KAAO,CAACF,GAAkBG,CAAS;AAC5C,MAAAU,EAAMX,GAAK,CAACY,GAAIC,MAAW;AACzB,QAAID,KAAIP,EAAS,QAAQO,CAAE,GAC3BE,EAAiB,MAAM;AACrB,UAAID,KAAQR,EAAS,UAAUQ,CAAM;AAAA,QACvC,CAAC;AAAA,MACH,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/PlMultiSequenceAlignment/MultiSequenceAlignmentView.vue3.js

@@ -1,31 +0,0 @@
-(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("._root_34869_2{display:flex;flex-direction:column;gap:12px;min-block-size:0;-webkit-print-color-adjust:exact;print-color-adjust:exact;container-type:inline-size}._root_34869_2[data-pre-print]{container-type:unset}._root_34869_2[data-pre-print] ._sidebar_34869_14{max-inline-size:unset}._referenceCell_34869_20{position:fixed;visibility:hidden;font-family:Spline Sans Mono;font-weight:600;line-height:var(--e405b06c)}._table_34869_28{display:grid;grid-template-columns:[sidebar-start] auto [sidebar-end] repeat(var(--0c44921e),[column-start] auto [column-end]);grid-template-rows:[header-start] auto [header-end] repeat(var(--6aab37c6),[row-start] auto [row-end]);justify-content:start;position:relative}@media print{._table_34869_28{overflow:visible}}._sidebar_34869_14{grid-column:sidebar;grid-row:1 row-start / -1 row-end;display:grid;grid-template-rows:subgrid;position:sticky;inset-inline-start:0;background-color:#fff;inline-size:min-content;max-inline-size:30cqi;overflow:scroll;overscroll-behavior-inline:none;scrollbar-width:none}._phylogeneticTree_34869_60{grid-row:1 row-start / -1 row-end}._labels_34869_64{grid-row:1 row-start / -1 row-end;display:grid;grid-template-columns:repeat(var(--2e72cab4),auto);grid-template-rows:subgrid;grid-auto-flow:column;column-gap:12px;padding-inline-end:12px;font-family:Spline Sans Mono;line-height:var(--e405b06c);white-space:nowrap}._sequenceColumn_34869_77{grid-row:header-start / -1 row-end;display:grid;grid-template-rows:subgrid}._sequenceColumn_34869_77+._sequenceColumn_34869_77{margin-inline-start:24px}._sequenceHeader_34869_86{grid-row:header;display:flex;flex-direction:column;justify-content:end;min-inline-size:0;position:sticky;inset-block-start:0;background-color:#fff}._sequenceName_34869_97{margin-block-end:4px;font-weight:700;line-height:20px;inline-size:fit-content;position:sticky;inset-inline-start:var(--1ad5abe9)}._sequenceRowsContainer_34869_106{grid-row:1 row-start / -1 row-end;display:grid;grid-template-rows:subgrid}._sequenceRow_34869_106{font-family:Spline Sans Mono;font-weight:600;line-height:var(--e405b06c);letter-spacing:var(--3c16a76c);text-indent:calc(var(--3c16a76c) / 2);inline-size:calc-size(min-content,round(down,size,var(--1406981e)));white-space:nowrap}._corner_34869_125{grid-column:sidebar;grid-row:header;position:sticky;inset-inline-start:0;inset-block-start:0;background-color:#fff}")),document.head.appendChild(e)}}catch(i){console.error("vite-plugin-css-injected-by-js",i)}})();
-const e = "_root_34869_2", n = "_sidebar_34869_14", s = "_referenceCell_34869_20", o = "_table_34869_28", c = "_phylogeneticTree_34869_60", _ = "_labels_34869_64", r = "_sequenceColumn_34869_77", t = "_sequenceHeader_34869_86", l = "_sequenceName_34869_97", a = "_sequenceRowsContainer_34869_106", u = "_sequenceRow_34869_106", q = "_corner_34869_125", b = {
-  root: e,
-  sidebar: n,
-  referenceCell: s,
-  table: o,
-  phylogeneticTree: c,
-  labels: _,
-  sequenceColumn: r,
-  sequenceHeader: t,
-  sequenceName: l,
-  sequenceRowsContainer: a,
-  sequenceRow: u,
-  corner: q
-};
-export {
-  q as corner,
-  b as default,
-  _ as labels,
-  c as phylogeneticTree,
-  s as referenceCell,
-  e as root,
-  r as sequenceColumn,
-  t as sequenceHeader,
-  l as sequenceName,
-  u as sequenceRow,
-  a as sequenceRowsContainer,
-  n as sidebar,
-  o as table
-};
-//# sourceMappingURL=MultiSequenceAlignmentView.vue3.js.map

package/dist/components/PlMultiSequenceAlignment/MultiSequenceAlignmentView.vue3.js.map

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

package/dist/components/PlMultiSequenceAlignment/PhylogeneticTree.vue.d.ts

@@ -1,8 +0,0 @@
-import { TreeNodeData } from './phylogenetic-tree.worker';
-type __VLS_Props = {
-    tree: TreeNodeData[];
-};
-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, {
-    plotEl: HTMLDivElement;
-}, any>;
-export default _default;

package/dist/components/PlMultiSequenceAlignment/PhylogeneticTree.vue.js

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

package/dist/components/PlMultiSequenceAlignment/PhylogeneticTree.vue.js.map

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

package/dist/components/PlMultiSequenceAlignment/PhylogeneticTree.vue2.js

@@ -1,77 +0,0 @@
-import { defineComponent as v, useCssModule as g, useTemplateRef as y, computed as w, shallowRef as k, watchEffect as _, onBeforeUnmount as I, createBlock as x, createElementBlock as C, unref as o, openBlock as p, withCtx as L, createTextVNode as T, toDisplayString as B, normalizeClass as E } from "vue";
-import { PlAlert as P } from "@milaboratories/uikit";
-import { cellSize as d } from "./cell-size.js";
-import { useMiPlots as b } from "./useMiPlots.js";
-const N = /* @__PURE__ */ v({
-  __name: "PhylogeneticTree",
-  props: {
-    tree: {}
-  },
-  setup(m) {
-    const f = m, h = g(), l = y("plotEl"), a = {
-      type: "dendro",
-      title: { show: !1, name: "" },
-      size: {
-        width: 149,
-        minCellHeight: d.block,
-        maxCellHeight: d.block,
-        marginLeft: 1,
-        marginRight: 0,
-        marginTop: 0,
-        marginBottom: 0
-      },
-      mode: "normal",
-      leavesMode: "alignLeavesToLine",
-      leavesOrder: "indexAsc",
-      legend: { show: !1 },
-      id: {
-        type: "column",
-        value: "nodeId"
-      },
-      parentId: {
-        type: "column",
-        value: "parentId"
-      },
-      height: {
-        type: "column",
-        value: "distance"
-      },
-      showNodes: !1,
-      showNodesLabels: !1,
-      showLeavesLabels: !1,
-      rootPosition: "left"
-    }, r = w(() => {
-      const e = [], n = [], u = [];
-      for (const s of f.tree)
-        e.push(s.id), n.push(s.parentId ?? null), u.push(s.length ?? 0);
-      return {
-        type: "columns",
-        id: `phylogeneticTree-${crypto.randomUUID()}`,
-        values: { nodeId: e, parentId: n, distance: u }
-      };
-    }), { miplots: i, error: c } = b(), t = k();
-    return _(async () => {
-      !l.value || !i.value || (t.value ? t.value.updateSettingsAndData(r.value, a) : (t.value = i.value.newPlot(r.value, a), t.value.mount(l.value)));
-    }), I(() => {
-      var e;
-      (e = t.value) == null || e.unmount();
-    }), (e, n) => o(c) ? (p(), x(o(P), {
-      key: 0,
-      type: "error"
-    }, {
-      default: L(() => [
-        T(B(o(c).message), 1)
-      ]),
-      _: 1
-    })) : (p(), C("div", {
-      key: 1,
-      ref_key: "plotEl",
-      ref: l,
-      class: E(o(h).container)
-    }, null, 2));
-  }
-});
-export {
-  N as default
-};
-//# sourceMappingURL=PhylogeneticTree.vue2.js.map

package/dist/components/PlMultiSequenceAlignment/PhylogeneticTree.vue2.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"PhylogeneticTree.vue2.js","sources":["../../../src/components/PlMultiSequenceAlignment/PhylogeneticTree.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport type {\n  ChartInterface,\n  DataByColumns,\n  Settings,\n} from '@milaboratories/miplots4';\nimport { PlAlert } from '@milaboratories/uikit';\nimport {\n  computed,\n  onBeforeUnmount,\n  shallowRef,\n  useCssModule,\n  useTemplateRef,\n  watchEffect,\n} from 'vue';\nimport { cellSize } from './cell-size';\nimport type { TreeNodeData } from './phylogenetic-tree.worker';\nimport { useMiPlots } from './useMiPlots';\n\nconst props = defineProps<{\n  tree: TreeNodeData[];\n}>();\n\nconst classes = useCssModule();\n\nconst plotEl = useTemplateRef('plotEl');\n\nconst settings: Settings = {\n  type: 'dendro',\n  title: { show: false, name: '' },\n  size: {\n    width: 149,\n    minCellHeight: cellSize.block,\n    maxCellHeight: cellSize.block,\n    marginLeft: 1,\n    marginRight: 0,\n    marginTop: 0,\n    marginBottom: 0,\n  },\n  mode: 'normal',\n  leavesMode: 'alignLeavesToLine',\n  leavesOrder: 'indexAsc',\n  legend: { show: false },\n  id: {\n    type: 'column',\n    value: 'nodeId',\n  },\n  parentId: {\n    type: 'column',\n    value: 'parentId',\n  },\n  height: {\n    type: 'column',\n    value: 'distance',\n  },\n  showNodes: false,\n  showNodesLabels: false,\n  showLeavesLabels: false,\n  rootPosition: 'left',\n};\n\nconst data = computed<DataByColumns>(() => {\n  const nodeId: number[] = [];\n  const parentId: (number | null)[] = [];\n  const distance: number[] = [];\n  for (const node of props.tree) {\n    nodeId.push(node.id);\n    parentId.push(node.parentId ?? null);\n    distance.push(node.length ?? 0);\n  }\n  return ({\n    type: 'columns',\n    id: `phylogeneticTree-${crypto.randomUUID()}`,\n    values: { nodeId, parentId, distance },\n  });\n});\n\nconst { miplots, error } = useMiPlots();\n\nconst plot = shallowRef<ChartInterface>();\n\nwatchEffect(async () => {\n  if (!plotEl.value || !miplots.value) return;\n  if (!plot.value) {\n    plot.value = miplots.value.newPlot(data.value, settings);\n    plot.value.mount(plotEl.value);\n  } else {\n    plot.value.updateSettingsAndData(data.value, settings);\n  }\n});\n\nonBeforeUnmount(() => {\n  plot.value?.unmount();\n});\n</script>\n\n<template>\n  <PlAlert v-if=\"error\" type=\"error\">\n    {{ error.message }}\n  </PlAlert>\n  <div v-else ref=\"plotEl\" :class=\"classes.container\" />\n</template>\n\n<style module>\n.container {\n  svg {\n    display: block;\n  }\n}\n</style>\n"],"names":["props","__props","classes","useCssModule","plotEl","useTemplateRef","settings","cellSize","data","computed","nodeId","parentId","distance","node","miplots","error","useMiPlots","plot","shallowRef","watchEffect","onBeforeUnmount","_a"],"mappings":";;;;;;;;;;AAmBA,UAAMA,IAAQC,GAIRC,IAAUC,EAAA,GAEVC,IAASC,EAAe,QAAQ,GAEhCC,IAAqB;AAAA,MACzB,MAAM;AAAA,MACN,OAAO,EAAE,MAAM,IAAO,MAAM,GAAA;AAAA,MAC5B,MAAM;AAAA,QACJ,OAAO;AAAA,QACP,eAAeC,EAAS;AAAA,QACxB,eAAeA,EAAS;AAAA,QACxB,YAAY;AAAA,QACZ,aAAa;AAAA,QACb,WAAW;AAAA,QACX,cAAc;AAAA,MAAA;AAAA,MAEhB,MAAM;AAAA,MACN,YAAY;AAAA,MACZ,aAAa;AAAA,MACb,QAAQ,EAAE,MAAM,GAAA;AAAA,MAChB,IAAI;AAAA,QACF,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,UAAU;AAAA,QACR,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,QAAQ;AAAA,QACN,MAAM;AAAA,QACN,OAAO;AAAA,MAAA;AAAA,MAET,WAAW;AAAA,MACX,iBAAiB;AAAA,MACjB,kBAAkB;AAAA,MAClB,cAAc;AAAA,IAAA,GAGVC,IAAOC,EAAwB,MAAM;AACzC,YAAMC,IAAmB,CAAA,GACnBC,IAA8B,CAAA,GAC9BC,IAAqB,CAAA;AAC3B,iBAAWC,KAAQb,EAAM;AACvB,QAAAU,EAAO,KAAKG,EAAK,EAAE,GACnBF,EAAS,KAAKE,EAAK,YAAY,IAAI,GACnCD,EAAS,KAAKC,EAAK,UAAU,CAAC;AAEhC,aAAQ;AAAA,QACN,MAAM;AAAA,QACN,IAAI,oBAAoB,OAAO,WAAA,CAAY;AAAA,QAC3C,QAAQ,EAAE,QAAAH,GAAQ,UAAAC,GAAU,UAAAC,EAAA;AAAA,MAAS;AAAA,IAEzC,CAAC,GAEK,EAAE,SAAAE,GAAS,OAAAC,EAAA,IAAUC,EAAA,GAErBC,IAAOC,EAAA;AAEb,WAAAC,EAAY,YAAY;AACtB,MAAI,CAACf,EAAO,SAAS,CAACU,EAAQ,UACzBG,EAAK,QAIRA,EAAK,MAAM,sBAAsBT,EAAK,OAAOF,CAAQ,KAHrDW,EAAK,QAAQH,EAAQ,MAAM,QAAQN,EAAK,OAAOF,CAAQ,GACvDW,EAAK,MAAM,MAAMb,EAAO,KAAK;AAAA,IAIjC,CAAC,GAEDgB,EAAgB,MAAM;;AACpB,OAAAC,IAAAJ,EAAK,UAAL,QAAAI,EAAY;AAAA,IACd,CAAC;;;;;;;;;;;;;;;;"}

package/dist/components/PlMultiSequenceAlignment/PhylogeneticTree.vue3.js

@@ -1,9 +0,0 @@
-(function(){"use strict";try{if(typeof document<"u"){var e=document.createElement("style");e.appendChild(document.createTextNode("._container_1uo2b_2 svg{display:block}")),document.head.appendChild(e)}}catch(t){console.error("vite-plugin-css-injected-by-js",t)}})();
-const n = "_container_1uo2b_2", t = {
-  container: n
-};
-export {
-  n as container,
-  t as default
-};
-//# sourceMappingURL=PhylogeneticTree.vue3.js.map

package/dist/components/PlMultiSequenceAlignment/PhylogeneticTree.vue3.js.map

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