@sjcrh/proteinpaint-client 2.224.2 → 2.226.0

package/dist/AggMatrixInput-5GC33U5A.js

@@ -1,402 +0,0 @@
-import {
-  validatePlotConfig
-} from "./chunk-C4YACFGH.js";
-import {
-  PlotBase,
-  appInit,
-  capitalizeFirstLetter,
-  formatHeaderText
-} from "./chunk-ZIMAIUZD.js";
-import "./chunk-HJ6L54YS.js";
-import "./chunk-AQSZLUDV.js";
-import "./chunk-CNFTQSNE.js";
-import "./chunk-BOQYGAYA.js";
-import "./chunk-TVJOSRCH.js";
-import {
-  icons
-} from "./chunk-3CIL7KH7.js";
-import "./chunk-T4XPCSLP.js";
-import "./chunk-ZUXXBQ7D.js";
-import "./chunk-W5J3LTYS.js";
-import "./chunk-ZUG4EY4T.js";
-import {
-  isNonDictionaryType
-} from "./chunk-5FD6NRGE.js";
-import "./chunk-R2H22S4J.js";
-import {
-  copyMerge,
-  getCompInit
-} from "./chunk-HBNB5TRH.js";
-import "./chunk-PF4DSFDR.js";
-import "./chunk-4OLM3KSB.js";
-import "./chunk-PWYMHUXY.js";
-import "./chunk-TLT4YIG3.js";
-import "./chunk-5R63Q5KH.js";
-import "./chunk-I6Y4O3RR.js";
-import "./chunk-Q5RDQNIT.js";
-import "./chunk-HS5PO5ZQ.js";
-
-// plots/aggMatrixInput/viewModel/AggMatrixInputViewModel.ts
-var AggMatrixInputViewModel = class {
-  constructor() {
-    this.state = {
-      availableMethods: [],
-      methodsStatus: "idle",
-      methodsError: ""
-    };
-    this.methodTermsKey = "";
-    this.methodRequestId = 0;
-  }
-  async updateAvailableMethods(config, vocabApi, signal) {
-    if (!this.hasTerms(config.rowSections) || !this.hasTerms(config.colSections)) {
-      this.methodRequestId++;
-      this.methodTermsKey = "";
-      this.state = { availableMethods: [], methodsStatus: "idle", methodsError: "" };
-      return;
-    }
-    const columns = this.toAxis(config.colSections || [], false);
-    const key = Object.values(columns).flatMap((terms) => terms.map((wrapper) => getTermSelectionKey(wrapper.term))).join("\n");
-    if (key == this.methodTermsKey && this.state.methodsStatus == "ready") return;
-    this.methodTermsKey = key;
-    this.state = { ...this.state, methodsStatus: "loading", methodsError: "" };
-    const requestId = ++this.methodRequestId;
-    try {
-      const response = await vocabApi.getAvailableAggregateMatrixMethods(columns, signal);
-      if (requestId != this.methodRequestId) return;
-      if (response?.error) throw new Error(response.error);
-      this.state = {
-        availableMethods: response?.availableMethods || [],
-        methodsStatus: "ready",
-        methodsError: ""
-      };
-    } catch (error) {
-      if (requestId != this.methodRequestId) return;
-      this.state = {
-        availableMethods: [],
-        methodsStatus: "error",
-        methodsError: error.message || String(error)
-      };
-    }
-  }
-  getSectionTermType(section) {
-    return section.termType || getTerm(section.terms[0])?.type;
-  }
-  getAggregateMatrixConfig(config) {
-    return {
-      chartType: "aggregateMatrix",
-      rows: this.toAxis(config.rowSections || []),
-      columns: this.toAxis(config.colSections || []),
-      settings: {
-        aggregateMatrix: {
-          sizeMethod: config.sizeMethod || "",
-          gradientMethod: config.gradientMethod || ""
-        }
-      }
-    };
-  }
-  getValidationError(config) {
-    for (const sections of [config.rowSections || [], config.colSections || []]) {
-      const names = sections.map((section) => (section.name || "").trim());
-      if (names.some((name) => !name)) return "Every section requires a name.";
-      if (new Set(names).size != names.length) return "Section names must be unique within each axis.";
-      for (const section of sections) {
-        if (!section.terms.length) continue;
-        const types = new Set(section.terms.map((item) => getTerm(item).type));
-        const termType = this.getSectionTermType(section);
-        if (types.size != 1 || !termType || !types.has(termType)) return "Every section must contain exactly one term type.";
-        if (!isNonDictionaryType(termType) && section.terms.length != 1) {
-          return "Dictionary sections can contain only one term.";
-        }
-      }
-    }
-    if (this.state.methodsError) return `Unable to load aggregate methods: ${this.state.methodsError}`;
-    if (this.hasTerms(config.rowSections) && this.hasTerms(config.colSections)) {
-      if (this.state.methodsStatus != "ready") return "Loading compatible aggregate methods.";
-      if (this.state.availableMethods.length < 2) return "Selected column terms do not share at least two aggregate methods.";
-      const availableIds = new Set(this.state.availableMethods.map((method) => method.id));
-      if (config.sizeMethod && !availableIds.has(config.sizeMethod)) return "The selected size method is not compatible.";
-      if (config.gradientMethod && !availableIds.has(config.gradientMethod)) return "The selected gradient method is not compatible.";
-    }
-    try {
-      validatePlotConfig(this.getAggregateMatrixConfig(config));
-      return "";
-    } catch (error) {
-      return error.message || String(error);
-    }
-  }
-  hasTerms(sections) {
-    return sections?.some((section) => section.terms?.length) === true;
-  }
-  toAxis(sections, cloneTerms = true) {
-    return Object.fromEntries(
-      sections.map((section) => [
-        section.name.trim(),
-        section.terms.map((item) => cloneTerms ? structuredClone(item) : item)
-      ])
-    );
-  }
-};
-function getTerm(item) {
-  return item?.term || item;
-}
-function getTermSelectionKey(term) {
-  return `${term.type}\0${term.assay || ""}\0${term.memberId || ""}\0${term.id || term.gene || term.name}`;
-}
-
-// plots/aggMatrixInput/AggMatrixInput.ts
-var chartType = "aggMatrixInput";
-var AggMatrixInput = class _AggMatrixInput extends PlotBase {
-  constructor(opts, api) {
-    super(opts, api);
-    this.startOpt = "-- Select --";
-    this.nextSectionViewId = 0;
-    this.sectionViews = /* @__PURE__ */ new Map();
-    this.viewModel = new AggMatrixInputViewModel();
-    this.type = _AggMatrixInput.type;
-    if (opts.header) formatHeaderText({
-      header: opts.header,
-      chartType: "aggregate matrix"
-    });
-  }
-  static {
-    this.type = chartType;
-  }
-  getState(appState) {
-    const config = appState.plots.find((plot) => plot.id === this.id);
-    if (!config) throw new Error(`No plot with id='${this.id}' found`);
-    return { config, activeCohort: appState.activeCohort };
-  }
-  async init() {
-    const wrapper = this.opts.holder.append("div").style("padding", "10px").attr("data-testid", "sjpp-agg-matrix-input-wrapper");
-    const axisWrapper = wrapper.append("div").style("display", "grid").style("grid-template-columns", "repeat(auto-fit, minmax(320px, 1fr))").style("gap", "12px").style("margin-bottom", "10px");
-    this.dom.sectionHolders = {};
-    for (const [type, label] of [
-      ["row", "Row"],
-      ["column", "Column"]
-    ]) {
-      const axis = axisWrapper.append("div");
-      const header = axis.append("div").style("border-bottom", "0.5px solid #ddd").style("padding", "5px");
-      header.append("span").style("margin-right", "5px").text(`${label} sections:`);
-      header.append("button").attr("type", "button").attr("data-testid", "sjpp-agg-matrix-add-section-btn").style("border", "none").style("border-radius", "12px").style("padding", "6px 10px").style("background-color", "#cfe2f3").text(`Add ${type} section`).on("click", () => this.addSection(type));
-      this.dom.sectionHolders[type] = axis.append("div");
-    }
-    this.dom.methodsHolder = wrapper.append("div").style("display", "none");
-    this.dom.methodSelects = {};
-    for (const method of ["size", "gradient"]) {
-      const methodKey = `${method}Method`;
-      const methodWrapper = this.dom.methodsHolder.append("div").style("margin", "5px").style("display", "inline-flex").style("align-items", "center");
-      methodWrapper.append("label").attr("for", `sjpp-agg-matrix-${method}-method-select`).style("margin-right", "5px").text(`${capitalizeFirstLetter(method)} method:`);
-      this.dom.methodSelects[methodKey] = methodWrapper.append("select").attr("id", `sjpp-agg-matrix-${method}-method-select`).attr("name", `sjpp-agg-matrix-${method}-method-select`).on("change", (event) => {
-        this.editConfig({ [methodKey]: event.target.value === this.startOpt ? "" : event.target.value });
-      });
-    }
-    const submitWrapper = wrapper.append("div").style("margin-top", "12px");
-    this.dom.submit = submitWrapper.append("button").attr("data-testid", "sjpp-agg-matrix-submit-btn").attr("type", "button").property("disabled", true).style("border", "none").style("border-radius", "20px").style("padding", "5px 10px").style("font-size", "0.9em").text("Submit").on("click", () => this.submit());
-    this.dom.validationMessage = submitWrapper.append("div").attr("role", "status").style("color", "#b33").style("font-size", "0.9em").style("margin-top", "6px");
-  }
-  async main() {
-    this.config = this.state.config;
-    await this.renderSections("row", this.config.rowSections || []);
-    await this.renderSections("column", this.config.colSections || []);
-    this.dom.methodsHolder.style("display", "none");
-    await this.viewModel.updateAvailableMethods(this.config, this.vocabApi, this.api?.getAbortSignal());
-    if (this.viewModel.state.methodsStatus == "ready") {
-      this.renderMethodSelects();
-      this.dom.methodsHolder.style("display", "");
-    }
-    const error = this.viewModel.getValidationError(this.config);
-    const enabled = !error;
-    this.dom.submit.property("disabled", !enabled).style("cursor", enabled ? "pointer" : "default");
-    this.dom.validationMessage.text(error || "");
-  }
-  renderMethodSelects() {
-    for (const methodKey of ["sizeMethod", "gradientMethod"]) {
-      const otherMethod = methodKey == "sizeMethod" ? this.config.gradientMethod : this.config.sizeMethod;
-      this.dom.methodSelects[methodKey].selectAll("option").data([{ id: this.startOpt, label: this.startOpt }, ...this.viewModel.state.availableMethods], (method) => method.id).join("option").attr("value", (method) => method.id).property("disabled", (method) => method.id != this.startOpt && method.id == otherMethod).text((method) => method.label);
-      this.dom.methodSelects[methodKey].property("value", this.config[methodKey] || this.startOpt);
-    }
-  }
-  async renderSections(type, sections) {
-    const holder = this.dom.sectionHolders[type];
-    for (const key of this.sectionViews.keys()) {
-      const idx = Number(key.slice(type.length + 1));
-      if (key.startsWith(`${type}:`) && idx >= sections.length) {
-        this.destroySectionView(type, idx);
-      }
-    }
-    for (const [idx, section] of sections.entries()) {
-      const key = `${type}:${idx}`;
-      let view = this.sectionViews.get(key);
-      if (!view) {
-        view = await this.createSectionView(holder, type, idx, section);
-        this.sectionViews.set(key, view);
-      }
-      const hasName = !!(section.name || "").trim();
-      const termType = this.viewModel.getSectionTermType(section);
-      const isDictionary = !!termType && !isNonDictionaryType(termType);
-      view.nameLabel.style("display", isDictionary ? "none" : "");
-      view.nameInput.property("value", section.name).attr("aria-invalid", hasName ? null : "true").attr("title", hasName ? null : "A section name is required").style("border-color", hasName ? null : "#c33").style("display", isDictionary ? "none" : "");
-      view.displayName.style("display", isDictionary ? "" : "none").text(section.name);
-      view.editButton.style("display", isDictionary ? "" : "none");
-      view.holder.select('[data-testid="sjpp-agg-matrix-section-term-list"]').selectAll("div").data(section.terms || [], (item) => getTermSelectionKey(getTerm(item))).join("div").attr("data-testid", "sjpp-agg-matrix-section-term").style("margin", "5px").text((term) => term.term?.name || term.name || term.term?.id || term.id);
-      view.termsHolder.style("display", isDictionary ? "none" : "");
-      holder.node().appendChild(view.holder.node());
-    }
-  }
-  async createSectionView(holder, type, idx, section) {
-    const sectionHolder = holder.append("div").attr("data-testid", `sjpp-agg-matrix-${type}-section`).style("margin", "10px 0").style("padding", "10px").style("border", "1px solid #eee").style("border-radius", "5px");
-    const header = sectionHolder.append("div").style("display", "flex").style("align-items", "center").style("gap", "5px");
-    const nameId = `sjpp-agg-matrix-${type}-section-name-${this.nextSectionViewId++}`;
-    const nameLabel = header.append("label").attr("for", nameId).text("Section name *:");
-    const nameInput = header.append("input").attr("id", nameId).attr("data-testid", "sjpp-agg-matrix-section-name-input").attr("type", "text").attr("required", true).attr("aria-required", "true").attr("placeholder", "Required").on("change", (event) => this.updateSection(type, idx, { name: event.target.value }));
-    const displayName = header.append("strong").style("display", "none");
-    const editButton = header.append("button").attr("type", "button").attr("data-testid", "sjpp-agg-matrix-edit-section-btn").attr("aria-label", `Edit ${type} section`).style("display", "none").style("border", "none").style("background", "transparent").style("padding", "3px");
-    icons.pencil(editButton, {
-      title: `Edit ${type} section`,
-      handler: () => this.editSection(type, idx)
-    });
-    header.append("button").attr("type", "button").attr("data-testid", "sjpp-agg-matrix-remove-section-btn").attr("aria-label", `Remove ${type} section`).text("\xD7").on("click", () => this.removeSection(type, idx));
-    sectionHolder.append("div").attr("data-testid", "sjpp-agg-matrix-section-term-list").style("margin-left", "10px");
-    const termsHolder = sectionHolder.append("div").attr("data-testid", "sjpp-agg-matrix-section-terms");
-    const view = {
-      holder: sectionHolder,
-      nameLabel,
-      nameInput,
-      displayName,
-      editButton,
-      termsHolder
-    };
-    view.termdb = await appInit({
-      holder: termsHolder,
-      vocabApi: this.app.vocabApi,
-      state: {
-        activeCohort: this.state.activeCohort,
-        selectedTerms: [],
-        allowedTermTypes: this.viewModel.getSectionTermType(section) ? [this.viewModel.getSectionTermType(section)] : void 0,
-        nav: { header_mode: "search_only" },
-        tree: { usecase: { target: "aggregateMatrix" } }
-      },
-      tree: { click_term: (term) => this.selectSectionTerm(type, idx, term, nameInput) }
-    });
-    return view;
-  }
-  addSection(type) {
-    const key = type === "row" ? "rowSections" : "colSections";
-    const sections = structuredClone(this.config[key] || []);
-    sections.push({ name: "", termType: void 0, terms: [] });
-    this.editConfig({ [key]: sections });
-  }
-  selectSectionTerm(type, idx, selected, nameInput) {
-    const key = type === "row" ? "rowSections" : "colSections";
-    const section = this.config[key]?.[idx];
-    if (!section) return;
-    const selectedItems = Array.isArray(selected) ? selected : [selected];
-    const selectedTerms = selectedItems.map(getTerm);
-    if (!selectedTerms.length) return;
-    if (selectedTerms.some((term) => !term?.type)) throw new Error("Selected term has no type");
-    const selectedType = selectedTerms[0].type;
-    if (selectedTerms.some((term) => term.type != selectedType)) {
-      this.dom.validationMessage.text("A section can only contain one term type.");
-      return;
-    }
-    const sectionTermType = this.viewModel.getSectionTermType(section);
-    if (sectionTermType && sectionTermType != selectedType) {
-      this.dom.validationMessage.text(`A section can only contain ${sectionTermType} terms.`);
-      return;
-    }
-    if (!isNonDictionaryType(selectedType)) {
-      const term = selectedTerms[0];
-      this.destroySectionView(type, idx);
-      this.updateSection(type, idx, {
-        name: term.name || term.id,
-        termType: term.type,
-        terms: [selectedItems[0]]
-      });
-      return;
-    }
-    const name = nameInput.property("value").trim();
-    if (!name) {
-      nameInput.node().reportValidity();
-      return;
-    }
-    const terms = [...section.terms || []];
-    const termKeys = new Set(terms.map((item) => getTermSelectionKey(getTerm(item))));
-    for (const [index, term] of selectedTerms.entries()) {
-      const termKey = getTermSelectionKey(term);
-      if (termKeys.has(termKey)) continue;
-      termKeys.add(termKey);
-      terms.push(selectedItems[index]);
-    }
-    this.destroySectionView(type, idx);
-    this.updateSection(type, idx, { name, termType: selectedType, terms });
-  }
-  updateSection(type, idx, edits) {
-    const key = type === "row" ? "rowSections" : "colSections";
-    const sections = structuredClone(this.config[key] || []);
-    const section = sections[idx];
-    if (!section) return;
-    Object.assign(section, edits);
-    this.editConfig({ [key]: sections });
-  }
-  editSection(type, idx) {
-    this.destroySectionView(type, idx);
-    this.updateSection(type, idx, { name: "", termType: void 0, terms: [] });
-  }
-  destroySectionView(type, idx) {
-    const key = `${type}:${idx}`;
-    const view = this.sectionViews.get(key);
-    if (!view) return;
-    view.termdb?.destroy?.();
-    view.holder.remove();
-    this.sectionViews.delete(key);
-  }
-  removeSection(type, idx) {
-    const key = type === "row" ? "rowSections" : "colSections";
-    const sections = structuredClone(this.config[key] || []);
-    sections.splice(idx, 1);
-    this.destroySectionViews(type);
-    this.editConfig({ [key]: sections });
-  }
-  destroySectionViews(type) {
-    for (const [key, view] of this.sectionViews) {
-      if (!key.startsWith(`${type}:`)) continue;
-      view.termdb?.destroy?.();
-      view.holder.remove();
-      this.sectionViews.delete(key);
-    }
-  }
-  editConfig(config) {
-    this.app.dispatch({ type: "plot_edit", id: this.id, config });
-  }
-  submit() {
-    const config = this.viewModel.getAggregateMatrixConfig(this.config);
-    validatePlotConfig(config);
-    this.app.dispatch({
-      type: "app_refresh",
-      subactions: [
-        {
-          type: "plot_create",
-          config
-        },
-        { type: "plot_delete", id: this.id }
-      ]
-    });
-  }
-};
-var AggMatrixInputInit = getCompInit(AggMatrixInput);
-var componentInit = AggMatrixInputInit;
-async function getPlotConfig(opts) {
-  const config = {
-    chartType,
-    hidePlotFilter: true,
-    rowSections: [],
-    colSections: []
-  };
-  return copyMerge(config, opts);
-}
-export {
-  AggMatrixInputInit,
-  componentInit,
-  getPlotConfig
-};
-//# sourceMappingURL=AggMatrixInput-5GC33U5A.js.map

