@draftbit/core 46.5.2-b58416.2 → 46.6.0

package/lib/typescript/src/mappings/FlashList.d.ts

@@ -1,4 +1,4 @@
-export declare const SEED_DATA: {
+export declare const SEED_DATA: ({
     name: string;
     tag: string;
     description: string;
@@ -8,7 +8,105 @@ export declare const SEED_DATA: {
     layout: {
         flex: number;
     };
+    triggers: string[];
     props: {
+        onRefresh: {
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            group: string;
+        };
+        onEndReached: {
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            group: string;
+        };
+        numColumns: {
+            label: string;
+            description: string;
+            group: string;
+            formType: string;
+            propType: string;
+            defaultValue: number;
+            editable: boolean;
+            required: boolean;
+        };
+        estimatedItemSize: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        optimizeItemArrangement: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        onEndReachedThreshold: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        horizontal?: undefined;
+        inverted?: undefined;
+    };
+} | {
+    name: string;
+    tag: string;
+    description: string;
+    packageName: string;
+    category: string;
+    stylesPanelSections: string[];
+    layout: {
+        flex: number;
+    };
+    triggers: string[];
+    props: {
+        onRefresh: {
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            group: string;
+        };
+        onEndReached: {
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            group: string;
+        };
         estimatedItemSize: {
             label: string;
             description: string;
@@ -50,6 +148,18 @@ export declare const SEED_DATA: {
             editable: boolean;
             required: boolean;
         };
+        onEndReachedThreshold: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        optimizeItemArrangement?: undefined;
     };
-};
+})[];
 //# sourceMappingURL=FlashList.d.ts.map

package/lib/typescript/src/mappings/FlashList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FlashList.d.ts","sourceRoot":"","sources":["../../../../src/mappings/FlashList.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA+BrB,CAAC"}
+{"version":3,"file":"FlashList.d.ts","sourceRoot":"","sources":["../../../../src/mappings/FlashList.ts"],"names":[],"mappings":"AAYA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;IAgFrB,CAAC"}

package/lib/typescript/src/mappings/FlatList.d.ts

@@ -7,7 +7,28 @@ export declare const SEED_DATA: {
     layout: {
         flex: number;
     };
+    triggers: string[];
     props: {
+        onRefresh: {
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            group: string;
+        };
+        onEndReached: {
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            group: string;
+        };
         horizontal: {
             label: string;
             description: string;
@@ -38,6 +59,27 @@ export declare const SEED_DATA: {
             editable: boolean;
             required: boolean;
         };
+        initialNumToRender: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            defaultValue: boolean;
+            editable: boolean;
+            required: boolean;
+            group: string;
+        };
+        onEndReachedThreshold: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
     };
 };
 //# sourceMappingURL=FlatList.d.ts.map

package/lib/typescript/src/mappings/FlatList.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FlatList.d.ts","sourceRoot":"","sources":["../../../../src/mappings/FlatList.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAsBrB,CAAC"}
+{"version":3,"file":"FlatList.d.ts","sourceRoot":"","sources":["../../../../src/mappings/FlatList.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmCrB,CAAC"}

package/lib/typescript/src/mappings/Swiper.d.ts

@@ -7,7 +7,18 @@ export declare const SEED_DATA: {
         height: number;
         width: string;
     };
+    triggers: string[];
     props: {
+        onIndexChanged: {
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            group: string;
+        };
         from: {
             label: string;
             description: string;

package/lib/typescript/src/mappings/Swiper.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Swiper.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Swiper.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA0DrB,CAAC"}
+{"version":3,"file":"Swiper.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Swiper.ts"],"names":[],"mappings":"AAWA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4DrB,CAAC"}

package/lib/typescript/src/mappings/Touchable.d.ts

@@ -1,8 +1,4 @@
 export declare const SEED_DATA: {
-    name: string;
-    tag: string;
-    description: string;
-    category: string;
     stylesPanelSections: string[];
     layout: {};
     triggers: string[];
@@ -17,6 +13,64 @@ export declare const SEED_DATA: {
             defaultValue: null;
             group: string;
         };
+        onLongPress: {
+            label: string;
+            description: string;
+            editable: boolean;
+            required: boolean;
+            formType: string;
+            propType: string;
+            defaultValue: null;
+            group: string;
+        };
+        activeOpacity: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        disabledOpacity: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        delayLongPress: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
+        hitSlop: {
+            label: string;
+            description: string;
+            formType: string;
+            propType: string;
+            group: string;
+            defaultValue: null;
+            editable: boolean;
+            required: boolean;
+            step: number;
+        };
     };
-};
+    name: string;
+    tag: string;
+    description: string;
+    category: string;
+}[];
 //# sourceMappingURL=Touchable.d.ts.map

package/lib/typescript/src/mappings/Touchable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Touchable.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Touchable.ts"],"names":[],"mappings":"AAOA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;CAerB,CAAC"}
+{"version":3,"file":"Touchable.d.ts","sourceRoot":"","sources":["../../../../src/mappings/Touchable.ts"],"names":[],"mappings":"AAsDA,eAAO,MAAM,SAAS;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAerB,CAAC"}

package/lib/typescript/src/styles/overlay.d.ts

@@ -1,3 +1,3 @@
 import { Animated } from "react-native";
-export default function overlay<T extends Animated.Value | number>(elevation: T, surfaceColor?: string): T extends number ? string : Animated.AnimatedInterpolation<string | number>;
+export default function overlay<T extends Animated.Value | number>(elevation: T, surfaceColor?: string): T extends number ? string : Animated.AnimatedInterpolation;
 //# sourceMappingURL=overlay.d.ts.map

package/lib/typescript/src/styles/overlay.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../../../src/styles/overlay.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAOxC,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,CAAC,SAAS,QAAQ,CAAC,KAAK,GAAG,MAAM,EAC/D,SAAS,EAAE,CAAC,EACZ,YAAY,GAAE,MAAiC,GAC9C,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC,qBAAqB,CAAC,MAAM,GAAG,MAAM,CAAC,CAe7E"}
+{"version":3,"file":"overlay.d.ts","sourceRoot":"","sources":["../../../../src/styles/overlay.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAE,QAAQ,EAAE,MAAM,cAAc,CAAC;AAOxC,MAAM,CAAC,OAAO,UAAU,OAAO,CAAC,CAAC,SAAS,QAAQ,CAAC,KAAK,GAAG,MAAM,EAC/D,SAAS,EAAE,CAAC,EACZ,YAAY,GAAE,MAAiC,GAC9C,CAAC,SAAS,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC,qBAAqB,CAe5D"}

package/lib/typescript/src/styles/shadow.d.ts

@@ -3,10 +3,10 @@ export default function shadow(elevation?: number | Animated.Value): {
     shadowColor: string;
     shadowOffset: {
         width: Animated.Value;
-        height: Animated.AnimatedInterpolation<string | number>;
+        height: Animated.AnimatedInterpolation;
     };
     shadowOpacity: Animated.Value;
-    shadowRadius: Animated.AnimatedInterpolation<string | number>;
+    shadowRadius: Animated.AnimatedInterpolation;
 } | {
     shadowColor?: undefined;
     shadowOffset?: undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@draftbit/core",
-  "version": "46.5.2-b58416.2+b584161",
+  "version": "46.6.0",
   "description": "Core (non-native) Components",
   "main": "lib/commonjs/index.js",
   "module": "lib/module/index.js",
@@ -41,12 +41,12 @@
   "dependencies": {
     "@date-io/date-fns": "^1.3.13",
     "@draftbit/react-theme-provider": "^2.1.1",
-    "@draftbit/types": "^46.5.2-b58416.2+b584161",
+    "@draftbit/types": "^46.6.0",
     "@material-ui/core": "^4.11.0",
     "@material-ui/pickers": "^3.2.10",
-    "@react-native-community/slider": "4.2.4",
-    "@react-native-picker/picker": "2.4.8",
-    "@shopify/flash-list": "1.3.1",
+    "@react-native-community/slider": "4.2.3",
+    "@react-native-picker/picker": "2.4.2",
+    "@shopify/flash-list": "1.2.0",
     "color": "^3.1.2",
     "date-fns": "^2.16.1",
     "dateformat": "^3.0.3",
@@ -54,7 +54,7 @@
     "lodash.omit": "^4.5.0",
     "lodash.tonumber": "^4.0.3",
     "react-native-modal-datetime-picker": "^13.0.0",
-    "react-native-svg": "13.4.0",
+    "react-native-svg": "12.3.0",
     "react-native-typography": "^1.4.1",
     "react-native-web-swiper": "^2.2.3"
   },
@@ -91,5 +91,5 @@
       ]
     ]
   },
-  "gitHead": "b584161a8d6042f3d8ab8a4cb3b697889503a5db"
+  "gitHead": "4403cb452dfeff35e782f2eca66e87831b92473f"
 }

