@tamagui/popper 1.1.7 → 1.1.8

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.
@@ -37,11 +37,11 @@ var import_jsx_runtime = require("react/jsx-runtime");
37
37
  var import_compose_refs = require("@tamagui/compose-refs");
38
38
  var import_core = require("@tamagui/core");
39
39
  var import_create_context = require("@tamagui/create-context");
40
+ var import_floating = require("@tamagui/floating");
40
41
  var import_get_size = require("@tamagui/get-size");
41
42
  var import_stacks = require("@tamagui/stacks");
42
43
  var React = __toESM(require("react"));
43
- var import_floating = require("./floating");
44
- var import_useFloating = require("./useFloating");
44
+ var import_react_native = require("react-native");
45
45
  const POPPER_NAME = "Popper";
46
46
  const [createPopperContext, createScope] = (0, import_create_context.createContextScope)(POPPER_NAME);
47
47
  const createPopperScope = createScope;
@@ -64,9 +64,10 @@ const Popper = (props) => {
64
64
  const [arrowEl, setArrow] = React.useState(null);
65
65
  const [arrowSize, setArrowSize] = React.useState(0);
66
66
  const arrowRef = React.useRef();
67
- const floating = (0, import_useFloating.useFloating)({
67
+ const floating = (0, import_floating.useFloating)({
68
68
  strategy,
69
69
  placement,
70
+ sameScrollView: false,
70
71
  middleware: [
71
72
  stayInFrame ? (0, import_floating.shift)(typeof stayInFrame === "boolean" ? {} : stayInFrame) : null,
72
73
  allowFlip ? (0, import_floating.flip)(typeof allowFlip === "boolean" ? {} : allowFlip) : null,
@@ -79,12 +80,32 @@ const Popper = (props) => {
79
80
  (0, import_core.useIsomorphicLayoutEffect)(() => {
80
81
  floating.reference(anchorRef.current);
81
82
  }, [anchorRef]);
82
- React.useEffect(() => {
83
- if (!(refs.reference.current && refs.floating.current)) {
84
- return;
85
- }
86
- return (0, import_floating.autoUpdate)(refs.reference.current, refs.floating.current, floating.update);
87
- }, [floating.update, refs.floating, refs.reference]);
83
+ if (import_core.isWeb) {
84
+ React.useEffect(() => {
85
+ if (!(refs.reference.current && refs.floating.current)) {
86
+ return;
87
+ }
88
+ return (0, import_floating.autoUpdate)(refs.reference.current, refs.floating.current, floating.update);
89
+ }, [floating.update, refs.floating, refs.reference]);
90
+ } else {
91
+ const dimensions = (0, import_react_native.useWindowDimensions)();
92
+ const [keyboardOpen, setKeyboardOpen] = React.useState(false);
93
+ React.useEffect(() => {
94
+ const showSubscription = import_react_native.Keyboard.addListener("keyboardDidShow", () => {
95
+ setKeyboardOpen(true);
96
+ });
97
+ const hideSubscription = import_react_native.Keyboard.addListener("keyboardDidHide", () => {
98
+ setKeyboardOpen(false);
99
+ });
100
+ return () => {
101
+ showSubscription.remove();
102
+ hideSubscription.remove();
103
+ };
104
+ }, []);
105
+ (0, import_core.useIsomorphicLayoutEffect)(() => {
106
+ floating.update();
107
+ }, [dimensions, keyboardOpen]);
108
+ }
88
109
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperProvider, {
89
110
  scope: __scopePopper,
90
111
  anchorRef,
@@ -162,6 +183,7 @@ const PopperContent = PopperContentFrame.extractable(
162
183
  position: strategy
163
184
  };
164
185
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_stacks.YStack, {
186
+ animateOnly: ["transform"],
165
187
  ...getFloatingProps ? getFloatingProps(frameProps) : frameProps,
166
188
  children: contents
167
189
  });
@@ -193,6 +215,7 @@ const opposites = {
193
215
  };
194
216
  const PopperArrow = PopperArrowFrame.extractable(
195
217
  React.forwardRef(function PopperArrow2(props, forwardedRef) {
218
+ var _a, _b;
196
219
  const {
197
220
  __scopePopper,
198
221
  offset: offset2,
@@ -205,8 +228,9 @@ const PopperArrow = PopperArrowFrame.extractable(
205
228
  const sizeValResolved = (0, import_core.getVariableValue)((0, import_get_size.stepTokenUpOrDown)("space", sizeVal, -2, [2]));
206
229
  const size = +sizeValResolved;
207
230
  const { placement } = context;
208
- const { x, y } = context.arrowStyle || { x: 0, y: 0 };
209
231
  const refs = (0, import_compose_refs.useComposedRefs)(context.arrowRef, forwardedRef);
232
+ const x = ((_a = context.arrowStyle) == null ? void 0 : _a.x) || 0;
233
+ const y = ((_b = context.arrowStyle) == null ? void 0 : _b.y) || 0;
210
234
  const primaryPlacement = placement ? placement.split("-")[0] : "top";
211
235
  const arrowStyle = { x, y, width: size, height: size };
212
236
  const innerArrowStyle = {};
@@ -226,8 +250,8 @@ const PopperArrow = PopperArrowFrame.extractable(
226
250
  }
227
251
  }
228
252
  (0, import_core.useIsomorphicLayoutEffect)(() => {
229
- var _a;
230
- (_a = context.onArrowSize) == null ? void 0 : _a.call(context, size);
253
+ var _a2;
254
+ (_a2 = context.onArrowSize) == null ? void 0 : _a2.call(context, size);
231
255
  }, [size, context.onArrowSize]);
232
256
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PopperArrowOuterFrame, {
233
257
  ref: refs,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Popper.tsx"],
4
- "sourcesContent": ["// adapted from radix-ui popper\n\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n SizeTokens,\n StackProps,\n getVariableValue,\n styled,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { stepTokenUpOrDown } from '@tamagui/get-size'\nimport { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { View } from 'react-native'\n\nimport {\n Coords,\n Placement,\n Strategy,\n arrow,\n autoUpdate,\n flip,\n offset,\n shift,\n} from './floating'\nimport { UseFloatingReturn, useFloating } from './useFloating'\n\ntype ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never\ntype FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never\n\n/* -------------------------------------------------------------------------------------------------\n * Popper\n * -----------------------------------------------------------------------------------------------*/\n\nconst POPPER_NAME = 'Popper'\n\ntype ScopedProps<P> = P & { __scopePopper?: Scope }\nconst [createPopperContext, createScope] = createContextScope(POPPER_NAME)\n\nexport const createPopperScope = createScope\n\ntype PopperContextValue = UseFloatingReturn & {\n isMounted: boolean\n anchorRef: any\n size?: SizeTokens\n placement?: Placement\n arrowRef: any\n onArrowSize?: (val: number) => void\n arrowStyle?: Partial<Coords> & {\n centerOffset: number\n }\n}\nexport const [PopperProvider, usePopperContext] =\n createPopperContext<PopperContextValue>(POPPER_NAME)\n\nexport type PopperProps = {\n size?: SizeTokens\n children?: React.ReactNode\n placement?: Placement\n stayInFrame?: ShiftProps | boolean\n allowFlip?: FlipProps | boolean\n strategy?: Strategy\n}\n\nexport const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) => {\n const {\n __scopePopper,\n children,\n size,\n strategy = 'absolute',\n placement = 'bottom',\n stayInFrame,\n allowFlip,\n } = props\n\n const [isMounted, setIsMounted] = React.useState(false)\n useIsomorphicLayoutEffect(() => {\n setIsMounted(true)\n }, [])\n\n const anchorRef = React.useRef<any>()\n const [arrowEl, setArrow] = React.useState<HTMLSpanElement | null>(null)\n const [arrowSize, setArrowSize] = React.useState(0)\n const arrowRef = React.useRef()\n\n const floating = useFloating({\n strategy,\n placement,\n middleware: [\n stayInFrame\n ? shift(typeof stayInFrame === 'boolean' ? {} : stayInFrame)\n : (null as any),\n allowFlip ? flip(typeof allowFlip === 'boolean' ? {} : allowFlip) : (null as any),\n arrowEl ? arrow({ element: arrowEl }) : (null as any),\n arrowSize ? offset(arrowSize) : (null as any),\n ].filter(Boolean),\n })\n\n const { refs, middlewareData } = floating\n\n const composedArrowRefs = useComposedRefs<any>(arrowRef, setArrow)\n\n useIsomorphicLayoutEffect(() => {\n floating.reference(anchorRef.current)\n }, [anchorRef])\n\n React.useEffect(() => {\n if (!(refs.reference.current && refs.floating.current)) {\n return\n }\n // Only call this when the floating element is rendered\n return autoUpdate(refs.reference.current, refs.floating.current, floating.update)\n }, [floating.update, refs.floating, refs.reference])\n\n return (\n <PopperProvider\n scope={__scopePopper}\n anchorRef={anchorRef}\n size={size}\n arrowRef={composedArrowRefs}\n arrowStyle={middlewareData.arrow}\n onArrowSize={setArrowSize}\n isMounted={isMounted}\n {...floating}\n >\n {children}\n </PopperProvider>\n )\n}\n\nPopper.displayName = POPPER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopperAnchor'\n\ntype PopperAnchorRef = HTMLElement | View\n\nexport type PopperAnchorProps = YStackProps & {\n virtualRef?: React.RefObject<any>\n}\n\nexport const PopperAnchor = React.forwardRef<PopperAnchorRef, PopperAnchorProps>(\n (props: ScopedProps<PopperAnchorProps>, forwardedRef) => {\n const { __scopePopper, virtualRef, ...anchorProps } = props\n const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper)\n const ref = React.useRef<PopperAnchorRef>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, anchorRef)\n if (virtualRef) {\n return null\n }\n const stackProps = {\n ref: composedRefs,\n ...anchorProps,\n }\n return (\n <YStack {...(getReferenceProps ? getReferenceProps(stackProps) : stackProps)} />\n )\n }\n)\n\nPopperAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopperContent'\n\ntype PopperContentElement = HTMLElement | View\n\nexport type PopperContentProps = SizableStackProps\n\nconst PopperContentFrame = styled(ThemeableStack, {\n name: 'PopperContent',\n backgroundColor: '$background',\n alignItems: 'center',\n radiused: true,\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n padding: tokens.space[val],\n borderRadius: tokens.radius[val],\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const PopperContent = PopperContentFrame.extractable(\n React.forwardRef<PopperContentElement, PopperContentProps>(\n (props: ScopedProps<PopperContentProps>, forwardedRef) => {\n const { __scopePopper, ...contentProps } = props\n const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } =\n usePopperContext(CONTENT_NAME, __scopePopper)\n const contentRefs = useComposedRefs<any>(floating, forwardedRef)\n\n const contents = React.useMemo(() => {\n return (\n <PopperContentFrame\n key=\"popper-content-frame\"\n data-placement={placement}\n data-strategy={strategy}\n size={contentProps.size || size}\n {...contentProps}\n />\n )\n }, [placement, strategy, props])\n\n // all poppers hidden on ssr by default\n if (!isMounted) {\n return null\n }\n\n const frameProps = {\n ref: contentRefs,\n x: x || 0,\n y: y || 0,\n position: strategy,\n }\n\n // outer frame because we explicitly dont want animation to apply to this\n return (\n <YStack {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}>\n {contents}\n </YStack>\n )\n }\n )\n)\n\nPopperContent.displayName = CONTENT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopperArrow'\n\ntype PopperArrowElement = HTMLElement | View\n\nexport type PopperArrowProps = YStackProps & {\n offset?: number\n size?: SizeTokens\n}\n\nconst PopperArrowFrame = styled(YStack, {\n name: 'PopperArrow',\n borderColor: '$borderColor',\n backgroundColor: '$background',\n position: 'relative',\n})\n\nconst PopperArrowOuterFrame = styled(YStack, {\n name: 'PopperArrowOuter',\n position: 'absolute',\n zIndex: -1,\n pointerEvents: 'none',\n overflow: 'hidden',\n alignItems: 'center',\n justifyContent: 'center',\n})\n\nconst opposites = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n} as const\n\ntype Sides = keyof typeof opposites\n\nexport const PopperArrow = PopperArrowFrame.extractable(\n React.forwardRef<PopperArrowElement, PopperArrowProps>(function PopperArrow(\n props: ScopedProps<PopperArrowProps>,\n forwardedRef\n ) {\n const {\n __scopePopper,\n offset,\n size: sizeProp,\n borderWidth = 0,\n ...arrowProps\n } = props\n const context = usePopperContext(ARROW_NAME, __scopePopper)\n const sizeVal = sizeProp ?? context.size\n const sizeValResolved = getVariableValue(stepTokenUpOrDown('space', sizeVal, -2, [2]))\n const size = +sizeValResolved\n const { placement } = context\n const { x, y } = context.arrowStyle || { x: 0, y: 0 }\n const refs = useComposedRefs(context.arrowRef, forwardedRef)\n\n const primaryPlacement = (placement ? placement.split('-')[0] : 'top') as Sides\n\n const arrowStyle: StackProps = { x, y, width: size, height: size }\n const innerArrowStyle: StackProps = {}\n const isVertical = primaryPlacement === 'bottom' || primaryPlacement === 'top'\n\n if (primaryPlacement) {\n // allows for extra diagonal size\n arrowStyle[isVertical ? 'width' : 'height'] = size * 2\n const oppSide = opposites[primaryPlacement]\n if (oppSide) {\n arrowStyle[oppSide] = -size\n innerArrowStyle[oppSide] = size / 2\n }\n if (oppSide === 'top' || oppSide === 'bottom') {\n arrowStyle.left = 0\n }\n if (oppSide === 'left' || oppSide === 'right') {\n arrowStyle.top = 0\n }\n }\n\n // send the Arrow's offset up to Popper\n useIsomorphicLayoutEffect(() => {\n context.onArrowSize?.(size)\n }, [size, context.onArrowSize])\n\n // outer frame to cut off for ability to have nicer shadows/borders\n return (\n <PopperArrowOuterFrame ref={refs} {...arrowStyle}>\n <PopperArrowFrame\n width={size}\n height={size}\n {...arrowProps}\n {...innerArrowStyle}\n rotate=\"45deg\"\n {...(primaryPlacement === 'bottom' && {\n borderBottomWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'top' && {\n borderTopWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n {...(primaryPlacement === 'right' && {\n borderTopWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'left' && {\n borderBottomWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n />\n </PopperArrowOuterFrame>\n )\n })\n)\n\nPopperArrow.displayName = ARROW_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n"],
5
- "mappings": "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",
6
- "names": ["PopperArrow", "offset"]
4
+ "sourcesContent": ["// adapted from radix-ui popper\n\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n SizeTokens,\n StackProps,\n getVariableValue,\n isWeb,\n styled,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport {\n Coords,\n Placement,\n Strategy,\n UseFloatingReturn,\n arrow,\n autoUpdate,\n flip,\n offset,\n shift,\n useFloating,\n} from '@tamagui/floating'\nimport { stepTokenUpOrDown } from '@tamagui/get-size'\nimport { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { Keyboard, View, useWindowDimensions } from 'react-native'\n\ntype ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never\ntype FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never\n\n/* -------------------------------------------------------------------------------------------------\n * Popper\n * -----------------------------------------------------------------------------------------------*/\n\nconst POPPER_NAME = 'Popper'\n\ntype ScopedProps<P> = P & { __scopePopper?: Scope }\nconst [createPopperContext, createScope] = createContextScope(POPPER_NAME)\n\nexport const createPopperScope = createScope\n\ntype PopperContextValue = UseFloatingReturn & {\n isMounted: boolean\n anchorRef: any\n size?: SizeTokens\n placement?: Placement\n arrowRef: any\n onArrowSize?: (val: number) => void\n arrowStyle?: Partial<Coords> & {\n centerOffset: number\n }\n}\nexport const [PopperProvider, usePopperContext] =\n createPopperContext<PopperContextValue>(POPPER_NAME)\n\nexport type PopperProps = {\n size?: SizeTokens\n children?: React.ReactNode\n placement?: Placement\n stayInFrame?: ShiftProps | boolean\n allowFlip?: FlipProps | boolean\n strategy?: Strategy\n}\n\nexport const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) => {\n const {\n __scopePopper,\n children,\n size,\n strategy = 'absolute',\n placement = 'bottom',\n stayInFrame,\n allowFlip,\n } = props\n\n const [isMounted, setIsMounted] = React.useState(false)\n useIsomorphicLayoutEffect(() => {\n setIsMounted(true)\n }, [])\n\n const anchorRef = React.useRef<any>()\n const [arrowEl, setArrow] = React.useState<any>(null)\n const [arrowSize, setArrowSize] = React.useState(0)\n const arrowRef = React.useRef()\n\n const floating = useFloating({\n strategy,\n placement,\n sameScrollView: false, // this only takes effect on native\n middleware: [\n stayInFrame\n ? shift(typeof stayInFrame === 'boolean' ? {} : stayInFrame)\n : (null as any),\n allowFlip ? flip(typeof allowFlip === 'boolean' ? {} : allowFlip) : (null as any),\n arrowEl ? arrow({ element: arrowEl }) : (null as any),\n arrowSize ? offset(arrowSize) : (null as any),\n ].filter(Boolean),\n })\n\n const { refs, middlewareData } = floating\n\n const composedArrowRefs = useComposedRefs<any>(arrowRef, setArrow)\n\n useIsomorphicLayoutEffect(() => {\n floating.reference(anchorRef.current)\n }, [anchorRef])\n\n if (isWeb) {\n React.useEffect(() => {\n if (!(refs.reference.current && refs.floating.current)) {\n return\n }\n // Only call this when the floating element is rendered\n return autoUpdate(refs.reference.current, refs.floating.current, floating.update)\n }, [floating.update, refs.floating, refs.reference])\n } else {\n // On Native there's no autoupdate so we call update() when necessary\n\n // Subscribe to window dimensions (orientation, scale, etc...)\n const dimensions = useWindowDimensions()\n\n // Subscribe to keyboard state\n const [keyboardOpen, setKeyboardOpen] = React.useState(false)\n React.useEffect(() => {\n const showSubscription = Keyboard.addListener('keyboardDidShow', () => {\n setKeyboardOpen(true)\n })\n const hideSubscription = Keyboard.addListener('keyboardDidHide', () => {\n setKeyboardOpen(false)\n })\n\n return () => {\n showSubscription.remove()\n hideSubscription.remove()\n }\n }, [])\n\n useIsomorphicLayoutEffect(() => {\n floating.update()\n }, [dimensions, keyboardOpen])\n }\n\n return (\n <PopperProvider\n scope={__scopePopper}\n anchorRef={anchorRef}\n size={size}\n arrowRef={composedArrowRefs}\n arrowStyle={middlewareData.arrow}\n onArrowSize={setArrowSize}\n isMounted={isMounted}\n {...floating}\n >\n {children}\n </PopperProvider>\n )\n}\n\nPopper.displayName = POPPER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopperAnchor'\n\ntype PopperAnchorRef = HTMLElement | View\n\nexport type PopperAnchorProps = YStackProps & {\n virtualRef?: React.RefObject<any>\n}\n\nexport const PopperAnchor = React.forwardRef<PopperAnchorRef, PopperAnchorProps>(\n (props: ScopedProps<PopperAnchorProps>, forwardedRef) => {\n const { __scopePopper, virtualRef, ...anchorProps } = props\n const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper)\n const ref = React.useRef<PopperAnchorRef>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, anchorRef)\n if (virtualRef) {\n return null\n }\n const stackProps = {\n ref: composedRefs,\n ...anchorProps,\n }\n return (\n <YStack {...(getReferenceProps ? getReferenceProps(stackProps) : stackProps)} />\n )\n }\n)\n\nPopperAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopperContent'\n\ntype PopperContentElement = HTMLElement | View\n\nexport type PopperContentProps = SizableStackProps\n\nconst PopperContentFrame = styled(ThemeableStack, {\n name: 'PopperContent',\n backgroundColor: '$background',\n alignItems: 'center',\n radiused: true,\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n padding: tokens.space[val],\n borderRadius: tokens.radius[val],\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const PopperContent = PopperContentFrame.extractable(\n React.forwardRef<PopperContentElement, PopperContentProps>(\n (props: ScopedProps<PopperContentProps>, forwardedRef) => {\n const { __scopePopper, ...contentProps } = props\n const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } =\n usePopperContext(CONTENT_NAME, __scopePopper)\n const contentRefs = useComposedRefs<any>(floating, forwardedRef)\n\n const contents = React.useMemo(() => {\n return (\n <PopperContentFrame\n key=\"popper-content-frame\"\n data-placement={placement}\n data-strategy={strategy}\n size={contentProps.size || size}\n {...contentProps}\n />\n )\n }, [placement, strategy, props])\n\n // all poppers hidden on ssr by default\n if (!isMounted) {\n return null\n }\n\n const frameProps = {\n ref: contentRefs,\n x: x || 0,\n y: y || 0,\n position: strategy,\n }\n\n // outer frame because we explicitly dont want animation to apply to this\n return (\n <YStack\n animateOnly={['transform']}\n {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}\n >\n {contents}\n </YStack>\n )\n }\n )\n)\n\nPopperContent.displayName = CONTENT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopperArrow'\n\ntype PopperArrowElement = HTMLElement | View\n\nexport type PopperArrowProps = YStackProps & {\n offset?: number\n size?: SizeTokens\n}\n\nconst PopperArrowFrame = styled(YStack, {\n name: 'PopperArrow',\n borderColor: '$borderColor',\n backgroundColor: '$background',\n position: 'relative',\n})\n\nconst PopperArrowOuterFrame = styled(YStack, {\n name: 'PopperArrowOuter',\n position: 'absolute',\n zIndex: -1,\n pointerEvents: 'none',\n overflow: 'hidden',\n alignItems: 'center',\n justifyContent: 'center',\n})\n\nconst opposites = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n} as const\n\ntype Sides = keyof typeof opposites\n\nexport const PopperArrow = PopperArrowFrame.extractable(\n React.forwardRef<PopperArrowElement, PopperArrowProps>(function PopperArrow(\n props: ScopedProps<PopperArrowProps>,\n forwardedRef\n ) {\n const {\n __scopePopper,\n offset,\n size: sizeProp,\n borderWidth = 0,\n ...arrowProps\n } = props\n const context = usePopperContext(ARROW_NAME, __scopePopper)\n const sizeVal = sizeProp ?? context.size\n const sizeValResolved = getVariableValue(stepTokenUpOrDown('space', sizeVal, -2, [2]))\n const size = +sizeValResolved\n const { placement } = context\n const refs = useComposedRefs(context.arrowRef, forwardedRef)\n\n // Sometimes floating-ui can return NaN during orientation or screen size changes on native\n // so we explictly force the x,y position types as a number\n const x = (context.arrowStyle?.x as number) || 0\n const y = (context.arrowStyle?.y as number) || 0\n\n const primaryPlacement = (placement ? placement.split('-')[0] : 'top') as Sides\n\n const arrowStyle: StackProps = { x, y, width: size, height: size }\n const innerArrowStyle: StackProps = {}\n const isVertical = primaryPlacement === 'bottom' || primaryPlacement === 'top'\n\n if (primaryPlacement) {\n // allows for extra diagonal size\n arrowStyle[isVertical ? 'width' : 'height'] = size * 2\n const oppSide = opposites[primaryPlacement]\n if (oppSide) {\n arrowStyle[oppSide] = -size\n innerArrowStyle[oppSide] = size / 2\n }\n if (oppSide === 'top' || oppSide === 'bottom') {\n arrowStyle.left = 0\n }\n if (oppSide === 'left' || oppSide === 'right') {\n arrowStyle.top = 0\n }\n }\n\n // send the Arrow's offset up to Popper\n useIsomorphicLayoutEffect(() => {\n context.onArrowSize?.(size)\n }, [size, context.onArrowSize])\n\n // outer frame to cut off for ability to have nicer shadows/borders\n return (\n <PopperArrowOuterFrame ref={refs} {...arrowStyle}>\n <PopperArrowFrame\n width={size}\n height={size}\n {...arrowProps}\n {...innerArrowStyle}\n rotate=\"45deg\"\n {...(primaryPlacement === 'bottom' && {\n borderBottomWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'top' && {\n borderTopWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n {...(primaryPlacement === 'right' && {\n borderTopWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'left' && {\n borderBottomWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n />\n </PopperArrowOuterFrame>\n )\n })\n)\n\nPopperArrow.displayName = ARROW_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAiJI;AA/IJ,0BAAgC;AAChC,kBAOO;AACP,4BAA0C;AAC1C,sBAWO;AACP,sBAAkC;AAClC,oBAAuE;AACvE,YAAuB;AACvB,0BAAoD;AASpD,MAAM,cAAc;AAGpB,MAAM,CAAC,qBAAqB,WAAW,QAAI,0CAAmB,WAAW;AAElE,MAAM,oBAAoB;AAa1B,MAAM,CAAC,gBAAgB,gBAAgB,IAC5C,oBAAwC,WAAW;AAW9C,MAAM,SAAgC,CAAC,UAAoC;AAChF,QAAM;AAAA,IACJ;AAAA,IACA;AAAA,IACA;AAAA,IACA,WAAW;AAAA,IACX,YAAY;AAAA,IACZ;AAAA,IACA;AAAA,EACF,IAAI;AAEJ,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,KAAK;AACtD,6CAA0B,MAAM;AAC9B,iBAAa,IAAI;AAAA,EACnB,GAAG,CAAC,CAAC;AAEL,QAAM,YAAY,MAAM,OAAY;AACpC,QAAM,CAAC,SAAS,QAAQ,IAAI,MAAM,SAAc,IAAI;AACpD,QAAM,CAAC,WAAW,YAAY,IAAI,MAAM,SAAS,CAAC;AAClD,QAAM,WAAW,MAAM,OAAO;AAE9B,QAAM,eAAW,6BAAY;AAAA,IAC3B;AAAA,IACA;AAAA,IACA,gBAAgB;AAAA,IAChB,YAAY;AAAA,MACV,kBACI,uBAAM,OAAO,gBAAgB,YAAY,CAAC,IAAI,WAAW,IACxD;AAAA,MACL,gBAAY,sBAAK,OAAO,cAAc,YAAY,CAAC,IAAI,SAAS,IAAK;AAAA,MACrE,cAAU,uBAAM,EAAE,SAAS,QAAQ,CAAC,IAAK;AAAA,MACzC,gBAAY,wBAAO,SAAS,IAAK;AAAA,IACnC,EAAE,OAAO,OAAO;AAAA,EAClB,CAAC;AAED,QAAM,EAAE,MAAM,eAAe,IAAI;AAEjC,QAAM,wBAAoB,qCAAqB,UAAU,QAAQ;AAEjE,6CAA0B,MAAM;AAC9B,aAAS,UAAU,UAAU,OAAO;AAAA,EACtC,GAAG,CAAC,SAAS,CAAC;AAEd,MAAI,mBAAO;AACT,UAAM,UAAU,MAAM;AACpB,UAAI,EAAE,KAAK,UAAU,WAAW,KAAK,SAAS,UAAU;AACtD;AAAA,MACF;AAEA,iBAAO,4BAAW,KAAK,UAAU,SAAS,KAAK,SAAS,SAAS,SAAS,MAAM;AAAA,IAClF,GAAG,CAAC,SAAS,QAAQ,KAAK,UAAU,KAAK,SAAS,CAAC;AAAA,EACrD,OAAO;AAIL,UAAM,iBAAa,yCAAoB;AAGvC,UAAM,CAAC,cAAc,eAAe,IAAI,MAAM,SAAS,KAAK;AAC5D,UAAM,UAAU,MAAM;AACpB,YAAM,mBAAmB,6BAAS,YAAY,mBAAmB,MAAM;AACrE,wBAAgB,IAAI;AAAA,MACtB,CAAC;AACD,YAAM,mBAAmB,6BAAS,YAAY,mBAAmB,MAAM;AACrE,wBAAgB,KAAK;AAAA,MACvB,CAAC;AAED,aAAO,MAAM;AACX,yBAAiB,OAAO;AACxB,yBAAiB,OAAO;AAAA,MAC1B;AAAA,IACF,GAAG,CAAC,CAAC;AAEL,+CAA0B,MAAM;AAC9B,eAAS,OAAO;AAAA,IAClB,GAAG,CAAC,YAAY,YAAY,CAAC;AAAA,EAC/B;AAEA,SACE,4CAAC;AAAA,IACC,OAAO;AAAA,IACP;AAAA,IACA;AAAA,IACA,UAAU;AAAA,IACV,YAAY,eAAe;AAAA,IAC3B,aAAa;AAAA,IACb;AAAA,IACC,GAAG;AAAA,IAEH;AAAA,GACH;AAEJ;AAEA,OAAO,cAAc;AAMrB,MAAM,cAAc;AAQb,MAAM,eAAe,MAAM;AAAA,EAChC,CAAC,OAAuC,iBAAiB;AACvD,UAAM,EAAE,eAAe,eAAe,YAAY,IAAI;AACtD,UAAM,EAAE,WAAW,kBAAkB,IAAI,iBAAiB,aAAa,aAAa;AACpF,UAAM,MAAM,MAAM,OAAwB,IAAI;AAC9C,UAAM,mBAAe,qCAAgB,cAAc,KAAK,SAAS;AACjE,QAAI,YAAY;AACd,aAAO;AAAA,IACT;AACA,UAAM,aAAa;AAAA,MACjB,KAAK;AAAA,MACL,GAAG;AAAA,IACL;AACA,WACE,4CAAC;AAAA,MAAQ,GAAI,oBAAoB,kBAAkB,UAAU,IAAI;AAAA,KAAa;AAAA,EAElF;AACF;AAEA,aAAa,cAAc;AAM3B,MAAM,eAAe;AAMrB,MAAM,yBAAqB,oBAAO,8BAAgB;AAAA,EAChD,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,YAAY;AAAA,EACZ,UAAU;AAAA,EAEV,UAAU;AAAA,IACR,MAAM;AAAA,MACJ,WAAW,CAAC,KAAK,EAAE,OAAO,MAAM;AAC9B,eAAO;AAAA,UACL,SAAS,OAAO,MAAM;AAAA,UACtB,cAAc,OAAO,OAAO;AAAA,QAC9B;AAAA,MACF;AAAA,IACF;AAAA,EACF;AAAA,EAEA,iBAAiB;AAAA,IACf,MAAM;AAAA,EACR;AACF,CAAC;AAEM,MAAM,gBAAgB,mBAAmB;AAAA,EAC9C,MAAM;AAAA,IACJ,CAAC,OAAwC,iBAAiB;AACxD,YAAM,EAAE,kBAAkB,aAAa,IAAI;AAC3C,YAAM,EAAE,UAAU,WAAW,UAAU,GAAG,GAAG,kBAAkB,MAAM,UAAU,IAC7E,iBAAiB,cAAc,aAAa;AAC9C,YAAM,kBAAc,qCAAqB,UAAU,YAAY;AAE/D,YAAM,WAAW,MAAM,QAAQ,MAAM;AACnC,eACE,4CAAC;AAAA,UAEC,kBAAgB;AAAA,UAChB,iBAAe;AAAA,UACf,MAAM,aAAa,QAAQ;AAAA,UAC1B,GAAG;AAAA,WAJA,sBAKN;AAAA,MAEJ,GAAG,CAAC,WAAW,UAAU,KAAK,CAAC;AAG/B,UAAI,CAAC,WAAW;AACd,eAAO;AAAA,MACT;AAEA,YAAM,aAAa;AAAA,QACjB,KAAK;AAAA,QACL,GAAG,KAAK;AAAA,QACR,GAAG,KAAK;AAAA,QACR,UAAU;AAAA,MACZ;AAGA,aACE,4CAAC;AAAA,QACC,aAAa,CAAC,WAAW;AAAA,QACxB,GAAI,mBAAmB,iBAAiB,UAAU,IAAI;AAAA,QAEtD;AAAA,OACH;AAAA,IAEJ;AAAA,EACF;AACF;AAEA,cAAc,cAAc;AAM5B,MAAM,aAAa;AASnB,MAAM,uBAAmB,oBAAO,sBAAQ;AAAA,EACtC,MAAM;AAAA,EACN,aAAa;AAAA,EACb,iBAAiB;AAAA,EACjB,UAAU;AACZ,CAAC;AAED,MAAM,4BAAwB,oBAAO,sBAAQ;AAAA,EAC3C,MAAM;AAAA,EACN,UAAU;AAAA,EACV,QAAQ;AAAA,EACR,eAAe;AAAA,EACf,UAAU;AAAA,EACV,YAAY;AAAA,EACZ,gBAAgB;AAClB,CAAC;AAED,MAAM,YAAY;AAAA,EAChB,KAAK;AAAA,EACL,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AACR;AAIO,MAAM,cAAc,iBAAiB;AAAA,EAC1C,MAAM,WAAiD,SAASA,aAC9D,OACA,cACA;AA7TJ;AA8TI,UAAM;AAAA,MACJ;AAAA,MACA,QAAAC;AAAA,MACA,MAAM;AAAA,MACN,cAAc;AAAA,SACX;AAAA,IACL,IAAI;AACJ,UAAM,UAAU,iBAAiB,YAAY,aAAa;AAC1D,UAAM,UAAU,YAAY,QAAQ;AACpC,UAAM,sBAAkB,kCAAiB,mCAAkB,SAAS,SAAS,IAAI,CAAC,CAAC,CAAC,CAAC;AACrF,UAAM,OAAO,CAAC;AACd,UAAM,EAAE,UAAU,IAAI;AACtB,UAAM,WAAO,qCAAgB,QAAQ,UAAU,YAAY;AAI3D,UAAM,MAAK,aAAQ,eAAR,mBAAoB,MAAgB;AAC/C,UAAM,MAAK,aAAQ,eAAR,mBAAoB,MAAgB;AAE/C,UAAM,mBAAoB,YAAY,UAAU,MAAM,GAAG,EAAE,KAAK;AAEhE,UAAM,aAAyB,EAAE,GAAG,GAAG,OAAO,MAAM,QAAQ,KAAK;AACjE,UAAM,kBAA8B,CAAC;AACrC,UAAM,aAAa,qBAAqB,YAAY,qBAAqB;AAEzE,QAAI,kBAAkB;AAEpB,iBAAW,aAAa,UAAU,YAAY,OAAO;AACrD,YAAM,UAAU,UAAU;AAC1B,UAAI,SAAS;AACX,mBAAW,WAAW,CAAC;AACvB,wBAAgB,WAAW,OAAO;AAAA,MACpC;AACA,UAAI,YAAY,SAAS,YAAY,UAAU;AAC7C,mBAAW,OAAO;AAAA,MACpB;AACA,UAAI,YAAY,UAAU,YAAY,SAAS;AAC7C,mBAAW,MAAM;AAAA,MACnB;AAAA,IACF;AAGA,+CAA0B,MAAM;AAxWpC,UAAAC;AAyWM,OAAAA,MAAA,QAAQ,gBAAR,gBAAAA,IAAA,cAAsB;AAAA,IACxB,GAAG,CAAC,MAAM,QAAQ,WAAW,CAAC;AAG9B,WACE,4CAAC;AAAA,MAAsB,KAAK;AAAA,MAAO,GAAG;AAAA,MACpC,sDAAC;AAAA,QACC,OAAO;AAAA,QACP,QAAQ;AAAA,QACP,GAAG;AAAA,QACH,GAAG;AAAA,QACJ,QAAO;AAAA,QACN,GAAI,qBAAqB,YAAY;AAAA,UACpC,mBAAmB;AAAA,UACnB,kBAAkB;AAAA,QACpB;AAAA,QACC,GAAI,qBAAqB,SAAS;AAAA,UACjC,gBAAgB;AAAA,UAChB,iBAAiB;AAAA,QACnB;AAAA,QACC,GAAI,qBAAqB,WAAW;AAAA,UACnC,gBAAgB;AAAA,UAChB,kBAAkB;AAAA,QACpB;AAAA,QACC,GAAI,qBAAqB,UAAU;AAAA,UAClC,mBAAmB;AAAA,UACnB,iBAAiB;AAAA,QACnB;AAAA,OACF;AAAA,KACF;AAAA,EAEJ,CAAC;AACH;AAEA,YAAY,cAAc;",
6
+ "names": ["PopperArrow", "offset", "_a"]
7
7
  }
package/dist/cjs/index.js CHANGED
@@ -3,10 +3,6 @@ var __defProp = Object.defineProperty;
3
3
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
4
  var __getOwnPropNames = Object.getOwnPropertyNames;
5
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: true });
9
- };
10
6
  var __copyProps = (to, from, except, desc) => {
11
7
  if (from && typeof from === "object" || typeof from === "function") {
12
8
  for (let key of __getOwnPropNames(from))
@@ -18,14 +14,6 @@ var __copyProps = (to, from, except, desc) => {
18
14
  var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
19
15
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
20
16
  var src_exports = {};
21
- __export(src_exports, {
22
- FloatingOverrideContext: () => import_useFloating.FloatingOverrideContext
23
- });
24
17
  module.exports = __toCommonJS(src_exports);
25
- var import_useFloating = require("./useFloating");
26
18
  __reExport(src_exports, require("./Popper"), module.exports);
27
- // Annotate the CommonJS export names for ESM import in node:
28
- 0 && (module.exports = {
29
- FloatingOverrideContext
30
- });
31
19
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx"],
4
- "sourcesContent": ["export { FloatingOverrideContext, type UseFloatingFn } from './useFloating'\nexport * from './Popper'\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAA4D;AAC5D,wBAAc,qBADd;",
4
+ "sourcesContent": ["export * from './Popper'\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA,wBAAc,qBAAd;",
6
6
  "names": []
7
7
  }
@@ -2,21 +2,23 @@ import { jsx } from "react/jsx-runtime";
2
2
  import { useComposedRefs } from "@tamagui/compose-refs";
3
3
  import {
4
4
  getVariableValue,
5
+ isWeb,
5
6
  styled,
6
7
  useIsomorphicLayoutEffect
7
8
  } from "@tamagui/core";
8
9
  import { createContextScope } from "@tamagui/create-context";
9
- import { stepTokenUpOrDown } from "@tamagui/get-size";
10
- import { ThemeableStack, YStack } from "@tamagui/stacks";
11
- import * as React from "react";
12
10
  import {
13
11
  arrow,
14
12
  autoUpdate,
15
13
  flip,
16
14
  offset,
17
- shift
18
- } from "./floating";
19
- import { useFloating } from "./useFloating";
15
+ shift,
16
+ useFloating
17
+ } from "@tamagui/floating";
18
+ import { stepTokenUpOrDown } from "@tamagui/get-size";
19
+ import { ThemeableStack, YStack } from "@tamagui/stacks";
20
+ import * as React from "react";
21
+ import { Keyboard, useWindowDimensions } from "react-native";
20
22
  const POPPER_NAME = "Popper";
21
23
  const [createPopperContext, createScope] = createContextScope(POPPER_NAME);
22
24
  const createPopperScope = createScope;
@@ -42,6 +44,7 @@ const Popper = (props) => {
42
44
  const floating = useFloating({
43
45
  strategy,
44
46
  placement,
47
+ sameScrollView: false,
45
48
  middleware: [
46
49
  stayInFrame ? shift(typeof stayInFrame === "boolean" ? {} : stayInFrame) : null,
47
50
  allowFlip ? flip(typeof allowFlip === "boolean" ? {} : allowFlip) : null,
@@ -54,12 +57,32 @@ const Popper = (props) => {
54
57
  useIsomorphicLayoutEffect(() => {
55
58
  floating.reference(anchorRef.current);
56
59
  }, [anchorRef]);
57
- React.useEffect(() => {
58
- if (!(refs.reference.current && refs.floating.current)) {
59
- return;
60
- }
61
- return autoUpdate(refs.reference.current, refs.floating.current, floating.update);
62
- }, [floating.update, refs.floating, refs.reference]);
60
+ if (isWeb) {
61
+ React.useEffect(() => {
62
+ if (!(refs.reference.current && refs.floating.current)) {
63
+ return;
64
+ }
65
+ return autoUpdate(refs.reference.current, refs.floating.current, floating.update);
66
+ }, [floating.update, refs.floating, refs.reference]);
67
+ } else {
68
+ const dimensions = useWindowDimensions();
69
+ const [keyboardOpen, setKeyboardOpen] = React.useState(false);
70
+ React.useEffect(() => {
71
+ const showSubscription = Keyboard.addListener("keyboardDidShow", () => {
72
+ setKeyboardOpen(true);
73
+ });
74
+ const hideSubscription = Keyboard.addListener("keyboardDidHide", () => {
75
+ setKeyboardOpen(false);
76
+ });
77
+ return () => {
78
+ showSubscription.remove();
79
+ hideSubscription.remove();
80
+ };
81
+ }, []);
82
+ useIsomorphicLayoutEffect(() => {
83
+ floating.update();
84
+ }, [dimensions, keyboardOpen]);
85
+ }
63
86
  return /* @__PURE__ */ jsx(PopperProvider, {
64
87
  scope: __scopePopper,
65
88
  anchorRef,
@@ -137,6 +160,7 @@ const PopperContent = PopperContentFrame.extractable(
137
160
  position: strategy
138
161
  };
139
162
  return /* @__PURE__ */ jsx(YStack, {
163
+ animateOnly: ["transform"],
140
164
  ...getFloatingProps ? getFloatingProps(frameProps) : frameProps,
141
165
  children: contents
142
166
  });
@@ -168,6 +192,7 @@ const opposites = {
168
192
  };
169
193
  const PopperArrow = PopperArrowFrame.extractable(
170
194
  React.forwardRef(function PopperArrow2(props, forwardedRef) {
195
+ var _a, _b;
171
196
  const {
172
197
  __scopePopper,
173
198
  offset: offset2,
@@ -180,8 +205,9 @@ const PopperArrow = PopperArrowFrame.extractable(
180
205
  const sizeValResolved = getVariableValue(stepTokenUpOrDown("space", sizeVal, -2, [2]));
181
206
  const size = +sizeValResolved;
182
207
  const { placement } = context;
183
- const { x, y } = context.arrowStyle || { x: 0, y: 0 };
184
208
  const refs = useComposedRefs(context.arrowRef, forwardedRef);
209
+ const x = ((_a = context.arrowStyle) == null ? void 0 : _a.x) || 0;
210
+ const y = ((_b = context.arrowStyle) == null ? void 0 : _b.y) || 0;
185
211
  const primaryPlacement = placement ? placement.split("-")[0] : "top";
186
212
  const arrowStyle = { x, y, width: size, height: size };
187
213
  const innerArrowStyle = {};
@@ -201,8 +227,8 @@ const PopperArrow = PopperArrowFrame.extractable(
201
227
  }
202
228
  }
203
229
  useIsomorphicLayoutEffect(() => {
204
- var _a;
205
- (_a = context.onArrowSize) == null ? void 0 : _a.call(context, size);
230
+ var _a2;
231
+ (_a2 = context.onArrowSize) == null ? void 0 : _a2.call(context, size);
206
232
  }, [size, context.onArrowSize]);
207
233
  return /* @__PURE__ */ jsx(PopperArrowOuterFrame, {
208
234
  ref: refs,
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Popper.tsx"],
4
- "sourcesContent": ["// adapted from radix-ui popper\n\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n SizeTokens,\n StackProps,\n getVariableValue,\n styled,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { stepTokenUpOrDown } from '@tamagui/get-size'\nimport { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { View } from 'react-native'\n\nimport {\n Coords,\n Placement,\n Strategy,\n arrow,\n autoUpdate,\n flip,\n offset,\n shift,\n} from './floating'\nimport { UseFloatingReturn, useFloating } from './useFloating'\n\ntype ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never\ntype FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never\n\n/* -------------------------------------------------------------------------------------------------\n * Popper\n * -----------------------------------------------------------------------------------------------*/\n\nconst POPPER_NAME = 'Popper'\n\ntype ScopedProps<P> = P & { __scopePopper?: Scope }\nconst [createPopperContext, createScope] = createContextScope(POPPER_NAME)\n\nexport const createPopperScope = createScope\n\ntype PopperContextValue = UseFloatingReturn & {\n isMounted: boolean\n anchorRef: any\n size?: SizeTokens\n placement?: Placement\n arrowRef: any\n onArrowSize?: (val: number) => void\n arrowStyle?: Partial<Coords> & {\n centerOffset: number\n }\n}\nexport const [PopperProvider, usePopperContext] =\n createPopperContext<PopperContextValue>(POPPER_NAME)\n\nexport type PopperProps = {\n size?: SizeTokens\n children?: React.ReactNode\n placement?: Placement\n stayInFrame?: ShiftProps | boolean\n allowFlip?: FlipProps | boolean\n strategy?: Strategy\n}\n\nexport const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) => {\n const {\n __scopePopper,\n children,\n size,\n strategy = 'absolute',\n placement = 'bottom',\n stayInFrame,\n allowFlip,\n } = props\n\n const [isMounted, setIsMounted] = React.useState(false)\n useIsomorphicLayoutEffect(() => {\n setIsMounted(true)\n }, [])\n\n const anchorRef = React.useRef<any>()\n const [arrowEl, setArrow] = React.useState<HTMLSpanElement | null>(null)\n const [arrowSize, setArrowSize] = React.useState(0)\n const arrowRef = React.useRef()\n\n const floating = useFloating({\n strategy,\n placement,\n middleware: [\n stayInFrame\n ? shift(typeof stayInFrame === 'boolean' ? {} : stayInFrame)\n : (null as any),\n allowFlip ? flip(typeof allowFlip === 'boolean' ? {} : allowFlip) : (null as any),\n arrowEl ? arrow({ element: arrowEl }) : (null as any),\n arrowSize ? offset(arrowSize) : (null as any),\n ].filter(Boolean),\n })\n\n const { refs, middlewareData } = floating\n\n const composedArrowRefs = useComposedRefs<any>(arrowRef, setArrow)\n\n useIsomorphicLayoutEffect(() => {\n floating.reference(anchorRef.current)\n }, [anchorRef])\n\n React.useEffect(() => {\n if (!(refs.reference.current && refs.floating.current)) {\n return\n }\n // Only call this when the floating element is rendered\n return autoUpdate(refs.reference.current, refs.floating.current, floating.update)\n }, [floating.update, refs.floating, refs.reference])\n\n return (\n <PopperProvider\n scope={__scopePopper}\n anchorRef={anchorRef}\n size={size}\n arrowRef={composedArrowRefs}\n arrowStyle={middlewareData.arrow}\n onArrowSize={setArrowSize}\n isMounted={isMounted}\n {...floating}\n >\n {children}\n </PopperProvider>\n )\n}\n\nPopper.displayName = POPPER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopperAnchor'\n\ntype PopperAnchorRef = HTMLElement | View\n\nexport type PopperAnchorProps = YStackProps & {\n virtualRef?: React.RefObject<any>\n}\n\nexport const PopperAnchor = React.forwardRef<PopperAnchorRef, PopperAnchorProps>(\n (props: ScopedProps<PopperAnchorProps>, forwardedRef) => {\n const { __scopePopper, virtualRef, ...anchorProps } = props\n const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper)\n const ref = React.useRef<PopperAnchorRef>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, anchorRef)\n if (virtualRef) {\n return null\n }\n const stackProps = {\n ref: composedRefs,\n ...anchorProps,\n }\n return (\n <YStack {...(getReferenceProps ? getReferenceProps(stackProps) : stackProps)} />\n )\n }\n)\n\nPopperAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopperContent'\n\ntype PopperContentElement = HTMLElement | View\n\nexport type PopperContentProps = SizableStackProps\n\nconst PopperContentFrame = styled(ThemeableStack, {\n name: 'PopperContent',\n backgroundColor: '$background',\n alignItems: 'center',\n radiused: true,\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n padding: tokens.space[val],\n borderRadius: tokens.radius[val],\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const PopperContent = PopperContentFrame.extractable(\n React.forwardRef<PopperContentElement, PopperContentProps>(\n (props: ScopedProps<PopperContentProps>, forwardedRef) => {\n const { __scopePopper, ...contentProps } = props\n const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } =\n usePopperContext(CONTENT_NAME, __scopePopper)\n const contentRefs = useComposedRefs<any>(floating, forwardedRef)\n\n const contents = React.useMemo(() => {\n return (\n <PopperContentFrame\n key=\"popper-content-frame\"\n data-placement={placement}\n data-strategy={strategy}\n size={contentProps.size || size}\n {...contentProps}\n />\n )\n }, [placement, strategy, props])\n\n // all poppers hidden on ssr by default\n if (!isMounted) {\n return null\n }\n\n const frameProps = {\n ref: contentRefs,\n x: x || 0,\n y: y || 0,\n position: strategy,\n }\n\n // outer frame because we explicitly dont want animation to apply to this\n return (\n <YStack {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}>\n {contents}\n </YStack>\n )\n }\n )\n)\n\nPopperContent.displayName = CONTENT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopperArrow'\n\ntype PopperArrowElement = HTMLElement | View\n\nexport type PopperArrowProps = YStackProps & {\n offset?: number\n size?: SizeTokens\n}\n\nconst PopperArrowFrame = styled(YStack, {\n name: 'PopperArrow',\n borderColor: '$borderColor',\n backgroundColor: '$background',\n position: 'relative',\n})\n\nconst PopperArrowOuterFrame = styled(YStack, {\n name: 'PopperArrowOuter',\n position: 'absolute',\n zIndex: -1,\n pointerEvents: 'none',\n overflow: 'hidden',\n alignItems: 'center',\n justifyContent: 'center',\n})\n\nconst opposites = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n} as const\n\ntype Sides = keyof typeof opposites\n\nexport const PopperArrow = PopperArrowFrame.extractable(\n React.forwardRef<PopperArrowElement, PopperArrowProps>(function PopperArrow(\n props: ScopedProps<PopperArrowProps>,\n forwardedRef\n ) {\n const {\n __scopePopper,\n offset,\n size: sizeProp,\n borderWidth = 0,\n ...arrowProps\n } = props\n const context = usePopperContext(ARROW_NAME, __scopePopper)\n const sizeVal = sizeProp ?? context.size\n const sizeValResolved = getVariableValue(stepTokenUpOrDown('space', sizeVal, -2, [2]))\n const size = +sizeValResolved\n const { placement } = context\n const { x, y } = context.arrowStyle || { x: 0, y: 0 }\n const refs = useComposedRefs(context.arrowRef, forwardedRef)\n\n const primaryPlacement = (placement ? placement.split('-')[0] : 'top') as Sides\n\n const arrowStyle: StackProps = { x, y, width: size, height: size }\n const innerArrowStyle: StackProps = {}\n const isVertical = primaryPlacement === 'bottom' || primaryPlacement === 'top'\n\n if (primaryPlacement) {\n // allows for extra diagonal size\n arrowStyle[isVertical ? 'width' : 'height'] = size * 2\n const oppSide = opposites[primaryPlacement]\n if (oppSide) {\n arrowStyle[oppSide] = -size\n innerArrowStyle[oppSide] = size / 2\n }\n if (oppSide === 'top' || oppSide === 'bottom') {\n arrowStyle.left = 0\n }\n if (oppSide === 'left' || oppSide === 'right') {\n arrowStyle.top = 0\n }\n }\n\n // send the Arrow's offset up to Popper\n useIsomorphicLayoutEffect(() => {\n context.onArrowSize?.(size)\n }, [size, context.onArrowSize])\n\n // outer frame to cut off for ability to have nicer shadows/borders\n return (\n <PopperArrowOuterFrame ref={refs} {...arrowStyle}>\n <PopperArrowFrame\n width={size}\n height={size}\n {...arrowProps}\n {...innerArrowStyle}\n rotate=\"45deg\"\n {...(primaryPlacement === 'bottom' && {\n borderBottomWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'top' && {\n borderTopWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n {...(primaryPlacement === 'right' && {\n borderTopWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'left' && {\n borderBottomWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n />\n </PopperArrowOuterFrame>\n )\n })\n)\n\nPopperArrow.displayName = ARROW_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n"],
5
- "mappings": "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",
6
- "names": ["PopperArrow", "offset"]
4
+ "sourcesContent": ["// adapted from radix-ui popper\n\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n SizeTokens,\n StackProps,\n getVariableValue,\n isWeb,\n styled,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport {\n Coords,\n Placement,\n Strategy,\n UseFloatingReturn,\n arrow,\n autoUpdate,\n flip,\n offset,\n shift,\n useFloating,\n} from '@tamagui/floating'\nimport { stepTokenUpOrDown } from '@tamagui/get-size'\nimport { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { Keyboard, View, useWindowDimensions } from 'react-native'\n\ntype ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never\ntype FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never\n\n/* -------------------------------------------------------------------------------------------------\n * Popper\n * -----------------------------------------------------------------------------------------------*/\n\nconst POPPER_NAME = 'Popper'\n\ntype ScopedProps<P> = P & { __scopePopper?: Scope }\nconst [createPopperContext, createScope] = createContextScope(POPPER_NAME)\n\nexport const createPopperScope = createScope\n\ntype PopperContextValue = UseFloatingReturn & {\n isMounted: boolean\n anchorRef: any\n size?: SizeTokens\n placement?: Placement\n arrowRef: any\n onArrowSize?: (val: number) => void\n arrowStyle?: Partial<Coords> & {\n centerOffset: number\n }\n}\nexport const [PopperProvider, usePopperContext] =\n createPopperContext<PopperContextValue>(POPPER_NAME)\n\nexport type PopperProps = {\n size?: SizeTokens\n children?: React.ReactNode\n placement?: Placement\n stayInFrame?: ShiftProps | boolean\n allowFlip?: FlipProps | boolean\n strategy?: Strategy\n}\n\nexport const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) => {\n const {\n __scopePopper,\n children,\n size,\n strategy = 'absolute',\n placement = 'bottom',\n stayInFrame,\n allowFlip,\n } = props\n\n const [isMounted, setIsMounted] = React.useState(false)\n useIsomorphicLayoutEffect(() => {\n setIsMounted(true)\n }, [])\n\n const anchorRef = React.useRef<any>()\n const [arrowEl, setArrow] = React.useState<any>(null)\n const [arrowSize, setArrowSize] = React.useState(0)\n const arrowRef = React.useRef()\n\n const floating = useFloating({\n strategy,\n placement,\n sameScrollView: false, // this only takes effect on native\n middleware: [\n stayInFrame\n ? shift(typeof stayInFrame === 'boolean' ? {} : stayInFrame)\n : (null as any),\n allowFlip ? flip(typeof allowFlip === 'boolean' ? {} : allowFlip) : (null as any),\n arrowEl ? arrow({ element: arrowEl }) : (null as any),\n arrowSize ? offset(arrowSize) : (null as any),\n ].filter(Boolean),\n })\n\n const { refs, middlewareData } = floating\n\n const composedArrowRefs = useComposedRefs<any>(arrowRef, setArrow)\n\n useIsomorphicLayoutEffect(() => {\n floating.reference(anchorRef.current)\n }, [anchorRef])\n\n if (isWeb) {\n React.useEffect(() => {\n if (!(refs.reference.current && refs.floating.current)) {\n return\n }\n // Only call this when the floating element is rendered\n return autoUpdate(refs.reference.current, refs.floating.current, floating.update)\n }, [floating.update, refs.floating, refs.reference])\n } else {\n // On Native there's no autoupdate so we call update() when necessary\n\n // Subscribe to window dimensions (orientation, scale, etc...)\n const dimensions = useWindowDimensions()\n\n // Subscribe to keyboard state\n const [keyboardOpen, setKeyboardOpen] = React.useState(false)\n React.useEffect(() => {\n const showSubscription = Keyboard.addListener('keyboardDidShow', () => {\n setKeyboardOpen(true)\n })\n const hideSubscription = Keyboard.addListener('keyboardDidHide', () => {\n setKeyboardOpen(false)\n })\n\n return () => {\n showSubscription.remove()\n hideSubscription.remove()\n }\n }, [])\n\n useIsomorphicLayoutEffect(() => {\n floating.update()\n }, [dimensions, keyboardOpen])\n }\n\n return (\n <PopperProvider\n scope={__scopePopper}\n anchorRef={anchorRef}\n size={size}\n arrowRef={composedArrowRefs}\n arrowStyle={middlewareData.arrow}\n onArrowSize={setArrowSize}\n isMounted={isMounted}\n {...floating}\n >\n {children}\n </PopperProvider>\n )\n}\n\nPopper.displayName = POPPER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopperAnchor'\n\ntype PopperAnchorRef = HTMLElement | View\n\nexport type PopperAnchorProps = YStackProps & {\n virtualRef?: React.RefObject<any>\n}\n\nexport const PopperAnchor = React.forwardRef<PopperAnchorRef, PopperAnchorProps>(\n (props: ScopedProps<PopperAnchorProps>, forwardedRef) => {\n const { __scopePopper, virtualRef, ...anchorProps } = props\n const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper)\n const ref = React.useRef<PopperAnchorRef>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, anchorRef)\n if (virtualRef) {\n return null\n }\n const stackProps = {\n ref: composedRefs,\n ...anchorProps,\n }\n return (\n <YStack {...(getReferenceProps ? getReferenceProps(stackProps) : stackProps)} />\n )\n }\n)\n\nPopperAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopperContent'\n\ntype PopperContentElement = HTMLElement | View\n\nexport type PopperContentProps = SizableStackProps\n\nconst PopperContentFrame = styled(ThemeableStack, {\n name: 'PopperContent',\n backgroundColor: '$background',\n alignItems: 'center',\n radiused: true,\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n padding: tokens.space[val],\n borderRadius: tokens.radius[val],\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const PopperContent = PopperContentFrame.extractable(\n React.forwardRef<PopperContentElement, PopperContentProps>(\n (props: ScopedProps<PopperContentProps>, forwardedRef) => {\n const { __scopePopper, ...contentProps } = props\n const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } =\n usePopperContext(CONTENT_NAME, __scopePopper)\n const contentRefs = useComposedRefs<any>(floating, forwardedRef)\n\n const contents = React.useMemo(() => {\n return (\n <PopperContentFrame\n key=\"popper-content-frame\"\n data-placement={placement}\n data-strategy={strategy}\n size={contentProps.size || size}\n {...contentProps}\n />\n )\n }, [placement, strategy, props])\n\n // all poppers hidden on ssr by default\n if (!isMounted) {\n return null\n }\n\n const frameProps = {\n ref: contentRefs,\n x: x || 0,\n y: y || 0,\n position: strategy,\n }\n\n // outer frame because we explicitly dont want animation to apply to this\n return (\n <YStack\n animateOnly={['transform']}\n {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}\n >\n {contents}\n </YStack>\n )\n }\n )\n)\n\nPopperContent.displayName = CONTENT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopperArrow'\n\ntype PopperArrowElement = HTMLElement | View\n\nexport type PopperArrowProps = YStackProps & {\n offset?: number\n size?: SizeTokens\n}\n\nconst PopperArrowFrame = styled(YStack, {\n name: 'PopperArrow',\n borderColor: '$borderColor',\n backgroundColor: '$background',\n position: 'relative',\n})\n\nconst PopperArrowOuterFrame = styled(YStack, {\n name: 'PopperArrowOuter',\n position: 'absolute',\n zIndex: -1,\n pointerEvents: 'none',\n overflow: 'hidden',\n alignItems: 'center',\n justifyContent: 'center',\n})\n\nconst opposites = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n} as const\n\ntype Sides = keyof typeof opposites\n\nexport const PopperArrow = PopperArrowFrame.extractable(\n React.forwardRef<PopperArrowElement, PopperArrowProps>(function PopperArrow(\n props: ScopedProps<PopperArrowProps>,\n forwardedRef\n ) {\n const {\n __scopePopper,\n offset,\n size: sizeProp,\n borderWidth = 0,\n ...arrowProps\n } = props\n const context = usePopperContext(ARROW_NAME, __scopePopper)\n const sizeVal = sizeProp ?? context.size\n const sizeValResolved = getVariableValue(stepTokenUpOrDown('space', sizeVal, -2, [2]))\n const size = +sizeValResolved\n const { placement } = context\n const refs = useComposedRefs(context.arrowRef, forwardedRef)\n\n // Sometimes floating-ui can return NaN during orientation or screen size changes on native\n // so we explictly force the x,y position types as a number\n const x = (context.arrowStyle?.x as number) || 0\n const y = (context.arrowStyle?.y as number) || 0\n\n const primaryPlacement = (placement ? placement.split('-')[0] : 'top') as Sides\n\n const arrowStyle: StackProps = { x, y, width: size, height: size }\n const innerArrowStyle: StackProps = {}\n const isVertical = primaryPlacement === 'bottom' || primaryPlacement === 'top'\n\n if (primaryPlacement) {\n // allows for extra diagonal size\n arrowStyle[isVertical ? 'width' : 'height'] = size * 2\n const oppSide = opposites[primaryPlacement]\n if (oppSide) {\n arrowStyle[oppSide] = -size\n innerArrowStyle[oppSide] = size / 2\n }\n if (oppSide === 'top' || oppSide === 'bottom') {\n arrowStyle.left = 0\n }\n if (oppSide === 'left' || oppSide === 'right') {\n arrowStyle.top = 0\n }\n }\n\n // send the Arrow's offset up to Popper\n useIsomorphicLayoutEffect(() => {\n context.onArrowSize?.(size)\n }, [size, context.onArrowSize])\n\n // outer frame to cut off for ability to have nicer shadows/borders\n return (\n <PopperArrowOuterFrame ref={refs} {...arrowStyle}>\n <PopperArrowFrame\n width={size}\n height={size}\n {...arrowProps}\n {...innerArrowStyle}\n rotate=\"45deg\"\n {...(primaryPlacement === 'bottom' && {\n borderBottomWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'top' && {\n borderTopWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n {...(primaryPlacement === 'right' && {\n borderTopWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'left' && {\n borderBottomWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n />\n </PopperArrowOuterFrame>\n )\n })\n)\n\nPopperArrow.displayName = ARROW_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n"],
5
+ "mappings": "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",
6
+ "names": ["PopperArrow", "offset", "_a"]
7
7
  }
package/dist/esm/index.js CHANGED
@@ -1,6 +1,2 @@
1
- import { FloatingOverrideContext } from "./useFloating";
2
1
  export * from "./Popper";
3
- export {
4
- FloatingOverrideContext
5
- };
6
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx"],
4
- "sourcesContent": ["export { FloatingOverrideContext, type UseFloatingFn } from './useFloating'\nexport * from './Popper'\n"],
5
- "mappings": "AAAA,SAAS,+BAAmD;AAC5D,cAAc;",
4
+ "sourcesContent": ["export * from './Popper'\n"],
5
+ "mappings": "AAAA,cAAc;",
6
6
  "names": []
7
7
  }
@@ -1,21 +1,23 @@
1
1
  import { useComposedRefs } from "@tamagui/compose-refs";
2
2
  import {
3
3
  getVariableValue,
4
+ isWeb,
4
5
  styled,
5
6
  useIsomorphicLayoutEffect
6
7
  } from "@tamagui/core";
7
8
  import { createContextScope } from "@tamagui/create-context";
8
- import { stepTokenUpOrDown } from "@tamagui/get-size";
9
- import { ThemeableStack, YStack } from "@tamagui/stacks";
10
- import * as React from "react";
11
9
  import {
12
10
  arrow,
13
11
  autoUpdate,
14
12
  flip,
15
13
  offset,
16
- shift
17
- } from "./floating";
18
- import { useFloating } from "./useFloating";
14
+ shift,
15
+ useFloating
16
+ } from "@tamagui/floating";
17
+ import { stepTokenUpOrDown } from "@tamagui/get-size";
18
+ import { ThemeableStack, YStack } from "@tamagui/stacks";
19
+ import * as React from "react";
20
+ import { Keyboard, useWindowDimensions } from "react-native";
19
21
  const POPPER_NAME = "Popper";
20
22
  const [createPopperContext, createScope] = createContextScope(POPPER_NAME);
21
23
  const createPopperScope = createScope;
@@ -41,6 +43,7 @@ const Popper = (props) => {
41
43
  const floating = useFloating({
42
44
  strategy,
43
45
  placement,
46
+ sameScrollView: false,
44
47
  middleware: [
45
48
  stayInFrame ? shift(typeof stayInFrame === "boolean" ? {} : stayInFrame) : null,
46
49
  allowFlip ? flip(typeof allowFlip === "boolean" ? {} : allowFlip) : null,
@@ -53,12 +56,32 @@ const Popper = (props) => {
53
56
  useIsomorphicLayoutEffect(() => {
54
57
  floating.reference(anchorRef.current);
55
58
  }, [anchorRef]);
56
- React.useEffect(() => {
57
- if (!(refs.reference.current && refs.floating.current)) {
58
- return;
59
- }
60
- return autoUpdate(refs.reference.current, refs.floating.current, floating.update);
61
- }, [floating.update, refs.floating, refs.reference]);
59
+ if (isWeb) {
60
+ React.useEffect(() => {
61
+ if (!(refs.reference.current && refs.floating.current)) {
62
+ return;
63
+ }
64
+ return autoUpdate(refs.reference.current, refs.floating.current, floating.update);
65
+ }, [floating.update, refs.floating, refs.reference]);
66
+ } else {
67
+ const dimensions = useWindowDimensions();
68
+ const [keyboardOpen, setKeyboardOpen] = React.useState(false);
69
+ React.useEffect(() => {
70
+ const showSubscription = Keyboard.addListener("keyboardDidShow", () => {
71
+ setKeyboardOpen(true);
72
+ });
73
+ const hideSubscription = Keyboard.addListener("keyboardDidHide", () => {
74
+ setKeyboardOpen(false);
75
+ });
76
+ return () => {
77
+ showSubscription.remove();
78
+ hideSubscription.remove();
79
+ };
80
+ }, []);
81
+ useIsomorphicLayoutEffect(() => {
82
+ floating.update();
83
+ }, [dimensions, keyboardOpen]);
84
+ }
62
85
  return <PopperProvider scope={__scopePopper} anchorRef={anchorRef} size={size} arrowRef={composedArrowRefs} arrowStyle={middlewareData.arrow} onArrowSize={setArrowSize} isMounted={isMounted} {...floating}>{children}</PopperProvider>;
63
86
  };
64
87
  Popper.displayName = POPPER_NAME;
@@ -118,7 +141,7 @@ const PopperContent = PopperContentFrame.extractable(
118
141
  y: y || 0,
119
142
  position: strategy
120
143
  };
121
- return <YStack {...getFloatingProps ? getFloatingProps(frameProps) : frameProps}>{contents}</YStack>;
144
+ return <YStack animateOnly={["transform"]} {...getFloatingProps ? getFloatingProps(frameProps) : frameProps}>{contents}</YStack>;
122
145
  }
123
146
  )
124
147
  );
@@ -159,8 +182,9 @@ const PopperArrow = PopperArrowFrame.extractable(
159
182
  const sizeValResolved = getVariableValue(stepTokenUpOrDown("space", sizeVal, -2, [2]));
160
183
  const size = +sizeValResolved;
161
184
  const { placement } = context;
162
- const { x, y } = context.arrowStyle || { x: 0, y: 0 };
163
185
  const refs = useComposedRefs(context.arrowRef, forwardedRef);
186
+ const x = context.arrowStyle?.x || 0;
187
+ const y = context.arrowStyle?.y || 0;
164
188
  const primaryPlacement = placement ? placement.split("-")[0] : "top";
165
189
  const arrowStyle = { x, y, width: size, height: size };
166
190
  const innerArrowStyle = {};
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Popper.tsx"],
4
- "sourcesContent": ["// adapted from radix-ui popper\n\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n SizeTokens,\n StackProps,\n getVariableValue,\n styled,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport { stepTokenUpOrDown } from '@tamagui/get-size'\nimport { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { View } from 'react-native'\n\nimport {\n Coords,\n Placement,\n Strategy,\n arrow,\n autoUpdate,\n flip,\n offset,\n shift,\n} from './floating'\nimport { UseFloatingReturn, useFloating } from './useFloating'\n\ntype ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never\ntype FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never\n\n/* -------------------------------------------------------------------------------------------------\n * Popper\n * -----------------------------------------------------------------------------------------------*/\n\nconst POPPER_NAME = 'Popper'\n\ntype ScopedProps<P> = P & { __scopePopper?: Scope }\nconst [createPopperContext, createScope] = createContextScope(POPPER_NAME)\n\nexport const createPopperScope = createScope\n\ntype PopperContextValue = UseFloatingReturn & {\n isMounted: boolean\n anchorRef: any\n size?: SizeTokens\n placement?: Placement\n arrowRef: any\n onArrowSize?: (val: number) => void\n arrowStyle?: Partial<Coords> & {\n centerOffset: number\n }\n}\nexport const [PopperProvider, usePopperContext] =\n createPopperContext<PopperContextValue>(POPPER_NAME)\n\nexport type PopperProps = {\n size?: SizeTokens\n children?: React.ReactNode\n placement?: Placement\n stayInFrame?: ShiftProps | boolean\n allowFlip?: FlipProps | boolean\n strategy?: Strategy\n}\n\nexport const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) => {\n const {\n __scopePopper,\n children,\n size,\n strategy = 'absolute',\n placement = 'bottom',\n stayInFrame,\n allowFlip,\n } = props\n\n const [isMounted, setIsMounted] = React.useState(false)\n useIsomorphicLayoutEffect(() => {\n setIsMounted(true)\n }, [])\n\n const anchorRef = React.useRef<any>()\n const [arrowEl, setArrow] = React.useState<HTMLSpanElement | null>(null)\n const [arrowSize, setArrowSize] = React.useState(0)\n const arrowRef = React.useRef()\n\n const floating = useFloating({\n strategy,\n placement,\n middleware: [\n stayInFrame\n ? shift(typeof stayInFrame === 'boolean' ? {} : stayInFrame)\n : (null as any),\n allowFlip ? flip(typeof allowFlip === 'boolean' ? {} : allowFlip) : (null as any),\n arrowEl ? arrow({ element: arrowEl }) : (null as any),\n arrowSize ? offset(arrowSize) : (null as any),\n ].filter(Boolean),\n })\n\n const { refs, middlewareData } = floating\n\n const composedArrowRefs = useComposedRefs<any>(arrowRef, setArrow)\n\n useIsomorphicLayoutEffect(() => {\n floating.reference(anchorRef.current)\n }, [anchorRef])\n\n React.useEffect(() => {\n if (!(refs.reference.current && refs.floating.current)) {\n return\n }\n // Only call this when the floating element is rendered\n return autoUpdate(refs.reference.current, refs.floating.current, floating.update)\n }, [floating.update, refs.floating, refs.reference])\n\n return (\n <PopperProvider\n scope={__scopePopper}\n anchorRef={anchorRef}\n size={size}\n arrowRef={composedArrowRefs}\n arrowStyle={middlewareData.arrow}\n onArrowSize={setArrowSize}\n isMounted={isMounted}\n {...floating}\n >\n {children}\n </PopperProvider>\n )\n}\n\nPopper.displayName = POPPER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopperAnchor'\n\ntype PopperAnchorRef = HTMLElement | View\n\nexport type PopperAnchorProps = YStackProps & {\n virtualRef?: React.RefObject<any>\n}\n\nexport const PopperAnchor = React.forwardRef<PopperAnchorRef, PopperAnchorProps>(\n (props: ScopedProps<PopperAnchorProps>, forwardedRef) => {\n const { __scopePopper, virtualRef, ...anchorProps } = props\n const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper)\n const ref = React.useRef<PopperAnchorRef>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, anchorRef)\n if (virtualRef) {\n return null\n }\n const stackProps = {\n ref: composedRefs,\n ...anchorProps,\n }\n return (\n <YStack {...(getReferenceProps ? getReferenceProps(stackProps) : stackProps)} />\n )\n }\n)\n\nPopperAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopperContent'\n\ntype PopperContentElement = HTMLElement | View\n\nexport type PopperContentProps = SizableStackProps\n\nconst PopperContentFrame = styled(ThemeableStack, {\n name: 'PopperContent',\n backgroundColor: '$background',\n alignItems: 'center',\n radiused: true,\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n padding: tokens.space[val],\n borderRadius: tokens.radius[val],\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const PopperContent = PopperContentFrame.extractable(\n React.forwardRef<PopperContentElement, PopperContentProps>(\n (props: ScopedProps<PopperContentProps>, forwardedRef) => {\n const { __scopePopper, ...contentProps } = props\n const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } =\n usePopperContext(CONTENT_NAME, __scopePopper)\n const contentRefs = useComposedRefs<any>(floating, forwardedRef)\n\n const contents = React.useMemo(() => {\n return (\n <PopperContentFrame\n key=\"popper-content-frame\"\n data-placement={placement}\n data-strategy={strategy}\n size={contentProps.size || size}\n {...contentProps}\n />\n )\n }, [placement, strategy, props])\n\n // all poppers hidden on ssr by default\n if (!isMounted) {\n return null\n }\n\n const frameProps = {\n ref: contentRefs,\n x: x || 0,\n y: y || 0,\n position: strategy,\n }\n\n // outer frame because we explicitly dont want animation to apply to this\n return (\n <YStack {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}>\n {contents}\n </YStack>\n )\n }\n )\n)\n\nPopperContent.displayName = CONTENT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopperArrow'\n\ntype PopperArrowElement = HTMLElement | View\n\nexport type PopperArrowProps = YStackProps & {\n offset?: number\n size?: SizeTokens\n}\n\nconst PopperArrowFrame = styled(YStack, {\n name: 'PopperArrow',\n borderColor: '$borderColor',\n backgroundColor: '$background',\n position: 'relative',\n})\n\nconst PopperArrowOuterFrame = styled(YStack, {\n name: 'PopperArrowOuter',\n position: 'absolute',\n zIndex: -1,\n pointerEvents: 'none',\n overflow: 'hidden',\n alignItems: 'center',\n justifyContent: 'center',\n})\n\nconst opposites = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n} as const\n\ntype Sides = keyof typeof opposites\n\nexport const PopperArrow = PopperArrowFrame.extractable(\n React.forwardRef<PopperArrowElement, PopperArrowProps>(function PopperArrow(\n props: ScopedProps<PopperArrowProps>,\n forwardedRef\n ) {\n const {\n __scopePopper,\n offset,\n size: sizeProp,\n borderWidth = 0,\n ...arrowProps\n } = props\n const context = usePopperContext(ARROW_NAME, __scopePopper)\n const sizeVal = sizeProp ?? context.size\n const sizeValResolved = getVariableValue(stepTokenUpOrDown('space', sizeVal, -2, [2]))\n const size = +sizeValResolved\n const { placement } = context\n const { x, y } = context.arrowStyle || { x: 0, y: 0 }\n const refs = useComposedRefs(context.arrowRef, forwardedRef)\n\n const primaryPlacement = (placement ? placement.split('-')[0] : 'top') as Sides\n\n const arrowStyle: StackProps = { x, y, width: size, height: size }\n const innerArrowStyle: StackProps = {}\n const isVertical = primaryPlacement === 'bottom' || primaryPlacement === 'top'\n\n if (primaryPlacement) {\n // allows for extra diagonal size\n arrowStyle[isVertical ? 'width' : 'height'] = size * 2\n const oppSide = opposites[primaryPlacement]\n if (oppSide) {\n arrowStyle[oppSide] = -size\n innerArrowStyle[oppSide] = size / 2\n }\n if (oppSide === 'top' || oppSide === 'bottom') {\n arrowStyle.left = 0\n }\n if (oppSide === 'left' || oppSide === 'right') {\n arrowStyle.top = 0\n }\n }\n\n // send the Arrow's offset up to Popper\n useIsomorphicLayoutEffect(() => {\n context.onArrowSize?.(size)\n }, [size, context.onArrowSize])\n\n // outer frame to cut off for ability to have nicer shadows/borders\n return (\n <PopperArrowOuterFrame ref={refs} {...arrowStyle}>\n <PopperArrowFrame\n width={size}\n height={size}\n {...arrowProps}\n {...innerArrowStyle}\n rotate=\"45deg\"\n {...(primaryPlacement === 'bottom' && {\n borderBottomWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'top' && {\n borderTopWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n {...(primaryPlacement === 'right' && {\n borderTopWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'left' && {\n borderBottomWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n />\n </PopperArrowOuterFrame>\n )\n })\n)\n\nPopperArrow.displayName = ARROW_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n"],
5
- "mappings": "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",
4
+ "sourcesContent": ["// adapted from radix-ui popper\n\nimport { useComposedRefs } from '@tamagui/compose-refs'\nimport {\n SizeTokens,\n StackProps,\n getVariableValue,\n isWeb,\n styled,\n useIsomorphicLayoutEffect,\n} from '@tamagui/core'\nimport { Scope, createContextScope } from '@tamagui/create-context'\nimport {\n Coords,\n Placement,\n Strategy,\n UseFloatingReturn,\n arrow,\n autoUpdate,\n flip,\n offset,\n shift,\n useFloating,\n} from '@tamagui/floating'\nimport { stepTokenUpOrDown } from '@tamagui/get-size'\nimport { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'\nimport * as React from 'react'\nimport { Keyboard, View, useWindowDimensions } from 'react-native'\n\ntype ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never\ntype FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never\n\n/* -------------------------------------------------------------------------------------------------\n * Popper\n * -----------------------------------------------------------------------------------------------*/\n\nconst POPPER_NAME = 'Popper'\n\ntype ScopedProps<P> = P & { __scopePopper?: Scope }\nconst [createPopperContext, createScope] = createContextScope(POPPER_NAME)\n\nexport const createPopperScope = createScope\n\ntype PopperContextValue = UseFloatingReturn & {\n isMounted: boolean\n anchorRef: any\n size?: SizeTokens\n placement?: Placement\n arrowRef: any\n onArrowSize?: (val: number) => void\n arrowStyle?: Partial<Coords> & {\n centerOffset: number\n }\n}\nexport const [PopperProvider, usePopperContext] =\n createPopperContext<PopperContextValue>(POPPER_NAME)\n\nexport type PopperProps = {\n size?: SizeTokens\n children?: React.ReactNode\n placement?: Placement\n stayInFrame?: ShiftProps | boolean\n allowFlip?: FlipProps | boolean\n strategy?: Strategy\n}\n\nexport const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) => {\n const {\n __scopePopper,\n children,\n size,\n strategy = 'absolute',\n placement = 'bottom',\n stayInFrame,\n allowFlip,\n } = props\n\n const [isMounted, setIsMounted] = React.useState(false)\n useIsomorphicLayoutEffect(() => {\n setIsMounted(true)\n }, [])\n\n const anchorRef = React.useRef<any>()\n const [arrowEl, setArrow] = React.useState<any>(null)\n const [arrowSize, setArrowSize] = React.useState(0)\n const arrowRef = React.useRef()\n\n const floating = useFloating({\n strategy,\n placement,\n sameScrollView: false, // this only takes effect on native\n middleware: [\n stayInFrame\n ? shift(typeof stayInFrame === 'boolean' ? {} : stayInFrame)\n : (null as any),\n allowFlip ? flip(typeof allowFlip === 'boolean' ? {} : allowFlip) : (null as any),\n arrowEl ? arrow({ element: arrowEl }) : (null as any),\n arrowSize ? offset(arrowSize) : (null as any),\n ].filter(Boolean),\n })\n\n const { refs, middlewareData } = floating\n\n const composedArrowRefs = useComposedRefs<any>(arrowRef, setArrow)\n\n useIsomorphicLayoutEffect(() => {\n floating.reference(anchorRef.current)\n }, [anchorRef])\n\n if (isWeb) {\n React.useEffect(() => {\n if (!(refs.reference.current && refs.floating.current)) {\n return\n }\n // Only call this when the floating element is rendered\n return autoUpdate(refs.reference.current, refs.floating.current, floating.update)\n }, [floating.update, refs.floating, refs.reference])\n } else {\n // On Native there's no autoupdate so we call update() when necessary\n\n // Subscribe to window dimensions (orientation, scale, etc...)\n const dimensions = useWindowDimensions()\n\n // Subscribe to keyboard state\n const [keyboardOpen, setKeyboardOpen] = React.useState(false)\n React.useEffect(() => {\n const showSubscription = Keyboard.addListener('keyboardDidShow', () => {\n setKeyboardOpen(true)\n })\n const hideSubscription = Keyboard.addListener('keyboardDidHide', () => {\n setKeyboardOpen(false)\n })\n\n return () => {\n showSubscription.remove()\n hideSubscription.remove()\n }\n }, [])\n\n useIsomorphicLayoutEffect(() => {\n floating.update()\n }, [dimensions, keyboardOpen])\n }\n\n return (\n <PopperProvider\n scope={__scopePopper}\n anchorRef={anchorRef}\n size={size}\n arrowRef={composedArrowRefs}\n arrowStyle={middlewareData.arrow}\n onArrowSize={setArrowSize}\n isMounted={isMounted}\n {...floating}\n >\n {children}\n </PopperProvider>\n )\n}\n\nPopper.displayName = POPPER_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperAnchor\n * -----------------------------------------------------------------------------------------------*/\n\nconst ANCHOR_NAME = 'PopperAnchor'\n\ntype PopperAnchorRef = HTMLElement | View\n\nexport type PopperAnchorProps = YStackProps & {\n virtualRef?: React.RefObject<any>\n}\n\nexport const PopperAnchor = React.forwardRef<PopperAnchorRef, PopperAnchorProps>(\n (props: ScopedProps<PopperAnchorProps>, forwardedRef) => {\n const { __scopePopper, virtualRef, ...anchorProps } = props\n const { anchorRef, getReferenceProps } = usePopperContext(ANCHOR_NAME, __scopePopper)\n const ref = React.useRef<PopperAnchorRef>(null)\n const composedRefs = useComposedRefs(forwardedRef, ref, anchorRef)\n if (virtualRef) {\n return null\n }\n const stackProps = {\n ref: composedRefs,\n ...anchorProps,\n }\n return (\n <YStack {...(getReferenceProps ? getReferenceProps(stackProps) : stackProps)} />\n )\n }\n)\n\nPopperAnchor.displayName = ANCHOR_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperContent\n * -----------------------------------------------------------------------------------------------*/\n\nconst CONTENT_NAME = 'PopperContent'\n\ntype PopperContentElement = HTMLElement | View\n\nexport type PopperContentProps = SizableStackProps\n\nconst PopperContentFrame = styled(ThemeableStack, {\n name: 'PopperContent',\n backgroundColor: '$background',\n alignItems: 'center',\n radiused: true,\n\n variants: {\n size: {\n '...size': (val, { tokens }) => {\n return {\n padding: tokens.space[val],\n borderRadius: tokens.radius[val],\n }\n },\n },\n } as const,\n\n defaultVariants: {\n size: '$true',\n },\n})\n\nexport const PopperContent = PopperContentFrame.extractable(\n React.forwardRef<PopperContentElement, PopperContentProps>(\n (props: ScopedProps<PopperContentProps>, forwardedRef) => {\n const { __scopePopper, ...contentProps } = props\n const { strategy, placement, floating, x, y, getFloatingProps, size, isMounted } =\n usePopperContext(CONTENT_NAME, __scopePopper)\n const contentRefs = useComposedRefs<any>(floating, forwardedRef)\n\n const contents = React.useMemo(() => {\n return (\n <PopperContentFrame\n key=\"popper-content-frame\"\n data-placement={placement}\n data-strategy={strategy}\n size={contentProps.size || size}\n {...contentProps}\n />\n )\n }, [placement, strategy, props])\n\n // all poppers hidden on ssr by default\n if (!isMounted) {\n return null\n }\n\n const frameProps = {\n ref: contentRefs,\n x: x || 0,\n y: y || 0,\n position: strategy,\n }\n\n // outer frame because we explicitly dont want animation to apply to this\n return (\n <YStack\n animateOnly={['transform']}\n {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}\n >\n {contents}\n </YStack>\n )\n }\n )\n)\n\nPopperContent.displayName = CONTENT_NAME\n\n/* -------------------------------------------------------------------------------------------------\n * PopperArrow\n * -----------------------------------------------------------------------------------------------*/\n\nconst ARROW_NAME = 'PopperArrow'\n\ntype PopperArrowElement = HTMLElement | View\n\nexport type PopperArrowProps = YStackProps & {\n offset?: number\n size?: SizeTokens\n}\n\nconst PopperArrowFrame = styled(YStack, {\n name: 'PopperArrow',\n borderColor: '$borderColor',\n backgroundColor: '$background',\n position: 'relative',\n})\n\nconst PopperArrowOuterFrame = styled(YStack, {\n name: 'PopperArrowOuter',\n position: 'absolute',\n zIndex: -1,\n pointerEvents: 'none',\n overflow: 'hidden',\n alignItems: 'center',\n justifyContent: 'center',\n})\n\nconst opposites = {\n top: 'bottom',\n right: 'left',\n bottom: 'top',\n left: 'right',\n} as const\n\ntype Sides = keyof typeof opposites\n\nexport const PopperArrow = PopperArrowFrame.extractable(\n React.forwardRef<PopperArrowElement, PopperArrowProps>(function PopperArrow(\n props: ScopedProps<PopperArrowProps>,\n forwardedRef\n ) {\n const {\n __scopePopper,\n offset,\n size: sizeProp,\n borderWidth = 0,\n ...arrowProps\n } = props\n const context = usePopperContext(ARROW_NAME, __scopePopper)\n const sizeVal = sizeProp ?? context.size\n const sizeValResolved = getVariableValue(stepTokenUpOrDown('space', sizeVal, -2, [2]))\n const size = +sizeValResolved\n const { placement } = context\n const refs = useComposedRefs(context.arrowRef, forwardedRef)\n\n // Sometimes floating-ui can return NaN during orientation or screen size changes on native\n // so we explictly force the x,y position types as a number\n const x = (context.arrowStyle?.x as number) || 0\n const y = (context.arrowStyle?.y as number) || 0\n\n const primaryPlacement = (placement ? placement.split('-')[0] : 'top') as Sides\n\n const arrowStyle: StackProps = { x, y, width: size, height: size }\n const innerArrowStyle: StackProps = {}\n const isVertical = primaryPlacement === 'bottom' || primaryPlacement === 'top'\n\n if (primaryPlacement) {\n // allows for extra diagonal size\n arrowStyle[isVertical ? 'width' : 'height'] = size * 2\n const oppSide = opposites[primaryPlacement]\n if (oppSide) {\n arrowStyle[oppSide] = -size\n innerArrowStyle[oppSide] = size / 2\n }\n if (oppSide === 'top' || oppSide === 'bottom') {\n arrowStyle.left = 0\n }\n if (oppSide === 'left' || oppSide === 'right') {\n arrowStyle.top = 0\n }\n }\n\n // send the Arrow's offset up to Popper\n useIsomorphicLayoutEffect(() => {\n context.onArrowSize?.(size)\n }, [size, context.onArrowSize])\n\n // outer frame to cut off for ability to have nicer shadows/borders\n return (\n <PopperArrowOuterFrame ref={refs} {...arrowStyle}>\n <PopperArrowFrame\n width={size}\n height={size}\n {...arrowProps}\n {...innerArrowStyle}\n rotate=\"45deg\"\n {...(primaryPlacement === 'bottom' && {\n borderBottomWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'top' && {\n borderTopWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n {...(primaryPlacement === 'right' && {\n borderTopWidth: borderWidth,\n borderRightWidth: borderWidth,\n })}\n {...(primaryPlacement === 'left' && {\n borderBottomWidth: borderWidth,\n borderLeftWidth: borderWidth,\n })}\n />\n </PopperArrowOuterFrame>\n )\n })\n)\n\nPopperArrow.displayName = ARROW_NAME\n\n/* -----------------------------------------------------------------------------------------------*/\n"],
5
+ "mappings": "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",
6
6
  "names": ["PopperArrow", "offset"]
7
7
  }
package/dist/jsx/index.js CHANGED
@@ -1,6 +1,2 @@
1
- import { FloatingOverrideContext } from "./useFloating";
2
1
  export * from "./Popper";
3
- export {
4
- FloatingOverrideContext
5
- };
6
2
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx"],
4
- "sourcesContent": ["export { FloatingOverrideContext, type UseFloatingFn } from './useFloating'\nexport * from './Popper'\n"],
5
- "mappings": "AAAA,SAAS,+BAAmD;AAC5D,cAAc;",
4
+ "sourcesContent": ["export * from './Popper'\n"],
5
+ "mappings": "AAAA,cAAc;",
6
6
  "names": []
7
7
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/popper",
3
- "version": "1.1.7",
3
+ "version": "1.1.8",
4
4
  "sideEffects": [
5
5
  "*.css"
6
6
  ],
@@ -25,12 +25,13 @@
25
25
  "dependencies": {
26
26
  "@floating-ui/react-dom": "1.0.0",
27
27
  "@floating-ui/react-native": "0.8.0",
28
- "@tamagui/compose-refs": "^1.1.7",
29
- "@tamagui/core": "^1.1.7",
30
- "@tamagui/create-context": "^1.1.7",
31
- "@tamagui/get-size": "^1.1.7",
32
- "@tamagui/stacks": "^1.1.7",
33
- "@tamagui/use-controllable-state": "^1.1.7"
28
+ "@tamagui/compose-refs": "^1.1.8",
29
+ "@tamagui/core": "^1.1.8",
30
+ "@tamagui/create-context": "^1.1.8",
31
+ "@tamagui/floating": "^1.1.8",
32
+ "@tamagui/get-size": "^1.1.8",
33
+ "@tamagui/stacks": "^1.1.8",
34
+ "@tamagui/use-controllable-state": "^1.1.8"
34
35
  },
35
36
  "peerDependencies": {
36
37
  "react": "*",
@@ -38,7 +39,7 @@
38
39
  "react-native": "*"
39
40
  },
40
41
  "devDependencies": {
41
- "@tamagui/build": "^1.1.7",
42
+ "@tamagui/build": "^1.1.8",
42
43
  "react": "^18.2.0",
43
44
  "react-dom": "^18.2.0",
44
45
  "react-native": "*"
package/src/Popper.tsx CHANGED
@@ -5,26 +5,27 @@ import {
5
5
  SizeTokens,
6
6
  StackProps,
7
7
  getVariableValue,
8
+ isWeb,
8
9
  styled,
9
10
  useIsomorphicLayoutEffect,
10
11
  } from '@tamagui/core'
11
12
  import { Scope, createContextScope } from '@tamagui/create-context'
12
- import { stepTokenUpOrDown } from '@tamagui/get-size'
13
- import { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'
14
- import * as React from 'react'
15
- import { View } from 'react-native'
16
-
17
13
  import {
18
14
  Coords,
19
15
  Placement,
20
16
  Strategy,
17
+ UseFloatingReturn,
21
18
  arrow,
22
19
  autoUpdate,
23
20
  flip,
24
21
  offset,
25
22
  shift,
26
- } from './floating'
27
- import { UseFloatingReturn, useFloating } from './useFloating'
23
+ useFloating,
24
+ } from '@tamagui/floating'
25
+ import { stepTokenUpOrDown } from '@tamagui/get-size'
26
+ import { SizableStackProps, ThemeableStack, YStack, YStackProps } from '@tamagui/stacks'
27
+ import * as React from 'react'
28
+ import { Keyboard, View, useWindowDimensions } from 'react-native'
28
29
 
29
30
  type ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never
30
31
  type FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never
@@ -80,13 +81,14 @@ export const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) =
80
81
  }, [])
81
82
 
82
83
  const anchorRef = React.useRef<any>()
83
- const [arrowEl, setArrow] = React.useState<HTMLSpanElement | null>(null)
84
+ const [arrowEl, setArrow] = React.useState<any>(null)
84
85
  const [arrowSize, setArrowSize] = React.useState(0)
85
86
  const arrowRef = React.useRef()
86
87
 
87
88
  const floating = useFloating({
88
89
  strategy,
89
90
  placement,
91
+ sameScrollView: false, // this only takes effect on native
90
92
  middleware: [
91
93
  stayInFrame
92
94
  ? shift(typeof stayInFrame === 'boolean' ? {} : stayInFrame)
@@ -105,13 +107,40 @@ export const Popper: React.FC<PopperProps> = (props: ScopedProps<PopperProps>) =
105
107
  floating.reference(anchorRef.current)
106
108
  }, [anchorRef])
107
109
 
108
- React.useEffect(() => {
109
- if (!(refs.reference.current && refs.floating.current)) {
110
- return
111
- }
112
- // Only call this when the floating element is rendered
113
- return autoUpdate(refs.reference.current, refs.floating.current, floating.update)
114
- }, [floating.update, refs.floating, refs.reference])
110
+ if (isWeb) {
111
+ React.useEffect(() => {
112
+ if (!(refs.reference.current && refs.floating.current)) {
113
+ return
114
+ }
115
+ // Only call this when the floating element is rendered
116
+ return autoUpdate(refs.reference.current, refs.floating.current, floating.update)
117
+ }, [floating.update, refs.floating, refs.reference])
118
+ } else {
119
+ // On Native there's no autoupdate so we call update() when necessary
120
+
121
+ // Subscribe to window dimensions (orientation, scale, etc...)
122
+ const dimensions = useWindowDimensions()
123
+
124
+ // Subscribe to keyboard state
125
+ const [keyboardOpen, setKeyboardOpen] = React.useState(false)
126
+ React.useEffect(() => {
127
+ const showSubscription = Keyboard.addListener('keyboardDidShow', () => {
128
+ setKeyboardOpen(true)
129
+ })
130
+ const hideSubscription = Keyboard.addListener('keyboardDidHide', () => {
131
+ setKeyboardOpen(false)
132
+ })
133
+
134
+ return () => {
135
+ showSubscription.remove()
136
+ hideSubscription.remove()
137
+ }
138
+ }, [])
139
+
140
+ useIsomorphicLayoutEffect(() => {
141
+ floating.update()
142
+ }, [dimensions, keyboardOpen])
143
+ }
115
144
 
116
145
  return (
117
146
  <PopperProvider
@@ -230,7 +259,10 @@ export const PopperContent = PopperContentFrame.extractable(
230
259
 
231
260
  // outer frame because we explicitly dont want animation to apply to this
232
261
  return (
233
- <YStack {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}>
262
+ <YStack
263
+ animateOnly={['transform']}
264
+ {...(getFloatingProps ? getFloatingProps(frameProps) : frameProps)}
265
+ >
234
266
  {contents}
235
267
  </YStack>
236
268
  )
@@ -296,9 +328,13 @@ export const PopperArrow = PopperArrowFrame.extractable(
296
328
  const sizeValResolved = getVariableValue(stepTokenUpOrDown('space', sizeVal, -2, [2]))
297
329
  const size = +sizeValResolved
298
330
  const { placement } = context
299
- const { x, y } = context.arrowStyle || { x: 0, y: 0 }
300
331
  const refs = useComposedRefs(context.arrowRef, forwardedRef)
301
332
 
333
+ // Sometimes floating-ui can return NaN during orientation or screen size changes on native
334
+ // so we explictly force the x,y position types as a number
335
+ const x = (context.arrowStyle?.x as number) || 0
336
+ const y = (context.arrowStyle?.y as number) || 0
337
+
302
338
  const primaryPlacement = (placement ? placement.split('-')[0] : 'top') as Sides
303
339
 
304
340
  const arrowStyle: StackProps = { x, y, width: size, height: size }
package/src/index.tsx CHANGED
@@ -1,2 +1 @@
1
- export { FloatingOverrideContext, type UseFloatingFn } from './useFloating'
2
1
  export * from './Popper'
package/types/Popper.d.ts CHANGED
@@ -1,10 +1,9 @@
1
1
  import { SizeTokens } from '@tamagui/core';
2
2
  import { Scope } from '@tamagui/create-context';
3
+ import { Coords, Placement, Strategy, UseFloatingReturn, flip, shift } from '@tamagui/floating';
3
4
  import { SizableStackProps, YStackProps } from '@tamagui/stacks';
4
5
  import * as React from 'react';
5
6
  import { View } from 'react-native';
6
- import { Coords, Placement, Strategy, flip, shift } from './floating';
7
- import { UseFloatingReturn } from './useFloating';
8
7
  type ShiftProps = typeof shift extends (options: infer Opts) => void ? Opts : never;
9
8
  type FlipProps = typeof flip extends (options: infer Opts) => void ? Opts : never;
10
9
  export declare const createPopperScope: import("@tamagui/create-context").CreateScope;
@@ -20,15 +19,15 @@ type PopperContextValue = UseFloatingReturn & {
20
19
  };
21
20
  };
22
21
  export declare const PopperProvider: {
23
- (props: Omit<import("@floating-ui/core/src/types").ComputePositionReturn, "x" | "y"> & {
22
+ (props: Omit<import("@tamagui/floating").ComputePositionReturn, "x" | "y"> & {
24
23
  x: number | null;
25
24
  y: number | null;
26
25
  } & {
27
26
  update: () => void;
28
- reference: (node: import("@floating-ui/react-dom/src/types").ReferenceType | null) => void;
27
+ reference: (node: import("@tamagui/floating").ReferenceType | null) => void;
29
28
  floating: (node: HTMLElement | null) => void;
30
29
  refs: {
31
- reference: React.MutableRefObject<import("@floating-ui/react-dom/src/types").ReferenceType | null>;
30
+ reference: React.MutableRefObject<import("@tamagui/floating").ReferenceType | null>;
32
31
  floating: React.MutableRefObject<HTMLElement | null>;
33
32
  };
34
33
  } & {
@@ -70,13 +69,13 @@ type PopperAnchorRef = HTMLElement | View;
70
69
  export type PopperAnchorProps = YStackProps & {
71
70
  virtualRef?: React.RefObject<any>;
72
71
  };
73
- export declare const PopperAnchor: React.ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
72
+ export declare const PopperAnchor: React.ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
74
73
  readonly fullscreen?: boolean | undefined;
75
74
  readonly elevation?: SizeTokens | undefined;
76
- } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
75
+ } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
77
76
  readonly fullscreen?: boolean | undefined;
78
77
  readonly elevation?: SizeTokens | undefined;
79
- }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
78
+ }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
80
79
  readonly fullscreen?: boolean | undefined;
81
80
  readonly elevation?: SizeTokens | undefined;
82
81
  }>> & {
@@ -84,7 +83,7 @@ export declare const PopperAnchor: React.ForwardRefExoticComponent<Omit<import("
84
83
  } & React.RefAttributes<PopperAnchorRef>>;
85
84
  type PopperContentElement = HTMLElement | View;
86
85
  export type PopperContentProps = SizableStackProps;
87
- export declare const PopperContent: React.ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
86
+ export declare const PopperContent: React.ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
88
87
  readonly fullscreen?: boolean | undefined;
89
88
  readonly elevation?: SizeTokens | undefined;
90
89
  }, "size" | "hoverTheme" | "pressTheme" | "focusTheme" | "circular" | "elevate" | "bordered"> & {
@@ -95,7 +94,7 @@ export declare const PopperContent: React.ForwardRefExoticComponent<Omit<import(
95
94
  readonly elevate?: boolean | undefined;
96
95
  readonly bordered?: number | boolean | undefined;
97
96
  readonly size?: SizeTokens | undefined;
98
- } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
97
+ } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
99
98
  readonly fullscreen?: boolean | undefined;
100
99
  readonly elevation?: SizeTokens | undefined;
101
100
  }, "size" | "hoverTheme" | "pressTheme" | "focusTheme" | "circular" | "elevate" | "bordered"> & {
@@ -106,7 +105,7 @@ export declare const PopperContent: React.ForwardRefExoticComponent<Omit<import(
106
105
  readonly elevate?: boolean | undefined;
107
106
  readonly bordered?: number | boolean | undefined;
108
107
  readonly size?: SizeTokens | undefined;
109
- }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
108
+ }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
110
109
  readonly fullscreen?: boolean | undefined;
111
110
  readonly elevation?: SizeTokens | undefined;
112
111
  }, "size" | "hoverTheme" | "pressTheme" | "focusTheme" | "circular" | "elevate" | "bordered"> & {
@@ -123,13 +122,13 @@ export type PopperArrowProps = YStackProps & {
123
122
  offset?: number;
124
123
  size?: SizeTokens;
125
124
  };
126
- export declare const PopperArrow: React.ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
125
+ export declare const PopperArrow: React.ForwardRefExoticComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
127
126
  readonly fullscreen?: boolean | undefined;
128
127
  readonly elevation?: SizeTokens | undefined;
129
- } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
128
+ } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
130
129
  readonly fullscreen?: boolean | undefined;
131
130
  readonly elevation?: SizeTokens | undefined;
132
- }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "children" | "display"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
131
+ }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{}, "elevation" | "fullscreen"> & {
133
132
  readonly fullscreen?: boolean | undefined;
134
133
  readonly elevation?: SizeTokens | undefined;
135
134
  }>> & {
package/types/index.d.ts CHANGED
@@ -1,3 +1,2 @@
1
- export { FloatingOverrideContext, type UseFloatingFn } from './useFloating';
2
1
  export * from './Popper';
3
2
  //# sourceMappingURL=index.d.ts.map
@@ -1 +0,0 @@
1
- export * from '@floating-ui/react-native'
package/src/floating.tsx DELETED
@@ -1 +0,0 @@
1
- export * from '@floating-ui/react-dom'
@@ -1,22 +0,0 @@
1
- import { createContext, useContext } from 'react'
2
-
3
- import * as Floating from './floating'
4
-
5
- export type UseFloatingFn = typeof Floating.useFloating
6
-
7
- type UseFloatingProps = UseFloatingFn extends (props: infer Props) => any
8
- ? Props
9
- : never
10
-
11
- export type UseFloatingReturn = Floating.UseFloatingReturn & {
12
- context?: any
13
- getFloatingProps?: (props: { ref: any; [key: string]: any }) => any
14
- getReferenceProps?: (props: { ref: any; [key: string]: any }) => any
15
- }
16
-
17
- export const FloatingOverrideContext = createContext<UseFloatingFn | null>(null)
18
-
19
- export const useFloating = (props: UseFloatingProps): UseFloatingReturn => {
20
- const context = useContext(FloatingOverrideContext)
21
- return (context || Floating.useFloating)?.(props)
22
- }