react-native-system-ui 1.0.2 → 1.0.4

package/dist/es/components/tabs/index.js

@@ -1,7 +1 @@
-import TabsBase, { TabPane } from './Tabs';
-export { useTabsTokens } from './tokens';
-const Tabs = Object.assign(TabsBase, {
-  TabPane
-});
-export { TabPane };
-export default Tabs;
+import TabsBase,{TabPane}from"./Tabs";export{useTabsTokens}from"./tokens";const Tabs=Object.assign(TabsBase,{TabPane:TabPane});export{TabPane};export default Tabs;

package/dist/es/components/tabs/tokens.js

@@ -1,105 +1 @@
-import { createComponentTokensHook } from '../../design-system';
-const createTokens = foundations => {
-  const {
-    palette,
-    spacing,
-    fontSize,
-    radii,
-    typography
-  } = foundations;
-  const onPrimary = palette.primary.foreground ?? '#ffffff';
-  return {
-    defaults: {
-      type: 'line',
-      align: 'center',
-      ellipsis: true,
-      swipeThreshold: 5,
-      animated: true,
-      duration: 300,
-      lazyRender: true
-    },
-    colors: {
-      text: palette.default[700],
-      textActive: palette.primary[600],
-      textDisabled: palette.default[400],
-      description: palette.default[500],
-      descriptionActive: palette.default[600],
-      descriptionBackground: palette.default[100],
-      descriptionActiveBackground: palette.primary[600],
-      border: palette.default[200],
-      indicator: palette.primary[600],
-      cardBackground: '#ffffff',
-      cardActiveBackground: palette.primary[600],
-      cardBorder: palette.primary[600],
-      cardActiveBorder: palette.primary[600],
-      cardActiveText: onPrimary,
-      capsuleBackground: 'transparent',
-      capsuleActiveBackground: palette.primary[600],
-      capsuleBorder: 'transparent',
-      capsuleActiveBorder: 'transparent',
-      capsuleText: palette.default[700],
-      capsuleActiveText: onPrimary,
-      badgeText: palette.default[500],
-      jumboBackground: palette.default[50],
-      jumboActiveBackground: '#ffffff',
-      jumboBorder: 'transparent',
-      jumboActiveBorder: palette.primary[400],
-      jumboDescription: palette.default[500],
-      jumboDescriptionActive: onPrimary,
-      jumboDescriptionBackground: palette.default[100],
-      jumboDescriptionActiveBackground: palette.primary[500]
-    },
-    tabList: {
-      height: 44,
-      paddingHorizontal: spacing.lg,
-      paddingVertical: 0,
-      paddingBottom: spacing.md,
-      background: '#ffffff'
-    },
-    typography: {
-      fontFamily: typography.fontFamily,
-      titleSize: fontSize.sm,
-      titleWeight: foundations.typography.weight.medium,
-      titleActiveWeight: foundations.typography.weight.semiBold,
-      descriptionSize: fontSize.xs,
-      jumboTitleSize: fontSize.md,
-      jumboLineHeight: Math.round(fontSize.md * 1.6),
-      badgeTextSize: fontSize.xxs
-    },
-    spacing: {
-      navSidePaddingHorizontal: spacing.sm,
-      navBottomMarginTop: spacing.sm,
-      descriptionMarginTop: spacing.xxs,
-      jumboDescriptionMarginTop: spacing.sm,
-      badgeMarginTop: spacing.xs
-    },
-    indicator: {
-      height: 3,
-      radius: 999,
-      width: 40,
-      offset: spacing.md
-    },
-    card: {
-      radius: radii.xs,
-      paddingHorizontal: spacing.sm,
-      paddingVertical: spacing.xs,
-      height: 30,
-      marginHorizontal: spacing.md
-    },
-    capsule: {
-      radius: 999,
-      paddingHorizontal: spacing.sm,
-      paddingVertical: spacing.ssm
-    },
-    jumbo: {
-      radius: 16,
-      paddingHorizontal: spacing.md,
-      paddingVertical: spacing.sm,
-      height: 64,
-      descriptionPaddingHorizontal: spacing.sm,
-      descriptionPaddingVertical: spacing.xxs,
-      descriptionRadius: 10
-    }
-  };
-};
-export const useTabsTokens = createComponentTokensHook('tabs', createTokens);
+import{createComponentTokensHook}from"../../design-system";const createTokens=e=>{const{palette:i,spacing:t,fontSize:a,radii:r,typography:o}=e,d=e.surface??"#ffffff",n=i.primary.foreground??"#ffffff";return{defaults:{type:"line",align:"center",ellipsis:!0,swipeThreshold:5,animated:!0,duration:300,lazyRender:!0},colors:{text:i.default[700],textActive:i.primary[600],textDisabled:i.default[400],description:i.default[500],descriptionActive:i.default[600],descriptionBackground:i.default[100],descriptionActiveBackground:i.primary[600],border:i.default[200],indicator:i.primary[600],cardBackground:d,cardActiveBackground:i.primary[600],cardBorder:i.primary[600],cardActiveBorder:i.primary[600],cardActiveText:n,capsuleBackground:"transparent",capsuleActiveBackground:i.primary[600],capsuleBorder:"transparent",capsuleActiveBorder:"transparent",capsuleText:i.default[700],capsuleActiveText:n,badgeText:i.default[500],jumboBackground:i.default[50],jumboActiveBackground:d,jumboBorder:"transparent",jumboActiveBorder:i.primary[400],jumboDescription:i.default[500],jumboDescriptionActive:n,jumboDescriptionBackground:i.default[100],jumboDescriptionActiveBackground:i.primary[500]},tabList:{height:44,paddingHorizontal:t.lg,paddingVertical:0,paddingBottom:t.md,background:d},typography:{fontFamily:o.fontFamily,titleSize:a.sm,titleWeight:e.typography.weight.medium,titleActiveWeight:e.typography.weight.semiBold,descriptionSize:a.xs,jumboTitleSize:a.md,jumboLineHeight:Math.round(1.6*a.md),badgeTextSize:a.xxs},spacing:{navSidePaddingHorizontal:t.sm,navBottomMarginTop:t.sm,descriptionMarginTop:t.xxs,jumboDescriptionMarginTop:t.sm,badgeMarginTop:t.xs},indicator:{height:3,radius:999,width:40,offset:t.md},card:{radius:r.xs,paddingHorizontal:t.sm,paddingVertical:t.xs,height:30,marginHorizontal:t.md},capsule:{radius:999,paddingHorizontal:t.sm,paddingVertical:t.ssm},jumbo:{radius:16,paddingHorizontal:t.md,paddingVertical:t.sm,height:64,descriptionPaddingHorizontal:t.sm,descriptionPaddingVertical:t.xxs,descriptionRadius:10}}};export const useTabsTokens=createComponentTokensHook("tabs",createTokens);

