@macrostrat/column-components/dist/editor/facies/description.js

React rendering primitives for stratigraphic columns

import { Component } from "react";
import h from "@macrostrat/hyper";
import classNames from "classnames";
import { FaciesSwatch } from "./swatch.js";
import { FaciesContext } from "../../context/facies.js";
function FaciesCard({ facies }) {
  return h("div.header", [
    h("p.name", { style: { marginRight: 20, textAlign: "left" } }, facies.name),
    h(FaciesSwatch, { facies })
  ]);
}
class FaciesDescriptionSmall extends Component {
  constructor(props) {
    super(props);
    this.renderEach = this.renderEach.bind(this);
  }
  static contextType = FaciesContext;
  static defaultProps = { selected: null, isEditable: false };
  renderEach(d) {
    let onClick = null;
    const style = {};
    if (this.props.onClick != null) {
      onClick = () => this.props.onClick(d);
      style.cursor = "pointer";
    }
    const { selected } = this.props;
    if (selected === d.id) {
      style.backgroundColor = d.color;
      style.color = "white";
    }
    const className = classNames({ selected: selected === d.id });
    return h(
      "div.facies.bp3-card.bp3-elevation-0",
      {
        key: d.id,
        onClick,
        style,
        className
      },
      h(FaciesCard, { facies: d })
    );
  }
  render() {
    const { facies } = this.context;
    return h("div.facies-description-small", [
      h("h5", "Facies"),
      h("div", facies.map(this.renderEach))
    ]);
  }
}
export {
  FaciesCard,
  FaciesDescriptionSmall
};
//# sourceMappingURL=description.js.map