wix-style-react/dist/es/src/Heading/Heading.js

wix-style-react

var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };

function _objectWithoutProperties(obj, keys) { var target = {}; for (var i in obj) { if (keys.indexOf(i) >= 0) continue; if (!Object.prototype.hasOwnProperty.call(obj, i)) continue; target[i] = obj[i]; } return target; }

import React from 'react';
import { oneOf, bool, any } from 'prop-types';
import style from './Heading.st.css';

export var APPEARANCES = {
  H1: 'H1',
  H2: 'H2',
  H3: 'H3',
  H4: 'H4',
  H5: 'H5',
  H6: 'H6'
};

var Heading = function Heading(_ref) {
  var light = _ref.light,
      appearance = _ref.appearance,
      children = _ref.children,
      rest = _objectWithoutProperties(_ref, ['light', 'appearance', 'children']);

  /* eslint-disable no-unused-vars */
  var dataHook = rest.dataHook,
      headingProps = _objectWithoutProperties(rest, ['dataHook']);

  return React.createElement(appearance.toLowerCase(), _extends({}, headingProps, style('root', { light: light, appearance: appearance }, rest)), children);
};

Heading.displayName = 'Heading';

Heading.propTypes = {
  /** any nodes to be rendered (usually text nodes) */
  children: any,

  /** is the text has dark or light skin */
  light: bool,

  /** typography of the heading */
  appearance: oneOf(Object.keys(APPEARANCES))
};

Heading.defaultProps = {
  appearance: APPEARANCES.H1,
  light: false
};

export default Heading;