reactHOCExample.tsx

type Omit<T, K> = Pick<T, Exclude<keyof T, K>>;

type Theme = {
  fontColor: string;
};

type WithThemeProps = {
  theme: Theme;
};
  
const theme = {
  fontColor: 'red',
};

// HOC
const withTheme = <P extends object>(
  Component: React.ComponentType<P>,
): React.FC<Omit<P, keyof WithThemeProps>> => props =>
  <Component {...props as P} theme={theme} />;

// Component
type ListProps = {
  items: string[];
  theme: Theme;
};

const List = ({ items, theme }: ListProps) => (
  <ul style={{ color: theme.fontColor }}>
    {items.map((item, index) => (
      <li key={index}>{item}</li>
    ))}
  </ul>
);

// Wrapping Component in HOC
const ListWithTheme = withTheme(List);

const App = () => <ListWithTheme items={['one', 'two', 'three']} />;