@tamagui/demos 2.7.7 → 3.0.0-beta.643.1

package/dist/esm/TooltipDemo.mjs

@@ -1,108 +1,111 @@
 import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Circle } from "@tamagui/lucide-icons-2";
 import { Button, Paragraph, Theme, Tooltip, TooltipGroup, XStack, YStack } from "tamagui";
 import { jsx, jsxs } from "react/jsx-runtime";
+
 function TooltipDemo() {
-  return /* @__PURE__ */jsx(Theme, {
-    name: "surface2",
-    children: /* @__PURE__ */jsx(TooltipGroup, {
-      delay: {
-        open: 300,
-        close: 100
-      },
-      children: /* @__PURE__ */jsxs(YStack, {
-        gap: "$2",
-        self: "center",
-        children: [/* @__PURE__ */jsxs(XStack, {
-          gap: "$2",
-          children: [/* @__PURE__ */jsx(Demo, {
-            groupId: "0",
-            placement: "top-end",
-            Icon: Circle
-          }), /* @__PURE__ */jsx(Demo, {
-            groupId: "1",
-            placement: "top",
-            Icon: ChevronUp
-          }), /* @__PURE__ */jsx(Demo, {
-            groupId: "2",
-            placement: "top-start",
-            Icon: Circle
-          })]
-        }), /* @__PURE__ */jsxs(XStack, {
-          gap: "$2",
-          children: [/* @__PURE__ */jsx(Demo, {
-            groupId: "3",
-            placement: "left",
-            Icon: ChevronLeft
-          }), /* @__PURE__ */jsx(YStack, {
-            flex: 1
-          }), /* @__PURE__ */jsx(Demo, {
-            groupId: "4",
-            placement: "right",
-            Icon: ChevronRight
-          })]
-        }), /* @__PURE__ */jsxs(XStack, {
-          gap: "$2",
-          children: [/* @__PURE__ */jsx(Demo, {
-            groupId: "5",
-            placement: "bottom-end",
-            Icon: Circle
-          }), /* @__PURE__ */jsx(Demo, {
-            groupId: "6",
-            placement: "bottom",
-            Icon: ChevronDown
-          }), /* @__PURE__ */jsx(Demo, {
-            groupId: "7",
-            placement: "bottom-start",
-            Icon: Circle
-          })]
-        })]
-      })
-    })
-  });
+	return /* @__PURE__ */ jsx(Theme, {
+		name: "level3",
+		children: /* @__PURE__ */ jsx(TooltipGroup, {
+			delay: {
+				open: 300,
+				close: 100
+			},
+			children: /* @__PURE__ */ jsxs(YStack, {
+				gap: "2",
+				self: "center",
+				children: [
+					/* @__PURE__ */ jsxs(XStack, {
+						gap: "2",
+						children: [
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "0",
+								placement: "top-end",
+								Icon: Circle
+							}),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "1",
+								placement: "top",
+								Icon: ChevronUp
+							}),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "2",
+								placement: "top-start",
+								Icon: Circle
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs(XStack, {
+						gap: "2",
+						children: [
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "3",
+								placement: "left",
+								Icon: ChevronLeft
+							}),
+							/* @__PURE__ */ jsx(YStack, { flex: 1 }),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "4",
+								placement: "right",
+								Icon: ChevronRight
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs(XStack, {
+						gap: "2",
+						children: [
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "5",
+								placement: "bottom-end",
+								Icon: Circle
+							}),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "6",
+								placement: "bottom",
+								Icon: ChevronDown
+							}),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "7",
+								placement: "bottom-start",
+								Icon: Circle
+							})
+						]
+					})
+				]
+			})
+		})
+	});
 }
-function Demo({
-  Icon,
-  ...props
-}) {
-  return /* @__PURE__ */jsxs(Tooltip, {
-    ...props,
-    children: [/* @__PURE__ */jsx(Tooltip.Trigger, {
-      asChild: true,
-      children: /* @__PURE__ */jsx(Button, {
-        icon: Icon,
-        circular: true
-      })
-    }), /* @__PURE__ */jsxs(Tooltip.Content, {
-      enterStyle: {
-        x: 0,
-        y: -5,
-        opacity: 0,
-        scale: 0.9
-      },
-      exitStyle: {
-        x: 0,
-        y: -5,
-        opacity: 0,
-        scale: 0.9
-      },
-      scale: 1,
-      x: 0,
-      y: 0,
-      opacity: 1,
-      py: "$2",
-      px: "$3",
-      transition: ["quick", {
-        opacity: {
-          overshootClamping: true
-        }
-      }],
-      children: [/* @__PURE__ */jsx(Tooltip.Arrow, {}), /* @__PURE__ */jsx(Paragraph, {
-        size: "$2",
-        lineHeight: "$1",
-        children: "Hello world"
-      })]
-    })]
-  });
+function Demo({ Icon, ...props }) {
+	return /* @__PURE__ */ jsxs(Tooltip, {
+		...props,
+		children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Button, {
+				icon: Icon,
+				circular: true
+			})
+		}), /* @__PURE__ */ jsxs(Tooltip.Content, {
+			theme: "Tooltip",
+			scale: "1 enter:0.9 exit:0.9",
+			x: "0 enter:0 exit:0",
+			y: "0 enter:-5px exit:-5px",
+			opacity: "1 enter:0 exit:0",
+			py: "2",
+			px: "3",
+			rounded: true,
+			boxShadow: "0 2px 4px shadow-color",
+			transition: ["quick", { opacity: { overshootClamping: true } }],
+			children: [/* @__PURE__ */ jsx(Tooltip.Arrow, {
+				backgroundColor: "background",
+				borderColor: "border-color"
+			}), /* @__PURE__ */ jsx(Paragraph, {
+				size: "2",
+				lineHeight: "1",
+				children: "Hello world"
+			})]
+		})]
+	});
 }
