validator.js 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561
  1. var functionNoVendorRegexStr = '[A-Z]+(\\-|[A-Z]|[0-9])+\\(.*?\\)';
  2. var functionVendorRegexStr = '\\-(\\-|[A-Z]|[0-9])+\\(.*?\\)';
  3. var variableRegexStr = 'var\\(\\-\\-[^\\)]+\\)';
  4. var functionAnyRegexStr = '(' + variableRegexStr + '|' + functionNoVendorRegexStr + '|' + functionVendorRegexStr + ')';
  5. var calcRegex = new RegExp('^(\\-moz\\-|\\-webkit\\-)?calc\\([^\\)]+\\)$', 'i');
  6. var decimalRegex = /[0-9]/;
  7. var functionAnyRegex = new RegExp('^' + functionAnyRegexStr + '$', 'i');
  8. var hexAlphaColorRegex = /^#(?:[0-9a-f]{4}|[0-9a-f]{8})$/i;
  9. // eslint-disable-next-line max-len
  10. var hslColorRegex = /^hsl\(\s{0,31}[-.]?\d+\s{0,31},\s{0,31}\d*\.?\d+%\s{0,31},\s{0,31}\d*\.?\d+%\s{0,31}\)|hsla\(\s{0,31}[-.]?\d+\s{0,31},\s{0,31}\d*\.?\d+%\s{0,31},\s{0,31}\d*\.?\d+%\s{0,31},\s{0,31}\.?\d+\s{0,31}\)$/;
  11. // eslint-disable-next-line max-len
  12. var hslColorWithSpacesRegex = /^hsl\(\s{0,31}[-.]?\d+(deg)?\s{1,31}\d*\.?\d+%\s{1,31}\d*\.?\d+%\s{0,31}\)|hsla\(\s{0,31}[-.]?\d+(deg)?\s{1,31}\d*\.?\d+%\s{1,31}\d*\.?\d+%\s{1,31}\/\s{1,31}\d*\.?\d+%?\s{0,31}\)$/;
  13. var identifierRegex = /^(-[a-z0-9_][a-z0-9\-_]*|[a-z_][a-z0-9\-_]*)$/i;
  14. var namedEntityRegex = /^[a-z]+$/i;
  15. var prefixRegex = /^-([a-z0-9]|-)*$/i;
  16. var quotedTextRegex = /^("[^"]*"|'[^']*')$/i;
  17. // eslint-disable-next-line max-len
  18. var rgbColorRegex = /^rgb\(\s{0,31}[\d]{1,3}\s{0,31},\s{0,31}[\d]{1,3}\s{0,31},\s{0,31}[\d]{1,3}\s{0,31}\)|rgba\(\s{0,31}[\d]{1,3}\s{0,31},\s{0,31}[\d]{1,3}\s{0,31},\s{0,31}[\d]{1,3}\s{0,31},\s{0,31}[.\d]+\s{0,31}\)$/i;
  19. // eslint-disable-next-line max-len
  20. var rgbColorWithSpacesRegex = /^rgb\(\s{0,31}[\d]{1,3}\s{1,31}[\d]{1,3}\s{1,31}[\d]{1,3}\s{0,31}\)|rgba\(\s{0,31}[\d]{1,3}\s{1,31}[\d]{1,3}\s{1,31}[\d]{1,3}\s{1,31}\/\s{1,31}[\d]*\.?[.\d]+%?\s{0,31}\)$/i;
  21. var timeUnitPattern = /\d+(s|ms)/;
  22. var timingFunctionRegex = /^(cubic-bezier|steps)\([^)]+\)$/;
  23. var validTimeUnits = ['ms', 's'];
  24. var urlRegex = /^url\([\s\S]+\)$/i;
  25. var variableRegex = new RegExp('^' + variableRegexStr + '$', 'i');
  26. var eightValueColorRegex = /^#[0-9a-f]{8}$/i;
  27. var fourValueColorRegex = /^#[0-9a-f]{4}$/i;
  28. var sixValueColorRegex = /^#[0-9a-f]{6}$/i;
  29. var threeValueColorRegex = /^#[0-9a-f]{3}$/i;
  30. var DECIMAL_DOT = '.';
  31. var MINUS_SIGN = '-';
  32. var PLUS_SIGN = '+';
  33. var Keywords = {
  34. '^': [
  35. 'inherit',
  36. 'initial',
  37. 'unset'
  38. ],
  39. '*-style': [
  40. 'auto',
  41. 'dashed',
  42. 'dotted',
  43. 'double',
  44. 'groove',
  45. 'hidden',
  46. 'inset',
  47. 'none',
  48. 'outset',
  49. 'ridge',
  50. 'solid'
  51. ],
  52. '*-timing-function': [
  53. 'ease',
  54. 'ease-in',
  55. 'ease-in-out',
  56. 'ease-out',
  57. 'linear',
  58. 'step-end',
  59. 'step-start'
  60. ],
  61. 'animation-direction': [
  62. 'alternate',
  63. 'alternate-reverse',
  64. 'normal',
  65. 'reverse'
  66. ],
  67. 'animation-fill-mode': [
  68. 'backwards',
  69. 'both',
  70. 'forwards',
  71. 'none'
  72. ],
  73. 'animation-iteration-count': [
  74. 'infinite'
  75. ],
  76. 'animation-name': [
  77. 'none'
  78. ],
  79. 'animation-play-state': [
  80. 'paused',
  81. 'running'
  82. ],
  83. 'background-attachment': [
  84. 'fixed',
  85. 'inherit',
  86. 'local',
  87. 'scroll'
  88. ],
  89. 'background-clip': [
  90. 'border-box',
  91. 'content-box',
  92. 'inherit',
  93. 'padding-box',
  94. 'text'
  95. ],
  96. 'background-origin': [
  97. 'border-box',
  98. 'content-box',
  99. 'inherit',
  100. 'padding-box'
  101. ],
  102. 'background-position': [
  103. 'bottom',
  104. 'center',
  105. 'left',
  106. 'right',
  107. 'top'
  108. ],
  109. 'background-repeat': [
  110. 'no-repeat',
  111. 'inherit',
  112. 'repeat',
  113. 'repeat-x',
  114. 'repeat-y',
  115. 'round',
  116. 'space'
  117. ],
  118. 'background-size': [
  119. 'auto',
  120. 'cover',
  121. 'contain'
  122. ],
  123. 'border-collapse': [
  124. 'collapse',
  125. 'inherit',
  126. 'separate'
  127. ],
  128. bottom: [
  129. 'auto'
  130. ],
  131. clear: [
  132. 'both',
  133. 'left',
  134. 'none',
  135. 'right'
  136. ],
  137. color: [
  138. 'transparent'
  139. ],
  140. cursor: [
  141. 'all-scroll',
  142. 'auto',
  143. 'col-resize',
  144. 'crosshair',
  145. 'default',
  146. 'e-resize',
  147. 'help',
  148. 'move',
  149. 'n-resize',
  150. 'ne-resize',
  151. 'no-drop',
  152. 'not-allowed',
  153. 'nw-resize',
  154. 'pointer',
  155. 'progress',
  156. 'row-resize',
  157. 's-resize',
  158. 'se-resize',
  159. 'sw-resize',
  160. 'text',
  161. 'vertical-text',
  162. 'w-resize',
  163. 'wait'
  164. ],
  165. display: [
  166. 'block',
  167. 'inline',
  168. 'inline-block',
  169. 'inline-table',
  170. 'list-item',
  171. 'none',
  172. 'table',
  173. 'table-caption',
  174. 'table-cell',
  175. 'table-column',
  176. 'table-column-group',
  177. 'table-footer-group',
  178. 'table-header-group',
  179. 'table-row',
  180. 'table-row-group'
  181. ],
  182. float: [
  183. 'left',
  184. 'none',
  185. 'right'
  186. ],
  187. left: [
  188. 'auto'
  189. ],
  190. font: [
  191. 'caption',
  192. 'icon',
  193. 'menu',
  194. 'message-box',
  195. 'small-caption',
  196. 'status-bar',
  197. 'unset'
  198. ],
  199. 'font-size': [
  200. 'large',
  201. 'larger',
  202. 'medium',
  203. 'small',
  204. 'smaller',
  205. 'x-large',
  206. 'x-small',
  207. 'xx-large',
  208. 'xx-small'
  209. ],
  210. 'font-stretch': [
  211. 'condensed',
  212. 'expanded',
  213. 'extra-condensed',
  214. 'extra-expanded',
  215. 'normal',
  216. 'semi-condensed',
  217. 'semi-expanded',
  218. 'ultra-condensed',
  219. 'ultra-expanded'
  220. ],
  221. 'font-style': [
  222. 'italic',
  223. 'normal',
  224. 'oblique'
  225. ],
  226. 'font-variant': [
  227. 'normal',
  228. 'small-caps'
  229. ],
  230. 'font-weight': [
  231. '100',
  232. '200',
  233. '300',
  234. '400',
  235. '500',
  236. '600',
  237. '700',
  238. '800',
  239. '900',
  240. 'bold',
  241. 'bolder',
  242. 'lighter',
  243. 'normal'
  244. ],
  245. 'line-height': [
  246. 'normal'
  247. ],
  248. 'list-style-position': [
  249. 'inside',
  250. 'outside'
  251. ],
  252. 'list-style-type': [
  253. 'armenian',
  254. 'circle',
  255. 'decimal',
  256. 'decimal-leading-zero',
  257. 'disc',
  258. 'decimal|disc', // this is the default value of list-style-type, see comment in configuration.js
  259. 'georgian',
  260. 'lower-alpha',
  261. 'lower-greek',
  262. 'lower-latin',
  263. 'lower-roman',
  264. 'none',
  265. 'square',
  266. 'upper-alpha',
  267. 'upper-latin',
  268. 'upper-roman'
  269. ],
  270. overflow: [
  271. 'auto',
  272. 'hidden',
  273. 'scroll',
  274. 'visible'
  275. ],
  276. position: [
  277. 'absolute',
  278. 'fixed',
  279. 'relative',
  280. 'static'
  281. ],
  282. right: [
  283. 'auto'
  284. ],
  285. 'text-align': [
  286. 'center',
  287. 'justify',
  288. 'left',
  289. 'left|right', // this is the default value of list-style-type, see comment in configuration.js
  290. 'right'
  291. ],
  292. 'text-decoration': [
  293. 'line-through',
  294. 'none',
  295. 'overline',
  296. 'underline'
  297. ],
  298. 'text-overflow': [
  299. 'clip',
  300. 'ellipsis'
  301. ],
  302. top: [
  303. 'auto'
  304. ],
  305. 'vertical-align': [
  306. 'baseline',
  307. 'bottom',
  308. 'middle',
  309. 'sub',
  310. 'super',
  311. 'text-bottom',
  312. 'text-top',
  313. 'top'
  314. ],
  315. visibility: [
  316. 'collapse',
  317. 'hidden',
  318. 'visible'
  319. ],
  320. 'white-space': [
  321. 'normal',
  322. 'nowrap',
  323. 'pre'
  324. ],
  325. width: [
  326. 'inherit',
  327. 'initial',
  328. 'medium',
  329. 'thick',
  330. 'thin'
  331. ]
  332. };
  333. var Units = [
  334. '%',
  335. 'ch',
  336. 'cm',
  337. 'em',
  338. 'ex',
  339. 'in',
  340. 'mm',
  341. 'pc',
  342. 'pt',
  343. 'px',
  344. 'rem',
  345. 'vh',
  346. 'vm',
  347. 'vmax',
  348. 'vmin',
  349. 'vw'
  350. ];
  351. function isColor(value) {
  352. return value != 'auto'
  353. && (
  354. isKeyword('color')(value)
  355. || isHexColor(value)
  356. || isColorFunction(value)
  357. || isNamedEntity(value)
  358. );
  359. }
  360. function isColorFunction(value) {
  361. return isRgbColor(value) || isHslColor(value);
  362. }
  363. function isDynamicUnit(value) {
  364. return calcRegex.test(value);
  365. }
  366. function isFunction(value) {
  367. return functionAnyRegex.test(value);
  368. }
  369. function isHexColor(value) {
  370. return threeValueColorRegex.test(value)
  371. || fourValueColorRegex.test(value)
  372. || sixValueColorRegex.test(value)
  373. || eightValueColorRegex.test(value);
  374. }
  375. function isHslColor(value) {
  376. return hslColorRegex.test(value) || hslColorWithSpacesRegex.test(value);
  377. }
  378. function isHexAlphaColor(value) {
  379. return hexAlphaColorRegex.test(value);
  380. }
  381. function isIdentifier(value) {
  382. return identifierRegex.test(value);
  383. }
  384. function isQuotedText(value) {
  385. return quotedTextRegex.test(value);
  386. }
  387. function isImage(value) {
  388. return value == 'none' || value == 'inherit' || isUrl(value);
  389. }
  390. function isKeyword(propertyName) {
  391. return function(value) {
  392. return Keywords[propertyName].indexOf(value) > -1;
  393. };
  394. }
  395. function isNamedEntity(value) {
  396. return namedEntityRegex.test(value);
  397. }
  398. function isNumber(value) {
  399. return scanForNumber(value) == value.length;
  400. }
  401. function isRgbColor(value) {
  402. return rgbColorRegex.test(value) || rgbColorWithSpacesRegex.test(value);
  403. }
  404. function isPrefixed(value) {
  405. return prefixRegex.test(value);
  406. }
  407. function isPositiveNumber(value) {
  408. return isNumber(value)
  409. && parseFloat(value) >= 0;
  410. }
  411. function isVariable(value) {
  412. return variableRegex.test(value);
  413. }
  414. function isTime(value) {
  415. var numberUpTo = scanForNumber(value);
  416. return numberUpTo == value.length && parseInt(value) === 0
  417. || numberUpTo > -1 && validTimeUnits.indexOf(value.slice(numberUpTo + 1)) > -1
  418. || isCalculatedTime(value);
  419. }
  420. function isCalculatedTime(value) {
  421. return isFunction(value) && timeUnitPattern.test(value);
  422. }
  423. function isTimingFunction() {
  424. var isTimingFunctionKeyword = isKeyword('*-timing-function');
  425. return function(value) {
  426. return isTimingFunctionKeyword(value) || timingFunctionRegex.test(value);
  427. };
  428. }
  429. function isUnit(validUnits, value) {
  430. var numberUpTo = scanForNumber(value);
  431. return numberUpTo == value.length && parseInt(value) === 0
  432. || numberUpTo > -1 && validUnits.indexOf(value.slice(numberUpTo + 1).toLowerCase()) > -1
  433. || value == 'auto'
  434. || value == 'inherit';
  435. }
  436. function isUrl(value) {
  437. return urlRegex.test(value);
  438. }
  439. function isZIndex(value) {
  440. return value == 'auto'
  441. || isNumber(value)
  442. || isKeyword('^')(value);
  443. }
  444. function scanForNumber(value) {
  445. var hasDot = false;
  446. var hasSign = false;
  447. var character;
  448. var i, l;
  449. for (i = 0, l = value.length; i < l; i++) {
  450. character = value[i];
  451. if (i === 0 && (character == PLUS_SIGN || character == MINUS_SIGN)) {
  452. hasSign = true;
  453. } else if (i > 0 && hasSign && (character == PLUS_SIGN || character == MINUS_SIGN)) {
  454. return i - 1;
  455. } else if (character == DECIMAL_DOT && !hasDot) {
  456. hasDot = true;
  457. } else if (character == DECIMAL_DOT && hasDot) {
  458. return i - 1;
  459. } else if (decimalRegex.test(character)) {
  460. continue;
  461. } else {
  462. return i - 1;
  463. }
  464. }
  465. return i;
  466. }
  467. function validator(compatibility) {
  468. var validUnits = Units.slice(0).filter(function(value) {
  469. return !(value in compatibility.units) || compatibility.units[value] === true;
  470. });
  471. if (compatibility.customUnits.rpx) {
  472. validUnits.push('rpx');
  473. }
  474. return {
  475. colorOpacity: compatibility.colors.opacity,
  476. colorHexAlpha: compatibility.colors.hexAlpha,
  477. isAnimationDirectionKeyword: isKeyword('animation-direction'),
  478. isAnimationFillModeKeyword: isKeyword('animation-fill-mode'),
  479. isAnimationIterationCountKeyword: isKeyword('animation-iteration-count'),
  480. isAnimationNameKeyword: isKeyword('animation-name'),
  481. isAnimationPlayStateKeyword: isKeyword('animation-play-state'),
  482. isTimingFunction: isTimingFunction(),
  483. isBackgroundAttachmentKeyword: isKeyword('background-attachment'),
  484. isBackgroundClipKeyword: isKeyword('background-clip'),
  485. isBackgroundOriginKeyword: isKeyword('background-origin'),
  486. isBackgroundPositionKeyword: isKeyword('background-position'),
  487. isBackgroundRepeatKeyword: isKeyword('background-repeat'),
  488. isBackgroundSizeKeyword: isKeyword('background-size'),
  489. isColor: isColor,
  490. isColorFunction: isColorFunction,
  491. isDynamicUnit: isDynamicUnit,
  492. isFontKeyword: isKeyword('font'),
  493. isFontSizeKeyword: isKeyword('font-size'),
  494. isFontStretchKeyword: isKeyword('font-stretch'),
  495. isFontStyleKeyword: isKeyword('font-style'),
  496. isFontVariantKeyword: isKeyword('font-variant'),
  497. isFontWeightKeyword: isKeyword('font-weight'),
  498. isFunction: isFunction,
  499. isGlobal: isKeyword('^'),
  500. isHexAlphaColor: isHexAlphaColor,
  501. isHslColor: isHslColor,
  502. isIdentifier: isIdentifier,
  503. isImage: isImage,
  504. isKeyword: isKeyword,
  505. isLineHeightKeyword: isKeyword('line-height'),
  506. isListStylePositionKeyword: isKeyword('list-style-position'),
  507. isListStyleTypeKeyword: isKeyword('list-style-type'),
  508. isNumber: isNumber,
  509. isPrefixed: isPrefixed,
  510. isPositiveNumber: isPositiveNumber,
  511. isQuotedText: isQuotedText,
  512. isRgbColor: isRgbColor,
  513. isStyleKeyword: isKeyword('*-style'),
  514. isTime: isTime,
  515. isUnit: isUnit.bind(null, validUnits),
  516. isUrl: isUrl,
  517. isVariable: isVariable,
  518. isWidth: isKeyword('width'),
  519. isZIndex: isZIndex
  520. };
  521. }
  522. module.exports = validator;