@artsy/palette-mobile 14.0.29 → 14.0.30
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.
|
@@ -5,6 +5,7 @@ interface PopoverProps {
|
|
|
5
5
|
variant?: PopoverVariant;
|
|
6
6
|
title?: React.ReactElement;
|
|
7
7
|
content?: React.ReactElement;
|
|
8
|
+
onOpenComplete?: () => void;
|
|
8
9
|
onPressOutside?: () => void;
|
|
9
10
|
onDismiss?: () => void;
|
|
10
11
|
onCloseComplete?: RNPopover["props"]["onCloseComplete"];
|
|
@@ -12,6 +13,6 @@ interface PopoverProps {
|
|
|
12
13
|
noCloseIcon?: boolean;
|
|
13
14
|
visible?: boolean;
|
|
14
15
|
}
|
|
15
|
-
export declare const Popover: ({ variant, children, visible, onPressOutside, onDismiss, onCloseComplete, placement, title, content, noCloseIcon, }: PopoverProps) => JSX.Element;
|
|
16
|
+
export declare const Popover: ({ variant, children, visible, onOpenComplete, onPressOutside, onDismiss, onCloseComplete, placement, title, content, noCloseIcon, }: PopoverProps) => JSX.Element;
|
|
16
17
|
export type PopoverVariant = "light" | "dark";
|
|
17
18
|
export {};
|
|
@@ -6,7 +6,7 @@ import { CloseIcon } from "../../svgs";
|
|
|
6
6
|
import { useColor } from "../../utils/hooks";
|
|
7
7
|
import { Flex } from "../Flex";
|
|
8
8
|
import { Touchable } from "../Touchable";
|
|
9
|
-
export const Popover = ({ variant = "dark", children, visible, onPressOutside, onDismiss, onCloseComplete, placement = "top", title, content, noCloseIcon, }) => {
|
|
9
|
+
export const Popover = ({ variant = "dark", children, visible, onOpenComplete, onPressOutside, onDismiss, onCloseComplete, placement = "top", title, content, noCloseIcon, }) => {
|
|
10
10
|
const color = useColor();
|
|
11
11
|
const DROP_SHADOW = {
|
|
12
12
|
shadowColor: color("black100"),
|
|
@@ -32,7 +32,7 @@ export const Popover = ({ variant = "dark", children, visible, onPressOutside, o
|
|
|
32
32
|
const style = POPOVER_VARIANTS[variant];
|
|
33
33
|
return (_jsx(RNPopover, { backgroundStyle: { opacity: 0.5, backgroundColor: color("black100") }, popoverStyle: [{ backgroundColor: style.backgroundColor }, style.shadow], from: children, isVisible: visible,
|
|
34
34
|
// this is required to make sure that the popover is positioned correctly on android
|
|
35
|
-
verticalOffset: Platform.OS === "android" ? -(StatusBar.currentHeight ?? 0) : 0, onCloseComplete: onCloseComplete, onRequestClose: onPressOutside, placement: placement, arrowSize: { height: 11, width: 22 }, animationConfig: {
|
|
35
|
+
verticalOffset: Platform.OS === "android" ? -(StatusBar.currentHeight ?? 0) : 0, onCloseComplete: onCloseComplete, onOpenComplete: onOpenComplete, onRequestClose: onPressOutside, placement: placement, arrowSize: { height: 11, width: 22 }, animationConfig: {
|
|
36
36
|
duration: 400,
|
|
37
37
|
easing: Easing.out(Easing.exp),
|
|
38
38
|
}, children: _jsxs(Flex, { backgroundColor: POPOVER_VARIANTS[variant].backgroundColor, p: 1, children: [_jsxs(Flex, { flexDirection: "row", justifyContent: "space-between", alignItems: "center", children: [title ? title : _jsx(Flex, {}), !noCloseIcon && (_jsx(Touchable, { onPress: onDismiss, accessibilityRole: "button", "aria-label": "Dismiss popover", children: _jsx(Flex, { ml: 0.5, children: _jsx(CloseIcon, { width: 18, height: 18, fill: style.fill }) }) }))] }), content] }) }));
|
package/package.json
CHANGED