@macrostrat/map-interface 2.0.2 → 2.2.0

package/dist/location-details/xdd-panel/journal.d.ts

@@ -1,20 +0,0 @@
-export interface XDDSnippet {
-    pubname: string;
-    publisher: string;
-    _gddid: string;
-    title: string;
-    doi: string;
-    coverDate: string;
-    URL: string;
-    authors: string;
-    hits: number;
-    highlight: string[];
-}
-type JournalProps = {
-    articles: XDDSnippet[];
-    name: string;
-    publisher: string;
-    nestedExpanded?: boolean;
-};
-export declare function JournalLegacy(props: JournalProps): import('react').FunctionComponentElement<any>;
-export {};

package/dist/location-details/xdd-panel/journal.js

@@ -1,25 +0,0 @@
-import { Article } from "./article.js";
-import "@blueprintjs/core";
-import h from "@macrostrat/hyper";
-import { SubExpansionPanel } from "@macrostrat/map-interface";
-function JournalLegacy(props) {
-  const { articles, name, publisher, nestedExpanded } = props;
-  articles[0].pubname;
-  return h(
-    SubExpansionPanel,
-    {
-      title: name,
-      helpText: publisher,
-      expanded: nestedExpanded
-    },
-    [
-      articles.map((article, i) => {
-        return h(Article, { key: i, data: article });
-      })
-    ]
-  );
-}
-export {
-  JournalLegacy
-};
-//# sourceMappingURL=journal.js.map

package/dist/location-details/xdd-panel/journal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"journal.js","sources":["../../../src/location-details/xdd-panel/journal.ts"],"sourcesContent":["import { Article } from \"./article\";\nimport { Divider } from \"@blueprintjs/core\";\nimport h from \"@macrostrat/hyper\";\nimport { SubExpansionPanel } from \"@macrostrat/map-interface\";\n\nexport interface XDDSnippet {\n  pubname: string;\n  publisher: string;\n  _gddid: string;\n  title: string;\n  doi: string;\n  coverDate: string;\n  URL: string;\n  authors: string;\n  hits: number;\n  highlight: string[];\n}\n\nfunction Journal(props) {\n  return h(\"div.journal\", [\n    h(\"div.journal-title\", [\n      h(\"h2.journal-title-text\", [\n        props.data.name,\n        h(\"small.journal-source\", [props.data]),\n      ]),\n    ]),\n    h(Divider),\n    props.data.articles.map((article, i) => {\n      return h(Article, { key: i, data: article });\n    }),\n  ]);\n}\n\ntype JournalProps = {\n  articles: XDDSnippet[];\n  name: string;\n  publisher: string;\n  nestedExpanded?: boolean;\n};\n\n// Still up for review\nexport function JournalLegacy(props: JournalProps) {\n  const { articles, name, publisher, nestedExpanded } = props;\n\n  const helpText = articles[0].pubname;\n\n  return h(\n    SubExpansionPanel,\n    {\n      title: name,\n      helpText: publisher,\n      expanded: nestedExpanded,\n    },\n    [\n      articles.map((article, i) => {\n        return h(Article, { key: i, data: article });\n      }),\n    ],\n  );\n}\n"],"names":[],"mappings":";;;;AAyCO,SAAS,cAAc,OAAqB;AACjD,QAAM,EAAE,UAAU,MAAM,WAAW,mBAAmB;AAErC,WAAS,CAAC,EAAE;AAE7B,SAAO;AAAA,IACL;AAAA,IACA;AAAA,MACE,OAAO;AAAA,MACP,UAAU;AAAA,MACV,UAAU;AAAA,IAAA;AAAA,IAEZ;AAAA,MACE,SAAS,IAAI,CAAC,SAAS,MAAM;AAC3B,eAAO,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,SAAS;AAAA,MAC7C,CAAC;AAAA,IAAA;AAAA,EACH;AAEJ;"}

package/src/expansion-panel/headers.ts

@@ -1,18 +0,0 @@
-import hyper from "@macrostrat/hyper";
-import styles from "./main.module.sass";
-
-const h = hyper.styled(styles);
-
-export function PanelSubhead(props) {
-  const { title, component = "h3", children, ...rest } = props;
-  return h("div.panel-subhead", rest, [
-    h(
-      component,
-      {
-        className: "title",
-      },
-      title,
-    ),
-    children,
-  ]);
-}

