Spinner.tsxā¢849 B
import React from 'react';
const Spinner: React.FC<{ size?: number }> = ({ size = 24 }) => {
const styles: { [key: string]: React.CSSProperties } = {
spinner: {
border: `4px solid var(--background-tertiary)`,
borderTop: `4px solid var(--accent-primary)`,
borderRadius: '50%',
width: `${size}px`,
height: `${size}px`,
animation: 'spin 1s linear infinite',
},
container: {
display: 'flex',
justifyContent: 'center',
alignItems: 'center',
padding: '10px',
},
};
return (
<>
<style>{`
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
`}</style>
<div style={styles.container}>
<div style={styles.spinner}></div>
</div>
</>
);
};
export default Spinner;