'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