@draftbit/core 47.2.13-f38301.2 → 47.2.14-9580d7.2

package/lib/src/components/Card.js

@@ -0,0 +1,58 @@
+import React from "react";
+import { StyleSheet, View, Pressable, } from "react-native";
+import Image from "./Image";
+import Surface from "./Surface";
+import { Title, Subtitle, Caption } from "./Typography";
+import { withTheme } from "../theming";
+import Config from "./Config";
+const ICON_SIZE = Config.cardIconSize;
+const ICON_CONTAINER_SIZE = Config.cardIconSize * 2;
+const ICON_CONTAINER_PADDING = Config.cardIconSize / 2 - 1;
+const ICON_ELEVATION = Config.cardIconElevation;
+export const TopRightCircleIcon = withTheme(({ Icon, icon, theme, onPress, }) => {
+    return (React.createElement(Surface, { style: {
+            justifyContent: "center",
+            alignItems: "center",
+            elevation: ICON_ELEVATION,
+            position: "absolute",
+            top: 12,
+            right: 12,
+            width: ICON_CONTAINER_SIZE,
+            height: ICON_CONTAINER_SIZE,
+            padding: ICON_CONTAINER_PADDING,
+            borderRadius: ICON_CONTAINER_SIZE,
+            backgroundColor: "rgba(0, 0, 0, 0.1)",
+        } },
+        React.createElement(Pressable, { disabled: !onPress, onPress: onPress, style: ({ pressed }) => {
+                return [
+                    {
+                        opacity: pressed ? 0.8 : 1,
+                    },
+                ];
+            } },
+            React.createElement(Icon, { name: icon, size: ICON_SIZE, color: theme.colors.surface }))));
+});
+const Card = ({ Icon, image = Config.cardImageUrl, title, subtitle, description, textCentered, icon, aspectRatio = 1.5, elevation = 2, style, onPress, onPressIcon, titleStyle, subtitleStyle, descriptionStyle, theme, children, }) => {
+    const { backgroundColor: bgColor, padding, ...styles } = StyleSheet.flatten(style || {});
+    const backgroundColor = bgColor ? bgColor : theme.colors.surface;
+    const innerPadding = padding ? padding : 12;
+    return (React.createElement(Surface, { style: [{ elevation, backgroundColor }, styles] },
+        React.createElement(Pressable, { disabled: !onPress, onPress: onPress, style: ({ pressed }) => {
+                return [
+                    {
+                        opacity: pressed ? 0.8 : 1,
+                    },
+                ];
+            } },
+            React.createElement(Image, { style: { aspectRatio }, source: typeof image === "string" ? { uri: image } : image, resizeMode: "cover" }),
+            React.createElement(View, { style: { padding: innerPadding } },
+                React.createElement(View, { style: { alignItems: textCentered ? "center" : "flex-start" } },
+                    title || (title && title !== "") ? (React.createElement(Title, { text: title, style: titleStyle })) : null,
+                    subtitle || (subtitle && subtitle !== "") ? (React.createElement(Subtitle, { text: subtitle, style: subtitleStyle })) : null,
+                    description || (description && description !== "") ? (React.createElement(View, { style: { marginTop: 4 } },
+                        React.createElement(Caption, { text: description, style: descriptionStyle }))) : null,
+                    children)),
+            icon ? (React.createElement(TopRightCircleIcon, { Icon: Icon, icon: icon, onPress: onPressIcon })) : null)));
+};
+export default withTheme(Card);
+//# sourceMappingURL=Card.js.map

package/lib/src/components/Card.js.map

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

package/lib/src/components/Checkbox/Checkbox.d.ts

@@ -0,0 +1,19 @@
+import * as React from "react";
+import { PressableProps, StyleProp, ViewStyle } from "react-native";
+import type { IconSlot } from "../../interfaces/Icon";
+export interface CheckboxProps {
+    status?: boolean;
+    disabled?: boolean;
+    onPress?: (checked: boolean) => void;
+    onCheck?: () => void;
+    onUncheck?: () => void;
+    color?: string;
+    uncheckedColor?: string;
+    checkedIcon?: string;
+    uncheckedIcon?: string;
+    defaultValue?: boolean;
+    size?: number;
+    style?: StyleProp<ViewStyle>;
+}
+declare const Checkbox: React.FC<CheckboxProps & PressableProps & IconSlot>;
+export default Checkbox;

