@draftbit/core 48.5.6 → 48.5.7-cd0364.2

package/src/components/Stepper.js

@@ -0,0 +1,42 @@
+import React, { useEffect, useState } from "react";
+import { View, Text } from "react-native";
+import { isNumber } from "lodash";
+import { withTheme } from "../theming";
+import IconButton from "./IconButton";
+import { extractStyles } from "../utilities";
+const Stepper = ({ min = -Infinity, max = Infinity, value: valueProp, defaultValue, style, iconSize = 24, iconColor, onChange, theme: { colors, typography }, Icon, }) => {
+    const { viewStyles, textStyles } = extractStyles(style);
+    const [value, setValue] = useState(defaultValue !== null && defaultValue !== void 0 ? defaultValue : 0);
+    const isValidValue = (valueArg) => valueArg >= min && valueArg <= max;
+    const handlePlusOrMinus = (type) => {
+        const newValue = type === "plus" ? value + 1 : value - 1;
+        if (isValidValue(newValue)) {
+            setValue(newValue);
+            onChange === null || onChange === void 0 ? void 0 : onChange(newValue);
+        }
+    };
+    useEffect(() => {
+        if (valueProp != null &&
+            isNumber(valueProp) &&
+            valueProp !== value &&
+            isValidValue(valueProp)) {
+            setValue(valueProp);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [valueProp]);
+    return (React.createElement(View, { style: [{ flexDirection: "row" }, viewStyles] },
+        React.createElement(IconButton, { Icon: Icon, icon: "MaterialIcons/remove", onPress: () => handlePlusOrMinus("minus"), size: iconSize, color: iconColor, disabled: value === min, style: { opacity: value === min ? 0.5 : 1 } }),
+        React.createElement(Text, { style: [
+                typography.body1,
+                {
+                    textAlign: "center",
+                    alignSelf: "center",
+                    color: colors.medium,
+                    marginHorizontal: 8,
+                },
+                textStyles,
+            ] }, value),
+        React.createElement(IconButton, { Icon: Icon, icon: "MaterialIcons/add", onPress: () => handlePlusOrMinus("plus"), size: iconSize, color: iconColor, disabled: value === max, style: { opacity: value === max ? 0.5 : 1 } })));
+};
+export default withTheme(Stepper);
+//# sourceMappingURL=Stepper.js.map

package/src/components/Stepper.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Stepper.js","sourceRoot":"","sources":["Stepper.tsx"],"names":[],"mappings":"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"}

package/src/components/Stepper.tsx

@@ -1,101 +1,101 @@
-import React, { FC, useEffect, useState } from "react";
-import { View, Text, StyleProp, ViewStyle, TextStyle } from "react-native";
-import { isNumber } from "lodash";
-
-import { withTheme } from "../theming";
-import type { Theme } from "../styles/DefaultTheme";
-import type { IconSlot } from "../interfaces/Icon";
-import IconButton from "./IconButton";
-import { extractStyles } from "../utilities";
-
-type Props = {
-  min: number;
-  max: number;
-  value?: number;
-  defaultValue?: number;
-  style?: StyleProp<ViewStyle | TextStyle>;
-  iconSize: number;
-  iconColor?: string;
-  onChange?: (value: number) => void;
-  theme: Theme;
-} & IconSlot;
-
-const Stepper: FC<Props> = ({
-  min = -Infinity,
-  max = Infinity,
-  value: valueProp,
-  defaultValue,
-  style,
-  iconSize = 24,
-  iconColor,
-  onChange,
-  theme: { colors, typography },
-  Icon,
-}) => {
-  const { viewStyles, textStyles } = extractStyles(style);
-  const [value, setValue] = useState(defaultValue ?? 0);
-
-  const isValidValue = (valueArg: number) => valueArg >= min && valueArg <= max;
-
-  const handlePlusOrMinus = (type: "plus" | "minus") => {
-    const newValue = type === "plus" ? value + 1 : value - 1;
-
-    if (isValidValue(newValue)) {
-      setValue(newValue);
-      onChange?.(newValue);
-    }
-  };
-
-  useEffect(() => {
-    if (
-      valueProp != null &&
-      isNumber(valueProp) &&
-      valueProp !== value &&
-      isValidValue(valueProp)
-    ) {
-      setValue(valueProp);
-    }
-    // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [valueProp]);
-
-  return (
-    <View style={[{ flexDirection: "row" }, viewStyles]}>
-      <IconButton
-        Icon={Icon}
-        icon="MaterialIcons/remove"
-        onPress={() => handlePlusOrMinus("minus")}
-        size={iconSize}
-        color={iconColor}
-        disabled={value === min}
-        style={{ opacity: value === min ? 0.5 : 1 }}
-      />
-
-      <Text
-        style={[
-          typography.body1,
-          {
-            textAlign: "center",
-            alignSelf: "center",
-            color: colors.medium,
-            marginHorizontal: 8,
-          },
-          textStyles,
-        ]}
-      >
-        {value}
-      </Text>
-
-      <IconButton
-        Icon={Icon}
-        icon="MaterialIcons/add"
-        onPress={() => handlePlusOrMinus("plus")}
-        size={iconSize}
-        color={iconColor}
-        disabled={value === max}
-        style={{ opacity: value === max ? 0.5 : 1 }}
-      />
-    </View>
-  );
-};
-
-export default withTheme(Stepper);
+import React, { FC, useEffect, useState } from "react";
+import { View, Text, StyleProp, ViewStyle, TextStyle } from "react-native";
+import { isNumber } from "lodash";
+
+import { withTheme } from "../theming";
+import type { Theme } from "../styles/DefaultTheme";
+import type { IconSlot } from "../interfaces/Icon";
+import IconButton from "./IconButton";
+import { extractStyles } from "../utilities";
+
+type Props = {
+  min: number;
+  max: number;
+  value?: number;
+  defaultValue?: number;
+  style?: StyleProp<ViewStyle | TextStyle>;
+  iconSize: number;
+  iconColor?: string;
+  onChange?: (value: number) => void;
+  theme: Theme;
+} & IconSlot;
+
+const Stepper: FC<Props> = ({
+  min = -Infinity,
+  max = Infinity,
+  value: valueProp,
+  defaultValue,
+  style,
+  iconSize = 24,
+  iconColor,
+  onChange,
+  theme: { colors, typography },
+  Icon,
+}) => {
+  const { viewStyles, textStyles } = extractStyles(style);
+  const [value, setValue] = useState(defaultValue ?? 0);
+
+  const isValidValue = (valueArg: number) => valueArg >= min && valueArg <= max;
+
+  const handlePlusOrMinus = (type: "plus" | "minus") => {
+    const newValue = type === "plus" ? value + 1 : value - 1;
+
+    if (isValidValue(newValue)) {
+      setValue(newValue);
+      onChange?.(newValue);
+    }
+  };
+
+  useEffect(() => {
+    if (
+      valueProp != null &&
+      isNumber(valueProp) &&
+      valueProp !== value &&
+      isValidValue(valueProp)
+    ) {
+      setValue(valueProp);
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [valueProp]);
+
+  return (
+    <View style={[{ flexDirection: "row" }, viewStyles]}>
+      <IconButton
+        Icon={Icon}
+        icon="MaterialIcons/remove"
+        onPress={() => handlePlusOrMinus("minus")}
+        size={iconSize}
+        color={iconColor}
+        disabled={value === min}
+        style={{ opacity: value === min ? 0.5 : 1 }}
+      />
+
+      <Text
+        style={[
+          typography.body1,
+          {
+            textAlign: "center",
+            alignSelf: "center",
+            color: colors.medium,
+            marginHorizontal: 8,
+          },
+          textStyles,
+        ]}
+      >
+        {value}
+      </Text>
+
+      <IconButton
+        Icon={Icon}
+        icon="MaterialIcons/add"
+        onPress={() => handlePlusOrMinus("plus")}
+        size={iconSize}
+        color={iconColor}
+        disabled={value === max}
+        style={{ opacity: value === max ? 0.5 : 1 }}
+      />
+    </View>
+  );
+};
+
+export default withTheme(Stepper);

package/src/components/Surface.js

@@ -0,0 +1,33 @@
+/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */
+import * as React from "react";
+import { Animated, StyleSheet, } from "react-native";
+import shadow from "../styles/shadow";
+import overlay from "../styles/overlay";
+import { withTheme } from "../theming";
+const Surface = ({ elevation: propElevation, style, theme, children, ...rest }) => {
+    const { elevation: styleElevation = 3, backgroundColor, ...restStyle } = (StyleSheet.flatten(style) || {});
+    const { dark: isDarkTheme, mode, colors } = theme;
+    const elevation = propElevation !== null && propElevation !== void 0 ? propElevation : styleElevation;
+    const evalationStyles = elevation ? shadow(elevation) : {};
+    const getBackgroundColor = () => {
+        if (backgroundColor) {
+            return backgroundColor;
+        }
+        else if (isDarkTheme && mode === "adaptive") {
+            return overlay(elevation, colors.surface);
+        }
+        else {
+            return colors.surface;
+        }
+    };
+    return (React.createElement(Animated.View, { ...rest, style: [
+            {
+                backgroundColor: getBackgroundColor(),
+                elevation,
+                ...evalationStyles,
+                ...restStyle,
+            },
+        ] }, children));
+};
+export default withTheme(Surface);
+//# sourceMappingURL=Surface.js.map

package/src/components/Surface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Surface.js","sourceRoot":"","sources":["Surface.tsx"],"names":[],"mappings":"AAAA,sGAAsG;AACtG,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,QAAQ,EACR,UAAU,GAIX,MAAM,cAAc,CAAC;AAEtB,OAAO,MAAM,MAAM,kBAAkB,CAAC;AACtC,OAAO,OAAO,MAAM,mBAAmB,CAAC;AACxC,OAAO,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AASvC,MAAM,OAAO,GAA6C,CAAC,EACzD,SAAS,EAAE,aAAa,EACxB,KAAK,EACL,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,EACJ,SAAS,EAAE,cAAc,GAAG,CAAC,EAC7B,eAAe,EACf,GAAG,SAAS,EACb,GAAG,CAAC,UAAU,CAAC,OAAO,CAAC,KAAK,CAAC,IAAI,EAAE,CAAc,CAAC;IAEnD,MAAM,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAElD,MAAM,SAAS,GAAG,aAAa,aAAb,aAAa,cAAb,aAAa,GAAI,cAAc,CAAC;IAElD,MAAM,eAAe,GAAG,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IAE3D,MAAM,kBAAkB,GAAG,GAAG,EAAE;QAC9B,IAAI,eAAe,EAAE;YACnB,OAAO,eAAe,CAAC;SACxB;aAAM,IAAI,WAAW,IAAI,IAAI,KAAK,UAAU,EAAE;YAC7C,OAAO,OAAO,CAAC,SAAS,EAAE,MAAM,CAAC,OAAO,CAAC,CAAC;SAC3C;aAAM;YACL,OAAO,MAAM,CAAC,OAAO,CAAC;SACvB;IACH,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,QAAQ,CAAC,IAAI,OACR,IAAI,EACR,KAAK,EAAE;YACL;gBACE,eAAe,EAAE,kBAAkB,EAAE;gBACrC,SAAS;gBACT,GAAG,eAAe;gBAClB,GAAG,SAAS;aACb;SACF,IAEA,QAAQ,CACK,CACjB,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,SAAS,CAAC,OAAO,CAAC,CAAC"}

package/src/components/Surface.tsx

@@ -1,68 +1,68 @@
-/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */
-import * as React from "react";
-import {
-  Animated,
-  StyleSheet,
-  ViewProps,
-  StyleProp,
-  ViewStyle,
-} from "react-native";
-
-import shadow from "../styles/shadow";
-import overlay from "../styles/overlay";
-import { withTheme } from "../theming";
-import type { Theme } from "../styles/DefaultTheme";
-
-type Props = {
-  elevation?: number;
-  style?: StyleProp<ViewStyle>;
-  theme: Theme;
-} & ViewProps;
-
-const Surface: React.FC<React.PropsWithChildren<Props>> = ({
-  elevation: propElevation,
-  style,
-  theme,
-  children,
-  ...rest
-}) => {
-  const {
-    elevation: styleElevation = 3,
-    backgroundColor,
-    ...restStyle
-  } = (StyleSheet.flatten(style) || {}) as ViewStyle;
-
-  const { dark: isDarkTheme, mode, colors } = theme;
-
-  const elevation = propElevation ?? styleElevation;
-
-  const evalationStyles = elevation ? shadow(elevation) : {};
-
-  const getBackgroundColor = () => {
-    if (backgroundColor) {
-      return backgroundColor;
-    } else if (isDarkTheme && mode === "adaptive") {
-      return overlay(elevation, colors.surface);
-    } else {
-      return colors.surface;
-    }
-  };
-
-  return (
-    <Animated.View
-      {...rest}
-      style={[
-        {
-          backgroundColor: getBackgroundColor(),
-          elevation,
-          ...evalationStyles,
-          ...restStyle,
-        },
-      ]}
-    >
-      {children}
-    </Animated.View>
-  );
-};
-
-export default withTheme(Surface);
+/* Copied from https://github.com/callstack/react-native-paper/blob/main/src/components/Surface.tsx */
+import * as React from "react";
+import {
+  Animated,
+  StyleSheet,
+  ViewProps,
+  StyleProp,
+  ViewStyle,
+} from "react-native";
+
+import shadow from "../styles/shadow";
+import overlay from "../styles/overlay";
+import { withTheme } from "../theming";
+import type { Theme } from "../styles/DefaultTheme";
+
+type Props = {
+  elevation?: number;
+  style?: StyleProp<ViewStyle>;
+  theme: Theme;
+} & ViewProps;
+
+const Surface: React.FC<React.PropsWithChildren<Props>> = ({
+  elevation: propElevation,
+  style,
+  theme,
+  children,
+  ...rest
+}) => {
+  const {
+    elevation: styleElevation = 3,
+    backgroundColor,
+    ...restStyle
+  } = (StyleSheet.flatten(style) || {}) as ViewStyle;
+
+  const { dark: isDarkTheme, mode, colors } = theme;
+
+  const elevation = propElevation ?? styleElevation;
+
+  const evalationStyles = elevation ? shadow(elevation) : {};
+
+  const getBackgroundColor = () => {
+    if (backgroundColor) {
+      return backgroundColor;
+    } else if (isDarkTheme && mode === "adaptive") {
+      return overlay(elevation, colors.surface);
+    } else {
+      return colors.surface;
+    }
+  };
+
+  return (
+    <Animated.View
+      {...rest}
+      style={[
+        {
+          backgroundColor: getBackgroundColor(),
+          elevation,
+          ...evalationStyles,
+          ...restStyle,
+        },
+      ]}
+    >
+      {children}
+    </Animated.View>
+  );
+};
+
+export default withTheme(Surface);

package/src/components/SwipeableItem/SwipeableItem.js

@@ -0,0 +1,119 @@
+import React from "react";
+import { View, StyleSheet, Text, } from "react-native";
+import Pressable from "../Pressable";
+import { extractBorderAndMarginStyles, extractEffectStyles, extractFlexItemStyles, extractPositionStyles, extractSizeStyles, extractStyles, flattenReactFragments, } from "../../utilities";
+import { SwipeRow } from "react-native-swipe-list-view";
+import { withTheme } from "../../theming";
+import SwipeableItemButton from "./SwipeableItemButton";
+import { SwipeableListContext } from "./SwipeableList";
+import { leftSwipeToSwipeableItemBehindItem, rightSwipeToSwipeableItemBehindItem, extractLeftSwipeProps, extractRightSwipeProps, } from "./SwipeableItemCommon";
+const SwipeableItem = ({ theme, style, children: childrenProp, Icon, closeOnPress, leftOpenValue, rightOpenValue, leftActivationValue, rightActivationValue, swipeActivationPercentage = 80, stopLeftSwipe, stopRightSwipe, friction = 20, disableLeftSwipe, disableRightSwipe, ...rest }) => {
+    const isEmptyObject = (object) => {
+        return Object.keys(object).length === 0;
+    };
+    const { onStartSwiping, onStopSwiping } = React.useContext(SwipeableListContext);
+    const swipeableRef = React.useRef(null);
+    const { viewStyles, textStyles } = extractStyles(style);
+    const { borderStyles, marginStyles } = extractBorderAndMarginStyles(viewStyles);
+    const sizeStyles = extractSizeStyles(viewStyles);
+    const parentContainerStyles = StyleSheet.flatten([
+        borderStyles,
+        marginStyles,
+        extractFlexItemStyles(viewStyles),
+        extractPositionStyles(viewStyles),
+        extractEffectStyles(viewStyles),
+        sizeStyles,
+    ]);
+    //Remove styles already consumed from viewStyles
+    Object.keys(parentContainerStyles).forEach((key) => delete viewStyles[key]);
+    const surfaceContainerStyles = StyleSheet.flatten([
+        viewStyles,
+        sizeStyles /* Size styles needs to be readded to surface container due to inconsistencies on web */,
+    ]);
+    const [componentWidth, setComponentWidth] = React.useState(null);
+    const children = React.useMemo(() => flattenReactFragments(React.Children.toArray(childrenProp)), [childrenProp]);
+    const leftSwipeButtons = React.useMemo(() => children.filter((child) => React.isValidElement(child) &&
+        child.type === SwipeableItemButton &&
+        child.props.revealSwipeDirection === "left"), [children]);
+    const rightSwipeButtons = React.useMemo(() => children.filter((child) => React.isValidElement(child) &&
+        child.type === SwipeableItemButton &&
+        child.props.revealSwipeDirection === "right"), [children]);
+    const remainingChildren = React.useMemo(() => React.Children.toArray(children).filter((child) => React.isValidElement(child) && child.type !== SwipeableItemButton), [children]);
+    const leftSwipe = extractLeftSwipeProps(rest);
+    const rightSwipe = extractRightSwipeProps(rest);
+    const isLeftSwipeHandled = !isEmptyObject(leftSwipe);
+    const isRightSwipeHandled = !isEmptyObject(rightSwipe);
+    if (leftSwipeButtons.length > 2 || rightSwipeButtons.length > 2) {
+        throw Error("Cannot have more than 2 SwipeableItemButton(s) per side");
+    }
+    if ((leftSwipeButtons.length && isLeftSwipeHandled) ||
+        (rightSwipeButtons.length && isRightSwipeHandled)) {
+        throw Error("Colliding configuration in SwipeableItem. You cannot have SwipeableItemButton(s) on the swipe direction where swipe handling is configured. Either reset swipe configuration or remove the button(s).");
+    }
+    //Renders a single 'behind' item. Used for both buttons and swipe handler
+    const renderBehindItem = (item, index) => (React.createElement(Pressable, { testID: "swipeable-behind-item", key: index.toString(), onPress: () => {
+            var _a, _b;
+            (_a = item.onPress) === null || _a === void 0 ? void 0 : _a.call(item);
+            if (item.closeOnPress !== false) {
+                (_b = swipeableRef.current) === null || _b === void 0 ? void 0 : _b.closeRow();
+            }
+        }, style: [
+            styles.buttonContainer,
+            { backgroundColor: item.backgroundColor || theme.colors.primary },
+        ] },
+        item.icon && (React.createElement(Icon, { name: item.icon, size: item.iconSize || 25, color: item.color || theme.colors.surface })),
+        item.title && (React.createElement(Text, { style: [textStyles, { color: item.color || theme.colors.surface }] }, item.title))));
+    const defaultLeftOpenValue = componentWidth ? componentWidth / 2 : 0;
+    const defaultRightOpenValue = componentWidth ? -componentWidth / 2 : 0;
+    return (React.createElement(View, { onLayout: (event) => {
+            setComponentWidth(event.nativeEvent.layout.width);
+        }, style: [styles.parentContainer, parentContainerStyles] },
+        React.createElement(SwipeRow, { ref: swipeableRef, leftOpenValue: isRightSwipeHandled ? 0 : leftOpenValue || defaultLeftOpenValue //If in swiping mode, don't keep open
+            , rightOpenValue: isLeftSwipeHandled ? 0 : rightOpenValue || defaultRightOpenValue, leftActivationValue: leftActivationValue || isRightSwipeHandled
+                ? defaultLeftOpenValue * (swipeActivationPercentage / 100) //When swipe passes activation percentage then it should be considered activated (call onSwipe)
+                : defaultLeftOpenValue, rightActivationValue: rightActivationValue || isLeftSwipeHandled
+                ? defaultRightOpenValue * (swipeActivationPercentage / 100)
+                : defaultRightOpenValue, stopLeftSwipe: stopRightSwipe || defaultLeftOpenValue, stopRightSwipe: stopLeftSwipe || defaultRightOpenValue, onLeftAction: isRightSwipeHandled ? () => { var _a; return (_a = rightSwipe.onSwipedRight) === null || _a === void 0 ? void 0 : _a.call(rightSwipe); } : undefined, onRightAction: isLeftSwipeHandled ? () => { var _a; return (_a = leftSwipe.onSwipedLeft) === null || _a === void 0 ? void 0 : _a.call(leftSwipe); } : undefined, swipeGestureBegan: onStartSwiping, swipeGestureEnded: onStopSwiping, closeOnRowPress: closeOnPress, friction: friction, disableLeftSwipe: disableRightSwipe, disableRightSwipe: disableLeftSwipe, ...rest },
+            React.createElement(View, { style: styles.behindContainer },
+                React.createElement(View, { style: styles.behindContainerItem }, isRightSwipeHandled
+                    ? renderBehindItem(rightSwipeToSwipeableItemBehindItem(rightSwipe), 0)
+                    : rightSwipeButtons.map((item, index) => renderBehindItem(item.props, index))),
+                React.createElement(View, { style: styles.behindContainerItem }, isLeftSwipeHandled
+                    ? renderBehindItem(leftSwipeToSwipeableItemBehindItem(leftSwipe), 0)
+                    : leftSwipeButtons.map((item, index) => renderBehindItem(item.props, index)))),
+            React.createElement(View, { style: [
+                    styles.surfaceContainer,
+                    {
+                        backgroundColor: theme.colors.background,
+                    },
+                    surfaceContainerStyles,
+                ] }, remainingChildren))));
+};
+const styles = StyleSheet.create({
+    parentContainer: {
+        overflow: "hidden",
+        minHeight: 50,
+    },
+    behindContainer: {
+        flex: 1,
+        width: "100%",
+        height: "100%",
+        flexDirection: "row",
+    },
+    behindContainerItem: {
+        flex: 1,
+        flexDirection: "row",
+    },
+    buttonContainer: {
+        flex: 1,
+        alignItems: "center",
+        justifyContent: "center",
+    },
+    surfaceContainer: {
+        width: "100%",
+        minHeight: 50,
+        overflow: "hidden",
+    },
+});
+export default withTheme(SwipeableItem);
+//# sourceMappingURL=SwipeableItem.js.map

package/src/components/SwipeableItem/SwipeableItem.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SwipeableItem.js","sourceRoot":"","sources":["SwipeableItem.tsx"],"names":[],"mappings":"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"}