findAnimationName.mjs 1.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374
  1. import postcssValueParser from 'postcss-value-parser';
  2. import { animationShorthandKeywords, basicKeywords } from '../reference/keywords.mjs';
  3. import getDimension from './getDimension.mjs';
  4. import isStandardSyntaxValue from './isStandardSyntaxValue.mjs';
  5. import isVariable from './isVariable.mjs';
  6. /** @typedef {import('postcss-value-parser').Node} Node */
  7. /**
  8. * Get the animation name within an `animation` shorthand property value.
  9. *
  10. * @param {string} value
  11. *
  12. * @returns {Node[]}
  13. */
  14. export default function findAnimationName(value) {
  15. /** @type {Node[]} */
  16. const animationNames = [];
  17. const valueNodes = postcssValueParser(value);
  18. const { nodes } = valueNodes;
  19. // Handle `inherit`, `initial` and etc
  20. if (nodes.length === 1 && nodes[0] && basicKeywords.has(nodes[0].value.toLowerCase())) {
  21. return [nodes[0]];
  22. }
  23. let shouldBeIgnored = false;
  24. valueNodes.walk((valueNode) => {
  25. if (shouldBeIgnored) return;
  26. if (valueNode.type === 'function') {
  27. return false;
  28. }
  29. if (valueNode.type !== 'word') {
  30. return;
  31. }
  32. const valueLowerCase = valueNode.value.toLowerCase();
  33. // Ignore non-standard syntax
  34. if (!isStandardSyntaxValue(valueLowerCase)) {
  35. // Cannot find animation name if shorthand has non-standard syntax value (#5532)
  36. shouldBeIgnored = true;
  37. animationNames.length = 0; // clears animationNames
  38. return;
  39. }
  40. // Ignore variables
  41. if (isVariable(valueLowerCase)) {
  42. return;
  43. }
  44. // Ignore keywords for other animation parts
  45. if (animationShorthandKeywords.has(valueLowerCase)) {
  46. return;
  47. }
  48. // Ignore numbers with units
  49. const { unit } = getDimension(valueNode);
  50. if (unit || unit === '') {
  51. return;
  52. }
  53. animationNames.push(valueNode);
  54. });
  55. return animationNames;
  56. }