@massds/mayflower-react/dist/FootNote/index.mjs

React versions of Mayflower design system UI components

function _inheritsLoose(t, o) { t.prototype = Object.create(o.prototype), t.prototype.constructor = t, _setPrototypeOf(t, o); }
function _setPrototypeOf(t, e) { return _setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function (t, e) { return t.__proto__ = e, t; }, _setPrototypeOf(t, e); }
/**
 * FootNote module.
 * @module @massds/mayflower-react/FootNote
 * @requires module:@massds/mayflower-assets/scss/01-atoms/footnote
 */
import React from "react";
import PropTypes from "prop-types";
let FootNote = /*#__PURE__*/function (_React$Component) {
  function FootNote() {
    return _React$Component.apply(this, arguments) || this;
  }
  _inheritsLoose(FootNote, _React$Component);
  var _proto = FootNote.prototype;
  _proto.handleScroll = function handleScroll() {
    const element = document.getElementsByClassName("footnoteref" + this.props.index)[0];
    element.scrollIntoView({
      block: 'start',
      behavior: 'smooth'
    });
  };
  _proto.render = function render() {
    const _this$props = this.props,
      children = _this$props.children,
      index = _this$props.index;
    return /*#__PURE__*/React.createElement("div", {
      className: "ma__footnote-item"
    }, /*#__PURE__*/React.createElement("button", {
      type: "button",
      id: "footnotemsg" + index,
      onClick: () => this.handleScroll()
    }, /*#__PURE__*/React.createElement("span", {
      className: "ma__footnote-item-content",
      dangerouslySetInnerHTML: {
        __html: index + ". " + children
      }
    })));
  };
  return FootNote;
}(React.Component);
FootNote.propTypes = process.env.NODE_ENV !== "production" ? {
  /** Pair the FootNote molecule with the FootNoteLink.
  The number/index of the footnote item.
  If this is the second footnote on the page, `i` would be 2. */
  index: PropTypes.string,
  children: PropTypes.node
} : {};
export default FootNote;