@xsolla/xui-toast 0.127.0 → 0.128.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx","../../src/Toast.tsx","../../src/ToastGroup.native.tsx","../../src/ToastProvider.tsx","../../src/ToastContext.tsx","../../src/useToast.ts"],"sourcesContent":["import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n","import React from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\nimport { Check, AlertCircle, X } from \"@xsolla/xui-icons\";\nimport type { ToastProps, ToastVariant } from \"./types\";\n\nconst getDefaultIcon = (\n variant: ToastVariant,\n size: number,\n color: string\n): React.ReactNode => {\n switch (variant) {\n case \"success\":\n return <Check size={size} color={color} />;\n case \"info\":\n case \"warning\":\n case \"error\":\n default:\n return <AlertCircle size={size} color={color} />;\n }\n};\n\nconst getIconColor = (\n variant: ToastVariant,\n colors: ReturnType<typeof useDesignSystem>[\"theme\"][\"colors\"]\n): string => {\n switch (variant) {\n case \"success\":\n return colors.content.success.primary;\n case \"warning\":\n return colors.content.warning.primary;\n case \"error\":\n return colors.content.alert.primary;\n case \"info\":\n default:\n return colors.content.inverse;\n }\n};\n\nexport const Toast: React.FC<ToastProps> = ({\n id,\n variant = \"info\",\n message,\n icon,\n onClose,\n}) => {\n const { theme } = useDesignSystem();\n const config = theme.sizing.toast();\n\n const iconColor = getIconColor(variant, theme.colors);\n const displayIcon =\n icon !== undefined ? (\n <Icon size={config.iconSize} color={iconColor}>\n {icon}\n </Icon>\n ) : (\n getDefaultIcon(variant, config.iconSize, iconColor)\n );\n\n return (\n <Box\n backgroundColor={theme.colors.background.inverse}\n borderRadius={config.borderRadius}\n paddingHorizontal={config.paddingHorizontal}\n paddingVertical={config.paddingVertical}\n minHeight={config.minHeight}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={config.gap}\n width=\"100%\"\n role=\"alert\"\n aria-live=\"polite\"\n data-toast-id={id}\n >\n <Box\n width={config.iconSize}\n height={config.iconSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n >\n {displayIcon}\n </Box>\n\n <Box flex={1} minWidth={0}>\n <Text\n color={theme.colors.content.inverse}\n fontSize={config.fontSize}\n lineHeight={config.lineHeight}\n fontWeight=\"500\"\n numberOfLines={2}\n >\n {message}\n </Text>\n </Box>\n\n {onClose && (\n <Box\n onPress={onClose}\n width={config.closeButtonSize}\n height={config.closeButtonSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n role=\"button\"\n aria-label=\"Dismiss toast\"\n >\n <X size={config.closeIconSize} color={theme.colors.content.inverse} />\n </Box>\n )}\n </Box>\n );\n};\n\nToast.displayName = \"Toast\";\n","import React, { memo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\nimport { Toast } from \"./Toast\";\nimport type { ToastGroupProps } from \"./types\";\n\nexport const ToastGroup = memo(\n ({ toasts, position = \"top\", onDismiss }: ToastGroupProps) => {\n const { theme } = useDesignSystem();\n const config = theme.sizing.toast();\n\n if (toasts.length === 0) {\n return null;\n }\n\n const positionStyles =\n position === \"top\"\n ? { top: config.containerPadding, bottom: undefined }\n : { top: undefined, bottom: config.containerPadding };\n\n return (\n <Box\n position=\"absolute\"\n left={0}\n right={0}\n zIndex={9999}\n alignItems=\"center\"\n paddingHorizontal={config.containerPadding}\n pointerEvents=\"box-none\"\n {...positionStyles}\n >\n <Box\n width=\"100%\"\n maxWidth={config.maxWidth}\n gap={config.groupGap}\n flexDirection=\"column\"\n >\n {toasts.map((toast) => (\n <Toast\n key={toast.id}\n id={toast.id}\n variant={toast.variant}\n message={toast.message}\n icon={toast.icon}\n onClose={() => onDismiss(toast.id)}\n />\n ))}\n </Box>\n </Box>\n );\n }\n);\n\nToastGroup.displayName = \"ToastGroup\";\n","import React, {\n useCallback,\n useMemo,\n useState,\n useEffect,\n useRef,\n} from \"react\";\nimport { ToastContext } from \"./ToastContext\";\nimport { ToastGroup } from \"./ToastGroup\";\nimport type { ToastProviderProps, ToastData, ToastOptions } from \"./types\";\n\nlet toastIdCounter = 0;\n\nconst generateToastId = (): string => {\n return `toast-${++toastIdCounter}-${Date.now()}`;\n};\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n children,\n position = \"top\",\n defaultDuration = 5000,\n}) => {\n const [toasts, setToasts] = useState<ToastData[]>([]);\n const timersRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(\n new Map()\n );\n\n const clearTimer = useCallback((id: string) => {\n const timer = timersRef.current.get(id);\n if (timer) {\n clearTimeout(timer);\n timersRef.current.delete(id);\n }\n }, []);\n\n const dismissToast = useCallback(\n (id: string) => {\n clearTimer(id);\n setToasts((prev) => prev.filter((toast) => toast.id !== id));\n },\n [clearTimer]\n );\n\n const dismissAllToasts = useCallback(() => {\n timersRef.current.forEach((_, id) => clearTimer(id));\n setToasts([]);\n }, [clearTimer]);\n\n const addToast = useCallback(\n (options: ToastOptions): string => {\n const id = generateToastId();\n const duration = options.duration ?? defaultDuration;\n\n const newToast: ToastData = {\n id,\n variant: options.variant ?? \"info\",\n message: options.message,\n icon: options.icon,\n duration,\n };\n\n setToasts((prev) => [...prev, newToast]);\n\n // Set auto-dismiss timer if duration > 0\n if (duration > 0) {\n const timer = setTimeout(() => {\n dismissToast(id);\n }, duration);\n timersRef.current.set(id, timer);\n }\n\n return id;\n },\n [defaultDuration, dismissToast]\n );\n\n // Cleanup timers on unmount\n useEffect(() => {\n return () => {\n timersRef.current.forEach((timer) => clearTimeout(timer));\n timersRef.current.clear();\n };\n }, []);\n\n const contextValue = useMemo(\n () => ({\n toasts,\n addToast,\n dismissToast,\n dismissAllToasts,\n }),\n [toasts, addToast, dismissToast, dismissAllToasts]\n );\n\n return (\n <ToastContext.Provider value={contextValue}>\n {children}\n <ToastGroup\n toasts={toasts}\n position={position}\n onDismiss={dismissToast}\n />\n </ToastContext.Provider>\n );\n};\n","import { createContext } from \"react\";\nimport type { ToastContextType } from \"./types\";\n\nexport const ToastContext = createContext<ToastContextType | null>(null);\n","import { useContext, useCallback } from \"react\";\nimport { ToastContext } from \"./ToastContext\";\nimport type { ToastOptions } from \"./types\";\n\nexport interface UseToastReturn {\n /** Show a toast with custom options */\n toast: (options: ToastOptions) => string;\n /** Show a success toast */\n success: (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ) => string;\n /** Show an info toast */\n info: (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ) => string;\n /** Show a warning toast */\n warning: (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ) => string;\n /** Show an error toast */\n error: (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ) => string;\n /** Dismiss a specific toast by ID */\n dismiss: (id: string) => void;\n /** Dismiss all toasts */\n dismissAll: () => void;\n}\n\nexport const useToast = (): UseToastReturn => {\n const context = useContext(ToastContext);\n\n if (!context) {\n throw new Error(\"useToast must be used within a ToastProvider\");\n }\n\n const { addToast, dismissToast, dismissAllToasts } = context;\n\n const toast = useCallback(\n (options: ToastOptions): string => {\n return addToast(options);\n },\n [addToast]\n );\n\n const success = useCallback(\n (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ): string => {\n return addToast({ ...options, message, variant: \"success\" });\n },\n [addToast]\n );\n\n const info = useCallback(\n (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ): string => {\n return addToast({ ...options, message, variant: \"info\" });\n },\n [addToast]\n );\n\n const warning = useCallback(\n (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ): string => {\n return addToast({ ...options, message, variant: \"warning\" });\n },\n [addToast]\n );\n\n const error = useCallback(\n (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ): string => {\n return addToast({ ...options, message, variant: \"error\" });\n },\n [addToast]\n );\n\n const dismiss = useCallback(\n (id: string): void => {\n dismissToast(id);\n },\n [dismissToast]\n );\n\n const dismissAll = useCallback((): void => {\n dismissAllToasts();\n }, [dismissAllToasts]);\n\n return {\n toast,\n success,\n info,\n warning,\n error,\n dismiss,\n dismissAll,\n };\n};\n"],"mappings":"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","names":["jsx","View","jsx","jsx","useDesignSystem","jsx","useDesignSystem","jsx","jsxs","useCallback","useCallback"]}
1
+ {"version":3,"sources":["../../src/Toast.tsx","../../../primitives-native/src/Box.tsx","../../../primitives-native/src/Text.tsx","../../../primitives-native/src/Icon.tsx","../../src/ToastGroup.native.tsx","../../src/ToastProvider.tsx","../../src/ToastContext.tsx","../../src/useToast.ts"],"sourcesContent":["import React, { useEffect, useState } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text, Icon } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\nimport { Check, AlertCircle, X } from \"@xsolla/xui-icons\";\nimport type { ToastProps, ToastVariant } from \"./types\";\n\nconst getDefaultIcon = (\n variant: ToastVariant,\n size: number,\n color: string\n): React.ReactNode => {\n switch (variant) {\n case \"success\":\n return <Check size={size} color={color} />;\n case \"info\":\n case \"warning\":\n case \"error\":\n default:\n return <AlertCircle size={size} color={color} />;\n }\n};\n\nconst getIconColor = (\n variant: ToastVariant,\n colors: ReturnType<typeof useDesignSystem>[\"theme\"][\"colors\"]\n): string => {\n switch (variant) {\n case \"success\":\n return colors.content.success.primary;\n case \"warning\":\n return colors.content.warning.primary;\n case \"error\":\n return colors.content.alert.primary;\n case \"info\":\n default:\n return colors.content.inverse;\n }\n};\n\nconst ANIMATION_DURATION = 200;\n\nexport const Toast: React.FC<ToastProps> = ({\n id,\n variant = \"info\",\n message,\n icon,\n duration,\n onClose,\n}) => {\n const { theme } = useDesignSystem();\n const config = theme.sizing.toast();\n const [visible, setVisible] = useState(false);\n const [dismissing, setDismissing] = useState(false);\n\n useEffect(() => {\n const frame = requestAnimationFrame(() => setVisible(true));\n return () => cancelAnimationFrame(frame);\n }, []);\n\n const handleClose = () => {\n if (dismissing) return;\n setDismissing(true);\n setTimeout(() => onClose?.(), ANIMATION_DURATION);\n };\n\n useEffect(() => {\n if (!duration || duration <= 0) return;\n const timer = setTimeout(handleClose, duration);\n return () => clearTimeout(timer);\n }, [duration]);\n\n const iconColor = getIconColor(variant, theme.colors);\n const displayIcon =\n icon !== undefined ? (\n <Icon size={config.iconSize} color={iconColor}>\n {icon}\n </Icon>\n ) : (\n getDefaultIcon(variant, config.iconSize, iconColor)\n );\n\n return (\n <Box\n backgroundColor={theme.colors.background.inverse}\n borderRadius={config.borderRadius}\n paddingHorizontal={config.paddingHorizontal}\n paddingVertical={config.paddingVertical}\n minHeight={config.minHeight}\n flexDirection=\"row\"\n alignItems=\"center\"\n gap={config.gap}\n width=\"100%\"\n role=\"alert\"\n aria-live=\"polite\"\n data-toast-id={id}\n style={{\n opacity: visible && !dismissing ? 1 : 0,\n transform:\n visible && !dismissing ? \"translateY(0)\" : \"translateY(-8px)\",\n transition: `opacity ${ANIMATION_DURATION}ms ease-out, transform ${ANIMATION_DURATION}ms ease-out`,\n }}\n >\n <Box\n width={config.iconSize}\n height={config.iconSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n >\n {displayIcon}\n </Box>\n\n <Box flex={1} minWidth={0}>\n <Text\n color={theme.colors.content.inverse}\n fontSize={config.fontSize}\n lineHeight={config.lineHeight}\n fontWeight=\"500\"\n numberOfLines={2}\n >\n {message}\n </Text>\n </Box>\n\n {onClose && (\n <Box\n onPress={handleClose}\n width={config.closeButtonSize}\n height={config.closeButtonSize}\n alignItems=\"center\"\n justifyContent=\"center\"\n flexShrink={0}\n role=\"button\"\n aria-label=\"Dismiss toast\"\n >\n <X size={config.closeIconSize} color={theme.colors.content.inverse} />\n </Box>\n )}\n </Box>\n );\n};\n\nToast.displayName = \"Toast\";\n","import React from \"react\";\nimport {\n View,\n Pressable,\n Image,\n ViewStyle,\n ImageStyle,\n DimensionValue,\n AnimatableNumericValue,\n} from \"react-native\";\nimport { BoxProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Box: React.FC<BoxProps> = ({\n children,\n onPress,\n onLayout,\n onMoveShouldSetResponder,\n onResponderGrant,\n onResponderMove,\n onResponderRelease,\n onResponderTerminate,\n backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius,\n borderStyle,\n height,\n padding,\n paddingHorizontal,\n paddingVertical,\n margin,\n marginTop,\n marginBottom,\n marginLeft,\n marginRight,\n flexDirection,\n alignItems,\n justifyContent,\n position,\n top,\n bottom,\n left,\n right,\n width,\n flex,\n overflow,\n zIndex,\n hoverStyle,\n pressStyle,\n style,\n \"data-testid\": dataTestId,\n testID,\n as,\n src,\n alt,\n ...rest\n}) => {\n const getContainerStyle = (pressed?: boolean): ViewStyle => ({\n backgroundColor:\n pressed && pressStyle?.backgroundColor\n ? pressStyle.backgroundColor\n : backgroundColor,\n borderColor,\n borderWidth,\n borderBottomWidth,\n borderBottomColor,\n borderTopWidth,\n borderTopColor,\n borderLeftWidth,\n borderLeftColor,\n borderRightWidth,\n borderRightColor,\n borderRadius: borderRadius as AnimatableNumericValue,\n borderStyle: borderStyle as ViewStyle[\"borderStyle\"],\n overflow,\n zIndex,\n height: height as DimensionValue,\n width: width as DimensionValue,\n padding: padding as DimensionValue,\n paddingHorizontal: paddingHorizontal as DimensionValue,\n paddingVertical: paddingVertical as DimensionValue,\n margin: margin as DimensionValue,\n marginTop: marginTop as DimensionValue,\n marginBottom: marginBottom as DimensionValue,\n marginLeft: marginLeft as DimensionValue,\n marginRight: marginRight as DimensionValue,\n flexDirection,\n alignItems,\n justifyContent,\n position: position as ViewStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n flex,\n ...(style as ViewStyle),\n });\n\n const finalTestID = dataTestId || testID;\n\n // Destructure and drop web-only props from rest before passing to RN components\n // eslint-disable-next-line @typescript-eslint/no-unused-vars\n const {\n role,\n tabIndex,\n onKeyDown,\n onKeyUp,\n \"aria-label\": _ariaLabel,\n \"aria-labelledby\": _ariaLabelledBy,\n \"aria-current\": _ariaCurrent,\n \"aria-disabled\": _ariaDisabled,\n \"aria-live\": _ariaLive,\n className,\n \"data-testid\": _dataTestId,\n ...nativeRest\n } = rest as Record<string, unknown>;\n\n // Handle as=\"img\" for React Native\n if (as === \"img\" && src) {\n const imageStyle: ImageStyle = {\n width: width as DimensionValue,\n height: height as DimensionValue,\n borderRadius: borderRadius as number,\n position: position as ImageStyle[\"position\"],\n top: top as DimensionValue,\n bottom: bottom as DimensionValue,\n left: left as DimensionValue,\n right: right as DimensionValue,\n ...(style as ImageStyle),\n };\n\n return (\n <Image\n source={{ uri: src }}\n style={imageStyle}\n testID={finalTestID}\n resizeMode=\"cover\"\n {...nativeRest}\n />\n );\n }\n\n if (onPress) {\n return (\n <Pressable\n onPress={onPress}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n style={({ pressed }) => getContainerStyle(pressed)}\n testID={finalTestID}\n {...nativeRest}\n >\n {children}\n </Pressable>\n );\n }\n\n return (\n <View\n style={getContainerStyle()}\n testID={finalTestID}\n onLayout={onLayout}\n onMoveShouldSetResponder={onMoveShouldSetResponder}\n onResponderGrant={onResponderGrant}\n onResponderMove={onResponderMove}\n onResponderRelease={onResponderRelease}\n onResponderTerminate={onResponderTerminate}\n {...nativeRest}\n >\n {children}\n </View>\n );\n};\n","import React from \"react\";\nimport {\n Text as RNText,\n TextStyle,\n AccessibilityRole,\n StyleSheet,\n} from \"react-native\";\nimport { TextProps } from \"@xsolla/xui-primitives-core\";\n\nconst roleMap: Record<string, AccessibilityRole> = {\n alert: \"alert\",\n heading: \"header\",\n button: \"button\",\n link: \"link\",\n text: \"text\",\n};\n\nconst parseNumericValue = (\n value: string | number | undefined\n): number | undefined => {\n if (value === undefined) return undefined;\n if (typeof value === \"number\") return value;\n const parsed = parseFloat(value);\n return isNaN(parsed) ? undefined : parsed;\n};\n\nexport const Text: React.FC<TextProps> = ({\n children,\n color,\n fontSize,\n fontWeight,\n fontFamily,\n textAlign,\n lineHeight,\n numberOfLines,\n id,\n role,\n style: styleProp,\n ...props\n}) => {\n let resolvedFontFamily = fontFamily\n ? fontFamily.split(\",\")[0].replace(/['\"]/g, \"\").trim()\n : undefined;\n\n if (\n resolvedFontFamily === \"Pilat Wide\" ||\n resolvedFontFamily === \"Pilat Wide Bold\" ||\n resolvedFontFamily === \"Aktiv Grotesk\"\n ) {\n resolvedFontFamily = undefined;\n }\n\n const incomingStyle = StyleSheet.flatten(styleProp) as TextStyle | undefined;\n\n const baseStyle: TextStyle = {\n color,\n fontSize: typeof fontSize === \"number\" ? fontSize : undefined,\n fontWeight: fontWeight as TextStyle[\"fontWeight\"],\n fontFamily: resolvedFontFamily,\n textDecorationLine: props.textDecoration as TextStyle[\"textDecorationLine\"],\n textAlign: textAlign ?? incomingStyle?.textAlign,\n lineHeight: parseNumericValue(lineHeight ?? incomingStyle?.lineHeight),\n marginTop: parseNumericValue(\n incomingStyle?.marginTop as number | string | undefined\n ),\n marginBottom: parseNumericValue(\n incomingStyle?.marginBottom as number | string | undefined\n ),\n };\n\n const accessibilityRole = role ? roleMap[role] : undefined;\n\n return (\n <RNText\n style={baseStyle}\n numberOfLines={numberOfLines}\n testID={id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import React from \"react\";\nimport { View, ViewStyle } from \"react-native\";\nimport { IconProps } from \"@xsolla/xui-primitives-core\";\n\nexport const Icon: React.FC<IconProps> = ({ children, color, size }) => {\n const style: ViewStyle = {\n width: typeof size === \"number\" ? size : undefined,\n height: typeof size === \"number\" ? size : undefined,\n alignItems: \"center\",\n justifyContent: \"center\",\n };\n\n // On native, we try to pass the color down to children (like Text primitives)\n // to mimic the CSS inheritance behavior of the web version.\n const childrenWithProps = React.Children.map(children, (child) => {\n if (React.isValidElement(child)) {\n return React.cloneElement(child, {\n color: child.props.color || color,\n // Also pass size if child seems to be an icon that needs it\n size: child.props.size || size,\n });\n }\n return child;\n });\n\n return <View style={style}>{childrenWithProps}</View>;\n};\n","import React, { memo } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box } from \"@xsolla/xui-primitives\";\nimport { useDesignSystem } from \"@xsolla/xui-core\";\nimport { Toast } from \"./Toast\";\nimport type { ToastGroupProps } from \"./types\";\n\nexport const ToastGroup = memo(\n ({ toasts, position = \"top\", maxWidth, onDismiss }: ToastGroupProps) => {\n const { theme } = useDesignSystem();\n const config = theme.sizing.toast();\n\n if (toasts.length === 0) {\n return null;\n }\n\n const positionStyles =\n position === \"top\"\n ? { top: config.containerPadding, bottom: undefined }\n : { top: undefined, bottom: config.containerPadding };\n\n return (\n <Box\n position=\"absolute\"\n left={0}\n right={0}\n zIndex={9999}\n alignItems=\"center\"\n paddingHorizontal={config.containerPadding}\n pointerEvents=\"box-none\"\n {...positionStyles}\n >\n <Box\n width=\"100%\"\n maxWidth={maxWidth}\n gap={config.groupGap}\n flexDirection=\"column\"\n >\n {toasts.map((toast) => (\n <Toast\n key={toast.id}\n id={toast.id}\n variant={toast.variant}\n message={toast.message}\n icon={toast.icon}\n duration={toast.duration}\n onClose={() => onDismiss(toast.id)}\n />\n ))}\n </Box>\n </Box>\n );\n }\n);\n\nToastGroup.displayName = \"ToastGroup\";\n","import React, { useCallback, useMemo, useState } from \"react\";\nimport { ToastContext } from \"./ToastContext\";\nimport { ToastGroup } from \"./ToastGroup\";\nimport type { ToastProviderProps, ToastData, ToastOptions } from \"./types\";\n\nlet toastIdCounter = 0;\n\nconst generateToastId = (): string => {\n return `toast-${++toastIdCounter}-${Date.now()}`;\n};\n\nexport const ToastProvider: React.FC<ToastProviderProps> = ({\n children,\n position = \"top\",\n defaultDuration = 5000,\n maxWidth,\n}) => {\n const [toasts, setToasts] = useState<ToastData[]>([]);\n\n const dismissToast = useCallback((id: string) => {\n setToasts((prev) => prev.filter((toast) => toast.id !== id));\n }, []);\n\n const dismissAllToasts = useCallback(() => {\n setToasts([]);\n }, []);\n\n const addToast = useCallback(\n (options: ToastOptions): string => {\n const id = generateToastId();\n const duration = options.duration ?? defaultDuration;\n\n const newToast: ToastData = {\n id,\n variant: options.variant ?? \"info\",\n message: options.message,\n icon: options.icon,\n duration,\n };\n\n setToasts((prev) => [...prev, newToast]);\n\n return id;\n },\n [defaultDuration]\n );\n\n const contextValue = useMemo(\n () => ({\n toasts,\n addToast,\n dismissToast,\n dismissAllToasts,\n }),\n [toasts, addToast, dismissToast, dismissAllToasts]\n );\n\n return (\n <ToastContext.Provider value={contextValue}>\n {children}\n <ToastGroup\n toasts={toasts}\n position={position}\n maxWidth={maxWidth}\n onDismiss={dismissToast}\n />\n </ToastContext.Provider>\n );\n};\n","import { createContext } from \"react\";\nimport type { ToastContextType } from \"./types\";\n\nexport const ToastContext = createContext<ToastContextType | null>(null);\n","import { useContext, useCallback } from \"react\";\nimport { ToastContext } from \"./ToastContext\";\nimport type { ToastOptions } from \"./types\";\n\nexport interface UseToastReturn {\n /** Show a toast with custom options */\n toast: (options: ToastOptions) => string;\n /** Show a success toast */\n success: (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ) => string;\n /** Show an info toast */\n info: (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ) => string;\n /** Show a warning toast */\n warning: (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ) => string;\n /** Show an error toast */\n error: (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ) => string;\n /** Dismiss a specific toast by ID */\n dismiss: (id: string) => void;\n /** Dismiss all toasts */\n dismissAll: () => void;\n}\n\nexport const useToast = (): UseToastReturn => {\n const context = useContext(ToastContext);\n\n if (!context) {\n throw new Error(\"useToast must be used within a ToastProvider\");\n }\n\n const { addToast, dismissToast, dismissAllToasts } = context;\n\n const toast = useCallback(\n (options: ToastOptions): string => {\n return addToast(options);\n },\n [addToast]\n );\n\n const success = useCallback(\n (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ): string => {\n return addToast({ ...options, message, variant: \"success\" });\n },\n [addToast]\n );\n\n const info = useCallback(\n (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ): string => {\n return addToast({ ...options, message, variant: \"info\" });\n },\n [addToast]\n );\n\n const warning = useCallback(\n (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ): string => {\n return addToast({ ...options, message, variant: \"warning\" });\n },\n [addToast]\n );\n\n const error = useCallback(\n (\n message: string,\n options?: Omit<ToastOptions, \"message\" | \"variant\">\n ): string => {\n return addToast({ ...options, message, variant: \"error\" });\n },\n [addToast]\n );\n\n const dismiss = useCallback(\n (id: string): void => {\n dismissToast(id);\n },\n [dismissToast]\n );\n\n const dismissAll = useCallback((): void => {\n dismissAllToasts();\n }, [dismissAllToasts]);\n\n return {\n toast,\n success,\n info,\n warning,\n error,\n dismiss,\n dismissAll,\n };\n};\n"],"mappings":";AAAA,SAAgB,WAAW,gBAAgB;;;ACC3C;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OAKK;AAmID;AAhIC,IAAM,MAA0B,CAAC;AAAA,EACtC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,eAAe;AAAA,EACf;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,GAAG;AACL,MAAM;AACJ,QAAM,oBAAoB,CAAC,aAAkC;AAAA,IAC3D,iBACE,WAAW,YAAY,kBACnB,WAAW,kBACX;AAAA,IACN;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,GAAI;AAAA,EACN;AAEA,QAAM,cAAc,cAAc;AAIlC,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA,cAAc;AAAA,IACd,mBAAmB;AAAA,IACnB,gBAAgB;AAAA,IAChB,iBAAiB;AAAA,IACjB,aAAa;AAAA,IACb;AAAA,IACA,eAAe;AAAA,IACf,GAAG;AAAA,EACL,IAAI;AAGJ,MAAI,OAAO,SAAS,KAAK;AACvB,UAAM,aAAyB;AAAA,MAC7B;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA,GAAI;AAAA,IACN;AAEA,WACE;AAAA,MAAC;AAAA;AAAA,QACC,QAAQ,EAAE,KAAK,IAAI;AAAA,QACnB,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,YAAW;AAAA,QACV,GAAG;AAAA;AAAA,IACN;AAAA,EAEJ;AAEA,MAAI,SAAS;AACX,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA,OAAO,CAAC,EAAE,QAAQ,MAAM,kBAAkB,OAAO;AAAA,QACjD,QAAQ;AAAA,QACP,GAAG;AAAA,QAEH;AAAA;AAAA,IACH;AAAA,EAEJ;AAEA,SACE;AAAA,IAAC;AAAA;AAAA,MACC,OAAO,kBAAkB;AAAA,MACzB,QAAQ;AAAA,MACR;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACC,GAAG;AAAA,MAEH;AAAA;AAAA,EACH;AAEJ;;;ACvLA;AAAA,EACE,QAAQ;AAAA,EAGR;AAAA,OACK;AAmEH,gBAAAA,YAAA;AAhEJ,IAAM,UAA6C;AAAA,EACjD,OAAO;AAAA,EACP,SAAS;AAAA,EACT,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,MAAM;AACR;AAEA,IAAM,oBAAoB,CACxB,UACuB;AACvB,MAAI,UAAU,OAAW,QAAO;AAChC,MAAI,OAAO,UAAU,SAAU,QAAO;AACtC,QAAM,SAAS,WAAW,KAAK;AAC/B,SAAO,MAAM,MAAM,IAAI,SAAY;AACrC;AAEO,IAAM,OAA4B,CAAC;AAAA,EACxC;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA,OAAO;AAAA,EACP,GAAG;AACL,MAAM;AACJ,MAAI,qBAAqB,aACrB,WAAW,MAAM,GAAG,EAAE,CAAC,EAAE,QAAQ,SAAS,EAAE,EAAE,KAAK,IACnD;AAEJ,MACE,uBAAuB,gBACvB,uBAAuB,qBACvB,uBAAuB,iBACvB;AACA,yBAAqB;AAAA,EACvB;AAEA,QAAM,gBAAgB,WAAW,QAAQ,SAAS;AAElD,QAAM,YAAuB;AAAA,IAC3B;AAAA,IACA,UAAU,OAAO,aAAa,WAAW,WAAW;AAAA,IACpD;AAAA,IACA,YAAY;AAAA,IACZ,oBAAoB,MAAM;AAAA,IAC1B,WAAW,aAAa,eAAe;AAAA,IACvC,YAAY,kBAAkB,cAAc,eAAe,UAAU;AAAA,IACrE,WAAW;AAAA,MACT,eAAe;AAAA,IACjB;AAAA,IACA,cAAc;AAAA,MACZ,eAAe;AAAA,IACjB;AAAA,EACF;AAEA,QAAM,oBAAoB,OAAO,QAAQ,IAAI,IAAI;AAEjD,SACE,gBAAAA;AAAA,IAAC;AAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA,QAAQ;AAAA,MACR;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;;;AClFA,OAAO,WAAW;AAClB,SAAS,QAAAC,aAAuB;AAwBvB,gBAAAC,YAAA;AArBF,IAAM,OAA4B,CAAC,EAAE,UAAU,OAAO,KAAK,MAAM;AACtE,QAAM,QAAmB;AAAA,IACvB,OAAO,OAAO,SAAS,WAAW,OAAO;AAAA,IACzC,QAAQ,OAAO,SAAS,WAAW,OAAO;AAAA,IAC1C,YAAY;AAAA,IACZ,gBAAgB;AAAA,EAClB;AAIA,QAAM,oBAAoB,MAAM,SAAS,IAAI,UAAU,CAAC,UAAU;AAChE,QAAI,MAAM,eAAe,KAAK,GAAG;AAC/B,aAAO,MAAM,aAAa,OAAO;AAAA,QAC/B,OAAO,MAAM,MAAM,SAAS;AAAA;AAAA,QAE5B,MAAM,MAAM,MAAM,QAAQ;AAAA,MAC5B,CAAC;AAAA,IACH;AACA,WAAO;AAAA,EACT,CAAC;AAED,SAAO,gBAAAA,KAACD,OAAA,EAAK,OAAe,6BAAkB;AAChD;;;AHvBA,SAAS,uBAAuB;AAChC,SAAS,OAAO,aAAa,SAAS;AAUzB,gBAAAE,MAqET,YArES;AAPb,IAAM,iBAAiB,CACrB,SACA,MACA,UACoB;AACpB,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO,gBAAAA,KAAC,SAAM,MAAY,OAAc;AAAA,IAC1C,KAAK;AAAA,IACL,KAAK;AAAA,IACL,KAAK;AAAA,IACL;AACE,aAAO,gBAAAA,KAAC,eAAY,MAAY,OAAc;AAAA,EAClD;AACF;AAEA,IAAM,eAAe,CACnB,SACA,WACW;AACX,UAAQ,SAAS;AAAA,IACf,KAAK;AACH,aAAO,OAAO,QAAQ,QAAQ;AAAA,IAChC,KAAK;AACH,aAAO,OAAO,QAAQ,QAAQ;AAAA,IAChC,KAAK;AACH,aAAO,OAAO,QAAQ,MAAM;AAAA,IAC9B,KAAK;AAAA,IACL;AACE,aAAO,OAAO,QAAQ;AAAA,EAC1B;AACF;AAEA,IAAM,qBAAqB;AAEpB,IAAM,QAA8B,CAAC;AAAA,EAC1C;AAAA,EACA,UAAU;AAAA,EACV;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF,MAAM;AACJ,QAAM,EAAE,MAAM,IAAI,gBAAgB;AAClC,QAAM,SAAS,MAAM,OAAO,MAAM;AAClC,QAAM,CAAC,SAAS,UAAU,IAAI,SAAS,KAAK;AAC5C,QAAM,CAAC,YAAY,aAAa,IAAI,SAAS,KAAK;AAElD,YAAU,MAAM;AACd,UAAM,QAAQ,sBAAsB,MAAM,WAAW,IAAI,CAAC;AAC1D,WAAO,MAAM,qBAAqB,KAAK;AAAA,EACzC,GAAG,CAAC,CAAC;AAEL,QAAM,cAAc,MAAM;AACxB,QAAI,WAAY;AAChB,kBAAc,IAAI;AAClB,eAAW,MAAM,UAAU,GAAG,kBAAkB;AAAA,EAClD;AAEA,YAAU,MAAM;AACd,QAAI,CAAC,YAAY,YAAY,EAAG;AAChC,UAAM,QAAQ,WAAW,aAAa,QAAQ;AAC9C,WAAO,MAAM,aAAa,KAAK;AAAA,EACjC,GAAG,CAAC,QAAQ,CAAC;AAEb,QAAM,YAAY,aAAa,SAAS,MAAM,MAAM;AACpD,QAAM,cACJ,SAAS,SACP,gBAAAA,KAAC,QAAK,MAAM,OAAO,UAAU,OAAO,WACjC,gBACH,IAEA,eAAe,SAAS,OAAO,UAAU,SAAS;AAGtD,SACE;AAAA,IAAC;AAAA;AAAA,MACC,iBAAiB,MAAM,OAAO,WAAW;AAAA,MACzC,cAAc,OAAO;AAAA,MACrB,mBAAmB,OAAO;AAAA,MAC1B,iBAAiB,OAAO;AAAA,MACxB,WAAW,OAAO;AAAA,MAClB,eAAc;AAAA,MACd,YAAW;AAAA,MACX,KAAK,OAAO;AAAA,MACZ,OAAM;AAAA,MACN,MAAK;AAAA,MACL,aAAU;AAAA,MACV,iBAAe;AAAA,MACf,OAAO;AAAA,QACL,SAAS,WAAW,CAAC,aAAa,IAAI;AAAA,QACtC,WACE,WAAW,CAAC,aAAa,kBAAkB;AAAA,QAC7C,YAAY,WAAW,kBAAkB,0BAA0B,kBAAkB;AAAA,MACvF;AAAA,MAEA;AAAA,wBAAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,OAAO;AAAA,YACd,QAAQ,OAAO;AAAA,YACf,YAAW;AAAA,YACX,gBAAe;AAAA,YACf,YAAY;AAAA,YAEX;AAAA;AAAA,QACH;AAAA,QAEA,gBAAAA,KAAC,OAAI,MAAM,GAAG,UAAU,GACtB,0BAAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAO,MAAM,OAAO,QAAQ;AAAA,YAC5B,UAAU,OAAO;AAAA,YACjB,YAAY,OAAO;AAAA,YACnB,YAAW;AAAA,YACX,eAAe;AAAA,YAEd;AAAA;AAAA,QACH,GACF;AAAA,QAEC,WACC,gBAAAA;AAAA,UAAC;AAAA;AAAA,YACC,SAAS;AAAA,YACT,OAAO,OAAO;AAAA,YACd,QAAQ,OAAO;AAAA,YACf,YAAW;AAAA,YACX,gBAAe;AAAA,YACf,YAAY;AAAA,YACZ,MAAK;AAAA,YACL,cAAW;AAAA,YAEX,0BAAAA,KAAC,KAAE,MAAM,OAAO,eAAe,OAAO,MAAM,OAAO,QAAQ,SAAS;AAAA;AAAA,QACtE;AAAA;AAAA;AAAA,EAEJ;AAEJ;AAEA,MAAM,cAAc;;;AI/IpB,SAAgB,YAAY;AAG5B,SAAS,mBAAAC,wBAAuB;AAoCpB,gBAAAC,YAAA;AAhCL,IAAM,aAAa;AAAA,EACxB,CAAC,EAAE,QAAQ,WAAW,OAAO,UAAU,UAAU,MAAuB;AACtE,UAAM,EAAE,MAAM,IAAIC,iBAAgB;AAClC,UAAM,SAAS,MAAM,OAAO,MAAM;AAElC,QAAI,OAAO,WAAW,GAAG;AACvB,aAAO;AAAA,IACT;AAEA,UAAM,iBACJ,aAAa,QACT,EAAE,KAAK,OAAO,kBAAkB,QAAQ,OAAU,IAClD,EAAE,KAAK,QAAW,QAAQ,OAAO,iBAAiB;AAExD,WACE,gBAAAD;AAAA,MAAC;AAAA;AAAA,QACC,UAAS;AAAA,QACT,MAAM;AAAA,QACN,OAAO;AAAA,QACP,QAAQ;AAAA,QACR,YAAW;AAAA,QACX,mBAAmB,OAAO;AAAA,QAC1B,eAAc;AAAA,QACb,GAAG;AAAA,QAEJ,0BAAAA;AAAA,UAAC;AAAA;AAAA,YACC,OAAM;AAAA,YACN;AAAA,YACA,KAAK,OAAO;AAAA,YACZ,eAAc;AAAA,YAEb,iBAAO,IAAI,CAAC,UACX,gBAAAA;AAAA,cAAC;AAAA;AAAA,gBAEC,IAAI,MAAM;AAAA,gBACV,SAAS,MAAM;AAAA,gBACf,SAAS,MAAM;AAAA,gBACf,MAAM,MAAM;AAAA,gBACZ,UAAU,MAAM;AAAA,gBAChB,SAAS,MAAM,UAAU,MAAM,EAAE;AAAA;AAAA,cAN5B,MAAM;AAAA,YAOb,CACD;AAAA;AAAA,QACH;AAAA;AAAA,IACF;AAAA,EAEJ;AACF;AAEA,WAAW,cAAc;;;ACvDzB,SAAgB,aAAa,SAAS,YAAAE,iBAAgB;;;ACAtD,SAAS,qBAAqB;AAGvB,IAAM,eAAe,cAAuC,IAAI;;;ADuDnE,SAEE,OAAAC,MAFF,QAAAC,aAAA;AArDJ,IAAI,iBAAiB;AAErB,IAAM,kBAAkB,MAAc;AACpC,SAAO,SAAS,EAAE,cAAc,IAAI,KAAK,IAAI,CAAC;AAChD;AAEO,IAAM,gBAA8C,CAAC;AAAA,EAC1D;AAAA,EACA,WAAW;AAAA,EACX,kBAAkB;AAAA,EAClB;AACF,MAAM;AACJ,QAAM,CAAC,QAAQ,SAAS,IAAIC,UAAsB,CAAC,CAAC;AAEpD,QAAM,eAAe,YAAY,CAAC,OAAe;AAC/C,cAAU,CAAC,SAAS,KAAK,OAAO,CAAC,UAAU,MAAM,OAAO,EAAE,CAAC;AAAA,EAC7D,GAAG,CAAC,CAAC;AAEL,QAAM,mBAAmB,YAAY,MAAM;AACzC,cAAU,CAAC,CAAC;AAAA,EACd,GAAG,CAAC,CAAC;AAEL,QAAM,WAAW;AAAA,IACf,CAAC,YAAkC;AACjC,YAAM,KAAK,gBAAgB;AAC3B,YAAM,WAAW,QAAQ,YAAY;AAErC,YAAM,WAAsB;AAAA,QAC1B;AAAA,QACA,SAAS,QAAQ,WAAW;AAAA,QAC5B,SAAS,QAAQ;AAAA,QACjB,MAAM,QAAQ;AAAA,QACd;AAAA,MACF;AAEA,gBAAU,CAAC,SAAS,CAAC,GAAG,MAAM,QAAQ,CAAC;AAEvC,aAAO;AAAA,IACT;AAAA,IACA,CAAC,eAAe;AAAA,EAClB;AAEA,QAAM,eAAe;AAAA,IACnB,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAAA,IACA,CAAC,QAAQ,UAAU,cAAc,gBAAgB;AAAA,EACnD;AAEA,SACE,gBAAAD,MAAC,aAAa,UAAb,EAAsB,OAAO,cAC3B;AAAA;AAAA,IACD,gBAAAD;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA;AAAA,QACA;AAAA,QACA,WAAW;AAAA;AAAA,IACb;AAAA,KACF;AAEJ;;;AEpEA,SAAS,YAAY,eAAAG,oBAAmB;AAiCjC,IAAM,WAAW,MAAsB;AAC5C,QAAM,UAAU,WAAW,YAAY;AAEvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,8CAA8C;AAAA,EAChE;AAEA,QAAM,EAAE,UAAU,cAAc,iBAAiB,IAAI;AAErD,QAAM,QAAQC;AAAA,IACZ,CAAC,YAAkC;AACjC,aAAO,SAAS,OAAO;AAAA,IACzB;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,UAAUA;AAAA,IACd,CACE,SACA,YACW;AACX,aAAO,SAAS,EAAE,GAAG,SAAS,SAAS,SAAS,UAAU,CAAC;AAAA,IAC7D;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,OAAOA;AAAA,IACX,CACE,SACA,YACW;AACX,aAAO,SAAS,EAAE,GAAG,SAAS,SAAS,SAAS,OAAO,CAAC;AAAA,IAC1D;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,UAAUA;AAAA,IACd,CACE,SACA,YACW;AACX,aAAO,SAAS,EAAE,GAAG,SAAS,SAAS,SAAS,UAAU,CAAC;AAAA,IAC7D;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,QAAQA;AAAA,IACZ,CACE,SACA,YACW;AACX,aAAO,SAAS,EAAE,GAAG,SAAS,SAAS,SAAS,QAAQ,CAAC;AAAA,IAC3D;AAAA,IACA,CAAC,QAAQ;AAAA,EACX;AAEA,QAAM,UAAUA;AAAA,IACd,CAAC,OAAqB;AACpB,mBAAa,EAAE;AAAA,IACjB;AAAA,IACA,CAAC,YAAY;AAAA,EACf;AAEA,QAAM,aAAaA,aAAY,MAAY;AACzC,qBAAiB;AAAA,EACnB,GAAG,CAAC,gBAAgB,CAAC;AAErB,SAAO;AAAA,IACL;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF;AACF;","names":["jsx","View","jsx","jsx","useDesignSystem","jsx","useDesignSystem","useState","jsx","jsxs","useState","useCallback","useCallback"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@xsolla/xui-toast",
3
- "version": "0.127.0",
3
+ "version": "0.128.0",
4
4
  "main": "./web/index.js",
5
5
  "module": "./web/index.mjs",
6
6
  "types": "./web/index.d.ts",
@@ -14,9 +14,9 @@
14
14
  "test:coverage": "vitest run --coverage"
15
15
  },
16
16
  "dependencies": {
17
- "@xsolla/xui-core": "0.127.0",
18
- "@xsolla/xui-icons": "0.127.0",
19
- "@xsolla/xui-primitives-core": "0.127.0"
17
+ "@xsolla/xui-core": "0.128.0",
18
+ "@xsolla/xui-icons": "0.128.0",
19
+ "@xsolla/xui-primitives-core": "0.128.0"
20
20
  },
21
21
  "peerDependencies": {
22
22
  "react": ">=16.8.0",
package/web/index.d.mts CHANGED
@@ -15,6 +15,7 @@ interface ToastProps {
15
15
  variant?: ToastVariant;
16
16
  message: string;
17
17
  icon?: ReactNode;
18
+ duration?: number;
18
19
  onClose?: () => void;
19
20
  }
20
21
  interface ToastOptions {
@@ -26,6 +27,7 @@ interface ToastOptions {
26
27
  interface ToastGroupProps {
27
28
  toasts: ToastData[];
28
29
  position?: ToastPosition;
30
+ maxWidth?: number;
29
31
  onDismiss: (id: string) => void;
30
32
  }
31
33
  interface ToastContextType {
@@ -38,11 +40,12 @@ interface ToastProviderProps {
38
40
  children: ReactNode;
39
41
  position?: ToastPosition;
40
42
  defaultDuration?: number;
43
+ maxWidth?: number;
41
44
  }
42
45
 
43
46
  declare const Toast: React__default.FC<ToastProps>;
44
47
 
45
- declare const ToastGroup: React__default.MemoExoticComponent<({ toasts, position, onDismiss }: ToastGroupProps) => React__default.ReactPortal | null>;
48
+ declare const ToastGroup: React__default.MemoExoticComponent<({ toasts, position, maxWidth, onDismiss }: ToastGroupProps) => React__default.ReactPortal | null>;
46
49
 
47
50
  declare const ToastProvider: React__default.FC<ToastProviderProps>;
48
51
 
package/web/index.d.ts CHANGED
@@ -15,6 +15,7 @@ interface ToastProps {
15
15
  variant?: ToastVariant;
16
16
  message: string;
17
17
  icon?: ReactNode;
18
+ duration?: number;
18
19
  onClose?: () => void;
19
20
  }
20
21
  interface ToastOptions {
@@ -26,6 +27,7 @@ interface ToastOptions {
26
27
  interface ToastGroupProps {
27
28
  toasts: ToastData[];
28
29
  position?: ToastPosition;
30
+ maxWidth?: number;
29
31
  onDismiss: (id: string) => void;
30
32
  }
31
33
  interface ToastContextType {
@@ -38,11 +40,12 @@ interface ToastProviderProps {
38
40
  children: ReactNode;
39
41
  position?: ToastPosition;
40
42
  defaultDuration?: number;
43
+ maxWidth?: number;
41
44
  }
42
45
 
43
46
  declare const Toast: React__default.FC<ToastProps>;
44
47
 
45
- declare const ToastGroup: React__default.MemoExoticComponent<({ toasts, position, onDismiss }: ToastGroupProps) => React__default.ReactPortal | null>;
48
+ declare const ToastGroup: React__default.MemoExoticComponent<({ toasts, position, maxWidth, onDismiss }: ToastGroupProps) => React__default.ReactPortal | null>;
46
49
 
47
50
  declare const ToastProvider: React__default.FC<ToastProviderProps>;
48
51
 
package/web/index.js CHANGED
@@ -38,6 +38,9 @@ __export(index_exports, {
38
38
  });
39
39
  module.exports = __toCommonJS(index_exports);
40
40
 
41
+ // src/Toast.tsx
42
+ var import_react2 = require("react");
43
+
41
44
  // ../primitives-web/src/Box.tsx
42
45
  var import_react = __toESM(require("react"));
43
46
  var import_styled_components = __toESM(require("styled-components"));
@@ -290,15 +293,33 @@ var getIconColor = (variant, colors) => {
290
293
  return colors.content.inverse;
291
294
  }
292
295
  };
296
+ var ANIMATION_DURATION = 200;
293
297
  var Toast = ({
294
298
  id,
295
299
  variant = "info",
296
300
  message,
297
301
  icon,
302
+ duration,
298
303
  onClose
299
304
  }) => {
300
305
  const { theme } = (0, import_xui_core.useDesignSystem)();
301
306
  const config = theme.sizing.toast();
307
+ const [visible, setVisible] = (0, import_react2.useState)(false);
308
+ const [dismissing, setDismissing] = (0, import_react2.useState)(false);
309
+ (0, import_react2.useEffect)(() => {
310
+ const frame = requestAnimationFrame(() => setVisible(true));
311
+ return () => cancelAnimationFrame(frame);
312
+ }, []);
313
+ const handleClose = () => {
314
+ if (dismissing) return;
315
+ setDismissing(true);
316
+ setTimeout(() => onClose?.(), ANIMATION_DURATION);
317
+ };
318
+ (0, import_react2.useEffect)(() => {
319
+ if (!duration || duration <= 0) return;
320
+ const timer = setTimeout(handleClose, duration);
321
+ return () => clearTimeout(timer);
322
+ }, [duration]);
302
323
  const iconColor = getIconColor(variant, theme.colors);
303
324
  const displayIcon = icon !== void 0 ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { size: config.iconSize, color: iconColor, children: icon }) : getDefaultIcon(variant, config.iconSize, iconColor);
304
325
  return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
@@ -316,6 +337,11 @@ var Toast = ({
316
337
  role: "alert",
317
338
  "aria-live": "polite",
318
339
  "data-toast-id": id,
340
+ style: {
341
+ opacity: visible && !dismissing ? 1 : 0,
342
+ transform: visible && !dismissing ? "translateY(0)" : "translateY(-8px)",
343
+ transition: `opacity ${ANIMATION_DURATION}ms ease-out, transform ${ANIMATION_DURATION}ms ease-out`
344
+ },
319
345
  children: [
320
346
  /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
321
347
  Box,
@@ -342,7 +368,7 @@ var Toast = ({
342
368
  onClose && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
343
369
  Box,
344
370
  {
345
- onPress: onClose,
371
+ onPress: handleClose,
346
372
  width: config.closeButtonSize,
347
373
  height: config.closeButtonSize,
348
374
  alignItems: "center",
@@ -360,12 +386,12 @@ var Toast = ({
360
386
  Toast.displayName = "Toast";
361
387
 
362
388
  // src/ToastGroup.web.tsx
363
- var import_react2 = require("react");
389
+ var import_react3 = require("react");
364
390
  var import_react_dom = __toESM(require("react-dom"));
365
391
  var import_xui_core2 = require("@xsolla/xui-core");
366
392
  var import_jsx_runtime5 = require("react/jsx-runtime");
367
- var ToastGroup = (0, import_react2.memo)(
368
- ({ toasts, position = "top", onDismiss }) => {
393
+ var ToastGroup = (0, import_react3.memo)(
394
+ ({ toasts, position = "top", maxWidth, onDismiss }) => {
369
395
  const { theme } = (0, import_xui_core2.useDesignSystem)();
370
396
  const config = theme.sizing.toast();
371
397
  if (toasts.length === 0 || typeof document === "undefined") {
@@ -388,7 +414,7 @@ var ToastGroup = (0, import_react2.memo)(
388
414
  Box,
389
415
  {
390
416
  width: "100%",
391
- maxWidth: config.maxWidth,
417
+ maxWidth,
392
418
  gap: config.groupGap,
393
419
  flexDirection: "column",
394
420
  children: toasts.map((toast) => /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
@@ -398,6 +424,7 @@ var ToastGroup = (0, import_react2.memo)(
398
424
  variant: toast.variant,
399
425
  message: toast.message,
400
426
  icon: toast.icon,
427
+ duration: toast.duration,
401
428
  onClose: () => onDismiss(toast.id)
402
429
  },
403
430
  toast.id
@@ -413,11 +440,11 @@ var ToastGroup = (0, import_react2.memo)(
413
440
  ToastGroup.displayName = "ToastGroup";
414
441
 
415
442
  // src/ToastProvider.tsx
416
- var import_react4 = require("react");
443
+ var import_react5 = require("react");
417
444
 
418
445
  // src/ToastContext.tsx
419
- var import_react3 = require("react");
420
- var ToastContext = (0, import_react3.createContext)(null);
446
+ var import_react4 = require("react");
447
+ var ToastContext = (0, import_react4.createContext)(null);
421
448
 
422
449
  // src/ToastProvider.tsx
423
450
  var import_jsx_runtime6 = require("react/jsx-runtime");
@@ -428,31 +455,17 @@ var generateToastId = () => {
428
455
  var ToastProvider = ({
429
456
  children,
430
457
  position = "top",
431
- defaultDuration = 5e3
458
+ defaultDuration = 5e3,
459
+ maxWidth
432
460
  }) => {
433
- const [toasts, setToasts] = (0, import_react4.useState)([]);
434
- const timersRef = (0, import_react4.useRef)(
435
- /* @__PURE__ */ new Map()
436
- );
437
- const clearTimer = (0, import_react4.useCallback)((id) => {
438
- const timer = timersRef.current.get(id);
439
- if (timer) {
440
- clearTimeout(timer);
441
- timersRef.current.delete(id);
442
- }
461
+ const [toasts, setToasts] = (0, import_react5.useState)([]);
462
+ const dismissToast = (0, import_react5.useCallback)((id) => {
463
+ setToasts((prev) => prev.filter((toast) => toast.id !== id));
443
464
  }, []);
444
- const dismissToast = (0, import_react4.useCallback)(
445
- (id) => {
446
- clearTimer(id);
447
- setToasts((prev) => prev.filter((toast) => toast.id !== id));
448
- },
449
- [clearTimer]
450
- );
451
- const dismissAllToasts = (0, import_react4.useCallback)(() => {
452
- timersRef.current.forEach((_, id) => clearTimer(id));
465
+ const dismissAllToasts = (0, import_react5.useCallback)(() => {
453
466
  setToasts([]);
454
- }, [clearTimer]);
455
- const addToast = (0, import_react4.useCallback)(
467
+ }, []);
468
+ const addToast = (0, import_react5.useCallback)(
456
469
  (options) => {
457
470
  const id = generateToastId();
458
471
  const duration = options.duration ?? defaultDuration;
@@ -464,23 +477,11 @@ var ToastProvider = ({
464
477
  duration
465
478
  };
466
479
  setToasts((prev) => [...prev, newToast]);
467
- if (duration > 0) {
468
- const timer = setTimeout(() => {
469
- dismissToast(id);
470
- }, duration);
471
- timersRef.current.set(id, timer);
472
- }
473
480
  return id;
474
481
  },
475
- [defaultDuration, dismissToast]
482
+ [defaultDuration]
476
483
  );
477
- (0, import_react4.useEffect)(() => {
478
- return () => {
479
- timersRef.current.forEach((timer) => clearTimeout(timer));
480
- timersRef.current.clear();
481
- };
482
- }, []);
483
- const contextValue = (0, import_react4.useMemo)(
484
+ const contextValue = (0, import_react5.useMemo)(
484
485
  () => ({
485
486
  toasts,
486
487
  addToast,
@@ -496,6 +497,7 @@ var ToastProvider = ({
496
497
  {
497
498
  toasts,
498
499
  position,
500
+ maxWidth,
499
501
  onDismiss: dismissToast
500
502
  }
501
503
  )
@@ -503,50 +505,50 @@ var ToastProvider = ({
503
505
  };
504
506
 
505
507
  // src/useToast.ts
506
- var import_react5 = require("react");
508
+ var import_react6 = require("react");
507
509
  var useToast = () => {
508
- const context = (0, import_react5.useContext)(ToastContext);
510
+ const context = (0, import_react6.useContext)(ToastContext);
509
511
  if (!context) {
510
512
  throw new Error("useToast must be used within a ToastProvider");
511
513
  }
512
514
  const { addToast, dismissToast, dismissAllToasts } = context;
513
- const toast = (0, import_react5.useCallback)(
515
+ const toast = (0, import_react6.useCallback)(
514
516
  (options) => {
515
517
  return addToast(options);
516
518
  },
517
519
  [addToast]
518
520
  );
519
- const success = (0, import_react5.useCallback)(
521
+ const success = (0, import_react6.useCallback)(
520
522
  (message, options) => {
521
523
  return addToast({ ...options, message, variant: "success" });
522
524
  },
523
525
  [addToast]
524
526
  );
525
- const info = (0, import_react5.useCallback)(
527
+ const info = (0, import_react6.useCallback)(
526
528
  (message, options) => {
527
529
  return addToast({ ...options, message, variant: "info" });
528
530
  },
529
531
  [addToast]
530
532
  );
531
- const warning = (0, import_react5.useCallback)(
533
+ const warning = (0, import_react6.useCallback)(
532
534
  (message, options) => {
533
535
  return addToast({ ...options, message, variant: "warning" });
534
536
  },
535
537
  [addToast]
536
538
  );
537
- const error = (0, import_react5.useCallback)(
539
+ const error = (0, import_react6.useCallback)(
538
540
  (message, options) => {
539
541
  return addToast({ ...options, message, variant: "error" });
540
542
  },
541
543
  [addToast]
542
544
  );
543
- const dismiss = (0, import_react5.useCallback)(
545
+ const dismiss = (0, import_react6.useCallback)(
544
546
  (id) => {
545
547
  dismissToast(id);
546
548
  },
547
549
  [dismissToast]
548
550
  );
549
- const dismissAll = (0, import_react5.useCallback)(() => {
551
+ const dismissAll = (0, import_react6.useCallback)(() => {
550
552
  dismissAllToasts();
551
553
  }, [dismissAllToasts]);
552
554
  return {