@massds/mayflower-react
Version:
React versions of Mayflower design system UI components
43 lines • 1.85 kB
JavaScript
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); }
/**
* FootNoteLink module.
* @module @massds/mayflower-react/FootNoteLink
* @requires module:@massds/mayflower-assets/scss/01-atoms/footnote-link
*/
import React from "react";
import PropTypes from "prop-types";
let FootNoteLink = /*#__PURE__*/function (_React$Component) {
function FootNoteLink() {
return _React$Component.apply(this, arguments) || this;
}
_inheritsLoose(FootNoteLink, _React$Component);
var _proto = FootNoteLink.prototype;
_proto.handleScroll = function handleScroll() {
const element = document.getElementById("footnotemsg" + this.props.index);
element.scrollIntoView({
block: 'end',
behavior: 'smooth'
});
};
_proto.render = function render() {
const index = this.props.index;
return /*#__PURE__*/React.createElement("button", {
type: "button",
className: "ma__footnote-link footnoteref" + index,
"aria-describedby": "footnotemsg" + index,
"aria-label": "see footnote " + index,
onClick: () => this.handleScroll(),
tabIndex: "0",
role: "link"
}, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement("sup", null, "[", index, "]")));
};
return FootNoteLink;
}(React.Component);
FootNoteLink.propTypes = process.env.NODE_ENV !== "production" ? {
/** Pair the FootNoteLink molecule with the FootNote.
The number/index of the footnote item you are referencing.
If this is the second footnote on the page, `i` would be 2. */
index: PropTypes.string
} : {};
export default FootNoteLink;