+
 export { TooltipDemo };
 //# sourceMappingURL=TooltipDemo.mjs.map

package/dist/esm/TooltipDemo.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["ChevronDown","ChevronLeft","ChevronRight","ChevronUp","Circle","Button","Paragraph","Theme","Tooltip","TooltipGroup","XStack","YStack","jsx","jsxs","TooltipDemo","name","children","delay","open","close","gap","self","Demo","groupId","placement","Icon","flex","props","Trigger","asChild","icon","circular","Content","enterStyle","x","y","opacity","scale","exitStyle","py","px","transition","overshootClamping","Arrow","size","lineHeight"],"sources":["../../src/TooltipDemo.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"TooltipDemo.js","names":[],"sources":["esm/TooltipDemo.js"],"sourcesContent":["import {\n  ChevronDown,\n  ChevronLeft,\n  ChevronRight,\n  ChevronUp,\n  Circle\n} from \"@tamagui/lucide-icons-2\";\nimport { Button, Paragraph, Theme, Tooltip, TooltipGroup, XStack, YStack } from \"tamagui\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nfunction TooltipDemo() {\n  return /* @__PURE__ */ jsx(Theme, { name: \"level3\", children: /* @__PURE__ */ jsx(TooltipGroup, { delay: { open: 300, close: 100 }, children: /* @__PURE__ */ jsxs(YStack, { gap: \"2\", self: \"center\", children: [\n    /* @__PURE__ */ jsxs(XStack, { gap: \"2\", children: [\n      /* @__PURE__ */ jsx(Demo, { groupId: \"0\", placement: \"top-end\", Icon: Circle }),\n      /* @__PURE__ */ jsx(Demo, { groupId: \"1\", placement: \"top\", Icon: ChevronUp }),\n      /* @__PURE__ */ jsx(Demo, { groupId: \"2\", placement: \"top-start\", Icon: Circle })\n    ] }),\n    /* @__PURE__ */ jsxs(XStack, { gap: \"2\", children: [\n      /* @__PURE__ */ jsx(Demo, { groupId: \"3\", placement: \"left\", Icon: ChevronLeft }),\n      /* @__PURE__ */ jsx(YStack, { flex: 1 }),\n      /* @__PURE__ */ jsx(Demo, { groupId: \"4\", placement: \"right\", Icon: ChevronRight })\n    ] }),\n    /* @__PURE__ */ jsxs(XStack, { gap: \"2\", children: [\n      /* @__PURE__ */ jsx(Demo, { groupId: \"5\", placement: \"bottom-end\", Icon: Circle }),\n      /* @__PURE__ */ jsx(Demo, { groupId: \"6\", placement: \"bottom\", Icon: ChevronDown }),\n      /* @__PURE__ */ jsx(Demo, { groupId: \"7\", placement: \"bottom-start\", Icon: Circle })\n    ] })\n  ] }) }) });\n}\nfunction Demo({ Icon, ...props }) {\n  return /* @__PURE__ */ jsxs(Tooltip, { ...props, children: [\n    /* @__PURE__ */ jsx(Tooltip.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { icon: Icon, circular: true }) }),\n    /* @__PURE__ */ jsxs(\n      Tooltip.Content,\n      {\n        theme: \"Tooltip\",\n        scale: \"1 enter:0.9 exit:0.9\",\n        x: \"0 enter:0 exit:0\",\n        y: \"0 enter:-5px exit:-5px\",\n        opacity: \"1 enter:0 exit:0\",\n        py: \"2\",\n        px: \"3\",\n        rounded: true,\n        boxShadow: \"0 2px 4px shadow-color\",\n        transition: [\"quick\", { opacity: { overshootClamping: true } }],\n        children: [\n          /* @__PURE__ */ jsx(Tooltip.Arrow, { backgroundColor: \"background\", borderColor: \"border-color\" }),\n          /* @__PURE__ */ jsx(Paragraph, { size: \"2\", lineHeight: \"1\", children: \"Hello world\" })\n        ]\n      }\n    )\n  ] });\n}\nexport {\n  TooltipDemo\n};\n//# sourceMappingURL=TooltipDemo.js.map\n"],"mappings":";;;;;AASA,SAAS,cAAc;CACrB,OAAuB,oBAAI,OAAO;EAAE,MAAM;EAAU,UAA0B,oBAAI,cAAc;GAAE,OAAO;IAAE,MAAM;IAAK,OAAO;GAAI;GAAG,UAA0B,qBAAK,QAAQ;IAAE,KAAK;IAAK,MAAM;IAAU,UAAU;KAC/L,qBAAK,QAAQ;MAAE,KAAK;MAAK,UAAU;OACjC,oBAAI,MAAM;QAAE,SAAS;QAAK,WAAW;QAAW,MAAM;OAAO,CAAC;OAC9D,oBAAI,MAAM;QAAE,SAAS;QAAK,WAAW;QAAO,MAAM;OAAU,CAAC;OAC7D,oBAAI,MAAM;QAAE,SAAS;QAAK,WAAW;QAAa,MAAM;OAAO,CAAC;MAClF;KAAE,CAAC;KACa,qBAAK,QAAQ;MAAE,KAAK;MAAK,UAAU;OACjC,oBAAI,MAAM;QAAE,SAAS;QAAK,WAAW;QAAQ,MAAM;OAAY,CAAC;OAChE,oBAAI,QAAQ,EAAE,MAAM,EAAE,CAAC;OACvB,oBAAI,MAAM;QAAE,SAAS;QAAK,WAAW;QAAS,MAAM;OAAa,CAAC;MACpF;KAAE,CAAC;KACa,qBAAK,QAAQ;MAAE,KAAK;MAAK,UAAU;OACjC,oBAAI,MAAM;QAAE,SAAS;QAAK,WAAW;QAAc,MAAM;OAAO,CAAC;OACjE,oBAAI,MAAM;QAAE,SAAS;QAAK,WAAW;QAAU,MAAM;OAAY,CAAC;OAClE,oBAAI,MAAM;QAAE,SAAS;QAAK,WAAW;QAAgB,MAAM;OAAO,CAAC;MACrF;KAAE,CAAC;IACL;GAAE,CAAC;EAAE,CAAC;CAAE,CAAC;AACX;AACA,SAAS,KAAK,EAAE,MAAM,GAAG,SAAS;CAChC,OAAuB,qBAAK,SAAS;EAAE,GAAG;EAAO,UAAU,CACzC,oBAAI,QAAQ,SAAS;GAAE,SAAS;GAAM,UAA0B,oBAAI,QAAQ;IAAE,MAAM;IAAM,UAAU;GAAK,CAAC;EAAE,CAAC,GAC7G,qBACd,QAAQ,SACR;GACE,OAAO;GACP,OAAO;GACP,GAAG;GACH,GAAG;GACH,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,SAAS;GACT,WAAW;GACX,YAAY,CAAC,SAAS,EAAE,SAAS,EAAE,mBAAmB,KAAK,EAAE,CAAC;GAC9D,UAAU,CACQ,oBAAI,QAAQ,OAAO;IAAE,iBAAiB;IAAc,aAAa;GAAe,CAAC,GACjF,oBAAI,WAAW;IAAE,MAAM;IAAK,YAAY;IAAK,UAAU;GAAc,CAAC,CACxF;EACF,CACF,CACF;CAAE,CAAC;AACL"}

