website/sdds-scan-docs/docs/_theme-switch/theme-switch-css-module.mdx - dev - sdds/plasma

website/sdds-scan-docs/docs/_theme-switch/theme-switch-css-module.mdx

33 строки779 B

Alexander Lobyntsev

chore(sdds-scan-docs): init package

28 май 2025, 12:34

28 май 2025, 12:3447f57c7

import TipCssModules from '../_utils/_tip-css-modules.mdx';

<TipCssModules />

```jsx
import React, { useLayoutEffect, useState } from 'react';

import { Switch } from '@salutejs/sdds-scan';
import webThemes from '@salutejs/sdds-themes/css/sdds_scan.module.css';

import './style.css';

const App = () => {
    const [theme, setTheme] = useState('light');

    useLayoutEffect(() => {
        document.documentElement.className = webThemes[theme];
    }, [theme]);

    return (
        <div className="wrapper">
            <Switch
                label={`app theme: ${theme}`}
                onChange={() => {
                    setTheme((theme) => (theme === 'light' ? 'dark' : 'light'));
                }}
            />
        </div>
    );
};

export default App;
```