@swan-io/lake 4.10.1 → 5.0.0

package/src/components/Heading.d.ts

@@ -1,158 +0,0 @@
-import { ReactNode } from "react";
-import { Text } from "react-native";
-declare const sizes: {
-    40: {
-        fontSize: number;
-        color: string;
-        fontWeight: "600";
-        lineHeight: number;
-        fontFamily: string;
-        letterSpacing: number;
-    };
-    32: {
-        fontSize: number;
-        color: string;
-        fontWeight: "600";
-        lineHeight: number;
-        fontFamily: string;
-        letterSpacing: number;
-    };
-    28: {
-        fontSize: number;
-        color: string;
-        fontWeight: "600";
-        lineHeight: number;
-        fontFamily: string;
-        letterSpacing: number;
-    };
-    24: {
-        fontSize: number;
-        color: string;
-        fontWeight: "600";
-        lineHeight: number;
-        fontFamily: string;
-        letterSpacing: number;
-    };
-    20: {
-        fontSize: number;
-        color: string;
-        fontWeight: "600";
-        lineHeight: number;
-        fontFamily: string;
-        letterSpacing: number;
-    };
-    16: {
-        fontSize: number;
-        color: string;
-        fontWeight: "600";
-        lineHeight: number;
-        fontFamily: string;
-        letterSpacing: number;
-    };
-};
-type HeadingSize = keyof typeof sizes;
-export declare const Heading: import("react").ForwardRefExoticComponent<{
-    allowFontScaling?: boolean | undefined;
-    children?: ReactNode;
-    ellipsizeMode?: "clip" | "middle" | "head" | "tail" | undefined;
-    id?: string | undefined;
-    lineBreakMode?: "clip" | "middle" | "head" | "tail" | undefined;
-    numberOfLines?: number | undefined;
-    onLayout?: ((event: import("react-native").LayoutChangeEvent) => void) | undefined;
-    onTextLayout?: ((event: import("react-native").NativeSyntheticEvent<import("react-native").TextLayoutEventData>) => void) | undefined;
-    onPress?: ((event: import("react-native").GestureResponderEvent) => void) | undefined;
-    onPressIn?: ((event: import("react-native").GestureResponderEvent) => void) | undefined;
-    onPressOut?: ((event: import("react-native").GestureResponderEvent) => void) | undefined;
-    onLongPress?: ((event: import("react-native").GestureResponderEvent) => void) | undefined;
-    style?: import("react-native").StyleProp<import("react-native").TextStyle>;
-    testID?: string | undefined;
-    nativeID?: string | undefined;
-    maxFontSizeMultiplier?: number | null | undefined;
-    href?: string | undefined;
-    hrefAttrs?: import("react-native").HrefAttrs | undefined;
-    lang?: string | undefined;
-    adjustsFontSizeToFit?: boolean | undefined;
-    dynamicTypeRamp?: "body" | "caption2" | "caption1" | "footnote" | "subheadline" | "callout" | "headline" | "title3" | "title2" | "title1" | "largeTitle" | undefined;
-    minimumFontScale?: number | undefined;
-    suppressHighlighting?: boolean | undefined;
-    lineBreakStrategyIOS?: "none" | "standard" | "hangul-word" | "push-out" | undefined;
-    disabled?: boolean | undefined;
-    selectable?: boolean | undefined;
-    selectionColor?: import("react-native").ColorValue | undefined;
-    textBreakStrategy?: "simple" | "highQuality" | "balanced" | undefined;
-    dataDetectorType?: "none" | "all" | "link" | "phoneNumber" | "email" | null | undefined;
-    android_hyphenationFrequency?: "normal" | "none" | "full" | undefined;
-    accessible?: boolean | undefined;
-    accessibilityActions?: readonly Readonly<{
-        name: string;
-        label?: string | undefined;
-    }>[] | undefined;
-    accessibilityLabel?: string | undefined;
-    "aria-label"?: string | undefined;
-    accessibilityRole?: import("react-native").AccessibilityRole | undefined;
-    accessibilityState?: import("react-native").AccessibilityState | undefined;
-    "aria-busy"?: boolean | undefined;
-    "aria-checked"?: boolean | "mixed" | undefined;
-    "aria-disabled"?: boolean | undefined;
-    "aria-expanded"?: boolean | undefined;
-    "aria-selected"?: boolean | undefined;
-    "aria-labelledby"?: string | undefined;
-    accessibilityHint?: string | undefined;
-    accessibilityValue?: import("react-native").AccessibilityValue | undefined;
-    "aria-valuemax"?: number | undefined;
-    "aria-valuemin"?: number | undefined;
-    "aria-valuenow"?: number | undefined;
-    "aria-valuetext"?: string | undefined;
-    onAccessibilityAction?: ((event: import("react-native").AccessibilityActionEvent) => void) | undefined;
-    importantForAccessibility?: "auto" | "yes" | "no" | "no-hide-descendants" | undefined;
-    "aria-hidden"?: boolean | undefined;
-    "aria-live"?: "polite" | "assertive" | "off" | undefined;
-    "aria-modal"?: boolean | undefined;
-    accessibilityLiveRegion?: "none" | "polite" | "assertive" | undefined;
-    accessibilityLabelledBy?: string | string[] | undefined;
-    accessibilityElementsHidden?: boolean | undefined;
-    accessibilityViewIsModal?: boolean | undefined;
-    onAccessibilityEscape?: (() => void) | undefined;
-    onAccessibilityTap?: (() => void) | undefined;
-    onMagicTap?: (() => void) | undefined;
-    accessibilityIgnoresInvertColors?: boolean | undefined;
-    accessibilityLanguage?: string | undefined;
-    tabIndex?: 0 | -1 | undefined;
-    "aria-activedescendant"?: string | undefined;
-    "aria-atomic"?: boolean | undefined;
-    "aria-autocomplete"?: string | undefined;
-    "aria-colcount"?: number | undefined;
-    "aria-colindex"?: number | undefined;
-    "aria-colspan"?: number | undefined;
-    "aria-controls"?: string | undefined;
-    "aria-current"?: boolean | "time" | "page" | "step" | "location" | "date" | undefined;
-    "aria-describedby"?: string | undefined;
-    "aria-details"?: string | undefined;
-    "aria-errormessage"?: string | undefined;
-    "aria-flowto"?: string | undefined;
-    "aria-haspopup"?: string | undefined;
-    "aria-invalid"?: boolean | undefined;
-    "aria-keyshortcuts"?: string | undefined;
-    "aria-level"?: number | undefined;
-    "aria-multiline"?: boolean | undefined;
-    "aria-multiselectable"?: boolean | undefined;
-    "aria-orientation"?: "horizontal" | "vertical" | undefined;
-    "aria-owns"?: string | undefined;
-    "aria-placeholder"?: string | undefined;
-    "aria-posinset"?: number | undefined;
-    "aria-pressed"?: boolean | undefined;
-    "aria-readonly"?: boolean | undefined;
-    "aria-required"?: boolean | undefined;
-    "aria-roledescription"?: string | undefined;
-    "aria-rowcount"?: number | undefined;
-    "aria-rowindex"?: number | undefined;
-    "aria-rowspan"?: number | undefined;
-    "aria-setsize"?: number | undefined;
-    "aria-sort"?: "none" | "ascending" | "descending" | "other" | undefined;
-} & {
-    level: 1 | 2 | 3 | 4 | 5 | 6;
-    align?: "left" | "right" | "center" | undefined;
-    size: HeadingSize;
-    children: ReactNode;
-} & import("react").RefAttributes<Text>>;
-export {};

