npm - @platforma-sdk/ui-vue - Versions diffs - 1.41.19 → 1.42.1 - Mend

@platforma-sdk/ui-vue 1.41.19 → 1.42.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (58) hide show

package/dist/components/PlMultiSequenceAlignment/PlMultiSequenceAlignment.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"PlMultiSequenceAlignment.vue2.js","sources":["../../../src/components/PlMultiSequenceAlignment/PlMultiSequenceAlignment.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { isJsonEqual } from '@milaboratories/helpers';\nimport {\n type ListOptionNormalized,\n PlAlert,\n PlSplash,\n} from '@milaboratories/uikit';\nimport type {\n PColumnPredicate,\n PFrameHandle,\n PlMultiSequenceAlignmentColorSchemeOption,\n PlMultiSequenceAlignmentModel,\n PlMultiSequenceAlignmentSettings,\n PlSelectionModel,\n} from '@platforma-sdk/model';\nimport { computed, onBeforeMount, reactive, watchEffect } from 'vue';\nimport {\n sequenceLimit,\n useLabelColumnsOptions,\n useMarkupColumnsOptions,\n useMultipleAlignmentData,\n useSequenceColumnsOptions,\n} from './data';\nimport Legend from './Legend.vue';\nimport { runMigrations } from './migrations';\nimport MultiSequenceAlignmentView from './MultiSequenceAlignmentView.vue';\nimport { defaultSettings } from './settings';\nimport Toolbar from './Toolbar.vue';\n\nconst model = defineModel<PlMultiSequenceAlignmentModel>({ default: {} });\n\nonBeforeMount(() => {\n runMigrations(model);\n});\n\nconst settings = reactive<PlMultiSequenceAlignmentSettings>({\n ...defaultSettings,\n});\n\nconst props = defineProps<{\n /*\n Handle to PFrame created using `createPFrameForGraphs`.\n * Should contain all desired sequence and label columns.\n /\n readonly pFrame: PFrameHandle \| undefined;\n /\n Return true if column should be shown in sequence columns dropdown.\n * By default, all sequence columns are selected.\n /\n readonly sequenceColumnPredicate: PColumnPredicate;\n /\n Row selection model (from `PlAgDataTableV2` or `GraphMaker`).\n * If not provided or empty, all rows will be considered selected.\n * Warning: should be forwarded as a field of `reactive` object\n */\n readonly selection?: PlSelectionModel;\n}>();\n\nconst sequenceColumns = reactive(useSequenceColumnsOptions(() => ({\n pFrame: props.pFrame,\n sequenceColumnPredicate: props.sequenceColumnPredicate,\n})));\n\nconst labelColumns = reactive(useLabelColumnsOptions(() => ({\n pFrame: props.pFrame,\n sequenceColumnIds: settings.sequenceColumnIds,\n})));\n\nconst markupColumns = reactive(useMarkupColumnsOptions(() => ({\n pFrame: props.pFrame,\n sequenceColumnIds: settings.sequenceColumnIds,\n})));\n\nconst markupColumnId = computed(() =>\n settings.colorScheme?.type === 'markup'\n ? settings.colorScheme.columnId\n : undefined,\n);\n\nconst multipleAlignmentData = reactive(useMultipleAlignmentData(() => ({\n pframe: props.pFrame,\n sequenceColumnIds: settings.sequenceColumnIds,\n labelColumnIds: settings.labelColumnIds,\n markupColumnId: markupColumnId.value,\n selection: props.selection,\n colorScheme: settings.colorScheme,\n alignmentParams: settings.alignmentParams,\n})));\n\nconst formatNumber = new Intl.NumberFormat('en').format;\n\nconst colorSchemeOptions = computed<\n ListOptionNormalized<PlMultiSequenceAlignmentColorSchemeOption>[]\n>(\n () => [\n {\n label: 'Chemical Properties',\n value: { type: 'chemical-properties' },\n },\n {\n label: 'No Color',\n value: { type: 'no-color' },\n },\n ...(markupColumns.data ?? []).map(({ label, value }) => ({\n label,\n value: {\n type: 'markup' as const,\n columnId: value,\n },\n })),\n ],\n);\n\nconst error = computed(() =>\n sequenceColumns.error\n ?? labelColumns.error\n ?? markupColumns.error\n ?? multipleAlignmentData.error,\n);\n\nfunction applySettings(\n settingsPatch: Partial<PlMultiSequenceAlignmentSettings>,\n) {\n model.value = Object.fromEntries(\n Object.entries({ ...model.value, ...settingsPatch })\n .filter(([_key, value]) => value !== undefined),\n );\n}\n\nwatchEffect(() => {\n const patch: Partial<PlMultiSequenceAlignmentSettings> = Object.fromEntries(\n Object.entries({\n ...defaultSettings,\n sequenceColumnIds: sequenceColumns.data?.defaults,\n labelColumnIds: labelColumns.data?.defaults,\n ...model.value,\n }).filter(([key, value]) =>\n !isJsonEqual(\n settings[key as keyof PlMultiSequenceAlignmentSettings],\n value,\n ),\n ),\n );\n Object.assign(settings, patch);\n});\n\n// Reset stale settings\nwatchEffect(() => {\n const settingsToReset: (keyof PlMultiSequenceAlignmentSettings)[] = [];\n if (\n settings.sequenceColumnIds?.some((id) =>\n !sequenceColumns.data?.options.some(\n ({ value }) => isJsonEqual(value, id),\n ),\n )\n ) {\n settingsToReset.push('sequenceColumnIds');\n }\n if (\n settings.labelColumnIds?.some((id) =>\n !labelColumns.data?.options.some(\n ({ value }) => isJsonEqual(value, id),\n ),\n )\n ) {\n settingsToReset.push('labelColumnIds');\n }\n if (\n markupColumnId.value\n && !markupColumns.data?.some(\n ({ value }) => isJsonEqual(value, markupColumnId.value),\n )\n ) {\n settingsToReset.push('colorScheme');\n }\n if (settingsToReset.length) {\n applySettings(Object.fromEntries(\n settingsToReset.map((key) => [key, undefined]),\n ));\n }\n});\n</script>\n\n<template>\n <Toolbar\n :settings=\"settings\"\n :sequence-column-options=\"sequenceColumns.data?.options\"\n :label-column-options=\"labelColumns.data?.options\"\n :color-scheme-options=\"colorSchemeOptions\"\n @update-settings=\"applySettings\"\n />\n <PlAlert v-if=\"error\" type=\"error\">\n {{ error }}\n </PlAlert>\n <PlAlert\n v-else-if=\"\n !multipleAlignmentData.isLoading\n && (multipleAlignmentData.data?.sequences ?? []).length < 2\n \"\n type=\"warn\"\n icon\n >\n Please select at least one sequence column and two or more rows to run\n alignment\n </PlAlert>\n <template v-else>\n <PlAlert\n v-if=\"multipleAlignmentData.data?.exceedsLimit\"\n type=\"warn\"\n icon\n label=\"Visualization is limited\"\n >\n MSA visualization supports {{ formatNumber(2) }} to\n {{ formatNumber(sequenceLimit) }} sequences. Only the first\n {{ formatNumber(sequenceLimit) }} will be displayed.\n </PlAlert>\n <PlSplash\n type=\"transparent\"\n :class=\"$style.splash\"\n :loading=\"multipleAlignmentData.isLoading\"\n >\n <template v-if=\"multipleAlignmentData.data?.sequences.length\">\n <MultiSequenceAlignmentView\n :sequence-names=\"multipleAlignmentData.data.sequenceNames\"\n :sequences=\"multipleAlignmentData.data.sequences\"\n :label-rows=\"multipleAlignmentData.data.labelsRows\"\n :residue-counts=\"multipleAlignmentData.data.residueCounts\"\n :highlight-image-blob=\"multipleAlignmentData.data.highlightImage?.blob\"\n :consensus=\"settings.widgets?.includes('consensus') ?? false\"\n :seq-logo=\"settings.widgets?.includes('seqLogo') ?? false\"\n />\n <Legend\n v-if=\"\n settings.widgets?.includes('legend')\n && multipleAlignmentData.data.highlightImage?.colorMap\n \"\n :colors=\"multipleAlignmentData.data.highlightImage.colorMap\"\n />\n </template>\n </PlSplash>\n </template>\n</template>\n\n<style module>\n.splash {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 12px;\n overflow: hidden;\n}\n</style>\n"],"names":["model","_useModel","__props","onBeforeMount","runMigrations","settings","reactive","defaultSettings","props","sequenceColumns","useSequenceColumnsOptions","labelColumns","useLabelColumnsOptions","markupColumns","useMarkupColumnsOptions","markupColumnId","computed","_a","multipleAlignmentData","useMultipleAlignmentData","formatNumber","colorSchemeOptions","label","value","error","applySettings","settingsPatch","_key","watchEffect","patch","_b","key","isJsonEqual","settingsToReset","id","_c"],"mappings":"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"}
1	+ {"version":3,"file":"PlMultiSequenceAlignment.vue2.js","sources":["../../../src/components/PlMultiSequenceAlignment/PlMultiSequenceAlignment.vue"],"sourcesContent":["<script lang=\"ts\" setup>\nimport { isJsonEqual } from '@milaboratories/helpers';\nimport {\n type ListOptionNormalized,\n PlAlert,\n PlSplash,\n} from '@milaboratories/uikit';\nimport {\n getRawPlatformaInstance,\n type PColumnPredicate,\n type PFrameHandle,\n type PlMultiSequenceAlignmentColorSchemeOption,\n type PlMultiSequenceAlignmentModel,\n type PlMultiSequenceAlignmentSettings,\n type PlSelectionModel,\n} from '@platforma-sdk/model';\nimport {\n computed,\n onBeforeMount,\n reactive,\n useTemplateRef,\n watchEffect,\n} from 'vue';\nimport {\n sequenceLimit,\n useLabelColumnsOptions,\n useMarkupColumnsOptions,\n useMultipleAlignmentData,\n useSequenceColumnsOptions,\n} from './data';\nimport { runMigrations } from './migrations';\nimport MultiSequenceAlignmentView from './MultiSequenceAlignmentView.vue';\nimport { defaultSettings } from './settings';\nimport Toolbar from './Toolbar.vue';\n\nconst model = defineModel<PlMultiSequenceAlignmentModel>({ default: {} });\n\nonBeforeMount(() => {\n runMigrations(model);\n});\n\nconst settings = reactive<PlMultiSequenceAlignmentSettings>({\n ...defaultSettings,\n});\n\nconst props = defineProps<{\n /*\n Handle to PFrame created using `createPFrameForGraphs`.\n * Should contain all desired sequence and label columns.\n /\n readonly pFrame: PFrameHandle \| undefined;\n /\n Return true if column should be shown in sequence columns dropdown.\n * By default, all sequence columns are selected.\n /\n readonly sequenceColumnPredicate: PColumnPredicate;\n /\n Row selection model (from `PlAgDataTableV2` or `GraphMaker`).\n * If not provided or empty, all rows will be considered selected.\n * Warning: should be forwarded as a field of `reactive` object\n */\n readonly selection?: PlSelectionModel;\n}>();\n\nconst sequenceColumns = reactive(useSequenceColumnsOptions(() => ({\n pFrame: props.pFrame,\n sequenceColumnPredicate: props.sequenceColumnPredicate,\n})));\n\nconst labelColumns = reactive(useLabelColumnsOptions(() => ({\n pFrame: props.pFrame,\n sequenceColumnIds: settings.sequenceColumnIds,\n})));\n\nconst markupColumns = reactive(useMarkupColumnsOptions(() => ({\n pFrame: props.pFrame,\n sequenceColumnIds: settings.sequenceColumnIds,\n})));\n\nconst multipleAlignmentData = reactive(useMultipleAlignmentData(() => ({\n pframe: props.pFrame,\n sequenceColumnIds: settings.sequenceColumnIds,\n labelColumnIds: settings.labelColumnIds,\n selection: props.selection,\n colorScheme: settings.colorScheme,\n alignmentParams: settings.alignmentParams,\n})));\n\nconst formatNumber = new Intl.NumberFormat('en').format;\n\nconst colorSchemeOptions = computed<\n ListOptionNormalized<PlMultiSequenceAlignmentColorSchemeOption>[]\n>(\n () => [\n {\n label: 'Chemical Properties',\n value: { type: 'chemical-properties' },\n },\n {\n label: 'No Color',\n value: { type: 'no-color' },\n },\n ...(markupColumns.data ?? []).map(({ label, value }) => ({\n label,\n value: {\n type: 'markup' as const,\n columnId: value,\n },\n })),\n ],\n);\n\nconst error = computed(() =>\n sequenceColumns.error\n ?? labelColumns.error\n ?? markupColumns.error\n ?? multipleAlignmentData.error,\n);\n\nfunction applySettings(\n settingsPatch: Partial<PlMultiSequenceAlignmentSettings>,\n) {\n model.value = Object.fromEntries(\n Object.entries({ ...model.value, ...settingsPatch })\n .filter(([_key, value]) => value !== undefined),\n );\n}\n\nwatchEffect(() => {\n const patch: Partial<PlMultiSequenceAlignmentSettings> = Object.fromEntries(\n Object.entries({\n ...defaultSettings,\n sequenceColumnIds: sequenceColumns.data?.defaults,\n labelColumnIds: labelColumns.data?.defaults,\n ...model.value,\n }).filter(([key, value]) =>\n !isJsonEqual(\n settings[key as keyof PlMultiSequenceAlignmentSettings],\n value,\n ),\n ),\n );\n Object.assign(settings, patch);\n});\n\n// Reset stale settings\nwatchEffect(() => {\n const settingsToReset: (keyof PlMultiSequenceAlignmentSettings)[] = [];\n if (\n settings.sequenceColumnIds?.some((id) =>\n !sequenceColumns.data?.options.some(\n ({ value }) => isJsonEqual(value, id),\n ),\n )\n ) {\n settingsToReset.push('sequenceColumnIds');\n }\n if (\n settings.labelColumnIds?.some((id) =>\n !labelColumns.data?.options.some(\n ({ value }) => isJsonEqual(value, id),\n ),\n )\n ) {\n settingsToReset.push('labelColumnIds');\n }\n\n const markupColumnId = settings.colorScheme?.type === 'markup'\n ? settings.colorScheme.columnId\n : undefined;\n\n if (\n markupColumnId\n && !markupColumns.data?.some(\n ({ value }) => isJsonEqual(value, markupColumnId),\n )\n ) {\n settingsToReset.push('colorScheme');\n }\n if (settingsToReset.length) {\n applySettings(Object.fromEntries(\n settingsToReset.map((key) => [key, undefined]),\n ));\n }\n});\n\nconst msaEl = useTemplateRef('msa');\n\nasync function exportPdf() {\n const exportToPdf = getRawPlatformaInstance()?.lsDriver\n ?.exportToPdf;\n if (!exportToPdf) {\n return console.error(\n 'API getPlatformaRawInstance().lsDriver.exportToPdf is not available',\n );\n }\n const msaRoot = msaEl.value?.rootEl;\n if (!msaRoot) {\n throw new Error('MSA element is not available.');\n }\n const printTarget = document.createElement('div');\n printTarget.id = `print-target-${crypto.randomUUID()}`;\n const printStyleSheet = new CSSStyleSheet();\n document.adoptedStyleSheets.push(printStyleSheet);\n printStyleSheet.insertRule(`\n@media screen {\n #${printTarget.id} {\n visibility: hidden;\n position: fixed;\n }\n}`);\n printTarget.replaceChildren(msaRoot.cloneNode(true));\n document.body.appendChild(printTarget);\n const { height, width } = printTarget.getBoundingClientRect();\n const margin = CSS.cm(1);\n const pageSize = [width, height]\n .map((value) => CSS.px(value).add(margin.mul(2)))\n .join(' ');\n printStyleSheet.insertRule(`\n@media print {\n @page {\n size: ${pageSize};\n margin: ${margin};\n }\n body > :not(#${printTarget.id}) {\n display: none;\n }\n}`);\n try {\n await exportToPdf();\n } catch (error) {\n console.error(error);\n } finally {\n document.body.removeChild(printTarget);\n const index = document.adoptedStyleSheets.indexOf(printStyleSheet);\n if (index >= 0) {\n document.adoptedStyleSheets.splice(index, 1);\n }\n }\n}\n</script>\n\n<template>\n <Toolbar\n :settings=\"settings\"\n :sequence-column-options=\"sequenceColumns.data?.options\"\n :label-column-options=\"labelColumns.data?.options\"\n :color-scheme-options=\"colorSchemeOptions\"\n @update-settings=\"applySettings\"\n @export=\"exportPdf\"\n />\n <PlAlert v-if=\"error\" type=\"error\">\n {{ error }}\n </PlAlert>\n <PlAlert\n v-else-if=\"!multipleAlignmentData.isLoading\n && (multipleAlignmentData.data?.sequences ?? []).length < 2\"\n type=\"warn\"\n icon\n >\n Please select at least one sequence column and two or more rows to run\n alignment\n </PlAlert>\n <template v-else>\n <PlAlert\n v-if=\"multipleAlignmentData.data?.exceedsLimit\"\n type=\"warn\"\n icon\n label=\"Visualization is limited\"\n >\n MSA visualization supports {{ formatNumber(2) }} to\n {{ formatNumber(sequenceLimit) }} sequences. Only the first\n {{ formatNumber(sequenceLimit) }} will be displayed.\n </PlAlert>\n <PlSplash\n type=\"transparent\"\n :class=\"$style.splash\"\n :loading=\"multipleAlignmentData.isLoading\"\n >\n <template v-if=\"multipleAlignmentData.data?.sequences.length\">\n <MultiSequenceAlignmentView\n ref=\"msa\"\n :sequences=\"multipleAlignmentData.data.sequences\"\n :sequence-names=\"multipleAlignmentData.data.sequenceNames\"\n :label-rows=\"multipleAlignmentData.data.labelRows\"\n :residue-counts=\"multipleAlignmentData.data.residueCounts\"\n :highlight-image=\"multipleAlignmentData.data.highlightImage\"\n :widgets=\"settings.widgets\"\n />\n </template>\n </PlSplash>\n </template>\n</template>\n\n<style module>\n.splash {\n flex: 1;\n display: flex;\n flex-direction: column;\n gap: 12px;\n overflow: hidden;\n}\n</style>\n"],"names":["model","_useModel","__props","onBeforeMount","runMigrations","settings","reactive","defaultSettings","props","sequenceColumns","useSequenceColumnsOptions","labelColumns","useLabelColumnsOptions","markupColumns","useMarkupColumnsOptions","multipleAlignmentData","useMultipleAlignmentData","formatNumber","colorSchemeOptions","computed","label","value","error","applySettings","settingsPatch","_key","watchEffect","patch","_a","_b","key","isJsonEqual","settingsToReset","id","markupColumnId","_c","_d","msaEl","useTemplateRef","exportPdf","exportToPdf","getRawPlatformaInstance","msaRoot","printTarget","printStyleSheet","height","width","margin","pageSize","index"],"mappings":"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"}