package/dist/esm/TooltipDemo.native.js

@@ -1,109 +1,112 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { jsx, jsxs } from "react/jsx-runtime";
 import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Circle } from "@tamagui/lucide-icons-2";
 import { Button, Paragraph, Theme, Tooltip, TooltipGroup, XStack, YStack } from "tamagui";
+
 function TooltipDemo() {
-  return /* @__PURE__ */_jsx(Theme, {
-    name: "surface2",
-    children: /* @__PURE__ */_jsx(TooltipGroup, {
-      delay: {
-        open: 300,
-        close: 100
-      },
-      children: /* @__PURE__ */_jsxs(YStack, {
-        gap: "$2",
-        self: "center",
-        children: [/* @__PURE__ */_jsxs(XStack, {
-          gap: "$2",
-          children: [/* @__PURE__ */_jsx(Demo, {
-            groupId: "0",
-            placement: "top-end",
-            Icon: Circle
-          }), /* @__PURE__ */_jsx(Demo, {
-            groupId: "1",
-            placement: "top",
-            Icon: ChevronUp
-          }), /* @__PURE__ */_jsx(Demo, {
-            groupId: "2",
-            placement: "top-start",
-            Icon: Circle
-          })]
-        }), /* @__PURE__ */_jsxs(XStack, {
-          gap: "$2",
-          children: [/* @__PURE__ */_jsx(Demo, {
-            groupId: "3",
-            placement: "left",
-            Icon: ChevronLeft
-          }), /* @__PURE__ */_jsx(YStack, {
-            flex: 1
-          }), /* @__PURE__ */_jsx(Demo, {
-            groupId: "4",
-            placement: "right",
-            Icon: ChevronRight
-          })]
-        }), /* @__PURE__ */_jsxs(XStack, {
-          gap: "$2",
-          children: [/* @__PURE__ */_jsx(Demo, {
-            groupId: "5",
-            placement: "bottom-end",
-            Icon: Circle
-          }), /* @__PURE__ */_jsx(Demo, {
-            groupId: "6",
-            placement: "bottom",
-            Icon: ChevronDown
-          }), /* @__PURE__ */_jsx(Demo, {
-            groupId: "7",
-            placement: "bottom-start",
-            Icon: Circle
-          })]
-        })]
-      })
-    })
-  });
+	return /* @__PURE__ */ jsx(Theme, {
+		name: "level3",
+		children: /* @__PURE__ */ jsx(TooltipGroup, {
+			delay: {
+				open: 300,
+				close: 100
+			},
+			children: /* @__PURE__ */ jsxs(YStack, {
+				gap: "2",
+				self: "center",
+				children: [
+					/* @__PURE__ */ jsxs(XStack, {
+						gap: "2",
+						children: [
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "0",
+								placement: "top-end",
+								Icon: Circle
+							}),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "1",
+								placement: "top",
+								Icon: ChevronUp
+							}),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "2",
+								placement: "top-start",
+								Icon: Circle
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs(XStack, {
+						gap: "2",
+						children: [
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "3",
+								placement: "left",
+								Icon: ChevronLeft
+							}),
+							/* @__PURE__ */ jsx(YStack, { flex: 1 }),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "4",
+								placement: "right",
+								Icon: ChevronRight
+							})
+						]
+					}),
+					/* @__PURE__ */ jsxs(XStack, {
+						gap: "2",
+						children: [
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "5",
+								placement: "bottom-end",
+								Icon: Circle
+							}),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "6",
+								placement: "bottom",
+								Icon: ChevronDown
+							}),
+							/* @__PURE__ */ jsx(Demo, {
+								groupId: "7",
+								placement: "bottom-start",
+								Icon: Circle
+							})
+						]
+					})
+				]
+			})
+		})
+	});
 }
 function Demo(param) {
-  var {
-    Icon,
-    ...props
-  } = param;
-  return /* @__PURE__ */_jsxs(Tooltip, {
-    ...props,
-    children: [/* @__PURE__ */_jsx(Tooltip.Trigger, {
-      asChild: true,
-      children: /* @__PURE__ */_jsx(Button, {
-        icon: Icon,
-        circular: true
-      })
-    }), /* @__PURE__ */_jsxs(Tooltip.Content, {
-      enterStyle: {
-        x: 0,
-        y: -5,
-        opacity: 0,
-        scale: 0.9
-      },
-      exitStyle: {
-        x: 0,
-        y: -5,
-        opacity: 0,
-        scale: 0.9
-      },
-      scale: 1,
-      x: 0,
-      y: 0,
-      opacity: 1,
-      py: "$2",
-      px: "$3",
-      transition: ["quick", {
-        opacity: {
-          overshootClamping: true
-        }
-      }],
-      children: [/* @__PURE__ */_jsx(Tooltip.Arrow, {}), /* @__PURE__ */_jsx(Paragraph, {
-        size: "$2",
-        lineHeight: "$1",
-        children: "Hello world"
-      })]
-    })]
-  });
+	var { Icon, ...props } = param;
+	return /* @__PURE__ */ jsxs(Tooltip, {
+		...props,
+		children: [/* @__PURE__ */ jsx(Tooltip.Trigger, {
+			asChild: true,
+			children: /* @__PURE__ */ jsx(Button, {
+				icon: Icon,
+				circular: true
+			})
+		}), /* @__PURE__ */ jsxs(Tooltip.Content, {
+			theme: "Tooltip",
+			scale: "1 enter:0.9 exit:0.9",
+			x: "0 enter:0 exit:0",
+			y: "0 enter:-5px exit:-5px",
+			opacity: "1 enter:0 exit:0",
+			py: "2",
+			px: "3",
+			rounded: true,
+			boxShadow: "0 2px 4px shadow-color",
+			transition: ["quick", { opacity: { overshootClamping: true } }],
+			children: [/* @__PURE__ */ jsx(Tooltip.Arrow, {
+				backgroundColor: "background",
+				borderColor: "border-color"
+			}), /* @__PURE__ */ jsx(Paragraph, {
+				size: "2",
+				lineHeight: "1",
+				children: "Hello world"
+			})]
+		})]
+	});
 }