package/src/components/Heading.js

@@ -1,27 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { forwardRef } from "react";
-import { StyleSheet, Text } from "react-native";
-import { colors } from "../constants/colors";
-import { typography } from "../constants/typography";
-const baseStyle = {
-    ...typography.interFont,
-    color: colors.gray[100],
-    fontWeight: typography.fontWeights.demi,
-    lineHeight: typography.lineHeights.title,
-};
-/* eslint-disable react-native/no-unused-styles */
-const alignments = StyleSheet.create({
-    center: { textAlign: "center" },
-    left: { textAlign: "left" },
-    right: { textAlign: "right" },
-});
-const sizes = StyleSheet.create({
-    40: { ...baseStyle, fontSize: 40 },
-    32: { ...baseStyle, fontSize: 32 },
-    28: { ...baseStyle, fontSize: 28 },
-    24: { ...baseStyle, fontSize: 24 },
-    20: { ...baseStyle, fontSize: 20 },
-    16: { ...baseStyle, fontSize: 16 },
-    /* eslint-enable react-native/no-unused-styles */
-});
-export const Heading = forwardRef(({ children, align = "left", size, level, style, ...props }, forwardedRef) => (_jsx(Text, { ref: forwardedRef, role: "heading", "aria-level": level, style: [sizes[size], alignments[align], style], ...props, children: children })));

