@xsolla/xui-tooltip 0.171.2 → 0.171.3-pr344.1781565307
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.
- package/native/index.d.mts +1 -1
- package/native/index.d.ts +1 -1
- package/native/index.js +51 -21
- package/native/index.js.map +1 -1
- package/native/index.mjs +51 -21
- package/native/index.mjs.map +1 -1
- package/package.json +4 -4
- package/web/index.d.mts +1 -1
- package/web/index.d.ts +1 -1
- package/web/index.js +51 -21
- package/web/index.js.map +1 -1
- package/web/index.mjs +51 -21
- package/web/index.mjs.map +1 -1
package/native/index.d.mts
CHANGED
|
@@ -46,6 +46,6 @@ interface TooltipProps {
|
|
|
46
46
|
testID?: string;
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & ThemeOverrideProps & React.RefAttributes<
|
|
49
|
+
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & ThemeOverrideProps & React.RefAttributes<HTMLDivElement>>;
|
|
50
50
|
|
|
51
51
|
export { Tooltip, type TooltipPlacement, type TooltipProps, type TooltipSize };
|
package/native/index.d.ts
CHANGED
|
@@ -46,6 +46,6 @@ interface TooltipProps {
|
|
|
46
46
|
testID?: string;
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & ThemeOverrideProps & React.RefAttributes<
|
|
49
|
+
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & ThemeOverrideProps & React.RefAttributes<HTMLDivElement>>;
|
|
50
50
|
|
|
51
51
|
export { Tooltip, type TooltipPlacement, type TooltipProps, type TooltipSize };
|
package/native/index.js
CHANGED
|
@@ -277,6 +277,7 @@ var Portal = ({ children }) => {
|
|
|
277
277
|
|
|
278
278
|
// src/Tooltip.tsx
|
|
279
279
|
var import_jsx_runtime4 = require("react/jsx-runtime");
|
|
280
|
+
var TOOLTIP_OPEN_EVENT = "xui-tooltip-open";
|
|
280
281
|
var getPositionStyles = (triggerRect, placement, offset, isVisible) => {
|
|
281
282
|
const slideDistance = 8;
|
|
282
283
|
const scale = isVisible ? "scale(1)" : "scale(0.95)";
|
|
@@ -393,7 +394,11 @@ var Tooltip = (0, import_react.forwardRef)(
|
|
|
393
394
|
}, ref) => {
|
|
394
395
|
const [isHovered, setIsHovered] = (0, import_react.useState)(false);
|
|
395
396
|
const [triggerRect, setTriggerRect] = (0, import_react.useState)(null);
|
|
396
|
-
const { theme } = (0, import_xui_core.useResolvedTheme)({
|
|
397
|
+
const { theme: resolvedTheme } = (0, import_xui_core.useResolvedTheme)({
|
|
398
|
+
themeMode,
|
|
399
|
+
themeProductContext
|
|
400
|
+
});
|
|
401
|
+
const theme = resolvedTheme;
|
|
397
402
|
const enterTimeoutRef = (0, import_react.useRef)(null);
|
|
398
403
|
const leaveTimeoutRef = (0, import_react.useRef)(null);
|
|
399
404
|
const rafRef = (0, import_react.useRef)(null);
|
|
@@ -401,6 +406,24 @@ var Tooltip = (0, import_react.forwardRef)(
|
|
|
401
406
|
const tooltipId = (0, import_xui_core.useId)();
|
|
402
407
|
const modalId = (0, import_xui_core.useModalId)();
|
|
403
408
|
const isVisible = controlledVisible !== void 0 ? controlledVisible : isHovered;
|
|
409
|
+
const clearPendingVisibilityUpdates = () => {
|
|
410
|
+
if (enterTimeoutRef.current) {
|
|
411
|
+
clearTimeout(enterTimeoutRef.current);
|
|
412
|
+
enterTimeoutRef.current = null;
|
|
413
|
+
}
|
|
414
|
+
if (leaveTimeoutRef.current) {
|
|
415
|
+
clearTimeout(leaveTimeoutRef.current);
|
|
416
|
+
leaveTimeoutRef.current = null;
|
|
417
|
+
}
|
|
418
|
+
if (rafRef.current) {
|
|
419
|
+
cancelAnimationFrame(rafRef.current);
|
|
420
|
+
rafRef.current = null;
|
|
421
|
+
}
|
|
422
|
+
};
|
|
423
|
+
const forceHideTooltip = () => {
|
|
424
|
+
clearPendingVisibilityUpdates();
|
|
425
|
+
setIsHovered(false);
|
|
426
|
+
};
|
|
404
427
|
const positionStyles = (0, import_react.useMemo)(
|
|
405
428
|
() => triggerRect ? getPositionStyles(triggerRect, placement, offset, isVisible) : { top: 0, left: 0 },
|
|
406
429
|
[triggerRect, placement, offset, isVisible]
|
|
@@ -424,9 +447,11 @@ var Tooltip = (0, import_react.forwardRef)(
|
|
|
424
447
|
};
|
|
425
448
|
}, [isVisible]);
|
|
426
449
|
const showTooltip = () => {
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
450
|
+
clearPendingVisibilityUpdates();
|
|
451
|
+
if (!import_xui_core.isNative && typeof document !== "undefined") {
|
|
452
|
+
document.dispatchEvent(
|
|
453
|
+
new CustomEvent(TOOLTIP_OPEN_EVENT, { detail: { tooltipId } })
|
|
454
|
+
);
|
|
430
455
|
}
|
|
431
456
|
if (triggerRef.current) {
|
|
432
457
|
setTriggerRect(triggerRef.current.getBoundingClientRect());
|
|
@@ -444,14 +469,7 @@ var Tooltip = (0, import_react.forwardRef)(
|
|
|
444
469
|
}
|
|
445
470
|
};
|
|
446
471
|
const hideTooltip = () => {
|
|
447
|
-
|
|
448
|
-
clearTimeout(enterTimeoutRef.current);
|
|
449
|
-
enterTimeoutRef.current = null;
|
|
450
|
-
}
|
|
451
|
-
if (rafRef.current) {
|
|
452
|
-
cancelAnimationFrame(rafRef.current);
|
|
453
|
-
rafRef.current = null;
|
|
454
|
-
}
|
|
472
|
+
clearPendingVisibilityUpdates();
|
|
455
473
|
if (delayLeave > 0) {
|
|
456
474
|
leaveTimeoutRef.current = setTimeout(() => {
|
|
457
475
|
setIsHovered(false);
|
|
@@ -464,21 +482,33 @@ var Tooltip = (0, import_react.forwardRef)(
|
|
|
464
482
|
if (import_xui_core.isNative) return;
|
|
465
483
|
const handleEscape = (event) => {
|
|
466
484
|
if (event.key === "Escape" && isVisible) {
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
485
|
+
forceHideTooltip();
|
|
486
|
+
}
|
|
487
|
+
};
|
|
488
|
+
const handleVisibilityChange = () => {
|
|
489
|
+
if (document.visibilityState === "hidden") {
|
|
490
|
+
forceHideTooltip();
|
|
491
|
+
}
|
|
492
|
+
};
|
|
493
|
+
const handleTooltipOpen = (event) => {
|
|
494
|
+
const { tooltipId: activeTooltipId } = event.detail ?? {};
|
|
495
|
+
if (activeTooltipId !== tooltipId) {
|
|
496
|
+
forceHideTooltip();
|
|
472
497
|
}
|
|
473
498
|
};
|
|
474
499
|
document.addEventListener("keydown", handleEscape);
|
|
500
|
+
document.addEventListener("visibilitychange", handleVisibilityChange);
|
|
501
|
+
document.addEventListener(TOOLTIP_OPEN_EVENT, handleTooltipOpen);
|
|
475
502
|
return () => {
|
|
476
503
|
document.removeEventListener("keydown", handleEscape);
|
|
477
|
-
|
|
478
|
-
|
|
479
|
-
|
|
504
|
+
document.removeEventListener(
|
|
505
|
+
"visibilitychange",
|
|
506
|
+
handleVisibilityChange
|
|
507
|
+
);
|
|
508
|
+
document.removeEventListener(TOOLTIP_OPEN_EVENT, handleTooltipOpen);
|
|
509
|
+
clearPendingVisibilityUpdates();
|
|
480
510
|
};
|
|
481
|
-
}, [isVisible]);
|
|
511
|
+
}, [isVisible, tooltipId]);
|
|
482
512
|
return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
|
|
483
513
|
Box,
|
|
484
514
|
{
|
package/native/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/index.tsx","../../src/Tooltip.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../src/Portal.native.tsx"],"sourcesContent":["export * from \"./Tooltip\";\nexport * from \"./types\";\n","import React, { forwardRef, useState, useMemo, useEffect, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n isNative,\n useModalId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport type { TooltipPlacement, TooltipProps, TooltipSize } from \"./types\";\nimport { Portal } from \"./Portal\";\n\nconst getPositionStyles = (\n triggerRect: DOMRect,\n placement: TooltipPlacement,\n offset: number,\n isVisible: boolean\n) => {\n const slideDistance = 8;\n const scale = isVisible ? \"scale(1)\" : \"scale(0.95)\";\n const slideOffset = isVisible ? 0 : -slideDistance;\n\n switch (placement) {\n case \"top\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left + triggerRect.width / 2,\n transform: `translateX(-50%) translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"top-left\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.right,\n transform: `translateX(-100%) translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"top-right\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left,\n transform: `translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"bottom\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.left + triggerRect.width / 2,\n transform: `translateX(-50%) translateY(${slideOffset}px) ${scale}`,\n };\n case \"bottom-left\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.right,\n transform: `translateX(-100%) translateY(${slideOffset}px) ${scale}`,\n };\n case \"bottom-right\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.left,\n transform: `translateY(${slideOffset}px) ${scale}`,\n };\n case \"left\":\n return {\n top: triggerRect.top + triggerRect.height / 2,\n left: triggerRect.left - offset,\n transform: `translateX(calc(-100% - ${slideOffset}px)) translateY(-50%) ${scale}`,\n };\n case \"right\":\n return {\n top: triggerRect.top + triggerRect.height / 2,\n left: triggerRect.right + offset,\n transform: `translateX(${slideOffset}px) translateY(-50%) ${scale}`,\n };\n default:\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left,\n transform: `translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n }\n};\n\nconst getTypoStyles = (size: TooltipSize) => {\n switch (size) {\n case \"sm\":\n return { fontSize: 14, lineHeight: \"16px\" };\n case \"md\":\n return { fontSize: 16, lineHeight: \"18px\" };\n case \"lg\":\n return { fontSize: 18, lineHeight: \"20px\" };\n case \"xl\":\n return { fontSize: 20, lineHeight: \"22px\" };\n default:\n return { fontSize: 16, lineHeight: \"18px\" };\n }\n};\n\nconst getArrowStyles = (placement: TooltipPlacement) => {\n const ARROW_SIZE = 10;\n const ARROW_HALF = ARROW_SIZE / 2;\n const ARROW_EDGE_OFFSET = 12;\n\n const base: React.CSSProperties = {\n width: ARROW_SIZE,\n height: ARROW_SIZE,\n transform: \"rotate(45deg)\",\n borderRadius: 1,\n };\n\n const placementStyles: Record<TooltipPlacement, React.CSSProperties> = {\n top: { bottom: -ARROW_HALF, left: \"50%\", marginLeft: -ARROW_HALF },\n \"top-left\": { bottom: -ARROW_HALF, right: ARROW_EDGE_OFFSET },\n \"top-right\": { bottom: -ARROW_HALF, left: ARROW_EDGE_OFFSET },\n\n bottom: { top: -ARROW_HALF, left: \"50%\", marginLeft: -ARROW_HALF },\n \"bottom-left\": { top: -ARROW_HALF, right: ARROW_EDGE_OFFSET },\n \"bottom-right\": { top: -ARROW_HALF, left: ARROW_EDGE_OFFSET },\n\n left: { right: -ARROW_HALF, top: \"50%\", marginTop: -ARROW_HALF },\n right: { left: -ARROW_HALF, top: \"50%\", marginTop: -ARROW_HALF },\n };\n\n return { ...base, ...placementStyles[placement] };\n};\n\nexport const Tooltip = forwardRef<any, TooltipProps & ThemeOverrideProps>(\n (\n {\n content,\n children,\n size = \"md\",\n delayEnter = 0,\n delayLeave = 0,\n offset = 12,\n placement = \"top\",\n controlledVisible,\n style,\n \"data-testid\": dataTestId,\n className,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [isHovered, setIsHovered] = useState(false);\n const [triggerRect, setTriggerRect] = useState<DOMRect | null>(null);\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const enterTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const leaveTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const rafRef = useRef<number | null>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const tooltipId = useId();\n const modalId = useModalId();\n\n const isVisible =\n controlledVisible !== undefined ? controlledVisible : isHovered;\n\n const positionStyles = useMemo(\n () =>\n triggerRect\n ? getPositionStyles(triggerRect, placement, offset, isVisible)\n : { top: 0, left: 0 },\n [triggerRect, placement, offset, isVisible]\n );\n const typoStyles = useMemo(() => getTypoStyles(size), [size]);\n const borderRadius = (theme.shape.tooltip[size] ?? theme.shape.tooltip.md)\n .borderRadius;\n const arrowStyles = useMemo(() => getArrowStyles(placement), [placement]);\n\n // Update trigger position when tooltip becomes visible and on scroll/resize\n useEffect(() => {\n if (!isVisible || isNative) return;\n\n const updatePosition = () => {\n if (triggerRef.current) {\n setTriggerRect(triggerRef.current.getBoundingClientRect());\n }\n };\n\n updatePosition();\n\n window.addEventListener(\"scroll\", updatePosition, true);\n window.addEventListener(\"resize\", updatePosition);\n\n return () => {\n window.removeEventListener(\"scroll\", updatePosition, true);\n window.removeEventListener(\"resize\", updatePosition);\n };\n }, [isVisible]);\n\n const showTooltip = () => {\n if (leaveTimeoutRef.current) {\n clearTimeout(leaveTimeoutRef.current);\n leaveTimeoutRef.current = null;\n }\n\n // Update position before showing to prevent pop-in\n if (triggerRef.current) {\n setTriggerRect(triggerRef.current.getBoundingClientRect());\n\n // Double RAF to ensure position is rendered before showing tooltip\n rafRef.current = requestAnimationFrame(() => {\n rafRef.current = requestAnimationFrame(() => {\n if (delayEnter > 0) {\n enterTimeoutRef.current = setTimeout(() => {\n setIsHovered(true);\n }, delayEnter);\n } else {\n setIsHovered(true);\n }\n });\n });\n }\n };\n\n const hideTooltip = () => {\n if (enterTimeoutRef.current) {\n clearTimeout(enterTimeoutRef.current);\n enterTimeoutRef.current = null;\n }\n\n if (rafRef.current) {\n cancelAnimationFrame(rafRef.current);\n rafRef.current = null;\n }\n\n if (delayLeave > 0) {\n leaveTimeoutRef.current = setTimeout(() => {\n setIsHovered(false);\n }, delayLeave);\n } else {\n setIsHovered(false);\n }\n };\n\n useEffect(() => {\n if (isNative) return;\n\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\" && isVisible) {\n if (enterTimeoutRef.current) {\n clearTimeout(enterTimeoutRef.current);\n enterTimeoutRef.current = null;\n }\n setIsHovered(false);\n }\n };\n\n document.addEventListener(\"keydown\", handleEscape);\n\n return () => {\n document.removeEventListener(\"keydown\", handleEscape);\n if (enterTimeoutRef.current) clearTimeout(enterTimeoutRef.current);\n if (leaveTimeoutRef.current) clearTimeout(leaveTimeoutRef.current);\n if (rafRef.current) cancelAnimationFrame(rafRef.current);\n };\n }, [isVisible]);\n\n return (\n <Box\n testID={testID}\n ref={triggerRef}\n position=\"relative\"\n display=\"inline-flex\"\n onMouseEnter={showTooltip}\n onMouseLeave={hideTooltip}\n onFocus={showTooltip}\n onBlur={hideTooltip}\n className={className}\n style={{ height: \"fit-content\" }}\n aria-describedby={isVisible ? tooltipId : undefined}\n >\n {children}\n {!isNative && triggerRect && (\n <Portal>\n <Box\n ref={ref}\n data-testid={dataTestId}\n data-modal-id={modalId}\n position=\"fixed\"\n backgroundColor={theme.colors.background.primary}\n borderRadius={borderRadius}\n paddingVertical={8}\n paddingHorizontal={12}\n zIndex={2000}\n id={tooltipId}\n role=\"tooltip\"\n aria-hidden={!isVisible}\n style={{\n ...positionStyles,\n // https://stackoverflow.com/questions/62844007/how-to-apply-tool-tip-arrow-triangle-shadow\n filter:\n \"drop-shadow(0 6px 10px rgba(7, 7, 8, 0.1)) drop-shadow(0 2px 3px rgba(7, 7, 8, 0.2))\",\n WebkitFilter:\n \"drop-shadow(0 6px 10px rgba(7, 7, 8, 0.1)) drop-shadow(0 2px 3px rgba(7, 7, 8, 0.2))\",\n opacity: isVisible ? 1 : 0,\n visibility: isVisible ? \"visible\" : \"hidden\",\n transition:\n \"opacity 150ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1), visibility 150ms cubic-bezier(.4,0,.2,1)\",\n pointerEvents: \"none\",\n whiteSpace: \"normal\",\n width: \"max-content\",\n overflow: \"visible\",\n willChange: isVisible ? \"transform, opacity\" : \"auto\", // optimize rendering and ensure more stable positioning\n ...style,\n }}\n >\n <Box\n position=\"absolute\"\n backgroundColor={theme.colors.background.primary}\n style={{\n ...arrowStyles,\n backfaceVisibility: \"hidden\",\n WebkitBackfaceVisibility: \"hidden\",\n }}\n />\n <Box\n style={{\n wordWrap: \"break-word\",\n overflowWrap: \"break-word\",\n maxWidth: \"100%\",\n whiteSpace: \"normal\",\n }}\n >\n {typeof content === \"string\" || typeof content === \"number\" ? (\n <Text\n color={theme.colors.content.primary}\n fontSize={typoStyles.fontSize}\n fontWeight=\"400\"\n style={{ lineHeight: typoStyles.lineHeight }}\n >\n {content}\n </Text>\n ) : (\n content\n )}\n </Box>\n </Box>\n </Portal>\n )}\n </Box>\n );\n }\n);\n\nTooltip.displayName = \"Tooltip\";\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 minWidth,\n minHeight,\n maxWidth,\n maxHeight,\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 minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight 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 testID,\n \"data-testid\": dataTestId,\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: color ?? incomingStyle?.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={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import { ReactNode } from \"react\";\n\ninterface PortalProps {\n children: ReactNode;\n}\n\n// Portal not supported on React Native - tooltip content renders inline\nexport const Portal = ({ children }: PortalProps) => {\n return <>{children}</>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAwE;;;ACCxE,0BAQO;AA2ID;AAxIC,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;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;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;;;AC/LA,IAAAA,uBAKO;AAqEH,IAAAC,sBAAA;AAlEJ,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;AAAA,EACA,eAAe;AAAA,EACf,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,gCAAW,QAAQ,SAAS;AAElD,QAAM,YAAuB;AAAA,IAC3B,OAAO,SAAS,eAAe;AAAA,IAC/B,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;AAAA,IAAC,qBAAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA,QAAQ,cAAc,UAAU;AAAA,MAChC;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;;;AFjFA,sBAMO;;;AGDE,IAAAC,sBAAA;AADF,IAAM,SAAS,CAAC,EAAE,SAAS,MAAmB;AACnD,SAAO,6EAAG,UAAS;AACrB;;;AH0QY,IAAAC,sBAAA;AAtQZ,IAAM,oBAAoB,CACxB,aACA,WACA,QACA,cACG;AACH,QAAM,gBAAgB;AACtB,QAAM,QAAQ,YAAY,aAAa;AACvC,QAAM,cAAc,YAAY,IAAI,CAAC;AAErC,UAAQ,WAAW;AAAA,IACjB,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM;AAAA,QACvB,MAAM,YAAY,OAAO,YAAY,QAAQ;AAAA,QAC7C,WAAW,4CAA4C,WAAW,QAAQ,KAAK;AAAA,MACjF;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM;AAAA,QACvB,MAAM,YAAY;AAAA,QAClB,WAAW,6CAA6C,WAAW,QAAQ,KAAK;AAAA,MAClF;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM;AAAA,QACvB,MAAM,YAAY;AAAA,QAClB,WAAW,2BAA2B,WAAW,QAAQ,KAAK;AAAA,MAChE;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,SAAS;AAAA,QAC1B,MAAM,YAAY,OAAO,YAAY,QAAQ;AAAA,QAC7C,WAAW,+BAA+B,WAAW,OAAO,KAAK;AAAA,MACnE;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,SAAS;AAAA,QAC1B,MAAM,YAAY;AAAA,QAClB,WAAW,gCAAgC,WAAW,OAAO,KAAK;AAAA,MACpE;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,SAAS;AAAA,QAC1B,MAAM,YAAY;AAAA,QAClB,WAAW,cAAc,WAAW,OAAO,KAAK;AAAA,MAClD;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM,YAAY,SAAS;AAAA,QAC5C,MAAM,YAAY,OAAO;AAAA,QACzB,WAAW,2BAA2B,WAAW,yBAAyB,KAAK;AAAA,MACjF;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM,YAAY,SAAS;AAAA,QAC5C,MAAM,YAAY,QAAQ;AAAA,QAC1B,WAAW,cAAc,WAAW,wBAAwB,KAAK;AAAA,MACnE;AAAA,IACF;AACE,aAAO;AAAA,QACL,KAAK,YAAY,MAAM;AAAA,QACvB,MAAM,YAAY;AAAA,QAClB,WAAW,2BAA2B,WAAW,QAAQ,KAAK;AAAA,MAChE;AAAA,EACJ;AACF;AAEA,IAAM,gBAAgB,CAAC,SAAsB;AAC3C,UAAQ,MAAM;AAAA,IACZ,KAAK;AACH,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,IAC5C,KAAK;AACH,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,IAC5C,KAAK;AACH,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,IAC5C,KAAK;AACH,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,IAC5C;AACE,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,EAC9C;AACF;AAEA,IAAM,iBAAiB,CAAC,cAAgC;AACtD,QAAM,aAAa;AACnB,QAAM,aAAa,aAAa;AAChC,QAAM,oBAAoB;AAE1B,QAAM,OAA4B;AAAA,IAChC,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,cAAc;AAAA,EAChB;AAEA,QAAM,kBAAiE;AAAA,IACrE,KAAK,EAAE,QAAQ,CAAC,YAAY,MAAM,OAAO,YAAY,CAAC,WAAW;AAAA,IACjE,YAAY,EAAE,QAAQ,CAAC,YAAY,OAAO,kBAAkB;AAAA,IAC5D,aAAa,EAAE,QAAQ,CAAC,YAAY,MAAM,kBAAkB;AAAA,IAE5D,QAAQ,EAAE,KAAK,CAAC,YAAY,MAAM,OAAO,YAAY,CAAC,WAAW;AAAA,IACjE,eAAe,EAAE,KAAK,CAAC,YAAY,OAAO,kBAAkB;AAAA,IAC5D,gBAAgB,EAAE,KAAK,CAAC,YAAY,MAAM,kBAAkB;AAAA,IAE5D,MAAM,EAAE,OAAO,CAAC,YAAY,KAAK,OAAO,WAAW,CAAC,WAAW;AAAA,IAC/D,OAAO,EAAE,MAAM,CAAC,YAAY,KAAK,OAAO,WAAW,CAAC,WAAW;AAAA,EACjE;AAEA,SAAO,EAAE,GAAG,MAAM,GAAG,gBAAgB,SAAS,EAAE;AAClD;AAEO,IAAM,cAAU;AAAA,EACrB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,aAAa;AAAA,IACb,aAAa;AAAA,IACb,SAAS;AAAA,IACT,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,UAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAChD,UAAM,CAAC,aAAa,cAAc,QAAI,uBAAyB,IAAI;AACnE,UAAM,EAAE,MAAM,QAAI,kCAAiB,EAAE,WAAW,oBAAoB,CAAC;AACrE,UAAM,sBAAkB,qBAA6C,IAAI;AACzE,UAAM,sBAAkB,qBAA6C,IAAI;AACzE,UAAM,aAAS,qBAAsB,IAAI;AACzC,UAAM,iBAAa,qBAAuB,IAAI;AAC9C,UAAM,gBAAY,uBAAM;AACxB,UAAM,cAAU,4BAAW;AAE3B,UAAM,YACJ,sBAAsB,SAAY,oBAAoB;AAExD,UAAM,qBAAiB;AAAA,MACrB,MACE,cACI,kBAAkB,aAAa,WAAW,QAAQ,SAAS,IAC3D,EAAE,KAAK,GAAG,MAAM,EAAE;AAAA,MACxB,CAAC,aAAa,WAAW,QAAQ,SAAS;AAAA,IAC5C;AACA,UAAM,iBAAa,sBAAQ,MAAM,cAAc,IAAI,GAAG,CAAC,IAAI,CAAC;AAC5D,UAAM,gBAAgB,MAAM,MAAM,QAAQ,IAAI,KAAK,MAAM,MAAM,QAAQ,IACpE;AACH,UAAM,kBAAc,sBAAQ,MAAM,eAAe,SAAS,GAAG,CAAC,SAAS,CAAC;AAGxE,gCAAU,MAAM;AACd,UAAI,CAAC,aAAa,yBAAU;AAE5B,YAAM,iBAAiB,MAAM;AAC3B,YAAI,WAAW,SAAS;AACtB,yBAAe,WAAW,QAAQ,sBAAsB,CAAC;AAAA,QAC3D;AAAA,MACF;AAEA,qBAAe;AAEf,aAAO,iBAAiB,UAAU,gBAAgB,IAAI;AACtD,aAAO,iBAAiB,UAAU,cAAc;AAEhD,aAAO,MAAM;AACX,eAAO,oBAAoB,UAAU,gBAAgB,IAAI;AACzD,eAAO,oBAAoB,UAAU,cAAc;AAAA,MACrD;AAAA,IACF,GAAG,CAAC,SAAS,CAAC;AAEd,UAAM,cAAc,MAAM;AACxB,UAAI,gBAAgB,SAAS;AAC3B,qBAAa,gBAAgB,OAAO;AACpC,wBAAgB,UAAU;AAAA,MAC5B;AAGA,UAAI,WAAW,SAAS;AACtB,uBAAe,WAAW,QAAQ,sBAAsB,CAAC;AAGzD,eAAO,UAAU,sBAAsB,MAAM;AAC3C,iBAAO,UAAU,sBAAsB,MAAM;AAC3C,gBAAI,aAAa,GAAG;AAClB,8BAAgB,UAAU,WAAW,MAAM;AACzC,6BAAa,IAAI;AAAA,cACnB,GAAG,UAAU;AAAA,YACf,OAAO;AACL,2BAAa,IAAI;AAAA,YACnB;AAAA,UACF,CAAC;AAAA,QACH,CAAC;AAAA,MACH;AAAA,IACF;AAEA,UAAM,cAAc,MAAM;AACxB,UAAI,gBAAgB,SAAS;AAC3B,qBAAa,gBAAgB,OAAO;AACpC,wBAAgB,UAAU;AAAA,MAC5B;AAEA,UAAI,OAAO,SAAS;AAClB,6BAAqB,OAAO,OAAO;AACnC,eAAO,UAAU;AAAA,MACnB;AAEA,UAAI,aAAa,GAAG;AAClB,wBAAgB,UAAU,WAAW,MAAM;AACzC,uBAAa,KAAK;AAAA,QACpB,GAAG,UAAU;AAAA,MACf,OAAO;AACL,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF;AAEA,gCAAU,MAAM;AACd,UAAI,yBAAU;AAEd,YAAM,eAAe,CAAC,UAAyB;AAC7C,YAAI,MAAM,QAAQ,YAAY,WAAW;AACvC,cAAI,gBAAgB,SAAS;AAC3B,yBAAa,gBAAgB,OAAO;AACpC,4BAAgB,UAAU;AAAA,UAC5B;AACA,uBAAa,KAAK;AAAA,QACpB;AAAA,MACF;AAEA,eAAS,iBAAiB,WAAW,YAAY;AAEjD,aAAO,MAAM;AACX,iBAAS,oBAAoB,WAAW,YAAY;AACpD,YAAI,gBAAgB,QAAS,cAAa,gBAAgB,OAAO;AACjE,YAAI,gBAAgB,QAAS,cAAa,gBAAgB,OAAO;AACjE,YAAI,OAAO,QAAS,sBAAqB,OAAO,OAAO;AAAA,MACzD;AAAA,IACF,GAAG,CAAC,SAAS,CAAC;AAEd,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,KAAK;AAAA,QACL,UAAS;AAAA,QACT,SAAQ;AAAA,QACR,cAAc;AAAA,QACd,cAAc;AAAA,QACd,SAAS;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,QACA,OAAO,EAAE,QAAQ,cAAc;AAAA,QAC/B,oBAAkB,YAAY,YAAY;AAAA,QAEzC;AAAA;AAAA,UACA,CAAC,4BAAY,eACZ,6CAAC,UACC;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA,eAAa;AAAA,cACb,iBAAe;AAAA,cACf,UAAS;AAAA,cACT,iBAAiB,MAAM,OAAO,WAAW;AAAA,cACzC;AAAA,cACA,iBAAiB;AAAA,cACjB,mBAAmB;AAAA,cACnB,QAAQ;AAAA,cACR,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,eAAa,CAAC;AAAA,cACd,OAAO;AAAA,gBACL,GAAG;AAAA;AAAA,gBAEH,QACE;AAAA,gBACF,cACE;AAAA,gBACF,SAAS,YAAY,IAAI;AAAA,gBACzB,YAAY,YAAY,YAAY;AAAA,gBACpC,YACE;AAAA,gBACF,eAAe;AAAA,gBACf,YAAY;AAAA,gBACZ,OAAO;AAAA,gBACP,UAAU;AAAA,gBACV,YAAY,YAAY,uBAAuB;AAAA;AAAA,gBAC/C,GAAG;AAAA,cACL;AAAA,cAEA;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACC,UAAS;AAAA,oBACT,iBAAiB,MAAM,OAAO,WAAW;AAAA,oBACzC,OAAO;AAAA,sBACL,GAAG;AAAA,sBACH,oBAAoB;AAAA,sBACpB,0BAA0B;AAAA,oBAC5B;AAAA;AAAA,gBACF;AAAA,gBACA;AAAA,kBAAC;AAAA;AAAA,oBACC,OAAO;AAAA,sBACL,UAAU;AAAA,sBACV,cAAc;AAAA,sBACd,UAAU;AAAA,sBACV,YAAY;AAAA,oBACd;AAAA,oBAEC,iBAAO,YAAY,YAAY,OAAO,YAAY,WACjD;AAAA,sBAAC;AAAA;AAAA,wBACC,OAAO,MAAM,OAAO,QAAQ;AAAA,wBAC5B,UAAU,WAAW;AAAA,wBACrB,YAAW;AAAA,wBACX,OAAO,EAAE,YAAY,WAAW,WAAW;AAAA,wBAE1C;AAAA;AAAA,oBACH,IAEA;AAAA;AAAA,gBAEJ;AAAA;AAAA;AAAA,UACF,GACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;","names":["import_react_native","import_jsx_runtime","RNText","import_jsx_runtime","import_jsx_runtime"]}
|
|
1
|
+
{"version":3,"sources":["../../src/index.tsx","../../src/Tooltip.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../src/Portal.native.tsx"],"sourcesContent":["export * from \"./Tooltip\";\nexport * from \"./types\";\n","import React, { forwardRef, useState, useMemo, useEffect, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n isNative,\n useModalId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport type { TooltipPlacement, TooltipProps, TooltipSize } from \"./types\";\nimport { Portal } from \"./Portal\";\n\nconst TOOLTIP_OPEN_EVENT = \"xui-tooltip-open\";\ntype TooltipTheme = {\n colors: {\n background: {\n primary: string;\n };\n content: {\n primary: string;\n };\n };\n shape: {\n tooltip: Record<TooltipSize, { borderRadius: number | string }>;\n };\n};\n\nconst getPositionStyles = (\n triggerRect: DOMRect,\n placement: TooltipPlacement,\n offset: number,\n isVisible: boolean\n) => {\n const slideDistance = 8;\n const scale = isVisible ? \"scale(1)\" : \"scale(0.95)\";\n const slideOffset = isVisible ? 0 : -slideDistance;\n\n switch (placement) {\n case \"top\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left + triggerRect.width / 2,\n transform: `translateX(-50%) translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"top-left\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.right,\n transform: `translateX(-100%) translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"top-right\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left,\n transform: `translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"bottom\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.left + triggerRect.width / 2,\n transform: `translateX(-50%) translateY(${slideOffset}px) ${scale}`,\n };\n case \"bottom-left\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.right,\n transform: `translateX(-100%) translateY(${slideOffset}px) ${scale}`,\n };\n case \"bottom-right\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.left,\n transform: `translateY(${slideOffset}px) ${scale}`,\n };\n case \"left\":\n return {\n top: triggerRect.top + triggerRect.height / 2,\n left: triggerRect.left - offset,\n transform: `translateX(calc(-100% - ${slideOffset}px)) translateY(-50%) ${scale}`,\n };\n case \"right\":\n return {\n top: triggerRect.top + triggerRect.height / 2,\n left: triggerRect.right + offset,\n transform: `translateX(${slideOffset}px) translateY(-50%) ${scale}`,\n };\n default:\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left,\n transform: `translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n }\n};\n\nconst getTypoStyles = (size: TooltipSize) => {\n switch (size) {\n case \"sm\":\n return { fontSize: 14, lineHeight: \"16px\" };\n case \"md\":\n return { fontSize: 16, lineHeight: \"18px\" };\n case \"lg\":\n return { fontSize: 18, lineHeight: \"20px\" };\n case \"xl\":\n return { fontSize: 20, lineHeight: \"22px\" };\n default:\n return { fontSize: 16, lineHeight: \"18px\" };\n }\n};\n\nconst getArrowStyles = (placement: TooltipPlacement) => {\n const ARROW_SIZE = 10;\n const ARROW_HALF = ARROW_SIZE / 2;\n const ARROW_EDGE_OFFSET = 12;\n\n const base: React.CSSProperties = {\n width: ARROW_SIZE,\n height: ARROW_SIZE,\n transform: \"rotate(45deg)\",\n borderRadius: 1,\n };\n\n const placementStyles: Record<TooltipPlacement, React.CSSProperties> = {\n top: { bottom: -ARROW_HALF, left: \"50%\", marginLeft: -ARROW_HALF },\n \"top-left\": { bottom: -ARROW_HALF, right: ARROW_EDGE_OFFSET },\n \"top-right\": { bottom: -ARROW_HALF, left: ARROW_EDGE_OFFSET },\n\n bottom: { top: -ARROW_HALF, left: \"50%\", marginLeft: -ARROW_HALF },\n \"bottom-left\": { top: -ARROW_HALF, right: ARROW_EDGE_OFFSET },\n \"bottom-right\": { top: -ARROW_HALF, left: ARROW_EDGE_OFFSET },\n\n left: { right: -ARROW_HALF, top: \"50%\", marginTop: -ARROW_HALF },\n right: { left: -ARROW_HALF, top: \"50%\", marginTop: -ARROW_HALF },\n };\n\n return { ...base, ...placementStyles[placement] };\n};\n\nexport const Tooltip = forwardRef<\n HTMLDivElement,\n TooltipProps & ThemeOverrideProps\n>(\n (\n {\n content,\n children,\n size = \"md\",\n delayEnter = 0,\n delayLeave = 0,\n offset = 12,\n placement = \"top\",\n controlledVisible,\n style,\n \"data-testid\": dataTestId,\n className,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [isHovered, setIsHovered] = useState(false);\n const [triggerRect, setTriggerRect] = useState<DOMRect | null>(null);\n const { theme: resolvedTheme } = useResolvedTheme({\n themeMode,\n themeProductContext,\n });\n const theme = resolvedTheme as TooltipTheme;\n const enterTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const leaveTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const rafRef = useRef<number | null>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const tooltipId = useId();\n const modalId = useModalId();\n\n const isVisible =\n controlledVisible !== undefined ? controlledVisible : isHovered;\n\n const clearPendingVisibilityUpdates = () => {\n if (enterTimeoutRef.current) {\n clearTimeout(enterTimeoutRef.current);\n enterTimeoutRef.current = null;\n }\n\n if (leaveTimeoutRef.current) {\n clearTimeout(leaveTimeoutRef.current);\n leaveTimeoutRef.current = null;\n }\n\n if (rafRef.current) {\n cancelAnimationFrame(rafRef.current);\n rafRef.current = null;\n }\n };\n\n const forceHideTooltip = () => {\n clearPendingVisibilityUpdates();\n setIsHovered(false);\n };\n\n const positionStyles = useMemo(\n () =>\n triggerRect\n ? getPositionStyles(triggerRect, placement, offset, isVisible)\n : { top: 0, left: 0 },\n [triggerRect, placement, offset, isVisible]\n );\n const typoStyles = useMemo(() => getTypoStyles(size), [size]);\n const borderRadius = (theme.shape.tooltip[size] ?? theme.shape.tooltip.md)\n .borderRadius;\n const arrowStyles = useMemo(() => getArrowStyles(placement), [placement]);\n\n // Update trigger position when tooltip becomes visible and on scroll/resize\n useEffect(() => {\n if (!isVisible || isNative) return;\n\n const updatePosition = () => {\n if (triggerRef.current) {\n setTriggerRect(triggerRef.current.getBoundingClientRect());\n }\n };\n\n updatePosition();\n\n window.addEventListener(\"scroll\", updatePosition, true);\n window.addEventListener(\"resize\", updatePosition);\n\n return () => {\n window.removeEventListener(\"scroll\", updatePosition, true);\n window.removeEventListener(\"resize\", updatePosition);\n };\n }, [isVisible]);\n\n const showTooltip = () => {\n clearPendingVisibilityUpdates();\n\n if (!isNative && typeof document !== \"undefined\") {\n document.dispatchEvent(\n new CustomEvent(TOOLTIP_OPEN_EVENT, { detail: { tooltipId } })\n );\n }\n\n // Update position before showing to prevent pop-in\n if (triggerRef.current) {\n setTriggerRect(triggerRef.current.getBoundingClientRect());\n\n // Double RAF to ensure position is rendered before showing tooltip\n rafRef.current = requestAnimationFrame(() => {\n rafRef.current = requestAnimationFrame(() => {\n if (delayEnter > 0) {\n enterTimeoutRef.current = setTimeout(() => {\n setIsHovered(true);\n }, delayEnter);\n } else {\n setIsHovered(true);\n }\n });\n });\n }\n };\n\n const hideTooltip = () => {\n clearPendingVisibilityUpdates();\n\n if (delayLeave > 0) {\n leaveTimeoutRef.current = setTimeout(() => {\n setIsHovered(false);\n }, delayLeave);\n } else {\n setIsHovered(false);\n }\n };\n\n useEffect(() => {\n if (isNative) return;\n\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\" && isVisible) {\n forceHideTooltip();\n }\n };\n\n const handleVisibilityChange = () => {\n if (document.visibilityState === \"hidden\") {\n forceHideTooltip();\n }\n };\n\n const handleTooltipOpen = (event: Event) => {\n const { tooltipId: activeTooltipId } =\n (event as CustomEvent).detail ?? {};\n\n if (activeTooltipId !== tooltipId) {\n forceHideTooltip();\n }\n };\n\n document.addEventListener(\"keydown\", handleEscape);\n document.addEventListener(\"visibilitychange\", handleVisibilityChange);\n document.addEventListener(TOOLTIP_OPEN_EVENT, handleTooltipOpen);\n\n return () => {\n document.removeEventListener(\"keydown\", handleEscape);\n document.removeEventListener(\n \"visibilitychange\",\n handleVisibilityChange\n );\n document.removeEventListener(TOOLTIP_OPEN_EVENT, handleTooltipOpen);\n clearPendingVisibilityUpdates();\n };\n }, [isVisible, tooltipId]);\n\n return (\n <Box\n testID={testID}\n ref={triggerRef}\n position=\"relative\"\n display=\"inline-flex\"\n onMouseEnter={showTooltip}\n onMouseLeave={hideTooltip}\n onFocus={showTooltip}\n onBlur={hideTooltip}\n className={className}\n style={{ height: \"fit-content\" }}\n aria-describedby={isVisible ? tooltipId : undefined}\n >\n {children}\n {!isNative && triggerRect && (\n <Portal>\n <Box\n ref={ref}\n data-testid={dataTestId}\n data-modal-id={modalId}\n position=\"fixed\"\n backgroundColor={theme.colors.background.primary}\n borderRadius={borderRadius}\n paddingVertical={8}\n paddingHorizontal={12}\n zIndex={2000}\n id={tooltipId}\n role=\"tooltip\"\n aria-hidden={!isVisible}\n style={{\n ...positionStyles,\n // https://stackoverflow.com/questions/62844007/how-to-apply-tool-tip-arrow-triangle-shadow\n filter:\n \"drop-shadow(0 6px 10px rgba(7, 7, 8, 0.1)) drop-shadow(0 2px 3px rgba(7, 7, 8, 0.2))\",\n WebkitFilter:\n \"drop-shadow(0 6px 10px rgba(7, 7, 8, 0.1)) drop-shadow(0 2px 3px rgba(7, 7, 8, 0.2))\",\n opacity: isVisible ? 1 : 0,\n visibility: isVisible ? \"visible\" : \"hidden\",\n transition:\n \"opacity 150ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1), visibility 150ms cubic-bezier(.4,0,.2,1)\",\n pointerEvents: \"none\",\n whiteSpace: \"normal\",\n width: \"max-content\",\n overflow: \"visible\",\n willChange: isVisible ? \"transform, opacity\" : \"auto\", // optimize rendering and ensure more stable positioning\n ...style,\n }}\n >\n <Box\n position=\"absolute\"\n backgroundColor={theme.colors.background.primary}\n style={{\n ...arrowStyles,\n backfaceVisibility: \"hidden\",\n WebkitBackfaceVisibility: \"hidden\",\n }}\n />\n <Box\n style={{\n wordWrap: \"break-word\",\n overflowWrap: \"break-word\",\n maxWidth: \"100%\",\n whiteSpace: \"normal\",\n }}\n >\n {typeof content === \"string\" || typeof content === \"number\" ? (\n <Text\n color={theme.colors.content.primary}\n fontSize={typoStyles.fontSize}\n fontWeight=\"400\"\n style={{ lineHeight: typoStyles.lineHeight }}\n >\n {content}\n </Text>\n ) : (\n content\n )}\n </Box>\n </Box>\n </Portal>\n )}\n </Box>\n );\n }\n);\n\nTooltip.displayName = \"Tooltip\";\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 minWidth,\n minHeight,\n maxWidth,\n maxHeight,\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 minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight 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 testID,\n \"data-testid\": dataTestId,\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: color ?? incomingStyle?.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={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import { ReactNode } from \"react\";\n\ninterface PortalProps {\n children: ReactNode;\n}\n\n// Portal not supported on React Native - tooltip content renders inline\nexport const Portal = ({ children }: PortalProps) => {\n return <>{children}</>;\n};\n"],"mappings":";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;;;ACAA,mBAAwE;;;ACCxE,0BAQO;AA2ID;AAxIC,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;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;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;;;AC/LA,IAAAA,uBAKO;AAqEH,IAAAC,sBAAA;AAlEJ,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;AAAA,EACA,eAAe;AAAA,EACf,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,gCAAW,QAAQ,SAAS;AAElD,QAAM,YAAuB;AAAA,IAC3B,OAAO,SAAS,eAAe;AAAA,IAC/B,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;AAAA,IAAC,qBAAAC;AAAA,IAAA;AAAA,MACC,OAAO;AAAA,MACP;AAAA,MACA,QAAQ,cAAc,UAAU;AAAA,MAChC;AAAA,MAEC;AAAA;AAAA,EACH;AAEJ;;;AFjFA,sBAMO;;;AGDE,IAAAC,sBAAA;AADF,IAAM,SAAS,CAAC,EAAE,SAAS,MAAmB;AACnD,SAAO,6EAAG,UAAS;AACrB;;;AHiUY,IAAAC,sBAAA;AA7TZ,IAAM,qBAAqB;AAe3B,IAAM,oBAAoB,CACxB,aACA,WACA,QACA,cACG;AACH,QAAM,gBAAgB;AACtB,QAAM,QAAQ,YAAY,aAAa;AACvC,QAAM,cAAc,YAAY,IAAI,CAAC;AAErC,UAAQ,WAAW;AAAA,IACjB,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM;AAAA,QACvB,MAAM,YAAY,OAAO,YAAY,QAAQ;AAAA,QAC7C,WAAW,4CAA4C,WAAW,QAAQ,KAAK;AAAA,MACjF;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM;AAAA,QACvB,MAAM,YAAY;AAAA,QAClB,WAAW,6CAA6C,WAAW,QAAQ,KAAK;AAAA,MAClF;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM;AAAA,QACvB,MAAM,YAAY;AAAA,QAClB,WAAW,2BAA2B,WAAW,QAAQ,KAAK;AAAA,MAChE;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,SAAS;AAAA,QAC1B,MAAM,YAAY,OAAO,YAAY,QAAQ;AAAA,QAC7C,WAAW,+BAA+B,WAAW,OAAO,KAAK;AAAA,MACnE;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,SAAS;AAAA,QAC1B,MAAM,YAAY;AAAA,QAClB,WAAW,gCAAgC,WAAW,OAAO,KAAK;AAAA,MACpE;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,SAAS;AAAA,QAC1B,MAAM,YAAY;AAAA,QAClB,WAAW,cAAc,WAAW,OAAO,KAAK;AAAA,MAClD;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM,YAAY,SAAS;AAAA,QAC5C,MAAM,YAAY,OAAO;AAAA,QACzB,WAAW,2BAA2B,WAAW,yBAAyB,KAAK;AAAA,MACjF;AAAA,IACF,KAAK;AACH,aAAO;AAAA,QACL,KAAK,YAAY,MAAM,YAAY,SAAS;AAAA,QAC5C,MAAM,YAAY,QAAQ;AAAA,QAC1B,WAAW,cAAc,WAAW,wBAAwB,KAAK;AAAA,MACnE;AAAA,IACF;AACE,aAAO;AAAA,QACL,KAAK,YAAY,MAAM;AAAA,QACvB,MAAM,YAAY;AAAA,QAClB,WAAW,2BAA2B,WAAW,QAAQ,KAAK;AAAA,MAChE;AAAA,EACJ;AACF;AAEA,IAAM,gBAAgB,CAAC,SAAsB;AAC3C,UAAQ,MAAM;AAAA,IACZ,KAAK;AACH,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,IAC5C,KAAK;AACH,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,IAC5C,KAAK;AACH,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,IAC5C,KAAK;AACH,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,IAC5C;AACE,aAAO,EAAE,UAAU,IAAI,YAAY,OAAO;AAAA,EAC9C;AACF;AAEA,IAAM,iBAAiB,CAAC,cAAgC;AACtD,QAAM,aAAa;AACnB,QAAM,aAAa,aAAa;AAChC,QAAM,oBAAoB;AAE1B,QAAM,OAA4B;AAAA,IAChC,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,WAAW;AAAA,IACX,cAAc;AAAA,EAChB;AAEA,QAAM,kBAAiE;AAAA,IACrE,KAAK,EAAE,QAAQ,CAAC,YAAY,MAAM,OAAO,YAAY,CAAC,WAAW;AAAA,IACjE,YAAY,EAAE,QAAQ,CAAC,YAAY,OAAO,kBAAkB;AAAA,IAC5D,aAAa,EAAE,QAAQ,CAAC,YAAY,MAAM,kBAAkB;AAAA,IAE5D,QAAQ,EAAE,KAAK,CAAC,YAAY,MAAM,OAAO,YAAY,CAAC,WAAW;AAAA,IACjE,eAAe,EAAE,KAAK,CAAC,YAAY,OAAO,kBAAkB;AAAA,IAC5D,gBAAgB,EAAE,KAAK,CAAC,YAAY,MAAM,kBAAkB;AAAA,IAE5D,MAAM,EAAE,OAAO,CAAC,YAAY,KAAK,OAAO,WAAW,CAAC,WAAW;AAAA,IAC/D,OAAO,EAAE,MAAM,CAAC,YAAY,KAAK,OAAO,WAAW,CAAC,WAAW;AAAA,EACjE;AAEA,SAAO,EAAE,GAAG,MAAM,GAAG,gBAAgB,SAAS,EAAE;AAClD;AAEO,IAAM,cAAU;AAAA,EAIrB,CACE;AAAA,IACE;AAAA,IACA;AAAA,IACA,OAAO;AAAA,IACP,aAAa;AAAA,IACb,aAAa;AAAA,IACb,SAAS;AAAA,IACT,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,IACA,eAAe;AAAA,IACf;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,EACF,GACA,QACG;AACH,UAAM,CAAC,WAAW,YAAY,QAAI,uBAAS,KAAK;AAChD,UAAM,CAAC,aAAa,cAAc,QAAI,uBAAyB,IAAI;AACnE,UAAM,EAAE,OAAO,cAAc,QAAI,kCAAiB;AAAA,MAChD;AAAA,MACA;AAAA,IACF,CAAC;AACD,UAAM,QAAQ;AACd,UAAM,sBAAkB,qBAA6C,IAAI;AACzE,UAAM,sBAAkB,qBAA6C,IAAI;AACzE,UAAM,aAAS,qBAAsB,IAAI;AACzC,UAAM,iBAAa,qBAAuB,IAAI;AAC9C,UAAM,gBAAY,uBAAM;AACxB,UAAM,cAAU,4BAAW;AAE3B,UAAM,YACJ,sBAAsB,SAAY,oBAAoB;AAExD,UAAM,gCAAgC,MAAM;AAC1C,UAAI,gBAAgB,SAAS;AAC3B,qBAAa,gBAAgB,OAAO;AACpC,wBAAgB,UAAU;AAAA,MAC5B;AAEA,UAAI,gBAAgB,SAAS;AAC3B,qBAAa,gBAAgB,OAAO;AACpC,wBAAgB,UAAU;AAAA,MAC5B;AAEA,UAAI,OAAO,SAAS;AAClB,6BAAqB,OAAO,OAAO;AACnC,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAEA,UAAM,mBAAmB,MAAM;AAC7B,oCAA8B;AAC9B,mBAAa,KAAK;AAAA,IACpB;AAEA,UAAM,qBAAiB;AAAA,MACrB,MACE,cACI,kBAAkB,aAAa,WAAW,QAAQ,SAAS,IAC3D,EAAE,KAAK,GAAG,MAAM,EAAE;AAAA,MACxB,CAAC,aAAa,WAAW,QAAQ,SAAS;AAAA,IAC5C;AACA,UAAM,iBAAa,sBAAQ,MAAM,cAAc,IAAI,GAAG,CAAC,IAAI,CAAC;AAC5D,UAAM,gBAAgB,MAAM,MAAM,QAAQ,IAAI,KAAK,MAAM,MAAM,QAAQ,IACpE;AACH,UAAM,kBAAc,sBAAQ,MAAM,eAAe,SAAS,GAAG,CAAC,SAAS,CAAC;AAGxE,gCAAU,MAAM;AACd,UAAI,CAAC,aAAa,yBAAU;AAE5B,YAAM,iBAAiB,MAAM;AAC3B,YAAI,WAAW,SAAS;AACtB,yBAAe,WAAW,QAAQ,sBAAsB,CAAC;AAAA,QAC3D;AAAA,MACF;AAEA,qBAAe;AAEf,aAAO,iBAAiB,UAAU,gBAAgB,IAAI;AACtD,aAAO,iBAAiB,UAAU,cAAc;AAEhD,aAAO,MAAM;AACX,eAAO,oBAAoB,UAAU,gBAAgB,IAAI;AACzD,eAAO,oBAAoB,UAAU,cAAc;AAAA,MACrD;AAAA,IACF,GAAG,CAAC,SAAS,CAAC;AAEd,UAAM,cAAc,MAAM;AACxB,oCAA8B;AAE9B,UAAI,CAAC,4BAAY,OAAO,aAAa,aAAa;AAChD,iBAAS;AAAA,UACP,IAAI,YAAY,oBAAoB,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC;AAAA,QAC/D;AAAA,MACF;AAGA,UAAI,WAAW,SAAS;AACtB,uBAAe,WAAW,QAAQ,sBAAsB,CAAC;AAGzD,eAAO,UAAU,sBAAsB,MAAM;AAC3C,iBAAO,UAAU,sBAAsB,MAAM;AAC3C,gBAAI,aAAa,GAAG;AAClB,8BAAgB,UAAU,WAAW,MAAM;AACzC,6BAAa,IAAI;AAAA,cACnB,GAAG,UAAU;AAAA,YACf,OAAO;AACL,2BAAa,IAAI;AAAA,YACnB;AAAA,UACF,CAAC;AAAA,QACH,CAAC;AAAA,MACH;AAAA,IACF;AAEA,UAAM,cAAc,MAAM;AACxB,oCAA8B;AAE9B,UAAI,aAAa,GAAG;AAClB,wBAAgB,UAAU,WAAW,MAAM;AACzC,uBAAa,KAAK;AAAA,QACpB,GAAG,UAAU;AAAA,MACf,OAAO;AACL,qBAAa,KAAK;AAAA,MACpB;AAAA,IACF;AAEA,gCAAU,MAAM;AACd,UAAI,yBAAU;AAEd,YAAM,eAAe,CAAC,UAAyB;AAC7C,YAAI,MAAM,QAAQ,YAAY,WAAW;AACvC,2BAAiB;AAAA,QACnB;AAAA,MACF;AAEA,YAAM,yBAAyB,MAAM;AACnC,YAAI,SAAS,oBAAoB,UAAU;AACzC,2BAAiB;AAAA,QACnB;AAAA,MACF;AAEA,YAAM,oBAAoB,CAAC,UAAiB;AAC1C,cAAM,EAAE,WAAW,gBAAgB,IAChC,MAAsB,UAAU,CAAC;AAEpC,YAAI,oBAAoB,WAAW;AACjC,2BAAiB;AAAA,QACnB;AAAA,MACF;AAEA,eAAS,iBAAiB,WAAW,YAAY;AACjD,eAAS,iBAAiB,oBAAoB,sBAAsB;AACpE,eAAS,iBAAiB,oBAAoB,iBAAiB;AAE/D,aAAO,MAAM;AACX,iBAAS,oBAAoB,WAAW,YAAY;AACpD,iBAAS;AAAA,UACP;AAAA,UACA;AAAA,QACF;AACA,iBAAS,oBAAoB,oBAAoB,iBAAiB;AAClE,sCAA8B;AAAA,MAChC;AAAA,IACF,GAAG,CAAC,WAAW,SAAS,CAAC;AAEzB,WACE;AAAA,MAAC;AAAA;AAAA,QACC;AAAA,QACA,KAAK;AAAA,QACL,UAAS;AAAA,QACT,SAAQ;AAAA,QACR,cAAc;AAAA,QACd,cAAc;AAAA,QACd,SAAS;AAAA,QACT,QAAQ;AAAA,QACR;AAAA,QACA,OAAO,EAAE,QAAQ,cAAc;AAAA,QAC/B,oBAAkB,YAAY,YAAY;AAAA,QAEzC;AAAA;AAAA,UACA,CAAC,4BAAY,eACZ,6CAAC,UACC;AAAA,YAAC;AAAA;AAAA,cACC;AAAA,cACA,eAAa;AAAA,cACb,iBAAe;AAAA,cACf,UAAS;AAAA,cACT,iBAAiB,MAAM,OAAO,WAAW;AAAA,cACzC;AAAA,cACA,iBAAiB;AAAA,cACjB,mBAAmB;AAAA,cACnB,QAAQ;AAAA,cACR,IAAI;AAAA,cACJ,MAAK;AAAA,cACL,eAAa,CAAC;AAAA,cACd,OAAO;AAAA,gBACL,GAAG;AAAA;AAAA,gBAEH,QACE;AAAA,gBACF,cACE;AAAA,gBACF,SAAS,YAAY,IAAI;AAAA,gBACzB,YAAY,YAAY,YAAY;AAAA,gBACpC,YACE;AAAA,gBACF,eAAe;AAAA,gBACf,YAAY;AAAA,gBACZ,OAAO;AAAA,gBACP,UAAU;AAAA,gBACV,YAAY,YAAY,uBAAuB;AAAA;AAAA,gBAC/C,GAAG;AAAA,cACL;AAAA,cAEA;AAAA;AAAA,kBAAC;AAAA;AAAA,oBACC,UAAS;AAAA,oBACT,iBAAiB,MAAM,OAAO,WAAW;AAAA,oBACzC,OAAO;AAAA,sBACL,GAAG;AAAA,sBACH,oBAAoB;AAAA,sBACpB,0BAA0B;AAAA,oBAC5B;AAAA;AAAA,gBACF;AAAA,gBACA;AAAA,kBAAC;AAAA;AAAA,oBACC,OAAO;AAAA,sBACL,UAAU;AAAA,sBACV,cAAc;AAAA,sBACd,UAAU;AAAA,sBACV,YAAY;AAAA,oBACd;AAAA,oBAEC,iBAAO,YAAY,YAAY,OAAO,YAAY,WACjD;AAAA,sBAAC;AAAA;AAAA,wBACC,OAAO,MAAM,OAAO,QAAQ;AAAA,wBAC5B,UAAU,WAAW;AAAA,wBACrB,YAAW;AAAA,wBACX,OAAO,EAAE,YAAY,WAAW,WAAW;AAAA,wBAE1C;AAAA;AAAA,oBACH,IAEA;AAAA;AAAA,gBAEJ;AAAA;AAAA;AAAA,UACF,GACF;AAAA;AAAA;AAAA,IAEJ;AAAA,EAEJ;AACF;AAEA,QAAQ,cAAc;","names":["import_react_native","import_jsx_runtime","RNText","import_jsx_runtime","import_jsx_runtime"]}
|
package/native/index.mjs
CHANGED
|
@@ -263,6 +263,7 @@ var Portal = ({ children }) => {
|
|
|
263
263
|
|
|
264
264
|
// src/Tooltip.tsx
|
|
265
265
|
import { jsx as jsx4, jsxs } from "react/jsx-runtime";
|
|
266
|
+
var TOOLTIP_OPEN_EVENT = "xui-tooltip-open";
|
|
266
267
|
var getPositionStyles = (triggerRect, placement, offset, isVisible) => {
|
|
267
268
|
const slideDistance = 8;
|
|
268
269
|
const scale = isVisible ? "scale(1)" : "scale(0.95)";
|
|
@@ -379,7 +380,11 @@ var Tooltip = forwardRef(
|
|
|
379
380
|
}, ref) => {
|
|
380
381
|
const [isHovered, setIsHovered] = useState(false);
|
|
381
382
|
const [triggerRect, setTriggerRect] = useState(null);
|
|
382
|
-
const { theme } = useResolvedTheme({
|
|
383
|
+
const { theme: resolvedTheme } = useResolvedTheme({
|
|
384
|
+
themeMode,
|
|
385
|
+
themeProductContext
|
|
386
|
+
});
|
|
387
|
+
const theme = resolvedTheme;
|
|
383
388
|
const enterTimeoutRef = useRef(null);
|
|
384
389
|
const leaveTimeoutRef = useRef(null);
|
|
385
390
|
const rafRef = useRef(null);
|
|
@@ -387,6 +392,24 @@ var Tooltip = forwardRef(
|
|
|
387
392
|
const tooltipId = useId();
|
|
388
393
|
const modalId = useModalId();
|
|
389
394
|
const isVisible = controlledVisible !== void 0 ? controlledVisible : isHovered;
|
|
395
|
+
const clearPendingVisibilityUpdates = () => {
|
|
396
|
+
if (enterTimeoutRef.current) {
|
|
397
|
+
clearTimeout(enterTimeoutRef.current);
|
|
398
|
+
enterTimeoutRef.current = null;
|
|
399
|
+
}
|
|
400
|
+
if (leaveTimeoutRef.current) {
|
|
401
|
+
clearTimeout(leaveTimeoutRef.current);
|
|
402
|
+
leaveTimeoutRef.current = null;
|
|
403
|
+
}
|
|
404
|
+
if (rafRef.current) {
|
|
405
|
+
cancelAnimationFrame(rafRef.current);
|
|
406
|
+
rafRef.current = null;
|
|
407
|
+
}
|
|
408
|
+
};
|
|
409
|
+
const forceHideTooltip = () => {
|
|
410
|
+
clearPendingVisibilityUpdates();
|
|
411
|
+
setIsHovered(false);
|
|
412
|
+
};
|
|
390
413
|
const positionStyles = useMemo(
|
|
391
414
|
() => triggerRect ? getPositionStyles(triggerRect, placement, offset, isVisible) : { top: 0, left: 0 },
|
|
392
415
|
[triggerRect, placement, offset, isVisible]
|
|
@@ -410,9 +433,11 @@ var Tooltip = forwardRef(
|
|
|
410
433
|
};
|
|
411
434
|
}, [isVisible]);
|
|
412
435
|
const showTooltip = () => {
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
436
|
+
clearPendingVisibilityUpdates();
|
|
437
|
+
if (!isNative && typeof document !== "undefined") {
|
|
438
|
+
document.dispatchEvent(
|
|
439
|
+
new CustomEvent(TOOLTIP_OPEN_EVENT, { detail: { tooltipId } })
|
|
440
|
+
);
|
|
416
441
|
}
|
|
417
442
|
if (triggerRef.current) {
|
|
418
443
|
setTriggerRect(triggerRef.current.getBoundingClientRect());
|
|
@@ -430,14 +455,7 @@ var Tooltip = forwardRef(
|
|
|
430
455
|
}
|
|
431
456
|
};
|
|
432
457
|
const hideTooltip = () => {
|
|
433
|
-
|
|
434
|
-
clearTimeout(enterTimeoutRef.current);
|
|
435
|
-
enterTimeoutRef.current = null;
|
|
436
|
-
}
|
|
437
|
-
if (rafRef.current) {
|
|
438
|
-
cancelAnimationFrame(rafRef.current);
|
|
439
|
-
rafRef.current = null;
|
|
440
|
-
}
|
|
458
|
+
clearPendingVisibilityUpdates();
|
|
441
459
|
if (delayLeave > 0) {
|
|
442
460
|
leaveTimeoutRef.current = setTimeout(() => {
|
|
443
461
|
setIsHovered(false);
|
|
@@ -450,21 +468,33 @@ var Tooltip = forwardRef(
|
|
|
450
468
|
if (isNative) return;
|
|
451
469
|
const handleEscape = (event) => {
|
|
452
470
|
if (event.key === "Escape" && isVisible) {
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
471
|
+
forceHideTooltip();
|
|
472
|
+
}
|
|
473
|
+
};
|
|
474
|
+
const handleVisibilityChange = () => {
|
|
475
|
+
if (document.visibilityState === "hidden") {
|
|
476
|
+
forceHideTooltip();
|
|
477
|
+
}
|
|
478
|
+
};
|
|
479
|
+
const handleTooltipOpen = (event) => {
|
|
480
|
+
const { tooltipId: activeTooltipId } = event.detail ?? {};
|
|
481
|
+
if (activeTooltipId !== tooltipId) {
|
|
482
|
+
forceHideTooltip();
|
|
458
483
|
}
|
|
459
484
|
};
|
|
460
485
|
document.addEventListener("keydown", handleEscape);
|
|
486
|
+
document.addEventListener("visibilitychange", handleVisibilityChange);
|
|
487
|
+
document.addEventListener(TOOLTIP_OPEN_EVENT, handleTooltipOpen);
|
|
461
488
|
return () => {
|
|
462
489
|
document.removeEventListener("keydown", handleEscape);
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
490
|
+
document.removeEventListener(
|
|
491
|
+
"visibilitychange",
|
|
492
|
+
handleVisibilityChange
|
|
493
|
+
);
|
|
494
|
+
document.removeEventListener(TOOLTIP_OPEN_EVENT, handleTooltipOpen);
|
|
495
|
+
clearPendingVisibilityUpdates();
|
|
466
496
|
};
|
|
467
|
-
}, [isVisible]);
|
|
497
|
+
}, [isVisible, tooltipId]);
|
|
468
498
|
return /* @__PURE__ */ jsxs(
|
|
469
499
|
Box,
|
|
470
500
|
{
|
package/native/index.mjs.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/Tooltip.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../src/Portal.native.tsx"],"sourcesContent":["import React, { forwardRef, useState, useMemo, useEffect, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n isNative,\n useModalId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport type { TooltipPlacement, TooltipProps, TooltipSize } from \"./types\";\nimport { Portal } from \"./Portal\";\n\nconst getPositionStyles = (\n triggerRect: DOMRect,\n placement: TooltipPlacement,\n offset: number,\n isVisible: boolean\n) => {\n const slideDistance = 8;\n const scale = isVisible ? \"scale(1)\" : \"scale(0.95)\";\n const slideOffset = isVisible ? 0 : -slideDistance;\n\n switch (placement) {\n case \"top\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left + triggerRect.width / 2,\n transform: `translateX(-50%) translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"top-left\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.right,\n transform: `translateX(-100%) translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"top-right\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left,\n transform: `translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"bottom\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.left + triggerRect.width / 2,\n transform: `translateX(-50%) translateY(${slideOffset}px) ${scale}`,\n };\n case \"bottom-left\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.right,\n transform: `translateX(-100%) translateY(${slideOffset}px) ${scale}`,\n };\n case \"bottom-right\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.left,\n transform: `translateY(${slideOffset}px) ${scale}`,\n };\n case \"left\":\n return {\n top: triggerRect.top + triggerRect.height / 2,\n left: triggerRect.left - offset,\n transform: `translateX(calc(-100% - ${slideOffset}px)) translateY(-50%) ${scale}`,\n };\n case \"right\":\n return {\n top: triggerRect.top + triggerRect.height / 2,\n left: triggerRect.right + offset,\n transform: `translateX(${slideOffset}px) translateY(-50%) ${scale}`,\n };\n default:\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left,\n transform: `translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n }\n};\n\nconst getTypoStyles = (size: TooltipSize) => {\n switch (size) {\n case \"sm\":\n return { fontSize: 14, lineHeight: \"16px\" };\n case \"md\":\n return { fontSize: 16, lineHeight: \"18px\" };\n case \"lg\":\n return { fontSize: 18, lineHeight: \"20px\" };\n case \"xl\":\n return { fontSize: 20, lineHeight: \"22px\" };\n default:\n return { fontSize: 16, lineHeight: \"18px\" };\n }\n};\n\nconst getArrowStyles = (placement: TooltipPlacement) => {\n const ARROW_SIZE = 10;\n const ARROW_HALF = ARROW_SIZE / 2;\n const ARROW_EDGE_OFFSET = 12;\n\n const base: React.CSSProperties = {\n width: ARROW_SIZE,\n height: ARROW_SIZE,\n transform: \"rotate(45deg)\",\n borderRadius: 1,\n };\n\n const placementStyles: Record<TooltipPlacement, React.CSSProperties> = {\n top: { bottom: -ARROW_HALF, left: \"50%\", marginLeft: -ARROW_HALF },\n \"top-left\": { bottom: -ARROW_HALF, right: ARROW_EDGE_OFFSET },\n \"top-right\": { bottom: -ARROW_HALF, left: ARROW_EDGE_OFFSET },\n\n bottom: { top: -ARROW_HALF, left: \"50%\", marginLeft: -ARROW_HALF },\n \"bottom-left\": { top: -ARROW_HALF, right: ARROW_EDGE_OFFSET },\n \"bottom-right\": { top: -ARROW_HALF, left: ARROW_EDGE_OFFSET },\n\n left: { right: -ARROW_HALF, top: \"50%\", marginTop: -ARROW_HALF },\n right: { left: -ARROW_HALF, top: \"50%\", marginTop: -ARROW_HALF },\n };\n\n return { ...base, ...placementStyles[placement] };\n};\n\nexport const Tooltip = forwardRef<any, TooltipProps & ThemeOverrideProps>(\n (\n {\n content,\n children,\n size = \"md\",\n delayEnter = 0,\n delayLeave = 0,\n offset = 12,\n placement = \"top\",\n controlledVisible,\n style,\n \"data-testid\": dataTestId,\n className,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [isHovered, setIsHovered] = useState(false);\n const [triggerRect, setTriggerRect] = useState<DOMRect | null>(null);\n const { theme } = useResolvedTheme({ themeMode, themeProductContext });\n const enterTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const leaveTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const rafRef = useRef<number | null>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const tooltipId = useId();\n const modalId = useModalId();\n\n const isVisible =\n controlledVisible !== undefined ? controlledVisible : isHovered;\n\n const positionStyles = useMemo(\n () =>\n triggerRect\n ? getPositionStyles(triggerRect, placement, offset, isVisible)\n : { top: 0, left: 0 },\n [triggerRect, placement, offset, isVisible]\n );\n const typoStyles = useMemo(() => getTypoStyles(size), [size]);\n const borderRadius = (theme.shape.tooltip[size] ?? theme.shape.tooltip.md)\n .borderRadius;\n const arrowStyles = useMemo(() => getArrowStyles(placement), [placement]);\n\n // Update trigger position when tooltip becomes visible and on scroll/resize\n useEffect(() => {\n if (!isVisible || isNative) return;\n\n const updatePosition = () => {\n if (triggerRef.current) {\n setTriggerRect(triggerRef.current.getBoundingClientRect());\n }\n };\n\n updatePosition();\n\n window.addEventListener(\"scroll\", updatePosition, true);\n window.addEventListener(\"resize\", updatePosition);\n\n return () => {\n window.removeEventListener(\"scroll\", updatePosition, true);\n window.removeEventListener(\"resize\", updatePosition);\n };\n }, [isVisible]);\n\n const showTooltip = () => {\n if (leaveTimeoutRef.current) {\n clearTimeout(leaveTimeoutRef.current);\n leaveTimeoutRef.current = null;\n }\n\n // Update position before showing to prevent pop-in\n if (triggerRef.current) {\n setTriggerRect(triggerRef.current.getBoundingClientRect());\n\n // Double RAF to ensure position is rendered before showing tooltip\n rafRef.current = requestAnimationFrame(() => {\n rafRef.current = requestAnimationFrame(() => {\n if (delayEnter > 0) {\n enterTimeoutRef.current = setTimeout(() => {\n setIsHovered(true);\n }, delayEnter);\n } else {\n setIsHovered(true);\n }\n });\n });\n }\n };\n\n const hideTooltip = () => {\n if (enterTimeoutRef.current) {\n clearTimeout(enterTimeoutRef.current);\n enterTimeoutRef.current = null;\n }\n\n if (rafRef.current) {\n cancelAnimationFrame(rafRef.current);\n rafRef.current = null;\n }\n\n if (delayLeave > 0) {\n leaveTimeoutRef.current = setTimeout(() => {\n setIsHovered(false);\n }, delayLeave);\n } else {\n setIsHovered(false);\n }\n };\n\n useEffect(() => {\n if (isNative) return;\n\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\" && isVisible) {\n if (enterTimeoutRef.current) {\n clearTimeout(enterTimeoutRef.current);\n enterTimeoutRef.current = null;\n }\n setIsHovered(false);\n }\n };\n\n document.addEventListener(\"keydown\", handleEscape);\n\n return () => {\n document.removeEventListener(\"keydown\", handleEscape);\n if (enterTimeoutRef.current) clearTimeout(enterTimeoutRef.current);\n if (leaveTimeoutRef.current) clearTimeout(leaveTimeoutRef.current);\n if (rafRef.current) cancelAnimationFrame(rafRef.current);\n };\n }, [isVisible]);\n\n return (\n <Box\n testID={testID}\n ref={triggerRef}\n position=\"relative\"\n display=\"inline-flex\"\n onMouseEnter={showTooltip}\n onMouseLeave={hideTooltip}\n onFocus={showTooltip}\n onBlur={hideTooltip}\n className={className}\n style={{ height: \"fit-content\" }}\n aria-describedby={isVisible ? tooltipId : undefined}\n >\n {children}\n {!isNative && triggerRect && (\n <Portal>\n <Box\n ref={ref}\n data-testid={dataTestId}\n data-modal-id={modalId}\n position=\"fixed\"\n backgroundColor={theme.colors.background.primary}\n borderRadius={borderRadius}\n paddingVertical={8}\n paddingHorizontal={12}\n zIndex={2000}\n id={tooltipId}\n role=\"tooltip\"\n aria-hidden={!isVisible}\n style={{\n ...positionStyles,\n // https://stackoverflow.com/questions/62844007/how-to-apply-tool-tip-arrow-triangle-shadow\n filter:\n \"drop-shadow(0 6px 10px rgba(7, 7, 8, 0.1)) drop-shadow(0 2px 3px rgba(7, 7, 8, 0.2))\",\n WebkitFilter:\n \"drop-shadow(0 6px 10px rgba(7, 7, 8, 0.1)) drop-shadow(0 2px 3px rgba(7, 7, 8, 0.2))\",\n opacity: isVisible ? 1 : 0,\n visibility: isVisible ? \"visible\" : \"hidden\",\n transition:\n \"opacity 150ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1), visibility 150ms cubic-bezier(.4,0,.2,1)\",\n pointerEvents: \"none\",\n whiteSpace: \"normal\",\n width: \"max-content\",\n overflow: \"visible\",\n willChange: isVisible ? \"transform, opacity\" : \"auto\", // optimize rendering and ensure more stable positioning\n ...style,\n }}\n >\n <Box\n position=\"absolute\"\n backgroundColor={theme.colors.background.primary}\n style={{\n ...arrowStyles,\n backfaceVisibility: \"hidden\",\n WebkitBackfaceVisibility: \"hidden\",\n }}\n />\n <Box\n style={{\n wordWrap: \"break-word\",\n overflowWrap: \"break-word\",\n maxWidth: \"100%\",\n whiteSpace: \"normal\",\n }}\n >\n {typeof content === \"string\" || typeof content === \"number\" ? (\n <Text\n color={theme.colors.content.primary}\n fontSize={typoStyles.fontSize}\n fontWeight=\"400\"\n style={{ lineHeight: typoStyles.lineHeight }}\n >\n {content}\n </Text>\n ) : (\n content\n )}\n </Box>\n </Box>\n </Portal>\n )}\n </Box>\n );\n }\n);\n\nTooltip.displayName = \"Tooltip\";\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 minWidth,\n minHeight,\n maxWidth,\n maxHeight,\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 minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight 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 testID,\n \"data-testid\": dataTestId,\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: color ?? incomingStyle?.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={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import { ReactNode } from \"react\";\n\ninterface PortalProps {\n children: ReactNode;\n}\n\n// Portal not supported on React Native - tooltip content renders inline\nexport const Portal = ({ children }: PortalProps) => {\n return <>{children}</>;\n};\n"],"mappings":"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","names":["jsx","jsx","jsx"]}
|
|
1
|
+
{"version":3,"sources":["../../src/Tooltip.tsx","../../../../foundation/primitives-native/src/Box.tsx","../../../../foundation/primitives-native/src/Text.tsx","../../src/Portal.native.tsx"],"sourcesContent":["import React, { forwardRef, useState, useMemo, useEffect, useRef } from \"react\";\n// @ts-expect-error - this will be resolved at build time\nimport { Box, Text } from \"@xsolla/xui-primitives\";\nimport {\n useResolvedTheme,\n useId,\n isNative,\n useModalId,\n type ThemeOverrideProps,\n} from \"@xsolla/xui-core\";\nimport type { TooltipPlacement, TooltipProps, TooltipSize } from \"./types\";\nimport { Portal } from \"./Portal\";\n\nconst TOOLTIP_OPEN_EVENT = \"xui-tooltip-open\";\ntype TooltipTheme = {\n colors: {\n background: {\n primary: string;\n };\n content: {\n primary: string;\n };\n };\n shape: {\n tooltip: Record<TooltipSize, { borderRadius: number | string }>;\n };\n};\n\nconst getPositionStyles = (\n triggerRect: DOMRect,\n placement: TooltipPlacement,\n offset: number,\n isVisible: boolean\n) => {\n const slideDistance = 8;\n const scale = isVisible ? \"scale(1)\" : \"scale(0.95)\";\n const slideOffset = isVisible ? 0 : -slideDistance;\n\n switch (placement) {\n case \"top\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left + triggerRect.width / 2,\n transform: `translateX(-50%) translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"top-left\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.right,\n transform: `translateX(-100%) translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"top-right\":\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left,\n transform: `translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n case \"bottom\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.left + triggerRect.width / 2,\n transform: `translateX(-50%) translateY(${slideOffset}px) ${scale}`,\n };\n case \"bottom-left\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.right,\n transform: `translateX(-100%) translateY(${slideOffset}px) ${scale}`,\n };\n case \"bottom-right\":\n return {\n top: triggerRect.bottom + offset,\n left: triggerRect.left,\n transform: `translateY(${slideOffset}px) ${scale}`,\n };\n case \"left\":\n return {\n top: triggerRect.top + triggerRect.height / 2,\n left: triggerRect.left - offset,\n transform: `translateX(calc(-100% - ${slideOffset}px)) translateY(-50%) ${scale}`,\n };\n case \"right\":\n return {\n top: triggerRect.top + triggerRect.height / 2,\n left: triggerRect.right + offset,\n transform: `translateX(${slideOffset}px) translateY(-50%) ${scale}`,\n };\n default:\n return {\n top: triggerRect.top - offset,\n left: triggerRect.left,\n transform: `translateY(calc(-100% - ${slideOffset}px)) ${scale}`,\n };\n }\n};\n\nconst getTypoStyles = (size: TooltipSize) => {\n switch (size) {\n case \"sm\":\n return { fontSize: 14, lineHeight: \"16px\" };\n case \"md\":\n return { fontSize: 16, lineHeight: \"18px\" };\n case \"lg\":\n return { fontSize: 18, lineHeight: \"20px\" };\n case \"xl\":\n return { fontSize: 20, lineHeight: \"22px\" };\n default:\n return { fontSize: 16, lineHeight: \"18px\" };\n }\n};\n\nconst getArrowStyles = (placement: TooltipPlacement) => {\n const ARROW_SIZE = 10;\n const ARROW_HALF = ARROW_SIZE / 2;\n const ARROW_EDGE_OFFSET = 12;\n\n const base: React.CSSProperties = {\n width: ARROW_SIZE,\n height: ARROW_SIZE,\n transform: \"rotate(45deg)\",\n borderRadius: 1,\n };\n\n const placementStyles: Record<TooltipPlacement, React.CSSProperties> = {\n top: { bottom: -ARROW_HALF, left: \"50%\", marginLeft: -ARROW_HALF },\n \"top-left\": { bottom: -ARROW_HALF, right: ARROW_EDGE_OFFSET },\n \"top-right\": { bottom: -ARROW_HALF, left: ARROW_EDGE_OFFSET },\n\n bottom: { top: -ARROW_HALF, left: \"50%\", marginLeft: -ARROW_HALF },\n \"bottom-left\": { top: -ARROW_HALF, right: ARROW_EDGE_OFFSET },\n \"bottom-right\": { top: -ARROW_HALF, left: ARROW_EDGE_OFFSET },\n\n left: { right: -ARROW_HALF, top: \"50%\", marginTop: -ARROW_HALF },\n right: { left: -ARROW_HALF, top: \"50%\", marginTop: -ARROW_HALF },\n };\n\n return { ...base, ...placementStyles[placement] };\n};\n\nexport const Tooltip = forwardRef<\n HTMLDivElement,\n TooltipProps & ThemeOverrideProps\n>(\n (\n {\n content,\n children,\n size = \"md\",\n delayEnter = 0,\n delayLeave = 0,\n offset = 12,\n placement = \"top\",\n controlledVisible,\n style,\n \"data-testid\": dataTestId,\n className,\n testID,\n themeMode,\n themeProductContext,\n },\n ref\n ) => {\n const [isHovered, setIsHovered] = useState(false);\n const [triggerRect, setTriggerRect] = useState<DOMRect | null>(null);\n const { theme: resolvedTheme } = useResolvedTheme({\n themeMode,\n themeProductContext,\n });\n const theme = resolvedTheme as TooltipTheme;\n const enterTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const leaveTimeoutRef = useRef<ReturnType<typeof setTimeout> | null>(null);\n const rafRef = useRef<number | null>(null);\n const triggerRef = useRef<HTMLDivElement>(null);\n const tooltipId = useId();\n const modalId = useModalId();\n\n const isVisible =\n controlledVisible !== undefined ? controlledVisible : isHovered;\n\n const clearPendingVisibilityUpdates = () => {\n if (enterTimeoutRef.current) {\n clearTimeout(enterTimeoutRef.current);\n enterTimeoutRef.current = null;\n }\n\n if (leaveTimeoutRef.current) {\n clearTimeout(leaveTimeoutRef.current);\n leaveTimeoutRef.current = null;\n }\n\n if (rafRef.current) {\n cancelAnimationFrame(rafRef.current);\n rafRef.current = null;\n }\n };\n\n const forceHideTooltip = () => {\n clearPendingVisibilityUpdates();\n setIsHovered(false);\n };\n\n const positionStyles = useMemo(\n () =>\n triggerRect\n ? getPositionStyles(triggerRect, placement, offset, isVisible)\n : { top: 0, left: 0 },\n [triggerRect, placement, offset, isVisible]\n );\n const typoStyles = useMemo(() => getTypoStyles(size), [size]);\n const borderRadius = (theme.shape.tooltip[size] ?? theme.shape.tooltip.md)\n .borderRadius;\n const arrowStyles = useMemo(() => getArrowStyles(placement), [placement]);\n\n // Update trigger position when tooltip becomes visible and on scroll/resize\n useEffect(() => {\n if (!isVisible || isNative) return;\n\n const updatePosition = () => {\n if (triggerRef.current) {\n setTriggerRect(triggerRef.current.getBoundingClientRect());\n }\n };\n\n updatePosition();\n\n window.addEventListener(\"scroll\", updatePosition, true);\n window.addEventListener(\"resize\", updatePosition);\n\n return () => {\n window.removeEventListener(\"scroll\", updatePosition, true);\n window.removeEventListener(\"resize\", updatePosition);\n };\n }, [isVisible]);\n\n const showTooltip = () => {\n clearPendingVisibilityUpdates();\n\n if (!isNative && typeof document !== \"undefined\") {\n document.dispatchEvent(\n new CustomEvent(TOOLTIP_OPEN_EVENT, { detail: { tooltipId } })\n );\n }\n\n // Update position before showing to prevent pop-in\n if (triggerRef.current) {\n setTriggerRect(triggerRef.current.getBoundingClientRect());\n\n // Double RAF to ensure position is rendered before showing tooltip\n rafRef.current = requestAnimationFrame(() => {\n rafRef.current = requestAnimationFrame(() => {\n if (delayEnter > 0) {\n enterTimeoutRef.current = setTimeout(() => {\n setIsHovered(true);\n }, delayEnter);\n } else {\n setIsHovered(true);\n }\n });\n });\n }\n };\n\n const hideTooltip = () => {\n clearPendingVisibilityUpdates();\n\n if (delayLeave > 0) {\n leaveTimeoutRef.current = setTimeout(() => {\n setIsHovered(false);\n }, delayLeave);\n } else {\n setIsHovered(false);\n }\n };\n\n useEffect(() => {\n if (isNative) return;\n\n const handleEscape = (event: KeyboardEvent) => {\n if (event.key === \"Escape\" && isVisible) {\n forceHideTooltip();\n }\n };\n\n const handleVisibilityChange = () => {\n if (document.visibilityState === \"hidden\") {\n forceHideTooltip();\n }\n };\n\n const handleTooltipOpen = (event: Event) => {\n const { tooltipId: activeTooltipId } =\n (event as CustomEvent).detail ?? {};\n\n if (activeTooltipId !== tooltipId) {\n forceHideTooltip();\n }\n };\n\n document.addEventListener(\"keydown\", handleEscape);\n document.addEventListener(\"visibilitychange\", handleVisibilityChange);\n document.addEventListener(TOOLTIP_OPEN_EVENT, handleTooltipOpen);\n\n return () => {\n document.removeEventListener(\"keydown\", handleEscape);\n document.removeEventListener(\n \"visibilitychange\",\n handleVisibilityChange\n );\n document.removeEventListener(TOOLTIP_OPEN_EVENT, handleTooltipOpen);\n clearPendingVisibilityUpdates();\n };\n }, [isVisible, tooltipId]);\n\n return (\n <Box\n testID={testID}\n ref={triggerRef}\n position=\"relative\"\n display=\"inline-flex\"\n onMouseEnter={showTooltip}\n onMouseLeave={hideTooltip}\n onFocus={showTooltip}\n onBlur={hideTooltip}\n className={className}\n style={{ height: \"fit-content\" }}\n aria-describedby={isVisible ? tooltipId : undefined}\n >\n {children}\n {!isNative && triggerRect && (\n <Portal>\n <Box\n ref={ref}\n data-testid={dataTestId}\n data-modal-id={modalId}\n position=\"fixed\"\n backgroundColor={theme.colors.background.primary}\n borderRadius={borderRadius}\n paddingVertical={8}\n paddingHorizontal={12}\n zIndex={2000}\n id={tooltipId}\n role=\"tooltip\"\n aria-hidden={!isVisible}\n style={{\n ...positionStyles,\n // https://stackoverflow.com/questions/62844007/how-to-apply-tool-tip-arrow-triangle-shadow\n filter:\n \"drop-shadow(0 6px 10px rgba(7, 7, 8, 0.1)) drop-shadow(0 2px 3px rgba(7, 7, 8, 0.2))\",\n WebkitFilter:\n \"drop-shadow(0 6px 10px rgba(7, 7, 8, 0.1)) drop-shadow(0 2px 3px rgba(7, 7, 8, 0.2))\",\n opacity: isVisible ? 1 : 0,\n visibility: isVisible ? \"visible\" : \"hidden\",\n transition:\n \"opacity 150ms cubic-bezier(.4,0,.2,1), transform 150ms cubic-bezier(.4,0,.2,1), visibility 150ms cubic-bezier(.4,0,.2,1)\",\n pointerEvents: \"none\",\n whiteSpace: \"normal\",\n width: \"max-content\",\n overflow: \"visible\",\n willChange: isVisible ? \"transform, opacity\" : \"auto\", // optimize rendering and ensure more stable positioning\n ...style,\n }}\n >\n <Box\n position=\"absolute\"\n backgroundColor={theme.colors.background.primary}\n style={{\n ...arrowStyles,\n backfaceVisibility: \"hidden\",\n WebkitBackfaceVisibility: \"hidden\",\n }}\n />\n <Box\n style={{\n wordWrap: \"break-word\",\n overflowWrap: \"break-word\",\n maxWidth: \"100%\",\n whiteSpace: \"normal\",\n }}\n >\n {typeof content === \"string\" || typeof content === \"number\" ? (\n <Text\n color={theme.colors.content.primary}\n fontSize={typoStyles.fontSize}\n fontWeight=\"400\"\n style={{ lineHeight: typoStyles.lineHeight }}\n >\n {content}\n </Text>\n ) : (\n content\n )}\n </Box>\n </Box>\n </Portal>\n )}\n </Box>\n );\n }\n);\n\nTooltip.displayName = \"Tooltip\";\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 minWidth,\n minHeight,\n maxWidth,\n maxHeight,\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 minWidth: minWidth as DimensionValue,\n minHeight: minHeight as DimensionValue,\n maxWidth: maxWidth as DimensionValue,\n maxHeight: maxHeight 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 testID,\n \"data-testid\": dataTestId,\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: color ?? incomingStyle?.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={dataTestId || testID || id}\n accessibilityRole={accessibilityRole}\n >\n {children}\n </RNText>\n );\n};\n","import { ReactNode } from \"react\";\n\ninterface PortalProps {\n children: ReactNode;\n}\n\n// Portal not supported on React Native - tooltip content renders inline\nexport const Portal = ({ children }: PortalProps) => {\n return <>{children}</>;\n};\n"],"mappings":"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","names":["jsx","jsx","jsx"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@xsolla/xui-tooltip",
|
|
3
|
-
"version": "0.171.
|
|
3
|
+
"version": "0.171.3-pr344.1781565307",
|
|
4
4
|
"main": "./web/index.js",
|
|
5
5
|
"module": "./web/index.mjs",
|
|
6
6
|
"types": "./web/index.d.ts",
|
|
@@ -13,9 +13,9 @@
|
|
|
13
13
|
"test:coverage": "vitest run --coverage"
|
|
14
14
|
},
|
|
15
15
|
"dependencies": {
|
|
16
|
-
"@xsolla/xui-button": "0.171.
|
|
17
|
-
"@xsolla/xui-core": "0.171.
|
|
18
|
-
"@xsolla/xui-primitives-core": "0.171.
|
|
16
|
+
"@xsolla/xui-button": "0.171.3-pr344.1781565307",
|
|
17
|
+
"@xsolla/xui-core": "0.171.3-pr344.1781565307",
|
|
18
|
+
"@xsolla/xui-primitives-core": "0.171.3-pr344.1781565307"
|
|
19
19
|
},
|
|
20
20
|
"peerDependencies": {
|
|
21
21
|
"react": ">=16.8.0",
|
package/web/index.d.mts
CHANGED
|
@@ -46,6 +46,6 @@ interface TooltipProps {
|
|
|
46
46
|
testID?: string;
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & ThemeOverrideProps & React.RefAttributes<
|
|
49
|
+
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & ThemeOverrideProps & React.RefAttributes<HTMLDivElement>>;
|
|
50
50
|
|
|
51
51
|
export { Tooltip, type TooltipPlacement, type TooltipProps, type TooltipSize };
|
package/web/index.d.ts
CHANGED
|
@@ -46,6 +46,6 @@ interface TooltipProps {
|
|
|
46
46
|
testID?: string;
|
|
47
47
|
}
|
|
48
48
|
|
|
49
|
-
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & ThemeOverrideProps & React.RefAttributes<
|
|
49
|
+
declare const Tooltip: React.ForwardRefExoticComponent<TooltipProps & ThemeOverrideProps & React.RefAttributes<HTMLDivElement>>;
|
|
50
50
|
|
|
51
51
|
export { Tooltip, type TooltipPlacement, type TooltipProps, type TooltipSize };
|