@mehshekari/gsap-motion 4.3.0 → 4.5.0

package/skill/scripts/lib/ast.mjs

@@ -214,26 +214,75 @@ export function tweenMethod(node) {
   return allowed.has(method) ? method : null;
 }
 
-const argumentObject = (call, index) => {
-  const node = unwrap(call.arguments[index]);
-  return node?.type === "ObjectExpression" ? node : null;
-};
+/**
+ * The object literal bound to `name` by a `const`, when the file binds that
+ * name exactly once. Two bindings of one name, in different functions, would
+ * need scope to tell apart; a wrong guess is a false finding, so neither is
+ * read.
+ */
+function constObject(root, name) {
+  const bound = findAll(
+    root,
+    (node) => node.type === "VariableDeclarator" && node.id.type === "Identifier" && node.id.name === name,
+  );
+  if (bound.length !== 1 || !bound[0].init) return null;
+  const declaration = parentOf(root, bound[0]);
+  if (declaration?.kind !== "const") return null;
+  const init = unwrap(bound[0].init);
+  return init.type === "ObjectExpression" ? init : null;
+}
+
+/** `node`'s properties, re-anchored at `site`: a finding lands where the tween uses them. */
+const anchoredAt = (properties, site) =>
+  properties.map((property) => ({ ...property, start: site.start, end: site.end }));
+
+/**
+ * The object a vars argument stands for: a literal, or a `const` bound to one,
+ * with any spread of such a `const` unfolded in place. Vars written once and
+ * shared between a `fromTo`'s ends are how a real film's credits hid two of
+ * seven filter tweens from the audit.
+ */
+function resolveObject(root, node, seen = new Set()) {
+  let target = unwrap(node);
+  let site = null;
+  if (target?.type === "Identifier" && root) {
+    site = target;
+    target = constObject(root, target.name);
+  }
+  if (target?.type !== "ObjectExpression" || seen.has(target)) return null;
+  seen.add(target);
+
+  let unfolded = false;
+  const properties = target.properties.flatMap((property) => {
+    if (property.type !== "SpreadElement") return [property];
+    const spread = resolveObject(root, property.argument, seen);
+    if (!spread) return [property];
+    unfolded = true;
+    return anchoredAt(spread.properties, property);
+  });
+  /** A literal with nothing to unfold is returned as it is, not as a copy. */
+  if (site) return { ...target, start: site.start, end: site.end, properties: anchoredAt(properties, site) };
+  return unfolded ? { ...target, properties } : target;
+}
+
+const argumentObject = (call, index, root) => resolveObject(root, call.arguments[index]);
 
 /**
  * The vars object that holds a tween's own settings — `repeat`, `ease`,
  * `yoyo`: the second argument, a `fromTo`'s third, a timeline's first. `null`
- * when it is not an object literal.
+ * when it is neither an object literal nor a `const` bound to one. Pass the
+ * file's `root` to follow a `const`; without it, only literals are read.
  */
-export const ownVars = (call, method) =>
-  argumentObject(call, method === "fromTo" ? 2 : method === "timeline" ? 0 : 1);
+export const ownVars = (call, method, root) =>
+  argumentObject(call, method === "fromTo" ? 2 : method === "timeline" ? 0 : 1, root);
 
 /**
  * Every vars object a tween call carries, as object literals: both of a
  * `fromTo`'s, a timeline's own, or the tween's.
  */