package/dist/components/PlMultiSequenceAlignment/Toolbar.vue.d.ts CHANGED Viewed

@@ -7,8 +7,10 @@ type __VLS_Props = {
     colorSchemeOptions: ListOptionNormalized<ColorSchemeOption>[];
 };
 declare const _default: import('vue').DefineComponent<__VLS_Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    export: () => any;
     updateSettings: (args_0: Partial<Settings>) => any;
 }, string, import('vue').PublicProps, Readonly<__VLS_Props> & Readonly<{
+    onExport?: (() => any) | undefined;
     onUpdateSettings?: ((args_0: Partial<Settings>) => any) | undefined;
 }>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>;
 export default _default;

package/dist/components/PlMultiSequenceAlignment/Toolbar.vue.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toolbar.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlMultiSequenceAlignment/Toolbar.vue"],"names":[],"mappings":"~~AA4NA~~,OAAO,EACL,KAAK,oBAAoB,EAS1B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EACV,yCAAyC,IAAI,iBAAiB,EAC9D,gCAAgC,IAAI,QAAQ,EAC5C,SAAS,EACT,cAAc,EACf,MAAM,sBAAsB,CAAC;AAI9B,KAAK,WAAW,GAAG;IACjB,QAAQ,EAAE,QAAQ,CAAC;IACnB,qBAAqB,EAAE,oBAAoB,CAAC,SAAS,CAAC,EAAE,GAAG,SAAS,CAAC;IACrE,kBAAkB,EAAE,oBAAoB,CAAC,cAAc,CAAC,EAAE,GAAG,SAAS,CAAC;IACvE,kBAAkB,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,CAAC;CAC/D,CAAC~~;;;;;;AAydF~~,wBAOG"}
1	+ {"version":3,"file":"Toolbar.vue.d.ts","sourceRoot":"","sources":["../../../src/components/PlMultiSequenceAlignment/Toolbar.vue"],"names":[],"mappings":"AA+NA,OAAO,EACL,KAAK,oBAAoB,EAS1B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,KAAK,EACV,yCAAyC,IAAI,iBAAiB,EAC9D,gCAAgC,IAAI,QAAQ,EAC5C,SAAS,EACT,cAAc,EACf,MAAM,sBAAsB,CAAC;AAI9B,KAAK,WAAW,GAAG;IACjB,QAAQ,EAAE,QAAQ,CAAC;IACnB,qBAAqB,EAAE,oBAAoB,CAAC,SAAS,CAAC,EAAE,GAAG,SAAS,CAAC;IACrE,kBAAkB,EAAE,oBAAoB,CAAC,cAAc,CAAC,EAAE,GAAG,SAAS,CAAC;IACvE,kBAAkB,EAAE,oBAAoB,CAAC,iBAAiB,CAAC,EAAE,CAAC;CAC/D,CAAC;;;;;;;;AAmeF,wBAOG"}