+
 export { TooltipDemo };
 //# sourceMappingURL=TooltipDemo.native.js.map

package/dist/esm/TooltipDemo.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["jsx","_jsx","jsxs","_jsxs","ChevronDown","ChevronLeft","ChevronRight","ChevronUp","Circle","Button","Paragraph","Theme","Tooltip","TooltipGroup","XStack","YStack","TooltipDemo","name","children","delay","open","close","gap","self","Demo","groupId","placement","Icon","flex"],"sources":["../../src/TooltipDemo.tsx"],"sourcesContent":[null],"mappings":"AAAA,SAAAA,GAAA,IAAAC,IAAA,EAAAC,IAAA,IAAAC,KAAA;AAAA,SACEC,WAAA,EAAAC,WAAA,EAAAC,YAAA,EAAAC,SAAA,EAAAC,MAAA;AAAA,SACAC,MAAA,EAAAC,SAAA,EAAAC,KAAA,EAAAC,OAAA,EAAAC,YAAA,EAAAC,MAAA,EAAAC,MAAA;AAAA,SACAC,YAAA;EACA,sBAAAf,IAAA,CAAAU,KAAA;IACAM,IAAA;IAAAC,QACK,iBAAAjB,IAAA,CAAAY,YAAA;MAEPM,KAAS;QAOCC,IACE,EADF;QALHC,KAAS;MACd;MAIQH,QAAA,iBAACf,KAAO,CAAAY,MAAI,EACV;QAAAO,GAAA;QACAC,IAAA;QACAL,QAAA,GACF,eAAAf,KAAA,CAAAW,MAAA;UACAQ,GAAA;UACEJ,QAAA,GACA,eAACjB,IAAA,CAAAuB,IAAO;YACRC,OAAA,KAAC;YACHC,SAAA;YACAC,IAAA,EAAAnB;UACE,IACA,eAACP,IAAK,CAAAuB,IAAA;YACNC,OAAA,KAAC;YACHC,SAAA;YAGNC,IAAA,EAAApB;UAEJ,IAEc,eAAWN,IAAwC,CAAAuB,IAAA;YAE7DC,OAAA;YACEC,SAAC,aAAQ;YAGTC,IAAA,EAAAnB;UAAS;QACP,IACA,eAAgBL,KAAM,CAAAW,MAAI;UAC1BQ,GAAO;UACJJ,QAAA,GACA,eAAAjB,IAAA,CAAAuB,IAAA;YACHC,OAAS;YACNC,SAAA;YACAC,IAAA,EAAAtB;UACH,IACE,eAAAJ,IAAA,CAAAc,MAAA;YACAa,IAAA;UACE,IACE,eAAA3B,IAAmB,CAAAuB,IAAA;YACrBC,OAAA;YACFC,SAAA;YACFC,IAAA,EAAArB;UAEA;QACA,IAEA,eAAAH,KAAA,CAAAW,MAAA;UAAAQ,GAAA;UACFJ,QAAA,GACF,eAAAjB,IAAA,CAAAuB,IAAA;YAEJC,OAAA","ignoreList":[]}
+{"version":3,"file":"TooltipDemo.native.js","names":[],"sources":["esm/TooltipDemo.native.js"],"sourcesContent":["import { jsx as _jsx, jsxs as _jsxs } from \"react/jsx-runtime\";\nimport { ChevronDown, ChevronLeft, ChevronRight, ChevronUp, Circle } from \"@tamagui/lucide-icons-2\";\nimport { Button, Paragraph, Theme, Tooltip, TooltipGroup, XStack, YStack } from \"tamagui\";\nfunction TooltipDemo() {\n  return /* @__PURE__ */ _jsx(Theme, {\n    name: \"level3\",\n    children: /* @__PURE__ */ _jsx(TooltipGroup, {\n      delay: {\n        open: 300,\n        close: 100\n      },\n      children: /* @__PURE__ */ _jsxs(YStack, {\n        gap: \"2\",\n        self: \"center\",\n        children: [\n          /* @__PURE__ */ _jsxs(XStack, {\n            gap: \"2\",\n            children: [\n              /* @__PURE__ */ _jsx(Demo, {\n                groupId: \"0\",\n                placement: \"top-end\",\n                Icon: Circle\n              }),\n              /* @__PURE__ */ _jsx(Demo, {\n                groupId: \"1\",\n                placement: \"top\",\n                Icon: ChevronUp\n              }),\n              /* @__PURE__ */ _jsx(Demo, {\n                groupId: \"2\",\n                placement: \"top-start\",\n                Icon: Circle\n              })\n            ]\n          }),\n          /* @__PURE__ */ _jsxs(XStack, {\n            gap: \"2\",\n            children: [\n              /* @__PURE__ */ _jsx(Demo, {\n                groupId: \"3\",\n                placement: \"left\",\n                Icon: ChevronLeft\n              }),\n              /* @__PURE__ */ _jsx(YStack, {\n                flex: 1\n              }),\n              /* @__PURE__ */ _jsx(Demo, {\n                groupId: \"4\",\n                placement: \"right\",\n                Icon: ChevronRight\n              })\n            ]\n          }),\n          /* @__PURE__ */ _jsxs(XStack, {\n            gap: \"2\",\n            children: [\n              /* @__PURE__ */ _jsx(Demo, {\n                groupId: \"5\",\n                placement: \"bottom-end\",\n                Icon: Circle\n              }),\n              /* @__PURE__ */ _jsx(Demo, {\n                groupId: \"6\",\n                placement: \"bottom\",\n                Icon: ChevronDown\n              }),\n              /* @__PURE__ */ _jsx(Demo, {\n                groupId: \"7\",\n                placement: \"bottom-start\",\n                Icon: Circle\n              })\n            ]\n          })\n        ]\n      })\n    })\n  });\n}\nfunction Demo(param) {\n  var { Icon, ...props } = param;\n  return /* @__PURE__ */ _jsxs(Tooltip, {\n    ...props,\n    children: [\n      /* @__PURE__ */ _jsx(Tooltip.Trigger, {\n        asChild: true,\n        children: /* @__PURE__ */ _jsx(Button, {\n          icon: Icon,\n          circular: true\n        })\n      }),\n      /* @__PURE__ */ _jsxs(Tooltip.Content, {\n        theme: \"Tooltip\",\n        scale: \"1 enter:0.9 exit:0.9\",\n        x: \"0 enter:0 exit:0\",\n        y: \"0 enter:-5px exit:-5px\",\n        opacity: \"1 enter:0 exit:0\",\n        py: \"2\",\n        px: \"3\",\n        rounded: true,\n        boxShadow: \"0 2px 4px shadow-color\",\n        transition: [\n          \"quick\",\n          {\n            opacity: {\n              overshootClamping: true\n            }\n          }\n        ],\n        children: [\n          /* @__PURE__ */ _jsx(Tooltip.Arrow, {\n            backgroundColor: \"background\",\n            borderColor: \"border-color\"\n          }),\n          /* @__PURE__ */ _jsx(Paragraph, {\n            size: \"2\",\n            lineHeight: \"1\",\n            children: \"Hello world\"\n          })\n        ]\n      })\n    ]\n  });\n}\nexport {\n  TooltipDemo\n};\n//# sourceMappingURL=TooltipDemo.js.map\n"],"mappings":";;;;;AAGA,SAAS,cAAc;CACrB,OAAuB,oBAAK,OAAO;EACjC,MAAM;EACN,UAA0B,oBAAK,cAAc;GAC3C,OAAO;IACL,MAAM;IACN,OAAO;GACT;GACA,UAA0B,qBAAM,QAAQ;IACtC,KAAK;IACL,MAAM;IACN,UAAU;KACQ,qBAAM,QAAQ;MAC5B,KAAK;MACL,UAAU;OACQ,oBAAK,MAAM;QACzB,SAAS;QACT,WAAW;QACX,MAAM;OACR,CAAC;OACe,oBAAK,MAAM;QACzB,SAAS;QACT,WAAW;QACX,MAAM;OACR,CAAC;OACe,oBAAK,MAAM;QACzB,SAAS;QACT,WAAW;QACX,MAAM;OACR,CAAC;MACH;KACF,CAAC;KACe,qBAAM,QAAQ;MAC5B,KAAK;MACL,UAAU;OACQ,oBAAK,MAAM;QACzB,SAAS;QACT,WAAW;QACX,MAAM;OACR,CAAC;OACe,oBAAK,QAAQ,EAC3B,MAAM,EACR,CAAC;OACe,oBAAK,MAAM;QACzB,SAAS;QACT,WAAW;QACX,MAAM;OACR,CAAC;MACH;KACF,CAAC;KACe,qBAAM,QAAQ;MAC5B,KAAK;MACL,UAAU;OACQ,oBAAK,MAAM;QACzB,SAAS;QACT,WAAW;QACX,MAAM;OACR,CAAC;OACe,oBAAK,MAAM;QACzB,SAAS;QACT,WAAW;QACX,MAAM;OACR,CAAC;OACe,oBAAK,MAAM;QACzB,SAAS;QACT,WAAW;QACX,MAAM;OACR,CAAC;MACH;KACF,CAAC;IACH;GACF,CAAC;EACH,CAAC;CACH,CAAC;AACH;AACA,SAAS,KAAK,OAAO;CACnB,IAAI,EAAE,MAAM,GAAG,UAAU;CACzB,OAAuB,qBAAM,SAAS;EACpC,GAAG;EACH,UAAU,CACQ,oBAAK,QAAQ,SAAS;GACpC,SAAS;GACT,UAA0B,oBAAK,QAAQ;IACrC,MAAM;IACN,UAAU;GACZ,CAAC;EACH,CAAC,GACe,qBAAM,QAAQ,SAAS;GACrC,OAAO;GACP,OAAO;GACP,GAAG;GACH,GAAG;GACH,SAAS;GACT,IAAI;GACJ,IAAI;GACJ,SAAS;GACT,WAAW;GACX,YAAY,CACV,SACA,EACE,SAAS,EACP,mBAAmB,KACrB,EACF,CACF;GACA,UAAU,CACQ,oBAAK,QAAQ,OAAO;IAClC,iBAAiB;IACjB,aAAa;GACf,CAAC,GACe,oBAAK,WAAW;IAC9B,MAAM;IACN,YAAY;IACZ,UAAU;GACZ,CAAC,CACH;EACF,CAAC,CACH;CACF,CAAC;AACH"}