package/src/expansion-panel/index.ts

@@ -1,135 +0,0 @@
-import { useState } from "react";
-import { Collapse, Icon } from "@blueprintjs/core";
-import hyper from "@macrostrat/hyper";
-import styles from "./main.module.sass";
-import classNames from "classnames";
-import { Button } from "@blueprintjs/core";
-import { PanelSubhead } from "./headers";
-
-const h = hyper.styled(styles);
-
-function ExpansionPanelSummary(props) {
-  const { expanded, children, onChange, className, title, titleComponent } =
-    props;
-  const icon = expanded ? "chevron-up" : "chevron-down";
-  return h(
-    PanelSubhead,
-    {
-      className: classNames("expansion-panel-header", className),
-      onClick: onChange,
-      title,
-      component: titleComponent,
-    },
-    [children, h(Icon, { icon, className: "expansion-panel-icon" })],
-  );
-}
-
-function ExpansionPanelBase(props) {
-  let {
-    title,
-    titleComponent = "h3",
-    children,
-    expanded,
-    helpText,
-    onChange = () => {},
-    sideComponent = null,
-    className,
-  } = props;
-  const [isOpen, setOpen] = useState(expanded || false);
-
-  const onChange_ = () => {
-    onChange();
-    setOpen(!isOpen);
-  };
-
-  return h(
-    "div.expansion-panel-base",
-    {
-      className: classNames(className, {
-        expanded: isOpen,
-        collapsed: !isOpen,
-      }),
-    },
-    [
-      h(
-        ExpansionPanelSummary,
-        {
-          onChange: onChange_,
-          expanded: isOpen,
-          title,
-          titleComponent,
-        },
-        h("div.expansion-summary-title-help", [
-          h("span.expansion-panel-subtext", helpText),
-          " ",
-          sideComponent,
-        ]),
-      ),
-      h(Collapse, { isOpen }, h("div.expansion-children", null, children)),
-    ],
-  );
-}
-
-export function InfoPanelSection(props) {
-  let { title, children, className, headerElement = null } = props;
-  return h("div.info-panel-section", { className }, [
-    h("div.panel-subhead", null, headerElement ?? h("h3", title)),
-    h("div.panel-content", null, children),
-  ]);
-}
-
-function ExpansionPanel(props) {
-  return h(ExpansionPanelBase, {
-    ...props,
-    className: "expansion-panel",
-  });
-}
-
-function SubExpansionPanel(props) {
-  return h(ExpansionPanelBase, {
-    ...props,
-    className: "expansion-panel sub-expansion-panel",
-    titleComponent: "h4",
-  });
-}
-
-function ExpandableDetailsPanel(props) {
-  let { title, children, value, headerElement, className } = props;
-  const [isOpen, setIsOpen] = useState(false);
-  headerElement ??= h([h("div.title", title), value]);
-  return h("div.expandable-details", { className }, [
-    h("div.expandable-details-main", [
-      h("div.expandable-details-header", headerElement),
-      h("div.expandable-details-toggle", [
-        h(Button, {
-          small: true,
-          minimal: true,
-          active: isOpen,
-          onClick: () => setIsOpen(!isOpen),
-          icon: "more",
-        }),
-      ]),
-    ]),
-    h(
-      Collapse,
-      { isOpen },
-      h("div.expandable-details-children", null, children),
-    ),
-  ]);
-}
-
-function ExpansionBody({ title, className, children }) {
-  return h("div.expansion-body", { className }, [
-    h("div.expansion-panel-detail-header", title),
-    h("div.expansion-panel-detail-body", null, children),
-  ]);
-}
-
-export {
-  ExpansionPanel,
-  ExpansionPanelSummary,
-  ExpandableDetailsPanel,
-  SubExpansionPanel,
-  ExpansionBody,
-  PanelSubhead,
-};

package/src/expansion-panel/main.module.sass

