@tamagui/tooltip 1.0.1-beta.21 → 1.0.1-beta.211

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.
Files changed (43) hide show
  1. package/dist/cjs/Tooltip.js +113 -131
  2. package/dist/cjs/Tooltip.js.map +3 -3
  3. package/dist/cjs/Tooltip.native.js +7 -10
  4. package/dist/cjs/Tooltip.native.js.map +2 -2
  5. package/dist/cjs/TooltipSimple.js +91 -0
  6. package/dist/cjs/TooltipSimple.js.map +7 -0
  7. package/dist/cjs/TooltipSimple.native.js +32 -0
  8. package/dist/cjs/TooltipSimple.native.js.map +7 -0
  9. package/dist/cjs/index.js +2 -0
  10. package/dist/cjs/index.js.map +2 -2
  11. package/dist/esm/Tooltip.js +109 -103
  12. package/dist/esm/Tooltip.js.map +3 -3
  13. package/dist/esm/Tooltip.native.js +5 -9
  14. package/dist/esm/Tooltip.native.js.map +2 -2
  15. package/dist/esm/TooltipSimple.js +67 -0
  16. package/dist/esm/TooltipSimple.js.map +7 -0
  17. package/dist/esm/TooltipSimple.native.js +8 -0
  18. package/dist/esm/TooltipSimple.native.js.map +7 -0
  19. package/dist/esm/index.js +1 -0
  20. package/dist/esm/index.js.map +2 -2
  21. package/dist/jsx/Tooltip.js +76 -77
  22. package/dist/jsx/Tooltip.js.map +7 -0
  23. package/dist/jsx/Tooltip.native.js +6 -9
  24. package/dist/jsx/Tooltip.native.js.map +7 -0
  25. package/dist/jsx/TooltipSimple.js +39 -0
  26. package/dist/jsx/TooltipSimple.js.map +7 -0
  27. package/dist/jsx/TooltipSimple.native.js +8 -0
  28. package/dist/jsx/TooltipSimple.native.js.map +7 -0
  29. package/dist/jsx/index.js +2 -0
  30. package/dist/jsx/index.js.map +7 -0
  31. package/package.json +20 -15
  32. package/src/Tooltip.native.tsx +20 -0
  33. package/src/Tooltip.tsx +169 -0
  34. package/src/TooltipSimple.native.tsx +5 -0
  35. package/src/TooltipSimple.tsx +68 -0
  36. package/src/index.tsx +2 -0
  37. package/types/Tooltip.d.ts +42 -52
  38. package/types/TooltipSimple.d.ts +10 -0
  39. package/types/TooltipSimple.native.d.ts +2 -0
  40. package/types/index.d.ts +1 -0
  41. package/types/Tooltip.d.ts.map +0 -1
  42. package/types/Tooltip.native.d.ts.map +0 -1
  43. package/types/index.d.ts.map +0 -1
@@ -1,5 +1,4 @@
1
- var __defProp = Object.defineProperty;
2
- var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
1
+ import { jsx } from "react/jsx-runtime";
3
2
  import "@tamagui/polyfill-dev";
