How to use the styletron-react.withStyleDeep function in styletron-react

To help you get started, we’ve selected a few styletron-react examples, based on popular ways it is used in public projects.

Secure your code as it's written. Use Snyk Code to scan source code in minutes - no build needed - and fix issues immediately.

github DefinitelyTyped / DefinitelyTyped / types / styletron-react / styletron-react-tests.tsx View on Github external
;

// withStyleDeep()
// --------------------------

// Static Styles
const WithStyledDeepSimple = withStyleDeep(BasicStyled, { color: 'blue' });

;

// Dynamic Styles
interface WithStyledDeepDynamicProps {
    $crushed: boolean;
}

const WithStyledDeepDynamic = withStyleDeep(BasicStyled, (props: WithStyledDeepDynamicProps) => ({
    letterSpacing: props.$crushed ? '-5px' : '0',
}));

;

// withTransform()
// --------------------------

interface WithTransformTestProps {
    $inline: boolean;
}

const WithTransformTest = withTransform(BasicStyled, (style, props: WithTransformTestProps) => {
    const display = style.display === 'none' ? 'none' : props.$inline ? 'inline-flex' : 'flex';
    return { ...styled, display };
});
github DefinitelyTyped / DefinitelyTyped / types / styletron-react / styletron-react-tests.tsx View on Github external
// Dynamic Styles
interface WithStyledDynamicProps {
    $crushed: boolean;
}

const WithStyledDynamic = withStyle(BasicStyled, (props: WithStyledDynamicProps) => ({
    letterSpacing: props.$crushed ? '-5px' : '0',
}));

;

// withStyleDeep()
// --------------------------

// Static Styles
const WithStyledDeepSimple = withStyleDeep(BasicStyled, { color: 'blue' });

;

// Dynamic Styles
interface WithStyledDeepDynamicProps {
    $crushed: boolean;
}

const WithStyledDeepDynamic = withStyleDeep(BasicStyled, (props: WithStyledDeepDynamicProps) => ({
    letterSpacing: props.$crushed ? '-5px' : '0',
}));

;

// withTransform()
// --------------------------

styletron-react

React bindings for Styletron

MIT
Latest version published 10 months ago

Package Health Score

72 / 100
Full package analysis

Similar packages