b1f45dfaf04f2c27a70471dc1c088e3896b846db4d1a2b5ff855b4268f97eb9df1ae66490fd66f8979c773b0a9593824d9bd409f211554c15d75ba7c1ce002 7.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189
  1. "use strict";
  2. Object.defineProperty(exports, "__esModule", { value: true });
  3. exports.isValidCSSUnit = exports.stringInputToObject = exports.inputToRGB = void 0;
  4. /* eslint-disable @typescript-eslint/no-redundant-type-constituents */
  5. var conversion_js_1 = require("./conversion.js");
  6. var css_color_names_js_1 = require("./css-color-names.js");
  7. var util_js_1 = require("./util.js");
  8. /**
  9. * Given a string or object, convert that input to RGB
  10. *
  11. * Possible string inputs:
  12. * ```
  13. * "red"
  14. * "#f00" or "f00"
  15. * "#ff0000" or "ff0000"
  16. * "#ff000000" or "ff000000"
  17. * "rgb 255 0 0" or "rgb (255, 0, 0)"
  18. * "rgb 1.0 0 0" or "rgb (1, 0, 0)"
  19. * "rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1"
  20. * "rgba (1.0, 0, 0, 1)" or "rgba 1.0, 0, 0, 1"
  21. * "hsl(0, 100%, 50%)" or "hsl 0 100% 50%"
  22. * "hsla(0, 100%, 50%, 1)" or "hsla 0 100% 50%, 1"
  23. * "hsv(0, 100%, 100%)" or "hsv 0 100% 100%"
  24. * ```
  25. */
  26. function inputToRGB(color) {
  27. var rgb = { r: 0, g: 0, b: 0 };
  28. var a = 1;
  29. var s = null;
  30. var v = null;
  31. var l = null;
  32. var ok = false;
  33. var format = false;
  34. if (typeof color === 'string') {
  35. color = stringInputToObject(color);
  36. }
  37. if (typeof color === 'object') {
  38. if (isValidCSSUnit(color.r) && isValidCSSUnit(color.g) && isValidCSSUnit(color.b)) {
  39. rgb = (0, conversion_js_1.rgbToRgb)(color.r, color.g, color.b);
  40. ok = true;
  41. format = String(color.r).substr(-1) === '%' ? 'prgb' : 'rgb';
  42. }
  43. else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.v)) {
  44. s = (0, util_js_1.convertToPercentage)(color.s);
  45. v = (0, util_js_1.convertToPercentage)(color.v);
  46. rgb = (0, conversion_js_1.hsvToRgb)(color.h, s, v);
  47. ok = true;
  48. format = 'hsv';
  49. }
  50. else if (isValidCSSUnit(color.h) && isValidCSSUnit(color.s) && isValidCSSUnit(color.l)) {
  51. s = (0, util_js_1.convertToPercentage)(color.s);
  52. l = (0, util_js_1.convertToPercentage)(color.l);
  53. rgb = (0, conversion_js_1.hslToRgb)(color.h, s, l);
  54. ok = true;
  55. format = 'hsl';
  56. }
  57. if (Object.prototype.hasOwnProperty.call(color, 'a')) {
  58. a = color.a;
  59. }
  60. }
  61. a = (0, util_js_1.boundAlpha)(a);
  62. return {
  63. ok: ok,
  64. format: color.format || format,
  65. r: Math.min(255, Math.max(rgb.r, 0)),
  66. g: Math.min(255, Math.max(rgb.g, 0)),
  67. b: Math.min(255, Math.max(rgb.b, 0)),
  68. a: a,
  69. };
  70. }
  71. exports.inputToRGB = inputToRGB;
  72. // <http://www.w3.org/TR/css3-values/#integers>
  73. var CSS_INTEGER = '[-\\+]?\\d+%?';
  74. // <http://www.w3.org/TR/css3-values/#number-value>
  75. var CSS_NUMBER = '[-\\+]?\\d*\\.\\d+%?';
  76. // Allow positive/negative integer/number. Don't capture the either/or, just the entire outcome.
  77. var CSS_UNIT = "(?:".concat(CSS_NUMBER, ")|(?:").concat(CSS_INTEGER, ")");
  78. // Actual matching.
  79. // Parentheses and commas are optional, but not required.
  80. // Whitespace can take the place of commas or opening paren
  81. var PERMISSIVE_MATCH3 = "[\\s|\\(]+(".concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")\\s*\\)?");
  82. var PERMISSIVE_MATCH4 = "[\\s|\\(]+(".concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")[,|\\s]+(").concat(CSS_UNIT, ")\\s*\\)?");
  83. var matchers = {
  84. CSS_UNIT: new RegExp(CSS_UNIT),
  85. rgb: new RegExp('rgb' + PERMISSIVE_MATCH3),
  86. rgba: new RegExp('rgba' + PERMISSIVE_MATCH4),
  87. hsl: new RegExp('hsl' + PERMISSIVE_MATCH3),
  88. hsla: new RegExp('hsla' + PERMISSIVE_MATCH4),
  89. hsv: new RegExp('hsv' + PERMISSIVE_MATCH3),
  90. hsva: new RegExp('hsva' + PERMISSIVE_MATCH4),
  91. hex3: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
  92. hex6: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
  93. hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
  94. hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
  95. };
  96. /**
  97. * Permissive string parsing. Take in a number of formats, and output an object
  98. * based on detected format. Returns `{ r, g, b }` or `{ h, s, l }` or `{ h, s, v}`
  99. */
  100. function stringInputToObject(color) {
  101. color = color.trim().toLowerCase();
  102. if (color.length === 0) {
  103. return false;
  104. }
  105. var named = false;
  106. if (css_color_names_js_1.names[color]) {
  107. color = css_color_names_js_1.names[color];
  108. named = true;
  109. }
  110. else if (color === 'transparent') {
  111. return { r: 0, g: 0, b: 0, a: 0, format: 'name' };
  112. }
  113. // Try to match string input using regular expressions.
  114. // Keep most of the number bounding out of this function - don't worry about [0,1] or [0,100] or [0,360]
  115. // Just return an object and let the conversion functions handle that.
  116. // This way the result will be the same whether the tinycolor is initialized with string or object.
  117. var match = matchers.rgb.exec(color);
  118. if (match) {
  119. return { r: match[1], g: match[2], b: match[3] };
  120. }
  121. match = matchers.rgba.exec(color);
  122. if (match) {
  123. return { r: match[1], g: match[2], b: match[3], a: match[4] };
  124. }
  125. match = matchers.hsl.exec(color);
  126. if (match) {
  127. return { h: match[1], s: match[2], l: match[3] };
  128. }
  129. match = matchers.hsla.exec(color);
  130. if (match) {
  131. return { h: match[1], s: match[2], l: match[3], a: match[4] };
  132. }
  133. match = matchers.hsv.exec(color);
  134. if (match) {
  135. return { h: match[1], s: match[2], v: match[3] };
  136. }
  137. match = matchers.hsva.exec(color);
  138. if (match) {
  139. return { h: match[1], s: match[2], v: match[3], a: match[4] };
  140. }
  141. match = matchers.hex8.exec(color);
  142. if (match) {
  143. return {
  144. r: (0, conversion_js_1.parseIntFromHex)(match[1]),
  145. g: (0, conversion_js_1.parseIntFromHex)(match[2]),
  146. b: (0, conversion_js_1.parseIntFromHex)(match[3]),
  147. a: (0, conversion_js_1.convertHexToDecimal)(match[4]),
  148. format: named ? 'name' : 'hex8',
  149. };
  150. }
  151. match = matchers.hex6.exec(color);
  152. if (match) {
  153. return {
  154. r: (0, conversion_js_1.parseIntFromHex)(match[1]),
  155. g: (0, conversion_js_1.parseIntFromHex)(match[2]),
  156. b: (0, conversion_js_1.parseIntFromHex)(match[3]),
  157. format: named ? 'name' : 'hex',
  158. };
  159. }
  160. match = matchers.hex4.exec(color);
  161. if (match) {
  162. return {
  163. r: (0, conversion_js_1.parseIntFromHex)(match[1] + match[1]),
  164. g: (0, conversion_js_1.parseIntFromHex)(match[2] + match[2]),
  165. b: (0, conversion_js_1.parseIntFromHex)(match[3] + match[3]),
  166. a: (0, conversion_js_1.convertHexToDecimal)(match[4] + match[4]),
  167. format: named ? 'name' : 'hex8',
  168. };
  169. }
  170. match = matchers.hex3.exec(color);
  171. if (match) {
  172. return {
  173. r: (0, conversion_js_1.parseIntFromHex)(match[1] + match[1]),
  174. g: (0, conversion_js_1.parseIntFromHex)(match[2] + match[2]),
  175. b: (0, conversion_js_1.parseIntFromHex)(match[3] + match[3]),
  176. format: named ? 'name' : 'hex',
  177. };
  178. }
  179. return false;
  180. }
  181. exports.stringInputToObject = stringInputToObject;
  182. /**
  183. * Check to see if it looks like a CSS unit
  184. * (see `matchers` above for definition).
  185. */
  186. function isValidCSSUnit(color) {
  187. return Boolean(matchers.CSS_UNIT.exec(String(color)));
  188. }
  189. exports.isValidCSSUnit = isValidCSSUnit;