package/lib/src/components/Checkbox/Checkbox.js

@@ -0,0 +1,63 @@
+import * as React from "react";
+import { View, StyleSheet, Pressable, } from "react-native";
+import { useTheme } from "../../theming";
+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);
+    React.useEffect(() => {
+        if (status != null) {
+            setInternalValue(status);
+        }
+    }, [status]);
+    // This special logic is to handle weird APIs like Airtable that return
+    // true or undefined for a boolean
+    const previousDefaultValue = usePrevious(defaultValue);
+    React.useEffect(() => {
+        if (defaultValue !== previousDefaultValue) {
+            setInternalValue(Boolean(defaultValue));
+        }
+    }, [defaultValue, previousDefaultValue]);
+    const { colors } = useTheme();
+    const checkboxColor = internalValue
+        ? color || colors.primary
+        : uncheckedColor || colors.primary;
+    const handlePress = () => {
+        const newValue = !internalValue;
+        setInternalValue(newValue);
+        onPress === null || onPress === void 0 ? void 0 : onPress(newValue);
+        if (newValue) {
+            onCheck === null || onCheck === void 0 ? void 0 : onCheck();
+        }
+        if (!newValue) {
+            onUncheck === null || onUncheck === void 0 ? void 0 : onUncheck();
+        }
+    };
+    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: [
+                    styles.fill,
+                    { opacity: disabled ? 0.5 : 1 },
+                    { borderColor: checkboxColor },
+                ] }))));
+};
+const styles = StyleSheet.create({
+    container: {
+        borderRadius: 18,
+    },
+    fillContainer: {
+        alignItems: "center",
+        justifyContent: "center",
+    },
+    icon: {
+        alignSelf: "center",
+    },
+    fill: {
+        borderRadius: 5,
+        width: 30,
+        height: 30,
+        alignSelf: "center",
+    },
+});
+export default Checkbox;
+//# sourceMappingURL=Checkbox.js.map

package/lib/src/components/Checkbox/Checkbox.js.map

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

package/lib/src/components/Checkbox/CheckboxGroup.d.ts

@@ -0,0 +1,14 @@
+import * as React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+import type { Theme } from "../../styles/DefaultTheme";
+import { Direction } from "./context";
+export interface CheckboxGroupProps {
+    direction?: Direction;
+    style?: StyleProp<ViewStyle>;
+    values: string[];
+    onValueChange: (value: string, selected: boolean) => void;
+    theme: Theme;
+    children: React.ReactNode;
+}
+declare const CheckboxGroup: React.FC<CheckboxGroupProps>;
+export default CheckboxGroup;

package/lib/src/components/Checkbox/CheckboxGroup.js

@@ -0,0 +1,22 @@
+import * as React from "react";
+import { View } from "react-native";
+import { checkboxGroupContext, Direction } from "./context";
+const { Provider } = checkboxGroupContext;
+const CheckboxGroup = ({ direction = Direction.Vertical, values, onValueChange = () => { }, style, children, ...rest }) => {
+    const _containerStyle = [
+        {
+            flexDirection: direction === Direction.Horizontal ? "row" : "column",
+            overflow: "hidden",
+        },
+    ];
+    if (direction !== Direction.Vertical) {
+        _containerStyle.push({
+            alignItems: "center",
+        });
+    }
+    return (React.createElement(View, { style: [{ minHeight: 40 }, style], ...rest },
+        React.createElement(Provider, { value: { values, onValueChange, direction } },
+            React.createElement(View, { style: _containerStyle }, children))));
+};
+export default CheckboxGroup;
+//# sourceMappingURL=CheckboxGroup.js.map