4
3
  import {
5
4
  FloatingDelayGroup,
@@ -12,124 +11,131 @@ import {
12
11
  useInteractions,
13
12
  useRole
14
13
  } from "@floating-ui/react-dom-interactions";
15
- import { useId, withStaticProperties } from "@tamagui/core";
14
+ import { useEvent, useId, withStaticProperties } from "@tamagui/core";
16
15
  import {
17
16
  PopoverAnchor,
18
17
  PopoverArrow,
19
- PopoverClose,
20
18
  PopoverContent,
21
19
  PopoverTrigger,
22
20
  __PopoverProviderInternal,
23
21
  usePopoverScope
24
22
  } from "@tamagui/popover";
25
- import { FloatingOverrideContext, Popper } from "@tamagui/popper";
26
- import { Paragraph } from "@tamagui/text";
23
+ import {
24
+ FloatingOverrideContext,
25
+ Popper,
26
+ usePopperContext
27
+ } from "@tamagui/popper";
27
28
  import * as React from "react";
28
- const TooltipContent = React.forwardRef((props, ref) => {
29
- return /* @__PURE__ */ React.createElement(PopoverContent, {
30
- pointerEvents: "none",
29
+ const TooltipContent = React.forwardRef(
30
+ ({ __scopePopover, ...props }, ref) => {
31
+ const popperScope = usePopoverScope(__scopePopover);
32
+ const popper = usePopperContext("PopperContent", popperScope["__scopePopper"]);
33
+ return /* @__PURE__ */ jsx(PopoverContent, {
34
+ componentName: "TooltipContent",
35
+ disableRemoveScroll: true,
36
+ trapFocus: false,
37
+ padding: props.size || popper.size || "$2",
38
+ pointerEvents: "none",
39
+ ref,
40
+ ...props
41
+ });
42
+ }
43
+ );
44
+ const TooltipArrow = React.forwardRef((props, ref) => {
45
+ return /* @__PURE__ */ jsx(PopoverArrow, {
46
+ componentName: "TooltipArrow",
31
47
  ref,
32
48
  ...props
33
49
  });
34
50
  });
35
- const TooltipGroup = FloatingDelayGroup;
36
- const Tooltip = withStaticProperties((props) => {
37
- const { __scopePopover, children, restMs = 500, delay: delayProp, ...restProps } = props;
38
- const popperScope = usePopoverScope(__scopePopover);
39
- const triggerRef = React.useRef(null);
40
- const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
41
- const { delay: delayGroup, setCurrentId } = useDelayGroupContext();
42
- const delay = delayProp != null ? delayProp : delayGroup;
43
- const [open, setOpen] = React.useState(false);
44
- const id = props.groupId;
45
- const onOpenChange = React.useCallback((open2) => {
46
- var _a;
47
- setOpen(open2);
48
- if (open2) {
49
- setCurrentId(id);
50
- }
51
- (_a = props.onOpenChange) == null ? void 0 : _a.call(props, open2);
52
- }, [id, setCurrentId]);
53
- const useFloatingFn = /* @__PURE__ */ __name((props2) => {
54
- const floating = useFloating({
55
- ...props2,
56
- open,
57
- onOpenChange
51
+ const TooltipGroup = ({ children, delay }) => {
52
+ return /* @__PURE__ */ jsx(FloatingDelayGroup, {
53
+ delay: React.useMemo(() => delay, [JSON.stringify(delay)]),
54
+ children
55
+ });
56
+ };
57
+ const Tooltip = withStaticProperties(
58
+ (props) => {
59
+ const {
60
+ __scopePopover,
61
+ children,
62
+ restMs = 500,
63
+ delay: delayProp,
64
+ onOpenChange: onOpenChangeProp,
65
+ ...restProps
66
+ } = props;
67
+ const popperScope = usePopoverScope(__scopePopover);
68
+ const triggerRef = React.useRef(null);
69
+ const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
70
+ const { delay: delayGroup, setCurrentId } = useDelayGroupContext();
71
+ const delay = delayProp ?? delayGroup;
72
+ const [open, setOpen] = React.useState(false);
73
+ const id = props.groupId;
74
+ const onOpenChange = useEvent((open2) => {
75
+ setOpen(open2);
76
+ if (open2) {
77
+ setCurrentId(id);
78
+ }
79
+ onOpenChangeProp == null ? void 0 : onOpenChangeProp(open2);
58
80
  });
59
- const { getReferenceProps, getFloatingProps } = useInteractions([
60
- useHover(floating.context, { delay, restMs }),
61
- useFocus(floating.context),
62
- useRole(floating.context, { role: "tooltip" }),
63
- useDismiss(floating.context),
64
- useDelayGroup(floating.context, { id })
65
- ]);
66
- return {
67
- ...floating,
68
- getReferenceProps,
69
- getFloatingProps
81
+ const useFloatingFn = (props2) => {
82
+ const floating = useFloating({
83
+ ...props2,
84
+ open,
85
+ onOpenChange
86
+ });
87
+ const { getReferenceProps, getFloatingProps } = useInteractions([
88
+ useHover(floating.context, { delay, restMs }),
89
+ useFocus(floating.context),
90
+ useRole(floating.context, { role: "tooltip" }),
91
+ useDismiss(floating.context),
92
+ useDelayGroup(floating.context, { id })
93
+ ]);
94
+ return {
95
+ ...floating,
96
+ getReferenceProps,
97
+ getFloatingProps
98
+ };
70
99
  };
71
- }, "useFloatingFn");
72
- const useFloatingContext = React.useCallback(useFloatingFn, [id, delay, open]);
73
- const voidFn = React.useCallback(() => {
74
- }, [setOpen]);
75
- return /* @__PURE__ */ React.createElement(FloatingOverrideContext.Provider, {
76
- value: useFloatingContext
77
- }, /* @__PURE__ */ React.createElement(Popper, {
78
- size: "$2",
79
- ...popperScope,
80
- ...restProps
81
- }, /* @__PURE__ */ React.createElement(__PopoverProviderInternal, {
82
- scope: __scopePopover,
83
- contentId: useId(),
84
- triggerRef,
85
- open,
86
- onOpenChange: setOpen,
87
- onOpenToggle: voidFn,
88
- hasCustomAnchor,
89
- onCustomAnchorAdd: React.useCallback(() => setHasCustomAnchor(true), []),
90
- onCustomAnchorRemove: React.useCallback(() => setHasCustomAnchor(false), []),
91
- modal: true
92
- }, children)));
93
- }, {
94
- Anchor: PopoverAnchor,
95
- Arrow: PopoverArrow,
96
- Close: PopoverClose,
97
- Content: TooltipContent,
98
- Trigger: PopoverTrigger
99
- });
100
+ const useFloatingContext = React.useCallback(useFloatingFn, [id, delay, open]);
101
+ const onCustomAnchorAdd = React.useCallback(() => setHasCustomAnchor(true), []);
102
+ const onCustomAnchorRemove = React.useCallback(() => setHasCustomAnchor(false), []);
103
+ const contentId = useId();
104
+ return /* @__PURE__ */ jsx(FloatingOverrideContext.Provider, {
105
+ value: useFloatingContext,
106
+ children: /* @__PURE__ */ jsx(Popper, {
107
+ size: "$2",
108
+ ...popperScope,
109
+ ...restProps,
110
+ children: /* @__PURE__ */ jsx(__PopoverProviderInternal, {
111
+ scope: __scopePopover,
112
+ contentId,
113
+ triggerRef,
114
+ sheetBreakpoint: false,
115
+ scopeKey: "",
116
+ open,
117
+ onOpenChange: setOpen,
118
+ onOpenToggle: voidFn,
119
+ hasCustomAnchor,
120
+ onCustomAnchorAdd,
121
+ onCustomAnchorRemove,
122
+ children
123
+ })
124
+ })
125
+ });
126
+ },
127
+ {
128
+ Anchor: PopoverAnchor,
129
+ Arrow: TooltipArrow,
130
+ Content: TooltipContent,
131
+ Trigger: PopoverTrigger
132
+ }
133
+ );
100
134
  Tooltip.displayName = "Tooltip";
101
- const TooltipSimple = /* @__PURE__ */ __name(({
102
- label,
103
- children,
104
- contentProps,
105
- ...tooltipProps
106
- }) => {
107
- return /* @__PURE__ */ React.createElement(TooltipGroup, {
108
- delay: { open: 3e3, close: 100 }
109
- }, /* @__PURE__ */ React.createElement(Tooltip, {
110
- ...tooltipProps
111
- }, /* @__PURE__ */ React.createElement(Tooltip.Trigger, null, children), /* @__PURE__ */ React.createElement(Tooltip.Content, {
112
- enterStyle: { x: 0, y: -10, opacity: 0, scale: 0.9 },
113
- exitStyle: { x: 0, y: -10, opacity: 0, scale: 0.9 },
114
- x: 0,
115
- scale: 1,
116
- y: 0,
117
- elevation: "$1",
118
- opacity: 1,
119
- animation: [
120
- "bouncy",
121
- {
122
- opacity: {
123
- overshootClamping: true
124
- }
125
- }
126
- ],
127
- ...contentProps
128
- }, /* @__PURE__ */ React.createElement(Tooltip.Arrow, null), /* @__PURE__ */ React.createElement(Paragraph, null, label))));
129
- }, "TooltipSimple");
135
+ const voidFn = () => {
136
+ };
130
137
  export {
131
138
  Tooltip,
132
- TooltipGroup,
133
- TooltipSimple
139
+ TooltipGroup
134
140
  };
135
141
  //# sourceMappingURL=Tooltip.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Tooltip.tsx"],
4
- "sourcesContent": ["import '@tamagui/polyfill-dev'\n\nimport {\n FloatingDelayGroup,\n useDelayGroup,\n useDelayGroupContext,\n useDismiss,\n useFloating,\n useFocus,\n useHover,\n useInteractions,\n useRole,\n} from '@floating-ui/react-dom-interactions'\nimport { useId, withStaticProperties } from '@tamagui/core'\nimport { ScopedProps } from '@tamagui/create-context'\nimport {\n PopoverAnchor,\n PopoverArrow,\n PopoverClose,\n PopoverContent,\n PopoverContentProps,\n PopoverTrigger,\n __PopoverProviderInternal,\n usePopoverScope,\n} from '@tamagui/popover'\nimport { FloatingOverrideContext, Popper, PopperProps, UseFloatingFn } from '@tamagui/popper'\nimport { SizableStackProps } from '@tamagui/stacks'\nimport { Paragraph } from '@tamagui/text'\nimport * as React from 'react'\n\nconst TooltipContent = React.forwardRef((props: PopoverContentProps, ref: any) => {\n return <PopoverContent pointerEvents=\"none\" ref={ref} {...props} />\n})\n\nexport type TooltipProps = PopperProps & {\n children?: React.ReactNode\n onOpenChange?: (open: boolean) => void\n groupId?: string\n restMs?: number\n delay?:\n | number\n | {\n open?: number\n close?: number\n }\n}\n\nexport const TooltipGroup = FloatingDelayGroup\n\nexport const Tooltip = withStaticProperties(\n ((props: ScopedProps<TooltipProps, 'Popover'>) => {\n const { __scopePopover, children, restMs = 500, delay: delayProp, ...restProps } = props\n const popperScope = usePopoverScope(__scopePopover)\n const triggerRef = React.useRef<HTMLButtonElement>(null)\n const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false)\n const { delay: delayGroup, setCurrentId } = useDelayGroupContext()\n const delay = delayProp ?? delayGroup\n const [open, setOpen] = React.useState(false)\n const id = props.groupId\n\n const onOpenChange = React.useCallback(\n (open) => {\n setOpen(open)\n if (open) {\n setCurrentId(id)\n }\n props.onOpenChange?.(open)\n },\n [id, setCurrentId]\n )\n\n const useFloatingFn: UseFloatingFn = (props) => {\n const floating = useFloating({\n ...props,\n open,\n onOpenChange,\n })\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useHover(floating.context, { delay, restMs }),\n useFocus(floating.context),\n useRole(floating.context, { role: 'tooltip' }),\n useDismiss(floating.context),\n useDelayGroup(floating.context, { id }),\n ])\n return {\n ...floating,\n getReferenceProps,\n getFloatingProps,\n } as any\n }\n\n const useFloatingContext = React.useCallback(useFloatingFn, [id, delay, open])\n\n const voidFn = React.useCallback(() => {}, [setOpen])\n\n return (\n <FloatingOverrideContext.Provider value={useFloatingContext}>\n {/* default tooltip to a smaller size */}\n <Popper size=\"$2\" {...popperScope} {...restProps}>\n <__PopoverProviderInternal\n scope={__scopePopover}\n contentId={useId()}\n triggerRef={triggerRef}\n open={open}\n onOpenChange={setOpen}\n onOpenToggle={voidFn}\n hasCustomAnchor={hasCustomAnchor}\n onCustomAnchorAdd={React.useCallback(() => setHasCustomAnchor(true), [])}\n onCustomAnchorRemove={React.useCallback(() => setHasCustomAnchor(false), [])}\n modal\n >\n {children}\n </__PopoverProviderInternal>\n </Popper>\n </FloatingOverrideContext.Provider>\n )\n }) as React.FC<TooltipProps>,\n {\n Anchor: PopoverAnchor,\n Arrow: PopoverArrow,\n Close: PopoverClose,\n Content: TooltipContent,\n Trigger: PopoverTrigger,\n }\n)\n\nTooltip.displayName = 'Tooltip'\n\nexport type TooltipSimpleProps = TooltipProps & {\n label?: React.ReactNode\n children?: React.ReactNode\n contentProps?: SizableStackProps\n}\n\nexport const TooltipSimple: React.FC<TooltipSimpleProps> = ({\n label,\n children,\n contentProps,\n ...tooltipProps\n}) => {\n return (\n <TooltipGroup delay={{ open: 3000, close: 100 }}>\n <Tooltip {...tooltipProps}>\n <Tooltip.Trigger>{children}</Tooltip.Trigger>\n <Tooltip.Content\n enterStyle={{ x: 0, y: -10, opacity: 0, scale: 0.9 }}\n exitStyle={{ x: 0, y: -10, opacity: 0, scale: 0.9 }}\n x={0}\n scale={1}\n y={0}\n elevation=\"$1\"\n opacity={1}\n animation={[\n 'bouncy',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n {...contentProps}\n >\n <Tooltip.Arrow />\n <Paragraph>{label}</Paragraph>\n </Tooltip.Content>\n </Tooltip>\n </TooltipGroup>\n )\n}\n"],
5
- "mappings": "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",
6
- "names": []
4
+ "sourcesContent": ["import '@tamagui/polyfill-dev'\n\nimport {\n FloatingDelayGroup,\n useDelayGroup,\n useDelayGroupContext,\n useDismiss,\n useFloating,\n useFocus,\n useHover,\n useInteractions,\n useRole,\n} from '@floating-ui/react-dom-interactions'\nimport { useEvent, useId, withStaticProperties } from '@tamagui/core'\nimport { ScopedProps } from '@tamagui/create-context'\nimport {\n PopoverAnchor,\n PopoverArrow,\n PopoverArrowProps,\n PopoverContent,\n PopoverContentProps,\n PopoverTrigger,\n __PopoverProviderInternal,\n usePopoverScope,\n} from '@tamagui/popover'\nimport {\n FloatingOverrideContext,\n Popper,\n PopperProps,\n UseFloatingFn,\n usePopperContext,\n} from '@tamagui/popper'\nimport * as React from 'react'\n\nconst TooltipContent = React.forwardRef(\n ({ __scopePopover, ...props }: ScopedProps<PopoverContentProps, 'Popover'>, ref: any) => {\n const popperScope = usePopoverScope(__scopePopover)\n const popper = usePopperContext('PopperContent', popperScope['__scopePopper'])\n return (\n <PopoverContent\n componentName=\"TooltipContent\"\n disableRemoveScroll\n trapFocus={false}\n padding={props.size || popper.size || '$2'}\n pointerEvents=\"none\"\n ref={ref}\n {...props}\n />\n )\n }\n)\n\nconst TooltipArrow = React.forwardRef((props: PopoverArrowProps, ref: any) => {\n return <PopoverArrow componentName=\"TooltipArrow\" ref={ref} {...props} />\n})\n\nexport type TooltipProps = PopperProps & {\n children?: React.ReactNode\n onOpenChange?: (open: boolean) => void\n groupId?: string\n restMs?: number\n delay?:\n | number\n | {\n open?: number\n close?: number\n }\n}\n\ntype Delay =\n | number\n | Partial<{\n open: number\n close: number\n }>\n\nexport const TooltipGroup = ({ children, delay }: { children?: any; delay: Delay }) => {\n return (\n <FloatingDelayGroup delay={React.useMemo(() => delay, [JSON.stringify(delay)])}>\n {children}\n </FloatingDelayGroup>\n )\n}\n\nexport const Tooltip = withStaticProperties(\n ((props: ScopedProps<TooltipProps, 'Popover'>) => {\n const {\n __scopePopover,\n children,\n restMs = 500,\n delay: delayProp,\n onOpenChange: onOpenChangeProp,\n ...restProps\n } = props\n const popperScope = usePopoverScope(__scopePopover)\n const triggerRef = React.useRef<HTMLButtonElement>(null)\n const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false)\n const { delay: delayGroup, setCurrentId } = useDelayGroupContext()\n const delay = delayProp ?? delayGroup\n const [open, setOpen] = React.useState(false)\n const id = props.groupId\n\n const onOpenChange = useEvent((open) => {\n setOpen(open)\n if (open) {\n setCurrentId(id)\n }\n onOpenChangeProp?.(open)\n })\n\n const useFloatingFn: UseFloatingFn = (props) => {\n const floating = useFloating({\n ...props,\n open,\n onOpenChange,\n })\n const { getReferenceProps, getFloatingProps } = useInteractions([\n useHover(floating.context, { delay, restMs }),\n useFocus(floating.context),\n useRole(floating.context, { role: 'tooltip' }),\n useDismiss(floating.context),\n useDelayGroup(floating.context, { id }),\n ])\n return {\n ...floating,\n getReferenceProps,\n getFloatingProps,\n } as any\n }\n\n const useFloatingContext = React.useCallback(useFloatingFn, [id, delay, open])\n const onCustomAnchorAdd = React.useCallback(() => setHasCustomAnchor(true), [])\n const onCustomAnchorRemove = React.useCallback(() => setHasCustomAnchor(false), [])\n const contentId = useId()\n\n return (\n <FloatingOverrideContext.Provider value={useFloatingContext}>\n {/* default tooltip to a smaller size */}\n <Popper size=\"$2\" {...popperScope} {...restProps}>\n <__PopoverProviderInternal\n scope={__scopePopover}\n contentId={contentId}\n triggerRef={triggerRef}\n sheetBreakpoint={false}\n scopeKey=\"\"\n open={open}\n onOpenChange={setOpen}\n onOpenToggle={voidFn}\n hasCustomAnchor={hasCustomAnchor}\n onCustomAnchorAdd={onCustomAnchorAdd}\n onCustomAnchorRemove={onCustomAnchorRemove}\n >\n {children}\n </__PopoverProviderInternal>\n </Popper>\n </FloatingOverrideContext.Provider>\n )\n }) as React.FC<TooltipProps>,\n {\n Anchor: PopoverAnchor,\n Arrow: TooltipArrow,\n Content: TooltipContent,\n Trigger: PopoverTrigger,\n }\n)\n\nTooltip.displayName = 'Tooltip'\n\nconst voidFn = () => {}\n"],
5
+ "mappings": "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",
6
+ "names": ["open", "props"]
7
7
  }
@@ -1,12 +1,10 @@
1
- var __defProp = Object.defineProperty;
2
- var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
1
  import { withStaticProperties } from "@tamagui/core";
4
- const RenderChildren = /* @__PURE__ */ __name((props) => {
2
+ const RenderChildren = (props) => {
5
3
  return props.children;
6
- }, "RenderChildren");
7
- const RenderNull = /* @__PURE__ */ __name((props) => {
4
+ };
5
+ const RenderNull = (props) => {
8
6
  return null;
9
- }, "RenderNull");
7
+ };
10
8
  const Tooltip = withStaticProperties(RenderChildren, {
11
9
  Anchor: RenderChildren,
12
10
  Arrow: RenderNull,
@@ -14,9 +12,7 @@ const Tooltip = withStaticProperties(RenderChildren, {
14
12
  Content: RenderNull,
15
13
  Trigger: RenderChildren
16
14
  });
17
- const TooltipSimple = RenderChildren;
18
15
  export {
19
- Tooltip,
20
- TooltipSimple
16
+ Tooltip
21
17
  };
22
18
  //# sourceMappingURL=Tooltip.native.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Tooltip.native.tsx"],
4
- "sourcesContent": ["import { withStaticProperties } from '@tamagui/core'\n\n// no output on native for now\n// could have an option to long-press or similar to show in a context menu/drawer\n\nconst RenderChildren = (props: any) => {\n return props.children\n}\n\nconst RenderNull = (props: any) => {\n return null\n}\n\nexport const Tooltip = withStaticProperties(RenderChildren, {\n Anchor: RenderChildren,\n Arrow: RenderNull,\n Close: RenderNull,\n Content: RenderNull,\n Trigger: RenderChildren,\n})\n\nexport const TooltipSimple = RenderChildren\n"],
5
- "mappings": ";;AAAA;AAKA,MAAM,iBAAiB,wBAAC,UAAe;AACrC,SAAO,MAAM;AACf,GAFuB;AAIvB,MAAM,aAAa,wBAAC,UAAe;AACjC,SAAO;AACT,GAFmB;AAIZ,MAAM,UAAU,qBAAqB,gBAAgB;AAAA,EAC1D,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AACX,CAAC;AAEM,MAAM,gBAAgB;",
4
+ "sourcesContent": ["import { withStaticProperties } from '@tamagui/core'\n\n// no output on native for now\n// could have an option to long-press or similar to show in a context menu/drawer\n\nconst RenderChildren = (props: any) => {\n return props.children\n}\n\nconst RenderNull = (props: any) => {\n return null\n}\n\nexport const Tooltip = withStaticProperties(RenderChildren, {\n Anchor: RenderChildren,\n Arrow: RenderNull,\n Close: RenderNull,\n Content: RenderNull,\n Trigger: RenderChildren,\n})\n"],
5
+ "mappings": "AAAA,SAAS,4BAA4B;AAKrC,MAAM,iBAAiB,CAAC,UAAe;AACrC,SAAO,MAAM;AACf;AAEA,MAAM,aAAa,CAAC,UAAe;AACjC,SAAO;AACT;AAEO,MAAM,UAAU,qBAAqB,gBAAgB;AAAA,EAC1D,QAAQ;AAAA,EACR,OAAO;AAAA,EACP,OAAO;AAAA,EACP,SAAS;AAAA,EACT,SAAS;AACX,CAAC;",
6
6
  "names": []
7
7
  }
@@ -0,0 +1,67 @@
1
+ import { jsx, jsxs } from "react/jsx-runtime";
2
+ import { useDelayGroupContext } from "@floating-ui/react-dom-interactions";
3
+ import { ThemeInverse } from "@tamagui/core";
4
+ import { Paragraph } from "@tamagui/text";
5
+ import { Tooltip, TooltipGroup } from "./Tooltip";
6
+ const TooltipSimple = ({
7
+ label,
8
+ children,
9
+ contentProps,
10
+ ...tooltipProps
11
+ }) => {
12
+ let context;
13
+ try {
14
+ context = useDelayGroupContext();
15
+ } catch {
16
+ }
17
+ const contents = /* @__PURE__ */ jsxs(Tooltip, {
18
+ ...tooltipProps,
19
+ children: [
20
+ /* @__PURE__ */ jsx(Tooltip.Trigger, {
21
+ asChild: true,
22
+ children
23
+ }),
24
+ /* @__PURE__ */ jsx(ThemeInverse, {
25
+ children: /* @__PURE__ */ jsxs(Tooltip.Content, {
26
+ zIndex: 1e5,
27
+ enterStyle: { x: 0, y: -8, opacity: 0, scale: 0.93 },
28
+ exitStyle: { x: 0, y: -8, opacity: 0, scale: 0.93 },
29
+ x: 0,
30
+ scale: 1,
31
+ y: 0,
32
+ elevation: "$0.5",
33
+ opacity: 1,
34
+ animation: [
35
+ "quick",
36
+ {
37
+ opacity: {
38
+ overshootClamping: true
39
+ }
40
+ }
41
+ ],
42
+ ...contentProps,
43
+ children: [
44
+ /* @__PURE__ */ jsx(Tooltip.Arrow, {}),
45
+ /* @__PURE__ */ jsx(Paragraph, {
46
+ size: "$2",
47
+ lineHeight: "$0",
48
+ children: label
49
+ })
50
+ ]
51
+ })
52
+ })
53
+ ]
54
+ });
55
+ if (!context) {
56
+ return /* @__PURE__ */ jsx(TooltipGroup, {
57
+ delay: defaultTooltipDelay,
58
+ children: contents
59
+ });
60
+ }
61
+ return contents;
62
+ };
63
+ const defaultTooltipDelay = { open: 3e3, close: 100 };
64
+ export {
65
+ TooltipSimple
66
+ };
67
+ //# sourceMappingURL=TooltipSimple.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/TooltipSimple.tsx"],
4
+ "sourcesContent": ["import { useDelayGroupContext } from '@floating-ui/react-dom-interactions'\nimport { ThemeInverse } from '@tamagui/core'\nimport { SizableStackProps } from '@tamagui/stacks'\nimport { Paragraph } from '@tamagui/text'\nimport * as React from 'react'\n\nimport { Tooltip, TooltipGroup, TooltipProps } from './Tooltip'\n\nexport type TooltipSimpleProps = TooltipProps & {\n label?: React.ReactNode\n children?: React.ReactNode\n contentProps?: SizableStackProps\n}\n\nexport const TooltipSimple: React.FC<TooltipSimpleProps> = ({\n label,\n children,\n contentProps,\n ...tooltipProps\n}) => {\n let context\n try {\n // eslint-disable-next-line react-hooks/rules-of-hooks\n context = useDelayGroupContext()\n } catch {\n // ok\n }\n\n const contents = (\n <Tooltip {...tooltipProps}>\n <Tooltip.Trigger asChild>{children}</Tooltip.Trigger>\n <ThemeInverse>\n <Tooltip.Content\n zIndex={100_000}\n enterStyle={{ x: 0, y: -8, opacity: 0, scale: 0.93 }}\n exitStyle={{ x: 0, y: -8, opacity: 0, scale: 0.93 }}\n x={0}\n scale={1}\n y={0}\n elevation=\"$0.5\"\n opacity={1}\n animation={[\n 'quick',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n {...contentProps}\n >\n <Tooltip.Arrow />\n <Paragraph size=\"$2\" lineHeight=\"$0\">\n {label}\n </Paragraph>\n </Tooltip.Content>\n </ThemeInverse>\n </Tooltip>\n )\n\n if (!context) {\n return <TooltipGroup delay={defaultTooltipDelay}>{contents}</TooltipGroup>\n }\n\n return contents\n}\n\nconst defaultTooltipDelay = { open: 3000, close: 100 }\n"],
5
+ "mappings": "AA8BM,cAEE,YAFF;AA9BN,SAAS,4BAA4B;AACrC,SAAS,oBAAoB;AAE7B,SAAS,iBAAiB;AAG1B,SAAS,SAAS,oBAAkC;AAQ7C,MAAM,gBAA8C,CAAC;AAAA,EAC1D;AAAA,EACA;AAAA,EACA;AAAA,KACG;AACL,MAAM;AACJ,MAAI;AACJ,MAAI;AAEF,cAAU,qBAAqB;AAAA,EACjC,QAAE;AAAA,EAEF;AAEA,QAAM,WACJ,qBAAC;AAAA,IAAS,GAAG;AAAA,IACX;AAAA,0BAAC,QAAQ,SAAR;AAAA,QAAgB,SAAO;AAAA,QAAE;AAAA,OAAS;AAAA,MACnC,oBAAC;AAAA,QACC,+BAAC,QAAQ,SAAR;AAAA,UACC,QAAQ;AAAA,UACR,YAAY,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,UACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,UAClD,GAAG;AAAA,UACH,OAAO;AAAA,UACP,GAAG;AAAA,UACH,WAAU;AAAA,UACV,SAAS;AAAA,UACT,WAAW;AAAA,YACT;AAAA,YACA;AAAA,cACE,SAAS;AAAA,gBACP,mBAAmB;AAAA,cACrB;AAAA,YACF;AAAA,UACF;AAAA,UACC,GAAG;AAAA,UAEJ;AAAA,gCAAC,QAAQ,OAAR,EAAc;AAAA,YACf,oBAAC;AAAA,cAAU,MAAK;AAAA,cAAK,YAAW;AAAA,cAC7B;AAAA,aACH;AAAA;AAAA,SACF;AAAA,OACF;AAAA;AAAA,GACF;AAGF,MAAI,CAAC,SAAS;AACZ,WAAO,oBAAC;AAAA,MAAa,OAAO;AAAA,MAAsB;AAAA,KAAS;AAAA,EAC7D;AAEA,SAAO;AACT;AAEA,MAAM,sBAAsB,EAAE,MAAM,KAAM,OAAO,IAAI;",
6
+ "names": []
7
+ }
@@ -0,0 +1,8 @@
1
+ const RenderChildren = (props) => {
2
+ return props.children;
3
+ };
4
+ const TooltipSimple = RenderChildren;
5
+ export {
6
+ TooltipSimple
7
+ };
8
+ //# sourceMappingURL=TooltipSimple.native.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/TooltipSimple.native.tsx"],
4
+ "sourcesContent": ["const RenderChildren = (props: any) => {\n return props.children\n}\n\nexport const TooltipSimple = RenderChildren\n"],
5
+ "mappings": "AAAA,MAAM,iBAAiB,CAAC,UAAe;AACrC,SAAO,MAAM;AACf;AAEO,MAAM,gBAAgB;",
6
+ "names": []
7
+ }
package/dist/esm/index.js CHANGED
@@ -1,2 +1,3 @@
1
1
  export * from "./Tooltip";
2
+ export * from "./TooltipSimple";
2
3
  //# sourceMappingURL=index.js.map
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/index.tsx"],
4
- "sourcesContent": ["export * from './Tooltip'\n"],
5
- "mappings": "AAAA;",
4
+ "sourcesContent": ["export * from './Tooltip'\nexport * from './TooltipSimple'\n"],
5
+ "mappings": "AAAA,cAAc;AACd,cAAc;",
6
6
  "names": []
7
7
  }
@@ -1,5 +1,3 @@
1
- var __defProp = Object.defineProperty;
2
- var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
1
  import "@tamagui/polyfill-dev";
4
2
  import {
5
3
  FloatingDelayGroup,
@@ -12,94 +10,95 @@ import {
12
10
  useInteractions,
13
11
  useRole
14
12
  } from "@floating-ui/react-dom-interactions";
15
- import { useId, withStaticProperties } from "@tamagui/core";
13
+ import { useEvent, useId, withStaticProperties } from "@tamagui/core";
16
14
  import {
17
15
  PopoverAnchor,
18
16
  PopoverArrow,
19
- PopoverClose,
20
17
  PopoverContent,
21
18
  PopoverTrigger,
22
19
  __PopoverProviderInternal,
23
20
  usePopoverScope
24
21
  } from "@tamagui/popover";
25
- import { FloatingOverrideContext, Popper } from "@tamagui/popper";
26
- import { Paragraph } from "@tamagui/text";
22
+ import {
23
+ FloatingOverrideContext,
24
+ Popper,
25
+ usePopperContext
26
+ } from "@tamagui/popper";
27
27
  import * as React from "react";
28
- const TooltipContent = React.forwardRef((props, ref) => {
29
- return <PopoverContent pointerEvents="none" ref={ref} {...props} />;
28
+ const TooltipContent = React.forwardRef(
29
+ ({ __scopePopover, ...props }, ref) => {
30
+ const popperScope = usePopoverScope(__scopePopover);
31
+ const popper = usePopperContext("PopperContent", popperScope["__scopePopper"]);
32
+ return <PopoverContent componentName="TooltipContent" disableRemoveScroll trapFocus={false} padding={props.size || popper.size || "$2"} pointerEvents="none" ref={ref} {...props} />;
33
+ }
34
+ );
35
+ const TooltipArrow = React.forwardRef((props, ref) => {
36
+ return <PopoverArrow componentName="TooltipArrow" ref={ref} {...props} />;
30
37
  });
31
- const TooltipGroup = FloatingDelayGroup;
32
- const Tooltip = withStaticProperties((props) => {
33
- const { __scopePopover, children, restMs = 500, delay: delayProp, ...restProps } = props;
34
- const popperScope = usePopoverScope(__scopePopover);
35
- const triggerRef = React.useRef(null);
36
- const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
37
- const { delay: delayGroup, setCurrentId } = useDelayGroupContext();
38
- const delay = delayProp != null ? delayProp : delayGroup;
39
- const [open, setOpen] = React.useState(false);
40
- const id = props.groupId;
41
- const onOpenChange = React.useCallback((open2) => {
42
- var _a;
43
- setOpen(open2);
44
- if (open2) {
45
- setCurrentId(id);
46
- }
47
- (_a = props.onOpenChange) == null ? void 0 : _a.call(props, open2);
48
- }, [id, setCurrentId]);
49
- const useFloatingFn = /* @__PURE__ */ __name((props2) => {
50
- const floating = useFloating({
51
- ...props2,
52
- open,
53
- onOpenChange
38
+ const TooltipGroup = ({ children, delay }) => {
39
+ return <FloatingDelayGroup delay={React.useMemo(() => delay, [JSON.stringify(delay)])}>{children}</FloatingDelayGroup>;
40
+ };
41
+ const Tooltip = withStaticProperties(
42
+ (props) => {
43
+ const {
44
+ __scopePopover,
45
+ children,
46
+ restMs = 500,
47
+ delay: delayProp,
48
+ onOpenChange: onOpenChangeProp,
49
+ ...restProps
50
+ } = props;
51
+ const popperScope = usePopoverScope(__scopePopover);
52
+ const triggerRef = React.useRef(null);
53
+ const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
54
+ const { delay: delayGroup, setCurrentId } = useDelayGroupContext();
55
+ const delay = delayProp ?? delayGroup;
56
+ const [open, setOpen] = React.useState(false);
57
+ const id = props.groupId;
58
+ const onOpenChange = useEvent((open2) => {
59
+ setOpen(open2);
60
+ if (open2) {
61
+ setCurrentId(id);
62
+ }
63
+ onOpenChangeProp?.(open2);
54
64
  });
55
- const { getReferenceProps, getFloatingProps } = useInteractions([
56
- useHover(floating.context, { delay, restMs }),
57
- useFocus(floating.context),
58
- useRole(floating.context, { role: "tooltip" }),
59
- useDismiss(floating.context),
60
- useDelayGroup(floating.context, { id })
61
- ]);
62
- return {
63
- ...floating,
64
- getReferenceProps,
65
- getFloatingProps
65
+ const useFloatingFn = (props2) => {
66
+ const floating = useFloating({
67
+ ...props2,
68
+ open,
69
+ onOpenChange
70
+ });
71
+ const { getReferenceProps, getFloatingProps } = useInteractions([
72
+ useHover(floating.context, { delay, restMs }),
73
+ useFocus(floating.context),
74
+ useRole(floating.context, { role: "tooltip" }),
75
+ useDismiss(floating.context),
76
+ useDelayGroup(floating.context, { id })
77
+ ]);
78
+ return {
79
+ ...floating,
80
+ getReferenceProps,
81
+ getFloatingProps
82
+ };
66
83
  };
67
- }, "useFloatingFn");
68
- const useFloatingContext = React.useCallback(useFloatingFn, [id, delay, open]);
69
- const voidFn = React.useCallback(() => {
70
- }, [setOpen]);
71
- return <FloatingOverrideContext.Provider value={useFloatingContext}><Popper size="$2" {...popperScope} {...restProps}><__PopoverProviderInternal scope={__scopePopover} contentId={useId()} triggerRef={triggerRef} open={open} onOpenChange={setOpen} onOpenToggle={voidFn} hasCustomAnchor={hasCustomAnchor} onCustomAnchorAdd={React.useCallback(() => setHasCustomAnchor(true), [])} onCustomAnchorRemove={React.useCallback(() => setHasCustomAnchor(false), [])} modal>{children}</__PopoverProviderInternal></Popper></FloatingOverrideContext.Provider>;
72
- }, {
73
- Anchor: PopoverAnchor,
74
- Arrow: PopoverArrow,
75
- Close: PopoverClose,
76
- Content: TooltipContent,
77
- Trigger: PopoverTrigger
78
- });
84
+ const useFloatingContext = React.useCallback(useFloatingFn, [id, delay, open]);
85
+ const onCustomAnchorAdd = React.useCallback(() => setHasCustomAnchor(true), []);
86
+ const onCustomAnchorRemove = React.useCallback(() => setHasCustomAnchor(false), []);
87
+ const contentId = useId();
88
+ return <FloatingOverrideContext.Provider value={useFloatingContext}><Popper size="$2" {...popperScope} {...restProps}><__PopoverProviderInternal scope={__scopePopover} contentId={contentId} triggerRef={triggerRef} sheetBreakpoint={false} scopeKey="" open={open} onOpenChange={setOpen} onOpenToggle={voidFn} hasCustomAnchor={hasCustomAnchor} onCustomAnchorAdd={onCustomAnchorAdd} onCustomAnchorRemove={onCustomAnchorRemove}>{children}</__PopoverProviderInternal></Popper></FloatingOverrideContext.Provider>;
89
+ },
90
+ {
91
+ Anchor: PopoverAnchor,
92
+ Arrow: TooltipArrow,
93
+ Content: TooltipContent,
94
+ Trigger: PopoverTrigger
95
+ }
96
+ );
79
97
  Tooltip.displayName = "Tooltip";
80
- const TooltipSimple = /* @__PURE__ */ __name(({
81
- label,
82
- children,
83
- contentProps,
84
- ...tooltipProps
85
- }) => {
86
- return <TooltipGroup delay={{ open: 3e3, close: 100 }}><Tooltip {...tooltipProps}>
87
- <Tooltip.Trigger>{children}</Tooltip.Trigger>
88
- <Tooltip.Content enterStyle={{ x: 0, y: -10, opacity: 0, scale: 0.9 }} exitStyle={{ x: 0, y: -10, opacity: 0, scale: 0.9 }} x={0} scale={1} y={0} elevation="$1" opacity={1} animation={[
89
- "bouncy",
90
- {
91
- opacity: {
92
- overshootClamping: true
93
- }
94
- }
95
- ]} {...contentProps}>
96
- <Tooltip.Arrow />
97
- <Paragraph>{label}</Paragraph>
98
- </Tooltip.Content>
99
- </Tooltip></TooltipGroup>;
100
- }, "TooltipSimple");
98
+ const voidFn = () => {
99
+ };
101
100
  export {
102
101
  Tooltip,
103
- TooltipGroup,
104
- TooltipSimple
102
+ TooltipGroup
105
103
  };
104
+ //# sourceMappingURL=Tooltip.js.map