@buildcanada/charts 0.3.6 → 0.3.8

package/dist/grapher/controls/Dropdown.d.ts

@@ -0,0 +1,33 @@
+import * as React from "react";
+export interface BasicDropdownOption {
+    trackNote?: string;
+    value: string;
+    label: React.ReactNode;
+}
+export interface DropdownOptionGroup<DropdownOption extends BasicDropdownOption> {
+    label: React.ReactNode;
+    options: DropdownOption[];
+}
+export type DropdownCollectionItem<DropdownOption extends BasicDropdownOption> = DropdownOption | DropdownOptionGroup<DropdownOption>;
+export type DropdownCollection<DropdownOption extends BasicDropdownOption> = DropdownCollectionItem<DropdownOption>[];
+export interface DropdownProps<DropdownOption extends BasicDropdownOption> {
+    className?: string;
+    menuClassName?: string;
+    options: DropdownCollection<DropdownOption>;
+    value?: DropdownOption | null;
+    inputValue?: string;
+    onChange?: (option: DropdownOption | null) => void;
+    onInputChange?: (value: string) => void;
+    placeholder?: string;
+    isDisabled?: boolean;
+    isClearable?: boolean;
+    isLoading?: boolean;
+    isSearchable?: boolean;
+    renderTriggerValue?: (option: DropdownOption | null) => React.ReactNode | undefined;
+    renderMenuOption?: (option: DropdownOption) => React.ReactNode;
+    portalContainer?: HTMLElement;
+    "data-track-note"?: string;
+    "aria-label"?: string;
+}
+export declare function Dropdown<DropdownOption extends BasicDropdownOption>({ className, menuClassName, options, value, inputValue, onChange, onInputChange, placeholder, isDisabled, isClearable, isLoading, isSearchable, renderTriggerValue, renderMenuOption, portalContainer, ...otherProps }: DropdownProps<DropdownOption>): React.ReactElement;
+//# sourceMappingURL=Dropdown.d.ts.map

package/dist/grapher/controls/Dropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.d.ts","sourceRoot":"","sources":["../../../src/grapher/controls/Dropdown.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAqB9B,MAAM,WAAW,mBAAmB;IAChC,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,KAAK,EAAE,MAAM,CAAA;IACb,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;CACzB;AAED,MAAM,WAAW,mBAAmB,CAChC,cAAc,SAAS,mBAAmB;IAE1C,KAAK,EAAE,KAAK,CAAC,SAAS,CAAA;IACtB,OAAO,EAAE,cAAc,EAAE,CAAA;CAC5B;AAED,MAAM,MAAM,sBAAsB,CAAC,cAAc,SAAS,mBAAmB,IACzE,cAAc,GAAG,mBAAmB,CAAC,cAAc,CAAC,CAAA;AAExD,MAAM,MAAM,kBAAkB,CAAC,cAAc,SAAS,mBAAmB,IACrE,sBAAsB,CAAC,cAAc,CAAC,EAAE,CAAA;AAE5C,MAAM,WAAW,aAAa,CAAC,cAAc,SAAS,mBAAmB;IACrE,SAAS,CAAC,EAAE,MAAM,CAAA;IAClB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,OAAO,EAAE,kBAAkB,CAAC,cAAc,CAAC,CAAA;IAC3C,KAAK,CAAC,EAAE,cAAc,GAAG,IAAI,CAAA;IAC7B,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,QAAQ,CAAC,EAAE,CAAC,MAAM,EAAE,cAAc,GAAG,IAAI,KAAK,IAAI,CAAA;IAClD,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;IACvC,WAAW,CAAC,EAAE,MAAM,CAAA;IACpB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,WAAW,CAAC,EAAE,OAAO,CAAA;IACrB,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,kBAAkB,CAAC,EAAE,CACjB,MAAM,EAAE,cAAc,GAAG,IAAI,KAC5B,KAAK,CAAC,SAAS,GAAG,SAAS,CAAA;IAChC,gBAAgB,CAAC,EAAE,CAAC,MAAM,EAAE,cAAc,KAAK,KAAK,CAAC,SAAS,CAAA;IAC9D,eAAe,CAAC,EAAE,WAAW,CAAA;IAC7B,iBAAiB,CAAC,EAAE,MAAM,CAAA;IAC1B,YAAY,CAAC,EAAE,MAAM,CAAA;CACxB;AAgBD,wBAAgB,QAAQ,CAAC,cAAc,SAAS,mBAAmB,EAAE,EACjE,SAAS,EAIT,aAAa,EACb,OAAO,EACP,KAAK,EACL,UAAU,EACV,QAAQ,EACR,aAAa,EACb,WAAW,EACX,UAAU,EACV,WAAW,EACX,SAAS,EACT,YAAY,EACZ,kBAAkB,EAClB,gBAAgB,EAChB,eAAe,EACf,GAAG,UAAU,EAChB,EAAE,aAAa,CAAC,cAAc,CAAC,GAAG,KAAK,CAAC,YAAY,CAyIpD"}

package/dist/grapher/controls/Dropdown.js

