@buildcanada/charts 0.3.7 → 0.3.8

package/dist/explorer/ExplorerControls.js

@@ -0,0 +1,167 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+import { Component } from "react";
+import { Dropdown } from "../grapher/index.js";
+import { bind } from "../utils/index.js";
+import {
+  ExplorerControlType
+} from "./ExplorerConstants.js";
+import { GridBoolean } from "./gridLang/GridLangConstants.js";
+import classNames from "classnames";
+import * as R from "remeda";
+const AVAILABLE_OPTION_CLASS = "AvailableOption";
+const UNAVAILABLE_OPTION_CLASS = "UnavailableOption";
+const SELECTED_OPTION_CLASS = "SelectedOption";
+const EXPLORER_DROPDOWN_CLASS = "ExplorerDropdown";
+const HIDDEN_CONTROL_HEADER_CLASS = "HiddenControlHeader";
+class ExplorerControlBar extends Component {
+  render() {
+    const { isMobile, showControls, closeControls } = this.props;
+    const mobileCloseButton = isMobile ? /* @__PURE__ */ React.createElement(
+      "a",
+      {
+        className: "btn btn-primary mobile-button",
+        onClick: closeControls
+      },
+      "Done"
+    ) : void 0;
+    const showMobileControls = isMobile && showControls;
+    return /* @__PURE__ */ React.createElement(
+      "form",
+      {
+        className: classNames(
+          "ExplorerControlBar",
+          showMobileControls ? `show-controls-popup` : isMobile ? `hide-controls-popup` : false
+        )
+      },
+      this.props.children,
+      mobileCloseButton
+    );
+  }
+}
+const ExplorerDropdown = (props) => {
+  const { options, value, isMobile, onChange, ariaLabel } = props;
+  const isSearchable = !isMobile && options.length > 10;
+  const dropdownOptions = options.map((option) => ({
+    label: option.label,
+    value: option.value
+  }));
+  const selectedOption = dropdownOptions.find((option) => option.value === value?.value) ?? null;
+  const isDisabled = options.length < 2;
+  return /* @__PURE__ */ React.createElement(
+    Dropdown,
+    {
+      className: EXPLORER_DROPDOWN_CLASS,
+      options: dropdownOptions,
+      value: selectedOption,
+      onChange: (option) => {
+        if (option) onChange(option.value);
+      },
+      isDisabled,
+      isSearchable,
+      placeholder: "-",
+      "aria-label": ariaLabel
+    }
+  );
+};
+class ExplorerControlPanel extends Component {
+  renderCheckboxOrRadio(option, index) {
+    const { explorerSlug, choice } = this.props;
+    const { title, type, value } = choice;
+    const { available, label, checked } = option;
+    const isCheckbox = type === ExplorerControlType.Checkbox;
+    const onChangeValue = isCheckbox ? checked ? GridBoolean.false : GridBoolean.true : option.value;
+    const currentValue = isCheckbox ? checked ? GridBoolean.true : GridBoolean.false : value;
+    return /* @__PURE__ */ React.createElement("div", { key: index, className: "ControlOption" }, /* @__PURE__ */ React.createElement(
+      "label",
+      {
+        className: classNames(
+          {
+            [SELECTED_OPTION_CLASS]: checked
+          },
+          available ? AVAILABLE_OPTION_CLASS : UNAVAILABLE_OPTION_CLASS
+        )
+      },
+      /* @__PURE__ */ React.createElement(
+        "input",
+        {
+          onChange: () => this.customOnChange(onChangeValue),
+          type: isCheckbox ? "checkbox" : "radio",
+          disabled: !available,
+          name: title,
+          checked,
+          value: currentValue,
+          "data-track-note": `${explorerSlug ?? "explorer"}_click_${title.toLowerCase()}`
+        }
+      ),
+      " ",
+      label
+    ));
+  }
+  get options() {
+    return this.props.choice.options ?? [];
+  }
+  renderDropdown() {
+    const options = this.options.filter((option) => option.available).map((option) => {
+      return {
+        label: option.label,
+        value: option.value
+      };
+    });
+    const value = options.find(
+      (option) => option.value === this.props.choice.value
+    ) ?? { label: "-", value: "-" };
+    return /* @__PURE__ */ React.createElement(
+      ExplorerDropdown,
+      {
+        options,
+        value,
+        isMobile: this.props.isMobile,
+        onChange: this.customOnChange,
+        ariaLabel: this.props.choice.title
+      }
+    );
+  }
+  customOnChange(value) {
+    this.props.onChange?.(value);
+  }
+  renderColumn(key, hideTitle, options) {
+    const { title, type, displayTitle } = this.props.choice;
+    return /* @__PURE__ */ React.createElement("div", { key, className: "ExplorerControl" }, /* @__PURE__ */ React.createElement(
+      "div",
+      {
+        className: classNames("ControlHeader", {
+          [HIDDEN_CONTROL_HEADER_CLASS]: hideTitle === true
+        })
+      },
+      displayTitle ?? title
+    ), type === ExplorerControlType.Dropdown ? this.renderDropdown() : (options ?? this.options).map(
+      (option, index) => this.renderCheckboxOrRadio(option, index)
+    ));
+  }
+  render() {
+    const { choice } = this.props;
+    const { title, type } = choice;
+    const { options } = this;
+    if (type === ExplorerControlType.Radio && options.length > 4)
+      return R.chunk(options, 3).map(
+        (optionsGroup, column) => this.renderColumn(`${title}${column}`, column > 0, optionsGroup)
+      );
+    return this.renderColumn(title, type === ExplorerControlType.Checkbox);
+  }
+}
+__decorateClass([
+  bind
+], ExplorerControlPanel.prototype, "customOnChange", 1);
+export {
+  ExplorerControlBar,
+  ExplorerControlPanel
+};