package/dist/AggregateMatrix-CMJFO53B.js

@@ -1,37 +0,0 @@
-import {
-  AggregateMatrix,
-  aggMatrixInit,
-  componentInit,
-  getPlotConfig,
-  validatePlotConfig
-} from "./chunk-C4YACFGH.js";
-import "./chunk-ZIMAIUZD.js";
-import "./chunk-HJ6L54YS.js";
-import "./chunk-AQSZLUDV.js";
-import "./chunk-CNFTQSNE.js";
-import "./chunk-BOQYGAYA.js";
-import "./chunk-TVJOSRCH.js";
-import "./chunk-3CIL7KH7.js";
-import "./chunk-T4XPCSLP.js";
-import "./chunk-ZUXXBQ7D.js";
-import "./chunk-W5J3LTYS.js";
-import "./chunk-ZUG4EY4T.js";
-import "./chunk-5FD6NRGE.js";
-import "./chunk-R2H22S4J.js";
-import "./chunk-HBNB5TRH.js";
-import "./chunk-PF4DSFDR.js";
-import "./chunk-4OLM3KSB.js";
-import "./chunk-PWYMHUXY.js";
-import "./chunk-TLT4YIG3.js";
-import "./chunk-5R63Q5KH.js";
-import "./chunk-I6Y4O3RR.js";
-import "./chunk-Q5RDQNIT.js";
-import "./chunk-HS5PO5ZQ.js";
-export {
-  AggregateMatrix,
-  aggMatrixInit,
-  componentInit,
-  getPlotConfig,
-  validatePlotConfig
-};
-//# sourceMappingURL=AggregateMatrix-CMJFO53B.js.map