@retailmenot/anchor/esm/hero.js

A React UI Library by RetailMeNot

import { a as _taggedTemplateLiteral } from './anchor-chunk-7b9d8557.js';
import { a as __rest } from './anchor-chunk-27f34e54.js';
import { a as Typography } from './anchor-chunk-5b0bbe0b.js';
import { forwardRef, createElement, useContext, useState, Children, Fragment, useEffect, useRef, createRef, Component, cloneElement, useReducer, PureComponent, isValidElement, createContext, useImperativeHandle } from 'react';
import classNames from 'classnames';
import styled, { css } from '@xstyled/styled-components';
import { th, space } from '@xstyled/system';
import './anchor-chunk-cd7ef49a.js';

function _templateObject3() {
  var data = _taggedTemplateLiteral(["\n    text-shadow: 0 0.125rem 0.125rem rgba(0, 0, 0, 0.04);\n    position: relative;\n    display: block;\n    ", "\n"]);

  _templateObject3 = function _templateObject3() {
    return data;
  };

  return data;
}

function _templateObject2() {
  var data = _taggedTemplateLiteral(["\n    text-shadow: 0 0.125rem 0.25rem rgba(0, 0, 0, 0.09);\n    position: relative;\n    ", "\n"]);

  _templateObject2 = function _templateObject2() {
    return data;
  };

  return data;
}

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n    box-sizing: border-box;\n    position: relative;\n    width: 100%;\n    margin: 0 auto;\n    display: block;\n    display: flex;\n    flex-direction: column;\n    justify-content: center;\n    ", "\n    ", "\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}
var StyledHero = styled('section')(_templateObject(), function (_ref) {
  var background = _ref.background,
      _ref$color = _ref.color,
      color = _ref$color === void 0 ? 'white' : _ref$color,
      align = _ref.align,
      minHeight = _ref.minHeight;
  return css({
    background: th.color(background),
    color: color,
    minHeight: minHeight,
    textAlign: align
  });
}, space);
var Hero = function Hero(_a) {
  var _a$background = _a.background,
      background = _a$background === void 0 ? 'transparent' : _a$background,
      _a$align = _a.align,
      align = _a$align === void 0 ? 'center' : _a$align,
      _a$minHeight = _a.minHeight,
      minHeight = _a$minHeight === void 0 ? '7.5rem' : _a$minHeight,
      className = _a.className,
      children = _a.children,
      props = __rest(_a, ["background", "align", "minHeight", "className", "children"]);

  return createElement(StyledHero, Object.assign({
    className: classNames('anchor-hero', className),
    background: background,
    align: align,
    minHeight: minHeight
  }, props), children);
}; // Hero.Title
// ------------------------------------------------------------------------------------------------------------------

var StyledTitle = styled(Typography)(_templateObject2(), space);
var HeroTitle = function HeroTitle(_a) {
  var className = _a.className,
      children = _a.children,
      _a$weight = _a.weight,
      weight = _a$weight === void 0 ? 600 : _a$weight,
      _a$scale = _a.scale,
      scale = _a$scale === void 0 ? 32 : _a$scale,
      _a$as = _a.as,
      as = _a$as === void 0 ? 'h1' : _a$as,
      props = __rest(_a, ["className", "children", "weight", "scale", "as"]);

  return createElement(StyledTitle, Object.assign({
    className: classNames('anchor-hero-title', className),
    weight: weight,
    scale: scale,
    as: as
  }, props), children);
};
Hero.Title = HeroTitle; // Hero.Subtitle
// ------------------------------------------------------------------------------------------------------------------

var StyledSubtitle = styled(Typography)(_templateObject3(), space);
var HeroSubtitle = function HeroSubtitle(_a) {
  var className = _a.className,
      children = _a.children,
      _a$scale2 = _a.scale,
      scale = _a$scale2 === void 0 ? 18 : _a$scale2,
      _a$weight2 = _a.weight,
      weight = _a$weight2 === void 0 ? 600 : _a$weight2,
      props = __rest(_a, ["className", "children", "scale", "weight"]);

  return createElement(StyledSubtitle, Object.assign({
    className: classNames('anchor-hero-subtitle', className),
    scale: scale,
    weight: weight
  }, props), children);
};
Hero.Subtitle = HeroSubtitle;

export { Hero };
//# sourceMappingURL=hero.js.map