package/dist/explorer/ExplorerControls.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/explorer/ExplorerControls.tsx"],
+  "sourcesContent": ["import { Component } from \"react\"\nimport { Dropdown } from \"../grapher/index.js\"\nimport { bind } from \"../utils/index.js\"\nimport {\n    ExplorerControlType,\n    ExplorerChoiceOption,\n    ExplorerChoice,\n} from \"./ExplorerConstants.js\"\nimport { GridBoolean } from \"./gridLang/GridLangConstants.js\"\nimport classNames from \"classnames\"\nimport * as R from \"remeda\"\n\nconst AVAILABLE_OPTION_CLASS = \"AvailableOption\"\nconst UNAVAILABLE_OPTION_CLASS = \"UnavailableOption\"\nconst SELECTED_OPTION_CLASS = \"SelectedOption\"\nconst EXPLORER_DROPDOWN_CLASS = \"ExplorerDropdown\"\nconst HIDDEN_CONTROL_HEADER_CLASS = \"HiddenControlHeader\"\n\nexport class ExplorerControlBar extends Component<{\n    isMobile?: boolean\n    showControls?: boolean\n    closeControls?: () => void\n    children: React.ReactNode\n}> {\n    override render() {\n        const { isMobile, showControls, closeControls } = this.props\n        const mobileCloseButton = isMobile ? (\n            <a\n                className=\"btn btn-primary mobile-button\"\n                onClick={closeControls}\n            >\n                Done\n            </a>\n        ) : undefined\n\n        const showMobileControls = isMobile && showControls\n        return (\n            <form\n                className={classNames(\n                    \"ExplorerControlBar\",\n                    showMobileControls\n                        ? `show-controls-popup`\n                        : isMobile\n                          ? `hide-controls-popup`\n                          : false\n                )}\n            >\n                {this.props.children}\n                {mobileCloseButton}\n            </form>\n        )\n    }\n}\n\ninterface ExplorerDropdownOption {\n    label: string\n    value: string\n}\n\nconst ExplorerDropdown = (props: {\n    options: ExplorerDropdownOption[]\n    value: ExplorerDropdownOption\n    isMobile: boolean\n    onChange: (option: string) => void\n    ariaLabel?: string\n}) => {\n    const { options, value, isMobile, onChange, ariaLabel } = props\n    const isSearchable = !isMobile && options.length > 10\n    const dropdownOptions = options.map((option) => ({\n        label: option.label,\n        value: option.value,\n    }))\n    const selectedOption =\n        dropdownOptions.find((option) => option.value === value?.value) ?? null\n    const isDisabled = options.length < 2\n\n    return (\n        <Dropdown\n            className={EXPLORER_DROPDOWN_CLASS}\n            options={dropdownOptions}\n            value={selectedOption}\n            onChange={(option) => {\n                if (option) onChange(option.value)\n            }}\n            isDisabled={isDisabled}\n            isSearchable={isSearchable}\n            placeholder=\"-\"\n            aria-label={ariaLabel}\n        />\n    )\n}\n\nexport class ExplorerControlPanel extends Component<{\n    choice: ExplorerChoice\n    explorerSlug?: string\n    onChange?: (value: string) => void\n    isMobile: boolean\n}> {\n    private renderCheckboxOrRadio(option: ExplorerChoiceOption, index: number) {\n        const { explorerSlug, choice } = this.props\n        const { title, type, value } = choice\n        const { available, label, checked } = option\n        const isCheckbox = type === ExplorerControlType.Checkbox\n        const onChangeValue = isCheckbox\n            ? checked\n                ? GridBoolean.false\n                : GridBoolean.true\n            : option.value\n        const currentValue = isCheckbox\n            ? checked\n                ? GridBoolean.true\n                : GridBoolean.false\n            : value\n\n        return (\n            <div key={index} className=\"ControlOption\">\n                <label\n                    className={classNames(\n                        {\n                            [SELECTED_OPTION_CLASS]: checked,\n                        },\n                        available\n                            ? AVAILABLE_OPTION_CLASS\n                            : UNAVAILABLE_OPTION_CLASS\n                    )}\n                >\n                    <input\n                        onChange={() => this.customOnChange(onChangeValue)}\n                        type={isCheckbox ? \"checkbox\" : \"radio\"}\n                        disabled={!available}\n                        name={title}\n                        checked={checked}\n                        value={currentValue}\n                        data-track-note={`${\n                            explorerSlug ?? \"explorer\"\n                        }_click_${title.toLowerCase()}`}\n                    />{\" \"}\n                    {label}\n                </label>\n            </div>\n        )\n    }\n\n    private get options() {\n        return this.props.choice.options ?? []\n    }\n\n    private renderDropdown() {\n        const options = this.options\n            .filter((option) => option.available)\n            .map((option) => {\n                return {\n                    label: option.label,\n                    value: option.value,\n                }\n            })\n        const value = options.find(\n            (option) => option.value === this.props.choice.value\n        ) ?? { label: \"-\", value: \"-\" }\n\n        return (\n            <ExplorerDropdown\n                options={options}\n                value={value}\n                isMobile={this.props.isMobile}\n                onChange={this.customOnChange}\n                ariaLabel={this.props.choice.title}\n            />\n        )\n    }\n\n    @bind private customOnChange(value: string) {\n        this.props.onChange?.(value)\n    }\n\n    private renderColumn(\n        key: string,\n        hideTitle: boolean,\n        options?: ExplorerChoiceOption[]\n    ) {\n        const { title, type, displayTitle } = this.props.choice\n        return (\n            <div key={key} className=\"ExplorerControl\">\n                <div\n                    className={classNames(\"ControlHeader\", {\n                        [HIDDEN_CONTROL_HEADER_CLASS]: hideTitle === true,\n                    })}\n                >\n                    {displayTitle ?? title}\n                </div>\n                {type === ExplorerControlType.Dropdown\n                    ? this.renderDropdown()\n                    : (options ?? this.options).map((option, index) =>\n                          this.renderCheckboxOrRadio(option, index)\n                      )}\n            </div>\n        )\n    }\n\n    override render() {\n        const { choice } = this.props\n        const { title, type } = choice\n        const { options } = this\n        if (type === ExplorerControlType.Radio && options.length > 4)\n            return R.chunk(options, 3).map((optionsGroup, column) =>\n                this.renderColumn(`${title}${column}`, column > 0, optionsGroup)\n            )\n        return this.renderColumn(title, type === ExplorerControlType.Checkbox)\n    }\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/explorer/ExplorerDecisionMatrix.d.ts

@@ -0,0 +1,59 @@
+import { CoreRow } from "../types/index.js";
+import { CoreTable } from "../core-table/index.js";
+import { ChoiceMap, ChoiceName, ChoiceValue, ExplorerChoice, ExplorerChoiceParams, ExplorerControlType } from "./ExplorerConstants.js";
+export declare class DecisionMatrix {
+    table: CoreTable;
+    currentParams: ExplorerChoiceParams;
+    constructor(delimited: string, hash?: string);
+    allDecisionsAsQueryParams(): ExplorerChoiceParams[];
+    get numRows(): number;
+    get requiredGrapherIds(): any[];
+    /**
+     * Unique variable IDs requiring partial Grapher config to be loaded.
+     * Extracts the first (primary) variable ID from the y-dimension of each
+     * decision matrix row.
+     */
+    get requiredVariableIds(): number[];
+    /** All variable IDs referenced in the explorer config */
+    get allVariableIds(): number[];
+    private static allColumnSlugsWithIndicatorIdsOrCatalogPaths;
+    get allColumnsWithIndicatorIdsOrCatalogPaths(): import("../core-table/CoreTableColumns.js").CoreColumn[];
+    get requiredCatalogPaths(): Set<string>;
+    get tableWithOriginalColumnNames(): CoreTable<CoreRow, import("../types/index.js").CoreColumnDef>;
+    choiceNameToControlTypeMap: Map<ChoiceName, ExplorerControlType>;
+    hash: string;
+    toConstrainedOptions(): ExplorerChoiceParams;
+    private get diffBetweenUserSettingsAndConstrained();
+    setValueCommand(choiceName: ChoiceName, value: ChoiceValue): void;
+    private _setValue;
+    setValuesFromChoiceParams(choiceParams?: ExplorerChoiceParams): this;
+    private get choiceNames();
+    private get allChoiceOptions();
+    get availableChoiceOptions(): ChoiceMap;
+    getChoiceParamsForRow(row: CoreRow): ExplorerChoiceParams;
+    private firstAvailableOptionForChoice;
+    /**
+     * Note: there is a rare bug in here + rowsWith when an author has a complex decision matrix. If the user vists a url
+     * with invalid options like Metric="Tests", Interval="Weekly", Aligned="false"
+     * we will return first match, which is B1, even though B2 is a better match.
+     *
+     * graphers
+     * title	Metric Radio	Interval Radio	Aligned Checkbox
+     * A1	Cases	Cumulative	true
+     * A2	Cases	Cumulative	false
+     * A3	Cases	Weekly	false
+     *
+     * B1	Tests	Cumulative	true
+     * B2	Tests	Cumulative	false
+     */
+    isOptionAvailable(choiceName: ChoiceName, option: ChoiceValue, currentState?: ExplorerChoiceParams): boolean;
+    private rowsWith;
+    get defaultSettings(): CoreRow;
+    private get firstMatch();
+    get selectedRowIndex(): number;
+    selectedRow: any;
+    private toControlOption;
+    get choicesWithAvailability(): ExplorerChoice[];
+    toString(): string;
+}
+//# sourceMappingURL=ExplorerDecisionMatrix.d.ts.map

package/dist/explorer/ExplorerDecisionMatrix.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExplorerDecisionMatrix.d.ts","sourceRoot":"","sources":["../../src/explorer/ExplorerDecisionMatrix.ts"],"names":[],"mappings":"AAQA,OAAO,EAAmB,OAAO,EAAE,MAAM,mBAAmB,CAAA;AAC5D,OAAO,EACH,SAAS,EAIZ,MAAM,wBAAwB,CAAA;AAE/B,OAAO,EACH,SAAS,EACT,UAAU,EACV,WAAW,EACX,cAAc,EAEd,oBAAoB,EACpB,mBAAmB,EAEtB,MAAM,wBAAwB,CAAA;AAkE/B,qBAAa,cAAc;IACvB,KAAK,EAAE,SAAS,CAAA;IAChB,aAAa,EAAE,oBAAoB,CAAK;gBAC5B,SAAS,EAAE,MAAM,EAAE,IAAI,SAAK;IA4BxC,yBAAyB,IAAI,oBAAoB,EAAE;IAUnD,IAAI,OAAO,WAEV;IAED,IAAI,kBAAkB,UAErB;IAED;;;;OAIG;IACH,IAAI,mBAAmB,aAQtB;IAED,yDAAyD;IACzD,IAAI,cAAc,aAUjB;IAED,OAAO,CAAC,MAAM,CAAC,4CAA4C,CAM1D;IAED,IAAI,wCAAwC,6DAM3C;IAED,IAAI,oBAAoB,IAAI,GAAG,CAAC,MAAM,CAAC,CAYtC;IAID,IAAI,4BAA4B,kEAU/B;IAED,0BAA0B,EAAE,GAAG,CAAC,UAAU,EAAE,mBAAmB,CAAC,CAAA;IAChE,IAAI,EAAE,MAAM,CAAA;IAEZ,oBAAoB,IAAI,oBAAoB;IAoC5C,OAAO,KAAK,qCAAqC,GAKhD;IAEa,eAAe,CAAC,UAAU,EAAE,UAAU,EAAE,KAAK,EAAE,WAAW;IA0B1D,OAAO,CAAC,SAAS;IAYjB,yBAAyB,CACnC,YAAY,GAAE,oBAAyB;IAgBjC,OAAO,KAAK,WAAW,GAEhC;IAES,OAAO,KAAK,gBAAgB,GAQrC;IAED,IAAc,sBAAsB,IAAI,SAAS,CAQhD;IAED,qBAAqB,CAAC,GAAG,EAAE,OAAO,GAAG,oBAAoB;IAQzD,OAAO,CAAC,6BAA6B;IASrC;;;;;;;;;;;;;OAaG;IACH,iBAAiB,CACb,UAAU,EAAE,UAAU,EACtB,MAAM,EAAE,WAAW,EACnB,YAAY,uBAAqB;IAYrC,OAAO,CAAC,QAAQ;IAahB,IAAI,eAAe,YAKlB;IAED,OAAO,KAAK,UAAU,GAIrB;IAED,IAAI,gBAAgB,IAAI,MAAM,CAI7B;IAED,WAAW,EAAE,GAAG,CAAK;IAErB,OAAO,CAAC,eAAe;IAmBvB,IAAc,uBAAuB,IAAI,cAAc,EAAE,CA6BxD;IAED,QAAQ;CAGX"}

package/dist/explorer/ExplorerDecisionMatrix.js

@@ -0,0 +1,369 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __decorateClass = (decorators, target, key, kind) => {
+  var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
+  for (var i = decorators.length - 1, decorator; i >= 0; i--)
+    if (decorator = decorators[i])
+      result = (kind ? decorator(target, key, result) : decorator(result)) || result;
+  if (kind && result) __defProp(target, key, result);
+  return result;
+};
+import * as _ from "lodash-es";
+import { observable, computed, action, makeObservable } from "mobx";
+import {
+  queryParamsToStr,
+  differenceObj,
+  trimObject,
+  parseIntOrUndefined
+} from "../utils/index.js";
+import { ColumnTypeNames } from "../types/index.js";
+import {
+  CoreTable,
+  detectDelimiter,
+  parseDelimited,
+  isCellEmpty
+} from "../core-table/index.js";
+import { GridBoolean } from "./gridLang/GridLangConstants.js";
+import {
+  ExplorerControlType,
+  ExplorerControlTypeRegex
+} from "./ExplorerConstants.js";
+import { trimAndParseObject } from "./ExplorerProgram.js";
+import { GrapherGrammar } from "./GrapherGrammar.js";
+function parseVariableIds(value) {
+  return value.split(" ").map((id) => parseInt(id, 10)).filter((id) => !isNaN(id));
+}
+const makeChoicesMap = (delimited) => {
+  const headerLine = delimited.split("\n")[0];
+  const map = /* @__PURE__ */ new Map();
+  headerLine.split(detectDelimiter(headerLine)).filter((name) => ExplorerControlTypeRegex.test(name)).forEach((choiceNameAndType) => {
+    const words = choiceNameAndType.split(" ");
+    const [choiceName, choiceType] = [
+      words.slice(0, -1).join(" "),
+      words[words.length - 1]
+    ];
+    map.set(choiceName, choiceType);
+  });
+  return map;
+};
+const removeChoiceControlTypeInfo = (label) => label.replace(ExplorerControlTypeRegex, "");
+const dropColumnTypes = (delimited) => {
+  const rows = delimited.split("\n");
+  const delimiter = detectDelimiter(rows[0]);
+  rows[0] = rows[0].split(delimiter).map(removeChoiceControlTypeInfo).join(delimiter);
+  return rows.join("\n");
+};
+const makeCheckBoxOption = (options, choiceName) => {
+  const checked = options.some(
+    (option) => option.checked === true && option.value === GridBoolean.true
+  );
+  const available = new Set(options.filter((opt) => opt.available).map((opt) => opt.label)).size === 2;
+  return [
+    {
+      label: choiceName,
+      checked,
+      value: GridBoolean.true,
+      available
+    }
+  ];
+};
+const _DecisionMatrix = class _DecisionMatrix {
+  constructor(delimited, hash = "") {
+    this.currentParams = {};
+    this.selectedRow = {};
+    makeObservable(this, {
+      currentParams: observable,
+      selectedRow: observable
+    });
+    this.choiceNameToControlTypeMap = makeChoicesMap(delimited);
+    this.table = new CoreTable(parseDelimited(dropColumnTypes(delimited)), [
+      // todo: remove col def?
+      {
+        slug: GrapherGrammar.grapherId.keyword,
+        type: ColumnTypeNames.Integer
+      },
+      // yVariableIds, xVariableIds, etc. can either be an indicator ID or a catalog path.
+      // If the first row contains a numeric value, the column type is inferred to be
+      // numeric, and parsing may fail if subsequent rows contain non-numeric values.
+      // In addition, yVariableIds may also contain a space-separated list of multiple
+      // indicator IDs or catalog paths.
+      ..._DecisionMatrix.allColumnSlugsWithIndicatorIdsOrCatalogPaths.map(
+        (slug) => ({
+          slug,
+          type: ColumnTypeNames.String
+        })
+      )
+    ]);
+    this.hash = hash;
+    this.setValuesFromChoiceParams();
+  }
+  allDecisionsAsQueryParams() {
+    return this.table.rows.map((row) => {
+      const choiceParams = {};
+      this.choiceNames.forEach((name) => {
+        choiceParams[name] = row[name];
+      });
+      return choiceParams;
+    });
+  }
+  get numRows() {
+    return this.table.numRows;
+  }
+  get requiredGrapherIds() {
+    return this.table.get(GrapherGrammar.grapherId.keyword).uniqValues;
+  }
+  /**
+   * Unique variable IDs requiring partial Grapher config to be loaded.
+   * Extracts the first (primary) variable ID from the y-dimension of each
+   * decision matrix row.
+   */
+  get requiredVariableIds() {
+    return _.uniq(
+      this.table.get(GrapherGrammar.yVariableIds.keyword).values.map((value) => parseVariableIds(value)).map((ids) => ids[0]).filter(_.identity)
+    );
+  }
+  /** All variable IDs referenced in the explorer config */
+  get allVariableIds() {
+    return _.uniq(
+      _DecisionMatrix.allColumnSlugsWithIndicatorIdsOrCatalogPaths.flatMap(
+        (slug) => this.table.get(slug).values.flatMap((value) => parseVariableIds(value)).filter(_.identity)
+      )
+    );
+  }
+  static {
+    this.allColumnSlugsWithIndicatorIdsOrCatalogPaths = [
+      GrapherGrammar.yVariableIds.keyword,
+      GrapherGrammar.xVariableId.keyword,
+      GrapherGrammar.colorVariableId.keyword,
+      GrapherGrammar.sizeVariableId.keyword,
+      GrapherGrammar.sortColumnSlug.keyword
+    ];
+  }
+  get allColumnsWithIndicatorIdsOrCatalogPaths() {
+    return this.table.getColumns(
+      _DecisionMatrix.allColumnSlugsWithIndicatorIdsOrCatalogPaths
+    ).filter((col) => !col.isMissing);
+  }
+  get requiredCatalogPaths() {
+    const allIndicators = this.allColumnsWithIndicatorIdsOrCatalogPaths.flatMap((col) => col.uniqValues).flatMap((value) => value.split(" ")).filter((value) => value !== "");
+    const catalogPaths = allIndicators.filter(
+      (indicator) => parseIntOrUndefined(indicator) === void 0
+    );
+    return new Set(catalogPaths);
+  }
+  // This is, basically, the inverse of `dropColumnTypes`.
+  // Turns a column named "Metric" back into "Metric Dropdown", for example.
+  get tableWithOriginalColumnNames() {
+    return this.table.renameColumns(
+      Object.fromEntries(
+        [...this.choiceNameToControlTypeMap.entries()].map(
+          ([choiceName, controlType]) => {
+            return [choiceName, `${choiceName} ${controlType}`];
+          }
+        )
+      )
+    );
+  }
+  toConstrainedOptions() {
+    const settings = { ...this.currentParams };
+    this.choiceNames.forEach((choiceName) => {
+      if (this.isOptionAvailable(
+        choiceName,
+        settings[choiceName],
+        settings
+      )) {
+      } else if (this.defaultSettings[choiceName] !== void 0 && this.isOptionAvailable(
+        choiceName,
+        this.defaultSettings[choiceName],
+        settings
+      )) {
+        settings[choiceName] = this.defaultSettings[choiceName];
+      } else {
+        settings[choiceName] = this.firstAvailableOptionForChoice(
+          choiceName,
+          settings
+        );
+      }
+    });
+    return settings;
+  }
+  get diffBetweenUserSettingsAndConstrained() {
+    return differenceObj(
+      this.toConstrainedOptions(),
+      this.currentParams
+    );
+  }
+  setValueCommand(choiceName, value) {
+    this._setValue(choiceName, value);
+    const invalidState = this.diffBetweenUserSettingsAndConstrained;
+    Object.keys(invalidState).forEach((key) => {
+      if (this.availableChoiceOptions[key].length > 1) {
+        this._setValue(key, invalidState[key]);
+      }
+    });
+  }
+  _setValue(choiceName, value) {
+    if (value === "") delete this.currentParams[choiceName];
+    else this.currentParams[choiceName] = value;
+    this.selectedRow = trimAndParseObject(
+      this.table.rowsAt([this.selectedRowIndex])[0],
+      GrapherGrammar
+    );
+  }
+  setValuesFromChoiceParams(choiceParams = {}) {
+    this.choiceNames.forEach((choiceName) => {
+      const choiceValue = choiceParams[choiceName] ?? this.defaultSettings[choiceName];
+      if (choiceValue === void 0)
+        this._setValue(
+          choiceName,
+          this.firstAvailableOptionForChoice(choiceName)
+        );
+      else this._setValue(choiceName, choiceValue);
+    });
+    return this;
+  }
+  get choiceNames() {
+    return Array.from(this.choiceNameToControlTypeMap.keys());
+  }
+  get allChoiceOptions() {
+    const choiceMap = {};
+    this.choiceNames.forEach((choiceName) => {
+      choiceMap[choiceName] = this.table.get(choiceName).uniqValues.filter((cell) => !isCellEmpty(cell));
+    });
+    return choiceMap;
+  }
+  get availableChoiceOptions() {
+    const result = {};
+    this.choiceNames.forEach((choiceName) => {
+      result[choiceName] = this.allChoiceOptions[choiceName].filter(
+        (option) => this.isOptionAvailable(choiceName, option)
+      );
+    });
+    return result;
+  }
+  getChoiceParamsForRow(row) {
+    const result = {};
+    this.choiceNames.forEach((choiceName) => {
+      result[choiceName] = row[choiceName];
+    });
+    return result;
+  }
+  firstAvailableOptionForChoice(choiceName, currentState = this.currentParams) {
+    return this.allChoiceOptions[choiceName].find(
+      (option) => this.isOptionAvailable(choiceName, option, currentState)
+    );
+  }
+  /**
+   * Note: there is a rare bug in here + rowsWith when an author has a complex decision matrix. If the user vists a url
+   * with invalid options like Metric="Tests", Interval="Weekly", Aligned="false"
+   * we will return first match, which is B1, even though B2 is a better match.
+   *
+   * graphers
+   * title	Metric Radio	Interval Radio	Aligned Checkbox
+   * A1	Cases	Cumulative	true
+   * A2	Cases	Cumulative	false
+   * A3	Cases	Weekly	false
+   *
+   * B1	Tests	Cumulative	true
+   * B2	Tests	Cumulative	false
+   */
+  isOptionAvailable(choiceName, option, currentState = this.currentParams) {
+    const query = {};
+    this.choiceNames.slice(0, this.choiceNames.indexOf(choiceName)).forEach((name) => {
+      query[name] = currentState[name];
+    });
+    query[choiceName] = option;
+    return this.rowsWith(query, choiceName).length > 0;
+  }
+  rowsWith(query, choiceName) {
+    const modifiedQuery = {};
+    Object.keys(trimObject(query)).forEach((queryColumn) => {
+      if (queryColumn !== choiceName)
+        modifiedQuery[queryColumn] = [query[queryColumn], ""];
+      else modifiedQuery[queryColumn] = query[queryColumn];
+    });
+    return this.table.findRows(modifiedQuery);
+  }
+  // The first row with defaultView column value of "true" determines the default view to use
+  get defaultSettings() {
+    const hits = this.rowsWith({
+      [GrapherGrammar.defaultView.keyword]: "true"
+    });
+    return hits[0] ?? {};
+  }
+  get firstMatch() {
+    const query = this.toConstrainedOptions();
+    const hits = this.rowsWith(query);
+    return hits[0];
+  }
+  get selectedRowIndex() {
+    return this.firstMatch === void 0 ? 0 : this.table.indexOf(this.firstMatch);
+  }
+  toControlOption(choiceName, optionName, currentValue, constrainedOptions) {
+    const available = this.isOptionAvailable(
+      choiceName,
+      optionName,
+      constrainedOptions
+    );
+    return {
+      label: optionName,
+      value: optionName,
+      available,
+      checked: currentValue === optionName
+    };
+  }
+  get choicesWithAvailability() {
+    const selectedRow = this.selectedRow;
+    const constrainedOptions = this.toConstrainedOptions();
+    return this.choiceNames.map((title) => {
+      const value = selectedRow[title] !== void 0 ? selectedRow[title].toString() : selectedRow[title];
+      const options = this.allChoiceOptions[title].map(
+        (optionName) => this.toControlOption(
+          title,
+          optionName,
+          value,
+          constrainedOptions
+        )
+      );
+      const type = this.choiceNameToControlTypeMap.get(title);
+      return {
+        title,
+        displayTitle: title,
+        type,
+        value,
+        options: type === ExplorerControlType.Checkbox ? makeCheckBoxOption(options, title) : options
+      };
+    });
+  }
+  toString() {
+    return queryParamsToStr(this.currentParams);
+  }
+};
+__decorateClass([
+  computed
+], _DecisionMatrix.prototype, "diffBetweenUserSettingsAndConstrained", 1);
+__decorateClass([
+  action.bound
+], _DecisionMatrix.prototype, "setValueCommand", 1);
+__decorateClass([
+  action.bound
+], _DecisionMatrix.prototype, "_setValue", 1);
+__decorateClass([
+  action.bound
+], _DecisionMatrix.prototype, "setValuesFromChoiceParams", 1);
+__decorateClass([
+  computed
+], _DecisionMatrix.prototype, "choiceNames", 1);
+__decorateClass([
+  computed
+], _DecisionMatrix.prototype, "allChoiceOptions", 1);
+__decorateClass([
+  computed
+], _DecisionMatrix.prototype, "availableChoiceOptions", 1);
+__decorateClass([
+  computed
+], _DecisionMatrix.prototype, "choicesWithAvailability", 1);
+let DecisionMatrix = _DecisionMatrix;
+export {
+  DecisionMatrix
+};