@@ -0,0 +1,173 @@
+import cx from "classnames";
+import * as React from "react";
+import { useMemo } from "react";
+import {
+  Autocomplete,
+  Button,
+  Header,
+  Input,
+  ListBox,
+  ListBoxItem,
+  ListBoxSection,
+  Popover,
+  SearchField,
+  Select,
+  SelectValue,
+  useFilter
+} from "react-aria-components";
+import { faTimesCircle } from "@fortawesome/free-solid-svg-icons";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { isTouchDevice } from "../../utils/index.js";
+function isOptionGroup(item) {
+  return item.options !== void 0;
+}
+function flattenOptions(options) {
+  return options.flatMap(
+    (item) => isOptionGroup(item) ? item.options : [item]
+  );
+}
+function Dropdown({
+  className,
+  // We use a separate prop for the menu's className because the Popover
+  // (menu) doesn't render as a child of the select, so it's not trivial to
+  // style it using the main className.
+  menuClassName,
+  options,
+  value,
+  inputValue,
+  onChange,
+  onInputChange,
+  placeholder,
+  isDisabled,
+  isClearable,
+  isLoading,
+  isSearchable,
+  renderTriggerValue,
+  renderMenuOption,
+  portalContainer,
+  ...otherProps
+}) {
+  const { contains } = useFilter({ sensitivity: "base" });
+  const flatOptions = useMemo(() => flattenOptions(options), [options]);
+  const selectedValue = value ?? null;
+  function handleSelectionChange(key) {
+    if (key === null) {
+      onChange?.(null);
+      return;
+    }
+    if (typeof key === "number") return;
+    const selected = flatOptions.find((option) => option.value === key);
+    if (selected) {
+      onChange?.(selected);
+    }
+  }
+  const listBox = /* @__PURE__ */ React.createElement(ListBox, { className: "grapher-dropdown-listbox" }, options.map(
+    (item, index) => isOptionGroup(item) ? /* @__PURE__ */ React.createElement(
+      ListBoxSection,
+      {
+        key: `section-${index}`,
+        id: `section-${index}`,
+        className: "group"
+      },
+      /* @__PURE__ */ React.createElement(Header, { className: "group-heading" }, item.label),
+      item.options.map((option) => /* @__PURE__ */ React.createElement(
+        ListBoxItem,
+        {
+          className: "option",
+          key: option.value,
+          id: option.value,
+          textValue: typeof option.label === "string" ? option.label : String(option.value),
+          "data-track-note": option.trackNote
+        },
+        renderMenuOption ? renderMenuOption(option) : option.label
+      ))
+    ) : /* @__PURE__ */ React.createElement(
+      ListBoxItem,
+      {
+        className: "option",
+        key: item.value,
+        id: item.value,
+        textValue: typeof item.label === "string" ? item.label : String(item.value),
+        "data-track-note": item.trackNote
+      },
+      renderMenuOption ? renderMenuOption(item) : item.label
+    )
+  ));
+  return /* @__PURE__ */ React.createElement(
+    Select,
+    {
+      className: cx("grapher-dropdown", className),
+      selectedKey: value?.value ?? null,
+      onSelectionChange: handleSelectionChange,
+      placeholder,
+      isDisabled,
+      ...otherProps
+    },
+    /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        className: cx("control", {
+          loading: isLoading
+        })
+      },
+      /* @__PURE__ */ React.createElement(SelectValue, { className: "select-value" }, ({ selectedItems, defaultChildren }) => {
+        if (renderTriggerValue && selectedItems.length === 1) {
+          return renderTriggerValue(selectedValue);
+        }
+        return defaultChildren;
+      })
+    ),
+    isClearable && value && /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        className: "clear-indicator",
+        slot: null,
+        type: "button",
+        onPress: () => onChange?.(null),
+        "aria-label": "Clear selection"
+      }
+    ),
+    /* @__PURE__ */ React.createElement(
+      Popover,
+      {
+        className: cx("grapher-dropdown-menu", menuClassName),
+        offset: 4,
+        UNSTABLE_portalContainer: portalContainer
+      },
+      isSearchable ? (
+        // If inputValue is provided, the component is controlled
+        // and we expect the filtering to happen outside of it.
+        /* @__PURE__ */ React.createElement(Autocomplete, { filter: inputValue ? void 0 : contains }, /* @__PURE__ */ React.createElement(
+          SearchField,
+          {
+            className: "grapher-dropdown-search",
+            "aria-label": "Search",
+            autoFocus: true,
+            value: inputValue,
+            onChange: onInputChange
+          },
+          /* @__PURE__ */ React.createElement("span", { className: "grapher-dropdown-search-icon" }),
+          /* @__PURE__ */ React.createElement(
+            Input,
+            {
+              className: "grapher-dropdown-search-input",
+              style: {
+                fontSize: isTouchDevice() ? 16 : void 0
+              }
+            }
+          ),
+          /* @__PURE__ */ React.createElement(Button, { className: "grapher-dropdown-search-reset" }, /* @__PURE__ */ React.createElement(
+            FontAwesomeIcon,
+            {
+              icon: faTimesCircle,
+              "aria-hidden": true
+            }
+          ))
+        ), listBox)
+      ) : listBox
+    )
+  );
+}
+export {
+  Dropdown
+};