@@ -1,157 +0,0 @@
-
-.panel-subhead
-  padding: 0 1rem
-  border: 1px solid var(--panel-rule-color)
-  border-bottom: 1px solid var(--panel-rule-color)
-  background-color: var(--accent-color)
-  display: flex
-  flex-direction: row
-  align-items: center
-  z-index: 1
-  gap: var(--panel-header-gap, 0.5rem)
-  top: -1px
-  position: sticky
-  min-height: var(--panel-header-height, 40px)
-  h1, h2, h3, h4
-    font-family: Montserrat,sans-serif
-    font-weight: 700
-    margin: 0
-  h4
-    font-weight: 600
-  .title
-    flex-grow: 1
-
-  .expansion-panel-icon
-    margin-right: -0.35em
-
-// :global(.bp6-dark) .panel-subhead
-//   margin 0 1px
-
-.info-panel-section
-  &>.panel-subhead
-    margin: -1px calc(var(--panel-padding-h) * -1) 0
-
-.expansion-panel
-  padding: 0
-  flex-wrap: wrap
-  margin-top: -1px
-  // &.collapsed
-  //   .expansion-panel-header
-  //     border-bottom-width: 0;
-
-.sub-expansion-panel
-  margin: -1px calc(var(--panel-padding-h) * -0.5) 0
-  overflow: hidden
-  &:first-child
-    .expansion-panel-header
-      border-top-width: 0
-  .panel-subhead
-    border-top: none
-    border-bottom: none
-
-  .expansion-panel-header
-    background-color: var(--accent-secondary-color)
-    cursor: pointer
-    padding: 0 1rem
-
-    &:hover
-      background-color: var(--accent-secondary-hover-color)
-    h2, h3, h4
-      font-weight: 500
-      border-bottom: 1px solid var(--tertiary-border-color)
-      border-top: 1px solid var(--tertiary-border-color)
-      align-items: center
-
-.expansion-summary-title-help
-  margin-left: 5px
-  :global(.bp6-icon)
-    margin-left: 5px
-
-.expansion-panel-header
-  cursor: pointer
-  &:hover
-    background-color: var(--accent-hover-color)
-  :global(.bp6-icon)
-    transform: translate(0,3px)
-
-.expansion-children
-  padding: 0 1rem
-  .expansion-panel
-    margin-left: -1rem
-    margin-right: -1rem
-    &:first-child
-      margin-top: 0
-  &>:first-child
-    margin-top: 1rem
-  &>:last-child
-    margin-bottom: 1rem
-
-
-
-.expansion-panel-subtext
-  font-size: 85%
-  font-weight: 400
-
-:global
-  .expansion-panel-root
-    padding-left: 15px !important
-
-  .expansion-panel-detail
-    display: block !important
-    padding: 0 !important
-
-  .expansion-panel-detail-sub
-    display: block !important
-
-// New expandable panel for details
-.expandable-details-main
-  display: flex
-  flex-direction: row
-  align-items: center
-  justify-content: space-between
-  margin: 3px 0
-
-.expandable-details-header
-  display: inline-flex
-  flex-direction: row
-  align-items: baseline
-  flex-grow: 1
-
-.expandable-details-children
-  position: relative
-
-.expandable-details-toggle
-  :global(.bp6-button)
-    font-size: 10px
-
-.expandable-details
-  &.macrostrat-unit
-    .title:after
-      content: none
-  .title
-    margin-right: 1em
-    &:after
-      content: ":"
-
-.expansion-body
-  display: inline-block
-  //flex-direction row
-  align-items: baseline
-  background-color: var(--tertiary-background)
-  padding: 2px 6px
-  border-radius: 4px
-  width: 100%
-  box-shadow: 0px 1px 2px 1px rgba(0,0,0,0.2)
-  margin-bottom: 6px
-
-.expansion-panel-detail-header
-  font-size: 90%
-  font-style: italic
-  margin-right: 1em
-  display: inline
-  color: var(--secondary-color)
-  &:after
-    content: ":"
-
-.expansion-panel-detail-body
-  display: inline

package/src/location-details/fetch.ts

