import _omit from "ramda/src/omit";
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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; }; return _extends.apply(this, arguments); }
import React from 'react';
import styled from 'styled-components';
import { assert, getAriaProps } from '../../common/utils';
var WEIGHTS = {
  regular: 400,
  semibold: 600,
  bold: 700,
  extrabold: 800
};
var SMALL_DEVICE_BP = 'sm';
var getColor = function getColor(props) {
  var color = props.color,
    theme = props.theme;
  if (color && typeof color === 'function') {
    return color(theme);
  }
  if (color === 'inherit') {
    return 'inherit';
  }
  return theme.colorTokens.neutral.text_default;
};
export var TYPOGRAPHY_TYPES = {
  primary: 'primary',
  secondary: 'secondary',
  tertiary: 'tertiary',
  caption: 'caption',
  title1: 'title1',
  title2: 'title2',
  title3: 'title3',
  hero: 'hero'
};
var getTypeStyles = function getTypeStyles(props) {
  var _allowedWeights;
  var type = props.type,
    weight = props.weight,
    theme = props.theme,
    lineHeight = props.lineHeight;
  var mobile;
  var desktop = null;
  var defaultWeight;
  var allowedWeights = ['regular', 'semibold', 'bold', 'extrabold'];
  switch (type) {
    case TYPOGRAPHY_TYPES.primary:
      mobile = {
        size: 16,
        lineHeight: theme.spacing.unit(6)
      };
      defaultWeight = 'regular';
      break;
    case TYPOGRAPHY_TYPES.secondary:
      mobile = {
        size: 14,
        lineHeight: theme.spacing.unit(5)
      };
      defaultWeight = 'regular';
      allowedWeights = ['regular', 'bold', 'semibold'];
      break;
    case TYPOGRAPHY_TYPES.tertiary:
      mobile = {
        size: 12,
        lineHeight: theme.spacing.unit(4)
      };
      defaultWeight = 'regular';
      allowedWeights = ['regular', 'bold'];
      break;
    case TYPOGRAPHY_TYPES.caption:
      mobile = {
        size: 10,
        lineHeight: theme.spacing.unit(4)
      };
      defaultWeight = 'regular';
      allowedWeights = ['regular', 'bold'];
      break;
    case TYPOGRAPHY_TYPES.title1:
      mobile = {
        size: 24,
        lineHeight: theme.spacing.unit(7)
      };
      desktop = {
        size: 28,
        lineHeight: theme.spacing.unit(8)
      };
      defaultWeight = 'extrabold';
      break;
    case TYPOGRAPHY_TYPES.title2:
      mobile = {
        size: 20,
        lineHeight: theme.spacing.unit(6)
      };
      desktop = {
        size: 24,
        lineHeight: theme.spacing.unit(7)
      };
      defaultWeight = 'extrabold';
      break;
    case TYPOGRAPHY_TYPES.title3:
      mobile = {
        size: 18,
        lineHeight: theme.spacing.unit(6)
      };
      desktop = {
        size: 20,
        lineHeight: theme.spacing.unit(6)
      };
      defaultWeight = 'extrabold';
      break;
    case TYPOGRAPHY_TYPES.hero:
      mobile = {
        size: 46,
        lineHeight: theme.spacing.unit(12)
      };
      desktop = {
        size: 48,
        lineHeight: theme.spacing.unit(13)
      };
      defaultWeight = 'extrabold';
      allowedWeights = ['bold', 'extrabold'];
      break;
    default:
      mobile = {
        size: 16,
        lineHeight: theme.spacing.unit(6)
      };
      defaultWeight = 'regular';
  }
  var getFontSize = function getFontSize(mode) {
    return "".concat(mode.size ? "font-size: ".concat(mode.size, "px;") : '');
  };
  var getLineHeight = function getLineHeight(mode) {
    if (lineHeight) {
      return 'line-height: inherit';
    }
    return "".concat(mode.lineHeight ? "line-height: ".concat(mode.lineHeight / mode.size, ";") : '');
  };
  assert(allowedWeights.includes(weight || defaultWeight), "\"".concat(weight, "\" is not one of the allowed weights for ").concat(type, ": ").concat((_allowedWeights = allowedWeights) === null || _allowedWeights === void 0 ? void 0 : _allowedWeights.map(function (s) {
    return "\"".concat(s, "\"");
  }).join(', ')));
  return "\n    font-weight: ".concat(weight && allowedWeights.includes(weight) ? WEIGHTS[weight] : WEIGHTS[defaultWeight], ";\n    ").concat(getFontSize(mobile), "\n    ").concat(getLineHeight(mobile), "\n\n    ").concat(desktop ? "\n          ".concat(theme.media.greaterThan(theme.breakpoints[SMALL_DEVICE_BP]), " {\n            ").concat(getFontSize(desktop), "\n            ").concat(getLineHeight(desktop), "\n          }\n        ") : '', "\n\n  ");
};
var Span = styled.span.withConfig({
  displayName: "Typography__Span",
  componentId: "sc-10mju41-0"
})([""]);
var CleanSpan = React.forwardRef(function (props, ref) {
  return React.createElement(Span, _extends({
    ref: ref,
    as: props.forwardedAs
  }, _omit(['color', 'type', 'weight', 'lineHeight', 'textAlign'])(props)));
});
var StyledTypography = styled(CleanSpan).withConfig({
  displayName: "Typography__StyledTypography",
  componentId: "sc-10mju41-1"
})(["font-family:'Nordnet Sans Mono',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;color:", ";margin:0;", " ", " ", ""], function (p) {
  return getColor(p);
}, function (p) {
  return p.textAlign ? "text-align: ".concat(p.textAlign, ";") : '';
}, function (p) {
  return p.whiteSpace ? "white-space: ".concat(p.whiteSpace, ";") : '';
}, function (p) {
  return getTypeStyles(p);
});
export var Typography = React.forwardRef(function (props, ref) {
  var as = props.as,
    className = props.className,
    id = props.id,
    type = props.type,
    color = props.color,
    lineHeight = props.lineHeight,
    weight = props.weight,
    textAlign = props.textAlign,
    whiteSpace = props.whiteSpace,
    children = props.children;
  return React.createElement(StyledTypography, _extends({
    ref: ref,
    className: className,
    id: id,
    forwardedAs: as,
    type: type,
    color: color,
    lineHeight: lineHeight,
    weight: weight,
    textAlign: textAlign,
    whiteSpace: whiteSpace
  }, getAriaProps(props)), children);
});