package/src/components/Input.d.ts

@@ -1,34 +0,0 @@
-import { ChangeEventHandler, ReactNode } from "react";
-import { NativeSyntheticEvent, StyleProp, TextInput, TextInputProps, TextStyle, ViewStyle, WebRole } from "react-native";
-import { IconName } from "./Icon";
-type Props = {
-    ariaControls?: string;
-    ariaExpanded?: boolean;
-    disabled?: boolean;
-    error?: string;
-    icon?: IconName;
-    inputContainerStyle?: StyleProp<ViewStyle>;
-    role?: WebRole;
-    inputMode?: TextInputProps["inputMode"];
-    enterKeyHint?: TextInputProps["enterKeyHint"];
-    maxLength?: number;
-    label?: string;
-    onFocus?: (event: NativeSyntheticEvent<React.FocusEvent>) => void;
-    onBlur?: (event: NativeSyntheticEvent<React.FocusEvent>) => void;
-    onSubmitEditing?: TextInputProps["onSubmitEditing"];
-    onChange?: ChangeEventHandler<HTMLInputElement>;
-    onValueChange?: TextInputProps["onChangeText"];
-    onKeyPress?: TextInputProps["onKeyPress"];
-    placeholder?: string;
-    readOnly?: boolean;
-    size?: "large" | "small";
-    successful?: boolean;
-    suffix?: string;
-    value?: string;
-    style?: StyleProp<ViewStyle>;
-    inputStyle?: StyleProp<TextStyle>;
-    RightComponent?: ReactNode;
-    hideErrorMessage?: boolean;
-};
-export declare const Input: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<TextInput>>>;
-export {};

package/src/components/Input.js