-export function varsObjects(call, method) {
+export function varsObjects(call, method, root) {
   const indexes = method === "fromTo" ? [1, 2] : method === "timeline" ? [0] : [1];
-  return indexes.map((index) => argumentObject(call, index)).filter(Boolean);
+  return indexes.map((index) => argumentObject(call, index, root)).filter(Boolean);
 }
 
 const FUNCTIONS = new Set([
@@ -258,7 +307,7 @@ export const contains = (outer, inner) =>
  * returns `null`: an ambiguous handler is left unread rather than guessed at.
  */
 export function resolveFunction(root, node) {
-  const target = unwrap(node);
+  const target = wrappedFunction(unwrap(node));
   if (isFunction(target)) return target;
   if (target?.type !== "Identifier") return null;
 
@@ -269,13 +318,34 @@ export function resolveFunction(root, node) {
       (n.type === "VariableDeclarator" &&
         n.id.type === "Identifier" &&
         n.id.name === target.name &&
-        isFunction(unwrap(n.init))),
+        isFunction(wrappedFunction(unwrap(n.init)))),
   );
   if (declarations.length !== 1) return null;
   const [declaration] = declarations;
   return declaration.type === "FunctionDeclaration"
     ? declaration
-    : unwrap(declaration.init);
+    : wrappedFunction(unwrap(declaration.init));
+}
+
+/**
+ * The function inside a call that hands it back to run later, unchanged in
+ * what it does: `contextSafe(fn)`, `ctx.add(null, fn)` and `useCallback(fn, deps)`.
+ * The handler the skill recommends is wrapped in contextSafe, and following
+ * names stopped at the wrapper, so a tween per pointer event went unreported.
+ * Anything else is returned as it was.
+ */
+function wrappedFunction(node) {
+  if (node?.type !== "CallExpression") return node;
+  const name = calleeName(node)?.split(".").at(-1);
+  if (name === "contextSafe" || name === "useCallback") return unwrap(node.arguments[0]);
+  if (
+    name === "add" &&
+    unwrap(node.arguments[0])?.type === "Literal" &&
+    unwrap(node.arguments[0]).value === null
+  ) {
+    return unwrap(node.arguments[1]);
+  }
+  return node;
 }
 
 const PARENTS = new WeakMap();

package/skill/scripts/lib/rules.mjs

@@ -54,13 +54,19 @@ const HINT = {
   stackedFrom:
     "A `from` or `fromTo` applies its start state the moment it is built. Built more than once against the same element, the last one wins, and holds that element at its start state until the playhead reaches it — invisible, if the start state hides it. Pass `immediateRender: false`, and set the element's first state yourself with `gsap.set`.",
   orphanTween:
-    "Nothing reverts it on unmount, and React StrictMode runs it twice in development. Move it into the useGSAP body, or wrap the handler in contextSafe. A helper counts as inside only when every use of it is a call from inside a context.",
+    "Nothing reverts it on unmount, and React StrictMode runs it twice in development. Move it into the useGSAP body, or wrap the handler in contextSafe. A helper counts as inside only when every use of it is a call from inside a context. Note that contextSafe keeps every tween it creates until the context reverts: a handler that runs often should replay a timeline built once, or call a quickTo.",
   unmanagedInstance:
     "Inside a context these register themselves and are reverted with it. Out here nothing is watching: move it into the useGSAP body, or keep the instance and revert/kill it from the cleanup.",
   unrevertedContext:
     "Keep it under a name and revert it when the component goes: `onUnmounted` in Vue, the function returned from `onMount` or `$effect` in Svelte, the `useEffect` cleanup in React, `astro:before-swap` in Astro. Everything created inside the context goes with it.",
   tweenPerFrame:
     "A tween per frame allocates an object per frame, and each one fights the last. Create a `gsap.quickTo()` or `quickSetter()` once outside the callback and call it inside — or, for scroll, scrub a timeline instead of writing values by hand.",
+  refReadInCleanup:
+    "So nothing is killed, and the tweens outlive the component. Capture the element in the effect body — `const el = ref.current` — and kill through that in the cleanup, or build the tweens in a useGSAP or gsap.context body, whose revert needs no ref.",
+  allocationPerFrame:
+    "Every frame's object is garbage by the next, and the collector reclaims it in a pause that lands as a dropped frame. Build it once, outside the callback — at module scope, or in a ref or useMemo — and reuse it with `.set()` or `.copy()`.",
+  layoutReadPerFrame:
+    "If anything has changed layout since the last frame, this read makes the browser compute it now, every frame. Measure once and again only on resize — a ScrollTrigger's `onRefresh`, or a ResizeObserver — and read the cached value here.",
   paintProperty:
     "Filters and shadows repaint the layer every frame, and the cost grows with the painted area. Animate `opacity` on a pre-blurred or pre-shadowed copy, or move a transform instead, and measure before defending anything else.",
   unownedLoop:
@@ -92,7 +98,7 @@ const HINT = {
   unregisteredPlugin:
     "An unregistered plugin's properties are ignored without an error — the animation simply does nothing.",
   missingReducedMotion:
-    "Reduced motion is a design, not an off switch: decide what the motion was saying and say it without the travel. Note that the reduced branch must set the END state — a `from` that never runs leaves its target invisible.",
+    "Reduced motion is a design, not an off switch: decide what the motion was saying and say it without the travel. Note that the reduced branch must set the END state — a `from` that never runs leaves its target invisible. If the branch lives in the module that calls this one, waive it here and name that caller.",
   devToolImport:
     "A static import ships regardless of any `if` around the call. Load it with a dynamic `import()` behind a NODE_ENV check, or bake its output in and delete it.",
   markers: 'Gate it: `markers: process.env.NODE_ENV === "development"`.',
@@ -104,6 +110,7 @@ const HINT = {
 const MESSAGE = {
   easedLoop: "An infinite repeat with an ease other than `none`.",
   tweenPerFrame: "A tween is created here on every frame.",
+  layoutReadPerFrame: "Layout is read here on every frame.",
   unownedLoop: "An infinite repeat that nothing pauses.",
   ungatedHover: "A hover animation with no `(hover: hover)` gate.",
   delayChain: "Three or more tweens in this scope are sequenced by `delay`.",
@@ -173,10 +180,19 @@ function layoutHint(property, percent) {
   const swap = TRANSFORM_FOR[property];
   return swap
     ? `Use \`${swap}\` instead — a compositor-only property.` +
+        (property === "height" ? ` ${HEIGHT_CAVEAT}` : "") +
         (percent ? ` ${PERCENT_CAVEAT}` : "")
     : "Prefer transform and opacity; they never touch layout.";
 }
 
+/**
+ * A scale squashes what is inside. An accordion's text is the usual case, and
+ * a real project kept its `height` tween for exactly that reason, which the
+ * hint above alone would have argued against.
+ */
+const HEIGHT_CAVEAT =
+  "Unless what is inside must keep its shape — an accordion's text: then transition `grid-template-rows` from `0fr` to `1fr`, or use Flip.";
+
 /** Whether a transform's from-value, as written, leaves the element untransformed. */
 function identityTransform(property, value) {
   const v = value.trim().replace(/^["'`]|["'`]$/g, "");
@@ -296,6 +312,91 @@ function debounced(handler, node) {
   );
 }
 
+/**
+ * Whether a tween's target is a local the enclosing effect captured, and that
+ * effect's code kills that local's tweens: `const el = ref.current` in the body,
+ * `gsap.killTweensOf(el)` in the cleanup. Found on the corpus, where it was
+ * reported as an orphan.
+ *
+ * Only a captured local counts. `killTweensOf(ref.current)` in a passive
+ * cleanup kills nothing at unmount — React has already cleared the ref — and
+ * that is `ref-read-in-cleanup`'s to say.
+ */
+function killedThroughCapture(ast, node) {
+  if (!isGsapCall(node)) return false;
+  const target = unwrap(node.arguments[0]);
+  if (target?.type !== "Identifier") return false;
+
+  const effect = ancestorsOf(ast, node).find((fn) => {
+    if (!isFunction(fn)) return false;
+    const call = parentOf(ast, fn);
+    return (
+      call?.type === "CallExpression" &&
+      call.arguments[0] === fn &&
+      EFFECTS.has(calleeName(call)?.split(".").at(-1))
+    );
+  });
+  if (!effect) return false;
+
+  const captured = findAll(
+    effect,
+    (n) => n.type === "VariableDeclarator" && n.id.type === "Identifier" && n.id.name === target.name,
+  ).length > 0;
+  if (!captured) return false;
+
+  /**
+   * In the cleanup — the function the effect returns — and nowhere else. A
+   * kill at the top of the body stops the previous run's tweens before
+   * starting new ones; it does nothing at unmount. Nine true corpus findings
+   * did exactly that, and the first version of this check let them go.
+   */
+  const cleanups = cleanupsOf(ast, effect);
+
+  const names = (arg) => {
+    const value = unwrap(arg);
+    if (value?.type === "Identifier") return [value.name];
+    if (value?.type === "ArrayExpression") return value.elements.flatMap((e) => (e ? names(e) : []));
+    return [];
+  };
+  return cleanups.some(
+    (cleanup) =>
+      findAll(
+        cleanup,
+        (n) =>
+          n.type === "CallExpression" &&
+          calleeName(n)?.endsWith("killTweensOf") &&
+          n.arguments.some((arg) => names(arg).includes(target.name)),
+      ).length > 0,
+  );
+}
+
+const EFFECTS = new Set(["useEffect", "useLayoutEffect"]);
+
+/** The functions an effect callback returns: its cleanups. */
+function cleanupsOf(ast, effect) {
+  const cleanups = findAll(
+    effect,
+    (n) => n.type === "ReturnStatement" && n.argument && scopeOf(ast, n) === effect,
+  )
+    .map((n) => unwrap(n.argument))
+    .filter(isFunction);
+  if (effect.type === "ArrowFunctionExpression" && effect.expression && isFunction(unwrap(effect.body))) {
+    cleanups.push(unwrap(effect.body));
+  }
+  return cleanups;
+}
+
+/** Whether `node` reads a ref: a `.current` anywhere inside it. */
+const readsRef = (node) =>
+  findAll(
+    node,
+    (n) =>
+      n.type === "MemberExpression" &&
+      !n.computed &&
+      n.property.type === "Identifier" &&
+      n.property.name === "current",
+  ).length > 0;
+
 /** The calls that add a child to a timeline. */
 const CHILDREN = new Set(["to", "from", "fromTo", "add"]);
 
@@ -327,6 +428,22 @@ function tornDown(ast, node) {
   const kept = keptUnder(ast, node);
   if (endsUnder(kept?.name)) return true;
 
+  /**
+   * A second name for it: `active = timeline`, then `active?.kill()` in the
+   * cleanup. Found on the corpus, in a preview whose timeline was built in a
+   * helper and handed to a variable the effect owns.
+   */
+  if (kept?.name) {
+    const aliases = findAll(ast, (n) => {
+      const from = n.type === "AssignmentExpression" ? n.right : n.type === "VariableDeclarator" ? n.init : null;
+      const to = n.type === "AssignmentExpression" ? n.left : n.type === "VariableDeclarator" ? n.id : null;
+      return unwrap(from)?.type === "Identifier" && unwrap(from).name === kept.name && to?.type === "Identifier";
+    }).map((n) => (n.type === "AssignmentExpression" ? n.left.name : n.id.name));
+    if (aliases.some(endsUnder)) return true;
+  }
+
+  if (killedThroughCapture(ast, node)) return true;
+
   const fn = scopeOf(ast, node);
   if (!isFunction(fn)) return false;
 
@@ -589,6 +706,36 @@ const PAINT_PROPERTIES = new Set([
   "boxShadow",
 ]);
 
+/** Three's math types: what a render loop allocates when it should reuse. */
+const THREE_MATH = new Set([
+  "Vector2",
+  "Vector3",
+  "Vector4",
+  "Quaternion",
+  "Euler",
+  "Matrix3",
+  "Matrix4",
+  "Color",
+  "Box3",
+  "Sphere",
+  "Ray",
+  "Plane",
+  "Spherical",
+]);
+
+/** Reads that return layout, and so make the browser compute it if it is stale. */
+const LAYOUT_READ_METHODS = new Set(["getBoundingClientRect", "getClientRects"]);
+const LAYOUT_READ_PROPERTIES = new Set([
+  "offsetWidth",
+  "offsetHeight",
+  "offsetTop",
+  "offsetLeft",
+  "clientWidth",
+  "clientHeight",
+  "scrollWidth",
+  "scrollHeight",
+]);
+
 const HOVER_EVENTS = new Set([
   "pointerenter",
   "pointerover",
@@ -842,6 +989,62 @@ export const RULES = [
       });
     },
   },
+  {
+    id: "ref-read-in-cleanup",
+    level: "warn",
+    description:
+      "`killTweensOf` given a ref's `.current` in a `useEffect` cleanup, where React has already cleared it at unmount",
+    /**
+     * At unmount React detaches a DOM ref before it runs passive cleanups, so
+     * `ref.current` is null there and the kill finds nothing. A corpus project
+     * did this in three cleanups, and fifteen tweens outlived their component.
+     *
+     * Narrow on purpose. Only `useEffect`: when a layout cleanup runs relative
+     * to ref detachment is not something this rule is sure of. Only
+     * `killTweensOf`, whose argument is the element: a ref that holds a timeline
+     * — `tlRef.current?.kill()` — is not cleared by React, and is correct.
+     */
+    test(file) {
+      if (!file.isReact) return [];
+      const effects = findAll(
+        file.ast,
+        (n) => n.type === "CallExpression" && calleeName(n)?.split(".").at(-1) === "useEffect",
+      )
+        .map((call) => unwrap(call.arguments[0]))
+        .filter(isFunction);
+
+      return effects.flatMap((effect) =>
+        cleanupsOf(file.ast, effect).flatMap((cleanup) => {
+          /** A local the cleanup itself reads from a ref: `const root = rootRef.current`. */
+          const fromRef = new Set(
+            findAll(
+              cleanup,
+              (n) =>
+                n.type === "VariableDeclarator" &&
+                n.id.type === "Identifier" &&
+                n.init &&
+                readsRef(n.init),
+            ).map((n) => n.id.name),
+          );
+          const viaRef = (arg) =>
+            readsRef(arg) ||
+            findAll(arg, (n) => n.type === "Identifier" && fromRef.has(n.name)).length > 0;
+
+          return findAll(
+            cleanup,
+            (n) =>
+              n.type === "CallExpression" &&
+              calleeName(n)?.endsWith("killTweensOf") &&
+              n.arguments.some(viaRef),
+          ).map((call) => ({
+            index: call.start,
+            message: "`killTweensOf` reads a ref in a useEffect cleanup, which React has already cleared at unmount.",
+            hint: HINT.refReadInCleanup,
+          }));
+        }),
+      );
+    },
+  },
   {
     id: "dangling-listener",
     level: "warn",
@@ -1009,7 +1212,7 @@ export const RULES = [
       return findAll(file.ast, animates).flatMap(
         (call) => {
           const seen = new Set();
-          return varsObjects(call, tweenMethod(call))
+          return varsObjects(call, tweenMethod(call), file.ast)
             .flatMap((vars) => vars.properties)
             .filter((property) => {
               const key = keyName(property);
@@ -1087,7 +1290,7 @@ export const RULES = [
     test(file) {
       return findAll(file.ast, (node) => tweenMethod(node) !== null).flatMap(
         (call) => {
-          const vars = ownVars(call, tweenMethod(call));
+          const vars = ownVars(call, tweenMethod(call), file.ast);
           if (!vars) return [];
           const repeat = propertyOf(vars, "repeat");
           if (!repeat || numberValue(repeat.value) !== -1) return [];
@@ -1401,6 +1604,91 @@ export const RULES = [
       return findings;
     },
   },
+  {
+    id: "allocation-per-frame",
+    level: "warn",
+    description:
+      "A Three.js vector, colour, matrix or quaternion built every frame — in `useFrame`, the ticker, `onUpdate` or a `requestAnimationFrame` loop",
+    /**
+     * Only Three's math types, by name. Any `new` in a frame allocates, but a
+     * `Set` or a `Map` there is usually deliberate and rarely hot; these are
+     * the objects a render loop builds by the thousand, once per object per
+     * frame, and each has a `set` or `copy` that makes the allocation pointless.
+     */
+    test(file) {
+      const scopes = perFrameScopes(file.ast);
+      if (scopes.length === 0) return [];
+
+      const built = findAll(file.ast, (node) => {
+        if (node.type !== "NewExpression") return false;
+        const name = dottedName(unwrap(node.callee))?.split(".").at(-1);
+        return THREE_MATH.has(name);
+      });
+
+      const reported = new Set();
+      return built.flatMap((node) => {
+        if (reported.has(node.start) || !scopes.some((scope) => contains(scope, node))) {
+          return [];
+        }
+        reported.add(node.start);
+        const name = dottedName(unwrap(node.callee)).split(".").at(-1);
+        return [
+          {
+            index: node.start,
+            message: `A \`${name}\` is allocated here on every frame.`,
+            hint: HINT.allocationPerFrame,
+          },
+        ];
+      });
+    },
+  },
+  {
+    id: "layout-read-per-frame",
+    level: "info",
+    description:
+      "A layout read — `getBoundingClientRect`, `offsetWidth`, `getComputedStyle` — in a callback that runs every frame",
+    /**
+     * Info, because a read is only expensive when something has invalidated
+     * layout since the last frame, and that depends on what else runs — a
+     * transform does not, a `width` tween does. What is certain is that the
+     * value is re-measured every frame when it usually changes only on resize.
+     */
+    test(file) {
+      const scopes = perFrameScopes(file.ast);
+      if (scopes.length === 0) return [];
+
+      const reads = findAll(file.ast, (node) => {
+        if (node.type === "CallExpression") {
+          const name = calleeName(node);
+          return (
+            name === "getComputedStyle" ||
+            name === "window.getComputedStyle" ||
+            LAYOUT_READ_METHODS.has(methodName(node))
+          );
+        }
+        return (
+          node.type === "MemberExpression" &&
+          !node.computed &&
+          LAYOUT_READ_PROPERTIES.has(node.property.name)
+        );
+      });
+
+      const reported = new Set();
+      return reads.flatMap((node) => {
+        if (reported.has(node.start) || !scopes.some((scope) => contains(scope, node))) {
+          return [];
+        }
+        reported.add(node.start);
+        return [
+          {
+            index: node.start,
+            message: MESSAGE.layoutReadPerFrame,
+            hint: HINT.layoutReadPerFrame,
+          },
+        ];
+      });
+    },
+  },
   {
     id: "paint-property",
     level: "warn",
@@ -1415,7 +1703,7 @@ export const RULES = [
 
       return findAll(file.ast, animates).flatMap((call) => {
         const seen = new Set();
-        return varsObjects(call, tweenMethod(call))
+        return varsObjects(call, tweenMethod(call), file.ast)
           .flatMap((vars) => vars.properties)
           .filter((property) => {
             const key = keyName(property);
@@ -1462,7 +1750,7 @@ export const RULES = [
 
       return findAll(file.ast, (node) => tweenMethod(node) !== null).flatMap((call) => {
         if (inside(call)) return [];
-        const vars = ownVars(call, tweenMethod(call));
+        const vars = ownVars(call, tweenMethod(call), file.ast);
         if (!vars) return [];
         const repeat = propertyOf(vars, "repeat");
         if (!repeat || numberValue(repeat.value) !== -1) return [];
@@ -1518,7 +1806,7 @@ export const RULES = [
 
       for (const call of findAll(file.ast, (node) => tweenMethod(node) !== null)) {
         if (chainStart(call) !== call) continue;
-        const vars = ownVars(call, tweenMethod(call));
+        const vars = ownVars(call, tweenMethod(call), file.ast);
         const delay = vars && propertyOf(vars, "delay");
         if (!delay || !(numberValue(delay.value) > 0)) continue;
         const scope = scopeOf(file.ast, call) ?? file.ast;
@@ -1556,6 +1844,22 @@ export const RULES = [
       if (findAll(file.ast, (node) => spells(node, "prefers-reduced-motion")).length) {
         return [];
       }
+      /**
+       * The query is often written once, in a shared module, and asked by name:
+       * `useReducedMotion()`, `prefersReducedMotion()`, `isReduced()`, or
+       * `matchMedia(REDUCED_MOTION_QUERY)`. That is a branch too. "Reduced",
+       * not "reduce", so an array's `.reduce()` is not one.
+       */
+      const asksByName = findAll(file.ast, (node) => {
+        if (node.type !== "CallExpression") return false;
+        const name = calleeName(node)?.split(".").at(-1) ?? "";
+        if (/reduced/i.test(name)) return true;
+        return (
+          name === "matchMedia" &&
+          node.arguments.some((arg) => arg.type === "Identifier" && /reduced/i.test(arg.name))
+        );
+      });
+      if (asksByName.length) return [];
 
       const [first] = findAll(file.ast, (node) => {
         const method = tweenMethod(node);

package/skill/scripts/lib/source.mjs

@@ -241,7 +241,15 @@ export function fromText(raw, path, display = path) {
       /\bfrom ["']react["']/.test(code) ||
       /\bfrom ["']@gsap\/react["']/.test(code),
     isClient: /^\s*["']use client["']/m.test(code),
-    usesGsap: /\bfrom ["']gsap(?:\/|["'])/.test(code),
+    /**
+     * GSAP itself, or a binding named `gsap` from anywhere: a project's own
+     * wrapper (`import { gsap } from "@/core/motion/gsap"`) is common, and
+     * reading only the package left orphan-tween and missing-reduced-motion
+     * blind to every file in a real project that used one.
+     */
+    usesGsap:
+      /\bfrom ["']gsap(?:\/|["'])/.test(code) ||
+      /\bimport\s+(?!type\b)(?:gsap\b|\{[^}]*\bgsap\b[^}]*\})[^;]*?\bfrom\s*["']/.test(code),
   };
 }