package/dist/grapher/controls/Dropdown.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/grapher/controls/Dropdown.tsx"],
+  "sourcesContent": ["import cx from \"classnames\"\nimport * as React from \"react\"\nimport { useMemo } from \"react\"\nimport {\n    Autocomplete,\n    Button,\n    Header,\n    Input,\n    Key,\n    ListBox,\n    ListBoxItem,\n    ListBoxSection,\n    Popover,\n    SearchField,\n    Select,\n    SelectValue,\n    useFilter,\n} from \"react-aria-components\"\nimport { faTimesCircle } from \"@fortawesome/free-solid-svg-icons\"\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\"\nimport { isTouchDevice } from \"../../utils/index.js\"\n\nexport interface BasicDropdownOption {\n    trackNote?: string\n    value: string\n    label: React.ReactNode\n}\n\nexport interface DropdownOptionGroup<\n    DropdownOption extends BasicDropdownOption,\n> {\n    label: React.ReactNode\n    options: DropdownOption[]\n}\n\nexport type DropdownCollectionItem<DropdownOption extends BasicDropdownOption> =\n    DropdownOption | DropdownOptionGroup<DropdownOption>\n\nexport type DropdownCollection<DropdownOption extends BasicDropdownOption> =\n    DropdownCollectionItem<DropdownOption>[]\n\nexport interface DropdownProps<DropdownOption extends BasicDropdownOption> {\n    className?: string\n    menuClassName?: string\n    options: DropdownCollection<DropdownOption>\n    value?: DropdownOption | null\n    inputValue?: string\n    onChange?: (option: DropdownOption | null) => void\n    onInputChange?: (value: string) => void\n    placeholder?: string\n    isDisabled?: boolean\n    isClearable?: boolean\n    isLoading?: boolean\n    isSearchable?: boolean\n    renderTriggerValue?: (\n        option: DropdownOption | null\n    ) => React.ReactNode | undefined\n    renderMenuOption?: (option: DropdownOption) => React.ReactNode\n    portalContainer?: HTMLElement\n    \"data-track-note\"?: string\n    \"aria-label\"?: string\n}\n\nfunction isOptionGroup<DropdownOption extends BasicDropdownOption>(\n    item: DropdownCollectionItem<DropdownOption>\n): item is DropdownOptionGroup<DropdownOption> {\n    return (item as DropdownOptionGroup<DropdownOption>).options !== undefined\n}\n\nfunction flattenOptions<DropdownOption extends BasicDropdownOption>(\n    options: DropdownCollection<DropdownOption>\n): DropdownOption[] {\n    return options.flatMap((item) =>\n        isOptionGroup(item) ? item.options : [item]\n    )\n}\n\nexport function Dropdown<DropdownOption extends BasicDropdownOption>({\n    className,\n    // We use a separate prop for the menu's className because the Popover\n    // (menu) doesn't render as a child of the select, so it's not trivial to\n    // style it using the main className.\n    menuClassName,\n    options,\n    value,\n    inputValue,\n    onChange,\n    onInputChange,\n    placeholder,\n    isDisabled,\n    isClearable,\n    isLoading,\n    isSearchable,\n    renderTriggerValue,\n    renderMenuOption,\n    portalContainer,\n    ...otherProps\n}: DropdownProps<DropdownOption>): React.ReactElement {\n    const { contains } = useFilter({ sensitivity: \"base\" })\n    const flatOptions = useMemo(() => flattenOptions(options), [options])\n    const selectedValue = value ?? null\n\n    function handleSelectionChange(key: Key | null): void {\n        if (key === null) {\n            onChange?.(null)\n            return\n        }\n\n        if (typeof key === \"number\") return\n        const selected = flatOptions.find((option) => option.value === key)\n        if (selected) {\n            onChange?.(selected)\n        }\n    }\n\n    const listBox = (\n        <ListBox className=\"grapher-dropdown-listbox\">\n            {options.map((item, index) =>\n                isOptionGroup(item) ? (\n                    <ListBoxSection\n                        key={`section-${index}`}\n                        id={`section-${index}`}\n                        className=\"group\"\n                    >\n                        <Header className=\"group-heading\">{item.label}</Header>\n                        {item.options.map((option) => (\n                            <ListBoxItem\n                                className=\"option\"\n                                key={option.value}\n                                id={option.value}\n                                textValue={\n                                    typeof option.label === \"string\"\n                                        ? option.label\n                                        : String(option.value)\n                                }\n                                data-track-note={option.trackNote}\n                            >\n                                {renderMenuOption\n                                    ? renderMenuOption(option)\n                                    : option.label}\n                            </ListBoxItem>\n                        ))}\n                    </ListBoxSection>\n                ) : (\n                    <ListBoxItem\n                        className=\"option\"\n                        key={item.value}\n                        id={item.value}\n                        textValue={\n                            typeof item.label === \"string\"\n                                ? item.label\n                                : String(item.value)\n                        }\n                        data-track-note={item.trackNote}\n                    >\n                        {renderMenuOption ? renderMenuOption(item) : item.label}\n                    </ListBoxItem>\n                )\n            )}\n        </ListBox>\n    )\n\n    return (\n        <Select\n            className={cx(\"grapher-dropdown\", className)}\n            // null means no selection, undefined means the component is\n            // uncontrolled, so we need to set it explicitly.\n            selectedKey={value?.value ?? null}\n            onSelectionChange={handleSelectionChange}\n            placeholder={placeholder}\n            isDisabled={isDisabled}\n            {...otherProps}\n        >\n            <Button\n                className={cx(\"control\", {\n                    loading: isLoading,\n                })}\n            >\n                <SelectValue className=\"select-value\">\n                    {({ selectedItems, defaultChildren }) => {\n                        if (renderTriggerValue && selectedItems.length === 1) {\n                            return renderTriggerValue(selectedValue)\n                        }\n                        return defaultChildren\n                    }}\n                </SelectValue>\n            </Button>\n            {isClearable && value && (\n                <Button\n                    className=\"clear-indicator\"\n                    slot={null}\n                    type=\"button\"\n                    onPress={() => onChange?.(null)}\n                    aria-label=\"Clear selection\"\n                />\n            )}\n            <Popover\n                className={cx(\"grapher-dropdown-menu\", menuClassName)}\n                offset={4}\n                UNSTABLE_portalContainer={portalContainer}\n            >\n                {isSearchable ? (\n                    // If inputValue is provided, the component is controlled\n                    // and we expect the filtering to happen outside of it.\n                    <Autocomplete filter={inputValue ? undefined : contains}>\n                        <SearchField\n                            className=\"grapher-dropdown-search\"\n                            aria-label=\"Search\"\n                            autoFocus\n                            value={inputValue}\n                            onChange={onInputChange}\n                        >\n                            <span className=\"grapher-dropdown-search-icon\" />\n                            <Input\n                                className=\"grapher-dropdown-search-input\"\n                                style={{\n                                    fontSize: isTouchDevice() ? 16 : undefined,\n                                }}\n                            />\n                            <Button className=\"grapher-dropdown-search-reset\">\n                                <FontAwesomeIcon\n                                    icon={faTimesCircle}\n                                    aria-hidden\n                                />\n                            </Button>\n                        </SearchField>\n                        {listBox}\n                    </Autocomplete>\n                ) : (\n                    listBox\n                )}\n            </Popover>\n        </Select>\n    )\n}\n"],
+  "mappings": "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",
+  "names": []
+}

package/dist/grapher/controls/EntitySelectionToggle.d.ts

@@ -0,0 +1,33 @@
+import * as React from "react";
+import { GrapherWindowType } from "../../types/index.js";
+export interface EntitySelectionManager {
+    canHighlightEntities?: boolean;
+    canChangeEntity?: boolean;
+    canAddEntities?: boolean;
+    canChangeAddOrHighlightEntities?: boolean;
+    entityType?: string;
+    entityTypePlural?: string;
+    isEntitySelectorModalOrDrawerOpen?: boolean;
+    isOnChartTab?: boolean;
+    isOnMapTab?: boolean;
+    hideEntityControls?: boolean;
+    shouldShowEntitySelectorAs?: GrapherWindowType;
+}
+interface EntitySelectionLabel {
+    icon: React.ReactElement;
+    action: string;
+    entity: string;
+}
+export declare class EntitySelectionToggle extends React.Component<{
+    manager: EntitySelectionManager;
+}> {
+    constructor(props: {
+        manager: EntitySelectionManager;
+    });
+    static shouldShow(manager: EntitySelectionManager): boolean;
+    get showToggle(): boolean;
+    get label(): EntitySelectionLabel | null;
+    render(): React.ReactElement | null;
+}
+export {};
+//# sourceMappingURL=EntitySelectionToggle.d.ts.map

