Being able to export and control variants in other files

[NateAGeek]

Hello, wonderful library. My main concerned is that I do not have the ability to split my variants into different file and remain typing.

Is there a way createVariant to define a variant styling and typing that can be used per component?

For example, I would like to do something like the following

import { backgroundColor, BackgroundColorProps, border, BorderProps, spacing, SpacingProps, useRestyle, VariantProps } from '@shopify/restyle';
import React from 'react';
import { Pressable } from 'react-native';
import { Theme } from '../../../../contexts/Theme';
import Text from '../../../Base/Text';

const menuVariants: Variants = {
  bold: {
    fontSize: 32,
    fontWeight: 'bold'
  },
  normal: {
    fontSize: 16
  }
};

export type MenuItemProps = {
  title: string;
} &
VariantProps<Theme, menuVariants> &
SpacingProps<Theme> &
BorderProps<Theme> &
BackgroundColorProps<Theme>;

const restyleFunctions = [
  spacing,
  border,
  backgroundColor
];
export default function ({title, ...restyleProps}: MenuItemProps) {
  const props = useRestyle(restyleFunctions, restyleProps);

  return (
    <Pressable {...props} onPress={() => {
      console.log("Hello World");
    }}>
      <Text>{title}</Text>
    </Pressable>
  );
};

[Joel Besada]

Thanks for your suggestion, I think this is worth exploring