How to use the @callstack/react-theme-provider.createTheming function in @callstack/react-theme-provider

/* @flow */
/* eslint-disable no-redeclare */

import {
  createTheming,
  type ThemingType,
} from '@callstack/react-theme-provider';
import DefaultTheme from '../styles/DefaultTheme';
import type { Theme, ThemeShape } from '../types';

export const {
  ThemeProvider,
  withTheme,
}: ThemingType = createTheming(DefaultTheme);

},
  },
  dark: {
    themeName: 'dark',
    colors: {
      primary: lighten(0.05, colors.blue),
      text: colors.white,
      bodyBg: colors.black,
      headerBg: colors.black,
      link: lighten(0.15, colors.blue),
      ...colors,
    },
  },
}

const { ThemeProvider, withTheme, useTheme } = createTheming(themes.default)

export { ThemeProvider, withTheme, useTheme, themes, colors }

secondaryBackgroundColor: '#0c0c0c',
  primaryTextColor: '#FFF',
  secondaryTextColor: '#757575',
  accentColor: '#F8F32B',
};

export const lightTheme = {
  name: 'light',
  backgroundColor: '#FFF',
  secondaryBackgroundColor: '#f5f9ff',
  primaryTextColor: '#131313',
  secondaryTextColor: '#333',
  accentColor: '#3903fc',
};

const { ThemeProvider, withTheme } = createTheming(lightTheme);

export { ThemeProvider, withTheme };

primaryColor: '#FFA72A',
    accentColor: '#458622',
    backgroundColor: '#FFC777',
    textColor: '#504f4d',
    secondaryColor: '#7F5315',
  },
  dark: {
    primaryColor: '#FFA72A',
    accentColor: '#458622',
    backgroundColor: '#504f4d',
    textColor: '#FFC777',
    secondaryColor: '#252525',
  },
};

const { ThemeProvider, withTheme }: ThemingType = createTheming(
  themes.default
);

export { ThemeProvider, withTheme };

primaryColor: '#FFA72A',
    accentColor: '#458622',
    backgroundColor: '#FFC777',
    textColor: '#504f4d',
    secondaryColor: '#7F5315',
  },
  dark: {
    primaryColor: '#FFA72A',
    accentColor: '#458622',
    backgroundColor: '#504f4d',
    textColor: '#FFC777',
    secondaryColor: '#252525',
  },
};

export const { ThemeProvider, withTheme } = createTheming(themes.default);

import { createTheming } from '@callstack/react-theme-provider';
import DefaultTheme from '../styles/DefaultTheme';
import { Theme } from '../types';

export const { ThemeProvider, withTheme, useTheme } = createTheming(
  DefaultTheme
);

filterPlaceholderTextColor: '#aaa',
  activeOpacity: 0.5,
  itemHeight: getHeightPercent(7),
  flagSize: Platform.select({ android: 20, default: 30 }),
  flagSizeButton: Platform.select({ android: 20, default: 30 })
}
export const DARK_THEME = {
  ...DEFAULT_THEME,
  primaryColor: '#222',
  primaryColorVariant: '#444',
  backgroundColor: '#000',
  onBackgroundTextColor: '#fff'
}
export type Theme = Partial

const { ThemeProvider, useTheme } = createTheming(DEFAULT_THEME)

export { ThemeProvider, useTheme }

import * as React from 'react';
import ApolloClient from 'apollo-client';
import { ApolloProvider } from 'react-apollo';
import { createTheming } from '@callstack/react-theme-provider';
import theme from '../../style/theme';
import createGlobalStyle from '../../style/createGlobalStyle';

createGlobalStyle();

const { ThemeProvider } = createTheming(theme);

const Provider = ({
  client,
  children
}: {
  client: ApolloClient;
  children: React.ReactNode;
}) => {
  return (
    
      
        {children}
      
    
  );
};