package/dist/grapher/controls/EntitySelectionToggle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"EntitySelectionToggle.d.ts","sourceRoot":"","sources":["../../../src/grapher/controls/EntitySelectionToggle.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAM9B,OAAO,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAA;AAExD,MAAM,WAAW,sBAAsB;IACnC,oBAAoB,CAAC,EAAE,OAAO,CAAA;IAC9B,eAAe,CAAC,EAAE,OAAO,CAAA;IACzB,cAAc,CAAC,EAAE,OAAO,CAAA;IACxB,+BAA+B,CAAC,EAAE,OAAO,CAAA;IACzC,UAAU,CAAC,EAAE,MAAM,CAAA;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAA;IACzB,iCAAiC,CAAC,EAAE,OAAO,CAAA;IAC3C,YAAY,CAAC,EAAE,OAAO,CAAA;IACtB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,kBAAkB,CAAC,EAAE,OAAO,CAAA;IAC5B,0BAA0B,CAAC,EAAE,iBAAiB,CAAA;CACjD;AAED,UAAU,oBAAoB;IAC1B,IAAI,EAAE,KAAK,CAAC,YAAY,CAAA;IACxB,MAAM,EAAE,MAAM,CAAA;IACd,MAAM,EAAE,MAAM,CAAA;CACjB;AAED,qBACa,qBAAsB,SAAQ,KAAK,CAAC,SAAS,CAAC;IACvD,OAAO,EAAE,sBAAsB,CAAA;CAClC,CAAC;gBACc,KAAK,EAAE;QAAE,OAAO,EAAE,sBAAsB,CAAA;KAAE;IAKtD,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE,sBAAsB,GAAG,OAAO;IAK3D,IAAc,UAAU,IAAI,OAAO,CAwBlC;IAED,IAAc,KAAK,IAAI,oBAAoB,GAAG,IAAI,CAuCjD;IAEQ,MAAM,IAAI,KAAK,CAAC,YAAY,GAAG,IAAI;CAyB/C"}

package/dist/grapher/controls/EntitySelectionToggle.js

@@ -0,0 +1,107 @@
+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 React from "react";
+import { action, computed, makeObservable } from "mobx";
+import { observer } from "mobx-react";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faEye, faRightLeft, faPen } from "@fortawesome/free-solid-svg-icons";
+import classnames from "classnames";
+import { GrapherWindowType } from "../../types/index.js";
+let EntitySelectionToggle = class extends React.Component {
+  constructor(props) {
+    super(props);
+    makeObservable(this);
+  }
+  static shouldShow(manager) {
+    const toggle = new EntitySelectionToggle({ manager });
+    return toggle.showToggle;
+  }
+  get showToggle() {
+    const {
+      isOnChartTab,
+      isOnMapTab,
+      hideEntityControls,
+      shouldShowEntitySelectorAs,
+      canChangeAddOrHighlightEntities
+    } = this.props.manager;
+    if (hideEntityControls) return false;
+    const shouldShowDrawer = shouldShowEntitySelectorAs === GrapherWindowType.drawer;
+    const shouldShowModal = shouldShowEntitySelectorAs === GrapherWindowType.modal;
+    if (isOnMapTab) return shouldShowDrawer;
+    return !!(isOnChartTab && canChangeAddOrHighlightEntities && (shouldShowModal || shouldShowDrawer) && this.label);
+  }
+  get label() {
+    const {
+      entityType = "",
+      entityTypePlural = "",
+      canHighlightEntities,
+      canChangeEntity,
+      canAddEntities,
+      isOnMapTab
+    } = this.props.manager;
+    if (isOnMapTab)
+      return {
+        action: "Select",
+        entity: "countries",
+        icon: /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: faPen })
+      };
+    if (canHighlightEntities)
+      return {
+        action: "Select",
+        entity: entityTypePlural,
+        icon: /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: faEye })
+      };
+    if (canChangeEntity)
+      return {
+        action: "Change",
+        entity: entityType,
+        icon: /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: faRightLeft })
+      };
+    if (canAddEntities)
+      return {
+        action: "Edit",
+        entity: entityTypePlural,
+        icon: /* @__PURE__ */ React.createElement(FontAwesomeIcon, { icon: faPen })
+      };
+    return null;
+  }
+  render() {
+    const { showToggle, label } = this;
+    const { isEntitySelectorModalOrDrawerOpen: active } = this.props.manager;
+    return showToggle && label ? /* @__PURE__ */ React.createElement("div", { className: "entity-selection-menu" }, /* @__PURE__ */ React.createElement(
+      "button",
+      {
+        className: classnames("menu-toggle", { active }),
+        onClick: action((e) => {
+          this.props.manager.isEntitySelectorModalOrDrawerOpen = !active;
+          e.stopPropagation();
+        }),
+        type: "button",
+        "data-track-note": "chart_add_entity",
+        "aria-label": `${label.action} ${label.entity}`
+      },
+      label.icon,
+      /* @__PURE__ */ React.createElement("label", null, label.action, " ", /* @__PURE__ */ React.createElement("span", null, label.entity))
+    )) : null;
+  }
+};
+__decorateClass([
+  computed
+], EntitySelectionToggle.prototype, "showToggle", 1);
+__decorateClass([
+  computed
+], EntitySelectionToggle.prototype, "label", 1);
+EntitySelectionToggle = __decorateClass([
+  observer
+], EntitySelectionToggle);
+export {
+  EntitySelectionToggle
+};