package/lib/src/components/Checkbox/CheckboxGroup.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CheckboxGroup.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/CheckboxGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,IAAI,EAAwB,MAAM,cAAc,CAAC;AAE1D,OAAO,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAW5D,MAAM,EAAE,QAAQ,EAAE,GAAG,oBAAoB,CAAC;AAE1C,MAAM,aAAa,GAAiC,CAAC,EACnD,SAAS,GAAG,SAAS,CAAC,QAAQ,EAC9B,MAAM,EACN,aAAa,GAAG,GAAG,EAAE,GAAE,CAAC,EACxB,KAAK,EACL,QAAQ,EACR,GAAG,IAAI,EACR,EAAE,EAAE;IACH,MAAM,eAAe,GAAyB;QAC5C;YACE,aAAa,EAAE,SAAS,KAAK,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,QAAQ;YACpE,QAAQ,EAAE,QAAQ;SACnB;KACF,CAAC;IAEF,IAAI,SAAS,KAAK,SAAS,CAAC,QAAQ,EAAE;QACpC,eAAe,CAAC,IAAI,CAAC;YACnB,UAAU,EAAE,QAAQ;SACrB,CAAC,CAAC;KACJ;IAED,OAAO,CACL,oBAAC,IAAI,IAAC,KAAK,EAAE,CAAC,EAAE,SAAS,EAAE,EAAE,EAAE,EAAE,KAAK,CAAC,KAAM,IAAI;QAC/C,oBAAC,QAAQ,IAAC,KAAK,EAAE,EAAE,MAAM,EAAE,aAAa,EAAE,SAAS,EAAE;YACnD,oBAAC,IAAI,IAAC,KAAK,EAAE,eAAe,IAAG,QAAQ,CAAQ,CACtC,CACN,CACR,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,aAAa,CAAC"}

package/lib/src/components/Checkbox/CheckboxGroupRow.d.ts

@@ -0,0 +1,21 @@
+import * as React from "react";
+import { StyleProp, ViewStyle, TextStyle } from "react-native";
+import { CheckboxProps } from "./Checkbox";
+import type { IconSlot } from "../../interfaces/Icon";
+export declare enum Direction {
+    Row = "row",
+    RowReverse = "row-reverse"
+}
+export interface CheckboxGroupRowProps extends Omit<CheckboxProps, "onPress"> {
+    label: string | React.ReactNode;
+    value: string;
+    labelContainerStyle: StyleProp<ViewStyle>;
+    checkboxStyle?: StyleProp<ViewStyle>;
+    labelStyle?: StyleProp<TextStyle>;
+    onPress?: (value: boolean) => void;
+    direction?: Direction;
+    color: string;
+    unselectedColor: string;
+}
+declare const CheckboxGroupRow: React.FC<CheckboxGroupRowProps & IconSlot>;
+export default CheckboxGroupRow;

package/lib/src/components/Checkbox/CheckboxGroupRow.js