@@ -1,110 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, memo, useId, useRef } from "react";
-import { StyleSheet, Text, View, } from "react-native";
-import { colors } from "../constants/colors";
-import { commonStyles } from "../constants/commonStyles";
-import { shadows } from "../constants/design";
-import { typography } from "../constants/typography";
-import { useMergeRefs } from "../hooks/useMergeRefs";
-import { isNotNullish } from "../utils/nullish";
-import { Box } from "./Box";
-import { Icon } from "./Icon";
-import { InputError } from "./InputError";
-import { Label } from "./Label";
-import { PressableTextInput } from "./Pressable";
-import { Space } from "./Space";
-const styles = StyleSheet.create({
-    base: {
-        ...typography.bodyLarge,
-        lineHeight: typography.bodyLarge.fontSize,
-        backgroundColor: colors.white,
-        borderColor: colors.gray[10],
-        borderRadius: 4,
-        borderWidth: 1,
-        flexGrow: 1,
-        flexShrink: 1,
-        height: 48,
-        maxWidth: "100%",
-        outlineStyle: "none",
-        paddingHorizontal: 16,
-        placeholderTextColor: colors.gray[30],
-        textOverflow: "ellipsis",
-        transitionDuration: "150ms",
-        transitionProperty: "border-color, box-shadow",
-        whiteSpace: "nowrap",
-        wordBreak: "keep-all",
-    },
-    small: {
-        height: 40,
-    },
-    focused: {
-        borderColor: colors.gray[20],
-        boxShadow: shadows.tile,
-    },
-    disabled: {
-        backgroundColor: colors.gray[3],
-        borderColor: colors.gray[3],
-        cursor: "not-allowed",
-    },
-    hovered: {
-        boxShadow: shadows.tile,
-    },
-    leftIcon: {
-        position: "absolute",
-        left: 16,
-    },
-    withLeftIcon: {
-        paddingLeft: 48,
-    },
-    withSuffix: {
-        borderBottomRightRadius: 0,
-        borderTopRightRadius: 0,
-    },
-    rightIcon: {
-        position: "absolute",
-        right: 16,
-    },
-    errored: {
-        borderColor: colors.red[100],
-        paddingRight: 48,
-    },
-    successful: {
-        borderColor: colors.green[100],
-        paddingRight: 48,
-    },
-    suffix: {
-        alignItems: "center",
-        backgroundColor: colors.gray[3],
-        borderBottomRightRadius: 4,
-        borderTopRightRadius: 4,
-        borderColor: colors.gray[10],
-        borderLeftWidth: 0,
-        borderWidth: 1,
-        justifyContent: "center",
-        paddingHorizontal: 16,
-    },
-    suffixDisabled: {
-        borderWidth: 0,
-    },
-    suffixText: {
-        ...typography.bodyLarge,
-    },
-});
-export const Input = memo(forwardRef(({ ariaControls, ariaExpanded, disabled = false, error, icon, inputContainerStyle, role, inputMode, enterKeyHint, maxLength, label = "", onFocus, onBlur, onSubmitEditing, onChange, onValueChange, onKeyPress, placeholder, readOnly = false, size = "large", successful = false, suffix = "", value = "", style, inputStyle, RightComponent = null, hideErrorMessage = false, }, forwardedRef) => {
-    const ref = useRef(null);
-    const mergedRef = useMergeRefs(ref, forwardedRef);
-    const labelId = `label-${useId()}`;
-    const id = `input-${useId()}`;
-    const errored = isNotNullish(error);
-    return (_jsxs(View, { style: style, children: [label !== "" && (_jsxs(_Fragment, { children: [_jsx(Label, { id: labelId, htmlFor: id, children: label }), _jsx(Space, { height: 8 })] })), _jsxs(Box, { direction: "row", style: inputContainerStyle, children: [_jsxs(Box, { direction: "row", alignItems: "center", style: commonStyles.fill, children: [_jsx(PressableTextInput, { ref: mergedRef, "aria-controls": ariaControls, "aria-expanded": ariaExpanded, "aria-labelledby": labelId, id: id, allowFontScaling: false, autoComplete: "off", role: role, readOnly: readOnly || disabled, inputMode: inputMode, enterKeyHint: enterKeyHint, multiline: false, rows: 1, maxLength: maxLength, onFocus: onFocus, onBlur: onBlur, onChange: onChange, onChangeText: onValueChange, onSubmitEditing: onSubmitEditing, onKeyPress: onKeyPress, placeholder: placeholder, value: value, style: ({ hovered, focused }) => [
-                                    styles.base,
-                                    size === "small" && styles.small,
-                                    isNotNullish(icon) && styles.withLeftIcon,
-                                    suffix !== "" && styles.withSuffix,
-                                    disabled ? styles.disabled : focused ? styles.focused : hovered && styles.hovered,
-                                    errored && styles.errored,
-                                    successful && styles.successful,
-                                    inputStyle,
-                                ] }), icon && (_jsx(Icon, { name: icon, color: colors.gray[50], size: 20, style: styles.leftIcon })), successful ? (_jsx(Icon, { name: "checkmark-filled", color: colors.green[100], size: 20, style: styles.rightIcon })) : errored ? (_jsx(Icon, { name: "error-circle-regular", size: 20, color: colors.red[100], style: styles.rightIcon })) : null] }), suffix !== "" && (_jsx(View, { style: [styles.suffix, disabled && styles.suffixDisabled], children: _jsx(Text, { numberOfLines: 1, style: styles.suffixText, children: suffix }) })), Boolean(RightComponent) && (_jsxs(_Fragment, { children: [_jsx(Space, { width: 8 }), RightComponent] }))] }), !hideErrorMessage && _jsx(InputError, { message: error })] }));
-}));
-Input.displayName = "Input";

package/src/components/Label.d.ts