package/dist/grapher/controls/EntitySelectionToggle.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/grapher/controls/EntitySelectionToggle.tsx"],
+  "sourcesContent": ["import * as React from \"react\"\nimport { action, computed, makeObservable } from \"mobx\"\nimport { observer } from \"mobx-react\"\nimport { FontAwesomeIcon } from \"@fortawesome/react-fontawesome\"\nimport { faEye, faRightLeft, faPen } from \"@fortawesome/free-solid-svg-icons\"\nimport classnames from \"classnames\"\nimport { GrapherWindowType } from \"../../types/index.js\"\n\nexport interface EntitySelectionManager {\n    canHighlightEntities?: boolean\n    canChangeEntity?: boolean\n    canAddEntities?: boolean\n    canChangeAddOrHighlightEntities?: boolean\n    entityType?: string\n    entityTypePlural?: string\n    isEntitySelectorModalOrDrawerOpen?: boolean\n    isOnChartTab?: boolean\n    isOnMapTab?: boolean\n    hideEntityControls?: boolean\n    shouldShowEntitySelectorAs?: GrapherWindowType\n}\n\ninterface EntitySelectionLabel {\n    icon: React.ReactElement\n    action: string\n    entity: string\n}\n\n@observer\nexport class EntitySelectionToggle extends React.Component<{\n    manager: EntitySelectionManager\n}> {\n    constructor(props: { manager: EntitySelectionManager }) {\n        super(props)\n        makeObservable(this)\n    }\n\n    static shouldShow(manager: EntitySelectionManager): boolean {\n        const toggle = new EntitySelectionToggle({ manager })\n        return toggle.showToggle\n    }\n\n    @computed get showToggle(): boolean {\n        const {\n            isOnChartTab,\n            isOnMapTab,\n            hideEntityControls,\n            shouldShowEntitySelectorAs,\n            canChangeAddOrHighlightEntities,\n        } = this.props.manager\n\n        if (hideEntityControls) return false\n\n        const shouldShowDrawer =\n            shouldShowEntitySelectorAs === GrapherWindowType.drawer\n        const shouldShowModal =\n            shouldShowEntitySelectorAs === GrapherWindowType.modal\n\n        if (isOnMapTab) return shouldShowDrawer\n\n        return !!(\n            isOnChartTab &&\n            canChangeAddOrHighlightEntities &&\n            (shouldShowModal || shouldShowDrawer) &&\n            this.label\n        )\n    }\n\n    @computed get label(): EntitySelectionLabel | null {\n        const {\n            entityType = \"\",\n            entityTypePlural = \"\",\n            canHighlightEntities,\n            canChangeEntity,\n            canAddEntities,\n            isOnMapTab,\n        } = this.props.manager\n\n        if (isOnMapTab)\n            return {\n                action: \"Select\",\n                entity: \"countries\",\n                icon: <FontAwesomeIcon icon={faPen} />,\n            }\n\n        if (canHighlightEntities)\n            return {\n                action: \"Select\",\n                entity: entityTypePlural,\n                icon: <FontAwesomeIcon icon={faEye} />,\n            }\n\n        if (canChangeEntity)\n            return {\n                action: \"Change\",\n                entity: entityType,\n                icon: <FontAwesomeIcon icon={faRightLeft} />,\n            }\n\n        if (canAddEntities)\n            return {\n                action: \"Edit\",\n                entity: entityTypePlural,\n                icon: <FontAwesomeIcon icon={faPen} />,\n            }\n\n        return null\n    }\n\n    override render(): React.ReactElement | null {\n        const { showToggle, label } = this\n        const { isEntitySelectorModalOrDrawerOpen: active } = this.props.manager\n\n        return showToggle && label ? (\n            <div className=\"entity-selection-menu\">\n                <button\n                    className={classnames(\"menu-toggle\", { active })}\n                    onClick={action((e): void => {\n                        this.props.manager.isEntitySelectorModalOrDrawerOpen =\n                            !active\n                        e.stopPropagation()\n                    })}\n                    type=\"button\"\n                    data-track-note=\"chart_add_entity\"\n                    aria-label={`${label.action} ${label.entity}`}\n                >\n                    {label.icon}\n                    <label>\n                        {label.action} <span>{label.entity}</span>\n                    </label>\n                </button>\n            </div>\n        ) : null\n    }\n}\n"],
+  "mappings": ";;;;;;;;;;AAAA,YAAY,WAAW;AACvB,SAAS,QAAQ,UAAU,sBAAsB;AACjD,SAAS,gBAAgB;AACzB,SAAS,uBAAuB;AAChC,SAAS,OAAO,aAAa,aAAa;AAC1C,OAAO,gBAAgB;AACvB,SAAS,yBAAyB;AAuB3B,IAAM,wBAAN,cAAoC,MAAM,UAE9C;AAAA,EACC,YAAY,OAA4C;AACpD,UAAM,KAAK;AACX,mBAAe,IAAI;AAAA,EACvB;AAAA,EAEA,OAAO,WAAW,SAA0C;AACxD,UAAM,SAAS,IAAI,sBAAsB,EAAE,QAAQ,CAAC;AACpD,WAAO,OAAO;AAAA,EAClB;AAAA,EAEU,IAAI,aAAsB;AAChC,UAAM;AAAA,MACF;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACJ,IAAI,KAAK,MAAM;AAEf,QAAI,mBAAoB,QAAO;AAE/B,UAAM,mBACF,+BAA+B,kBAAkB;AACrD,UAAM,kBACF,+BAA+B,kBAAkB;AAErD,QAAI,WAAY,QAAO;AAEvB,WAAO,CAAC,EACJ,gBACA,oCACC,mBAAmB,qBACpB,KAAK;AAAA,EAEb;AAAA,EAEU,IAAI,QAAqC;AAC/C,UAAM;AAAA,MACF,aAAa;AAAA,MACb,mBAAmB;AAAA,MACnB;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACJ,IAAI,KAAK,MAAM;AAEf,QAAI;AACA,aAAO;AAAA,QACH,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,MAAM,oCAAC,mBAAgB,MAAM,OAAO;AAAA,MACxC;AAEJ,QAAI;AACA,aAAO;AAAA,QACH,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,MAAM,oCAAC,mBAAgB,MAAM,OAAO;AAAA,MACxC;AAEJ,QAAI;AACA,aAAO;AAAA,QACH,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,MAAM,oCAAC,mBAAgB,MAAM,aAAa;AAAA,MAC9C;AAEJ,QAAI;AACA,aAAO;AAAA,QACH,QAAQ;AAAA,QACR,QAAQ;AAAA,QACR,MAAM,oCAAC,mBAAgB,MAAM,OAAO;AAAA,MACxC;AAEJ,WAAO;AAAA,EACX;AAAA,EAES,SAAoC;AACzC,UAAM,EAAE,YAAY,MAAM,IAAI;AAC9B,UAAM,EAAE,mCAAmC,OAAO,IAAI,KAAK,MAAM;AAEjE,WAAO,cAAc,QACjB,oCAAC,SAAI,WAAU,2BACX;AAAA,MAAC;AAAA;AAAA,QACG,WAAW,WAAW,eAAe,EAAE,OAAO,CAAC;AAAA,QAC/C,SAAS,OAAO,CAAC,MAAY;AACzB,eAAK,MAAM,QAAQ,oCACf,CAAC;AACL,YAAE,gBAAgB;AAAA,QACtB,CAAC;AAAA,QACD,MAAK;AAAA,QACL,mBAAgB;AAAA,QAChB,cAAY,GAAG,MAAM,MAAM,IAAI,MAAM,MAAM;AAAA;AAAA,MAE1C,MAAM;AAAA,MACP,oCAAC,eACI,MAAM,QAAO,KAAC,oCAAC,cAAM,MAAM,MAAO,CACvC;AAAA,IACJ,CACJ,IACA;AAAA,EACR;AACJ;AA5FkB;AAAA,EAAb;AAAA,GAbQ,sBAaK;AA0BA;AAAA,EAAb;AAAA,GAvCQ,sBAuCK;AAvCL,wBAAN;AAAA,EADN;AAAA,GACY;",
+  "names": []
+}