@@ -0,0 +1,77 @@
+import * as React from "react";
+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 { extractStyles } from "../../utilities";
+export var Direction;
+(function (Direction) {
+    Direction["Row"] = "row";
+    Direction["RowReverse"] = "row-reverse";
+})(Direction || (Direction = {}));
+const getCheckboxAlignment = (parentDirection, direction) => {
+    if (parentDirection === GroupDirection.Horizontal) {
+        return direction === Direction.Row ? "flex-start" : "flex-end";
+    }
+    else if (direction === Direction.RowReverse) {
+        return "flex-start";
+    }
+    else {
+        return "flex-end";
+    }
+};
+const renderLabel = (value, labelStyle, textStyle) => {
+    if (typeof value === "string") {
+        return React.createElement(Text, { style: [labelStyle, textStyle] }, value);
+    }
+    else {
+        return React.createElement(React.Fragment, null, value);
+    }
+};
+const CheckboxGroupRow = ({ Icon, label = "Label", status, value, onPress, labelContainerStyle, labelStyle, checkboxStyle, direction = Direction.Row, disabled, style, color, uncheckedColor, ...rest }) => {
+    const { values: selectedValues, onValueChange, direction: parentDirection, } = useCheckboxGroupContext();
+    const values = Array.isArray(selectedValues) ? selectedValues : [];
+    const isChecked = status || values.includes(value);
+    const handlePress = () => {
+        if (!disabled) {
+            onPress === null || onPress === void 0 ? void 0 : onPress(!isChecked);
+            onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(value, !isChecked);
+        }
+    };
+    const { textStyles, viewStyles } = extractStyles(style);
+    return (React.createElement(Pressable, { onPress: handlePress, style: [styles.mainParent, { flexDirection: direction }, viewStyles], disabled: disabled, ...rest },
+        React.createElement(View, { style: [
+                styles.label,
+                {
+                    alignItems: direction === Direction.Row ? "flex-start" : "flex-end",
+                },
+                labelContainerStyle,
+            ] }, renderLabel(label, labelStyle, textStyles)),
+        React.createElement(View, { style: {
+                flex: 1,
+                alignItems: getCheckboxAlignment(parentDirection, direction),
+            } },
+            React.createElement(Checkbox, { Icon: Icon, status: isChecked, onPress: handlePress, style: checkboxStyle, disabled: disabled, color: color, uncheckedColor: uncheckedColor }))));
+};
+const styles = StyleSheet.create({
+    mainParent: {
+        alignItems: "center",
+        justifyContent: "space-around",
+        paddingStart: 20,
+        minHeight: 50,
+        paddingEnd: 20,
+        display: "flex",
+        ...Platform.select({
+            web: {
+                cursor: "pointer",
+                userSelect: "none",
+            },
+        }),
+    },
+    label: {
+        flex: 3,
+    },
+});
+export default CheckboxGroupRow;
+//# sourceMappingURL=CheckboxGroupRow.js.map

package/lib/src/components/Checkbox/CheckboxGroupRow.js.map

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

package/lib/src/components/Checkbox/CheckboxRow.d.ts

@@ -0,0 +1,17 @@
+import * as React from "react";
+import { StyleProp, ViewStyle, TextStyle } from "react-native";
+import type { IconSlot } from "../../interfaces/Icon";
+import { CheckboxProps } from "./Checkbox";
+export declare enum Direction {
+    Row = "row",
+    RowReverse = "row-reverse"
+}
+export interface CheckboxRowProps extends CheckboxProps {
+    label: string | React.ReactNode;
+    labelStyle?: StyleProp<TextStyle>;
+    labelContainerStyle: StyleProp<ViewStyle>;
+    checkboxStyle?: StyleProp<ViewStyle>;
+    direction?: Direction;
+}
+declare const CheckboxRow: React.FC<CheckboxRowProps & IconSlot>;
+export default CheckboxRow;

package/lib/src/components/Checkbox/CheckboxRow.js

