@tamagui/tooltip 2.7.7 → 3.0.0-beta.1091.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/Tooltip.cjs +161 -203
- package/dist/cjs/Tooltip.native.cjs +47 -0
- package/dist/cjs/Tooltip.native.js +28 -29
- package/dist/cjs/Tooltip.native.js.map +1 -1
- package/dist/cjs/TooltipSimple.cjs +69 -94
- package/dist/cjs/TooltipSimple.native.cjs +29 -0
- package/dist/cjs/TooltipSimple.native.js +16 -19
- package/dist/cjs/TooltipSimple.native.js.map +1 -1
- package/dist/cjs/index.cjs +9 -11
- package/dist/cjs/index.native.cjs +21 -0
- package/dist/cjs/index.native.js +9 -10
- package/dist/cjs/index.native.js.map +1 -1
- package/dist/esm/Tooltip.mjs +144 -179
- package/dist/esm/Tooltip.mjs.map +1 -1
- package/dist/esm/Tooltip.native.js +14 -12
- package/dist/esm/Tooltip.native.js.map +1 -1
- package/dist/esm/TooltipSimple.mjs +54 -68
- package/dist/esm/TooltipSimple.mjs.map +1 -1
- package/dist/esm/TooltipSimple.native.js +3 -2
- package/dist/esm/TooltipSimple.native.js.map +1 -1
- package/dist/esm/index.js +3 -3
- package/dist/esm/index.mjs +3 -3
- package/dist/esm/index.native.js +3 -3
- package/dist/jsx/Tooltip.mjs +144 -179
- package/dist/jsx/Tooltip.mjs.map +1 -1
- package/dist/jsx/Tooltip.native.cjs +47 -0
- package/dist/jsx/Tooltip.native.js +28 -29
- package/dist/jsx/Tooltip.native.js.map +1 -1
- package/dist/jsx/TooltipSimple.mjs +54 -68
- package/dist/jsx/TooltipSimple.mjs.map +1 -1
- package/dist/jsx/TooltipSimple.native.cjs +29 -0
- package/dist/jsx/TooltipSimple.native.js +16 -19
- package/dist/jsx/TooltipSimple.native.js.map +1 -1
- package/dist/jsx/index.js +3 -3
- package/dist/jsx/index.mjs +3 -3
- package/dist/jsx/index.native.cjs +21 -0
- package/dist/jsx/index.native.js +9 -10
- package/dist/jsx/index.native.js.map +1 -1
- package/package.json +18 -16
- package/src/Tooltip.tsx +41 -39
- package/src/TooltipSimple.tsx +30 -26
- package/types/Tooltip.d.ts +14 -26
- package/types/Tooltip.d.ts.map +1 -1
- package/types/Tooltip.native.d.ts +9 -6
- package/types/Tooltip.native.d.ts.map +1 -1
- package/types/TooltipSimple.d.ts +2 -2
- package/types/TooltipSimple.d.ts.map +1 -1
- package/types/TooltipSimple.native.d.ts +3 -1
- package/types/TooltipSimple.native.d.ts.map +1 -1
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/index.mjs.map +0 -1
- package/dist/esm/index.native.js.map +0 -1
- package/dist/jsx/index.js.map +0 -1
- package/dist/jsx/index.mjs.map +0 -1
|
@@ -1,76 +1,62 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { createRefComponent, getVariableValue } from "@tamagui/core";
|
|
2
|
+
import { getRadius, getSize, getSpace } from "@tamagui/get-token";
|
|
2
3
|
import { Paragraph } from "@tamagui/text";
|
|
3
4
|
import * as React from "react";
|
|
4
5
|
import { Tooltip } from "./Tooltip.mjs";
|
|
5
6
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
-
const TooltipSimple = React.forwardRef(({
|
|
7
|
-
label,
|
|
8
|
-
children,
|
|
9
|
-
contentProps,
|
|
10
|
-
disabled,
|
|
11
|
-
...tooltipProps
|
|
12
|
-
}, ref) => {
|
|
13
|
-
"use no memo";
|
|
14
7
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
textAlign: "center",
|
|
67
|
-
"$platform-web": {
|
|
68
|
-
textWrap: "balance"
|
|
69
|
-
},
|
|
70
|
-
children: label
|
|
71
|
-
})]
|
|
72
|
-
})]
|
|
73
|
-
});
|
|
8
|
+
const TooltipSimple = createRefComponent(({ label, children, contentProps, disabled, ...tooltipProps }, ref) => {
|
|
9
|
+
"use no memo";
|
|
10
|
+
const child = React.Children.only(children);
|
|
11
|
+
if (!label) {
|
|
12
|
+
return children;
|
|
13
|
+
}
|
|
14
|
+
return /* @__PURE__ */ jsxs(Tooltip, {
|
|
15
|
+
disableRTL: true,
|
|
16
|
+
offset: 15,
|
|
17
|
+
restMs: 40,
|
|
18
|
+
delay: 40,
|
|
19
|
+
zIndex: 1e6,
|
|
20
|
+
...tooltipProps,
|
|
21
|
+
...disabled ? { open: false } : null,
|
|
22
|
+
children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
|
|
23
|
+
...typeof label === "string" && { "aria-label": label },
|
|
24
|
+
asChild: "except-style",
|
|
25
|
+
children: ref && React.isValidElement(child) ? React.cloneElement(child, { ref }) : child
|
|
26
|
+
}), /* @__PURE__ */ jsxs(Tooltip.Content, {
|
|
27
|
+
theme: "Tooltip",
|
|
28
|
+
y: "enter:-4px exit:-4px",
|
|
29
|
+
scale: "1 enter:0.96 exit:0.96",
|
|
30
|
+
opacity: "1 enter:0 exit:0",
|
|
31
|
+
pointerEvents: "none",
|
|
32
|
+
paddingHorizontal: getVariableValue(getSpace(tooltipProps.size ?? true)),
|
|
33
|
+
paddingVertical: Math.max(0, Math.round(getVariableValue(getSize(tooltipProps.size ?? true)) * .36 - 9)),
|
|
34
|
+
borderRadius: getVariableValue(getRadius(tooltipProps.size ?? true)),
|
|
35
|
+
boxShadow: "0 2px 4px shadow-color",
|
|
36
|
+
transition: {
|
|
37
|
+
preset: "quicker",
|
|
38
|
+
properties: "transform, opacity",
|
|
39
|
+
opacity: {
|
|
40
|
+
preset: "quicker",
|
|
41
|
+
spring: { overshootClamping: true }
|
|
42
|
+
}
|
|
43
|
+
},
|
|
44
|
+
...contentProps,
|
|
45
|
+
children: [/* @__PURE__ */ jsx(Tooltip.Arrow, {
|
|
46
|
+
size: tooltipProps.size ?? 7,
|
|
47
|
+
backgroundColor: "background",
|
|
48
|
+
borderColor: "border-color"
|
|
49
|
+
}), /* @__PURE__ */ jsx(Paragraph, {
|
|
50
|
+
maxWidth: 350,
|
|
51
|
+
overflow: "hidden",
|
|
52
|
+
textAlign: "center",
|
|
53
|
+
textWrap: "web:balance",
|
|
54
|
+
size: "3",
|
|
55
|
+
children: label
|
|
56
|
+
})]
|
|
57
|
+
})]
|
|
58
|
+
});
|
|
74
59
|
});
|
|
60
|
+
|
|
75
61
|
export { TooltipSimple };
|
|
76
62
|
//# sourceMappingURL=TooltipSimple.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"TooltipSimple.js","names":[],"sources":["jsx/TooltipSimple.js"],"sourcesContent":["import { createRefComponent, getVariableValue } from \"@tamagui/core\";\nimport { getRadius, getSize, getSpace } from \"@tamagui/get-token\";\nimport { Paragraph } from \"@tamagui/text\";\nimport * as React from \"react\";\nimport { Tooltip } from \"./Tooltip\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nconst TooltipSimple = createRefComponent(\n ({ label, children, contentProps, disabled, ...tooltipProps }, ref) => {\n \"use no memo\";\n const child = React.Children.only(children);\n if (!label) {\n return children;\n }\n return /* @__PURE__ */ jsxs(\n Tooltip,\n {\n disableRTL: true,\n offset: 15,\n restMs: 40,\n delay: 40,\n zIndex: 1e6,\n ...tooltipProps,\n ...disabled ? { open: false } : null,\n children: [\n /* @__PURE__ */ jsx(\n Tooltip.Trigger,\n {\n ...typeof label === \"string\" && {\n \"aria-label\": label\n },\n asChild: \"except-style\",\n children: ref && React.isValidElement(child) ? React.cloneElement(child, { ref }) : child\n }\n ),\n /* @__PURE__ */ jsxs(\n Tooltip.Content,\n {\n theme: \"Tooltip\",\n y: \"enter:-4px exit:-4px\",\n scale: \"1 enter:0.96 exit:0.96\",\n opacity: \"1 enter:0 exit:0\",\n pointerEvents: \"none\",\n paddingHorizontal: getVariableValue(getSpace(tooltipProps.size ?? true)),\n paddingVertical: Math.max(\n 0,\n Math.round(\n getVariableValue(getSize(tooltipProps.size ?? true)) * 0.36 - 9\n )\n ),\n borderRadius: getVariableValue(getRadius(tooltipProps.size ?? true)),\n boxShadow: \"0 2px 4px shadow-color\",\n transition: {\n preset: \"quicker\",\n properties: \"transform, opacity\",\n opacity: { preset: \"quicker\", spring: { overshootClamping: true } }\n },\n ...contentProps,\n children: [\n /* @__PURE__ */ jsx(\n Tooltip.Arrow,\n {\n size: tooltipProps.size ?? 7,\n backgroundColor: \"background\",\n borderColor: \"border-color\"\n }\n ),\n /* @__PURE__ */ jsx(\n Paragraph,\n {\n maxWidth: 350,\n overflow: \"hidden\",\n textAlign: \"center\",\n textWrap: \"web:balance\",\n size: \"3\",\n children: label\n }\n )\n ]\n }\n )\n ]\n }\n );\n }\n);\nexport {\n TooltipSimple\n};\n//# sourceMappingURL=TooltipSimple.js.map\n"],"mappings":";;;;;;;;AAMA,MAAM,gBAAgB,oBACnB,EAAE,OAAO,UAAU,cAAc,UAAU,GAAG,gBAAgB,QAAQ;CACrE;CACA,MAAM,QAAQ,MAAM,SAAS,KAAK,QAAQ;CAC1C,IAAI,CAAC,OAAO;EACV,OAAO;CACT;CACA,OAAuB,qBACrB,SACA;EACE,YAAY;EACZ,QAAQ;EACR,QAAQ;EACR,OAAO;EACP,QAAQ;EACR,GAAG;EACH,GAAG,WAAW,EAAE,MAAM,MAAM,IAAI;EAChC,UAAU,CACQ,oBACd,QAAQ,SACR;GACE,GAAG,OAAO,UAAU,YAAY,EAC9B,cAAc,MAChB;GACA,SAAS;GACT,UAAU,OAAO,MAAM,eAAe,KAAK,IAAI,MAAM,aAAa,OAAO,EAAE,IAAI,CAAC,IAAI;EACtF,CACF,GACgB,qBACd,QAAQ,SACR;GACE,OAAO;GACP,GAAG;GACH,OAAO;GACP,SAAS;GACT,eAAe;GACf,mBAAmB,iBAAiB,SAAS,aAAa,QAAQ,IAAI,CAAC;GACvE,iBAAiB,KAAK,IACpB,GACA,KAAK,MACH,iBAAiB,QAAQ,aAAa,QAAQ,IAAI,CAAC,IAAI,MAAO,CAChE,CACF;GACA,cAAc,iBAAiB,UAAU,aAAa,QAAQ,IAAI,CAAC;GACnE,WAAW;GACX,YAAY;IACV,QAAQ;IACR,YAAY;IACZ,SAAS;KAAE,QAAQ;KAAW,QAAQ,EAAE,mBAAmB,KAAK;IAAE;GACpE;GACA,GAAG;GACH,UAAU,CACQ,oBACd,QAAQ,OACR;IACE,MAAM,aAAa,QAAQ;IAC3B,iBAAiB;IACjB,aAAa;GACf,CACF,GACgB,oBACd,WACA;IACE,UAAU;IACV,UAAU;IACV,WAAW;IACX,UAAU;IACV,MAAM;IACN,UAAU;GACZ,CACF,CACF;EACF,CACF,CACF;CACF,CACF;AACF,CACF"}
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all) __defProp(target, name, {
|
|
9
|
+
get: all[name],
|
|
10
|
+
enumerable: true
|
|
11
|
+
});
|
|
12
|
+
};
|
|
13
|
+
var __copyProps = (to, from, except, desc) => {
|
|
14
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
15
|
+
for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
|
|
16
|
+
get: () => from[key],
|
|
17
|
+
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
return to;
|
|
21
|
+
};
|
|
22
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
23
|
+
var TooltipSimple_native_exports = {};
|
|
24
|
+
__export(TooltipSimple_native_exports, { TooltipSimple: () => TooltipSimple });
|
|
25
|
+
module.exports = __toCommonJS(TooltipSimple_native_exports);
|
|
26
|
+
var RenderChildren = function(props) {
|
|
27
|
+
return props.children;
|
|
28
|
+
};
|
|
29
|
+
var TooltipSimple = RenderChildren;
|
|
@@ -5,30 +5,27 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
|
5
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
6
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
7
|
var __export = (target, all) => {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
8
|
+
for (var name in all) __defProp(target, name, {
|
|
9
|
+
get: all[name],
|
|
10
|
+
enumerable: true
|
|
11
|
+
});
|
|
12
12
|
};
|
|
13
13
|
var __copyProps = (to, from, except, desc) => {
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
14
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
15
|
+
for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
|
|
16
|
+
get: () => from[key],
|
|
17
|
+
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
18
|
+
});
|
|
19
|
+
}
|
|
20
|
+
return to;
|
|
21
21
|
};
|
|
22
|
-
var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
|
|
23
|
-
value: true
|
|
24
|
-
}), mod);
|
|
22
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
25
23
|
var TooltipSimple_native_exports = {};
|
|
26
|
-
__export(TooltipSimple_native_exports, {
|
|
27
|
-
TooltipSimple: () => TooltipSimple
|
|
28
|
-
});
|
|
24
|
+
__export(TooltipSimple_native_exports, { TooltipSimple: () => TooltipSimple });
|
|
29
25
|
module.exports = __toCommonJS(TooltipSimple_native_exports);
|
|
30
|
-
var RenderChildren = function
|
|
31
|
-
|
|
26
|
+
var RenderChildren = function(props) {
|
|
27
|
+
return props.children;
|
|
32
28
|
};
|
|
33
29
|
var TooltipSimple = RenderChildren;
|
|
30
|
+
|
|
34
31
|
//# sourceMappingURL=TooltipSimple.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"TooltipSimple.native.js","names":[],"sources":["jsx/TooltipSimple.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __export = (target, all) => {\n for (var name in all)\n __defProp(target, name, { get: all[name], enumerable: true });\n};\nvar __copyProps = (to, from, except, desc) => {\n if (from && typeof from === \"object\" || typeof from === \"function\") {\n for (let key of __getOwnPropNames(from))\n if (!__hasOwnProp.call(to, key) && key !== except)\n __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n }\n return to;\n};\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar TooltipSimple_native_exports = {};\n__export(TooltipSimple_native_exports, {\n TooltipSimple: () => TooltipSimple\n});\nmodule.exports = __toCommonJS(TooltipSimple_native_exports);\nvar RenderChildren = function(props) {\n return props.children;\n};\nvar TooltipSimple = RenderChildren;\n//# sourceMappingURL=TooltipSimple.native.js.map\n"],"mappings":";;;AACA,IAAI,YAAY,OAAO;AACvB,IAAI,mBAAmB,OAAO;AAC9B,IAAI,oBAAoB,OAAO;AAC/B,IAAI,eAAe,OAAO,UAAU;AACpC,IAAI,YAAY,QAAQ,QAAQ;CAC9B,KAAK,IAAI,QAAQ,KACf,UAAU,QAAQ,MAAM;EAAE,KAAK,IAAI;EAAO,YAAY;CAAK,CAAC;AAChE;AACA,IAAI,eAAe,IAAI,MAAM,QAAQ,SAAS;CAC5C,IAAI,QAAQ,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;EAClE,KAAK,IAAI,OAAO,kBAAkB,IAAI,GACpC,IAAI,CAAC,aAAa,KAAK,IAAI,GAAG,KAAK,QAAQ,QACzC,UAAU,IAAI,KAAK;GAAE,WAAW,KAAK;GAAM,YAAY,EAAE,OAAO,iBAAiB,MAAM,GAAG,MAAM,KAAK;EAAW,CAAC;CACvH;CACA,OAAO;AACT;AACA,IAAI,gBAAgB,QAAQ,YAAY,UAAU,CAAC,GAAG,cAAc,EAAE,OAAO,KAAK,CAAC,GAAG,GAAG;AACzF,IAAI,+BAA+B,CAAC;AACpC,SAAS,8BAA8B,EACrC,qBAAqB,cACvB,CAAC;AACD,OAAO,UAAU,aAAa,4BAA4B;AAC1D,IAAI,iBAAiB,SAAS,OAAO;CACnC,OAAO,MAAM;AACf;AACA,IAAI,gBAAgB"}
|
package/dist/jsx/index.js
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export * from "./Tooltip.mjs"
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export * from "./Tooltip.mjs"
|
|
2
|
+
|
|
3
|
+
export * from "./TooltipSimple.mjs"
|
package/dist/jsx/index.mjs
CHANGED
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
export * from "./Tooltip.mjs"
|
|
2
|
-
|
|
3
|
-
|
|
1
|
+
export * from "./Tooltip.mjs"
|
|
2
|
+
|
|
3
|
+
export * from "./TooltipSimple.mjs"
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var __defProp = Object.defineProperty;
|
|
4
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __copyProps = (to, from, except, desc) => {
|
|
8
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
9
|
+
for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
|
|
10
|
+
get: () => from[key],
|
|
11
|
+
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
return to;
|
|
15
|
+
};
|
|
16
|
+
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
+
var index_exports = {};
|
|
19
|
+
module.exports = __toCommonJS(index_exports);
|
|
20
|
+
__reExport(index_exports, require("./Tooltip.native.js"), module.exports);
|
|
21
|
+
__reExport(index_exports, require("./TooltipSimple.native.js"), module.exports);
|
package/dist/jsx/index.native.js
CHANGED
|
@@ -5,20 +5,19 @@ var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
|
5
5
|
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
6
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
7
|
var __copyProps = (to, from, except, desc) => {
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
8
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
9
|
+
for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
|
|
10
|
+
get: () => from[key],
|
|
11
|
+
enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
|
|
12
|
+
});
|
|
13
|
+
}
|
|
14
|
+
return to;
|
|
15
15
|
};
|
|
16
16
|
var __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, "default"), secondTarget && __copyProps(secondTarget, mod, "default"));
|
|
17
|
-
var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
|
|
18
|
-
value: true
|
|
19
|
-
}), mod);
|
|
17
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
20
18
|
var index_exports = {};
|
|
21
19
|
module.exports = __toCommonJS(index_exports);
|
|
22
20
|
__reExport(index_exports, require("./Tooltip.native.js"), module.exports);
|
|
23
21
|
__reExport(index_exports, require("./TooltipSimple.native.js"), module.exports);
|
|
22
|
+
|
|
24
23
|
//# sourceMappingURL=index.native.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"
|
|
1
|
+
{"version":3,"file":"index.native.js","names":[],"sources":["jsx/index.native.js"],"sourcesContent":["\"use strict\";\nvar __defProp = Object.defineProperty;\nvar __getOwnPropDesc = Object.getOwnPropertyDescriptor;\nvar __getOwnPropNames = Object.getOwnPropertyNames;\nvar __hasOwnProp = Object.prototype.hasOwnProperty;\nvar __copyProps = (to, from, except, desc) => {\n if (from && typeof from === \"object\" || typeof from === \"function\") {\n for (let key of __getOwnPropNames(from))\n if (!__hasOwnProp.call(to, key) && key !== except)\n __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });\n }\n return to;\n};\nvar __reExport = (target, mod, secondTarget) => (__copyProps(target, mod, \"default\"), secondTarget && __copyProps(secondTarget, mod, \"default\"));\nvar __toCommonJS = (mod) => __copyProps(__defProp({}, \"__esModule\", { value: true }), mod);\nvar index_exports = {};\nmodule.exports = __toCommonJS(index_exports);\n__reExport(index_exports, require(\"./Tooltip\"), module.exports);\n__reExport(index_exports, require(\"./TooltipSimple\"), module.exports);\n//# sourceMappingURL=index.js.map\n"],"mappings":";;;AACA,IAAI,YAAY,OAAO;AACvB,IAAI,mBAAmB,OAAO;AAC9B,IAAI,oBAAoB,OAAO;AAC/B,IAAI,eAAe,OAAO,UAAU;AACpC,IAAI,eAAe,IAAI,MAAM,QAAQ,SAAS;CAC5C,IAAI,QAAQ,OAAO,SAAS,YAAY,OAAO,SAAS,YAAY;EAClE,KAAK,IAAI,OAAO,kBAAkB,IAAI,GACpC,IAAI,CAAC,aAAa,KAAK,IAAI,GAAG,KAAK,QAAQ,QACzC,UAAU,IAAI,KAAK;GAAE,WAAW,KAAK;GAAM,YAAY,EAAE,OAAO,iBAAiB,MAAM,GAAG,MAAM,KAAK;EAAW,CAAC;CACvH;CACA,OAAO;AACT;AACA,IAAI,cAAc,QAAQ,KAAK,kBAAkB,YAAY,QAAQ,KAAK,SAAS,GAAG,gBAAgB,YAAY,cAAc,KAAK,SAAS;AAC9I,IAAI,gBAAgB,QAAQ,YAAY,UAAU,CAAC,GAAG,cAAc,EAAE,OAAO,KAAK,CAAC,GAAG,GAAG;AACzF,IAAI,gBAAgB,CAAC;AACrB,OAAO,UAAU,aAAa,aAAa;AAC3C,WAAW,eAAe,QAAQ,qBAAW,GAAG,OAAO,OAAO;AAC9D,WAAW,eAAe,QAAQ,2BAAiB,GAAG,OAAO,OAAO"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/tooltip",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "3.0.0-beta.1091.1",
|
|
4
|
+
"license": "MIT",
|
|
4
5
|
"source": "src/index.tsx",
|
|
5
6
|
"files": [
|
|
6
7
|
"src",
|
|
@@ -34,23 +35,24 @@
|
|
|
34
35
|
"clean:build": "tamagui-build clean:build"
|
|
35
36
|
},
|
|
36
37
|
"dependencies": {
|
|
37
|
-
"@tamagui/compose-refs": "
|
|
38
|
-
"@tamagui/core": "
|
|
39
|
-
"@tamagui/create-context": "
|
|
40
|
-
"@tamagui/floating": "
|
|
41
|
-
"@tamagui/get-token": "
|
|
42
|
-
"@tamagui/helpers": "
|
|
43
|
-
"@tamagui/polyfill-dev": "
|
|
44
|
-
"@tamagui/popover": "
|
|
45
|
-
"@tamagui/popper": "
|
|
46
|
-
"@tamagui/
|
|
47
|
-
"@tamagui/
|
|
48
|
-
"@tamagui/
|
|
38
|
+
"@tamagui/compose-refs": "3.0.0-beta.1091.1",
|
|
39
|
+
"@tamagui/core": "3.0.0-beta.1091.1",
|
|
40
|
+
"@tamagui/create-context": "3.0.0-beta.1091.1",
|
|
41
|
+
"@tamagui/floating": "3.0.0-beta.1091.1",
|
|
42
|
+
"@tamagui/get-token": "3.0.0-beta.1091.1",
|
|
43
|
+
"@tamagui/helpers": "3.0.0-beta.1091.1",
|
|
44
|
+
"@tamagui/polyfill-dev": "3.0.0-beta.1091.1",
|
|
45
|
+
"@tamagui/popover": "3.0.0-beta.1091.1",
|
|
46
|
+
"@tamagui/popper": "3.0.0-beta.1091.1",
|
|
47
|
+
"@tamagui/size": "3.0.0-beta.1091.1",
|
|
48
|
+
"@tamagui/stacks": "3.0.0-beta.1091.1",
|
|
49
|
+
"@tamagui/text": "3.0.0-beta.1091.1",
|
|
50
|
+
"@tamagui/use-controllable-state": "3.0.0-beta.1091.1"
|
|
49
51
|
},
|
|
50
52
|
"devDependencies": {
|
|
51
|
-
"@tamagui/build": "
|
|
52
|
-
"react": "
|
|
53
|
-
"react-native": "0.
|
|
53
|
+
"@tamagui/build": "3.0.0-beta.1091.1",
|
|
54
|
+
"react": "19.2.3",
|
|
55
|
+
"react-native": "0.86.2"
|
|
54
56
|
},
|
|
55
57
|
"peerDependencies": {
|
|
56
58
|
"react": ">=19"
|
package/src/Tooltip.tsx
CHANGED
|
@@ -1,10 +1,12 @@
|
|
|
1
|
+
import type { OpenChangeReason } from '@tamagui/floating'
|
|
2
|
+
import { createStyledHOC, createRefComponent, getConfig, styled } from '@tamagui/core'
|
|
1
3
|
import '@tamagui/polyfill-dev'
|
|
2
4
|
|
|
3
5
|
import { FloatingDelayGroup, useDelayGroupContext, type Delay } from '@tamagui/floating'
|
|
4
6
|
import type { SizeTokens, TamaguiElement } from '@tamagui/core'
|
|
5
7
|
import { useEvent } from '@tamagui/core'
|
|
6
8
|
import { FloatingOverrideContext } from '@tamagui/floating'
|
|
7
|
-
import {
|
|
9
|
+
import { oneSizeSmaller } from '@tamagui/size'
|
|
8
10
|
import { withStaticProperties } from '@tamagui/helpers'
|
|
9
11
|
import type {
|
|
10
12
|
PopoverAnchorProps,
|
|
@@ -21,6 +23,7 @@ import {
|
|
|
21
23
|
} from '@tamagui/popover'
|
|
22
24
|
import type { PopperArrowProps, PopperProps } from '@tamagui/popper'
|
|
23
25
|
import { Popper, PopperContentFrame } from '@tamagui/popper'
|
|
26
|
+
import { getElevation } from '@tamagui/stacks'
|
|
24
27
|
import { useControllableState } from '@tamagui/use-controllable-state'
|
|
25
28
|
import * as React from 'react'
|
|
26
29
|
|
|
@@ -32,7 +35,13 @@ type ScopedProps<P> = Omit<P, 'scope'> & { scope?: TooltipScopes }
|
|
|
32
35
|
|
|
33
36
|
export type TooltipContentProps = ScopedProps<PopoverContentProps>
|
|
34
37
|
|
|
35
|
-
|
|
38
|
+
const TooltipContentFrame = styled(PopperContentFrame, {
|
|
39
|
+
variants: {
|
|
40
|
+
elevation: getElevation,
|
|
41
|
+
} as const,
|
|
42
|
+
})
|
|
43
|
+
|
|
44
|
+
// warning: setting to createStyledHOC causes issues with themes across portal roots
|
|
36
45
|
|
|
37
46
|
// performance: avoid 2 components we never use
|
|
38
47
|
const ALWAYS_DISABLE_TOOLTIP = {
|
|
@@ -42,8 +51,9 @@ const ALWAYS_DISABLE_TOOLTIP = {
|
|
|
42
51
|
// dismiss: true
|
|
43
52
|
} as const
|
|
44
53
|
|
|
45
|
-
const TooltipContent =
|
|
46
|
-
|
|
54
|
+
const TooltipContent = createStyledHOC(
|
|
55
|
+
TooltipContentFrame,
|
|
56
|
+
(props: TooltipContentProps, ref) => {
|
|
47
57
|
const preventAnimation = React.useContext(PreventTooltipAnimationContext)
|
|
48
58
|
const zIndexFromContext = React.useContext(TooltipZIndexContext)
|
|
49
59
|
|
|
@@ -51,44 +61,38 @@ const TooltipContent = PopperContentFrame.styleable<TooltipContentProps>(
|
|
|
51
61
|
<PopoverContent
|
|
52
62
|
scope={props.scope || TOOLTIP_SCOPE}
|
|
53
63
|
alwaysDisable={ALWAYS_DISABLE_TOOLTIP}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
pointerEvents: 'none',
|
|
58
|
-
size: '$true',
|
|
59
|
-
})}
|
|
60
|
-
ref={ref}
|
|
61
|
-
// zIndex from root Tooltip prop flows to portal
|
|
64
|
+
backgroundColor="background"
|
|
65
|
+
alignItems="center"
|
|
66
|
+
pointerEvents="none"
|
|
62
67
|
{...(zIndexFromContext !== undefined && { zIndex: zIndexFromContext })}
|
|
63
68
|
{...props}
|
|
64
|
-
{...(preventAnimation && {
|
|
65
|
-
|
|
66
|
-
})}
|
|
69
|
+
{...(preventAnimation && { transition: null })}
|
|
70
|
+
ref={ref}
|
|
67
71
|
/>
|
|
68
72
|
)
|
|
69
73
|
},
|
|
70
74
|
{
|
|
71
|
-
|
|
72
|
-
componentName: 'Tooltip',
|
|
73
|
-
},
|
|
75
|
+
displayName: 'Tooltip',
|
|
74
76
|
}
|
|
75
77
|
)
|
|
76
78
|
|
|
77
|
-
const TooltipArrow =
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
79
|
+
const TooltipArrow = createRefComponent<TamaguiElement, PopperArrowProps>(
|
|
80
|
+
(props, ref) => {
|
|
81
|
+
const { className, ...rest } = props
|
|
82
|
+
return (
|
|
83
|
+
<PopoverArrow
|
|
84
|
+
scope={props.scope || TOOLTIP_SCOPE}
|
|
85
|
+
className={`is_Tooltip ${className || ''}`.trim()}
|
|
86
|
+
ref={ref}
|
|
87
|
+
{...rest}
|
|
88
|
+
/>
|
|
89
|
+
)
|
|
90
|
+
}
|
|
91
|
+
)
|
|
87
92
|
|
|
88
93
|
export type TooltipProps = ScopedProps<
|
|
89
94
|
PopperProps & {
|
|
90
95
|
open?: boolean
|
|
91
|
-
unstyled?: boolean
|
|
92
96
|
children?: React.ReactNode
|
|
93
97
|
onOpenChange?: (open: boolean) => void
|
|
94
98
|
focus?: {
|
|
@@ -144,7 +148,7 @@ export const closeOpenTooltips = () => {
|
|
|
144
148
|
setOpens.forEach((x) => x(false))
|
|
145
149
|
}
|
|
146
150
|
|
|
147
|
-
const TooltipComponent =
|
|
151
|
+
const TooltipComponent = createRefComponent(function Tooltip(
|
|
148
152
|
props: TooltipProps,
|
|
149
153
|
// no real ref here but React complaining need to see why see SandboxCustomStyledAnimatedTooltip.ts
|
|
150
154
|
ref
|
|
@@ -165,6 +169,7 @@ const TooltipComponent = React.forwardRef(function Tooltip(
|
|
|
165
169
|
...restProps
|
|
166
170
|
} = props
|
|
167
171
|
const triggerRef = React.useRef<HTMLButtonElement>(null)
|
|
172
|
+
const closeReasonRef = React.useRef<OpenChangeReason | undefined>(undefined)
|
|
168
173
|
const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false)
|
|
169
174
|
const { delay: delayGroup, setCurrentId } = useDelayGroupContext()
|
|
170
175
|
// Use delayProp if explicitly provided, otherwise fall back to group delay or default 400
|
|
@@ -206,6 +211,7 @@ const TooltipComponent = React.forwardRef(function Tooltip(
|
|
|
206
211
|
const floatingContext = useFloatingContext({
|
|
207
212
|
open,
|
|
208
213
|
setOpen: onOpenChange,
|
|
214
|
+
closeReasonRef,
|
|
209
215
|
disable: false,
|
|
210
216
|
disableFocus: false,
|
|
211
217
|
hoverable: true,
|
|
@@ -219,19 +225,14 @@ const TooltipComponent = React.forwardRef(function Tooltip(
|
|
|
219
225
|
const onCustomAnchorAdd = React.useCallback(() => setHasCustomAnchor(true), [])
|
|
220
226
|
const onCustomAnchorRemove = React.useCallback(() => setHasCustomAnchor(false), [])
|
|
221
227
|
const contentId = React.useId()
|
|
222
|
-
const smallerSize =
|
|
223
|
-
? null
|
|
224
|
-
: getSize('$true', {
|
|
225
|
-
shift: -2,
|
|
226
|
-
bounds: [0],
|
|
227
|
-
})
|
|
228
|
+
const smallerSize = oneSizeSmaller(true, getConfig().sizes)
|
|
228
229
|
|
|
229
230
|
const content = (
|
|
230
231
|
<FloatingOverrideContext.Provider value={floatingContext}>
|
|
231
232
|
{/* default tooltip to a smaller size */}
|
|
232
233
|
<Popper
|
|
233
234
|
scope={scope}
|
|
234
|
-
size={smallerSize
|
|
235
|
+
size={smallerSize as SizeTokens}
|
|
235
236
|
allowFlip
|
|
236
237
|
stayInFrame
|
|
237
238
|
open={open}
|
|
@@ -243,6 +244,7 @@ const TooltipComponent = React.forwardRef(function Tooltip(
|
|
|
243
244
|
triggerRef={triggerRef}
|
|
244
245
|
open={open}
|
|
245
246
|
onOpenChange={setOpen}
|
|
247
|
+
closeReasonRef={closeReasonRef}
|
|
246
248
|
onOpenToggle={voidFn}
|
|
247
249
|
hasCustomAnchor={hasCustomAnchor}
|
|
248
250
|
onCustomAnchorAdd={onCustomAnchorAdd}
|
|
@@ -265,7 +267,7 @@ const TooltipComponent = React.forwardRef(function Tooltip(
|
|
|
265
267
|
return content
|
|
266
268
|
})
|
|
267
269
|
|
|
268
|
-
const TooltipTrigger =
|
|
270
|
+
const TooltipTrigger = createRefComponent(function TooltipTrigger(
|
|
269
271
|
props: ScopedProps<PopoverTriggerProps>,
|
|
270
272
|
ref: any
|
|
271
273
|
) {
|
|
@@ -273,7 +275,7 @@ const TooltipTrigger = React.forwardRef(function TooltipTrigger(
|
|
|
273
275
|
return <PopoverTrigger {...rest} scope={scope || TOOLTIP_SCOPE} ref={ref} />
|
|
274
276
|
})
|
|
275
277
|
|
|
276
|
-
const TooltipAnchor =
|
|
278
|
+
const TooltipAnchor = createRefComponent(function TooltipAnchor(
|
|
277
279
|
props: ScopedProps<PopoverAnchorProps>,
|
|
278
280
|
ref: any
|
|
279
281
|
) {
|
package/src/TooltipSimple.tsx
CHANGED
|
@@ -1,5 +1,6 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import
|
|
1
|
+
import { createRefComponent, getVariableValue } from '@tamagui/core'
|
|
2
|
+
import { getRadius, getSize, getSpace } from '@tamagui/get-token'
|
|
3
|
+
import type { YStackProps } from '@tamagui/stacks'
|
|
3
4
|
import { Paragraph } from '@tamagui/text'
|
|
4
5
|
import * as React from 'react'
|
|
5
6
|
|
|
@@ -10,10 +11,10 @@ export type TooltipSimpleProps = TooltipProps & {
|
|
|
10
11
|
disabled?: boolean
|
|
11
12
|
label?: React.ReactNode
|
|
12
13
|
children?: React.ReactNode
|
|
13
|
-
contentProps?:
|
|
14
|
+
contentProps?: YStackProps
|
|
14
15
|
}
|
|
15
16
|
|
|
16
|
-
export const TooltipSimple: React.FC<TooltipSimpleProps> =
|
|
17
|
+
export const TooltipSimple: React.FC<TooltipSimpleProps> = createRefComponent(
|
|
17
18
|
({ label, children, contentProps, disabled, ...tooltipProps }, ref) => {
|
|
18
19
|
'use no memo'
|
|
19
20
|
|
|
@@ -46,35 +47,38 @@ export const TooltipSimple: React.FC<TooltipSimpleProps> = React.forwardRef(
|
|
|
46
47
|
</Tooltip.Trigger>
|
|
47
48
|
|
|
48
49
|
<Tooltip.Content
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
scale=
|
|
52
|
-
|
|
53
|
-
opacity={1}
|
|
50
|
+
theme="Tooltip"
|
|
51
|
+
y="enter:-4px exit:-4px"
|
|
52
|
+
scale="1 enter:0.96 exit:0.96"
|
|
53
|
+
opacity="1 enter:0 exit:0"
|
|
54
54
|
pointerEvents="none"
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
55
|
+
paddingHorizontal={getVariableValue(getSpace(tooltipProps.size ?? true))}
|
|
56
|
+
paddingVertical={Math.max(
|
|
57
|
+
0,
|
|
58
|
+
Math.round(
|
|
59
|
+
(getVariableValue(getSize(tooltipProps.size ?? true)) as number) * 0.36 - 9
|
|
60
|
+
)
|
|
61
|
+
)}
|
|
62
|
+
borderRadius={getVariableValue(getRadius(tooltipProps.size ?? true))}
|
|
63
|
+
boxShadow="0 2px 4px shadow-color"
|
|
64
|
+
transition={{
|
|
65
|
+
preset: 'quicker',
|
|
66
|
+
properties: 'transform, opacity',
|
|
67
|
+
opacity: { preset: 'quicker', spring: { overshootClamping: true } },
|
|
68
|
+
}}
|
|
67
69
|
{...contentProps}
|
|
68
70
|
>
|
|
69
|
-
<Tooltip.Arrow
|
|
71
|
+
<Tooltip.Arrow
|
|
72
|
+
size={tooltipProps.size ?? 7}
|
|
73
|
+
backgroundColor="background"
|
|
74
|
+
borderColor="border-color"
|
|
75
|
+
/>
|
|
70
76
|
<Paragraph
|
|
71
77
|
maxWidth={350}
|
|
72
78
|
overflow="hidden"
|
|
73
|
-
size="$3"
|
|
74
79
|
textAlign="center"
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
}}
|
|
80
|
+
textWrap="web:balance"
|
|
81
|
+
size="3"
|
|
78
82
|
>
|
|
79
83
|
{label}
|
|
80
84
|
</Paragraph>
|