package/dist/esm/UpdateThemeDemo.mjs

@@ -1,48 +1,45 @@
 import React from "react";
-import { config } from "@tamagui/config/v3";
 import { addTheme, updateTheme } from "@tamagui/theme";
-import { Button, Square, Theme, XStack, YStack, getVariableValue, useIsomorphicLayoutEffect } from "tamagui";
+import { Button, Square, Theme, XStack, YStack, getTokens, getVariableValue, useIsomorphicLayoutEffect } from "tamagui";
 import { jsx, jsxs } from "react/jsx-runtime";
-const colors = config.tokens.color;
-const colorKeys = Object.keys(colors);
+
 function UpdateThemeDemo() {
-  const [theme, setTheme] = React.useState();
-  useIsomorphicLayoutEffect(() => {
-    addTheme({
-      name: "custom",
-      insertCSS: true,
-      theme: {
-        color: "red"
-      }
-    });
-    setTheme("custom");
-  }, []);
-  return /* @__PURE__ */jsxs(YStack, {
-    items: "center",
-    gap: "$4",
-    children: [/* @__PURE__ */jsx(XStack, {
-      gap: "$5",
-      children: /* @__PURE__ */jsx(Theme, {
-        name: theme ?? null,
-        children: /* @__PURE__ */jsx(Square, {
-          rounded: "$8",
-          size: 100,
-          bg: "$color"
-        })
-      })
-    }), /* @__PURE__ */jsx(Button, {
-      onPress: () => {
-        const randomColor = getVariableValue(colors[colorKeys[Math.floor(Math.random() * colorKeys.length)]]);
-        updateTheme({
-          name: "custom",
-          theme: {
-            color: randomColor
-          }
-        });
-      },
-      children: "Set to random color"
-    })]
-  });
+	const [theme, setTheme] = React.useState();
+	useIsomorphicLayoutEffect(() => {
+		addTheme({
+			name: "custom",
+			insertCSS: true,
+			theme: { color: "red" }
+		});
+		setTheme("custom");
+	}, []);
+	return /* @__PURE__ */ jsxs(YStack, {
+		items: "center",
+		gap: "4",
+		children: [/* @__PURE__ */ jsx(XStack, {
+			gap: "5",
+			children: /* @__PURE__ */ jsx(Theme, {
+				name: theme ?? null,
+				children: /* @__PURE__ */ jsx(Square, {
+					rounded: "8",
+					bg: "color",
+					size: 100
+				})
+			})
+		}), /* @__PURE__ */ jsx(Button, {
+			onPress: () => {
+				const colors = getTokens().color;
+				const colorKeys = Object.keys(colors);
+				const randomColor = getVariableValue(colors[colorKeys[Math.floor(Math.random() * colorKeys.length)]]);
+				updateTheme({
+					name: "custom",
+					theme: { color: randomColor }
+				});
+			},
+			children: "Set to random color"
+		})]
+	});
 }