package/dist/es/components/tag/Tag.js

@@ -1,105 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React from 'react';
-import { Pressable, View } from 'react-native';
-import { Close } from 'react-native-system-icon';
-import { createHairlineView, isFunction, renderTextOrNode } from '../../utils';
-import { isRenderable } from '../../utils/validate';
-import { useDirection } from '../config-provider/useDirection';
-import { useTagTokens } from './tokens';
-const TagImpl = props => {
-  const {
-    tokensOverride,
-    children,
-    type: typeP,
-    size: sizeP,
-    plain: plainP,
-    round: roundP,
-    mark: markP,
-    color,
-    textColor,
-    show: showP,
-    closeable,
-    closeIcon,
-    onClose,
-    onPress,
-    textStyle,
-    style,
-    ...rest
-  } = props;
-  const tokens = useTagTokens(tokensOverride);
-  const dir = useDirection();
-  const type = typeP ?? tokens.defaults.type;
-  const size = sizeP ?? tokens.defaults.size;
-  const plain = plainP ?? tokens.defaults.plain;
-  const round = roundP ?? tokens.defaults.round;
-  const mark = markP ?? tokens.defaults.mark;
-  const show = showP ?? tokens.defaults.show;
-  if (!show) return null;
-  const tone = tokens.colors.toneMap[type] ?? tokens.colors.toneMap.default;
-  const szTok = tokens.sizing.sizes[size];
-  const bgClr = plain ? tokens.colors.plainBackground : color ?? tone.background;
-  const txtClr = textColor ?? (plain ? color ?? tone.background : tone.text);
-  const borderClr = plain ? color ?? tone.background : 'transparent';
-  const radius = round ? tokens.radii.round : szTok.borderRadius;
-  const markR = mark ? dir === 'rtl' ? {
-    borderTopRightRadius: tokens.radii.markLeading,
-    borderBottomRightRadius: tokens.radii.markLeading,
-    borderTopLeftRadius: tokens.radii.round,
-    borderBottomLeftRadius: tokens.radii.round
-  } : {
-    borderTopLeftRadius: tokens.radii.markLeading,
-    borderBottomLeftRadius: tokens.radii.markLeading,
-    borderTopRightRadius: tokens.radii.round,
-    borderBottomRightRadius: tokens.radii.round
-  } : null;
-  const resRadius = mark ? tokens.radii.round : radius;
-  const ctrStyle = [tokens.layout.container, {
-    backgroundColor: bgClr,
-    paddingHorizontal: szTok.paddingHorizontal,
-    paddingVertical: szTok.paddingVertical,
-    borderRadius: radius
-  }, markR, style];
-  const label = !isRenderable(children) ? null : renderTextOrNode(children, [{
-    color: txtClr,
-    fontSize: szTok.fontSize,
-    lineHeight: szTok.lineHeight,
-    fontFamily: tokens.typography.fontFamily,
-    fontWeight: tokens.typography.fontWeight
-  }, textStyle].filter(Boolean));
-  const close = closeable && /*#__PURE__*/React.createElement(Pressable, {
-    accessibilityRole: "button",
-    hitSlop: tokens.spacing.closeHitSlop,
-    style: [tokens.layout.close, {
-      marginLeft: tokens.spacing.closeGap
-    }],
-    onPress: e => {
-      e.stopPropagation?.();
-      onClose?.();
-    }
-  }, isFunction(closeIcon) ? closeIcon(txtClr, tokens.sizing.closeIconSize) : closeIcon ?? /*#__PURE__*/React.createElement(Close, {
-    color: txtClr,
-    size: tokens.sizing.closeIconSize
-  }));
-  const hlOverlay = plain ? /*#__PURE__*/React.createElement(View, {
-    style: createHairlineView({
-      position: 'all',
-      color: borderClr,
-      borderRadius: resRadius
-    })
-  }) : null;
-  const content = /*#__PURE__*/React.createElement(React.Fragment, null, label, close, hlOverlay);
-  if (onPress) return /*#__PURE__*/React.createElement(Pressable, _extends({
-    accessibilityRole: "button",
-    onPress: onPress,
-    style: ({
-      pressed
-    }) => [ctrStyle, pressed && {
-      opacity: tokens.defaults.pressedOpacity
-    }]
-  }, rest), content);
-  return /*#__PURE__*/React.createElement(View, _extends({
-    style: ctrStyle
-  }, rest), content);
-};
-export const Tag = /*#__PURE__*/React.memo(TagImpl);
-Tag.displayName = 'Tag';
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var o=arguments[t];for(var r in o)({}).hasOwnProperty.call(o,r)&&(e[r]=o[r])}return e},_extends.apply(null,arguments)}import React from"react";import{Pressable,View}from"react-native";import{Close}from"react-native-system-icon";import{createHairlineView,isFunction,renderTextOrNode}from"../../utils";import{isRenderable}from"../../utils/validate";import{useDirection}from"../config-provider/useDirection";import{useTagTokens}from"./tokens";const TagImpl=e=>{const{tokensOverride:t,children:o,type:r,size:i,plain:a,round:n,mark:s,color:l,textColor:d,show:c,closeable:u,closeIcon:p,onClose:g,onPress:m,textStyle:f,style:b,...R}=e,y=useTagTokens(t),h=useDirection(),k=r??y.defaults.type,T=i??y.defaults.size,z=a??y.defaults.plain,x=n??y.defaults.round,L=s??y.defaults.mark;if(!(c??y.defaults.show))return null;const v=y.colors.toneMap[k]??y.colors.toneMap.default,w=y.sizing.sizes[T],P=z?y.colors.plainBackground:l??v.background,H=d??(z?l??v.background:v.text),O=z?l??v.background:"transparent",S=x?y.radii.round:w.borderRadius,V=L?"rtl"===h?{borderTopRightRadius:y.radii.markLeading,borderBottomRightRadius:y.radii.markLeading,borderTopLeftRadius:y.radii.round,borderBottomLeftRadius:y.radii.round}:{borderTopLeftRadius:y.radii.markLeading,borderBottomLeftRadius:y.radii.markLeading,borderTopRightRadius:y.radii.round,borderBottomRightRadius:y.radii.round}:null,B=L?y.radii.round:S,E=[y.layout.container,{backgroundColor:P,paddingHorizontal:w.paddingHorizontal,paddingVertical:w.paddingVertical,borderRadius:S},V,b],C=isRenderable(o)?renderTextOrNode(o,[{color:H,fontSize:w.fontSize,lineHeight:w.lineHeight,fontFamily:y.typography.fontFamily,fontWeight:y.typography.fontWeight},f].filter(Boolean)):null,F=u&&React.createElement(Pressable,{accessibilityRole:"button",hitSlop:y.spacing.closeHitSlop,style:[y.layout.close,{marginLeft:y.spacing.closeGap}],onPress:e=>{e.stopPropagation?.(),g?.()}},isFunction(p)?p(H,y.sizing.closeIconSize):p??React.createElement(Close,{color:H,size:y.sizing.closeIconSize})),I=z?React.createElement(View,{style:createHairlineView({position:"all",color:O,borderRadius:B})}):null,_=React.createElement(React.Fragment,null,C,F,I);return m?React.createElement(Pressable,_extends({accessibilityRole:"button",onPress:m,style:({pressed:e})=>[E,e&&{opacity:y.defaults.pressedOpacity}]},R),_):React.createElement(View,_extends({style:E},R),_)};export const Tag=React.memo(TagImpl);Tag.displayName="Tag";