@@ -1,57 +0,0 @@
-import { useAPIResult } from "@macrostrat/ui-components";
-
-const apiV2Prefix = `https://dev.macrostrat.org/api/v2`;
-const gddDomain = `https://xdd.wisc.edu`;
-const paleobioDomain = `https://paleobiodb.org`;
-
-export function fetchMapInfo(lng, lat, z) {
-  return useAPIResult(`${apiV2Prefix}/mobile/map_query_v2`, {
-    lng,
-    lat,
-    z,
-  })?.success?.data;
-}
-
-export function fetchColumnInfo(lng, lat) {
-  return useAPIResult(`${apiV2Prefix}/columns`, {
-    lat,
-    lng,
-    response: "long",
-  })?.success?.data?.[0];
-}
-
-export function fetchXddInfo(stratNames) {
-  return useAPIResult(`${gddDomain}/api/v1/snippets`, {
-    article_limit: 20,
-    term: stratNames?.map((d) => d.rank_name).join(","),
-  })?.success?.data;
-}
-
-export function fetchFossilInfo(lng, lat) {
-  const collectionResponse = useAPIResult(
-    `${paleobioDomain}/data1.2/colls/list.json?lngmin=${lng - 0.1}&lngmax=${lng + 0.1}&latmin=${lat - 0.1}&latmax=${lat + 0.1}`,
-  )?.records;
-
-  const occurrences = useAPIResult(
-    `${paleobioDomain}/data1.2/occs/list.json?lngmin=${lng - 0.1}&lngmax=${lng + 0.1}&latmin=${lat - 0.1}&latmax=${lat + 0.1}`,
-  )?.records;
-
-  if (!collectionResponse || !occurrences) {
-    return null;
-  }
-
-  try {
-    return collectionResponse.map((col) => {
-      col.occurrences = [];
-      occurrences.forEach((occ) => {
-        if (occ.cid === col.oid) {
-          col.occurrences.push(occ);
-        }
-      });
-      return col;
-    });
-  } catch (error) {
-    console.log(error);
-    return [];
-  }
-}

package/src/location-details/location-details.stories.ts

@@ -1,92 +0,0 @@
-import { ComponentMeta } from "@storybook/react-vite";
-import h from "@macrostrat/hyper";
-import { RegionalStratigraphy } from "./reg-strat";
-import { Physiography } from "./physiography";
-import { MacrostratLinkedData } from "./macrostrat-linked";
-import { XddExpansion } from "./xdd-panel";
-import {
-  fetchMapInfo,
-  fetchColumnInfo,
-  fetchXddInfo,
-  fetchFossilInfo,
-} from "./fetch";
-import { FossilCollections } from "./fossil-collections";
-
-export default {
-  title: "Map interface/Location panel details",
-  // More on argTypes: https://storybook.js.org/docs/react/api/argtypes
-  args: {},
-} as ComponentMeta<any>;
-
-const lat = 44.60085563149249;
-const lng = -96.16783150353609;
-const zoom = 3.9392171056922325;
-
-export function RegionalStratigraphyExample() {
-  const mapInfo = fetchMapInfo(lng, lat, zoom);
-  const columnInfo = fetchColumnInfo(lng, lat);
-
-  return h(RegionalStratigraphy, {
-    mapInfo,
-    columnInfo,
-    columnURL: "https://dev.macrostrat.org/columns/",
-    expanded: true,
-  });
-}
-
-export function PhysiographyExample() {
-  const mapInfo = fetchMapInfo(lng, lat, zoom);
-
-  return h(Physiography, {
-    mapInfo,
-    expanded: true,
-  });
-}
-
-export function MacrostratLinkedDataExample() {
-  const mapInfo = fetchMapInfo(lng, lat, zoom);
-
-  if (mapInfo == null) {
-    return null;
-  }
-
-  const source =
-    mapInfo && mapInfo?.mapData && mapInfo?.mapData.length
-      ? mapInfo?.mapData[0]
-      : {
-          name: null,
-          descrip: null,
-          comments: null,
-          liths: [],
-          b_int: {},
-          t_int: {},
-          ref: {},
-        };
-
-  return h(MacrostratLinkedData, {
-    mapInfo,
-    source,
-    stratNameURL: "https://dev.macrostrat.org/lex/strat-names",
-    environmentURL: "https://dev.macrostrat.org/lex/environments",
-    intervalURL: "https://dev.macrostrat.org/lex/intervals",
-    lithologyURL: "https://dev.macrostrat.org/lex/lithologies",
-    expanded: true,
-  });
-}
-
-export function xddInfoExample() {
-  const mapInfo = fetchMapInfo(lng, lat, zoom);
-  const xddInfo = fetchXddInfo(mapInfo?.mapData?.[0]?.macrostrat?.strat_names);
-
-  if (!xddInfo) {
-    return null;
-  }
-
-  return h(XddExpansion, { xddInfo, expanded: true, nestedExpanded: true });
-}
-
-export function FossilsExample() {
-  const fossilInfo = fetchFossilInfo(-89.3938453, 43.0735407);
-
-  return h(FossilCollections, { data: fossilInfo, expanded: true });
-}