@@ -0,0 +1,78 @@
+import * as React from "react";
+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 Checkbox from "./Checkbox";
+export var Direction;
+(function (Direction) {
+    Direction["Row"] = "row";
+    Direction["RowReverse"] = "row-reverse";
+})(Direction || (Direction = {}));
+const renderLabel = (value, labelStyle, textStyle) => {
+    if (isString(value)) {
+        return React.createElement(Text, { style: [textStyle, labelStyle] }, value);
+    }
+    else {
+        return React.createElement(React.Fragment, null, value);
+    }
+};
+const CheckboxRow = ({ label = "Label", labelStyle, labelContainerStyle, checkboxStyle, direction = Direction.Row, Icon, status, disabled = false, onPress, onCheck, onUncheck, color, uncheckedColor, defaultValue, checkedIcon, uncheckedIcon, size, style, ...rest }) => {
+    const [internalValue, setInternalValue] = React.useState(status || defaultValue || false);
+    React.useEffect(() => {
+        if (status != null) {
+            setInternalValue(status);
+        }
+    }, [status]);
+    // This special logic is to handle weird APIs like Airtable that return
+    // true or undefined for a boolean
+    const previousDefaultValue = usePrevious(defaultValue);
+    React.useEffect(() => {
+        if (defaultValue !== previousDefaultValue) {
+            setInternalValue(Boolean(defaultValue));
+        }
+    }, [defaultValue, previousDefaultValue]);
+    const handlePress = () => {
+        const newValue = !internalValue;
+        setInternalValue(newValue);
+        onPress === null || onPress === void 0 ? void 0 : onPress(newValue);
+        if (newValue) {
+            onCheck === null || onCheck === void 0 ? void 0 : onCheck();
+        }
+        if (!newValue) {
+            onUncheck === null || onUncheck === void 0 ? void 0 : onUncheck();
+        }
+    };
+    const { textStyles, viewStyles } = extractStyles(style);
+    return (React.createElement(Pressable, { onPress: handlePress, style: [viewStyles, styles.mainParent, { flexDirection: direction }], disabled: disabled, ...rest },
+        React.createElement(View, { style: [
+                styles.label,
+                {
+                    alignItems: direction === Direction.Row ? "flex-start" : "flex-end",
+                },
+                labelContainerStyle,
+            ] }, renderLabel(label, textStyles, labelStyle)),
+        React.createElement(Checkbox, { Icon: Icon, status: internalValue, style: checkboxStyle, disabled: disabled, onPress: handlePress, color: color, uncheckedColor: uncheckedColor, checkedIcon: checkedIcon, uncheckedIcon: uncheckedIcon, size: size })));
+};
+const styles = StyleSheet.create({
+    mainParent: {
+        alignItems: "center",
+        justifyContent: "space-around",
+        paddingStart: 20,
+        minHeight: 50,
+        paddingEnd: 20,
+        display: "flex",
+        ...Platform.select({
+            web: {
+                cursor: "pointer",
+                userSelect: "none",
+            },
+        }),
+    },
+    label: {
+        flex: 3,
+    },
+});
+export default CheckboxRow;
+//# sourceMappingURL=CheckboxRow.js.map

package/lib/src/components/Checkbox/CheckboxRow.js.map

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

package/lib/src/components/Checkbox/context.d.ts

@@ -0,0 +1,13 @@
+/// <reference types="react" />
+export declare enum Direction {
+    Horizontal = "horizontal",
+    Vertical = "vertical"
+}
+interface CheckboxGroupContext {
+    onValueChange: (value: string, selected: boolean) => void;
+    values: string[];
+    direction?: Direction;
+}
+export declare const checkboxGroupContext: import("react").Context<CheckboxGroupContext>;
+export declare function useCheckboxGroupContext(): CheckboxGroupContext;
+export {};

package/lib/src/components/Checkbox/context.js

@@ -0,0 +1,15 @@
+import { createContext, useContext } from "react";
+export var Direction;
+(function (Direction) {
+    Direction["Horizontal"] = "horizontal";
+    Direction["Vertical"] = "vertical";
+})(Direction || (Direction = {}));
+export const checkboxGroupContext = createContext({
+    onValueChange: () => { },
+    values: [],
+    direction: undefined,
+});
+export function useCheckboxGroupContext() {
+    return useContext(checkboxGroupContext);
+}
+//# sourceMappingURL=context.js.map

package/lib/src/components/Checkbox/context.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"context.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/context.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAElD,MAAM,CAAN,IAAY,SAGX;AAHD,WAAY,SAAS;IACnB,sCAAyB,CAAA;IACzB,kCAAqB,CAAA;AACvB,CAAC,EAHW,SAAS,KAAT,SAAS,QAGpB;AAQD,MAAM,CAAC,MAAM,oBAAoB,GAAG,aAAa,CAAuB;IACtE,aAAa,EAAE,GAAG,EAAE,GAAE,CAAC;IACvB,MAAM,EAAE,EAAE;IACV,SAAS,EAAE,SAAS;CACrB,CAAC,CAAC;AAEH,MAAM,UAAU,uBAAuB;IACrC,OAAO,UAAU,CAAC,oBAAoB,CAAC,CAAC;AAC1C,CAAC"}

package/lib/src/components/Checkbox/index.d.ts

@@ -0,0 +1,3 @@
+export { default as Checkbox } from "./Checkbox";
+export { default as CheckboxGroup } from "./CheckboxGroup";
+export { default as CheckboxRow } from "./CheckboxRow";

