How to use the @twilio-paste/theme.useTheme function in @twilio-paste/theme

To help you get started, we’ve selected a few @twilio-paste/theme 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 twilio-labs / paste / packages / paste-website / src / components / ThemeObjectDisplay.tsx View on Github external
export const ThemeObjectDisplay: React.FC<{}> = () => {
  const theme = useTheme();
  const themeKeys = Object.keys(theme);
  const reducedTheme = {};
  themeKeys.forEach(key => {
    reducedTheme[key] = {};
  });
  return (
    
      {prettyFormat(reducedTheme)}
    
  );
};
github twilio-labs / paste / packages / paste-website / src / components / site-wrapper / SiteHeader.tsx View on Github external
export const SiteHeader: React.FC<{}> = () => {
  const theme = useTheme();
  return (
github twilio-labs / paste / packages / paste-website / src / components / tokens-example / index.tsx View on Github external
export const TextColorBox: React.FC = ({color, textColor}) => {
  const theme = useTheme();
  const colorFn = Color(color);
  const isInverse = colorFn.isLight();
  const backgroundColorValue = isInverse
    ? theme.backgroundColors.colorBackgroundInverse
    : theme.backgroundColors.colorBackgroundBody;
  const colorCombos = ColorCombos([color, backgroundColorValue]);
  const {accessibility} = colorCombos[1].combinations[0];

  const getContrastRating = (acc: ColorCombinationAccessibility): string => {
    const rating = colorRating(acc);
    return rating.small;
  };

  return (

@twilio-paste/theme

Paste Design System Theme Package which provides support for APIs to theme UIs and components.

MIT
Latest version published 6 days ago

Package Health Score

66 / 100
Full package analysis

Similar packages