package/dist/grapher/controls/MapRegionDropdown.d.ts

@@ -0,0 +1,32 @@
+import * as React from "react";
+import { MapConfig } from "../mapCharts/MapConfig.js";
+import { MapRegionName } from "../../types/index.js";
+import { GlobeController } from "../mapCharts/GlobeController.js";
+export interface MapRegionDropdownManager {
+    mapConfig?: MapConfig;
+    globeController?: GlobeController;
+    isOnMapTab?: boolean;
+    isFaceted?: boolean;
+}
+interface MapRegionDropdownOption {
+    value: MapRegionName;
+    label: string;
+    trackNote: "map_zoom_to_region";
+}
+export declare class MapRegionDropdown extends React.Component<{
+    manager: MapRegionDropdownManager;
+}> {
+    constructor(props: {
+        manager: MapRegionDropdownManager;
+    });
+    static shouldShow(manager: MapRegionDropdownManager): boolean;
+    private get manager();
+    private get mapConfig();
+    private get showMenu();
+    onChange(selected: MapRegionDropdownOption | null): void;
+    get options(): MapRegionDropdownOption[];
+    get value(): MapRegionDropdownOption | null;
+    render(): React.ReactElement | null;
+}
+export {};
+//# sourceMappingURL=MapRegionDropdown.d.ts.map

package/dist/grapher/controls/MapRegionDropdown.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MapRegionDropdown.d.ts","sourceRoot":"","sources":["../../../src/grapher/controls/MapRegionDropdown.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EAAE,aAAa,EAAE,MAAM,sBAAsB,CAAA;AAGpD,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAA;AAEjE,MAAM,WAAW,wBAAwB;IACrC,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,SAAS,CAAC,EAAE,OAAO,CAAA;CACtB;AAED,UAAU,uBAAuB;IAC7B,KAAK,EAAE,aAAa,CAAA;IACpB,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,oBAAoB,CAAA;CAClC;AAED,qBACa,iBAAkB,SAAQ,KAAK,CAAC,SAAS,CAAC;IACnD,OAAO,EAAE,wBAAwB,CAAA;CACpC,CAAC;gBACc,KAAK,EAAE;QAAE,OAAO,EAAE,wBAAwB,CAAA;KAAE;IAKxD,MAAM,CAAC,UAAU,CAAC,OAAO,EAAE,wBAAwB,GAAG,OAAO;IAKnD,OAAO,KAAK,OAAO,GAE5B;IAES,OAAO,KAAK,SAAS,GAE9B;IAES,OAAO,KAAK,QAAQ,GAU7B;IAEa,QAAQ,CAAC,QAAQ,EAAE,uBAAuB,GAAG,IAAI,GAAG,IAAI;IAetE,IAAc,OAAO,IAAI,uBAAuB,EAAE,CAYjD;IAED,IAAc,KAAK,IAAI,uBAAuB,GAAG,IAAI,CAGpD;IAEQ,MAAM,IAAI,KAAK,CAAC,YAAY,GAAG,IAAI;CAa/C"}

package/dist/grapher/controls/MapRegionDropdown.js

@@ -0,0 +1,102 @@
+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 React from "react";
+import { computed, action, makeObservable } from "mobx";
+import { observer } from "mobx-react";
+import { MapConfig } from "../mapCharts/MapConfig.js";
+import { MapRegionName } from "../../types/index.js";
+import { Dropdown } from "./Dropdown.js";
+import { MAP_REGION_LABELS } from "../mapCharts/MapChartConstants.js";
+let MapRegionDropdown = class extends React.Component {
+  constructor(props) {
+    super(props);
+    makeObservable(this);
+  }
+  static shouldShow(manager) {
+    const menu = new MapRegionDropdown({ manager });
+    return menu.showMenu;
+  }
+  get manager() {
+    return this.props.manager;
+  }
+  get mapConfig() {
+    return this.manager.mapConfig ?? new MapConfig();
+  }
+  get showMenu() {
+    const { isOnMapTab, isFaceted, mapConfig } = this.manager;
+    return !!(isOnMapTab && // Hide the dropdown when the globe is active
+    !mapConfig?.globe.isActive && // Hide the dropdown when the map is not faceted unless a 2d continent is active
+    !(this.mapConfig.region === MapRegionName.World && !isFaceted));
+  }
+  onChange(selected) {
+    const value = selected?.value;
+    if (!value) return;
+    this.mapConfig.region = value;
+    if (this.mapConfig.region !== MapRegionName.World) {
+      this.mapConfig.selection.deselectEntities(
+        this.mapConfig.selection.selectedRegionNames
+      );
+    }
+  }
+  get options() {
+    const continentOptions = Object.values(
+      MapRegionName
+    ).map((region) => {
+      return {
+        value: region,
+        label: MAP_REGION_LABELS[region],
+        trackNote: "map_zoom_to_region"
+      };
+    });
+    return continentOptions;
+  }
+  get value() {
+    const { region } = this.mapConfig;
+    return this.options.find((opt) => opt.value === region) ?? null;
+  }
+  render() {
+    if (!this.showMenu) return null;
+    return /* @__PURE__ */ React.createElement(
+      Dropdown,
+      {
+        className: "map-region-dropdown",
+        options: this.options,
+        onChange: this.onChange,
+        value: this.value,
+        "aria-label": "Select continent"
+      }
+    );
+  }
+};
+__decorateClass([
+  computed
+], MapRegionDropdown.prototype, "manager", 1);
+__decorateClass([
+  computed
+], MapRegionDropdown.prototype, "mapConfig", 1);
+__decorateClass([
+  computed
+], MapRegionDropdown.prototype, "showMenu", 1);
+__decorateClass([
+  action.bound
+], MapRegionDropdown.prototype, "onChange", 1);
+__decorateClass([
+  computed
+], MapRegionDropdown.prototype, "options", 1);
+__decorateClass([
+  computed
+], MapRegionDropdown.prototype, "value", 1);
+MapRegionDropdown = __decorateClass([
+  observer
+], MapRegionDropdown);
+export {
+  MapRegionDropdown
+};

