web-toolkit/lib/components/Heading.js

A GTK inspired toolkit designed to build awesome web apps

"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));

var _react = _interopRequireDefault(require("react"));

var _clsx = _interopRequireDefault(require("clsx"));

var _reactChildrenUtilities = require("react-children-utilities");

/*
 * Heading.js
 */
var defaultProps = {
  as: 'h1',
  anchor: true
};

function Heading(_ref) {
  var as = _ref.as,
      children = _ref.children,
      className = _ref.className,
      weight = _ref.weight,
      anchor = _ref.anchor,
      rest = (0, _objectWithoutProperties2.default)(_ref, ["as", "children", "className", "weight", "anchor"]);
  var Component = as;
  var id = anchor ? toID((0, _reactChildrenUtilities.onlyText)(children)) : undefined;
  return /*#__PURE__*/_react.default.createElement(Component, Object.assign({
    id: id,
    className: (0, _clsx.default)('Heading', className, weight ? "weight-".concat(weight) : undefined)
  }, rest), anchor && /*#__PURE__*/_react.default.createElement("a", {
    className: "Heading__anchor link",
    href: "#".concat(id)
  }, "#"), children);
}

Heading.defaultProps = defaultProps;
var _default = Heading;
exports.default = _default;

function toID(string) {
  return string.toLowerCase().replace(/\W+/g, '-');
}
//# sourceMappingURL=Heading.js.map