How to use the css-vendor.supportedKeyframes function in css-vendor

function onProcessRule(rule) {
    if (rule.type === 'keyframes') {
      const atRule: KeyframesRule = (rule: any)
      atRule.at = vendor.supportedKeyframes(atRule.at)
    }
  }

const generateStyleSheet = ({ imagesCount, duration, transition }) => {
  const t = imagesCount * (duration + transition);
  const p1 = Math.round(transition / t * 100);
  const p2 = Math.round((duration + transition) / t * 100);
  const p3 = Math.round(p2 * 1.4);

  const vendorBackfaceVisibility = vendor.supportedProperty('backface-visibility');
  const vendorAnimation = vendor.supportedProperty('animation');
  const vendorKeyframes = vendor.supportedKeyframes('@keyframes');

  let animation = '';
  let keyframes = '';
  if (vendorAnimation && vendorBackfaceVisibility && vendorKeyframes) {
    animation = `${vendorBackfaceVisibility}: hidden;
        ${vendorAnimation}: imageAnimation ${t}s linear infinite -0.5s;`;

    keyframes = `${vendorKeyframes} imageAnimation {
          0% {
            opacity: 0;
            animation-timing-function: ease-in;
          }
          ${p1}% {
            opacity: 1;
            animation-timing-function: ease-out;
          }