@retray-dev/ui-kit 6.2.0 → 7.0.1

package/dist/chunk-DITNP6PL.mjs

@@ -0,0 +1,106 @@
+import { selectionAsync } from './chunk-RTC3CFXF.mjs';
+import { SPRINGS, EASINGS, TIMINGS } from './chunk-5IKW3VNC.mjs';
+import { useTheme } from './chunk-SOYNZDVY.mjs';
+import { s } from './chunk-2CE3TQVY.mjs';
+import React, { useEffect } from 'react';
+import { StyleSheet, View, TouchableOpacity } from 'react-native';
+import Animated, { useSharedValue, withSpring, useAnimatedStyle, interpolateColor, withTiming } from 'react-native-reanimated';
+import { Feather } from '@expo/vector-icons';
+
+var TRACK_WIDTH = s(52);
+var TRACK_HEIGHT = s(30);
+var THUMB_SIZE = s(24);
+var THUMB_OFFSET = s(3);
+var THUMB_TRAVEL = TRACK_WIDTH - THUMB_SIZE - THUMB_OFFSET * 2;
+var ICON_SIZE = s(13);
+function Switch({ checked = false, onCheckedChange, disabled, style, accessibilityLabel }) {
+  const { colors } = useTheme();
+  const progress = useSharedValue(checked ? 1 : 0);
+  useEffect(() => {
+    progress.value = withSpring(checked ? 1 : 0, SPRINGS.elastic);
+  }, [checked, progress]);
+  const thumbStyle = useAnimatedStyle(() => ({
+    transform: [{ translateX: progress.value * THUMB_TRAVEL }]
+  }));
+  const trackStyle = useAnimatedStyle(() => ({
+    backgroundColor: interpolateColor(
+      progress.value,
+      [0, 1],
+      [colors.surfaceStrong, colors.primary]
+    )
+  }));
+  const trackBorderStyle = useAnimatedStyle(() => ({
+    borderWidth: 1.5,
+    borderColor: interpolateColor(
+      progress.value,
+      [0, 1],
+      [colors.border, "transparent"]
+    )
+  }));
+  const checkIconStyle = useAnimatedStyle(() => ({
+    opacity: withTiming(checked ? 1 : 0, { duration: TIMINGS.state.duration, easing: EASINGS.standard })
+  }));
+  const crossIconStyle = useAnimatedStyle(() => ({
+    opacity: withTiming(checked ? 0 : 1, { duration: TIMINGS.state.duration, easing: EASINGS.standard })
+  }));
+  return /* @__PURE__ */ React.createElement(View, { style: [{ opacity: disabled ? 0.45 : 1, alignSelf: "flex-start" }, style] }, /* @__PURE__ */ React.createElement(
+    TouchableOpacity,
+    {
+      onPress: () => {
+        selectionAsync();
+        onCheckedChange?.(!checked);
+      },
+      disabled,
+      activeOpacity: 0.8,
+      touchSoundDisabled: true,
+      accessibilityRole: "switch",
+      accessibilityLabel,
+      accessibilityState: { checked, disabled: !!disabled },
+      style: styles.touchable
+    },
+    /* @__PURE__ */ React.createElement(Animated.View, { style: [styles.track, trackStyle] }, /* @__PURE__ */ React.createElement(Animated.View, { style: [styles.trackBorder, trackBorderStyle], pointerEvents: "none" }), /* @__PURE__ */ React.createElement(
+      Animated.View,
+      {
+        style: [styles.thumb, { backgroundColor: colors.primaryForeground }, thumbStyle]
+      },
+      /* @__PURE__ */ React.createElement(Animated.View, { style: [styles.iconWrapper, checkIconStyle] }, /* @__PURE__ */ React.createElement(Feather, { name: "check", size: ICON_SIZE, color: colors.primary })),
+      /* @__PURE__ */ React.createElement(Animated.View, { style: [styles.iconWrapper, crossIconStyle] }, /* @__PURE__ */ React.createElement(Feather, { name: "x", size: ICON_SIZE, color: colors.foregroundMuted }))
+    ))
+  ));
+}
+var styles = StyleSheet.create({
+  touchable: {
+    alignSelf: "flex-start"
+  },
+  track: {
+    width: TRACK_WIDTH,
+    height: TRACK_HEIGHT,
+    borderRadius: TRACK_HEIGHT / 2
+  },
+  trackBorder: {
+    ...StyleSheet.absoluteFillObject,
+    borderRadius: TRACK_HEIGHT / 2
+  },
+  thumb: {
+    position: "absolute",
+    top: THUMB_OFFSET,
+    left: THUMB_OFFSET,
+    width: THUMB_SIZE,
+    height: THUMB_SIZE,
+    borderRadius: THUMB_SIZE / 2,
+    shadowColor: "#000",
+    shadowOffset: { width: 0, height: 1 },
+    shadowOpacity: 0.15,
+    shadowRadius: 2,
+    elevation: 2,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  iconWrapper: {
+    position: "absolute",
+    alignItems: "center",
+    justifyContent: "center"
+  }
+});
+
+export { Switch };

package/dist/chunk-FTLJOUOQ.mjs

@@ -0,0 +1,97 @@
+import { useColorTransition } from './chunk-7H2OR44A.mjs';
+import { usePressScale } from './chunk-QCNARS3X.mjs';
+import { selectionAsync } from './chunk-RTC3CFXF.mjs';
+import { PRESS_SCALE, EASINGS, TIMINGS } from './chunk-5IKW3VNC.mjs';
+import { useTheme } from './chunk-SOYNZDVY.mjs';
+import { mvs, ms, vs, s } from './chunk-2CE3TQVY.mjs';
+import React from 'react';
+import { StyleSheet, TouchableOpacity, View, Text } from 'react-native';
+import Animated, { useAnimatedStyle, interpolateColor, withTiming } from 'react-native-reanimated';
+
+function Checkbox({
+  checked = false,
+  onCheckedChange,
+  label,
+  disabled,
+  style,
+  accessibilityLabel
+}) {
+  const { colors } = useTheme();
+  const { animatedStyle: scaleStyle, onPressIn, onPressOut } = usePressScale({
+    pressScale: PRESS_SCALE.button,
+    disabled
+  });
+  const progress = useColorTransition(checked);
+  const boxStyle = useAnimatedStyle(() => ({
+    borderColor: interpolateColor(progress.value, [0, 1], [colors.border, colors.primary]),
+    backgroundColor: interpolateColor(progress.value, [0, 1], ["transparent", colors.primary])
+  }));
+  const checkStyle = useAnimatedStyle(() => ({
+    opacity: withTiming(checked ? 1 : 0, { duration: TIMINGS.state.duration, easing: EASINGS.standard })
+  }));
+  return (
+    // AUDIT FIX: opacity was applied only to the box, leaving the label at full
+    // opacity when disabled — a contradictory visual signal. Now the entire row
+    // dims uniformly so label and control communicate the same disabled state.
+    /* @__PURE__ */ React.createElement(
+      TouchableOpacity,
+      {
+        style: [styles.row, disabled && styles.rowDisabled, style],
+        onPress: () => {
+          selectionAsync();
+          onCheckedChange?.(!checked);
+        },
+        onPressIn,
+        onPressOut,
+        disabled,
+        activeOpacity: 1,
+        touchSoundDisabled: true,
+        accessibilityRole: "checkbox",
+        accessibilityLabel: accessibilityLabel ?? label,
+        accessibilityState: { checked, disabled: !!disabled }
+      },
+      /* @__PURE__ */ React.createElement(Animated.View, { style: scaleStyle }, /* @__PURE__ */ React.createElement(Animated.View, { style: [styles.box, boxStyle] }, /* @__PURE__ */ React.createElement(Animated.View, { style: checkStyle }, /* @__PURE__ */ React.createElement(View, { style: [styles.checkmark, { borderColor: colors.primaryForeground }] })))),
+      label ? /* @__PURE__ */ React.createElement(
+        Text,
+        {
+          style: [styles.label, { color: colors.foreground }],
+          allowFontScaling: true
+        },
+        label
+      ) : null
+    )
+  );
+}
+var styles = StyleSheet.create({
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: s(12)
+  },
+  // AUDIT FIX: was inline opacity on the box only
+  rowDisabled: {
+    opacity: 0.45
+  },
+  box: {
+    width: s(24),
+    height: s(24),
+    borderRadius: ms(4),
+    borderWidth: 1.5,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  checkmark: {
+    width: s(12),
+    height: vs(7),
+    borderLeftWidth: 2,
+    borderBottomWidth: 2,
+    transform: [{ rotate: "-45deg" }, { translateY: -1 }]
+  },
+  label: {
+    fontFamily: "Sohne-Regular",
+    fontSize: ms(14),
+    lineHeight: mvs(20)
+  }
+});
+
+export { Checkbox };

package/dist/chunk-GCWOGZYL.mjs

@@ -0,0 +1,104 @@
+import { useTheme } from './chunk-SOYNZDVY.mjs';
+import { s, ms } from './chunk-2CE3TQVY.mjs';
+import React, { useState } from 'react';
+import { StyleSheet, View, Image, Text } from 'react-native';
+
+var sizeMap = {
+  sm: s(28),
+  md: s(40),
+  lg: s(56),
+  xl: s(72)
+};
+var fontSizeMap = {
+  sm: ms(12),
+  md: ms(16),
+  lg: ms(22),
+  xl: ms(28)
+};
+var statusSizeMap = {
+  sm: 8,
+  md: 10,
+  lg: 13,
+  xl: 16
+};
+function getInitials(fallback, fallbackText) {
+  if (fallback) return fallback.slice(0, 2).toUpperCase();
+  if (fallbackText) {
+    const words = fallbackText.trim().split(/\s+/);
+    if (words.length === 1) return words[0].slice(0, 2).toUpperCase();
+    return (words[0][0] + words[words.length - 1][0]).toUpperCase();
+  }
+  return "?";
+}
+function AvatarBase({ src, fallback, fallbackText, size = "md", status, style }) {
+  const { colors } = useTheme();
+  const [imageError, setImageError] = useState(false);
+  const dimension = typeof size === "number" ? size : sizeMap[size];
+  const fontSize = typeof size === "number" ? size * 0.38 : fontSizeMap[size];
+  const showFallback = !src || imageError;
+  const statusSize = typeof size === "number" ? size * 0.25 : statusSizeMap[size];
+  const statusColor = {
+    online: "#22c55e",
+    offline: "transparent",
+    busy: colors.destructive,
+    away: colors.warning
+  };
+  const containerStyle = {
+    width: dimension,
+    height: dimension,
+    borderRadius: dimension / 2,
+    backgroundColor: colors.surface,
+    overflow: "hidden"
+  };
+  return /* @__PURE__ */ React.createElement(View, { style: [styles.wrapper, style] }, /* @__PURE__ */ React.createElement(View, { style: [styles.base, containerStyle] }, !showFallback ? /* @__PURE__ */ React.createElement(
+    Image,
+    {
+      source: { uri: src },
+      style: { width: dimension, height: dimension },
+      onError: () => setImageError(true)
+    }
+  ) : /* @__PURE__ */ React.createElement(
+    Text,
+    {
+      style: [styles.fallback, { color: colors.foregroundMuted, fontSize }],
+      allowFontScaling: true
+    },
+    getInitials(fallback, fallbackText)
+  )), status && /* @__PURE__ */ React.createElement(
+    View,
+    {
+      style: [
+        styles.statusDot,
+        {
+          width: statusSize,
+          height: statusSize,
+          borderRadius: statusSize / 2,
+          backgroundColor: statusColor[status],
+          borderWidth: status === "offline" ? 2 : 1.5,
+          borderColor: status === "offline" ? colors.border : colors.background
+        }
+      ]
+    }
+  ));
+}
+var Avatar = React.memo(AvatarBase);
+var styles = StyleSheet.create({
+  wrapper: {
+    alignSelf: "flex-start",
+    position: "relative"
+  },
+  base: {
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  fallback: {
+    fontFamily: "Sohne-Medium"
+  },
+  statusDot: {
+    position: "absolute",
+    bottom: 0,
+    right: 0
+  }
+});
+
+export { Avatar };

package/dist/chunk-GNGLDL6Z.mjs

@@ -0,0 +1,60 @@
+import { TYPOGRAPHY } from './chunk-QY3X2UYR.mjs';
+import { useTheme } from './chunk-SOYNZDVY.mjs';
+import { mvs, ms } from './chunk-2CE3TQVY.mjs';
+import React from 'react';
+import { Text as Text$1 } from 'react-native';
+
+var variantStyles = {
+  "display-hero": { ...TYPOGRAPHY["display-hero"], fontSize: ms(TYPOGRAPHY["display-hero"].fontSize), lineHeight: mvs(TYPOGRAPHY["display-hero"].lineHeight) },
+  "display-xl": { ...TYPOGRAPHY["display-xl"], fontSize: ms(TYPOGRAPHY["display-xl"].fontSize), lineHeight: mvs(TYPOGRAPHY["display-xl"].lineHeight) },
+  "display-lg": { ...TYPOGRAPHY["display-lg"], fontSize: ms(TYPOGRAPHY["display-lg"].fontSize), lineHeight: mvs(TYPOGRAPHY["display-lg"].lineHeight) },
+  "display-md": { ...TYPOGRAPHY["display-md"], fontSize: ms(TYPOGRAPHY["display-md"].fontSize), lineHeight: mvs(TYPOGRAPHY["display-md"].lineHeight) },
+  "display-sm": { ...TYPOGRAPHY["display-sm"], fontSize: ms(TYPOGRAPHY["display-sm"].fontSize), lineHeight: mvs(TYPOGRAPHY["display-sm"].lineHeight) },
+  "title-md": { ...TYPOGRAPHY["title-md"], fontSize: ms(TYPOGRAPHY["title-md"].fontSize), lineHeight: mvs(TYPOGRAPHY["title-md"].lineHeight) },
+  "title-sm": { ...TYPOGRAPHY["title-sm"], fontSize: ms(TYPOGRAPHY["title-sm"].fontSize), lineHeight: mvs(TYPOGRAPHY["title-sm"].lineHeight) },
+  "body-md": { ...TYPOGRAPHY["body-md"], fontSize: ms(TYPOGRAPHY["body-md"].fontSize), lineHeight: mvs(TYPOGRAPHY["body-md"].lineHeight) },
+  "body-sm": { ...TYPOGRAPHY["body-sm"], fontSize: ms(TYPOGRAPHY["body-sm"].fontSize), lineHeight: mvs(TYPOGRAPHY["body-sm"].lineHeight) },
+  caption: { ...TYPOGRAPHY["caption"], fontSize: ms(TYPOGRAPHY["caption"].fontSize), lineHeight: mvs(TYPOGRAPHY["caption"].lineHeight) },
+  "caption-sm": { ...TYPOGRAPHY["caption-sm"], fontSize: ms(TYPOGRAPHY["caption-sm"].fontSize), lineHeight: mvs(TYPOGRAPHY["caption-sm"].lineHeight) },
+  "badge-text": { ...TYPOGRAPHY["badge-text"], fontSize: ms(TYPOGRAPHY["badge-text"].fontSize), lineHeight: mvs(TYPOGRAPHY["badge-text"].lineHeight) },
+  "micro-label": { ...TYPOGRAPHY["micro-label"], fontSize: ms(TYPOGRAPHY["micro-label"].fontSize), lineHeight: mvs(TYPOGRAPHY["micro-label"].lineHeight) },
+  "uppercase-tag": { ...TYPOGRAPHY["uppercase-tag"], fontSize: ms(TYPOGRAPHY["uppercase-tag"].fontSize), lineHeight: mvs(TYPOGRAPHY["uppercase-tag"].lineHeight) },
+  "button-lg": { ...TYPOGRAPHY["button-lg"], fontSize: ms(TYPOGRAPHY["button-lg"].fontSize), lineHeight: mvs(TYPOGRAPHY["button-lg"].lineHeight) },
+  "button-sm": { ...TYPOGRAPHY["button-sm"], fontSize: ms(TYPOGRAPHY["button-sm"].fontSize), lineHeight: mvs(TYPOGRAPHY["button-sm"].lineHeight) }
+};
+var defaultColorVariant = {
+  "display-hero": "foreground",
+  "display-xl": "foreground",
+  "display-lg": "foreground",
+  "display-md": "foreground",
+  "display-sm": "foreground",
+  "title-md": "foreground",
+  "title-sm": "foreground",
+  "body-md": "foregroundSubtle",
+  // running text — slightly softer
+  "body-sm": "foregroundSubtle",
+  caption: "foregroundMuted",
+  "caption-sm": "foregroundMuted",
+  "badge-text": "foreground",
+  "micro-label": "foreground",
+  "uppercase-tag": "foregroundMuted",
+  "button-lg": "foreground",
+  "button-sm": "foreground"
+};
+function TextBase({ variant = "body-md", color, style, children, ...props }) {
+  const { colors } = useTheme();
+  const colorKey = defaultColorVariant[variant] ?? "foreground";
+  const resolvedColor = color ?? colors[colorKey];
+  return /* @__PURE__ */ React.createElement(
+    Text$1,
+    {
+      style: [variantStyles[variant], { color: resolvedColor }, style],
+      allowFontScaling: true,
+      ...props
+    },
+    children
+  );
+}
+var Text = React.memo(TextBase);
+
+export { Text };

package/dist/chunk-GPOUINK5.mjs

@@ -0,0 +1,148 @@
+import { renderIcon } from './chunk-T7XZ7H7Y.mjs';
+import { usePressScale } from './chunk-QCNARS3X.mjs';
+import { selectionAsync } from './chunk-RTC3CFXF.mjs';
+import { SPRINGS, PRESS_SCALE } from './chunk-5IKW3VNC.mjs';
+import { RADIUS } from './chunk-QY3X2UYR.mjs';
+import { useTheme } from './chunk-SOYNZDVY.mjs';
+import { vs, ms, s } from './chunk-2CE3TQVY.mjs';
+import React from 'react';
+import { StyleSheet, TouchableOpacity, View, Text } from 'react-native';
+import Animated from 'react-native-reanimated';
+import { Entypo } from '@expo/vector-icons';
+
+function MenuItemBase({
+  label,
+  subtitle,
+  iconName,
+  icon,
+  iconColor,
+  rightRender,
+  showChevron = true,
+  onPress,
+  disabled = false,
+  variant = "plain",
+  showSeparator = false,
+  style,
+  labelStyle,
+  accessibilityLabel
+}) {
+  const { colors } = useTheme();
+  const { animatedStyle, onPressIn, onPressOut, hoverHandlers } = usePressScale({
+    pressScale: PRESS_SCALE.row,
+    pressInSpring: SPRINGS.surfacePressIn,
+    pressOutSpring: SPRINGS.surfacePressOut,
+    disabled
+  });
+  const handlePress = () => {
+    selectionAsync();
+    onPress();
+  };
+  const resolvedIcon = iconName ? renderIcon(iconName, 22, iconColor ?? colors.foreground) : icon;
+  const cardStyle = variant === "card" ? {
+    backgroundColor: colors.card,
+    borderRadius: RADIUS.md,
+    borderWidth: 1,
+    borderColor: colors.border,
+    shadowColor: "#000",
+    shadowOffset: { width: 0, height: 2 },
+    shadowOpacity: 0.06,
+    shadowRadius: 6,
+    elevation: 2
+  } : {};
+  const a11yLabel = accessibilityLabel ?? (subtitle ? `${label}. ${subtitle}` : label);
+  return /* @__PURE__ */ React.createElement(Animated.View, { style: [animatedStyle, disabled && styles.disabled], ...hoverHandlers }, /* @__PURE__ */ React.createElement(
+    TouchableOpacity,
+    {
+      style: [styles.container, cardStyle, style],
+      onPress: handlePress,
+      onPressIn,
+      onPressOut,
+      disabled,
+      activeOpacity: 1,
+      touchSoundDisabled: true,
+      accessibilityRole: "button",
+      accessibilityLabel: a11yLabel,
+      accessibilityState: { disabled }
+    },
+    resolvedIcon ? /* @__PURE__ */ React.createElement(View, { style: styles.iconContainer }, resolvedIcon) : null,
+    /* @__PURE__ */ React.createElement(View, { style: styles.labelContainer }, /* @__PURE__ */ React.createElement(
+      Text,
+      {
+        style: [styles.label, { color: colors.foreground }, labelStyle],
+        numberOfLines: 1,
+        allowFontScaling: true
+      },
+      label
+    ), subtitle ? /* @__PURE__ */ React.createElement(
+      Text,
+      {
+        style: [styles.subtitle, { color: colors.foregroundMuted }],
+        numberOfLines: 1,
+        allowFontScaling: true
+      },
+      subtitle
+    ) : null),
+    rightRender !== void 0 ? /* @__PURE__ */ React.createElement(
+      View,
+      {
+        style: styles.rightContainer,
+        onStartShouldSetResponder: () => true,
+        onResponderRelease: () => {
+        }
+      },
+      rightRender
+    ) : showChevron ? /* @__PURE__ */ React.createElement(Entypo, { name: "chevron-right", size: 18, color: colors.foregroundMuted }) : null
+  ), showSeparator ? /* @__PURE__ */ React.createElement(
+    View,
+    {
+      style: [
+        styles.separator,
+        { backgroundColor: colors.separator }
+      ]
+    }
+  ) : null);
+}
+var MenuItem = React.memo(MenuItemBase);
+var styles = StyleSheet.create({
+  container: {
+    flexDirection: "row",
+    alignItems: "center",
+    paddingHorizontal: s(16),
+    paddingVertical: vs(16),
+    minHeight: vs(54),
+    gap: s(12)
+  },
+  iconContainer: {
+    width: s(22),
+    alignItems: "center",
+    justifyContent: "center",
+    flexShrink: 0
+  },
+  labelContainer: {
+    flex: 1,
+    justifyContent: "center"
+  },
+  label: {
+    fontFamily: "Sohne-Medium",
+    fontSize: ms(15)
+  },
+  subtitle: {
+    fontFamily: "Sohne-Regular",
+    fontSize: ms(12),
+    marginTop: vs(1)
+  },
+  rightContainer: {
+    alignItems: "flex-end",
+    justifyContent: "center",
+    flexShrink: 0
+  },
+  separator: {
+    height: StyleSheet.hairlineWidth,
+    marginRight: 0
+  },
+  disabled: {
+    opacity: 0.45
+  }
+});
+
+export { MenuItem };

package/dist/chunk-HSPSMN6U.mjs

@@ -0,0 +1,115 @@
+import { Button } from './chunk-CRYBX2CM.mjs';
+import { impactMedium, notificationSuccess, selectionAsync } from './chunk-RTC3CFXF.mjs';
+import { useTheme } from './chunk-SOYNZDVY.mjs';
+import { vs, mvs, ms, s } from './chunk-2CE3TQVY.mjs';
+import React, { useRef, useEffect } from 'react';
+import { StyleSheet, Text, View } from 'react-native';
+import { BottomSheetModal, BottomSheetView, BottomSheetBackdrop } from '@gorhom/bottom-sheet';
+import { Feather } from '@expo/vector-icons';
+
+function ConfirmDialog({
+  visible,
+  title,
+  description,
+  confirmLabel = "Confirm",
+  cancelLabel = "Cancel",
+  confirmVariant = "primary",
+  onConfirm,
+  onCancel
+}) {
+  const { colors } = useTheme();
+  const ref = useRef(null);
+  useEffect(() => {
+    if (visible) {
+      impactMedium();
+      ref.current?.present();
+    } else {
+      ref.current?.dismiss();
+    }
+  }, [visible]);
+  const renderBackdrop = (props) => /* @__PURE__ */ React.createElement(
+    BottomSheetBackdrop,
+    {
+      ...props,
+      disappearsOnIndex: -1,
+      appearsOnIndex: 0,
+      pressBehavior: "close"
+    }
+  );
+  return /* @__PURE__ */ React.createElement(
+    BottomSheetModal,
+    {
+      ref,
+      enableDynamicSizing: true,
+      onDismiss: onCancel,
+      backdropComponent: renderBackdrop,
+      backgroundStyle: [styles.background, { backgroundColor: colors.card }],
+      handleIndicatorStyle: [styles.handle, { backgroundColor: colors.border }],
+      enablePanDownToClose: true
+    },
+    /* @__PURE__ */ React.createElement(BottomSheetView, { style: styles.content }, /* @__PURE__ */ React.createElement(Text, { style: [styles.title, { color: colors.foreground }], allowFontScaling: true }, title), description ? /* @__PURE__ */ React.createElement(Text, { style: [styles.description, { color: colors.foregroundMuted }], allowFontScaling: true }, description) : null, /* @__PURE__ */ React.createElement(View, { style: styles.actions }, /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        label: confirmLabel,
+        variant: confirmVariant,
+        fullWidth: true,
+        onPress: () => {
+          notificationSuccess();
+          onConfirm();
+        },
+        icon: /* @__PURE__ */ React.createElement(
+          Feather,
+          {
+            name: confirmVariant === "destructive" ? "trash-2" : "check",
+            size: 15,
+            color: confirmVariant === "destructive" ? colors.destructiveForeground : colors.primaryForeground
+          }
+        )
+      }
+    ), /* @__PURE__ */ React.createElement(
+      Button,
+      {
+        label: cancelLabel,
+        variant: "secondary",
+        fullWidth: true,
+        onPress: () => {
+          selectionAsync();
+          onCancel();
+        },
+        icon: /* @__PURE__ */ React.createElement(Feather, { name: "x", size: 15, color: colors.foreground })
+      }
+    )))
+  );
+}
+var styles = StyleSheet.create({
+  background: {
+    borderTopLeftRadius: ms(16),
+    borderTopRightRadius: ms(16)
+  },
+  handle: {
+    width: s(36),
+    height: vs(4),
+    borderRadius: ms(2)
+  },
+  content: {
+    paddingHorizontal: s(24),
+    paddingBottom: vs(32),
+    gap: vs(12)
+  },
+  title: {
+    fontFamily: "Sohne-SemiBold",
+    fontSize: ms(18),
+    lineHeight: mvs(26)
+  },
+  description: {
+    fontFamily: "Sohne-Regular",
+    fontSize: ms(15),
+    lineHeight: mvs(22)
+  },
+  actions: {
+    gap: vs(10),
+    marginTop: vs(8)
+  }
+});
+
+export { ConfirmDialog };