package/lib/src/components/Checkbox/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Checkbox/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,IAAI,QAAQ,EAAE,MAAM,YAAY,CAAC;AACjD,OAAO,EAAE,OAAO,IAAI,aAAa,EAAE,MAAM,iBAAiB,CAAC;AAC3D,OAAO,EAAE,OAAO,IAAI,WAAW,EAAE,MAAM,eAAe,CAAC"}

package/lib/src/components/CircleImage.d.ts

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { ImageSourcePropType, StyleProp, ImageStyle } from "react-native";
+interface Props {
+    source?: string | ImageSourcePropType;
+    size?: number;
+    style?: StyleProp<ImageStyle>;
+}
+declare const CircleImage: React.FC<React.PropsWithChildren<Props>>;
+export default CircleImage;

package/lib/src/components/CircleImage.js

@@ -0,0 +1,9 @@
+import * as React from "react";
+import { Image, } from "react-native";
+import Config from "./Config";
+const CircleImage = ({ source = Config.placeholderImageURL, size = 60, style, ...props }) => {
+    const borderRadius = size / 2;
+    return (React.createElement(Image, { style: [{ width: size, height: size, borderRadius }, style], source: typeof source === "string" ? { uri: source } : source, resizeMode: "cover", ...props }));
+};
+export default CircleImage;
+//# sourceMappingURL=CircleImage.js.map

package/lib/src/components/CircleImage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CircleImage.js","sourceRoot":"","sources":["../../../src/components/CircleImage.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EACL,KAAK,GAIN,MAAM,cAAc,CAAC;AACtB,OAAO,MAAM,MAAM,UAAU,CAAC;AAO9B,MAAM,WAAW,GAA6C,CAAC,EAC7D,MAAM,GAAG,MAAM,CAAC,mBAAmB,EACnC,IAAI,GAAG,EAAE,EACT,KAAK,EACL,GAAG,KAAK,EACT,EAAE,EAAE;IACH,MAAM,YAAY,GAAG,IAAI,GAAG,CAAC,CAAC;IAE9B,OAAO,CACL,oBAAC,KAAK,IACJ,KAAK,EAAE,CAAC,EAAE,KAAK,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,EAAE,YAAY,EAAE,EAAE,KAAK,CAAC,EAC3D,MAAM,EAAE,OAAO,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,CAAC,CAAC,MAAM,EAC7D,UAAU,EAAC,OAAO,KACd,KAAK,GACT,CACH,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,WAAW,CAAC"}

package/lib/src/components/CircularProgress.d.ts

@@ -0,0 +1,42 @@
+import React from "react";
+import { StyleProp, ViewStyle } from "react-native";
+export declare type Props = {
+    size: number;
+    width: number;
+    backgroundWidth?: number;
+    tintColor?: string;
+    tintTransparency?: boolean;
+    backgroundColor?: string;
+    style?: StyleProp<ViewStyle>;
+    rotation?: string | number | undefined;
+    lineCap?: "butt" | "square" | "round" | undefined;
+    arcSweepAngle?: number;
+    fill: number;
+    children?: (fill: number) => React.ReactNode;
+    childrenContainerStyle?: StyleProp<ViewStyle>;
+    padding?: number;
+    renderCap?: (obj: {
+        center: {
+            x: number;
+            y: number;
+        };
+    }) => React.ReactNode;
+    dashedBackground?: {
+        width: number;
+        gap: number;
+    };
+    dashedTint?: {
+        width: number;
+        gap: number;
+    };
+};
+declare class CircularProgress extends React.Component<Props> {
+    polarToCartesian: (centerX: number, centerY: number, radius: number, angleInDegrees: number) => {
+        x: number;
+        y: number;
+    };
+    circlePath: (x: number, y: number, radius: number, startAngle: number, endAngle: number) => string;
+    clampFill: (fill: number) => number;
+    render(): JSX.Element;
+}
+export default CircularProgress;

package/lib/src/components/CircularProgress.js