package/dist/components/PlMultiSequenceAlignment/Toolbar.vue2.js CHANGED Viewed

@@ -1,16 +1,16 @@
-import { defineComponent as N, ref as b, watchEffect as I, computed as P, createElementBlock as $, openBlock as f, Fragment as K, createElementVNode as r, createVNode as o, normalizeClass as d, unref as n, withModifiers as L, withCtx as s, createTextVNode as a, createCommentVNode as S, createBlock as T, withKeys as y } from "vue";
-import { isJsonEqual as U } from "../../lib/util/helpers/dist/index.js";
+import { defineComponent as I, ref as b, watchEffect as K, computed as P, createElementBlock as $, openBlock as f, Fragment as L, createElementVNode as r, createVNode as o, normalizeClass as d, unref as n, withModifiers as S, withCtx as s, createTextVNode as i, createCommentVNode as U, createBlock as T, withKeys as C } from "vue";
+import { isJsonEqual as k } from "../../lib/util/helpers/dist/index.js";
 import "../../lib/ui/uikit/dist/index.js";
 import { defaultAlignmentParams as A } from "./multi-sequence-alignment.js";
 import q from "../../lib/ui/uikit/dist/components/PlDropdownMulti/PlDropdownMulti.vue.js";
 import B from "../../lib/ui/uikit/dist/components/PlDropdown/PlDropdown.vue.js";
