@remotion/eslint-config-flat 4.0.340 → 4.0.342

package/LICENSE.md

@@ -6,10 +6,10 @@ In Remotion 5.0, the license will slightly change. [View the changes here](https
 
 Depending on the type of your legal entity, you are granted permission to use Remotion for your project. Individuals and small companies are allowed to use Remotion to create videos for free (even commercial), while a company license is required for for-profit organizations of a certain size. This two-tier system was designed to ensure funding for this project while still allowing the source code to be available and the program to be free for most. Read below for the exact terms of use.
 
-- [Free license](#free-license)
-- [Company license](#company-license)
+- [Free License](#free-license)
+- [Company License](#company-license)
 
-## Free license
+## Free License
 
 Copyright © 2025 [Remotion](https://www.remotion.dev)
 
@@ -24,7 +24,7 @@ You are eligible to use Remotion for free if you are:
 
 ### Allowed use cases
 
-Permission is hereby granted, free of charge, to any person eligible for the "Free license", to use the software non-commercially or commercially for the purpose of creating videos and images and to modify the software to their own liking, for the purpose of fulfilling their custom use case or to contribute bug fixes or improvements back to Remotion.
+Permission is hereby granted, free of charge, to any person eligible for the "Free License", to use the software non-commercially or commercially for the purpose of creating videos and images and to modify the software to their own liking, for the purpose of fulfilling their custom use case or to contribute bug fixes or improvements back to Remotion.
 
 ### Disallowed use cases
 
@@ -38,12 +38,12 @@ The software is provided "as is", without warranty of any kind, express or impli
 
 Support is provided on a best-we-can-do basis via GitHub Issues and Discord.
 
-## Company license
+## Company License
 
-You are required to obtain a company license to use Remotion if you are not within the group of entities eligible for a free license. This license will enable you to use Remotion for the allowed use cases specified in the free license, and give you access to prioritized support (read the [Support Policy](https://www.remotion.dev/docs/support)).
+You are required to obtain a Company License to use Remotion if you are not within the group of entities eligible for a Free License. This license will enable you to use Remotion for the allowed use cases specified in the Free License, and give you access to prioritized support (read the [Support Policy](https://www.remotion.dev/docs/support)).
 
 Visit [remotion.pro](https://www.remotion.pro/license) for pricing and to buy a license.
 
 ### FAQs
 
-Are you not sure whether you need a company license because of an edge case? Here are some [frequently asked questions](https://www.remotion.pro/faq).
+Are you not sure whether you need a Company License because of an edge case? Here are some [frequently asked questions](https://www.remotion.pro/faq).

package/dist/esm/index.mjs

@@ -46261,6 +46261,7 @@ var import_utils10 = __toESM(require_dist4(), 1);
 var import_utils11 = __toESM(require_dist4(), 1);
 var import_utils12 = __toESM(require_dist4(), 1);
 var import_utils13 = __toESM(require_dist4(), 1);
+var import_utils14 = __toESM(require_dist4(), 1);
 var __commonJS2 = (cb, mod) => () => (mod || cb((mod = { exports: {} }).exports, mod), mod.exports);
 var __esm = (fn, res) => () => (fn && (res = fn(fn = 0)), res);
 var createRule;
@@ -46660,17 +46661,125 @@ var init_no_string_assets = __esm(() => {
     }
   });
 });
+function findProblematicTailwindClass(classString) {
+  for (const pattern of nonPureAnimationTailwindClasses) {
+    const match = classString.match(pattern);
+    if (match) {
+      return {
+        match: match[0],
+        index: match.index
+      };
+    }
+  }
+  return null;
+}
+var createRule7;
+var NonPureAnimation;
+var nonPureAnimationProperties;
+var nonPureAnimationPropertiesKebab;
+var nonPureAnimationTailwindClasses;
+var non_pure_animation_default;
+var init_non_pure_animation = __esm(() => {
+  createRule7 = import_utils7.ESLintUtils.RuleCreator(() => {
+    return "https://www.remotion.dev/docs/flickering";
+  });
+  NonPureAnimation = [
+    "This animation does not run purely off useCurrentFrame() and will lead to flickering.",
+    "See: https://www.remotion.dev/docs/flickering"
+  ].join(`
+`);
+  nonPureAnimationProperties = new Set(["transition"]);
+  nonPureAnimationPropertiesKebab = new Set(["transition"]);
+  nonPureAnimationTailwindClasses = [
+    /\btransition-\w+\b/,
+    /\btransition\b/
+  ];
+  non_pure_animation_default = createRule7({
+    name: "non-pure-animation",
+    meta: {
+      type: "problem",
+      docs: {
+        description: NonPureAnimation,
+        recommended: "warn"
+      },
+      fixable: undefined,
+      schema: [],
+      messages: {
+        NonPureAnimation
+      }
+    },
+    defaultOptions: [],
+    create: (context) => {
+      return {
+        Property: (node) => {
+          let propertyName;
+          if (node.key.type === "Identifier") {
+            propertyName = node.key.name;
+          } else if (node.key.type === "Literal" && typeof node.key.value === "string") {
+            propertyName = node.key.value;
+          }
+          if (!propertyName) {
+            return;
+          }
+          const isNonPureProperty = nonPureAnimationProperties.has(propertyName) || nonPureAnimationPropertiesKebab.has(propertyName);
+          if (isNonPureProperty) {
+            context.report({
+              messageId: "NonPureAnimation",
+              node
+            });
+          }
+        },
+        JSXAttribute: (node) => {
+          if (node.name.type === "JSXIdentifier" && node.name.name === "className" && node.value) {
+            let classString;
+            let valueNode;
+            if (node.value.type === "Literal" && typeof node.value.value === "string") {
+              classString = node.value.value;
+              valueNode = node.value;
+            } else if (node.value.type === "JSXExpressionContainer" && node.value.expression.type === "Literal" && typeof node.value.expression.value === "string") {
+              classString = node.value.expression.value;
+              valueNode = node.value.expression;
+            } else if (node.value.type === "JSXExpressionContainer" && node.value.expression.type === "TemplateLiteral") {
+              const templateLiteral = node.value.expression;
+              classString = templateLiteral.quasis.map((q) => q.value.cooked || q.value.raw).join(" ");
+              valueNode = templateLiteral;
+            }
+            if (classString) {
+              const problematicClass = findProblematicTailwindClass(classString);
+              if (problematicClass) {
+                const sourceCode = context.getSourceCode();
+                const valueStart = valueNode.range[0];
+                const quoteOffset = valueNode.type === "Literal" ? 1 : 0;
+                const classStart = valueStart + quoteOffset + problematicClass.index;
+                const classEnd = classStart + problematicClass.match.length;
+                const start = sourceCode.getLocFromIndex(classStart);
+                const end = sourceCode.getLocFromIndex(classEnd);
+                context.report({
+                  messageId: "NonPureAnimation",
+                  loc: {
+                    start,
+                    end
+                  }
+                });
+              }
+            }
+          }
+        }
+      };
+    }
+  });
+});
 function containsSlowTailwindClass(classString) {
   return slowTailwindClasses.some((pattern) => pattern.test(classString));
 }
-var createRule7;
+var createRule8;
 var SlowCssProperty;
 var slowCssProperties;
 var slowCssPropertiesKebab;
 var slowTailwindClasses;
 var slow_css_property_default;
 var init_slow_css_property = __esm(() => {
-  createRule7 = import_utils7.ESLintUtils.RuleCreator(() => {
+  createRule8 = import_utils8.ESLintUtils.RuleCreator(() => {
     return "https://remotion.dev/docs/gpu";
   });
   SlowCssProperty = [
@@ -46694,7 +46803,7 @@ var init_slow_css_property = __esm(() => {
     /\bsepia(?:-\d+)?\b/,
     /\btext-shadow-\w+\b/
   ];
-  slow_css_property_default = createRule7({
+  slow_css_property_default = createRule8({
     name: "slow-css-property",
     meta: {
       type: "problem",
@@ -46752,13 +46861,13 @@ var init_slow_css_property = __esm(() => {
     }
   });
 });
-var createRule8;
+var createRule9;
 var RelativePathStaticFile;
 var AbsoluteStaticFile;
 var PublicStaticFile;
 var staticfile_no_relative_default;
 var init_staticfile_no_relative = __esm(() => {
-  createRule8 = import_utils8.ESLintUtils.RuleCreator(() => {
+  createRule9 = import_utils9.ESLintUtils.RuleCreator(() => {
     return `https://remotion.dev/docs/staticfile-relative-paths`;
   });
   RelativePathStaticFile = [
@@ -46774,7 +46883,7 @@ var init_staticfile_no_relative = __esm(() => {
     "Do not prefix your assets with public/.",
     "See: https://remotion.dev/docs/staticfile-relative-paths"
   ].join("");
-  staticfile_no_relative_default = createRule8({
+  staticfile_no_relative_default = createRule9({
     name: "staticfile-no-relative",
     meta: {
       type: "problem",
@@ -46840,11 +46949,11 @@ var init_staticfile_no_relative = __esm(() => {
     }
   });
 });
-var createRule9;
+var createRule10;
 var RelativePathStaticFile2;
 var staticfile_no_remote_default;
 var init_staticfile_no_remote = __esm(() => {
-  createRule9 = import_utils9.ESLintUtils.RuleCreator(() => {
+  createRule10 = import_utils10.ESLintUtils.RuleCreator(() => {
     return `https://remotion.dev/docs/staticfile-remote-urls`;
   });
   RelativePathStaticFile2 = [
@@ -46852,7 +46961,7 @@ var init_staticfile_no_remote = __esm(() => {
     "See: https://remotion.dev/docs/staticfile-remote-urls"
   ].join(`
 `);
-  staticfile_no_remote_default = createRule9({
+  staticfile_no_remote_default = createRule10({
     name: "staticfile-no-remote",
     meta: {
       type: "problem",
@@ -46904,11 +47013,11 @@ var init_staticfile_no_remote = __esm(() => {
     }
   });
 });
-var createRule10;
+var createRule11;
 var UseGifComponent;
 var use_gif_component_default;
 var init_use_gif_component = __esm(() => {
-  createRule10 = import_utils10.ESLintUtils.RuleCreator(() => {
+  createRule11 = import_utils11.ESLintUtils.RuleCreator(() => {
     return `https://github.com/remotion-dev/remotion`;
   });
   UseGifComponent = [
@@ -46917,7 +47026,7 @@ var init_use_gif_component = __esm(() => {
     "Ignore this message if this is a non-animated GIF."
   ].join(`
 `);
-  use_gif_component_default = createRule10({
+  use_gif_component_default = createRule11({
     name: "use-gif-component",
     meta: {
       type: "problem",
@@ -46992,15 +47101,15 @@ var init_use_gif_component = __esm(() => {
     }
   });
 });
-var createRule11;
+var createRule12;
 var ImportConfig = "Update the import to the new V4 location: import {Config} from '@remotion/cli/config'";
 var rule;
 var v4_import_default;
 var init_v4_import = __esm(() => {
-  createRule11 = import_utils11.ESLintUtils.RuleCreator(() => {
+  createRule12 = import_utils12.ESLintUtils.RuleCreator(() => {
     return `https://www.remotion.dev/docs/4-0-migration`;
   });
-  rule = createRule11({
+  rule = createRule12({
     name: "v4-config-import",
     meta: {
       type: "problem",
@@ -47034,14 +47143,14 @@ var init_v4_import = __esm(() => {
   });
   v4_import_default = rule;
 });
-var createRule12;
+var createRule13;
 var VolumeCallback = "Prefer a callback function for setting the volume: `volume={(f) => interpolate(...)}`. See https://www.remotion.dev/docs/audio/volume";
 var volume_callback_default;
 var init_volume_callback = __esm(() => {
-  createRule12 = import_utils12.ESLintUtils.RuleCreator(() => {
+  createRule13 = import_utils13.ESLintUtils.RuleCreator(() => {
     return `https://github.com/remotion-dev/remotion`;
   });
-  volume_callback_default = createRule12({
+  volume_callback_default = createRule13({
     name: "volume-callback",
     meta: {
       type: "problem",
@@ -47108,17 +47217,17 @@ var init_volume_callback = __esm(() => {
     }
   });
 });
-var createRule13;
+var createRule14;
 var NoNativeImgTag = "Prefer the <Img /> tag from 'remotion' package, because it will wait until the image is loaded when you are rendering your video.";
 var NoNativeIFrameTag = "Prefer the <IFrame /> tag from 'remotion' package, because it will wait until the iframe is loaded when you are rendering your video.";
 var NoNativeAudioTag = "Use the <Audio /> tag from 'remotion' package, because it will synchronize with the Remotion timeline.";
 var NoNativeVideoTag = "Use the <OffthreadVideo /> tag from 'remotion' package, because it will synchronize with the Remotion timeline.";
 var warn_native_media_tag_default;
 var init_warn_native_media_tag = __esm(() => {
-  createRule13 = import_utils13.ESLintUtils.RuleCreator(() => {
+  createRule14 = import_utils14.ESLintUtils.RuleCreator(() => {
     return `https://github.com/remotion-dev/remotion`;
   });
-  warn_native_media_tag_default = createRule13({
+  warn_native_media_tag_default = createRule14({
     name: "warn-native-media-tag",
     meta: {
       type: "problem",
@@ -47213,6 +47322,7 @@ var require_src2 = __commonJS2((exports, module) => {
   init_no_duration_frames_infinity();
   init_no_from_0();
   init_no_string_assets();
+  init_non_pure_animation();
   init_slow_css_property();
   init_staticfile_no_relative();
   init_staticfile_no_remote();
@@ -47232,6 +47342,7 @@ var require_src2 = __commonJS2((exports, module) => {
     "staticfile-no-relative": staticfile_no_relative_default,
     "staticfile-no-remote": staticfile_no_remote_default,
     "no-background-image": no_background_image_default,
+    "non-pure-animation": non_pure_animation_default,
     "slow-css-property": slow_css_property_default,
     "v4-config-import": v4_import_default
   };
@@ -47247,6 +47358,7 @@ var require_src2 = __commonJS2((exports, module) => {
     "@remotion/staticfile-no-relative": "error",
     "@remotion/staticfile-no-remote": "error",
     "@remotion/no-background-image": "error",
+    "@remotion/non-pure-animation": "warn",
     "@remotion/slow-css-property": "warn",
     "@remotion/v4-config-import": "error"
   };

package/package.json

@@ -3,7 +3,7 @@
     "url": "https://github.com/remotion-dev/remotion/tree/main/packages/eslint-config-flat"
   },
   "name": "@remotion/eslint-config-flat",
-  "version": "4.0.340",
+  "version": "4.0.342",
   "description": "Default configuration for Remotion templates (ESLint >= 9)",
   "main": "dist/esm/index.mjs",
   "type": "module",
@@ -26,8 +26,8 @@
     "eslint-plugin-react": "7.37.4",
     "eslint-plugin-react-hooks": "5.2.0",
     "eslint": "9.19.0",
-    "@remotion/eslint-plugin": "4.0.340",
-    "@remotion/eslint-config-internal": "4.0.340"
+    "@remotion/eslint-plugin": "4.0.342",
+    "@remotion/eslint-config-internal": "4.0.342"
   },
   "keywords": [
     "remotion",