@@ -0,0 +1,82 @@
+import React from "react";
+import { View } from "react-native";
+import { Svg, Path, G } from "react-native-svg";
+class CircularProgress extends React.Component {
+    constructor() {
+        super(...arguments);
+        this.polarToCartesian = (centerX, centerY, radius, angleInDegrees) => {
+            var angleInRadians = ((angleInDegrees - 90) * Math.PI) / 180.0;
+            return {
+                x: centerX + radius * Math.cos(angleInRadians),
+                y: centerY + radius * Math.sin(angleInRadians),
+            };
+        };
+        this.circlePath = (x, y, radius, startAngle, endAngle) => {
+            var start = this.polarToCartesian(x, y, radius, endAngle * 0.9999);
+            var end = this.polarToCartesian(x, y, radius, startAngle);
+            var largeArcFlag = endAngle - startAngle <= 180 ? "0" : "1";
+            var d = [
+                "M",
+                start.x,
+                start.y,
+                "A",
+                radius,
+                radius,
+                0,
+                largeArcFlag,
+                0,
+                end.x,
+                end.y,
+            ];
+            return d.join(" ");
+        };
+        this.clampFill = (fill) => Math.min(100, Math.max(0, fill));
+    }
+    render() {
+        const { size, width, backgroundWidth, tintColor = "black", tintTransparency = true, backgroundColor, style, rotation = 90, lineCap = "butt", arcSweepAngle = 360, fill, children, childrenContainerStyle, padding = 0, renderCap, dashedBackground = { width: 0, gap: 0 }, dashedTint = { width: 0, gap: 0 }, } = this.props;
+        const maxWidthCircle = backgroundWidth
+            ? Math.max(width, backgroundWidth)
+            : width;
+        const sizeWithPadding = size / 2 + padding / 2;
+        const radius = size / 2 - maxWidthCircle / 2 - padding / 2;
+        const currentFillAngle = (arcSweepAngle * this.clampFill(fill)) / 100;
+        const backgroundPath = this.circlePath(sizeWithPadding, sizeWithPadding, radius, tintTransparency ? 0 : currentFillAngle, arcSweepAngle);
+        const circlePathItem = this.circlePath(sizeWithPadding, sizeWithPadding, radius, 0, currentFillAngle);
+        const coordinate = this.polarToCartesian(sizeWithPadding, sizeWithPadding, radius, currentFillAngle);
+        const cap = renderCap ? renderCap({ center: coordinate }) : null;
+        const offset = size - maxWidthCircle * 2;
+        const localChildrenContainerStyle = [
+            {
+                position: "absolute",
+                left: maxWidthCircle + padding / 2,
+                top: maxWidthCircle + padding / 2,
+                width: offset,
+                height: offset,
+                borderRadius: offset / 2,
+                alignItems: "center",
+                justifyContent: "center",
+                overflow: "hidden",
+            },
+            childrenContainerStyle,
+        ];
+        const strokeDasharrayTint = dashedTint.gap > 0
+            ? Object.values(dashedTint)
+                .map((value) => value.toString())
+                .join(" ")
+            : "";
+        const strokeDasharrayBackground = dashedBackground.gap > 0
+            ? Object.values(dashedBackground)
+                .map((value) => value.toString())
+                .join(" ")
+            : "";
+        return (React.createElement(View, { style: style },
+            React.createElement(Svg, { width: size + padding, height: size + padding },
+                React.createElement(G, { rotation: rotation, originX: (size + padding) / 2, originY: (size + padding) / 2 },
+                    backgroundColor && (React.createElement(Path, { d: backgroundPath, stroke: backgroundColor, strokeWidth: backgroundWidth || width, strokeLinecap: lineCap, strokeDasharray: strokeDasharrayBackground, fill: "transparent" })),
+                    fill > 0 && (React.createElement(Path, { d: circlePathItem, stroke: tintColor, strokeWidth: width, strokeLinecap: lineCap, strokeDasharray: strokeDasharrayTint, fill: "transparent" })),
+                    cap)),
+            children && (React.createElement(View, { style: localChildrenContainerStyle }, children(fill)))));
+    }
+}
+export default CircularProgress;
+//# sourceMappingURL=CircularProgress.js.map

package/lib/src/components/CircularProgress.js.map

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