-import C from "../../lib/ui/uikit/dist/components/PlBtnGhost/PlBtnGhost.vue.js";
+import y from "../../lib/ui/uikit/dist/components/PlBtnGhost/PlBtnGhost.vue.js";
 import g from "../../lib/ui/uikit/dist/components/PlCheckbox/PlCheckbox.vue.js";
 import R from "../../lib/ui/uikit/dist/components/PlSlideModal/PlSlideModal.vue.js";
 import V from "../../lib/ui/uikit/dist/components/PlNumberField/PlNumberField.vue.js";
 import G from "../../lib/ui/uikit/dist/components/PlBtnPrimary/PlBtnPrimary.vue.js";
 import z from "../../lib/ui/uikit/dist/components/PlBtnSecondary/PlBtnSecondary.vue.js";
-const h = /* @__PURE__ */ N({
+const h = /* @__PURE__ */ I({
   __name: "Toolbar",
   props: {
     settings: {},
@@ -18,11 +18,11 @@ const h = /* @__PURE__ */ N({
     labelColumnOptions: {},
     colorSchemeOptions: {}
   },
-  emits: ["updateSettings"],
-  setup(u, { emit: k }) {
-    const w = k, p = b(!1);
+  emits: ["updateSettings", "export"],
+  setup(u, { emit: w }) {
+    const O = w, p = b(!1);
     function m(t, e) {
-      w("updateSettings", { [t]: e });
+      O("updateSettings", { [t]: e });
     }
     function v(t, e) {
       m(
@@ -30,16 +30,16 @@ const h = /* @__PURE__ */ N({
         e ? [...u.settings.widgets, t] : u.settings.widgets.filter((l) => t !== l)
       );
     }
-    const i = b({ ...u.settings.alignmentParams });
-    I(() => {
-      i.value = { ...u.settings.alignmentParams };
+    const a = b({ ...u.settings.alignmentParams });
+    K(() => {
+      a.value = { ...u.settings.alignmentParams };
     });
-    const O = P(
-      () => !U(u.settings.alignmentParams, i.value)
-    ), E = P(
-      () => !U(u.settings.alignmentParams, A)
+    const E = P(
+      () => !k(u.settings.alignmentParams, a.value)
+    ), N = P(
+      () => !k(u.settings.alignmentParams, A)
     );
-    return (t, e) => (f(), $(K, null, [
+    return (t, e) => (f(), $(L, null, [
       r("div", {
         class: d(t.$style.container)
       }, [
@@ -73,18 +73,21 @@ const h = /* @__PURE__ */ N({
           r("div", {
             class: d(t.$style.buttons)
           }, [
-            o(n(C), {
+            o(n(y), {
               icon: "settings",
-              onClick: e[3] || (e[3] = L((l) => p.value = !0, ["stop"]))
+              onClick: e[3] || (e[3] = S((l) => p.value = !0, ["stop"]))
             }, {
-              default: s(() => e[17] || (e[17] = [
-                a(" Settings ")
+              default: s(() => e[18] || (e[18] = [
+                i(" Settings ")
               ])),
               _: 1
             }),
-            o(n(C), { icon: "export" }, {
-              default: s(() => e[18] || (e[18] = [
-                a("Export")
+            o(n(y), {
+              icon: "export",
+              onClick: e[4] || (e[4] = S((l) => t.$emit("export"), ["stop"]))
+            }, {
+              default: s(() => e[19] || (e[19] = [
+                i(" Export ")
               ])),
               _: 1
             })
@@ -98,19 +101,19 @@ const h = /* @__PURE__ */ N({
           }, [
             o(n(g), {
               "model-value": t.settings.widgets.includes("seqLogo"),
-              "onUpdate:modelValue": e[4] || (e[4] = (l) => v("seqLogo", l))
+              "onUpdate:modelValue": e[5] || (e[5] = (l) => v("seqLogo", l))
             }, {
-              default: s(() => e[19] || (e[19] = [
-                a(" Seq logo ")
+              default: s(() => e[20] || (e[20] = [
+                i(" Seq logo ")
               ])),
               _: 1
             }, 8, ["model-value"]),
             o(n(g), {
               "model-value": t.settings.widgets.includes("consensus"),
-              "onUpdate:modelValue": e[5] || (e[5] = (l) => v("consensus", l))
+              "onUpdate:modelValue": e[6] || (e[6] = (l) => v("consensus", l))
             }, {
-              default: s(() => e[20] || (e[20] = [
-                a(" Consensus ")
+              default: s(() => e[21] || (e[21] = [
+                i(" Consensus ")
               ])),
               _: 1
             }, 8, ["model-value"]),
@@ -118,8 +121,8 @@ const h = /* @__PURE__ */ N({
               "model-value": !1,
               disabled: ""
             }, {
-              default: s(() => e[21] || (e[21] = [
-                a("Navigator")
+              default: s(() => e[22] || (e[22] = [
+                i("Navigator")
               ])),
               _: 1
             }),
@@ -127,18 +130,18 @@ const h = /* @__PURE__ */ N({
               "model-value": !1,
               disabled: ""
             }, {
-              default: s(() => e[22] || (e[22] = [
-                a("Tree")
+              default: s(() => e[23] || (e[23] = [
+                i("Tree")
               ])),
               _: 1
             }),
             o(n(g), {
               "model-value": t.settings.widgets.includes("legend"),
               disabled: t.settings.colorScheme.type === "no-color",
-              "onUpdate:modelValue": e[6] || (e[6] = (l) => v("legend", l))
+              "onUpdate:modelValue": e[7] || (e[7] = (l) => v("legend", l))
             }, {
-              default: s(() => e[23] || (e[23] = [
-                a(" Legend ")
+              default: s(() => e[24] || (e[24] = [
+                i(" Legend ")
               ])),
               _: 1
             }, 8, ["model-value", "disabled"])
@@ -147,80 +150,80 @@ const h = /* @__PURE__ */ N({
       ], 2),
       o(n(R), {
         modelValue: p.value,
-        "onUpdate:modelValue": e[16] || (e[16] = (l) => p.value = l)
+        "onUpdate:modelValue": e[17] || (e[17] = (l) => p.value = l)
       }, {
-        title: s(() => e[24] || (e[24] = [
-          a("Settings")
+        title: s(() => e[25] || (e[25] = [
+          i("Settings")
         ])),
         default: s(() => [
           o(n(V), {
-            modelValue: i.value.gpo,
-            "onUpdate:modelValue": e[7] || (e[7] = (l) => i.value.gpo = l),
+            modelValue: a.value.gpo,
+            "onUpdate:modelValue": e[8] || (e[8] = (l) => a.value.gpo = l),
             label: "Gap open penalty",
             step: 0.1,
-            onKeyup: e[8] || (e[8] = y((l) => m("alignmentParams", i.value), ["enter"]))
+            onKeyup: e[9] || (e[9] = C((l) => m("alignmentParams", a.value), ["enter"]))
           }, {
-            tooltip: s(() => e[25] || (e[25] = [
-              a(" Penalty score assigned to the introduction of a gap in the alignment ")
+            tooltip: s(() => e[26] || (e[26] = [
+              i(" Penalty score assigned to the introduction of a gap in the alignment ")
             ])),
             _: 1
           }, 8, ["modelValue"]),
           o(n(V), {
-            modelValue: i.value.gpe,
-            "onUpdate:modelValue": e[9] || (e[9] = (l) => i.value.gpe = l),
+            modelValue: a.value.gpe,
+            "onUpdate:modelValue": e[10] || (e[10] = (l) => a.value.gpe = l),
             label: "Gap extension penalty",
             step: 0.1,
-            onKeyup: e[10] || (e[10] = y((l) => m("alignmentParams", i.value), ["enter"]))
+            onKeyup: e[11] || (e[11] = C((l) => m("alignmentParams", a.value), ["enter"]))
           }, {
-            tooltip: s(() => e[26] || (e[26] = [
-              a(" Penalty score assigned to each additional residue added to an existing gap ")
+            tooltip: s(() => e[27] || (e[27] = [
+              i(" Penalty score assigned to each additional residue added to an existing gap ")
             ])),
             _: 1
           }, 8, ["modelValue"]),
           o(n(V), {
-            modelValue: i.value.tgpe,
-            "onUpdate:modelValue": e[11] || (e[11] = (l) => i.value.tgpe = l),
+            modelValue: a.value.tgpe,
+            "onUpdate:modelValue": e[12] || (e[12] = (l) => a.value.tgpe = l),
             label: "Terminal gap extension penalty",
             step: 0.1,
-            onKeyup: e[12] || (e[12] = y((l) => m("alignmentParams", i.value), ["enter"]))
+            onKeyup: e[13] || (e[13] = C((l) => m("alignmentParams", a.value), ["enter"]))
           }, {
-            tooltip: s(() => e[27] || (e[27] = [
-              a(" Penalty score assigned to extending gaps at the ends of sequences ")
+            tooltip: s(() => e[28] || (e[28] = [
+              i(" Penalty score assigned to extending gaps at the ends of sequences ")
             ])),
             _: 1
           }, 8, ["modelValue"]),
-          O.value ? (f(), $("div", {
+          E.value ? (f(), $("div", {
             key: 0,
             class: d(t.$style["pending-changes"])
           }, [
             o(n(G), {
-              onClick: e[13] || (e[13] = (l) => m("alignmentParams", i.value))
+              onClick: e[14] || (e[14] = (l) => m("alignmentParams", a.value))
             }, {
-              default: s(() => e[28] || (e[28] = [
-                a(" Apply ")
+              default: s(() => e[29] || (e[29] = [
+                i(" Apply ")
               ])),
               _: 1
             }),
-            o(n(C), {
-              onClick: e[14] || (e[14] = (l) => i.value = t.settings.alignmentParams)
+            o(n(y), {
+              onClick: e[15] || (e[15] = (l) => a.value = t.settings.alignmentParams)
             }, {
-              default: s(() => e[29] || (e[29] = [
-                a(" Cancel ")
+              default: s(() => e[30] || (e[30] = [
+                i(" Cancel ")
               ])),
               _: 1
             })
-          ], 2)) : S("", !0),
-          E.value ? (f(), T(n(z), {
+          ], 2)) : U("", !0),
+          N.value ? (f(), T(n(z), {
             key: 1,
             class: d(t.$style["reset-button"]),
             icon: "reverse",
-            onClick: e[15] || (e[15] = (l) => m("alignmentParams", void 0))
+            onClick: e[16] || (e[16] = (l) => m("alignmentParams", void 0))
           }, {
-            default: s(() => e[30] || (e[30] = [
-              a(" Reset to Default ")
+            default: s(() => e[31] || (e[31] = [
+              i(" Reset to Default ")
             ])),
             _: 1
-          }, 8, ["class"])) : S("", !0)
+          }, 8, ["class"])) : U("", !0)
         ]),
         _: 1
       }, 8, ["modelValue"])

package/dist/components/PlMultiSequenceAlignment/Toolbar.vue2.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Toolbar.vue2.js","sources":["../../../src/components/PlMultiSequenceAlignment/Toolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { isJsonEqual } from '@milaboratories/helpers';\nimport {\n type ListOptionNormalized,\n PlBtnGhost,\n PlBtnPrimary,\n PlBtnSecondary,\n PlCheckbox,\n PlDropdown,\n PlDropdownMulti,\n PlNumberField,\n PlSlideModal,\n} from '@milaboratories/uikit';\nimport type {\n PlMultiSequenceAlignmentColorSchemeOption as ColorSchemeOption,\n PlMultiSequenceAlignmentSettings as Settings,\n PObjectId,\n PTableColumnId,\n} from '@platforma-sdk/model';\nimport { computed, ref, watchEffect } from 'vue';\nimport { defaultAlignmentParams } from './multi-sequence-alignment';\n\nconst { settings } = defineProps<{\n settings: Settings;\n sequenceColumnOptions: ListOptionNormalized<PObjectId>[] \| undefined;\n labelColumnOptions: ListOptionNormalized<PTableColumnId>[] \| undefined;\n colorSchemeOptions: ListOptionNormalized<ColorSchemeOption>[];\n}>();\n\nconst emit = defineEmits<{\n updateSettings: [Partial<Settings>];\n}>();\n\nconst settingsOpen = ref(false);\n\nfunction updateSetting<K extends keyof Settings>(\n key: K,\n value: Settings[K] \| undefined,\n) {\n emit('updateSettings', { [key]: value });\n}\n\nfunction toggleWidget(\n widget: 'seqLogo' \| 'consensus' \| 'legend',\n checked: boolean,\n) {\n updateSetting(\n 'widgets',\n checked\n ? [...settings.widgets, widget]\n : settings.widgets.filter((w) => widget !== w),\n );\n}\n\nconst alignmentParams = ref({ ...settings.alignmentParams });\nwatchEffect(() => {\n alignmentParams.value = { ...settings.alignmentParams };\n});\n\nconst alignmentParamsChangesPending = computed(() =>\n !isJsonEqual(settings.alignmentParams, alignmentParams.value),\n);\n\nconst canResetAlignmentParams = computed(() =>\n !isJsonEqual(settings.alignmentParams, defaultAlignmentParams),\n);\n</script>\n\n<template>\n <div :class=\"$style.container\">\n <div :class=\"$style.line\">\n <div :class=\"$style.section\">\n <PlDropdownMulti\n label=\"Sequence Columns\"\n :model-value=\"settings.sequenceColumnIds ?? []\"\n :options=\"sequenceColumnOptions\"\n clearable\n @update:model-value=\"updateSetting('sequenceColumnIds', $event)\"\n />\n <PlDropdownMulti\n :model-value=\"settings.labelColumnIds ?? []\"\n label=\"Label Columns\"\n :options=\"labelColumnOptions\"\n clearable\n @update:model-value=\"updateSetting('labelColumnIds', $event)\"\n />\n <PlDropdown\n :model-value=\"settings.colorScheme\"\n label=\"Color Scheme\"\n :options=\"colorSchemeOptions\"\n @update:model-value=\"updateSetting('colorScheme', $event)\"\n />\n </div>\n <div :class=\"$style.buttons\">\n <PlBtnGhost icon=\"settings\" @click.stop=\"settingsOpen = true\">\n Settings\n </PlBtnGhost>\n <PlBtnGhost icon=\"export\">Export</PlBtnGhost>\n </div>\n </div>\n <div :class=\"$style.line\">\n <div :class=\"$style.section\">\n <PlCheckbox\n :model-value=\"settings.widgets.includes('seqLogo')\"\n @update:model-value=\"toggleWidget('seqLogo', $event)\"\n >\n Seq logo\n </PlCheckbox>\n <PlCheckbox\n :model-value=\"settings.widgets.includes('consensus')\"\n @update:model-value=\"toggleWidget('consensus', $event)\"\n >\n Consensus\n </PlCheckbox>\n <PlCheckbox :model-value=\"false\" disabled>Navigator</PlCheckbox>\n <PlCheckbox :model-value=\"false\" disabled>Tree</PlCheckbox>\n <PlCheckbox\n :model-value=\"settings.widgets.includes('legend')\"\n :disabled=\"settings.colorScheme.type === 'no-color'\"\n @update:model-value=\"toggleWidget('legend', $event)\"\n >\n Legend\n </PlCheckbox>\n </div>\n </div>\n </div>\n <PlSlideModal v-model=\"settingsOpen\">\n <template #title>Settings</template>\n <PlNumberField\n v-model=\"alignmentParams.gpo\"\n label=\"Gap open penalty\"\n :step=\"0.1\"\n @keyup.enter=\"updateSetting('alignmentParams', alignmentParams)\"\n >\n <template #tooltip>\n Penalty score assigned to the introduction of a gap in the alignment\n </template>\n </PlNumberField>\n <PlNumberField\n v-model=\"alignmentParams.gpe\"\n label=\"Gap extension penalty\"\n :step=\"0.1\"\n @keyup.enter=\"updateSetting('alignmentParams', alignmentParams)\"\n >\n <template #tooltip>\n Penalty score assigned to each additional residue added to an existing\n gap\n </template>\n </PlNumberField>\n <PlNumberField\n v-model=\"alignmentParams.tgpe\"\n label=\"Terminal gap extension penalty\"\n :step=\"0.1\"\n @keyup.enter=\"updateSetting('alignmentParams', alignmentParams)\"\n >\n <template #tooltip>\n Penalty score assigned to extending gaps at the ends of sequences\n </template>\n </PlNumberField>\n <div\n v-if=\"alignmentParamsChangesPending\"\n :class=\"$style['pending-changes']\"\n >\n <PlBtnPrimary @click=\"updateSetting('alignmentParams', alignmentParams)\">\n Apply\n </PlBtnPrimary>\n <PlBtnGhost @click=\"alignmentParams = settings.alignmentParams\">\n Cancel\n </PlBtnGhost>\n </div>\n <PlBtnSecondary\n v-if=\"canResetAlignmentParams\"\n :class=\"$style['reset-button']\"\n icon=\"reverse\"\n @click=\"updateSetting('alignmentParams', undefined)\"\n >\n Reset to Default\n </PlBtnSecondary>\n </PlSlideModal>\n</template>\n\n<style module>\n.container {\n display: flex;\n flex-direction: column;\n gap: 24px;\n}\n\n.line {\n display: flex;\n justify-content: space-between;\n}\n\n.section {\n display: flex;\n flex-wrap: wrap;\n gap: 24px;\n}\n\n.buttons {\n display: flex;\n}\n\n.pending-changes {\n display: flex;\n button {\n min-width: 160px;\n }\n}\n\n.reset-button {\n margin-block-start: auto;\n span {\n text-transform: none;\n }\n}\n</style>\n"],"names":["emit","__emit","settingsOpen","ref","updateSetting","key","value","toggleWidget","widget","checked","__props","w","alignmentParams","watchEffect","alignmentParamsChangesPending","computed","isJsonEqual","canResetAlignmentParams","defaultAlignmentParams"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA6BA,UAAMA,IAAOC,~~GAIPC~~,IAAeC,EAAI,EAAK;AAErB,aAAAC,EACPC,GACAC,GACA;AACA,MAAAN,EAAK,kBAAkB,EAAE,CAACK,CAAG,GAAGC,GAAO;AAAA,IAAA;AAGhC,aAAAC,EACPC,GACAC,GACA;AACA,MAAAL;AAAA,QACE;AAAA,QACAK,IACI,CAAC,GAAGC,EAAQ,SAAC,SAASF,CAAM,IAC5BE,EAAQ,SAAC,QAAQ,OAAO,CAACC,MAAMH,MAAWG,CAAC;AAAA,MACjD;AAAA,IAAA;AAGF,UAAMC,IAAkBT,EAAI,EAAE,GAAGO,WAAS,iBAAiB;AAC3D,IAAAG,EAAY,MAAM;AAChB,MAAAD,EAAgB,QAAQ,EAAE,GAAGF,WAAS,gBAAgB;AAAA,IAAA,CACvD;AAED,UAAMI,IAAgCC;AAAA,MAAS,MAC7C,CAACC,EAAYN,EAAA,SAAS,iBAAiBE,EAAgB,KAAK;AAAA,IAC9D,GAEMK,IAA0BF;AAAA,MAAS,MACvC,CAACC,EAAYN,EAAA,SAAS,iBAAiBQ,CAAsB;AAAA,IAC/D~~;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;~~"}
1	+ {"version":3,"file":"Toolbar.vue2.js","sources":["../../../src/components/PlMultiSequenceAlignment/Toolbar.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport { isJsonEqual } from '@milaboratories/helpers';\nimport {\n type ListOptionNormalized,\n PlBtnGhost,\n PlBtnPrimary,\n PlBtnSecondary,\n PlCheckbox,\n PlDropdown,\n PlDropdownMulti,\n PlNumberField,\n PlSlideModal,\n} from '@milaboratories/uikit';\nimport type {\n PlMultiSequenceAlignmentColorSchemeOption as ColorSchemeOption,\n PlMultiSequenceAlignmentSettings as Settings,\n PObjectId,\n PTableColumnId,\n} from '@platforma-sdk/model';\nimport { computed, ref, watchEffect } from 'vue';\nimport { defaultAlignmentParams } from './multi-sequence-alignment';\n\nconst { settings } = defineProps<{\n settings: Settings;\n sequenceColumnOptions: ListOptionNormalized<PObjectId>[] \| undefined;\n labelColumnOptions: ListOptionNormalized<PTableColumnId>[] \| undefined;\n colorSchemeOptions: ListOptionNormalized<ColorSchemeOption>[];\n}>();\n\nconst emit = defineEmits<{\n updateSettings: [Partial<Settings>];\n export: [];\n}>();\n\nconst settingsOpen = ref(false);\n\nfunction updateSetting<K extends keyof Settings>(\n key: K,\n value: Settings[K] \| undefined,\n) {\n emit('updateSettings', { [key]: value });\n}\n\nfunction toggleWidget(\n widget: 'seqLogo' \| 'consensus' \| 'legend',\n checked: boolean,\n) {\n updateSetting(\n 'widgets',\n checked\n ? [...settings.widgets, widget]\n : settings.widgets.filter((w) => widget !== w),\n );\n}\n\nconst alignmentParams = ref({ ...settings.alignmentParams });\nwatchEffect(() => {\n alignmentParams.value = { ...settings.alignmentParams };\n});\n\nconst alignmentParamsChangesPending = computed(() =>\n !isJsonEqual(settings.alignmentParams, alignmentParams.value),\n);\n\nconst canResetAlignmentParams = computed(() =>\n !isJsonEqual(settings.alignmentParams, defaultAlignmentParams),\n);\n</script>\n\n<template>\n <div :class=\"$style.container\">\n <div :class=\"$style.line\">\n <div :class=\"$style.section\">\n <PlDropdownMulti\n label=\"Sequence Columns\"\n :model-value=\"settings.sequenceColumnIds ?? []\"\n :options=\"sequenceColumnOptions\"\n clearable\n @update:model-value=\"updateSetting('sequenceColumnIds', $event)\"\n />\n <PlDropdownMulti\n :model-value=\"settings.labelColumnIds ?? []\"\n label=\"Label Columns\"\n :options=\"labelColumnOptions\"\n clearable\n @update:model-value=\"updateSetting('labelColumnIds', $event)\"\n />\n <PlDropdown\n :model-value=\"settings.colorScheme\"\n label=\"Color Scheme\"\n :options=\"colorSchemeOptions\"\n @update:model-value=\"updateSetting('colorScheme', $event)\"\n />\n </div>\n <div :class=\"$style.buttons\">\n <PlBtnGhost icon=\"settings\" @click.stop=\"settingsOpen = true\">\n Settings\n </PlBtnGhost>\n <PlBtnGhost icon=\"export\" @click.stop=\"$emit('export')\">\n Export\n </PlBtnGhost>\n </div>\n </div>\n <div :class=\"$style.line\">\n <div :class=\"$style.section\">\n <PlCheckbox\n :model-value=\"settings.widgets.includes('seqLogo')\"\n @update:model-value=\"toggleWidget('seqLogo', $event)\"\n >\n Seq logo\n </PlCheckbox>\n <PlCheckbox\n :model-value=\"settings.widgets.includes('consensus')\"\n @update:model-value=\"toggleWidget('consensus', $event)\"\n >\n Consensus\n </PlCheckbox>\n <PlCheckbox :model-value=\"false\" disabled>Navigator</PlCheckbox>\n <PlCheckbox :model-value=\"false\" disabled>Tree</PlCheckbox>\n <PlCheckbox\n :model-value=\"settings.widgets.includes('legend')\"\n :disabled=\"settings.colorScheme.type === 'no-color'\"\n @update:model-value=\"toggleWidget('legend', $event)\"\n >\n Legend\n </PlCheckbox>\n </div>\n </div>\n </div>\n <PlSlideModal v-model=\"settingsOpen\">\n <template #title>Settings</template>\n <PlNumberField\n v-model=\"alignmentParams.gpo\"\n label=\"Gap open penalty\"\n :step=\"0.1\"\n @keyup.enter=\"updateSetting('alignmentParams', alignmentParams)\"\n >\n <template #tooltip>\n Penalty score assigned to the introduction of a gap in the alignment\n </template>\n </PlNumberField>\n <PlNumberField\n v-model=\"alignmentParams.gpe\"\n label=\"Gap extension penalty\"\n :step=\"0.1\"\n @keyup.enter=\"updateSetting('alignmentParams', alignmentParams)\"\n >\n <template #tooltip>\n Penalty score assigned to each additional residue added to an existing\n gap\n </template>\n </PlNumberField>\n <PlNumberField\n v-model=\"alignmentParams.tgpe\"\n label=\"Terminal gap extension penalty\"\n :step=\"0.1\"\n @keyup.enter=\"updateSetting('alignmentParams', alignmentParams)\"\n >\n <template #tooltip>\n Penalty score assigned to extending gaps at the ends of sequences\n </template>\n </PlNumberField>\n <div\n v-if=\"alignmentParamsChangesPending\"\n :class=\"$style['pending-changes']\"\n >\n <PlBtnPrimary @click=\"updateSetting('alignmentParams', alignmentParams)\">\n Apply\n </PlBtnPrimary>\n <PlBtnGhost @click=\"alignmentParams = settings.alignmentParams\">\n Cancel\n </PlBtnGhost>\n </div>\n <PlBtnSecondary\n v-if=\"canResetAlignmentParams\"\n :class=\"$style['reset-button']\"\n icon=\"reverse\"\n @click=\"updateSetting('alignmentParams', undefined)\"\n >\n Reset to Default\n </PlBtnSecondary>\n </PlSlideModal>\n</template>\n\n<style module>\n.container {\n display: flex;\n flex-direction: column;\n gap: 24px;\n}\n\n.line {\n display: flex;\n justify-content: space-between;\n}\n\n.section {\n display: flex;\n flex-wrap: wrap;\n gap: 24px;\n}\n\n.buttons {\n display: flex;\n}\n\n.pending-changes {\n display: flex;\n button {\n min-width: 160px;\n }\n}\n\n.reset-button {\n margin-block-start: auto;\n span {\n text-transform: none;\n }\n}\n</style>\n"],"names":["emit","__emit","settingsOpen","ref","updateSetting","key","value","toggleWidget","widget","checked","__props","w","alignmentParams","watchEffect","alignmentParamsChangesPending","computed","isJsonEqual","canResetAlignmentParams","defaultAlignmentParams"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AA6BA,UAAMA,IAAOC,GAKPC,IAAeC,EAAI,EAAK;AAErB,aAAAC,EACPC,GACAC,GACA;AACA,MAAAN,EAAK,kBAAkB,EAAE,CAACK,CAAG,GAAGC,GAAO;AAAA,IAAA;AAGhC,aAAAC,EACPC,GACAC,GACA;AACA,MAAAL;AAAA,QACE;AAAA,QACAK,IACI,CAAC,GAAGC,EAAQ,SAAC,SAASF,CAAM,IAC5BE,EAAQ,SAAC,QAAQ,OAAO,CAACC,MAAMH,MAAWG,CAAC;AAAA,MACjD;AAAA,IAAA;AAGF,UAAMC,IAAkBT,EAAI,EAAE,GAAGO,WAAS,iBAAiB;AAC3D,IAAAG,EAAY,MAAM;AAChB,MAAAD,EAAgB,QAAQ,EAAE,GAAGF,WAAS,gBAAgB;AAAA,IAAA,CACvD;AAED,UAAMI,IAAgCC;AAAA,MAAS,MAC7C,CAACC,EAAYN,EAAA,SAAS,iBAAiBE,EAAgB,KAAK;AAAA,IAC9D,GAEMK,IAA0BF;AAAA,MAAS,MACvC,CAACC,EAAYN,EAAA,SAAS,iBAAiBQ,CAAsB;AAAA,IAC/D;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/dist/components/PlMultiSequenceAlignment/chemical-properties.d.ts CHANGED Viewed

@@ -1,9 +1,45 @@
-import { ColorMap, ResidueCounts } from './types';
-export declare const chemicalPropertiesColorMap: ColorMap;
-export type ChemicalCategory = keyof typeof chemicalPropertiesColorMap;
-export declare function colorizeSequencesByChemicalProperties({ sequences, residueCounts, colorMap }: {
+import { HighlightLegend, ResidueCounts } from './types';
+export declare function highlightByChemicalProperties({ sequences, residueCounts }: {
     sequences: string[];
     residueCounts: ResidueCounts;
-    colorMap: ColorMap;
-}): Promise<Blob>;
+}): {
+    blob: Blob;
+    legend: HighlightLegend;
+};
+declare const chemicalPropertiesColorScheme: {
+    hydrophobic: {
+        label: string;
+        color: string;
+    };
+    positiveCharge: {
+        label: string;
+        color: string;
+    };
+    negativeCharge: {
+        label: string;
+        color: string;
+    };
+    polar: {
+        label: string;
+        color: string;
+    };
+    cysteine: {
+        label: string;
+        color: string;
+    };
+    glycine: {
+        label: string;
+        color: string;
+    };
+    proline: {
+        label: string;
+        color: string;
+    };
+    aromatic: {
+        label: string;
+        color: string;
+    };
+};
+export type ChemicalCategory = keyof typeof chemicalPropertiesColorScheme;
+export {};
 //# sourceMappingURL=chemical-properties.d.ts.map

package/dist/components/PlMultiSequenceAlignment/chemical-properties.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"chemical-properties.d.ts","sourceRoot":"","sources":["../../../src/components/PlMultiSequenceAlignment/chemical-properties.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,~~QAAQ~~,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;~~AAEvD~~,~~eAAO,MAAM,0BAA0B,EAAE,QAiCxC,CAAC;AAEF,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,0BAA0B,CAAC;AAEvE,~~wBAAgB,~~qCAAqC~~,~~CACnD~~,EAAE,SAAS,EAAE,aAAa,EAAE,~~QAAQ,~~EAAE~~,EAAE~~;~~IACtC~~,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,aAAa,EAAE,aAAa,CAAC;~~IAC7B~~,~~QAAQ~~,EAAE,~~QAAQ~~,CAAC;~~CACpB~~,~~GACA~~,~~OAAO~~,CAAC,~~IAAI~~,CAAC~~,CAwBf~~"}
1	+ {"version":3,"file":"chemical-properties.d.ts","sourceRoot":"","sources":["../../../src/components/PlMultiSequenceAlignment/chemical-properties.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAE9D,wBAAgB,6BAA6B,CAC3C,EAAE,SAAS,EAAE,aAAa,EAAE,EAAE;IAC5B,SAAS,EAAE,MAAM,EAAE,CAAC;IACpB,aAAa,EAAE,aAAa,CAAC;CAC9B,GACA;IAAE,IAAI,EAAE,IAAI,CAAC;IAAC,MAAM,EAAE,eAAe,CAAA;CAAE,CA4DzC;AA8BD,QAAA,MAAM,6BAA6B;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAiCR,CAAC;AAE5B,MAAM,MAAM,gBAAgB,GAAG,MAAM,OAAO,6BAA6B,CAAC"}