UNPKG

polished

Version:

A lightweight toolset for writing styles in Javascript.

51 lines (50 loc) 1.8 kB
"use strict"; exports.__esModule = true; exports["default"] = hslToColorString; var _hsl = _interopRequireDefault(require("./hsl")); var _hsla = _interopRequireDefault(require("./hsla")); var _errors = _interopRequireDefault(require("../internalHelpers/_errors")); function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } /** * Converts a HslColor or HslaColor object to a color string. * This util is useful in case you only know on runtime which color object is * used. Otherwise we recommend to rely on `hsl` or `hsla`. * * @example * // Styles as object usage * const styles = { * background: hslToColorString({ hue: 240, saturation: 1, lightness: 0.5 }), * background: hslToColorString({ hue: 360, saturation: 0.75, lightness: 0.4, alpha: 0.72 }), * } * * // styled-components usage * const div = styled.div` * background: ${hslToColorString({ hue: 240, saturation: 1, lightness: 0.5 })}; * background: ${hslToColorString({ hue: 360, saturation: 0.75, lightness: 0.4, alpha: 0.72 })}; * ` * * // CSS in JS Output * element { * background: "#00f"; * background: "rgba(179,25,25,0.72)"; * } */ function hslToColorString(color) { if (typeof color === 'object' && typeof color.hue === 'number' && typeof color.saturation === 'number' && typeof color.lightness === 'number') { if (color.alpha && typeof color.alpha === 'number') { return (0, _hsla["default"])({ hue: color.hue, saturation: color.saturation, lightness: color.lightness, alpha: color.alpha }); } return (0, _hsl["default"])({ hue: color.hue, saturation: color.saturation, lightness: color.lightness }); } throw new _errors["default"](45); } module.exports = exports.default;