package/src/components/Button.js

@@ -7,7 +7,7 @@ const CONSTANTS = {
     padding: 8,
     icon: 24,
 };
-function Base({ Icon, icon, title, onPress, loading, disabled, style, ...props }) {
+function Base({ Icon, icon, title, loading, disabled, style, activeOpacity, disabledOpacity, ...props }) {
     const { color, fontFamily, fontWeight, fontSize, lineHeight, letterSpacing, textTransform, textAlign, textDecorationLine, textDecorationColor, textDecorationStyle, ...buttonStyles } = StyleSheet.flatten(style || {});
     const titleStyles = {
         color,
@@ -28,11 +28,11 @@ function Base({ Icon, icon, title, onPress, loading, disabled, style, ...props }
     if (textAlign === "right") {
         buttonStyles.justifyContent = "flex-end";
     }
-    return (React.createElement(Pressable, { onPress: onPress, disabled: disabled || loading, style: ({ pressed }) => {
+    return (React.createElement(Pressable, { disabled: disabled || loading, style: ({ pressed }) => {
             return [
                 styles.base,
                 {
-                    opacity: pressed || disabled ? 0.75 : 1,
+                    opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
                 },
                 buttonStyles,
             ];

package/src/components/Button.tsx

@@ -2,10 +2,10 @@ import * as React from "react";
 import {
   Text,
   Pressable,
+  PressableProps,
   Platform,
   StyleSheet,
   TextStyle,
-  PressableProps,
   ActivityIndicator,
 } from "react-native";
 
@@ -27,6 +27,11 @@ type BaseProps = {
   loading: boolean;
   style?: TextStyle;
   onPress: () => void;
+  onLongPress?: () => void;
+  activeOpacity?: number;
+  disabledOpacity?: number;
+  delayLongPress?: number;
+  hitSlop?: number;
   icon?: string;
 } & PressableProps &
   IconSlot;
@@ -37,6 +42,11 @@ type Props = {
   loading: boolean;
   style?: TextStyle;
   onPress: () => void;
+  onLongPress?: () => void;
+  activeOpacity?: number;
+  disabledOpacity?: number;
+  delayLongPress?: number;
+  hitSlop?: number;
   icon?: string;
   theme: Theme;
 } & PressableProps &
@@ -46,10 +56,11 @@ function Base({
   Icon,
   icon,
   title,
-  onPress,
   loading,
   disabled,
   style,
+  activeOpacity,
+  disabledOpacity,
   ...props
 }: BaseProps): JSX.Element {
   const {
@@ -91,13 +102,12 @@ function Base({
 
   return (
     <Pressable
-      onPress={onPress}
       disabled={disabled || loading}
       style={({ pressed }) => {
         return [
           styles.base,
           {
-            opacity: pressed || disabled ? 0.75 : 1,
+            opacity: pressed ? activeOpacity : disabled ? disabledOpacity : 1,
           },
           buttonStyles,
         ];

package/src/components/Checkbox/Checkbox.js

@@ -1,7 +1,6 @@
 import * as React from "react";
-import { View, StyleSheet, } from "react-native";
+import { View, StyleSheet, Pressable, } from "react-native";
 import { useTheme } from "../../theming";
-import Touchable from "../Touchable";
 import { usePrevious } from "../../hooks";
 const Checkbox = ({ Icon, status, disabled = false, onPress, onCheck, onUncheck, color, uncheckedColor, defaultValue, checkedIcon = "MaterialCommunityIcons/checkbox-marked", uncheckedIcon = "MaterialCommunityIcons/checkbox-blank-outline", size = 24, style, ...rest }) => {
     const [internalValue, setInternalValue] = React.useState(status || defaultValue || false);
@@ -33,7 +32,7 @@ const Checkbox = ({ Icon, status, disabled = false, onPress, onCheck, onUncheck,
             onUncheck === null || onUncheck === void 0 ? void 0 : onUncheck();
         }
     };
-    return (React.createElement(Touchable, { ...rest, onPress: handlePress, disabled: disabled, accessibilityState: { disabled }, accessibilityRole: "button", accessibilityLiveRegion: "polite", style: [styles.container, style, { width: size, height: size }] },
+    return (React.createElement(Pressable, { ...rest, onPress: handlePress, disabled: disabled, accessibilityState: { disabled }, accessibilityRole: "button", accessibilityLiveRegion: "polite", style: [styles.container, style, { width: size, height: size }] },
         React.createElement(Icon, { style: styles.icon, name: internalValue ? checkedIcon : uncheckedIcon, size: size, color: checkboxColor }),
         React.createElement(View, { style: [StyleSheet.absoluteFill, styles.fillContainer] },
             React.createElement(View, { style: [

package/src/components/Checkbox/Checkbox.tsx

@@ -2,14 +2,14 @@ import * as React from "react";
 import {
   View,
   StyleSheet,
-  TouchableHighlightProps,
+  Pressable,
+  PressableProps,
   StyleProp,
   ViewStyle,
 } from "react-native";
 import { useTheme } from "../../theming";
 import type { IconSlot } from "../../interfaces/Icon";
 
-import Touchable from "../Touchable";
 import { usePrevious } from "../../hooks";
 
 export interface CheckboxProps {
@@ -27,9 +27,7 @@ export interface CheckboxProps {
   style?: StyleProp<ViewStyle>;
 }
 
-const Checkbox: React.FC<
-  CheckboxProps & TouchableHighlightProps & IconSlot
-> = ({
+const Checkbox: React.FC<CheckboxProps & PressableProps & IconSlot> = ({
   Icon,
   status,
   disabled = false,
@@ -87,7 +85,7 @@ const Checkbox: React.FC<
   };
 
   return (
-    <Touchable
+    <Pressable
       {...rest}
       onPress={handlePress}
       disabled={disabled}
@@ -111,7 +109,7 @@ const Checkbox: React.FC<
           ]}
         />
       </View>
-    </Touchable>
+    </Pressable>
   );
 };
 

package/src/components/Checkbox/CheckboxGroupRow.js

@@ -1,10 +1,9 @@
 import * as React from "react";
-import { StyleSheet, View, Platform, } from "react-native";
+import { StyleSheet, View, Platform, Pressable, } from "react-native";
 import Checkbox from "./Checkbox";
 import Text from "../Text";
 import { useCheckboxGroupContext } from "./context";
 import { Direction as GroupDirection } from "./context";
-import Touchable from "../Touchable";
 import { extractStyles } from "../../utilities";
 export var Direction;
 (function (Direction) {
@@ -41,7 +40,7 @@ const CheckboxGroupRow = ({ Icon, label = "Label", status, value, onPress, label
         }
     };
     const { textStyles, viewStyles } = extractStyles(style);
-    return (React.createElement(Touchable, { onPress: handlePress, style: [styles.mainParent, { flexDirection: direction }, viewStyles], disabled: disabled, ...rest },
+    return (React.createElement(Pressable, { onPress: handlePress, style: [styles.mainParent, { flexDirection: direction }, viewStyles], disabled: disabled, ...rest },
         React.createElement(View, { style: [
                 styles.label,
                 {

package/src/components/Checkbox/CheckboxGroupRow.tsx

@@ -6,13 +6,13 @@ import {
   TextStyle,
   View,
   Platform,
+  Pressable,
 } from "react-native";
 import Checkbox, { CheckboxProps } from "./Checkbox";
 import Text from "../Text";
 import { useCheckboxGroupContext } from "./context";
 import type { IconSlot } from "../../interfaces/Icon";
 import { Direction as GroupDirection } from "./context";
-import Touchable from "../Touchable";
 import { extractStyles } from "../../utilities";
 
 export enum Direction {
@@ -92,7 +92,7 @@ const CheckboxGroupRow: React.FC<CheckboxGroupRowProps & IconSlot> = ({
   const { textStyles, viewStyles } = extractStyles(style);
 
   return (
-    <Touchable
+    <Pressable
       onPress={handlePress}
       style={[styles.mainParent, { flexDirection: direction }, viewStyles]}
       disabled={disabled}
@@ -125,7 +125,7 @@ const CheckboxGroupRow: React.FC<CheckboxGroupRowProps & IconSlot> = ({
           uncheckedColor={uncheckedColor}
         />
       </View>
-    </Touchable>
+    </Pressable>
   );
 };
 

package/src/components/Checkbox/CheckboxRow.js

@@ -1,10 +1,9 @@
 import * as React from "react";
-import { StyleSheet, View, Platform, } from "react-native";
+import { StyleSheet, View, Platform, Pressable, } from "react-native";
 import { isString } from "lodash";
 import { extractStyles } from "../../utilities";
 import { usePrevious } from "../../hooks";
 import Text from "../Text";
-import Touchable from "../Touchable";
 import Checkbox from "./Checkbox";
 export var Direction;
 (function (Direction) {
@@ -46,7 +45,7 @@ const CheckboxRow = ({ label = "Label", labelStyle, labelContainerStyle, checkbo
         }
     };
     const { textStyles, viewStyles } = extractStyles(style);
-    return (React.createElement(Touchable, { onPress: handlePress, style: [viewStyles, styles.mainParent, { flexDirection: direction }], disabled: disabled, ...rest },
+    return (React.createElement(Pressable, { onPress: handlePress, style: [viewStyles, styles.mainParent, { flexDirection: direction }], disabled: disabled, ...rest },
         React.createElement(View, { style: [
                 styles.label,
                 {

package/src/components/Checkbox/CheckboxRow.tsx

@@ -6,6 +6,7 @@ import {
   TextStyle,
   View,
   Platform,
+  Pressable,
 } from "react-native";
 import { isString } from "lodash";
 
@@ -13,7 +14,6 @@ import type { IconSlot } from "../../interfaces/Icon";
 import { extractStyles } from "../../utilities";
 import { usePrevious } from "../../hooks";
 import Text from "../Text";
-import Touchable from "../Touchable";
 import Checkbox, { CheckboxProps } from "./Checkbox";
 
 export enum Direction {
@@ -100,7 +100,7 @@ const CheckboxRow: React.FC<CheckboxRowProps & IconSlot> = ({
   const { textStyles, viewStyles } = extractStyles(style);
 
   return (
-    <Touchable
+    <Pressable
       onPress={handlePress}
       style={[viewStyles, styles.mainParent, { flexDirection: direction }]}
       disabled={disabled}
@@ -130,7 +130,7 @@ const CheckboxRow: React.FC<CheckboxRowProps & IconSlot> = ({
         uncheckedIcon={uncheckedIcon}
         size={size}
       />
-    </Touchable>
+    </Pressable>
   );
 };
 

package/src/components/DeprecatedButton.js

@@ -1,11 +1,10 @@
 import * as React from "react";
-import { ActivityIndicator, View, Text, StyleSheet, } from "react-native";
+import { ActivityIndicator, View, Text, StyleSheet, Pressable, } from "react-native";
 import color from "color";
 import Config from "./Config";
-import Touchable from "./Touchable";
 import Elevation from "./Elevation";
 import { withTheme } from "../theming";
-const Button = ({ Icon, icon, disabled = false, type = "solid", loading = false, labelColor, color: colorOverride, children, onPress, elevation = 0, style, theme: { colors, disabledOpacity, roundness, typography }, ...rest }) => {
+const Button = ({ Icon, icon, disabled = false, type = "solid", loading = false, labelColor, color: colorOverride, children, onPress, elevation = 0, theme: { colors, disabledOpacity, roundness, typography }, ...rest }) => {
     let backgroundColor, borderColor, textColor, borderWidth;
     const buttonColor = colorOverride || colors.primary;
     if (type === "solid") {
@@ -59,19 +58,8 @@ const Button = ({ Icon, icon, disabled = false, type = "solid", loading = false,
             width: Config.buttonIconSize,
         },
     ];
-    const { margin, marginEnd, marginTop, marginLeft, marginRight, marginBottom, marginHorizontal, marginVertical, ...innerStyles } = StyleSheet.flatten(style || {});
-    const margins = {
-        margin,
-        marginEnd,
-        marginTop,
-        marginLeft,
-        marginRight,
-        marginBottom,
-        marginHorizontal,
-        marginVertical,
-    };
-    return (React.createElement(Elevation, { style: { elevation, alignSelf: "stretch", ...margins } },
-        React.createElement(Touchable, { ...rest, onPress: onPress, accessibilityState: { disabled }, accessibilityRole: "button", disabled: disabled || loading, style: [styles.button, buttonStyle, innerStyles] },
+    return (React.createElement(Elevation, { style: { elevation, alignSelf: "stretch" } },
+        React.createElement(Pressable, { ...rest, onPress: onPress, accessibilityState: { disabled }, accessibilityRole: "button", disabled: disabled || loading, style: [styles.button, buttonStyle] },
             React.createElement(View, { style: styles.content },
                 icon && loading !== true ? (React.createElement(View, { style: iconStyle },
                     React.createElement(Icon, { name: icon, size: Config.buttonIconSize, color: textColor }))) : null,