Deprecate 'variant' in favor of 'color'

src/components/Button.tsx

@@ -31,6 +31,7 @@ export type ButtonShape = 'round' | 'square' | 'default'
 export type VariantProps = {
   /**
    * The style variation of the button
+   * @deprecated Use `color` instead.
    */
   variant?: ButtonVariant
   /**
@@ -123,6 +124,15 @@ export const Button = React.forwardRef<View, ButtonProps>(
     },
     ref,
   ) => {
+    /**
+     * The `variant` prop is deprecated in favor of simply specifying `color`.
+     * If a `color` is set, then we want to use the existing codepaths for
+     * "solid" buttons. This is to maintain backwards compatibility.
+     */
+    if (!variant && color) {
+      variant = 'solid'
+    }
+
     const t = useTheme()
     const [state, setState] = React.useState({
       pressed: false,

src/view/screens/Storybook/index.tsx

@@ -52,7 +52,6 @@ function StorybookInner() {
           <>
             <View style={[a.flex_row, a.align_start, a.gap_md]}>
               <Button
-                variant="outline"
                 color="primary"
                 size="small"
                 label='Set theme to "system"'
@@ -60,7 +59,6 @@ function StorybookInner() {
                 <ButtonText>System</ButtonText>
               </Button>
               <Button
-                variant="solid"
                 color="secondary"
                 size="small"
                 label='Set theme to "light"'
@@ -68,7 +66,6 @@ function StorybookInner() {
                 <ButtonText>Light</ButtonText>
               </Button>
               <Button
-                variant="solid"
                 color="secondary"
                 size="small"
                 label='Set theme to "dim"'
@@ -79,7 +76,6 @@ function StorybookInner() {
                 <ButtonText>Dim</ButtonText>
               </Button>
               <Button
-                variant="solid"
                 color="secondary"
                 size="small"
                 label='Set theme to "dark"'
@@ -94,7 +90,6 @@ function StorybookInner() {
             <Buttons />
 
             <Button
-              variant="solid"
               color="primary"
               size="small"
               onPress={() => navigation.navigate('SharedPreferencesTester')}
@@ -129,7 +124,6 @@ function StorybookInner() {
             <Settings />
 
             <Button
-              variant="solid"
               color="primary"
               size="large"
               label="Switch to Contained List"
@@ -140,7 +134,6 @@ function StorybookInner() {
         ) : (
           <>
             <Button
-              variant="solid"
               color="primary"
               size="large"
               label="Switch to Storybook"