package/dist/es/components/tag/index.js

@@ -1,2 +1 @@
-import { Tag } from './Tag';
-export default Tag;
+import{Tag}from"./Tag";export default Tag;

package/dist/es/components/tag/tokens.js

@@ -1,97 +1 @@
-import { createComponentTokensHook } from '../../design-system';
-import { getHairlineWidth } from '../../utils';
-const buildTone = (palette, key, fallbackText) => ({
-  background: palette[key][500],
-  text: fallbackText ?? palette[key].foreground ?? '#ffffff'
-});
-export const createTagTokens = foundations => {
-  const {
-    palette,
-    radii,
-    typography,
-    opacity,
-    spacing
-  } = foundations;
-  return {
-    defaults: {
-      type: 'default',
-      size: 'small',
-      plain: false,
-      round: false,
-      mark: false,
-      show: true,
-      pressedOpacity: opacity.pressed
-    },
-    layout: {
-      container: {
-        flexDirection: 'row',
-        alignItems: 'center',
-        alignSelf: 'flex-start'
-      },
-      close: {
-        alignItems: 'center',
-        justifyContent: 'center'
-      }
-    },
-    colors: {
-      plainBackground: '#ffffff',
-      toneMap: {
-        default: buildTone(palette, 'default', '#ffffff'),
-        primary: buildTone(palette, 'primary'),
-        success: buildTone(palette, 'success'),
-        warning: buildTone(palette, 'warning', palette.warning.foreground ?? palette.warning[900]),
-        danger: buildTone(palette, 'danger')
-      }
-    },
-    typography: {
-      fontFamily: typography.fontFamily,
-      lineHeightMultiplier: typography.lineHeightMultiplier,
-      fontWeight: typography.weight.medium
-    },
-    sizing: {
-      sizes: {
-        mini: {
-          fontSize: 10,
-          paddingHorizontal: 4,
-          paddingVertical: 0,
-          borderRadius: 2,
-          lineHeight: 16
-        },
-        small: {
-          fontSize: 12,
-          paddingHorizontal: 4,
-          paddingVertical: 0,
-          borderRadius: 2,
-          lineHeight: 16
-        },
-        medium: {
-          fontSize: 12,
-          paddingHorizontal: 6,
-          paddingVertical: 2,
-          borderRadius: 4,
-          lineHeight: 16
-        },
-        large: {
-          fontSize: 14,
-          paddingHorizontal: 8,
-          paddingVertical: 4,
-          borderRadius: 4,
-          lineHeight: 16
-        }
-      },
-      closeIconSize: 12
-    },
-    radii: {
-      round: radii.pill,
-      markLeading: radii.none
-    },
-    borders: {
-      width: getHairlineWidth()
-    },
-    spacing: {
-      closeGap: 2,
-      closeHitSlop: spacing.sm
-    }
-  };
-};
-export const useTagTokens = createComponentTokensHook('tag', createTagTokens);
+import{createComponentTokensHook}from"../../design-system";import{getHairlineWidth}from"../../utils";const buildTone=(e,i,n)=>({background:e[i][500],text:n??e[i].foreground??"#ffffff"});export const createTagTokens=e=>{const{palette:i,radii:n,typography:o,opacity:t,spacing:a}=e,r=e.surface??"#ffffff";return{defaults:{type:"default",size:"small",plain:!1,round:!1,mark:!1,show:!0,pressedOpacity:t.pressed},layout:{container:{flexDirection:"row",alignItems:"center",alignSelf:"flex-start"},close:{alignItems:"center",justifyContent:"center"}},colors:{plainBackground:r,toneMap:{default:buildTone(i,"default","#ffffff"),primary:buildTone(i,"primary"),success:buildTone(i,"success"),warning:buildTone(i,"warning",i.warning.foreground??i.warning[900]),danger:buildTone(i,"danger")}},typography:{fontFamily:o.fontFamily,lineHeightMultiplier:o.lineHeightMultiplier,fontWeight:o.weight.medium},sizing:{sizes:{mini:{fontSize:10,paddingHorizontal:4,paddingVertical:0,borderRadius:2,lineHeight:16},small:{fontSize:12,paddingHorizontal:4,paddingVertical:0,borderRadius:2,lineHeight:16},medium:{fontSize:12,paddingHorizontal:6,paddingVertical:2,borderRadius:4,lineHeight:16},large:{fontSize:14,paddingHorizontal:8,paddingVertical:4,borderRadius:4,lineHeight:16}},closeIconSize:12},radii:{round:n.pill,markLeading:n.none},borders:{width:getHairlineWidth()},spacing:{closeGap:2,closeHitSlop:a.sm}}};export const useTagTokens=createComponentTokensHook("tag",createTagTokens);

