@patreon/studio
Version:
Patreon Studio Design System
20 lines • 1.08 kB
JSX
'use client';
import cx from 'classnames';
import React from 'react';
import { TokenModeProvider, useTokenModes } from '~/components/TokenModeProvider';
import { tokenColorModeClassName, tokenScreenModeClassName } from '~/styles/token-modes';
function TokenModeContainerInternal({ children }) {
const { currentColorMode, currentScreenMode } = useTokenModes();
return (<div data-token-color-mode={currentColorMode} className={cx(tokenColorModeClassName(currentColorMode), tokenScreenModeClassName(currentScreenMode))}>
{children}
</div>);
}
export function TokenModeContainer({ colorMode, screenMode, children }) {
const { rootColorMode, rootScreenMode } = useTokenModes();
const newColorMode = colorMode === 'root' ? rootColorMode : colorMode;
const newScreenMode = screenMode === 'root' ? rootScreenMode : screenMode;
return (<TokenModeProvider currentColorMode={newColorMode} currentScreenMode={newScreenMode}>
<TokenModeContainerInternal>{children}</TokenModeContainerInternal>
</TokenModeProvider>);
}
//# sourceMappingURL=index.jsx.map