package/dist/grapher/controls/MapRegionDropdown.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["src/grapher/controls/MapRegionDropdown.tsx"],
+  "sourcesContent": ["import * as React from \"react\"\nimport { computed, action, makeObservable } from \"mobx\"\nimport { observer } from \"mobx-react\"\nimport { MapConfig } from \"../mapCharts/MapConfig.js\"\nimport { MapRegionName } from \"../../types/index.js\"\nimport { Dropdown } from \"./Dropdown.js\"\nimport { MAP_REGION_LABELS } from \"../mapCharts/MapChartConstants.js\"\nimport { GlobeController } from \"../mapCharts/GlobeController.js\"\n\nexport interface MapRegionDropdownManager {\n    mapConfig?: MapConfig\n    globeController?: GlobeController\n    isOnMapTab?: boolean\n    isFaceted?: boolean\n}\n\ninterface MapRegionDropdownOption {\n    value: MapRegionName\n    label: string\n    trackNote: \"map_zoom_to_region\"\n}\n\n@observer\nexport class MapRegionDropdown extends React.Component<{\n    manager: MapRegionDropdownManager\n}> {\n    constructor(props: { manager: MapRegionDropdownManager }) {\n        super(props)\n        makeObservable(this)\n    }\n\n    static shouldShow(manager: MapRegionDropdownManager): boolean {\n        const menu = new MapRegionDropdown({ manager })\n        return menu.showMenu\n    }\n\n    @computed private get manager(): MapRegionDropdownManager {\n        return this.props.manager\n    }\n\n    @computed private get mapConfig(): MapConfig {\n        return this.manager.mapConfig ?? new MapConfig()\n    }\n\n    @computed private get showMenu(): boolean {\n        const { isOnMapTab, isFaceted, mapConfig } = this.manager\n\n        return !!(\n            isOnMapTab &&\n            // Hide the dropdown when the globe is active\n            !mapConfig?.globe.isActive &&\n            // Hide the dropdown when the map is not faceted unless a 2d continent is active\n            !(this.mapConfig.region === MapRegionName.World && !isFaceted)\n        )\n    }\n\n    @action.bound onChange(selected: MapRegionDropdownOption | null): void {\n        const value = selected?.value\n        if (!value) return\n\n        // Update the current region\n        this.mapConfig.region = value\n\n        // It's confusing to have regions selected when switching to a continent\n        if (this.mapConfig.region !== MapRegionName.World) {\n            this.mapConfig.selection.deselectEntities(\n                this.mapConfig.selection.selectedRegionNames\n            )\n        }\n    }\n\n    @computed get options(): MapRegionDropdownOption[] {\n        const continentOptions: MapRegionDropdownOption[] = Object.values(\n            MapRegionName\n        ).map((region) => {\n            return {\n                value: region,\n                label: MAP_REGION_LABELS[region as MapRegionName],\n                trackNote: \"map_zoom_to_region\",\n            }\n        })\n\n        return continentOptions\n    }\n\n    @computed get value(): MapRegionDropdownOption | null {\n        const { region } = this.mapConfig\n        return this.options.find((opt) => opt.value === region) ?? null\n    }\n\n    override render(): React.ReactElement | null {\n        if (!this.showMenu) return null\n\n        return (\n            <Dropdown\n                className=\"map-region-dropdown\"\n                options={this.options}\n                onChange={this.onChange}\n                value={this.value}\n                aria-label=\"Select continent\"\n            />\n        )\n    }\n}\n"],
+  "mappings": ";;;;;;;;;;AAAA,YAAY,WAAW;AACvB,SAAS,UAAU,QAAQ,sBAAsB;AACjD,SAAS,gBAAgB;AACzB,SAAS,iBAAiB;AAC1B,SAAS,qBAAqB;AAC9B,SAAS,gBAAgB;AACzB,SAAS,yBAAyB;AAiB3B,IAAM,oBAAN,cAAgC,MAAM,UAE1C;AAAA,EACC,YAAY,OAA8C;AACtD,UAAM,KAAK;AACX,mBAAe,IAAI;AAAA,EACvB;AAAA,EAEA,OAAO,WAAW,SAA4C;AAC1D,UAAM,OAAO,IAAI,kBAAkB,EAAE,QAAQ,CAAC;AAC9C,WAAO,KAAK;AAAA,EAChB;AAAA,EAEU,IAAY,UAAoC;AACtD,WAAO,KAAK,MAAM;AAAA,EACtB;AAAA,EAEU,IAAY,YAAuB;AACzC,WAAO,KAAK,QAAQ,aAAa,IAAI,UAAU;AAAA,EACnD;AAAA,EAEU,IAAY,WAAoB;AACtC,UAAM,EAAE,YAAY,WAAW,UAAU,IAAI,KAAK;AAElD,WAAO,CAAC,EACJ;AAAA,IAEA,CAAC,WAAW,MAAM;AAAA,IAElB,EAAE,KAAK,UAAU,WAAW,cAAc,SAAS,CAAC;AAAA,EAE5D;AAAA,EAEc,SAAS,UAAgD;AACnE,UAAM,QAAQ,UAAU;AACxB,QAAI,CAAC,MAAO;AAGZ,SAAK,UAAU,SAAS;AAGxB,QAAI,KAAK,UAAU,WAAW,cAAc,OAAO;AAC/C,WAAK,UAAU,UAAU;AAAA,QACrB,KAAK,UAAU,UAAU;AAAA,MAC7B;AAAA,IACJ;AAAA,EACJ;AAAA,EAEU,IAAI,UAAqC;AAC/C,UAAM,mBAA8C,OAAO;AAAA,MACvD;AAAA,IACJ,EAAE,IAAI,CAAC,WAAW;AACd,aAAO;AAAA,QACH,OAAO;AAAA,QACP,OAAO,kBAAkB,MAAuB;AAAA,QAChD,WAAW;AAAA,MACf;AAAA,IACJ,CAAC;AAED,WAAO;AAAA,EACX;AAAA,EAEU,IAAI,QAAwC;AAClD,UAAM,EAAE,OAAO,IAAI,KAAK;AACxB,WAAO,KAAK,QAAQ,KAAK,CAAC,QAAQ,IAAI,UAAU,MAAM,KAAK;AAAA,EAC/D;AAAA,EAES,SAAoC;AACzC,QAAI,CAAC,KAAK,SAAU,QAAO;AAE3B,WACI;AAAA,MAAC;AAAA;AAAA,QACG,WAAU;AAAA,QACV,SAAS,KAAK;AAAA,QACd,UAAU,KAAK;AAAA,QACf,OAAO,KAAK;AAAA,QACZ,cAAW;AAAA;AAAA,IACf;AAAA,EAER;AACJ;AAnE0B;AAAA,EAArB;AAAA,GAbQ,kBAaa;AAIA;AAAA,EAArB;AAAA,GAjBQ,kBAiBa;AAIA;AAAA,EAArB;AAAA,GArBQ,kBAqBa;AAYR;AAAA,EAAb,OAAO;AAAA,GAjCC,kBAiCK;AAeA;AAAA,EAAb;AAAA,GAhDQ,kBAgDK;AAcA;AAAA,EAAb;AAAA,GA9DQ,kBA8DK;AA9DL,oBAAN;AAAA,EADN;AAAA,GACY;",
+  "names": []
+}