@@ -1,10 +0,0 @@
-import { ReactNode } from "react";
-import { TextProps } from "react-native";
-import { Except } from "type-fest";
-type Props = Except<TextProps, "role"> & {
-    children?: ReactNode;
-    htmlFor?: string;
-    id?: string;
-};
-export declare const Label: ({ htmlFor, id, style, ...props }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/src/components/Label.js

@@ -1,19 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useRef } from "react";
-import { StyleSheet, Text } from "react-native";
-import { colors } from "../constants/colors";
-import { typography } from "../constants/typography";
-import { useNativeProp } from "../hooks/useNativeProp";
-const styles = StyleSheet.create({
-    base: {
-        ...typography.bodyLarge,
-        color: colors.gray[60],
-        lineHeight: typography.lineHeights.title,
-        paddingHorizontal: 3, // borderRadius / 2
-    },
-});
-export const Label = ({ htmlFor, id, style, ...props }) => {
-    const ref = useRef(null);
-    useNativeProp(ref, "for", htmlFor);
-    return _jsx(Text, { ref: ref, id: id, role: "label", style: [styles.base, style], ...props });
-};

package/src/components/Modal.d.ts

@@ -1,12 +0,0 @@
-import { ReactNode, ReactText } from "react";
-import { Modal as BaseModal, StyleProp, ViewStyle } from "react-native";
-type Props = {
-    children?: ReactNode;
-    onDismiss?: () => void;
-    title?: ReactText;
-    style?: StyleProp<ViewStyle>;
-    visible?: boolean;
-    wrapContent?: boolean;
-};
-export declare const Modal: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<BaseModal>>>;
-export {};

package/src/components/Modal.js

@@ -1,90 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { forwardRef, memo } from "react";
-import { Modal as BaseModal, Pressable, ScrollView, StyleSheet, View, } from "react-native";
-import { backgroundColor, colors, radii } from "../constants/design";
-import { useResponsive } from "../hooks/useResponsive";
-import { Box } from "./Box";
-import { Fill } from "./Fill";
-import { Heading } from "./Heading";
-import { Icon } from "./Icon";
-import { Separator } from "./Separator";
-const styles = StyleSheet.create({
-    // eslint-disable-next-line react-native/no-color-literals
-    blanket: {
-        ...StyleSheet.absoluteFillObject,
-        backgroundColor: "rgba(0,0,0,0.5)",
-        cursor: "default",
-        flexGrow: 1,
-        flexShrink: 1,
-    },
-    outbox: {
-        margin: 16,
-        pointerEvents: "box-none",
-        flexGrow: 1,
-        flexShrink: 1,
-    },
-    desktopOutbox: {
-        margin: 32,
-    },
-    modal: {
-        backgroundColor: backgroundColor.accented,
-        borderRadius: radii[8],
-        flexGrow: 1,
-        flexShrink: 1,
-        overflow: "hidden",
-    },
-    wrapped: {
-        flexGrow: 0,
-        margin: "auto",
-    },
-    desktopModal: {
-        flexGrow: 0,
-        margin: "auto",
-        width: 800,
-        maxWidth: "100%",
-    },
-    content: {
-        minHeight: "100%",
-        padding: 20,
-    },
-    contentDesktop: {
-        padding: 40,
-    },
-    title: {
-        flexGrow: 1,
-        flexShrink: 1,
-        paddingLeft: 20,
-        paddingVertical: 20,
-    },
-    titleHeader: {
-        paddingLeft: 40,
-        paddingVertical: 32,
-    },
-    dismissButton: {
-        padding: 20,
-        right: 0,
-        transitionProperty: "opacity",
-        transitionDuration: "150ms",
-    },
-    dismissButtonPressed: {
-        opacity: 0.5,
-    },
-    dismissButtonDesktop: {
-        marginVertical: 12,
-        marginRight: 20,
-    },
-});
-export const Modal = memo(forwardRef(({ children, onDismiss, title = "", style, visible = false, wrapContent = false }, forwardedRef) => {
-    const { desktop, media } = useResponsive();
-    return (_jsxs(BaseModal, { ref: forwardedRef, animationType: "fade", visible: visible, transparent: true, onDismiss: onDismiss, onRequestClose: onDismiss, children: [_jsx(Pressable, { role: "none", tabIndex: -1, onPress: onDismiss, style: styles.blanket }), _jsx(View, { style: [styles.outbox, desktop && styles.desktopOutbox], children: _jsxs(View, { style: [
-                        styles.modal,
-                        desktop && styles.desktopModal,
-                        wrapContent && styles.wrapped,
-                        style,
-                    ], children: [_jsxs(Box, { direction: "row", role: "banner", alignItems: "center", children: [title !== "" ? (_jsx(Heading, { size: media({ mobile: 20, desktop: 24 }), level: 2, style: [styles.title, desktop && styles.titleHeader], children: title })) : (_jsx(Fill, {})), onDismiss && (_jsx(Pressable, { role: "button", onPress: onDismiss, style: ({ pressed }) => [
-                                        styles.dismissButton,
-                                        desktop && styles.dismissButtonDesktop,
-                                        pressed && styles.dismissButtonPressed,
-                                    ], children: _jsx(Icon, { name: "dismiss-filled", size: 18, color: colors.gray[500] }) }))] }), title !== "" && _jsx(Separator, {}), _jsx(ScrollView, { contentContainerStyle: desktop ? styles.contentDesktop : styles.content, children: children })] }) })] }));
-}));
-Modal.displayName = "Modal";

