@activecollab/components/dist/cjs/components/Typography/Styles.js

ActiveCollab Components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.StyledTypography = void 0;
var _styledComponents = _interopRequireWildcard(require("styled-components"));
var _BoxSizingStyle = require("../BoxSizingStyle");
var _FontStyle = require("../FontStyle");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
var colors = {
  primary: {
    "color": "var(--color-theme-900)"
  },
  secondary: {
    "color": "var(--color-theme-700)"
  },
  tertiary: {
    "color": "var(--color-theme-600)"
  },
  quaternary: {
    "color": "var(--color-theme-transparent-500)"
  },
  "theme-primary": {
    "color": "var(--color-primary)"
  },
  "theme-secondary": {
    "color": "var(--color-secondary)"
  },
  "page-paper": {
    "color": "var(--page-paper-main)"
  },
  "only-white": {
    "color": "var(--only-white)"
  },
  "only-black": {
    "color": "var(--only-black)"
  },
  success: {
    "color": "var(--color-sucess-green)"
  },
  alert: {
    "color": "var(--red-alert)"
  },
  warning: {
    "color": "var(--warning)"
  }
};
var StyledTypography = exports.StyledTypography = _styledComponents.default.div.withConfig({
  displayName: "Styles__StyledTypography",
  componentId: "sc-mskw5w-0"
})(["", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], _FontStyle.FontStyle, _BoxSizingStyle.BoxSizingStyle, function (props) {
  return colors[props.$color];
}, function (props) {
  return props.$variant === "Title 1" && (0, _styledComponents.css)(["", ""], {
    "fontSize": "2rem"
  });
}, function (props) {
  return props.$variant === "Title 2" && (0, _styledComponents.css)(["", ""], {
    "fontSize": "1.675rem"
  });
}, function (props) {
  return props.$variant === "Header 2" && (0, _styledComponents.css)(["", ""], {
    "fontSize": "1.125rem"
  });
}, function (props) {
  return (props.$variant === "Header 3" || props.$variant === "Body 1") && (0, _styledComponents.css)(["", ""], {
    "fontSize": "1rem"
  });
}, function (props) {
  return props.$variant === "Body 2" && (0, _styledComponents.css)(["", ""], {
    "fontSize": "0.875rem"
  });
}, function (props) {
  return props.$variant === "Caption 1" && (0, _styledComponents.css)(["", ""], {
    "fontSize": "0.75rem"
  });
}, function (props) {
  return props.$variant === "Caption 2" && (0, _styledComponents.css)(["", ""], {
    "fontSize": "0.625rem"
  });
}, function (props) {
  return props.$italic ? (0, _styledComponents.css)(["font-style:italic;"]) : (0, _styledComponents.css)(["font-style:normal;"]);
}, function (props) {
  return props.$tabularNums ? (0, _styledComponents.css)(["font-variant-numeric:tabular-nums;"]) : (0, _styledComponents.css)(["font-variant-numeric:normal;"]);
}, function (props) {
  return props.$letterSpacing === "regular" && (0, _styledComponents.css)(["", ""], {
    "letterSpacing": "0.02em"
  });
}, function (props) {
  return props.$letterSpacing === "tight" && (0, _styledComponents.css)(["", ""], {
    "letterSpacing": "0em"
  });
}, function (props) {
  return props.$letterSpacing === "wide" && (0, _styledComponents.css)(["", ""], {
    "letterSpacing": "0.08em"
  });
}, function (props) {
  return props.$lineHeight === "regular" && (0, _styledComponents.css)(["", ""], {
    "lineHeight": "1.375"
  });
}, function (props) {
  return props.$lineHeight === "tight" && (0, _styledComponents.css)(["", ""], {
    "lineHeight": "1"
  });
}, function (props) {
  return props.$lineHeight === "loose" && (0, _styledComponents.css)(["", ""], {
    "lineHeight": "1.625"
  });
}, function (props) {
  return props.$align === "left" && (0, _styledComponents.css)(["text-align:left;"]);
}, function (props) {
  return props.$align === "right" && (0, _styledComponents.css)(["text-align:right;"]);
}, function (props) {
  return props.$align === "center" && (0, _styledComponents.css)(["text-align:center;"]);
}, function (props) {
  return props.$align === "justify" && (0, _styledComponents.css)(["text-align:justify;"]);
}, function (props) {
  return props.$decoration === "none" && (0, _styledComponents.css)(["text-decoration:none;"]);
}, function (props) {
  return props.$decoration === "underline" && (0, _styledComponents.css)(["text-decoration:underline;"]);
}, function (props) {
  return props.$decoration === "line-through" && (0, _styledComponents.css)(["text-decoration:line-through;"]);
}, function (props) {
  return props.$transform === "regular" && (0, _styledComponents.css)(["text-transform:none;"]);
}, function (props) {
  return props.$transform === "uppercase" && (0, _styledComponents.css)(["text-transform:uppercase;"]);
}, function (props) {
  return props.$transform === "lowercase" && (0, _styledComponents.css)(["text-transform:lowercase;"]);
}, function (props) {
  return props.$transform === "capitalize" && (0, _styledComponents.css)(["text-transform:capitalize;"]);
}, function (props) {
  return props.$overflow === "visible" && (0, _styledComponents.css)(["overflow:visible;"]);
}, function (props) {
  return props.$overflow === "ellipsis" && (0, _styledComponents.css)(["text-overflow:ellipsis;"]);
}, function (props) {
  return props.$overflow === "truncate" && (0, _styledComponents.css)(["overflow:hidden;text-overflow:ellipsis;white-space:nowrap;"]);
}, function (props) {
  return props.$whitespace === "regular" && (0, _styledComponents.css)(["white-space:normal;"]);
}, function (props) {
  return props.$whitespace === "no-wrap" && (0, _styledComponents.css)(["white-space:nowrap;"]);
}, function (props) {
  return props.$whitespace === "pre" && (0, _styledComponents.css)(["white-space:pre;"]);
}, function (props) {
  return props.$whitespace === "pre-wrap" && (0, _styledComponents.css)(["white-space:pre-wrap;"]);
}, function (props) {
  return props.$whitespace === "pre-line" && (0, _styledComponents.css)(["white-space:pre-line;"]);
}, function (props) {
  return props.$whitespace === "break-spaces" && (0, _styledComponents.css)(["white-space:break-spaces;"]);
}, function (props) {
  return props.$wordBreak === "regular" && (0, _styledComponents.css)(["overflow-wrap:normal;word-break:normal;"]);
}, function (props) {
  return props.$wordBreak === "smart" && (0, _styledComponents.css)(["overflow-wrap:break-word;"]);
}, function (props) {
  return props.$wordBreak === "all" && (0, _styledComponents.css)(["word-break:break-all;"]);
}, function (props) {
  return props.$weight === "regular" && (0, _styledComponents.css)(["", ""], {
    "fontWeight": "400"
  });
}, function (props) {
  return props.$weight === "light" && (0, _styledComponents.css)(["", ""], {
    "fontWeight": "300"
  });
}, function (props) {
  return props.$weight === "medium" && (0, _styledComponents.css)(["", ""], {
    "fontWeight": "500"
  });
}, function (props) {
  return props.$weight === "bold" && (0, _styledComponents.css)(["", ""], {
    "fontWeight": "700"
  });
});
StyledTypography.displayName = "StyledTypography";
//# sourceMappingURL=Styles.js.map