+
 export { UpdateThemeDemo };
 //# sourceMappingURL=UpdateThemeDemo.mjs.map

package/dist/esm/UpdateThemeDemo.mjs.map

@@ -1 +1 @@
-{"version":3,"names":["React","config","addTheme","updateTheme","Button","Square","Theme","XStack","YStack","getVariableValue","useIsomorphicLayoutEffect","jsx","jsxs","colors","tokens","color","colorKeys","Object","keys","UpdateThemeDemo","theme","setTheme","useState","name","insertCSS","items","gap","children","rounded","size","bg","onPress","randomColor","Math","floor","random","length"],"sources":["../../src/UpdateThemeDemo.tsx"],"sourcesContent":[null],"mappings":"AAAA,OAAOA,KAAA,MAAW;AAClB,SAASC,MAAA,QAAc;AACvB,SAASC,QAAA,EAAUC,WAAA,QAAmB;AAEtC,SACEC,MAAA,EACAC,MAAA,EACAC,KAAA,EACAC,MAAA,EACAC,MAAA,EACAC,gBAAA,EACAC,yBAAA,QACK;AAoBH,SAGMC,GAAA,EAHNC,IAAA;AAlBJ,MAAMC,MAAA,GAASZ,MAAA,CAAOa,MAAA,CAAOC,KAAA;AAC7B,MAAMC,SAAA,GAAYC,MAAA,CAAOC,IAAA,CAAKL,MAAM;AAE7B,SAASM,gBAAA,EAAkB;EAChC,MAAM,CAACC,KAAA,EAAOC,QAAQ,IAAIrB,KAAA,CAAMsB,QAAA,CAAc;EAE9CZ,yBAAA,CAA0B,MAAM;IAC9BR,QAAA,CAAS;MACPqB,IAAA,EAAM;MACNC,SAAA,EAAW;MACXJ,KAAA,EAAO;QACLL,KAAA,EAAO;MACT;IACF,CAAC;IACDM,QAAA,CAAS,QAAQ;EACnB,GAAG,EAAE;EAEL,OACE,eAAAT,IAAA,CAACJ,MAAA;IAAOiB,KAAA,EAAM;IAASC,GAAA,EAAI;IACzBC,QAAA,kBAAAhB,GAAA,CAACJ,MAAA;MAAOmB,GAAA,EAAK;MACXC,QAAA,iBAAAhB,GAAA,CAACL,KAAA;QAAMiB,IAAA,EAAMH,KAAA,IAAS;QACpBO,QAAA,iBAAAhB,GAAA,CAACN,MAAA;UAAOuB,OAAA,EAAQ;UAAKC,IAAA,EAAM;UAAKC,EAAA,EAAG;QAAA,CAAS;MAAA,CAC9C;IAAA,CACF,GAEA,eAAAnB,GAAA,CAACP,MAAA;MACC2B,OAAA,EAASA,CAAA,KAAM;QACb,MAAMC,WAAA,GAAcvB,gBAAA,CAClBI,MAAA,CAAOG,SAAA,CAAUiB,IAAA,CAAKC,KAAA,CAAMD,IAAA,CAAKE,MAAA,CAAO,IAAInB,SAAA,CAAUoB,MAAM,CAAC,CAAC,CAChE;QACAjC,WAAA,CAAY;UACVoB,IAAA,EAAM;UACNH,KAAA,EAAO;YACLL,KAAA,EAAOiB;UACT;QACF,CAAC;MACH;MACDL,QAAA;IAAA,CAED;EAAA,CACF;AAEJ","ignoreList":[]}
+{"version":3,"file":"UpdateThemeDemo.js","names":[],"sources":["esm/UpdateThemeDemo.js"],"sourcesContent":["import React from \"react\";\nimport { addTheme, updateTheme } from \"@tamagui/theme\";\nimport {\n  Button,\n  Square,\n  Theme,\n  XStack,\n  YStack,\n  getTokens,\n  getVariableValue,\n  useIsomorphicLayoutEffect\n} from \"tamagui\";\nimport { jsx, jsxs } from \"react/jsx-runtime\";\nfunction UpdateThemeDemo() {\n  const [theme, setTheme] = React.useState();\n  useIsomorphicLayoutEffect(() => {\n    addTheme({\n      name: \"custom\",\n      insertCSS: true,\n      theme: {\n        color: \"red\"\n      }\n    });\n    setTheme(\"custom\");\n  }, []);\n  return /* @__PURE__ */ jsxs(YStack, { items: \"center\", gap: \"4\", children: [\n    /* @__PURE__ */ jsx(XStack, { gap: \"5\", children: /* @__PURE__ */ jsx(Theme, { name: theme ?? null, children: /* @__PURE__ */ jsx(Square, { rounded: \"8\", bg: \"color\", size: 100 }) }) }),\n    /* @__PURE__ */ jsx(\n      Button,\n      {\n        onPress: () => {\n          const colors = getTokens().color;\n          const colorKeys = Object.keys(colors);\n          const randomColor = getVariableValue(\n            colors[colorKeys[Math.floor(Math.random() * colorKeys.length)]]\n          );\n          updateTheme({\n            name: \"custom\",\n            theme: {\n              color: randomColor\n            }\n          });\n        },\n        children: \"Set to random color\"\n      }\n    )\n  ] });\n}\nexport {\n  UpdateThemeDemo\n};\n//# sourceMappingURL=UpdateThemeDemo.js.map\n"],"mappings":";;;;;;AAaA,SAAS,kBAAkB;CACzB,MAAM,CAAC,OAAO,YAAY,MAAM,SAAS;CACzC,gCAAgC;EAC9B,SAAS;GACP,MAAM;GACN,WAAW;GACX,OAAO,EACL,OAAO,MACT;EACF,CAAC;EACD,SAAS,QAAQ;CACnB,GAAG,CAAC,CAAC;CACL,OAAuB,qBAAK,QAAQ;EAAE,OAAO;EAAU,KAAK;EAAK,UAAU,CACzD,oBAAI,QAAQ;GAAE,KAAK;GAAK,UAA0B,oBAAI,OAAO;IAAE,MAAM,SAAS;IAAM,UAA0B,oBAAI,QAAQ;KAAE,SAAS;KAAK,IAAI;KAAS,MAAM;IAAI,CAAC;GAAE,CAAC;EAAE,CAAC,GACxK,oBACd,QACA;GACE,eAAe;IACb,MAAM,SAAS,UAAU,EAAE;IAC3B,MAAM,YAAY,OAAO,KAAK,MAAM;IACpC,MAAM,cAAc,iBAClB,OAAO,UAAU,KAAK,MAAM,KAAK,OAAO,IAAI,UAAU,MAAM,GAC9D;IACA,YAAY;KACV,MAAM;KACN,OAAO,EACL,OAAO,YACT;IACF,CAAC;GACH;GACA,UAAU;EACZ,CACF,CACF;CAAE,CAAC;AACL"}