package/src/components/Slider.d.ts

@@ -1,11 +0,0 @@
-/// <reference types="react" />
-type Props = {
-    value: number;
-    step: number;
-    minimum: number;
-    maximum: number;
-    disabled?: boolean;
-    onValueChange?: (value: number) => void;
-};
-export declare const Slider: import("react").MemoExoticComponent<({ value, step, minimum, maximum, disabled, onValueChange }: Props) => import("react/jsx-runtime").JSX.Element>;
-export {};

package/src/components/Slider.js

@@ -1,136 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useEffect, useRef } from "react";
-import { PanResponder, StyleSheet, View } from "react-native";
-import { match } from "ts-pattern";
-import { colors } from "../constants/colors";
-import { useAnimatedValue } from "../hooks/useAnimatedValue";
-import { interpolate } from "../utils/math";
-const BUTTON_SIZE = 20;
-const styles = StyleSheet.create({
-    container: {
-        height: BUTTON_SIZE,
-    },
-    disabled: {
-        cursor: "not-allowed",
-        opacity: 0.5,
-    },
-    bar: {
-        ...StyleSheet.absoluteFillObject,
-        height: 4,
-        marginVertical: "auto",
-        borderRadius: 2,
-        backgroundColor: colors.gray[10],
-        overflow: "hidden",
-    },
-    barFill: {
-        ...StyleSheet.absoluteFillObject,
-        transformOrigin: "0 0",
-        backgroundColor: colors.gray[100],
-    },
-    button: {
-        position: "absolute",
-        height: BUTTON_SIZE,
-        width: BUTTON_SIZE,
-        backgroundColor: colors.gray[100],
-        borderRadius: BUTTON_SIZE / 2,
-        marginLeft: -(BUTTON_SIZE / 2),
-        willChange: "left", // because we animate left directly
-    },
-});
-const computeValue = ({ minimum, maximum, step, origin, position, width, }) => {
-    const value = interpolate({
-        inputRange: [0, width],
-        outputRange: [minimum, maximum],
-        clamp: true,
-    })(position - origin);
-    // round value based on step size
-    return Math.round(value / step) * step;
-};
-export const Slider = memo(({ value, step, minimum, maximum, disabled = false, onValueChange }) => {
-    const disabledRef = useRef(disabled);
-    const interacting = useRef(false);
-    const left = useRef(0);
-    const width = useRef(0);
-    const animation = useAnimatedValue(value);
-    const barRef = useRef(null);
-    const buttonRef = useRef(null);
-    useEffect(() => {
-        const interpolateValue = interpolate({
-            inputRange: [minimum, maximum],
-            clamp: true,
-            outputRange: [0, 100],
-        });
-        const id = animation.addListener(({ value }) => {
-            const interpolated = interpolateValue(value);
-            if (barRef.current instanceof HTMLElement) {
-                barRef.current.style.transform = `scaleX(${interpolated})`;
-            }
-            if (buttonRef.current instanceof HTMLElement) {
-                buttonRef.current.style.left = `${interpolated}%`;
-            }
-        });
-        return () => {
-            animation.removeListener(id);
-        };
-    }, [animation, minimum, maximum]);
-    // Update position on value change
-    useEffect(() => {
-        !interacting.current && animation.setValue(value);
-    }, [animation, value]);
-    // Update disabled ref for pan responder
-    useEffect(() => {
-        disabledRef.current = disabled;
-    }, [disabled]);
-    const handleLayout = ({ nativeEvent: { layout } }) => {
-        var _a;
-        left.current = (_a = layout.left) !== null && _a !== void 0 ? _a : 0;
-        width.current = layout.width;
-    };
-    const handleKeyDown = ({ nativeEvent }) => {
-        if (!onValueChange || disabled) {
-            return;
-        }
-        match(nativeEvent.key)
-            .with("ArrowUp", "ArrowRight", () => onValueChange(Math.min(value + step, maximum)))
-            .with("ArrowDown", "ArrowLeft", () => onValueChange(Math.max(value - step, minimum)))
-            .otherwise(() => { });
-    };
-    const panResponder = useRef(PanResponder.create({
-        onMoveShouldSetPanResponder: () => true,
-        onPanResponderGrant: () => {
-            interacting.current = true;
-            document.body.style.userSelect = "none";
-        },
-        onPanResponderMove: event => {
-            if (onValueChange && !disabledRef.current) {
-                const nextValue = computeValue({
-                    minimum,
-                    maximum,
-                    step,
-                    position: event.nativeEvent.pageX,
-                    origin: left.current,
-                    width: width.current,
-                });
-                onValueChange(nextValue);
-                animation.setValue(nextValue);
-            }
-        },
-        onPanResponderRelease: event => {
-            interacting.current = false;
-            document.body.style.userSelect = "";
-            if (onValueChange && !disabledRef.current) {
-                const nextValue = computeValue({
-                    minimum,
-                    maximum,
-                    step,
-                    position: event.nativeEvent.pageX,
-                    origin: left.current,
-                    width: width.current,
-                });
-                onValueChange(nextValue);
-                animation.setValue(nextValue);
-            }
-        },
-    })).current;
-    return (_jsxs(View, { tabIndex: disabled ? -1 : 0, style: [styles.container, disabled && styles.disabled], onLayout: handleLayout, onKeyDown: handleKeyDown, ...panResponder.panHandlers, children: [_jsx(View, { style: styles.bar, children: _jsx(View, { ref: barRef, style: styles.barFill }) }), _jsx(View, { ref: buttonRef, style: styles.button })] }));
-});

