2
2
* @file This component was inspired by Radix's Spinner component. The animation
3
3
* settings were developed using Vercel's v0.
4
4
*
5
- * @see {@link https://www.radix-ui.com/themes/docs/components/spinner }
6
- * @see {@link https://v0.dev/ }
5
+ * {@link https://www.radix-ui.com/themes/docs/components/spinner}
6
+ * {@link https://v0.dev/}
7
7
*/
8
8
9
9
import isChromatic from "chromatic/isChromatic" ;
@@ -50,7 +50,9 @@ type SpinnerProps = Readonly<
50
50
* If you do need reset all the state after a loading transition
51
51
* and you can't unmount the component without creating invalid
52
52
* HTML, use a render key to reset the state.
53
- * @see {@link https://react.dev/learn/you-might-not-need-an-effect#resetting-all-state-when-a-prop-changes }
53
+ *
54
+ * ---
55
+ * {@link https://react.dev/learn/you-might-not-need-an-effect#resetting-all-state-when-a-prop-changes}
54
56
*/
55
57
unmountChildrenWhileLoading ?: boolean ;
56
58
@@ -89,9 +91,9 @@ const animationSettings: CSSProperties = isChromatic()
89
91
90
92
export const Spinner : FC < SpinnerProps > = ( {
91
93
className,
92
- size,
93
94
loading,
94
95
children,
96
+ size = "lg" ,
95
97
spinnerDelayMs = 0 ,
96
98
unmountChildrenWhileLoading = false ,
97
99
...delegatedProps
@@ -109,7 +111,7 @@ export const Spinner: FC<SpinnerProps> = ({
109
111
* Doing a bunch of mid-render state syncs to minimize risks of UI tearing
110
112
* during re-renders. It's ugly, but it's what the React team officially
111
113
* recommends.
112
- * @see {@link https://react.dev/learn/you-might-not-need-an-effect#adjusting-some-state-when-a-prop-changes }
114
+ * {@link https://react.dev/learn/you-might-not-need-an-effect#adjusting-some-state-when-a-prop-changes}
113
115
*/
114
116
const [ delayLapsed , setDelayLapsed ] = useState ( safeDelay === 0 ) ;
115
117
const canResetLapseOnRerender = delayLapsed && ! loading ;
0 commit comments