package/dist/grapher/controls/MapResetButton.d.ts

@@ -0,0 +1,33 @@
+import * as React from "react";
+import { MapConfig } from "../mapCharts/MapConfig.js";
+import { GrapherWindowType, TimeBound } from "../../utils/index.js";
+import { GlobeController } from "../mapCharts/GlobeController.js";
+interface MapResetButtonProps {
+    manager: MapResetButtonManager;
+    action: "resetView" | "resetZoom";
+}
+export interface MapResetButtonManager {
+    mapConfig?: MapConfig;
+    isOnMapTab?: boolean;
+    globeController?: GlobeController;
+    isFaceted?: boolean;
+    shouldShowEntitySelectorAs?: GrapherWindowType;
+    startHandleTimeBound?: TimeBound;
+    endHandleTimeBound?: TimeBound;
+}
+export declare class MapResetButton extends React.Component<{
+    manager: MapResetButtonManager;
+    action: "resetView" | "resetZoom";
+}> {
+    constructor(props: MapResetButtonProps);
+    static shouldShow(manager: MapResetButtonManager, action: "resetView" | "resetZoom"): boolean;
+    private get showMenu();
+    private get manager();
+    private get mapConfig();
+    private get label();
+    private get trackNote();
+    private onClick;
+    render(): React.ReactElement | null;
+}
+export {};
+//# sourceMappingURL=MapResetButton.d.ts.map

package/dist/grapher/controls/MapResetButton.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"MapResetButton.d.ts","sourceRoot":"","sources":["../../../src/grapher/controls/MapResetButton.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAG9B,OAAO,EAAE,SAAS,EAAE,MAAM,2BAA2B,CAAA;AACrD,OAAO,EACH,iBAAiB,EAEjB,SAAS,EACZ,MAAM,sBAAsB,CAAA;AAC7B,OAAO,EAAE,eAAe,EAAE,MAAM,iCAAiC,CAAA;AAKjE,UAAU,mBAAmB;IACzB,OAAO,EAAE,qBAAqB,CAAA;IAC9B,MAAM,EAAE,WAAW,GAAG,WAAW,CAAA;CACpC;AAED,MAAM,WAAW,qBAAqB;IAClC,SAAS,CAAC,EAAE,SAAS,CAAA;IACrB,UAAU,CAAC,EAAE,OAAO,CAAA;IACpB,eAAe,CAAC,EAAE,eAAe,CAAA;IACjC,SAAS,CAAC,EAAE,OAAO,CAAA;IACnB,0BAA0B,CAAC,EAAE,iBAAiB,CAAA;IAC9C,oBAAoB,CAAC,EAAE,SAAS,CAAA;IAChC,kBAAkB,CAAC,EAAE,SAAS,CAAA;CACjC;AAED,qBACa,cAAe,SAAQ,KAAK,CAAC,SAAS,CAAC;IAChD,OAAO,EAAE,qBAAqB,CAAA;IAC9B,MAAM,EAAE,WAAW,GAAG,WAAW,CAAA;CACpC,CAAC;gBACc,KAAK,EAAE,mBAAmB;IAKtC,MAAM,CAAC,UAAU,CACb,OAAO,EAAE,qBAAqB,EAC9B,MAAM,EAAE,WAAW,GAAG,WAAW,GAClC,OAAO;IAKA,OAAO,KAAK,QAAQ,GAoB7B;IAES,OAAO,KAAK,OAAO,GAE5B;IAES,OAAO,KAAK,SAAS,GAE9B;IAES,OAAO,KAAK,KAAK,GAK1B;IAES,OAAO,KAAK,SAAS,GAK9B;IAEa,OAAO,CAAC,OAAO;IAUpB,MAAM,IAAI,KAAK,CAAC,YAAY,GAAG,IAAI;CAa/C"}