package/dist/es/components/toast/Toast.js

@@ -1,280 +1 @@
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-import React, { useEffect, useMemo, useRef, useState } from 'react';
-import { AccessibilityInfo, Animated, Easing, Pressable, StyleSheet, View, useWindowDimensions } from 'react-native';
-import Portal from '../portal/Portal';
-import { SafeAreaView } from '../safe-area-view';
-import { useAriaPress, useOverlayStack } from '../../hooks';
-import Loading from '../loading';
-import { Checked, Close } from 'react-native-system-icon';
-import { isFiniteNumber, isText, isRenderable } from '../../utils/validate';
-import { renderTextOrNode } from '../../utils';
-import { nativeDriverEnabled } from '../../platform';
-import { useReducedMotion } from '../../hooks/animation';
-import { useLocale } from '../config-provider/useLocale';
-import { useToastTokens } from './tokens';
-const RT = () => true;
-const ToastContentImpl = props => {
-  const {
-    visible,
-    message,
-    icon,
-    type = 'info',
-    iconSize,
-    duration = 2000,
-    position = 'middle',
-    forbidClick = false,
-    overlay = false,
-    overlayStyle,
-    closeOnClickOverlay = false,
-    closeOnClick = false,
-    loadingIndicator,
-    safeAreaInsetTop: safeAreaInsetTopProp,
-    safeAreaInsetBottom: safeAreaInsetBottomProp,
-    tokensOverride,
-    style,
-    textStyle,
-    onClose,
-    onOpen,
-    onOpened,
-    onClosed
-  } = props;
-  const locale = useLocale();
-  const tokens = useToastTokens(tokensOverride);
-  const reducedMotion = useReducedMotion();
-  const {
-    colors
-  } = tokens;
-  const {
-    height: windowHeight
-  } = useWindowDimensions();
-  const resolvedDuration = isFiniteNumber(duration) ? Math.max(0, duration) : 0;
-  const [mounted, setMounted] = useState(visible);
-  const animatedValue = useRef(new Animated.Value(visible ? 1 : 0)).current;
-  const animationRef = useRef(null);
-  const animationIdRef = useRef(0);
-  const onCloseRef = useRef(onClose);
-  onCloseRef.current = onClose;
-  const onOpenRef = useRef(onOpen);
-  onOpenRef.current = onOpen;
-  const onOpenedRef = useRef(onOpened);
-  onOpenedRef.current = onOpened;
-  const onClosedRef = useRef(onClosed);
-  onClosedRef.current = onClosed;
-  const {
-    zIndex: stackZIndex
-  } = useOverlayStack({
-    visible: mounted,
-    type: 'toast'
-  });
-  const previousVisibleRef = useRef(visible);
-  const closingRef = useRef(false);
-  const positionOffset = windowHeight > 0 ? Math.round(windowHeight * tokens.positionOffsetRatio) : tokens.positionOffsetMin;
-  const needsSafeAreaTop = safeAreaInsetTopProp !== undefined ? safeAreaInsetTopProp : position === 'top';
-  const needsSafeAreaBottom = safeAreaInsetBottomProp !== undefined ? safeAreaInsetBottomProp : position === 'bottom';
-  const positionStyle = useMemo(() => position === 'top' ? {
-    justifyContent: 'flex-start',
-    paddingTop: positionOffset
-  } : position === 'bottom' ? {
-    justifyContent: 'flex-end',
-    paddingBottom: positionOffset
-  } : {
-    justifyContent: 'center'
-  }, [position, positionOffset]);
-  useEffect(() => {
-    animationIdRef.current += 1;
-    const animationId = animationIdRef.current;
-    animationRef.current?.stop();
-    const d = reducedMotion ? 0 : tokens.animationDuration;
-    if (visible) {
-      setMounted(true);
-      animationRef.current = Animated.timing(animatedValue, {
-        toValue: 1,
-        duration: d,
-        easing: Easing.out(Easing.cubic),
-        useNativeDriver: nativeDriverEnabled,
-        isInteraction: false
-      });
-      animationRef.current.start();
-    } else {
-      animationRef.current = Animated.timing(animatedValue, {
-        toValue: 0,
-        duration: d,
-        easing: Easing.out(Easing.cubic),
-        useNativeDriver: nativeDriverEnabled,
-        isInteraction: false
-      });
-      animationRef.current.start(({
-        finished
-      }) => {
-        if (!finished || animationId !== animationIdRef.current) return;
-        setMounted(false);
-      });
-    }
-  }, [animatedValue, reducedMotion, tokens.animationDuration, visible]);
-  useEffect(() => () => {
-    animationRef.current?.stop();
-  }, []);
-  useEffect(() => {
-    if (!visible || resolvedDuration <= 0) return;
-    const timeout = setTimeout(() => {
-      onCloseRef.current?.();
-    }, resolvedDuration);
-    return () => clearTimeout(timeout);
-  }, [resolvedDuration, visible]);
-  useEffect(() => {
-    if (!visible || !isText(message)) return;
-    const text = String(message);
-    if (text) AccessibilityInfo.announceForAccessibility?.(text);
-  }, [message, visible]);
-  const resolvedAnimDuration = reducedMotion ? 0 : tokens.animationDuration;
-  useEffect(() => {
-    let openedTimeout = null;
-    if (visible) {
-      closingRef.current = false;
-      if (!previousVisibleRef.current) {
-        onOpenRef.current?.();
-        if (onOpenedRef.current) {
-          const callback = onOpenedRef.current;
-          openedTimeout = setTimeout(callback, resolvedAnimDuration);
-        }
-      }
-    } else if (previousVisibleRef.current) {
-      closingRef.current = true;
-    }
-    previousVisibleRef.current = visible;
-    return () => {
-      if (openedTimeout) clearTimeout(openedTimeout);
-    };
-  }, [resolvedAnimDuration, visible]);
-  useEffect(() => {
-    if (!mounted && closingRef.current) {
-      closingRef.current = false;
-      onClosedRef.current?.();
-    }
-  }, [mounted]);
-  const handleClose = useRef(() => onCloseRef.current?.()).current;
-  const pressProps = useAriaPress({
-    disabled: !closeOnClick,
-    onPress: handleClose,
-    extraProps: {
-      accessibilityRole: closeOnClick ? 'button' : 'alert',
-      accessibilityHint: closeOnClick ? locale?.vanToast?.closeHint ?? 'Double-tap to dismiss' : undefined,
-      accessibilityLiveRegion: 'assertive'
-    }
-  });
-  const iconNode = useMemo(() => {
-    if (icon) return icon;
-    const resolvedIconSize = iconSize ?? tokens.iconSize;
-    switch (type) {
-      case 'success':
-        return /*#__PURE__*/React.createElement(Checked, {
-          size: resolvedIconSize,
-          fill: colors.text,
-          color: colors.text
-        });
-      case 'fail':
-        return /*#__PURE__*/React.createElement(Close, {
-          size: resolvedIconSize,
-          fill: colors.text,
-          color: colors.text
-        });
-      case 'loading':
-        return loadingIndicator ?? /*#__PURE__*/React.createElement(Loading, {
-          color: colors.text,
-          size: resolvedIconSize
-        });
-      default:
-        return null;
-    }
-  }, [colors.text, icon, iconSize, loadingIndicator, tokens.iconSize, type]);
-  const iconWrapperStyle = useMemo(() => ({
-    marginBottom: tokens.gap
-  }), [tokens.gap]);
-  const messageStyle = useMemo(() => ({
-    color: colors.text,
-    fontSize: tokens.fontSize,
-    lineHeight: tokens.lineHeight,
-    fontFamily: tokens.fontFamily
-  }), [colors.text, tokens.fontSize, tokens.fontFamily, tokens.lineHeight]);
-  const isTextOnly = type === 'info' && !iconNode;
-  const baseStyle = useMemo(() => isTextOnly ? {
-    minWidth: tokens.textMinWidth,
-    minHeight: 0,
-    paddingVertical: tokens.textPaddingVertical,
-    paddingHorizontal: tokens.textPaddingHorizontal
-  } : {
-    minWidth: tokens.defaultWidth,
-    minHeight: tokens.defaultMinHeight,
-    padding: tokens.defaultPadding
-  }, [isTextOnly, tokens.defaultMinHeight, tokens.defaultPadding, tokens.defaultWidth, tokens.textMinWidth, tokens.textPaddingHorizontal, tokens.textPaddingVertical]);
-  const toastStyle = useMemo(() => ({
-    borderRadius: tokens.radius,
-    opacity: closeOnClick && pressProps.states.pressed ? tokens.pressedOpacity : animatedValue,
-    backgroundColor: tokens.colors.variants[type],
-    maxWidth: tokens.maxWidth,
-    ...baseStyle
-  }), [animatedValue, baseStyle, closeOnClick, pressProps.states.pressed, tokens.colors.variants, tokens.maxWidth, tokens.pressedOpacity, tokens.radius, type]);
-  if (!mounted) return null;
-  const hasMessage = isRenderable(message) && (typeof message !== 'string' || message !== '');
-  return /*#__PURE__*/React.createElement(View, {
-    style: [S.b, {
-      backgroundColor: tokens.colors.transparent
-    }, positionStyle, stackZIndex ? {
-      zIndex: stackZIndex
-    } : undefined],
-    pointerEvents: forbidClick || overlay || closeOnClick ? 'auto' : 'none'
-  }, (overlay || forbidClick) && /*#__PURE__*/React.createElement(Pressable, {
-    testID: "rv-toast-overlay",
-    style: [S.o, {
-      backgroundColor: tokens.colors.transparent
-    }, overlay && {
-      backgroundColor: colors.backdrop
-    }, overlayStyle],
-    pointerEvents: "auto",
-    onPress: overlay && closeOnClickOverlay ? handleClose : undefined,
-    onStartShouldSetResponder: RT,
-    onMoveShouldSetResponder: RT
-  }), needsSafeAreaTop && /*#__PURE__*/React.createElement(SafeAreaView, {
-    edge: "top",
-    pointerEvents: "none"
-  }), /*#__PURE__*/React.createElement(Pressable, _extends({
-    disabled: !closeOnClick
-  }, pressProps.interactionProps), /*#__PURE__*/React.createElement(Animated.View, {
-    renderToHardwareTextureAndroid: true,
-    shouldRasterizeIOS: true,
-    style: [S.t, toastStyle, style]
-  }, iconNode && /*#__PURE__*/React.createElement(View, {
-    style: iconWrapperStyle
-  }, isText(iconNode) ? renderTextOrNode(iconNode, [{
-    color: colors.text,
-    fontSize: tokens.iconSize
-  }]) : iconNode), hasMessage && (isText(message) ? renderTextOrNode(message, [S.m, messageStyle, textStyle]) : /*#__PURE__*/React.createElement(View, {
-    style: S.mw
-  }, message)))), needsSafeAreaBottom && /*#__PURE__*/React.createElement(SafeAreaView, {
-    edge: "bottom",
-    pointerEvents: "none"
-  }));
-};
-export const ToastContent = /*#__PURE__*/React.memo(ToastContentImpl);
-const ToastImpl = props => /*#__PURE__*/React.createElement(Portal, null, /*#__PURE__*/React.createElement(ToastContent, props));
-export const Toast = /*#__PURE__*/React.memo(ToastImpl);
-const S = StyleSheet.create({
-  b: {
-    flex: 1,
-    alignItems: 'center'
-  },
-  o: {
-    ...StyleSheet.absoluteFillObject
-  },
-  t: {
-    alignItems: 'center',
-    justifyContent: 'center'
-  },
-  m: {
-    textAlign: 'center'
-  },
-  mw: {
-    alignItems: 'center'
-  }
-});
-export default Toast;
+function _extends(){return _extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var n=arguments[t];for(var o in n)({}).hasOwnProperty.call(n,o)&&(e[o]=n[o])}return e},_extends.apply(null,arguments)}import React,{useEffect,useMemo,useRef,useState}from"react";import{AccessibilityInfo,Animated,Easing,Pressable,StyleSheet,View,useWindowDimensions}from"react-native";import Portal from"../portal/Portal";import{SafeAreaView}from"../safe-area-view";import{useAriaPress,useOverlayStack}from"../../hooks";import Loading from"../loading";import{Checked,Close}from"react-native-system-icon";import{isFiniteNumber,isText,isRenderable}from"../../utils/validate";import{renderTextOrNode}from"../../utils";import{nativeDriverEnabled}from"../../platform";import{useReducedMotion}from"../../hooks/animation";import{useLocale}from"../config-provider/useLocale";import{useToastTokens}from"./tokens";const RT=()=>!0,ToastContentImpl=e=>{const{visible:t,message:n,icon:o,type:r="info",iconSize:i,duration:s=2e3,position:a="middle",forbidClick:c=!1,overlay:l=!1,overlayStyle:u,closeOnClickOverlay:d=!1,closeOnClick:m=!1,loadingIndicator:f,safeAreaInsetTop:p,safeAreaInsetBottom:g,tokensOverride:v,style:x,textStyle:b,onClose:R,onOpen:y,onOpened:h,onClosed:E}=e,T=useLocale(),C=useToastTokens(v),O=useReducedMotion(),{colors:P}=C,{height:k}=useWindowDimensions(),I=isFiniteNumber(s)?Math.max(0,s):0,[w,z]=useState(t),A=useRef(new Animated.Value(t?1:0)).current,M=useRef(null),V=useRef(0),H=useRef(R);H.current=R;const D=useRef(y);D.current=y;const W=useRef(h);W.current=h;const j=useRef(E);j.current=E;const{zIndex:F}=useOverlayStack({visible:w,type:"toast"}),N=useRef(t),L=useRef(!1),_=k>0?Math.round(k*C.positionOffsetRatio):C.positionOffsetMin,B=void 0!==p?p:"top"===a,q=void 0!==g?g:"bottom"===a,G=useMemo(()=>"top"===a?{justifyContent:"flex-start",paddingTop:_}:"bottom"===a?{justifyContent:"flex-end",paddingBottom:_}:{justifyContent:"center"},[a,_]);useEffect(()=>{V.current+=1;const e=V.current;M.current?.stop();const n=O?0:C.animationDuration;t?(z(!0),M.current=Animated.timing(A,{toValue:1,duration:n,easing:Easing.out(Easing.cubic),useNativeDriver:nativeDriverEnabled,isInteraction:!1}),M.current.start()):(M.current=Animated.timing(A,{toValue:0,duration:n,easing:Easing.out(Easing.cubic),useNativeDriver:nativeDriverEnabled,isInteraction:!1}),M.current.start(({finished:t})=>{t&&e===V.current&&z(!1)}))},[A,O,C.animationDuration,t]),useEffect(()=>()=>{M.current?.stop()},[]),useEffect(()=>{if(!t||I<=0)return;const e=setTimeout(()=>{H.current?.()},I);return()=>clearTimeout(e)},[I,t]),useEffect(()=>{if(!t||!isText(n))return;const e=String(n);e&&AccessibilityInfo.announceForAccessibility?.(e)},[n,t]);const J=O?0:C.animationDuration;useEffect(()=>{let e=null;if(t){if(L.current=!1,!N.current&&(D.current?.(),W.current)){const t=W.current;e=setTimeout(t,J)}}else N.current&&(L.current=!0);return N.current=t,()=>{e&&clearTimeout(e)}},[J,t]),useEffect(()=>{!w&&L.current&&(L.current=!1,j.current?.())},[w]);const K=useRef(()=>H.current?.()).current,Q=useAriaPress({disabled:!m,onPress:K,extraProps:{accessibilityRole:m?"button":"alert",accessibilityHint:m?T?.vanToast?.closeHint??"Double-tap to dismiss":void 0,accessibilityLiveRegion:"assertive"}}),U=useMemo(()=>{if(o)return o;const e=i??C.iconSize;switch(r){case"success":return React.createElement(Checked,{size:e,fill:P.text,color:P.text});case"fail":return React.createElement(Close,{size:e,fill:P.text,color:P.text});case"loading":return f??React.createElement(Loading,{color:P.text,size:e});default:return null}},[P.text,o,i,f,C.iconSize,r]),X=useMemo(()=>({marginBottom:C.gap}),[C.gap]),Y=useMemo(()=>({color:P.text,fontSize:C.fontSize,lineHeight:C.lineHeight,fontFamily:C.fontFamily}),[P.text,C.fontSize,C.fontFamily,C.lineHeight]),Z="info"===r&&!U,$=useMemo(()=>Z?{minWidth:C.textMinWidth,minHeight:0,paddingVertical:C.textPaddingVertical,paddingHorizontal:C.textPaddingHorizontal}:{minWidth:C.defaultWidth,minHeight:C.defaultMinHeight,padding:C.defaultPadding},[Z,C.defaultMinHeight,C.defaultPadding,C.defaultWidth,C.textMinWidth,C.textPaddingHorizontal,C.textPaddingVertical]),ee=useMemo(()=>({borderRadius:C.radius,opacity:m&&Q.states.pressed?C.pressedOpacity:A,backgroundColor:C.colors.variants[r],maxWidth:C.maxWidth,...$}),[A,$,m,Q.states.pressed,C.colors.variants,C.maxWidth,C.pressedOpacity,C.radius,r]);if(!w)return null;const te=isRenderable(n)&&("string"!=typeof n||""!==n);return React.createElement(View,{style:[S.b,{backgroundColor:C.colors.transparent},G,F?{zIndex:F}:void 0],pointerEvents:c||l||m?"auto":"none"},(l||c)&&React.createElement(Pressable,{testID:"rv-toast-overlay",style:[S.o,{backgroundColor:C.colors.transparent},l&&{backgroundColor:P.backdrop},u],pointerEvents:"auto",onPress:l&&d?K:void 0,onStartShouldSetResponder:RT,onMoveShouldSetResponder:RT}),B&&React.createElement(SafeAreaView,{edge:"top",pointerEvents:"none"}),React.createElement(Pressable,_extends({disabled:!m},Q.interactionProps),React.createElement(Animated.View,{renderToHardwareTextureAndroid:!0,shouldRasterizeIOS:!0,style:[S.t,ee,x]},U&&React.createElement(View,{style:X},isText(U)?renderTextOrNode(U,[{color:P.text,fontSize:C.iconSize}]):U),te&&(isText(n)?renderTextOrNode(n,[S.m,Y,b]):React.createElement(View,{style:S.mw},n)))),q&&React.createElement(SafeAreaView,{edge:"bottom",pointerEvents:"none"}))};export const ToastContent=React.memo(ToastContentImpl);const ToastImpl=e=>React.createElement(Portal,null,React.createElement(ToastContent,e));export const Toast=React.memo(ToastImpl);const S=StyleSheet.create({b:{flex:1,alignItems:"center"},o:{...StyleSheet.absoluteFillObject},t:{alignItems:"center",justifyContent:"center"},m:{textAlign:"center"},mw:{alignItems:"center"}});export default Toast;