@morscherlab/mld-sdk 0.6.0

package/dist/components/SampleLegend.vue.js

@@ -0,0 +1,129 @@
+import { defineComponent, openBlock, createElementBlock, normalizeClass, Fragment, renderList, createElementVNode, normalizeStyle, toDisplayString, createCommentVNode } from "vue";
+const _hoisted_1 = ["aria-pressed", "onClick"];
+const _hoisted_2 = ["aria-label", "onClick"];
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "SampleLegend",
+  props: {
+    modelValue: { default: void 0 },
+    samples: { default: () => [] },
+    showCounts: { type: Boolean, default: true },
+    editable: { type: Boolean, default: false },
+    colorPalette: { default: () => [
+      "#3B82F6",
+      "#10B981",
+      "#EF4444",
+      "#F59E0B",
+      "#8B5CF6",
+      "#F97316",
+      "#06B6D4",
+      "#14B8A6",
+      "#6B7280"
+    ] },
+    size: { default: "md" },
+    orientation: { default: "vertical" }
+  },
+  emits: ["update:modelValue", "sample-click", "sample-add", "sample-remove", "color-change"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    function getSampleColor(sample, index) {
+      return sample.color || props.colorPalette[index % props.colorPalette.length];
+    }
+    function handleSampleClick(sample) {
+      const newValue = props.modelValue === sample.id ? void 0 : sample.id;
+      emit("sample-click", sample);
+      emit("update:modelValue", newValue);
+    }
+    function handleRemove(event, sampleId) {
+      event.stopPropagation();
+      emit("sample-remove", sampleId);
+    }
+    function handleAdd() {
+      emit("sample-add");
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["mld-sample-legend", `mld-sample-legend--${__props.orientation}`]),
+        role: "list",
+        "aria-label": "Sample types"
+      }, [
+        (openBlock(true), createElementBlock(Fragment, null, renderList(__props.samples, (sample, index) => {
+          return openBlock(), createElementBlock("button", {
+            key: sample.id,
+            type: "button",
+            role: "listitem",
+            "aria-pressed": __props.modelValue === sample.id,
+            class: normalizeClass([
+              "mld-sample-legend__item",
+              `mld-sample-legend__item--${__props.size}`,
+              __props.modelValue === sample.id ? "mld-sample-legend__item--selected" : ""
+            ]),
+            onClick: ($event) => handleSampleClick(sample)
+          }, [
+            createElementVNode("span", {
+              class: normalizeClass(["mld-sample-legend__swatch", `mld-sample-legend__swatch--${__props.size}`]),
+              style: normalizeStyle({ backgroundColor: getSampleColor(sample, index) }),
+              "aria-hidden": true
+            }, null, 6),
+            createElementVNode("span", {
+              class: normalizeClass(["mld-sample-legend__name", `mld-sample-legend__name--${__props.size}`])
+            }, toDisplayString(sample.name), 3),
+            __props.showCounts && sample.count !== void 0 ? (openBlock(), createElementBlock("span", {
+              key: 0,
+              class: normalizeClass(["mld-sample-legend__count", `mld-sample-legend__count--${__props.size}`])
+            }, toDisplayString(sample.count), 3)) : createCommentVNode("", true),
+            __props.editable ? (openBlock(), createElementBlock("button", {
+              key: 1,
+              type: "button",
+              class: "mld-sample-legend__remove",
+              "aria-label": `Remove ${sample.name}`,
+              onClick: ($event) => handleRemove($event, sample.id)
+            }, [..._cache[0] || (_cache[0] = [
+              createElementVNode("svg", {
+                class: "mld-sample-legend__remove-icon",
+                fill: "none",
+                stroke: "currentColor",
+                viewBox: "0 0 24 24"
+              }, [
+                createElementVNode("path", {
+                  "stroke-linecap": "round",
+                  "stroke-linejoin": "round",
+                  "stroke-width": "2",
+                  d: "M6 18L18 6M6 6l12 12"
+                })
+              ], -1)
+            ])], 8, _hoisted_2)) : createCommentVNode("", true)
+          ], 10, _hoisted_1);
+        }), 128)),
+        __props.editable ? (openBlock(), createElementBlock("button", {
+          key: 0,
+          type: "button",
+          class: normalizeClass(["mld-sample-legend__add", `mld-sample-legend__add--${__props.size}`]),
+          "aria-label": "Add sample type",
+          onClick: handleAdd
+        }, [
+          (openBlock(), createElementBlock("svg", {
+            class: normalizeClass(`mld-sample-legend__add-icon--${__props.size}`),
+            fill: "none",
+            stroke: "currentColor",
+            viewBox: "0 0 24 24"
+          }, [..._cache[1] || (_cache[1] = [
+            createElementVNode("path", {
+              "stroke-linecap": "round",
+              "stroke-linejoin": "round",
+              "stroke-width": "2",
+              d: "M12 4v16m8-8H4"
+            }, null, -1)
+          ])], 2)),
+          createElementVNode("span", {
+            class: normalizeClass(`mld-sample-legend__add-text--${__props.size}`)
+          }, "Add", 2)
+        ], 2)) : createCommentVNode("", true)
+      ], 2);
+    };
+  }
+});
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=SampleLegend.vue.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SampleLegend.vue.js","sources":["../../src/components/SampleLegend.vue"],"sourcesContent":["<script setup lang=\"ts\">\nimport type { SampleType } from '../types'\n\ninterface Props {\n  modelValue?: string\n  samples: SampleType[]\n  showCounts?: boolean\n  editable?: boolean\n  colorPalette?: string[]\n  size?: 'sm' | 'md' | 'lg'\n  orientation?: 'vertical' | 'horizontal'\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  modelValue: undefined,\n  samples: () => [],\n  showCounts: true,\n  editable: false,\n  colorPalette: () => [\n    '#3B82F6', '#10B981', '#EF4444', '#F59E0B', '#8B5CF6',\n    '#F97316', '#06B6D4', '#14B8A6', '#6B7280',\n  ],\n  size: 'md',\n  orientation: 'vertical',\n})\n\nconst emit = defineEmits<{\n  'update:modelValue': [sampleId: string | undefined]\n  'sample-click': [sample: SampleType]\n  'sample-add': []\n  'sample-remove': [sampleId: string]\n  'color-change': [sampleId: string, color: string]\n}>()\n\n\nfunction getSampleColor(sample: SampleType, index: number): string {\n  return sample.color || props.colorPalette[index % props.colorPalette.length]\n}\n\nfunction handleSampleClick(sample: SampleType) {\n  const newValue = props.modelValue === sample.id ? undefined : sample.id\n  emit('sample-click', sample)\n  emit('update:modelValue', newValue)\n}\n\nfunction handleRemove(event: Event, sampleId: string) {\n  event.stopPropagation()\n  emit('sample-remove', sampleId)\n}\n\nfunction handleAdd() {\n  emit('sample-add')\n}\n</script>\n\n<template>\n  <div :class=\"['mld-sample-legend', `mld-sample-legend--${orientation}`]\" role=\"list\" aria-label=\"Sample types\">\n    <button\n      v-for=\"(sample, index) in samples\"\n      :key=\"sample.id\"\n      type=\"button\"\n      role=\"listitem\"\n      :aria-pressed=\"modelValue === sample.id\"\n      :class=\"[\n        'mld-sample-legend__item',\n        `mld-sample-legend__item--${size}`,\n        modelValue === sample.id ? 'mld-sample-legend__item--selected' : '',\n      ]\"\n      @click=\"handleSampleClick(sample)\"\n    >\n      <span\n        :class=\"['mld-sample-legend__swatch', `mld-sample-legend__swatch--${size}`]\"\n        :style=\"{ backgroundColor: getSampleColor(sample, index) }\"\n        :aria-hidden=\"true\"\n      />\n\n      <span :class=\"['mld-sample-legend__name', `mld-sample-legend__name--${size}`]\">\n        {{ sample.name }}\n      </span>\n\n      <span\n        v-if=\"showCounts && sample.count !== undefined\"\n        :class=\"['mld-sample-legend__count', `mld-sample-legend__count--${size}`]\"\n      >\n        {{ sample.count }}\n      </span>\n\n      <button\n        v-if=\"editable\"\n        type=\"button\"\n        class=\"mld-sample-legend__remove\"\n        :aria-label=\"`Remove ${sample.name}`\"\n        @click=\"handleRemove($event, sample.id)\"\n      >\n        <svg class=\"mld-sample-legend__remove-icon\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n          <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M6 18L18 6M6 6l12 12\" />\n        </svg>\n      </button>\n    </button>\n\n    <button\n      v-if=\"editable\"\n      type=\"button\"\n      :class=\"['mld-sample-legend__add', `mld-sample-legend__add--${size}`]\"\n      aria-label=\"Add sample type\"\n      @click=\"handleAdd\"\n    >\n      <svg :class=\"`mld-sample-legend__add-icon--${size}`\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n        <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" d=\"M12 4v16m8-8H4\" />\n      </svg>\n      <span :class=\"`mld-sample-legend__add-text--${size}`\">Add</span>\n    </button>\n  </div>\n</template>\n\n<style>\n@import '../styles/components/sample-legend.css';\n</style>\n"],"names":["_createElementBlock","_openBlock","_Fragment","_renderList","_normalizeClass","_createElementVNode","_normalizeStyle","_toDisplayString"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAaA,UAAM,QAAQ;AAad,UAAM,OAAO;AASb,aAAS,eAAe,QAAoB,OAAuB;AACjE,aAAO,OAAO,SAAS,MAAM,aAAa,QAAQ,MAAM,aAAa,MAAM;AAAA,IAC7E;AAEA,aAAS,kBAAkB,QAAoB;AAC7C,YAAM,WAAW,MAAM,eAAe,OAAO,KAAK,SAAY,OAAO;AACrE,WAAK,gBAAgB,MAAM;AAC3B,WAAK,qBAAqB,QAAQ;AAAA,IACpC;AAEA,aAAS,aAAa,OAAc,UAAkB;AACpD,YAAM,gBAAA;AACN,WAAK,iBAAiB,QAAQ;AAAA,IAChC;AAEA,aAAS,YAAY;AACnB,WAAK,YAAY;AAAA,IACnB;;0BAIEA,mBAwDM,OAAA;AAAA,QAxDA,kEAAmD,QAAA,WAAW,EAAA,CAAA;AAAA,QAAK,MAAK;AAAA,QAAO,cAAW;AAAA,MAAA;SAC9FC,UAAA,IAAA,GAAAD,mBAyCSE,UAAA,MAAAC,WAxCmB,QAAA,SAAO,CAAzB,QAAQ,UAAK;8BADvBH,mBAyCS,UAAA;AAAA,YAvCN,KAAK,OAAO;AAAA,YACb,MAAK;AAAA,YACL,MAAK;AAAA,YACJ,gBAAc,QAAA,eAAe,OAAO;AAAA,YACpC,OAAKI,eAAA;AAAA;0CAA2E,QAAA,IAAI;AAAA,cAAY,QAAA,eAAe,OAAO,KAAE,sCAAA;AAAA,YAAA;YAKxH,SAAK,CAAA,WAAE,kBAAkB,MAAM;AAAA,UAAA;YAEhCC,mBAIE,QAAA;AAAA,cAHC,kFAAmE,QAAA,IAAI,EAAA,CAAA;AAAA,cACvE,OAAKC,eAAA,EAAA,iBAAqB,eAAe,QAAQ,KAAK,GAAA;AAAA,cACtD,eAAa;AAAA,YAAA;YAGhBD,mBAEO,QAAA;AAAA,cAFA,8EAA+D,QAAA,IAAI,EAAA,CAAA;AAAA,YAAA,GACrEE,gBAAA,OAAO,IAAI,GAAA,CAAA;AAAA,YAIR,QAAA,cAAc,OAAO,UAAU,uBADvCP,mBAKO,QAAA;AAAA;cAHJ,gFAAiE,QAAA,IAAI,EAAA,CAAA;AAAA,YAAA,GAEnEO,gBAAA,OAAO,KAAK,GAAA,CAAA;YAIT,QAAA,yBADRP,mBAUS,UAAA;AAAA;cARP,MAAK;AAAA,cACL,OAAM;AAAA,cACL,cAAU,UAAY,OAAO,IAAI;AAAA,cACjC,qBAAO,aAAa,QAAQ,OAAO,EAAE;AAAA,YAAA;cAEtCK,mBAEM,OAAA;AAAA,gBAFD,OAAM;AAAA,gBAAiC,MAAK;AAAA,gBAAO,QAAO;AAAA,gBAAe,SAAQ;AAAA,cAAA;gBACpFA,mBAAiG,QAAA;AAAA,kBAA3F,kBAAe;AAAA,kBAAQ,mBAAgB;AAAA,kBAAQ,gBAAa;AAAA,kBAAI,GAAE;AAAA,gBAAA;;;;;QAMtE,QAAA,yBADRL,mBAWS,UAAA;AAAA;UATP,MAAK;AAAA,UACJ,4EAA6D,QAAA,IAAI,EAAA,CAAA;AAAA,UAClE,cAAW;AAAA,UACV,SAAO;AAAA,QAAA;wBAERA,mBAEM,OAAA;AAAA,YAFA,sDAAuC,QAAA,IAAI,EAAA;AAAA,YAAI,MAAK;AAAA,YAAO,QAAO;AAAA,YAAe,SAAQ;AAAA,UAAA;YAC7FK,mBAA2F,QAAA;AAAA,cAArF,kBAAe;AAAA,cAAQ,mBAAgB;AAAA,cAAQ,gBAAa;AAAA,cAAI,GAAE;AAAA,YAAA;;UAE1EA,mBAAgE,QAAA;AAAA,YAAzD,sDAAuC,QAAA,IAAI,EAAA;AAAA,UAAA,GAAI,OAAG,CAAA;AAAA,QAAA;;;;;"}

package/dist/components/SampleLegend.vue3.js

@@ -0,0 +1,6 @@
+import _sfc_main from "./SampleLegend.vue.js";
+/* empty css                  */
+export {
+  _sfc_main as default
+};
+//# sourceMappingURL=SampleLegend.vue3.js.map

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

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

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

@@ -0,0 +1,29 @@
+import { SampleGroup } from '../types';
+interface Props {
+    samples: string[];
+    modelValue: string[];
+    groups?: SampleGroup[];
+    enableGrouping?: boolean;
+    enableAutoGroup?: boolean;
+    enableMetadataGroup?: boolean;
+}
+declare const _default: import('vue').DefineComponent<Props, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {
+    "update:modelValue": (samples: string[]) => any;
+    "update:groups": (groups: SampleGroup[]) => any;
+    autoGroup: (level: number) => any;
+    metadataGroup: (mapping: Record<string, string[]>) => any;
+}, string, import('vue').PublicProps, Readonly<Props> & Readonly<{
+    "onUpdate:modelValue"?: ((samples: string[]) => any) | undefined;
+    "onUpdate:groups"?: ((groups: SampleGroup[]) => any) | undefined;
+    onAutoGroup?: ((level: number) => any) | undefined;
+    onMetadataGroup?: ((mapping: Record<string, string[]>) => any) | undefined;
+}>, {
+    groups: SampleGroup[];
+    enableGrouping: boolean;
+    enableAutoGroup: boolean;
+    enableMetadataGroup: boolean;
+}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {
+    popoverRef: HTMLDivElement;
+    colorPickerInput: HTMLInputElement;
+}, HTMLDivElement>;
+export default _default;