package/src/location-details/xdd-panel/article.ts

@@ -1,67 +0,0 @@
-import React, { useState } from "react";
-import { Collapse, Button } from "@blueprintjs/core";
-import { AuthorList } from "@macrostrat/ui-components";
-import h from "@macrostrat/hyper";
-
-export function Article(props) {
-  const [expanded, setExpanded] = useState(false);
-  const { data } = props;
-
-  const toggleExpand = () => {
-    setExpanded(!expanded);
-  };
-
-  // Attempt to pull out only the year and not the whole date
-  let year;
-  try {
-    year = data.coverDate ? data.coverDate.match(/\d{4}/)[0] : "";
-  } catch (e) {
-    year = "";
-  }
-
-  const authors = data?.authors?.split("; ") ?? [];
-
-  const authorList =
-    authors.length > 0 ? h(AuthorList, { names: authors }) : "Unknown";
-
-  const iconName = expanded ? "chevron-up" : "chevron-down";
-
-  return h("div.article", [
-    h("div.article-title", [
-      h("p.article-author", [authorList, year.length ? ` ${year}. ` : ""]),
-      h(
-        "a.title-link",
-        { href: data.URL, target: "_blank" },
-        h("strong", [data.title + "."]),
-      ),
-      h(
-        "span",
-        {},
-        h(Button, {
-          onClick: toggleExpand,
-          minimal: true,
-          rightIcon: iconName,
-          className: "flat-btn",
-        }),
-      ),
-    ]),
-    h(
-      Collapse,
-      { isOpen: expanded },
-      h(
-        "span",
-        { className: expanded ? "" : "hidden" },
-        h(
-          "div.quotes",
-          {},
-          data.highlight.map((snippet, si) =>
-            h("p.gdd-snippet", {
-              key: si,
-              dangerouslySetInnerHTML: { __html: `...${snippet}...` },
-            }),
-          ),
-        ),
-      ),
-    ),
-  ]);
-}

package/src/location-details/xdd-panel/index.ts

@@ -1,70 +0,0 @@
-import { Spinner } from "@blueprintjs/core";
-import h from "@macrostrat/hyper";
-import { XDDSnippet, JournalLegacy } from "./journal";
-import { ExpansionPanel } from "@macrostrat/map-interface";
-
-export function XddExpansion({
-  xddInfo,
-  expanded = false,
-  nestedExpanded = true,
-}) {
-  return h(xDDPanelCore, {
-    className: "regional-panel",
-    data: xddInfo,
-    isFetching: xddInfo == undefined || xddInfo.length === 0,
-    expanded,
-    nestedExpanded,
-  });
-}
-
-export function xDDPanelCore({
-  isFetching,
-  data: xddInfo,
-  expanded,
-  nestedExpanded,
-  ...rest
-}) {
-  const groupedData = groupSnippetsByJournal(xddInfo);
-
-  return h(
-    ExpansionPanel,
-    {
-      className: "regional-panel",
-      title: "Primary literature",
-      helpText: "via xDD",
-      ...rest,
-      expanded,
-    },
-    [
-      h.if(isFetching)(Spinner),
-      h.if(!isFetching && xddInfo.length > 0)([
-        Array.from(groupedData.entries())?.map(([journal, snippets]) => {
-          return h(JournalLegacy, {
-            nestedExpanded,
-            name: journal,
-            articles: snippets,
-            publisher: snippets[0].publisher,
-            key: journal,
-          });
-        }),
-      ]),
-    ],
-  );
-}
-
-function groupSnippetsByJournal(
-  snippets: XDDSnippet[],
-): Map<string, XDDSnippet[]> {
-  const journals = new Map<string, XDDSnippet[]>();
-  if (!snippets || snippets.length === 0) {
-    return journals;
-  }
-  for (let snippet of snippets) {
-    const { pubname: journal } = snippet;
-    if (!journals.has(journal)) {
-      journals.set(journal, []);
-    }
-    journals.get(journal).push(snippet);
-  }
-  return journals;
-}