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

React versions of Mayflower design system UI components

"use strict";

exports.__esModule = true;
exports["default"] = void 0;
var _react = _interopRequireDefault(require("react"));
var _propTypes = _interopRequireDefault(require("prop-types"));
function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default": e }; }
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
 */
var 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() {
    var element = document.getElementsByClassName("footnoteref" + this.props.index)[0];
    element.scrollIntoView({
      block: 'start',
      behavior: 'smooth'
    });
  };
  _proto.render = function render() {
    var _this = this;
    var _this$props = this.props,
      children = _this$props.children,
      index = _this$props.index;
    return /*#__PURE__*/_react["default"].createElement("div", {
      className: "ma__footnote-item"
    }, /*#__PURE__*/_react["default"].createElement("button", {
      type: "button",
      id: "footnotemsg" + index,
      onClick: function onClick() {
        return _this.handleScroll();
      }
    }, /*#__PURE__*/_react["default"].createElement("span", {
      className: "ma__footnote-item-content",
      dangerouslySetInnerHTML: {
        __html: index + ". " + children
      }
    })));
  };
  return FootNote;
}(_react["default"].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["default"].string,
  children: _propTypes["default"].node
} : {};
var _default = exports["default"] = FootNote;
module.exports = exports.default;