@pyreon/lint 0.12.13 → 0.12.14

package/src/rules/ssr/no-window-in-ssr.ts

@@ -1,5 +1,6 @@
 import type { Rule, VisitorCallbacks } from '../../types'
 import { getSpan, isCallTo } from '../../utils/ast'
+import { isPathExempt } from '../../utils/exempt-paths'
 import { BROWSER_GLOBALS } from '../../utils/imports'
 
 export const noWindowInSsr: Rule = {
@@ -9,61 +10,443 @@ export const noWindowInSsr: Rule = {
     description: 'Disallow browser globals outside onMount/effect/typeof guards — they break SSR.',
     severity: 'error',
     fixable: false,
+    schema: { exemptPaths: 'string[]' },
   },
   create(context) {
+    // Configurable `exemptPaths` option — projects opt out directories
+    // that legitimately run in a DOM-only environment (e.g. a DOM renderer
+    // package has no SSR scenario). Monorepo configures its own paths in
+    // `.pyreonlintrc.json`; user apps typically leave this empty.
+    if (isPathExempt(context)) return {}
+
     let safeDepth = 0
     let typeofGuardDepth = 0
+    // Inside `typeof X` itself, the identifier mention is safe — `typeof` is
+    // the only operator that doesn't evaluate its operand. We track this via
+    // visitor enter/exit because the oxc visitor doesn't pass `parent` to
+    // identifier callbacks (the previous `parent.operator === 'typeof'`
+    // check was silently inert).
+    let inTypeofExpr = 0
+    // Identifiers that are member-property names (`x.addEventListener`),
+    // object-property keys (`{ document: 1 }`), or import-specifier names
+    // are NOT global references — pre-collected when their containing
+    // node is visited, then skipped when the bare Identifier visitor fires.
+    // Same root cause as `inTypeofExpr`: the previous `parent.type ===
+    // 'MemberExpression'` check was inert (oxc visitor doesn't pass parent).
+    const skipPropertyNodes = new WeakSet<any>()
+    // Identifiers inside TypeScript type-position nodes (`let x: Window`,
+    // `interface X { y: Document }`, `type T = Navigator`, generics, etc.)
+    // are type references — they're erased at compile time. Track via depth
+    // counter on any `TS*` node entry; identifiers visited while depth > 0
+    // are skipped.
+    let inTsTypePos = 0
+
+    // Track `const isBrowser = typeof window !== 'undefined'` (or any
+    // const whose initializer is a typeof check). Treats `if (isBrowser)`
+    // the same as `if (typeof window !== 'undefined')` — the universal
+    // browser-detection idiom. Set captured at module scope; lookups by name.
+    const typeofBoundConsts = new Set<string>()
+    function isPositiveTypeofCheck(expr: any): boolean {
+      if (!expr) return false
+      // `typeof X !== 'undefined'` (or `!=`) — the POSITIVE form: body is
+      // the browser-safe branch.
+      if (
+        expr.type === 'BinaryExpression' &&
+        (expr.operator === '!==' || expr.operator === '!=') &&
+        expr.left?.type === 'UnaryExpression' &&
+        expr.left.operator === 'typeof'
+      )
+        return true
+      // Bare `typeof X` as truthiness check (rare).
+      if (expr.type === 'UnaryExpression' && expr.operator === 'typeof') return true
+      return false
+    }
+    /** Used by VariableDeclaration to decide whether to bind a const. */
+    function isTypeofCheckForBinding(expr: any): boolean {
+      if (!expr) return false
+      if (
+        expr.type === 'BinaryExpression' &&
+        expr.left?.type === 'UnaryExpression' &&
+        expr.left.operator === 'typeof'
+      )
+        return true
+      if (expr.type === 'UnaryExpression' && expr.operator === 'typeof') return true
+      // `const useVT = _isBrowser && ... && typeof X === 'function'` — if
+      // any term in an AND chain is a typeof check (direct or via another
+      // typeof-bound const), the whole expression is typeof-derived: every
+      // non-falsy value requires every term to have evaluated truthy.
+      if (expr.type === 'LogicalExpression' && expr.operator === '&&') {
+        return isTypeofCheckForBinding(expr.left) || isTypeofCheckForBinding(expr.right)
+      }
+      // `const handler = _isBrowser ? (e) => … : null` / `_isBrowser ? fn()
+      // : null` — ternary with a typeof-derived const as test. The non-null
+      // branch only exists when the guard is truthy, so the binding is
+      // transitively typeof-derived. Same for `_isBrowser ? X : null`
+      // where `X` is typeof-derived.
+      if (expr.type === 'ConditionalExpression') {
+        return isTypeofCheckForBinding(expr.test)
+      }
+      if (expr.type === 'Identifier' && typeofBoundConsts.has(expr.name)) return true
+      return false
+    }
+    /**
+     * `if (test) { … }` — does the test indicate the body is the
+     * BROWSER-SAFE branch? Only positive forms qualify here. Negated
+     * forms (`typeof X === 'undefined'`, `!isBrowser`) are early-return
+     * guards handled separately.
+     */
+    function testIsTypeofGuard(test: any): boolean {
+      if (!test) return false
+      if (isPositiveTypeofCheck(test)) return true
+      // `if (isBrowser)` — bound from a typeof, body is browser-safe.
+      if (test.type === 'Identifier' && typeofBoundConsts.has(test.name)) return true
+      // `if (isBrowser())` — function whose body returns a typeof check.
+      if (
+        test.type === 'CallExpression' &&
+        test.callee?.type === 'Identifier' &&
+        typeofGuardFunctions.has(test.callee.name)
+      )
+        return true
+      // `if (typeofGuard && other)` / `if (other && typeofGuard)` — either
+      // side being a typeof guard means the body only runs when the guard
+      // is truthy (AND short-circuits). Common in ternary tests like
+      // `IS_BROWSER && active() ? <Portal … /> : null`.
+      if (test.type === 'LogicalExpression' && test.operator === '&&') {
+        return testIsTypeofGuard(test.left) || testIsTypeofGuard(test.right)
+      }
+      return false
+    }
+    // Functions whose body is `return <typeof check expr>` — invoked as
+    // the convention `isBrowser()` / `isClient()` early-return guards.
+    // E.g. `function isBrowser() { return typeof window !== 'undefined' }`.
+    // Calls to these functions count as typeof checks for guard analysis.
+    // Pre-seeded with conventional names (recognised across module
+    // boundaries — same approach as `dev-guard-warnings` recognises
+    // `__DEV__`/`IS_DEV`/etc. by name): user-supplied implementations of
+    // `isBrowser` / `isClient` / `isServer` / `isSSR` are treated as
+    // typeof guards even when imported from another file. Each file's
+    // local `function isBrowser() { return typeof window !== 'undefined' }`
+    // also adds itself to the set.
+    const typeofGuardFunctions = new Set<string>(['isBrowser', 'isClient', 'isServer', 'isSSR'])
+    function bodyIsTypeofGuard(body: any): boolean {
+      if (!body) return false
+      // Arrow concise body: `() => typeof window !== 'undefined'` →
+      // body IS the expression directly, not a BlockStatement.
+      if (body.type !== 'BlockStatement') return isReturnedTypeofExpr(body)
+      // Block body: must be a single `return <expr>` statement.
+      const stmts = body.body ?? []
+      if (stmts.length !== 1) return false
+      const stmt = stmts[0]
+      if (stmt?.type !== 'ReturnStatement') return false
+      return isReturnedTypeofExpr(stmt.argument)
+    }
+    function isReturnedTypeofExpr(expr: any): boolean {
+      if (!expr) return false
+      if (isPositiveTypeofCheck(expr)) return true
+      // AND-chain of typeof checks (or typeof-bound consts) — a function
+      // returning `typeof window !== 'undefined' && typeof document !== 'undefined'`
+      // is still a typeof guard.
+      if (expr.type === 'LogicalExpression' && expr.operator === '&&') {
+        return isReturnedTypeofExpr(expr.left) && isReturnedTypeofExpr(expr.right)
+      }
+      // Identifier reference to a previously-bound typeof const.
+      if (expr.type === 'Identifier' && typeofBoundConsts.has(expr.name)) return true
+      return false
+    }
+
+    // Track functions that begin with an early-return on a NEGATED typeof
+    // guard: `if (typeof window === 'undefined') return …` or
+    // `if (!isBrowser) return`. After such a guard, the rest of the
+    // function body is implicitly typeof-guarded (the SSR path bailed).
+    // We use enter/exit on function nodes to bracket the guard zone.
+    function isNegatedTypeofExpr(test: any): boolean {
+      if (!test) return false
+      // `typeof X === 'undefined'` — explicit equality form
+      if (
+        test.type === 'BinaryExpression' &&
+        (test.operator === '===' || test.operator === '==') &&
+        test.left?.type === 'UnaryExpression' &&
+        test.left.operator === 'typeof'
+      )
+        return true
+      // `!isBrowser` where isBrowser is bound from typeof
+      if (
+        test.type === 'UnaryExpression' &&
+        test.operator === '!' &&
+        test.argument?.type === 'Identifier' &&
+        typeofBoundConsts.has(test.argument.name)
+      )
+        return true
+      // `!isBrowser()` where isBrowser is a typeof-guard function — common
+      // SSR pattern in storage adapters: `if (!isBrowser()) return null`.
+      if (
+        test.type === 'UnaryExpression' &&
+        test.operator === '!' &&
+        test.argument?.type === 'CallExpression' &&
+        test.argument.callee?.type === 'Identifier' &&
+        typeofGuardFunctions.has(test.argument.callee.name)
+      )
+        return true
+      // `typeof X === 'undefined' || typeof Y === 'undefined'` — chained
+      // SSR bailouts (common when a feature needs multiple browser APIs).
+      // Both sides must be negated-typeof checks.
+      if (test.type === 'LogicalExpression' && test.operator === '||') {
+        return isNegatedTypeofExpr(test.left) && isNegatedTypeofExpr(test.right)
+      }
+      return false
+    }
+    function isEarlyReturnTypeofGuard(stmt: any): boolean {
+      if (!stmt || stmt.type !== 'IfStatement') return false
+      if (!isNegatedTypeofExpr(stmt.test)) return false
+      // Consequent must terminate the function — either a return or a throw
+      // (both bail out, leaving the rest of the body implicitly guarded).
+      // Bare statement OR single-statement block are both accepted.
+      const c = stmt.consequent
+      const isTerminator = (s: any): boolean =>
+        s?.type === 'ReturnStatement' || s?.type === 'ThrowStatement'
+      if (isTerminator(c)) return true
+      if (c?.type === 'BlockStatement' && c.body.length === 1 && isTerminator(c.body[0]))
+        return true
+      return false
+    }
+    // Per-function counter of how many typeofGuardDepth bumps were
+    // contributed by early-return guards inside this function — popped on
+    // function exit to keep the depth balanced.
+    const earlyReturnStack: number[] = []
+    // Callback nodes (2nd arg of `watch(source, cb)`) pre-marked so the
+    // function-scope visitor bumps safeDepth only inside them. The source
+    // arg (evaluated at setup) stays unmarked and gets normal analysis.
+    const watchCallbackNodes = new WeakSet<any>()
+    // Parallel stack recording whether the current function scope bumped
+    // safeDepth for being a watch callback. Paired with `popFunctionScope`
+    // so the depth is balanced even with nested watch calls.
+    const watchCallbackSafeDepthStack: number[] = []
+    // Stack of parameter names that shadow browser globals for the current
+    // function scope. E.g. `function push(location)` — any `location`
+    // identifier inside this function refers to the parameter, not the
+    // browser global. Pushed on function enter, popped on exit.
+    const shadowedNamesStack: Array<Set<string>> = []
+    // Module-level names that shadow browser globals via imports — e.g.
+    // `import { history } from '@codemirror/commands'`. Any `history`
+    // identifier in the file then refers to the import, not `window.history`.
+    // Populated by ImportSpecifier / ImportDefaultSpecifier / ImportNamespaceSpecifier.
+    const importShadowedNames = new Set<string>()
+    function collectParamNames(params: any[]): Set<string> {
+      const names = new Set<string>()
+      const walk = (p: any) => {
+        if (!p) return
+        if (p.type === 'Identifier' && BROWSER_GLOBALS.has(p.name)) names.add(p.name)
+        else if (p.type === 'AssignmentPattern') walk(p.left)
+        else if (p.type === 'RestElement') walk(p.argument)
+        else if (p.type === 'ArrayPattern') for (const el of p.elements ?? []) walk(el)
+        else if (p.type === 'ObjectPattern')
+          for (const prop of p.properties ?? []) {
+            if (prop.type === 'RestElement') walk(prop.argument)
+            else walk(prop.value)
+          }
+      }
+      for (const p of params ?? []) walk(p)
+      return names
+    }
+    function isNameShadowed(name: string): boolean {
+      for (let i = shadowedNamesStack.length - 1; i >= 0; i--) {
+        if (shadowedNamesStack[i]!.has(name)) return true
+      }
+      return false
+    }
+    function pushFunctionScope(node?: any) {
+      earlyReturnStack.push(0)
+      shadowedNamesStack.push(node ? collectParamNames(node.params ?? []) : new Set())
+      if (node && watchCallbackNodes.has(node)) {
+        safeDepth++
+        watchCallbackSafeDepthStack.push(1)
+      } else {
+        watchCallbackSafeDepthStack.push(0)
+      }
+    }
+    function popFunctionScope() {
+      const bumps = earlyReturnStack.pop() ?? 0
+      typeofGuardDepth -= bumps
+      shadowedNamesStack.pop()
+      const watchBump = watchCallbackSafeDepthStack.pop() ?? 0
+      if (watchBump > 0) safeDepth -= watchBump
+    }
+    function noteEarlyReturnGuardVisit() {
+      typeofGuardDepth++
+      if (earlyReturnStack.length > 0) {
+        earlyReturnStack[earlyReturnStack.length - 1]!++
+      }
+    }
 
     const callbacks: VisitorCallbacks = {
+      VariableDeclaration(node: any) {
+        for (const decl of node.declarations ?? []) {
+          if (decl.id?.type !== 'Identifier') continue
+          // const isBrowser = typeof window !== 'undefined'
+          if (isTypeofCheckForBinding(decl.init)) {
+            typeofBoundConsts.add(decl.id.name)
+          }
+          // const isBrowser = () => typeof window !== 'undefined'
+          // const isBrowser = function () { return typeof window !== 'undefined' }
+          if (
+            (decl.init?.type === 'ArrowFunctionExpression' ||
+              decl.init?.type === 'FunctionExpression') &&
+            bodyIsTypeofGuard(decl.init.body)
+          ) {
+            typeofGuardFunctions.add(decl.id.name)
+          }
+        }
+      },
+      FunctionDeclaration(node: any) {
+        // function isBrowser() { return typeof window !== 'undefined' }
+        if (node.id?.type === 'Identifier' && bodyIsTypeofGuard(node.body)) {
+          typeofGuardFunctions.add(node.id.name)
+        }
+        pushFunctionScope(node)
+      },
+      'FunctionDeclaration:exit': popFunctionScope,
+      FunctionExpression: pushFunctionScope,
+      'FunctionExpression:exit': popFunctionScope,
+      ArrowFunctionExpression: pushFunctionScope,
+      'ArrowFunctionExpression:exit': popFunctionScope,
       CallExpression(node: any) {
-        if (isCallTo(node, 'onMount') || isCallTo(node, 'effect')) {
+        // `onMount` / `onUnmount` / `onCleanup` / `effect` / `renderEffect` /
+        // `requestAnimationFrame` — the whole call's arguments are safe:
+        // the callback runs post-mount / in a browser frame, and those
+        // hooks accept a single callback arg (no setup-time source).
+        if (
+          isCallTo(node, 'onMount') ||
+          isCallTo(node, 'onUnmount') ||
+          isCallTo(node, 'onCleanup') ||
+          isCallTo(node, 'effect') ||
+          isCallTo(node, 'renderEffect') ||
+          isCallTo(node, 'requestAnimationFrame')
+        ) {
           safeDepth++
+          return
+        }
+        // `watch(source, cb)` — the SOURCE arg is evaluated synchronously
+        // at setup time (to track signals) so browser-global access inside
+        // it is NOT safe. Only the CALLBACK arg fires deferred. Pre-mark
+        // the second arg so the ArrowFn/FunctionExpression visitor bumps
+        // safeDepth only there — not across the whole CallExpression.
+        if (isCallTo(node, 'watch')) {
+          const cb = node.arguments?.[1]
+          if (
+            cb?.type === 'ArrowFunctionExpression' ||
+            cb?.type === 'FunctionExpression' ||
+            cb?.type === 'FunctionDeclaration'
+          ) {
+            watchCallbackNodes.add(cb)
+          }
         }
       },
       'CallExpression:exit'(node: any) {
-        if (isCallTo(node, 'onMount') || isCallTo(node, 'effect')) {
+        if (
+          isCallTo(node, 'onMount') ||
+          isCallTo(node, 'onUnmount') ||
+          isCallTo(node, 'onCleanup') ||
+          isCallTo(node, 'effect') ||
+          isCallTo(node, 'renderEffect') ||
+          isCallTo(node, 'requestAnimationFrame')
+        ) {
           safeDepth--
         }
       },
       IfStatement(node: any) {
-        // typeof window !== "undefined"
-        const test = node.test
-        if (
-          test?.type === 'BinaryExpression' &&
-          test.left?.type === 'UnaryExpression' &&
-          test.left.operator === 'typeof'
-        ) {
-          typeofGuardDepth++
-        }
+        // `if (typeof X !== 'undefined') { … browser-only … }` —
+        // body-scoped typeof guard.
+        if (testIsTypeofGuard(node.test)) typeofGuardDepth++
+        // `if (typeof X === 'undefined') return` — early-return guard.
+        // Bumps the guard depth FROM HERE through the rest of the
+        // enclosing function (popped at function exit). Done at IfStatement
+        // visit (not function enter) so `typeofBoundConsts` is already
+        // populated by any `const isBrowser = …` above this if.
+        else if (isEarlyReturnTypeofGuard(node)) noteEarlyReturnGuardVisit()
       },
       'IfStatement:exit'(node: any) {
-        const test = node.test
-        if (
-          test?.type === 'BinaryExpression' &&
-          test.left?.type === 'UnaryExpression' &&
-          test.left.operator === 'typeof'
-        ) {
-          typeofGuardDepth--
+        if (testIsTypeofGuard(node.test)) typeofGuardDepth--
+      },
+      // Ternary `typeof X !== 'undefined' ? safe : fallback` — the
+      // `consequent` branch is type-guarded. Tracked via depth: enter
+      // increments globally because the visitor doesn't tell us which
+      // branch we're in. That's an over-approximation (the fallback also
+      // gets the depth bump), but the fallback typically doesn't reference
+      // browser globals; the consequent does. Conservative; matches real
+      // code patterns.
+      ConditionalExpression(node: any) {
+        if (testIsTypeofGuard(node.test)) typeofGuardDepth++
+      },
+      'ConditionalExpression:exit'(node: any) {
+        if (testIsTypeofGuard(node.test)) typeofGuardDepth--
+      },
+      UnaryExpression(node: any) {
+        if (node.operator === 'typeof') inTypeofExpr++
+      },
+      'UnaryExpression:exit'(node: any) {
+        if (node.operator === 'typeof') inTypeofExpr--
+      },
+      // TypeScript type-position nodes — identifiers inside these are
+      // type references (erased at compile), not runtime accesses. Cover
+      // the common entry points; depth counter handles any nested
+      // `TSTypeAnnotation` etc.
+      TSTypeAnnotation(_n: any) { inTsTypePos++ },
+      'TSTypeAnnotation:exit'(_n: any) { inTsTypePos-- },
+      TSTypeReference(_n: any) { inTsTypePos++ },
+      'TSTypeReference:exit'(_n: any) { inTsTypePos-- },
+      TSTypeAliasDeclaration(_n: any) { inTsTypePos++ },
+      'TSTypeAliasDeclaration:exit'(_n: any) { inTsTypePos-- },
+      TSInterfaceDeclaration(_n: any) { inTsTypePos++ },
+      'TSInterfaceDeclaration:exit'(_n: any) { inTsTypePos-- },
+      TSTypeParameter(_n: any) { inTsTypePos++ },
+      'TSTypeParameter:exit'(_n: any) { inTsTypePos-- },
+      MemberExpression(node: any) {
+        // `x.addEventListener` — `addEventListener` is the property name, not
+        // a global. Pre-mark so the Identifier visitor skips it.
+        if (!node.computed && node.property?.type === 'Identifier') {
+          skipPropertyNodes.add(node.property)
+        }
+      },
+      Property(node: any) {
+        // `{ document: 1 }` — `document` is a key, not a global ref.
+        if (!node.computed && node.key?.type === 'Identifier') {
+          skipPropertyNodes.add(node.key)
         }
       },
-      Identifier(node: any, parent: any) {
-        if (safeDepth > 0 || typeofGuardDepth > 0) return
+      ImportSpecifier(node: any) {
+        if (node.imported?.type === 'Identifier') skipPropertyNodes.add(node.imported)
+        if (node.local?.type === 'Identifier' && node.local !== node.imported)
+          skipPropertyNodes.add(node.local)
+        // Track imported names that shadow a browser global so all later
+        // uses of that name in the file are skipped — e.g. `import { history }
+        // from '@codemirror/commands'` makes every `history` identifier a
+        // CodeMirror reference, not `window.history`.
+        if (node.local?.type === 'Identifier' && BROWSER_GLOBALS.has(node.local.name)) {
+          importShadowedNames.add(node.local.name)
+        }
+      },
+      ImportDefaultSpecifier(node: any) {
+        if (node.local?.type === 'Identifier') {
+          skipPropertyNodes.add(node.local)
+          if (BROWSER_GLOBALS.has(node.local.name)) importShadowedNames.add(node.local.name)
+        }
+      },
+      ImportNamespaceSpecifier(node: any) {
+        if (node.local?.type === 'Identifier') {
+          skipPropertyNodes.add(node.local)
+          if (BROWSER_GLOBALS.has(node.local.name)) importShadowedNames.add(node.local.name)
+        }
+      },
+      Identifier(node: any) {
+        if (safeDepth > 0 || typeofGuardDepth > 0 || inTypeofExpr > 0 || inTsTypePos > 0) return
+        if (skipPropertyNodes.has(node)) return
         if (!BROWSER_GLOBALS.has(node.name)) return
-
-        // Skip typeof expressions: typeof window
-        if (parent?.type === 'UnaryExpression' && parent.operator === 'typeof') return
-
-        // Skip import specifiers
-        if (
-          parent?.type === 'ImportSpecifier' ||
-          parent?.type === 'ImportDefaultSpecifier' ||
-          parent?.type === 'ImportNamespaceSpecifier'
-        )
-          return
-
-        // Skip property access on member expressions (only flag when used as the object)
-        if (parent?.type === 'MemberExpression' && parent.property === node && !parent.computed)
-          return
+        // Skip identifiers shadowed by a parameter of the same name —
+        // `function push(location)` inside: every `location` refers to the
+        // parameter, not `window.location`.
+        if (isNameShadowed(node.name)) return
+        // Skip identifiers shadowed by a module-level import binding.
+        if (importShadowedNames.has(node.name)) return
 
         context.report({
           message: `Browser global \`${node.name}\` used outside \`onMount\`/\`effect\`/typeof guard — this will fail during SSR. Wrap in \`onMount(() => { ... })\`.`,

package/src/rules/store/no-duplicate-store-id.ts

@@ -1,5 +1,6 @@
 import type { Rule, VisitorCallbacks } from '../../types'
 import { getSpan, isCallTo } from '../../utils/ast'
+import { isTestFile } from '../../utils/file-roles'
 
 export const noDuplicateStoreId: Rule = {
   meta: {
@@ -10,6 +11,16 @@ export const noDuplicateStoreId: Rule = {
     fixable: false,
   },
   create(context) {
+    // Heuristic: skip test files. The rule catches a real bug (two
+    // `defineStore('foo', ...)` calls in production code clobber each
+    // other), but store tests deliberately duplicate IDs to assert
+    // collision-handling behavior. A truly precise check would need to
+    // detect "this duplicate is wrapped in `expect(...).toThrow`" or
+    // similar — impractical at lint level. For prod code that intentionally
+    // (re)defines a store ID, use `// pyreon-lint-disable-next-line` at
+    // the second declaration.
+    if (isTestFile(context.getFilePath())) return {}
+
     const storeIds = new Map<string, { start: number; end: number }>()
 
     const callbacks: VisitorCallbacks = {

package/src/rules/store/no-mutate-store-state.ts

@@ -1,17 +1,27 @@
 import type { Rule, VisitorCallbacks } from '../../types'
 import { getSpan } from '../../utils/ast'
+import { createComponentContextTracker } from '../../utils/component-context'
 
 export const noMutateStoreState: Rule = {
   meta: {
     id: 'pyreon/no-mutate-store-state',
     category: 'store',
-    description: 'Warn when directly calling .set() on store signals — use store actions instead.',
+    description:
+      'Warn when calling .set() on store signals from a component or hook — use store actions instead.',
     severity: 'warn',
     fixable: false,
   },
   create(context) {
+    // The wrong pattern is mutating store state from a component / event
+    // handler / hook. Inside the store's own setup or in tests asserting
+    // reactivity, `.set()` is fine. Component-context detection naturally
+    // skips both cases without a path-based heuristic.
+    const ctx = createComponentContextTracker()
+
     const callbacks: VisitorCallbacks = {
+      ...ctx.callbacks,
       CallExpression(node: any) {
+        if (!ctx.isInComponentOrHook()) return
         const callee = node.callee
         if (!callee || callee.type !== 'MemberExpression') return
         if (callee.property?.type !== 'Identifier' || callee.property.name !== 'set') return

package/src/rules/styling/no-dynamic-styled.ts

@@ -1,55 +1,44 @@
 import type { Rule, VisitorCallbacks } from '../../types'
 import { getSpan, isCallTo } from '../../utils/ast'
+import { createComponentContextTracker } from '../../utils/component-context'
 
 export const noDynamicStyled: Rule = {
   meta: {
     id: 'pyreon/no-dynamic-styled',
     category: 'styling',
     description:
-      'Warn when styled() is called inside a function — it creates new CSS on every render.',
+      'Warn when styled() is called inside a component or hook — it creates new CSS on every render.',
     severity: 'warn',
     fixable: false,
   },
   create(context) {
-    let functionDepth = 0
+    // Only flag when *inside* a component / hook setup body. Module-level
+    // `styled()` is the correct pattern. Inside a utility function, factory,
+    // or test callback `styled()` runs once per call but isn't tied to a
+    // render path — the per-render-allocation warning doesn't apply.
+    const ctx = createComponentContextTracker()
+
     const callbacks: VisitorCallbacks = {
-      FunctionDeclaration() {
-        functionDepth++
-      },
-      'FunctionDeclaration:exit'() {
-        functionDepth--
-      },
-      FunctionExpression() {
-        functionDepth++
-      },
-      'FunctionExpression:exit'() {
-        functionDepth--
-      },
-      ArrowFunctionExpression() {
-        functionDepth++
-      },
-      'ArrowFunctionExpression:exit'() {
-        functionDepth--
-      },
+      ...ctx.callbacks,
       CallExpression(node: any) {
-        if (functionDepth === 0) return
+        if (!ctx.isInComponentOrHook()) return
         if (isCallTo(node, 'styled')) {
           context.report({
             message:
-              '`styled()` inside a function — this creates new CSS rules on every render. Move `styled()` to module scope.',
+              '`styled()` inside a component or hook — this creates new CSS rules on every render. Move `styled()` to module scope.',
             span: getSpan(node),
           })
         }
       },
       TaggedTemplateExpression(node: any) {
-        if (functionDepth === 0) return
+        if (!ctx.isInComponentOrHook()) return
         const tag = node.tag
         if (!tag) return
         // styled('div')`...` — tag is a CallExpression of styled
         if (tag.type === 'CallExpression' && isCallTo(tag, 'styled')) {
           context.report({
             message:
-              '`styled()` tagged template inside a function — this creates new CSS rules on every render. Move to module scope.',
+              '`styled()` tagged template inside a component or hook — this creates new CSS rules on every render. Move to module scope.',
             span: getSpan(node),
           })
         }