package/src/components/SuccessIcon.d.ts

@@ -1,7 +0,0 @@
-import { StyleProp, ViewStyle } from "react-native";
-type Props = {
-    size: number;
-    style?: StyleProp<ViewStyle>;
-};
-export declare const SuccessIcon: ({ size, style }: Props) => import("react/jsx-runtime").JSX.Element;
-export {};

package/src/components/SuccessIcon.js

@@ -1,4 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { colors } from "../constants/colors";
-import { Path, Svg } from "./Svg";
-export const SuccessIcon = ({ size, style }) => (_jsx(Svg, { viewBox: "0 0 24 24", style: [{ height: size, width: size }, style], children: _jsx(Path, { d: "M12 2a10 10 0 110 20 10 10 0 010-20zm3.22 6.97l-4.47 4.47-1.97-1.97a.75.75 0 00-1.06 1.06l2.5 2.5c.3.3.77.3 1.06 0l5-5a.75.75 0 10-1.06-1.06z", fill: colors.green[100] }) }));

package/src/components/Tooltip.d.ts

@@ -1,18 +0,0 @@
-import { ReactNode, RefObject } from "react";
-type Props = {
-    children: ReactNode;
-    describedBy?: string;
-    matchReferenceWidth?: boolean;
-    onHide?: () => void;
-    onShow?: () => void;
-    placement: "top" | "bottom";
-    referenceRef: RefObject<unknown>;
-    width?: number;
-    togglableOnFocus?: boolean;
-};
-export type TooltipRef = {
-    show: () => void;
-    hide: () => void;
-};
-export declare const Tooltip: import("react").MemoExoticComponent<import("react").ForwardRefExoticComponent<Props & import("react").RefAttributes<TooltipRef>>>;
-export {};