@@ -30,13 +30,13 @@ declare_lint_rule! {
3030 ///
3131 /// React components have access to various [hooks](https://react.dev/reference/react/hooks) that can perform
3232 /// various actions like querying and updating state.
33- ///
33+ ///
3434 /// For hooks that trigger whenever a variable changes (such as `useEffect` and `useMemo`),
3535 /// React relies on the hook's listed dependencies array to determine when to re-compute Effects and re-render the page.
36- ///
36+ ///
3737 /// This can lead to unexpected behavior when dependencies are incorrectly specified:
3838 /// ```jsx,ignore
39- ///
39+ ///
4040 /// function ticker() {
4141 /// const [count, setCount] = useState(0);
4242 ///
@@ -48,12 +48,12 @@ declare_lint_rule! {
4848 /// // React _thinks_ this code doesn't depend on anything else, so
4949 /// // it will only use the _initial_ version of `onTick` when rendering the component.
5050 /// // As a result, our normally-dynamic counter will always display 1!
51- /// // This is referred to as a "stale closure", and is a common pitfall for beginners.
51+ /// // This is referred to as a "stale closure", and is a common pitfall for beginners.
5252 /// useEffect(() => {
5353 /// const id = setInterval(onTick, 1000);
5454 /// return () => clearInterval(id);
5555 /// }, []);
56- ///
56+ ///
5757 /// return <h1>Counter: {count}</h1>;
5858 /// }
5959 /// ```
@@ -69,12 +69,12 @@ declare_lint_rule! {
6969 /// useEffect(() => {
7070 /// setMessage(`We have ${count} apples!`)
7171 /// }, [count, message]);
72- ///
72+ ///
7373 /// }
7474 /// ```
7575 ///
7676 /// This rule attempts to prevent such issues by diagnosing potentially incorrect or invalid usages of hook dependencies.
77- ///
77+ ///
7878 /// ### Default Behavior
7979 /// By default, the following hooks (and their Preact counterparts) will have their arguments checked by this rule:
8080 ///
@@ -86,7 +86,7 @@ declare_lint_rule! {
8686 /// - `useImperativeHandle`
8787 ///
8888 /// #### Stable results
89- /// When a hook is known to have a stable return value (one whose identity doesn't change across invocations),
89+ /// When a hook is known to have a stable return value (one whose identity doesn't change across invocations),
9090 /// that value doesn't need to and _should not_ be specified as a dependency.
9191 /// For example, setters returned by React's `useState` hook will not change throughout the lifetime of a program
9292 /// and should therefore be omitted.
@@ -97,10 +97,10 @@ declare_lint_rule! {
9797 /// - `useReducer` (index 1)
9898 /// - `useTransition`
9999 /// - `useEffectEvent`
100- ///
100+ ///
101101 /// If you want to add custom hooks to the rule's diagnostics or specify your own functions with stable results,
102102 /// see the [options](#options) section for more information.
103- ///
103+ ///
104104 /// ## Examples
105105 ///
106106 /// ### Invalid
@@ -115,7 +115,7 @@ declare_lint_rule! {
115115 /// }, []);
116116 /// }
117117 /// ```
118- ///
118+ ///
119119 /// ```js,expect_diagnostic
120120 /// import { useEffect } from "react";
121121 ///
@@ -147,7 +147,7 @@ declare_lint_rule! {
147147 /// }, [name, setName]);
148148 /// }
149149 /// ```
150- ///
150+ ///
151151 /// ```js,expect_diagnostic
152152 /// import { useEffect, useState } from "react";
153153 ///
@@ -184,7 +184,7 @@ declare_lint_rule! {
184184 /// }, [a]);
185185 /// }
186186 /// ```
187- ///
187+ ///
188188 /// ```js
189189 /// import { useEffect } from "react";
190190 ///
@@ -245,11 +245,11 @@ declare_lint_rule! {
245245 /// ```
246246 ///
247247 /// :::caution
248- /// Mismatching code & dependencies has a **very high risk** of creating bugs in your components.
248+ /// Mismatching code & dependencies has a **very high risk** of creating bugs in your components.
249249 /// By suppressing the linter, you “lie” to React about the values your Effect depends on,
250- /// so prefer changing the code over suppressing the rule where possible.
250+ /// so prefer changing the code over suppressing the rule where possible.
251251 /// :::
252- ///
252+ ///
253253 /// ## Options
254254 ///
255255 /// ### `hooks`
@@ -274,7 +274,7 @@ declare_lint_rule! {
274274 ///
275275 /// This would enable diagnostics on the following code snippet:
276276 ///
277- /// ```js,options ,expect_diagnostic
277+ /// ```js,use_options ,expect_diagnostic
278278 /// function Foo() {
279279 /// let stateVar = 1;
280280 /// const location = useLocation(() => {console.log(stateVar)}, []);
@@ -285,8 +285,8 @@ declare_lint_rule! {
285285 /// #### Configuring stable results
286286 ///
287287 /// As previously discussed, the lint rule takes into account so-called ["stable results"](#stable-results)
288- /// and will ensure any such variables are _not_ specified as dependencies.
289- ///
288+ /// and will ensure any such variables are _not_ specified as dependencies.
289+ ///
290290 /// You can specify custom hooks that return stable results in one of four ways:
291291 ///
292292 /// 1. `"stableResult": true` -- marks the return value as stable. An example
@@ -317,14 +317,14 @@ declare_lint_rule! {
317317 /// // No need to list `dispatch` as dependency since it doesn't change
318318 /// const doAction = useCallback(() => dispatch(someAction()), []);
319319 /// ```
320- ///
320+ ///
321321 /// ### `reportUnnecessaryDependencies`
322- ///
322+ ///
323323 /// If disabled, the rule will not trigger diagnostics for unused dependencies passed to hooks that do not use them. \
324324 /// Note that this can reduce performance and potentially cause infinite loops, so caution is advised.
325- ///
325+ ///
326326 /// Default: `true`
327- ///
327+ ///
328328 /// ##### Example
329329 ///
330330 /// ```json,options
@@ -342,14 +342,14 @@ declare_lint_rule! {
342342 /// useEffect(() => {}, [stateVar]);
343343 /// }
344344 /// ```
345- ///
345+ ///
346346 /// ### `reportMissingDependenciesArray`
347- ///
347+ ///
348348 /// If enabled, the rule will also trigger diagnostics for hooks that lack dependency arrays altogether,
349349 /// requiring any hooks lacking dependencies to explicitly specify an empty array.
350- ///
350+ ///
351351 /// Default: `false`
352- ///
352+ ///
353353 /// ##### Example
354354 ///
355355 /// ```json,options
@@ -366,7 +366,7 @@ declare_lint_rule! {
366366 /// useEffect(() => {});
367367 /// }
368368 /// ```
369- ///
369+ ///
370370 pub UseExhaustiveDependencies {
371371 version: "1.0.0" ,
372372 name: "useExhaustiveDependencies" ,
@@ -1045,7 +1045,7 @@ impl Rule for UseExhaustiveDependencies {
10451045 "This hook specifies " <Emphasis >"more dependencies than necessary" </Emphasis >": " { deps_joined_with_comma} "."
10461046 } ,
10471047 )
1048- . note ( markup ! {
1048+ . note ( markup ! {
10491049 "\n React relies on hook dependencies to determine when to re-compute Effects."
10501050 "\n Specifying more dependencies than required can lead to " <Emphasis >"unnecessary re-rendering" </Emphasis >
10511051 " and " <Emphasis >"degraded performance" </Emphasis >"."
0 commit comments