@tamagui/demos 1.13.3 → 1.13.4

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 (482) hide show
  1. package/dist/cjs/AddThemeDemo.js +1 -59
  2. package/dist/cjs/AddThemeDemo.js.map +2 -2
  3. package/dist/cjs/AlertDialogDemo.js +1 -76
  4. package/dist/cjs/AlertDialogDemo.js.map +2 -2
  5. package/dist/cjs/AnimationsDemo.js +1 -113
  6. package/dist/cjs/AnimationsDemo.js.map +2 -2
  7. package/dist/cjs/AnimationsEnterDemo.js +1 -63
  8. package/dist/cjs/AnimationsEnterDemo.js.map +2 -2
  9. package/dist/cjs/AnimationsHoverDemo.js +1 -49
  10. package/dist/cjs/AnimationsHoverDemo.js.map +2 -2
  11. package/dist/cjs/AnimationsPresenceDemo.js +1 -96
  12. package/dist/cjs/AnimationsPresenceDemo.js.map +2 -2
  13. package/dist/cjs/AnimationsTimingDemo.js +1 -49
  14. package/dist/cjs/AnimationsTimingDemo.js.map +2 -2
  15. package/dist/cjs/AvatarDemo.js +1 -53
  16. package/dist/cjs/AvatarDemo.js.map +2 -2
  17. package/dist/cjs/ButtonDemo.js +1 -48
  18. package/dist/cjs/ButtonDemo.js.map +2 -2
  19. package/dist/cjs/CardDemo.js +1 -69
  20. package/dist/cjs/CardDemo.js.map +2 -2
  21. package/dist/cjs/CheckboxDemo.js +1 -44
  22. package/dist/cjs/CheckboxDemo.js.map +2 -2
  23. package/dist/cjs/ColorsDemo.js +1 -112
  24. package/dist/cjs/ColorsDemo.js.map +2 -2
  25. package/dist/cjs/DialogDemo.js +1 -85
  26. package/dist/cjs/DialogDemo.js.map +2 -2
  27. package/dist/cjs/FormsDemo.js +1 -59
  28. package/dist/cjs/FormsDemo.js.map +2 -2
  29. package/dist/cjs/GroupDemo.js +1 -48
  30. package/dist/cjs/GroupDemo.js.map +2 -2
  31. package/dist/cjs/HeadingsDemo.js +1 -39
  32. package/dist/cjs/HeadingsDemo.js.map +2 -2
  33. package/dist/cjs/ImageDemo.js +1 -32
  34. package/dist/cjs/ImageDemo.js.map +2 -2
  35. package/dist/cjs/InputsDemo.js +1 -43
  36. package/dist/cjs/InputsDemo.js.map +2 -2
  37. package/dist/cjs/LabelDemo.js +1 -41
  38. package/dist/cjs/LabelDemo.js.map +2 -2
  39. package/dist/cjs/LinearGradientDemo.js +1 -56
  40. package/dist/cjs/LinearGradientDemo.js.map +2 -2
  41. package/dist/cjs/ListItemDemo.js +1 -70
  42. package/dist/cjs/ListItemDemo.js.map +2 -2
  43. package/dist/cjs/LucideIconsDemo.js +1 -66
  44. package/dist/cjs/LucideIconsDemo.js.map +2 -2
  45. package/dist/cjs/PopoverDemo.js +1 -92
  46. package/dist/cjs/PopoverDemo.js.map +2 -2
  47. package/dist/cjs/ProgressDemo.js +1 -71
  48. package/dist/cjs/ProgressDemo.js.map +2 -2
  49. package/dist/cjs/RadioGroupDemo.js +1 -43
  50. package/dist/cjs/RadioGroupDemo.js.map +2 -2
  51. package/dist/cjs/ScrollViewDemo.js +1 -41
  52. package/dist/cjs/ScrollViewDemo.js.map +2 -2
  53. package/dist/cjs/SelectDemo.js +1 -103
  54. package/dist/cjs/SelectDemo.js.map +2 -2
  55. package/dist/cjs/SeparatorDemo.js +1 -43
  56. package/dist/cjs/SeparatorDemo.js.map +2 -2
  57. package/dist/cjs/ShapesDemo.js +1 -35
  58. package/dist/cjs/ShapesDemo.js.map +2 -2
  59. package/dist/cjs/SheetDemo.js +1 -103
  60. package/dist/cjs/SheetDemo.js.map +2 -2
  61. package/dist/cjs/SliderDemo.js +1 -42
  62. package/dist/cjs/SliderDemo.js.map +2 -2
  63. package/dist/cjs/SpinnerDemo.js +1 -35
  64. package/dist/cjs/SpinnerDemo.js.map +2 -2
  65. package/dist/cjs/StacksDemo.js +1 -81
  66. package/dist/cjs/StacksDemo.js.map +2 -2
  67. package/dist/cjs/SwitchDemo.js +1 -55
  68. package/dist/cjs/SwitchDemo.js.map +2 -2
  69. package/dist/cjs/TabsAdvancedDemo.js +1 -282
  70. package/dist/cjs/TabsAdvancedDemo.js.map +2 -2
  71. package/dist/cjs/TabsDemo.js +1 -146
  72. package/dist/cjs/TabsDemo.js.map +2 -2
  73. package/dist/cjs/TextDemo.js +1 -39
  74. package/dist/cjs/TextDemo.js.map +2 -2
  75. package/dist/cjs/ThemeInverseDemo.js +1 -43
  76. package/dist/cjs/ThemeInverseDemo.js.map +2 -2
  77. package/dist/cjs/ToastDemo.js +1 -128
  78. package/dist/cjs/ToastDemo.js.map +3 -3
  79. package/dist/cjs/ToastDuplicateDemo.js +1 -77
  80. package/dist/cjs/ToastDuplicateDemo.js.map +2 -2
  81. package/dist/cjs/ToggleGroupDemo.js +1 -72
  82. package/dist/cjs/ToggleGroupDemo.js.map +2 -2
  83. package/dist/cjs/TokensDemo.js +1 -110
  84. package/dist/cjs/TokensDemo.js.map +2 -2
  85. package/dist/cjs/TooltipDemo.js +1 -79
  86. package/dist/cjs/TooltipDemo.js.map +2 -2
  87. package/dist/cjs/UpdateThemeDemo.js +1 -79
  88. package/dist/cjs/UpdateThemeDemo.js.map +2 -2
  89. package/dist/cjs/conf.js +1 -28
  90. package/dist/cjs/conf.js.map +2 -2
  91. package/dist/cjs/index.js +1 -159
  92. package/dist/cjs/index.js.map +2 -2
  93. package/dist/cjs/tamagui.config.js +1 -27
  94. package/dist/cjs/tamagui.config.js.map +2 -2
  95. package/dist/cjs/useOnIntersecting.js +1 -92
  96. package/dist/cjs/useOnIntersecting.js.map +2 -2
  97. package/dist/esm/AddThemeDemo.js +1 -35
  98. package/dist/esm/AddThemeDemo.js.map +2 -2
  99. package/dist/esm/AddThemeDemo.mjs +1 -35
  100. package/dist/esm/AddThemeDemo.mjs.map +2 -2
  101. package/dist/esm/AlertDialogDemo.js +1 -52
  102. package/dist/esm/AlertDialogDemo.js.map +2 -2
  103. package/dist/esm/AlertDialogDemo.mjs +1 -52
  104. package/dist/esm/AlertDialogDemo.mjs.map +2 -2
  105. package/dist/esm/AnimationsDemo.js +1 -88
  106. package/dist/esm/AnimationsDemo.js.map +2 -2
  107. package/dist/esm/AnimationsDemo.mjs +1 -88
  108. package/dist/esm/AnimationsDemo.mjs.map +2 -2
  109. package/dist/esm/AnimationsEnterDemo.js +1 -39
  110. package/dist/esm/AnimationsEnterDemo.js.map +2 -2
  111. package/dist/esm/AnimationsEnterDemo.mjs +1 -39
  112. package/dist/esm/AnimationsEnterDemo.mjs.map +2 -2
  113. package/dist/esm/AnimationsHoverDemo.js +1 -25
  114. package/dist/esm/AnimationsHoverDemo.js.map +2 -2
  115. package/dist/esm/AnimationsHoverDemo.mjs +1 -25
  116. package/dist/esm/AnimationsHoverDemo.mjs.map +2 -2
  117. package/dist/esm/AnimationsPresenceDemo.js +1 -61
  118. package/dist/esm/AnimationsPresenceDemo.js.map +2 -2
  119. package/dist/esm/AnimationsPresenceDemo.mjs +1 -61
  120. package/dist/esm/AnimationsPresenceDemo.mjs.map +2 -2
  121. package/dist/esm/AnimationsTimingDemo.js +1 -25
  122. package/dist/esm/AnimationsTimingDemo.js.map +2 -2
  123. package/dist/esm/AnimationsTimingDemo.mjs +1 -25
  124. package/dist/esm/AnimationsTimingDemo.mjs.map +2 -2
  125. package/dist/esm/AvatarDemo.js +1 -29
  126. package/dist/esm/AvatarDemo.js.map +2 -2
  127. package/dist/esm/AvatarDemo.mjs +1 -29
  128. package/dist/esm/AvatarDemo.mjs.map +2 -2
  129. package/dist/esm/ButtonDemo.js +1 -24
  130. package/dist/esm/ButtonDemo.js.map +2 -2
  131. package/dist/esm/ButtonDemo.mjs +1 -24
  132. package/dist/esm/ButtonDemo.mjs.map +2 -2
  133. package/dist/esm/CardDemo.js +1 -45
  134. package/dist/esm/CardDemo.js.map +2 -2
  135. package/dist/esm/CardDemo.mjs +1 -45
  136. package/dist/esm/CardDemo.mjs.map +2 -2
  137. package/dist/esm/CheckboxDemo.js +1 -20
  138. package/dist/esm/CheckboxDemo.js.map +2 -2
  139. package/dist/esm/CheckboxDemo.mjs +1 -20
  140. package/dist/esm/CheckboxDemo.mjs.map +2 -2
  141. package/dist/esm/ColorsDemo.js +1 -97
  142. package/dist/esm/ColorsDemo.js.map +2 -2
  143. package/dist/esm/ColorsDemo.mjs +1 -97
  144. package/dist/esm/ColorsDemo.mjs.map +2 -2
  145. package/dist/esm/DialogDemo.js +1 -73
  146. package/dist/esm/DialogDemo.js.map +2 -2
  147. package/dist/esm/DialogDemo.mjs +1 -73
  148. package/dist/esm/DialogDemo.mjs.map +2 -2
  149. package/dist/esm/FormsDemo.js +1 -35
  150. package/dist/esm/FormsDemo.js.map +2 -2
  151. package/dist/esm/FormsDemo.mjs +1 -35
  152. package/dist/esm/FormsDemo.mjs.map +2 -2
  153. package/dist/esm/GroupDemo.js +1 -24
  154. package/dist/esm/GroupDemo.js.map +2 -2
  155. package/dist/esm/GroupDemo.mjs +1 -24
  156. package/dist/esm/GroupDemo.mjs.map +2 -2
  157. package/dist/esm/HeadingsDemo.js +1 -15
  158. package/dist/esm/HeadingsDemo.js.map +2 -2
  159. package/dist/esm/HeadingsDemo.mjs +1 -15
  160. package/dist/esm/HeadingsDemo.mjs.map +2 -2
  161. package/dist/esm/ImageDemo.js +1 -8
  162. package/dist/esm/ImageDemo.js.map +2 -2
  163. package/dist/esm/ImageDemo.mjs +1 -8
  164. package/dist/esm/ImageDemo.mjs.map +2 -2
  165. package/dist/esm/InputsDemo.js +1 -19
  166. package/dist/esm/InputsDemo.js.map +2 -2
  167. package/dist/esm/InputsDemo.mjs +1 -19
  168. package/dist/esm/InputsDemo.mjs.map +2 -2
  169. package/dist/esm/LabelDemo.js +1 -17
  170. package/dist/esm/LabelDemo.js.map +2 -2
  171. package/dist/esm/LabelDemo.mjs +1 -17
  172. package/dist/esm/LabelDemo.mjs.map +2 -2
  173. package/dist/esm/LinearGradientDemo.js +1 -32
  174. package/dist/esm/LinearGradientDemo.js.map +2 -2
  175. package/dist/esm/LinearGradientDemo.mjs +1 -32
  176. package/dist/esm/LinearGradientDemo.mjs.map +2 -2
  177. package/dist/esm/ListItemDemo.js +1 -46
  178. package/dist/esm/ListItemDemo.js.map +2 -2
  179. package/dist/esm/ListItemDemo.mjs +1 -46
  180. package/dist/esm/ListItemDemo.mjs.map +2 -2
  181. package/dist/esm/LucideIconsDemo.js +1 -32
  182. package/dist/esm/LucideIconsDemo.js.map +2 -2
  183. package/dist/esm/LucideIconsDemo.mjs +1 -32
  184. package/dist/esm/LucideIconsDemo.mjs.map +2 -2
  185. package/dist/esm/PopoverDemo.js +1 -75
  186. package/dist/esm/PopoverDemo.js.map +2 -2
  187. package/dist/esm/PopoverDemo.mjs +1 -75
  188. package/dist/esm/PopoverDemo.mjs.map +2 -2
  189. package/dist/esm/ProgressDemo.js +1 -47
  190. package/dist/esm/ProgressDemo.js.map +2 -2
  191. package/dist/esm/ProgressDemo.mjs +1 -47
  192. package/dist/esm/ProgressDemo.mjs.map +2 -2
  193. package/dist/esm/RadioGroupDemo.js +1 -19
  194. package/dist/esm/RadioGroupDemo.js.map +2 -2
  195. package/dist/esm/RadioGroupDemo.mjs +1 -19
  196. package/dist/esm/RadioGroupDemo.mjs.map +2 -2
  197. package/dist/esm/ScrollViewDemo.js +1 -17
  198. package/dist/esm/ScrollViewDemo.js.map +2 -2
  199. package/dist/esm/ScrollViewDemo.mjs +1 -17
  200. package/dist/esm/ScrollViewDemo.mjs.map +2 -2
  201. package/dist/esm/SelectDemo.js +1 -79
  202. package/dist/esm/SelectDemo.js.map +2 -2
  203. package/dist/esm/SelectDemo.mjs +1 -79
  204. package/dist/esm/SelectDemo.mjs.map +2 -2
  205. package/dist/esm/SeparatorDemo.js +1 -19
  206. package/dist/esm/SeparatorDemo.js.map +2 -2
  207. package/dist/esm/SeparatorDemo.mjs +1 -19
  208. package/dist/esm/SeparatorDemo.mjs.map +2 -2
  209. package/dist/esm/ShapesDemo.js +1 -11
  210. package/dist/esm/ShapesDemo.js.map +2 -2
  211. package/dist/esm/ShapesDemo.mjs +1 -11
  212. package/dist/esm/ShapesDemo.mjs.map +2 -2
  213. package/dist/esm/SheetDemo.js +1 -79
  214. package/dist/esm/SheetDemo.js.map +2 -2
  215. package/dist/esm/SheetDemo.mjs +1 -79
  216. package/dist/esm/SheetDemo.mjs.map +2 -2
  217. package/dist/esm/SliderDemo.js +1 -18
  218. package/dist/esm/SliderDemo.js.map +2 -2
  219. package/dist/esm/SliderDemo.mjs +1 -18
  220. package/dist/esm/SliderDemo.mjs.map +2 -2
  221. package/dist/esm/SpinnerDemo.js +1 -11
  222. package/dist/esm/SpinnerDemo.js.map +2 -2
  223. package/dist/esm/SpinnerDemo.mjs +1 -11
  224. package/dist/esm/SpinnerDemo.mjs.map +2 -2
  225. package/dist/esm/StacksDemo.js +1 -57
  226. package/dist/esm/StacksDemo.js.map +2 -2
  227. package/dist/esm/StacksDemo.mjs +1 -57
  228. package/dist/esm/StacksDemo.mjs.map +2 -2
  229. package/dist/esm/SwitchDemo.js +1 -31
  230. package/dist/esm/SwitchDemo.js.map +2 -2
  231. package/dist/esm/SwitchDemo.mjs +1 -31
  232. package/dist/esm/SwitchDemo.mjs.map +2 -2
  233. package/dist/esm/TabsAdvancedDemo.js +1 -268
  234. package/dist/esm/TabsAdvancedDemo.js.map +2 -2
  235. package/dist/esm/TabsAdvancedDemo.mjs +1 -268
  236. package/dist/esm/TabsAdvancedDemo.mjs.map +2 -2
  237. package/dist/esm/TabsDemo.js +1 -130
  238. package/dist/esm/TabsDemo.js.map +2 -2
  239. package/dist/esm/TabsDemo.mjs +1 -130
  240. package/dist/esm/TabsDemo.mjs.map +2 -2
  241. package/dist/esm/TextDemo.js +1 -15
  242. package/dist/esm/TextDemo.js.map +2 -2
  243. package/dist/esm/TextDemo.mjs +1 -15
  244. package/dist/esm/TextDemo.mjs.map +2 -2
  245. package/dist/esm/ThemeInverseDemo.js +1 -19
  246. package/dist/esm/ThemeInverseDemo.js.map +2 -2
  247. package/dist/esm/ThemeInverseDemo.mjs +1 -19
  248. package/dist/esm/ThemeInverseDemo.mjs.map +2 -2
  249. package/dist/esm/ToastDemo.js +1 -94
  250. package/dist/esm/ToastDemo.js.map +3 -3
  251. package/dist/esm/ToastDemo.mjs +1 -94
  252. package/dist/esm/ToastDemo.mjs.map +3 -3
  253. package/dist/esm/ToastDuplicateDemo.js +1 -43
  254. package/dist/esm/ToastDuplicateDemo.js.map +2 -2
  255. package/dist/esm/ToastDuplicateDemo.mjs +1 -43
  256. package/dist/esm/ToastDuplicateDemo.mjs.map +2 -2
  257. package/dist/esm/ToggleGroupDemo.js +1 -48
  258. package/dist/esm/ToggleGroupDemo.js.map +2 -2
  259. package/dist/esm/ToggleGroupDemo.mjs +1 -48
  260. package/dist/esm/ToggleGroupDemo.mjs.map +2 -2
  261. package/dist/esm/TokensDemo.js +1 -86
  262. package/dist/esm/TokensDemo.js.map +2 -2
  263. package/dist/esm/TokensDemo.mjs +1 -86
  264. package/dist/esm/TokensDemo.mjs.map +2 -2
  265. package/dist/esm/TooltipDemo.js +1 -68
  266. package/dist/esm/TooltipDemo.js.map +2 -2
  267. package/dist/esm/TooltipDemo.mjs +1 -68
  268. package/dist/esm/TooltipDemo.mjs.map +2 -2
  269. package/dist/esm/UpdateThemeDemo.js +1 -53
  270. package/dist/esm/UpdateThemeDemo.js.map +2 -2
  271. package/dist/esm/UpdateThemeDemo.mjs +1 -53
  272. package/dist/esm/UpdateThemeDemo.mjs.map +2 -2
  273. package/dist/esm/conf.js +1 -4
  274. package/dist/esm/conf.js.map +1 -1
  275. package/dist/esm/conf.mjs +1 -4
  276. package/dist/esm/conf.mjs.map +1 -1
  277. package/dist/esm/index.js +1 -91
  278. package/dist/esm/index.js.map +2 -2
  279. package/dist/esm/index.mjs +1 -91
  280. package/dist/esm/index.mjs.map +2 -2
  281. package/dist/esm/tamagui.config.js +1 -5
  282. package/dist/esm/tamagui.config.js.map +2 -2
  283. package/dist/esm/tamagui.config.mjs +1 -5
  284. package/dist/esm/tamagui.config.mjs.map +2 -2
  285. package/dist/esm/useOnIntersecting.js +1 -67
  286. package/dist/esm/useOnIntersecting.js.map +2 -2
  287. package/dist/esm/useOnIntersecting.mjs +1 -67
  288. package/dist/esm/useOnIntersecting.mjs.map +2 -2
  289. package/dist/jsx/AddThemeDemo.js +1 -30
  290. package/dist/jsx/AddThemeDemo.js.map +2 -2
  291. package/dist/jsx/AddThemeDemo.mjs +1 -30
  292. package/dist/jsx/AddThemeDemo.mjs.map +2 -2
  293. package/dist/jsx/AlertDialogDemo.js +1 -44
  294. package/dist/jsx/AlertDialogDemo.js.map +2 -2
  295. package/dist/jsx/AlertDialogDemo.mjs +1 -44
  296. package/dist/jsx/AlertDialogDemo.mjs.map +2 -2
  297. package/dist/jsx/AnimationsDemo.js +1 -80
  298. package/dist/jsx/AnimationsDemo.js.map +2 -2
  299. package/dist/jsx/AnimationsDemo.mjs +1 -80
  300. package/dist/jsx/AnimationsDemo.mjs.map +2 -2
  301. package/dist/jsx/AnimationsEnterDemo.js +1 -34
  302. package/dist/jsx/AnimationsEnterDemo.js.map +2 -2
  303. package/dist/jsx/AnimationsEnterDemo.mjs +1 -34
  304. package/dist/jsx/AnimationsEnterDemo.mjs.map +2 -2
  305. package/dist/jsx/AnimationsHoverDemo.js +1 -20
  306. package/dist/jsx/AnimationsHoverDemo.js.map +2 -2
  307. package/dist/jsx/AnimationsHoverDemo.mjs +1 -20
  308. package/dist/jsx/AnimationsHoverDemo.mjs.map +2 -2
  309. package/dist/jsx/AnimationsPresenceDemo.js +1 -54
  310. package/dist/jsx/AnimationsPresenceDemo.js.map +2 -2
  311. package/dist/jsx/AnimationsPresenceDemo.mjs +1 -54
  312. package/dist/jsx/AnimationsPresenceDemo.mjs.map +2 -2
  313. package/dist/jsx/AnimationsTimingDemo.js +1 -20
  314. package/dist/jsx/AnimationsTimingDemo.js.map +2 -2
  315. package/dist/jsx/AnimationsTimingDemo.mjs +1 -20
  316. package/dist/jsx/AnimationsTimingDemo.mjs.map +2 -2
  317. package/dist/jsx/AvatarDemo.js +1 -22
  318. package/dist/jsx/AvatarDemo.js.map +2 -2
  319. package/dist/jsx/AvatarDemo.mjs +1 -22
  320. package/dist/jsx/AvatarDemo.mjs.map +2 -2
  321. package/dist/jsx/ButtonDemo.js +1 -23
  322. package/dist/jsx/ButtonDemo.js.map +2 -2
  323. package/dist/jsx/ButtonDemo.mjs +1 -23
  324. package/dist/jsx/ButtonDemo.mjs.map +2 -2
  325. package/dist/jsx/CardDemo.js +1 -38
  326. package/dist/jsx/CardDemo.js.map +2 -2
  327. package/dist/jsx/CardDemo.mjs +1 -38
  328. package/dist/jsx/CardDemo.mjs.map +2 -2
  329. package/dist/jsx/CheckboxDemo.js +1 -19
  330. package/dist/jsx/CheckboxDemo.js.map +2 -2
  331. package/dist/jsx/CheckboxDemo.mjs +1 -19
  332. package/dist/jsx/CheckboxDemo.mjs.map +2 -2
  333. package/dist/jsx/ColorsDemo.js +1 -85
  334. package/dist/jsx/ColorsDemo.js.map +2 -2
  335. package/dist/jsx/ColorsDemo.mjs +1 -85
  336. package/dist/jsx/ColorsDemo.mjs.map +2 -2
  337. package/dist/jsx/DialogDemo.js +1 -65
  338. package/dist/jsx/DialogDemo.js.map +2 -2
  339. package/dist/jsx/DialogDemo.mjs +1 -65
  340. package/dist/jsx/DialogDemo.mjs.map +2 -2
  341. package/dist/jsx/FormsDemo.js +1 -30
  342. package/dist/jsx/FormsDemo.js.map +2 -2
  343. package/dist/jsx/FormsDemo.mjs +1 -30
  344. package/dist/jsx/FormsDemo.mjs.map +2 -2
  345. package/dist/jsx/GroupDemo.js +1 -23
  346. package/dist/jsx/GroupDemo.js.map +2 -2
  347. package/dist/jsx/GroupDemo.mjs +1 -23
  348. package/dist/jsx/GroupDemo.mjs.map +2 -2
  349. package/dist/jsx/HeadingsDemo.js +1 -14
  350. package/dist/jsx/HeadingsDemo.js.map +2 -2
  351. package/dist/jsx/HeadingsDemo.mjs +1 -14
  352. package/dist/jsx/HeadingsDemo.mjs.map +2 -2
  353. package/dist/jsx/ImageDemo.js +1 -7
  354. package/dist/jsx/ImageDemo.js.map +2 -2
  355. package/dist/jsx/ImageDemo.mjs +1 -7
  356. package/dist/jsx/ImageDemo.mjs.map +2 -2
  357. package/dist/jsx/InputsDemo.js +1 -18
  358. package/dist/jsx/InputsDemo.js.map +2 -2
  359. package/dist/jsx/InputsDemo.mjs +1 -18
  360. package/dist/jsx/InputsDemo.mjs.map +2 -2
  361. package/dist/jsx/LabelDemo.js +1 -16
  362. package/dist/jsx/LabelDemo.js.map +2 -2
  363. package/dist/jsx/LabelDemo.mjs +1 -16
  364. package/dist/jsx/LabelDemo.mjs.map +2 -2
  365. package/dist/jsx/LinearGradientDemo.js +1 -25
  366. package/dist/jsx/LinearGradientDemo.js.map +2 -2
  367. package/dist/jsx/LinearGradientDemo.mjs +1 -25
  368. package/dist/jsx/LinearGradientDemo.mjs.map +2 -2
  369. package/dist/jsx/ListItemDemo.js +1 -39
  370. package/dist/jsx/ListItemDemo.js.map +2 -2
  371. package/dist/jsx/ListItemDemo.mjs +1 -39
  372. package/dist/jsx/ListItemDemo.mjs.map +2 -2
  373. package/dist/jsx/LucideIconsDemo.js +1 -31
  374. package/dist/jsx/LucideIconsDemo.js.map +2 -2
  375. package/dist/jsx/LucideIconsDemo.mjs +1 -31
  376. package/dist/jsx/LucideIconsDemo.mjs.map +2 -2
  377. package/dist/jsx/PopoverDemo.js +1 -66
  378. package/dist/jsx/PopoverDemo.js.map +2 -2
  379. package/dist/jsx/PopoverDemo.mjs +1 -66
  380. package/dist/jsx/PopoverDemo.mjs.map +2 -2
  381. package/dist/jsx/ProgressDemo.js +1 -42
  382. package/dist/jsx/ProgressDemo.js.map +2 -2
  383. package/dist/jsx/ProgressDemo.mjs +1 -42
  384. package/dist/jsx/ProgressDemo.mjs.map +2 -2
  385. package/dist/jsx/RadioGroupDemo.js +1 -18
  386. package/dist/jsx/RadioGroupDemo.js.map +2 -2
  387. package/dist/jsx/RadioGroupDemo.mjs +1 -18
  388. package/dist/jsx/RadioGroupDemo.mjs.map +2 -2
  389. package/dist/jsx/ScrollViewDemo.js +1 -16
  390. package/dist/jsx/ScrollViewDemo.js.map +2 -2
  391. package/dist/jsx/ScrollViewDemo.mjs +1 -16
  392. package/dist/jsx/ScrollViewDemo.mjs.map +2 -2
  393. package/dist/jsx/SelectDemo.js +1 -72
  394. package/dist/jsx/SelectDemo.js.map +2 -2
  395. package/dist/jsx/SelectDemo.mjs +1 -72
  396. package/dist/jsx/SelectDemo.mjs.map +2 -2
  397. package/dist/jsx/SeparatorDemo.js +1 -18
  398. package/dist/jsx/SeparatorDemo.js.map +2 -2
  399. package/dist/jsx/SeparatorDemo.mjs +1 -18
  400. package/dist/jsx/SeparatorDemo.mjs.map +2 -2
  401. package/dist/jsx/ShapesDemo.js +1 -10
  402. package/dist/jsx/ShapesDemo.js.map +2 -2
  403. package/dist/jsx/ShapesDemo.mjs +1 -10
  404. package/dist/jsx/ShapesDemo.mjs.map +2 -2
  405. package/dist/jsx/SheetDemo.js +1 -65
  406. package/dist/jsx/SheetDemo.js.map +2 -2
  407. package/dist/jsx/SheetDemo.mjs +1 -65
  408. package/dist/jsx/SheetDemo.mjs.map +2 -2
  409. package/dist/jsx/SliderDemo.js +1 -17
  410. package/dist/jsx/SliderDemo.js.map +2 -2
  411. package/dist/jsx/SliderDemo.mjs +1 -17
  412. package/dist/jsx/SliderDemo.mjs.map +2 -2
  413. package/dist/jsx/SpinnerDemo.js +1 -10
  414. package/dist/jsx/SpinnerDemo.js.map +2 -2
  415. package/dist/jsx/SpinnerDemo.mjs +1 -10
  416. package/dist/jsx/SpinnerDemo.mjs.map +2 -2
  417. package/dist/jsx/StacksDemo.js +1 -45
  418. package/dist/jsx/StacksDemo.js.map +2 -2
  419. package/dist/jsx/StacksDemo.mjs +1 -45
  420. package/dist/jsx/StacksDemo.mjs.map +2 -2
  421. package/dist/jsx/SwitchDemo.js +1 -26
  422. package/dist/jsx/SwitchDemo.js.map +2 -2
  423. package/dist/jsx/SwitchDemo.mjs +1 -26
  424. package/dist/jsx/SwitchDemo.mjs.map +2 -2
  425. package/dist/jsx/TabsAdvancedDemo.js +1 -219
  426. package/dist/jsx/TabsAdvancedDemo.js.map +2 -2
  427. package/dist/jsx/TabsAdvancedDemo.mjs +1 -219
  428. package/dist/jsx/TabsAdvancedDemo.mjs.map +2 -2
  429. package/dist/jsx/TabsDemo.js +1 -105
  430. package/dist/jsx/TabsDemo.js.map +2 -2
  431. package/dist/jsx/TabsDemo.mjs +1 -105
  432. package/dist/jsx/TabsDemo.mjs.map +2 -2
  433. package/dist/jsx/TextDemo.js +1 -14
  434. package/dist/jsx/TextDemo.js.map +2 -2
  435. package/dist/jsx/TextDemo.mjs +1 -14
  436. package/dist/jsx/TextDemo.mjs.map +2 -2
  437. package/dist/jsx/ThemeInverseDemo.js +1 -18
  438. package/dist/jsx/ThemeInverseDemo.js.map +2 -2
  439. package/dist/jsx/ThemeInverseDemo.mjs +1 -18
  440. package/dist/jsx/ThemeInverseDemo.mjs.map +2 -2
  441. package/dist/jsx/ToastDemo.js +1 -74
  442. package/dist/jsx/ToastDemo.js.map +3 -3
  443. package/dist/jsx/ToastDemo.mjs +1 -74
  444. package/dist/jsx/ToastDemo.mjs.map +3 -3
  445. package/dist/jsx/ToastDuplicateDemo.js +1 -34
  446. package/dist/jsx/ToastDuplicateDemo.js.map +2 -2
  447. package/dist/jsx/ToastDuplicateDemo.mjs +1 -34
  448. package/dist/jsx/ToastDuplicateDemo.mjs.map +2 -2
  449. package/dist/jsx/ToggleGroupDemo.js +1 -39
  450. package/dist/jsx/ToggleGroupDemo.js.map +2 -2
  451. package/dist/jsx/ToggleGroupDemo.mjs +1 -39
  452. package/dist/jsx/ToggleGroupDemo.mjs.map +2 -2
  453. package/dist/jsx/TokensDemo.js +1 -77
  454. package/dist/jsx/TokensDemo.js.map +2 -2
  455. package/dist/jsx/TokensDemo.mjs +1 -77
  456. package/dist/jsx/TokensDemo.mjs.map +2 -2
  457. package/dist/jsx/TooltipDemo.js +1 -63
  458. package/dist/jsx/TooltipDemo.js.map +2 -2
  459. package/dist/jsx/TooltipDemo.mjs +1 -63
  460. package/dist/jsx/TooltipDemo.mjs.map +2 -2
  461. package/dist/jsx/UpdateThemeDemo.js +1 -48
  462. package/dist/jsx/UpdateThemeDemo.js.map +2 -2
  463. package/dist/jsx/UpdateThemeDemo.mjs +1 -48
  464. package/dist/jsx/UpdateThemeDemo.mjs.map +2 -2
  465. package/dist/jsx/conf.js +1 -4
  466. package/dist/jsx/conf.js.map +1 -1
  467. package/dist/jsx/conf.mjs +1 -4
  468. package/dist/jsx/conf.mjs.map +1 -1
  469. package/dist/jsx/index.js +1 -91
  470. package/dist/jsx/index.js.map +2 -2
  471. package/dist/jsx/index.mjs +1 -91
  472. package/dist/jsx/index.mjs.map +2 -2
  473. package/dist/jsx/tamagui.config.js +1 -5
  474. package/dist/jsx/tamagui.config.js.map +2 -2
  475. package/dist/jsx/tamagui.config.mjs +1 -5
  476. package/dist/jsx/tamagui.config.mjs.map +2 -2
  477. package/dist/jsx/useOnIntersecting.js +1 -67
  478. package/dist/jsx/useOnIntersecting.js.map +2 -2
  479. package/dist/jsx/useOnIntersecting.mjs +1 -67
  480. package/dist/jsx/useOnIntersecting.mjs.map +2 -2
  481. package/package.json +18 -18
  482. package/src/ToastDemo.tsx +4 -4
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/ToastDuplicateDemo.tsx"],
4
4
  "sourcesContent": ["import { CheckCircle2 } from '@tamagui/lucide-icons'\nimport { Toast } from '@tamagui/toast'\nimport React from 'react'\nimport { Button, XStack, YStack } from 'tamagui'\n\nexport const ToastDuplicateDemo = () => {\n const [savedCount, setSavedCount] = React.useState(0)\n\n return (\n <YStack alignItems=\"center\">\n <Button\n onPress={() => {\n setSavedCount((old) => old + 1)\n }}\n >\n Show toast\n </Button>\n {[...Array(savedCount)].map((_, index) => (\n <Toast\n viewportName=\"viewport-multiple\" // Sends to a viewport that supports multiple toasts with the `multipleToasts` prop\n key={index}\n duration={4000}\n enterStyle={{ opacity: 0, scale: 0.5, y: -25 }}\n exitStyle={{ opacity: 0, scale: 1, y: -20 }}\n y={0}\n opacity={1}\n scale={1}\n animation=\"100ms\"\n >\n <XStack space alignItems=\"center\">\n <YStack>\n <CheckCircle2 />\n </YStack>\n\n <YStack>\n <Toast.Title>Successfully saved!</Toast.Title>\n <Toast.Description>Don't worry... We've got your data.</Toast.Description>\n </YStack>\n </XStack>\n </Toast>\n ))}\n </YStack>\n )\n}\n"],
5
- "mappings": "AAAA,SAAS,oBAAoB;AAC7B,SAAS,aAAa;AACtB,OAAO,WAAW;AAClB,SAAS,QAAQ,QAAQ,cAAc;AAEhC,MAAM,qBAAqB,MAAM;AACtC,QAAM,CAAC,YAAY,aAAa,IAAI,MAAM,SAAS,CAAC;AAEpD,SACE,CAAC,OAAO,WAAW;AAAA,IACjB,CAAC;AAAA,MACC,SAAS,MAAM;AACb,sBAAc,CAAC,QAAQ,MAAM,CAAC;AAAA,MAChC;AAAA,KACD,UAED,EANC;AAAA,KAOA,CAAC,GAAG,MAAM,UAAU,CAAC,EAAE,IAAI,CAAC,GAAG,UAC9B,CAAC;AAAA,MACC,aAAa;AAAA,MACb,KAAK;AAAA,MACL,UAAU;AAAA,MACV,YAAY,EAAE,SAAS,GAAG,OAAO,KAAK,GAAG,IAAI;AAAA,MAC7C,WAAW,EAAE,SAAS,GAAG,OAAO,GAAG,GAAG,IAAI;AAAA,MAC1C,GAAG;AAAA,MACH,SAAS;AAAA,MACT,OAAO;AAAA,MACP,UAAU;AAAA,KAEV,CAAC,OAAO,MAAM,WAAW;AAAA,MACvB,CAAC,OACC,CAAC,aAAa,EAChB,EAFC;AAAA,MAID,CAAC;AAAA,QACC,CAAC,MAAM,MAAM,mBAAmB,EAA/B,MAAM;AAAA,QACP,CAAC,MAAM,YAAY,mCAAmC,EAArD,MAAM;AAAA,MACT,EAHC;AAAA,IAIH,EATC,OAUH,EArBC,MAsBF;AAAA,EACH,EAhCC;AAkCL;",
6
- "names": []
5
+ "mappings": "AAAA,OAAS,gBAAAA,MAAoB,wBAC7B,OAAS,SAAAC,MAAa,iBACtB,OAAOC,MAAW,QAClB,OAAS,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,MAAc,UAEhC,MAAMC,EAAqB,IAAM,CACtC,KAAM,CAACC,EAAYC,CAAa,EAAIN,EAAM,SAAS,CAAC,EAEpD,MACE,CAACG,EAAO,WAAW,SACjB,CAACF,EACC,SAAS,IAAM,CACbK,EAAeC,GAAQA,EAAM,CAAC,CAChC,GACD,UAED,EANCN,GAOA,CAAC,GAAG,MAAMI,CAAU,CAAC,EAAE,IAAI,CAACG,EAAGC,IAC9B,CAACV,EACC,aAAa,mBACb,KAAKU,EACL,UAAU,IACV,YAAY,CAAE,QAAS,EAAG,MAAO,GAAK,EAAG,GAAI,EAC7C,WAAW,CAAE,QAAS,EAAG,MAAO,EAAG,EAAG,GAAI,EAC1C,GAAG,EACH,SAAS,EACT,OAAO,EACP,UAAU,QAEV,CAACP,EAAO,MAAM,WAAW,SACvB,CAACC,EACC,CAACL,CAAa,EAChB,EAFCK,EAID,CAACA,EACC,CAACJ,EAAM,MAAM,mBAAmB,EAA/BA,EAAM,MACP,CAACA,EAAM,YAAY,mCAAmC,EAArDA,EAAM,YACT,EAHCI,EAIH,EATCD,EAUH,EArBCH,EAsBF,EACH,EAhCCI,EAkCL",
6
+ "names": ["CheckCircle2", "Toast", "React", "Button", "XStack", "YStack", "ToastDuplicateDemo", "savedCount", "setSavedCount", "old", "_", "index"]
7
7
  }
@@ -1,40 +1,2 @@
1
- import { AlignCenter, AlignLeft, AlignRight } from "@tamagui/lucide-icons";
2
- import { Label, ToggleGroup, XStack, YStack } from "tamagui";
3
- function ToggleGroupDemo() {
4
- return <YStack paddingHorizontal="$4"><XStack alignItems="center" space="$10">
5
- <YStack alignItems="center" space="$6">
6
- <ToggleGroupComponent type="single" size="$3" orientation="horizontal" />
7
- <ToggleGroupComponent type="multiple" size="$4" orientation="horizontal" />
8
- </YStack>
9
- <XStack alignItems="center" space="$6">
10
- <ToggleGroupComponent type="single" size="$3" orientation="vertical" />
11
- <ToggleGroupComponent type="multiple" size="$4" orientation="vertical" />
12
- </XStack>
13
- </XStack></YStack>;
14
- }
15
- function ToggleGroupComponent(props) {
16
- const id = `switch-${props.size.toString().slice(1)}-${props.type}`;
17
- return <XStack
18
- flexDirection={props.orientation === "horizontal" ? "row" : "column"}
19
- alignItems="center"
20
- justifyContent="center"
21
- space="$4"
22
- >
23
- <Label paddingRight="$0" justifyContent="flex-end" size={props.size} htmlFor={id}>{props.type === "single" ? "Single" : "Multiple"}</Label>
24
- <ToggleGroup
25
- orientation={props.orientation}
26
- id={id}
27
- type={props.type}
28
- size={props.size}
29
- disableDeactivation={props.type === "single" ? true : void 0}
30
- >
31
- <ToggleGroup.Item value="left" aria-label="Left aligned"><AlignLeft /></ToggleGroup.Item>
32
- <ToggleGroup.Item value="center" aria-label="Center aligned"><AlignCenter /></ToggleGroup.Item>
33
- <ToggleGroup.Item value="right" aria-label="Right aligned"><AlignRight /></ToggleGroup.Item>
34
- </ToggleGroup>
35
- </XStack>;
36
- }
37
- export {
38
- ToggleGroupDemo
39
- };
1
+ import{AlignCenter as G,AlignLeft as C,AlignRight as L}from"@tamagui/lucide-icons";import{Label as X,ToggleGroup as $,XStack as I,YStack as T}from"tamagui";function R(){return<T paddingHorizontal="$4"><I alignItems="center"space="$10"><T alignItems="center"space="$6"><S type="single"size="$3"orientation="horizontal"/><S type="multiple"size="$4"orientation="horizontal"/></T><I alignItems="center"space="$6"><S type="single"size="$3"orientation="vertical"/><S type="multiple"size="$4"orientation="vertical"/></I></I></T>}function S(e){const k=`switch-${e.size.toString().slice(1)}-${e.type}`;return<I flexDirection={e.orientation==="horizontal"?"row":"column"}alignItems="center"justifyContent="center"space="$4"><X paddingRight="$0"justifyContent="flex-end"size={e.size}htmlFor={k}>{e.type==="single"?"Single":"Multiple"}</X><$ orientation={e.orientation}id={k}type={e.type}size={e.size}disableDeactivation={e.type==="single"?!0:void 0}><$.Item value="left"aria-label="Left aligned"><C/></$.Item><$.Item value="center"aria-label="Center aligned"><G/></$.Item><$.Item value="right"aria-label="Right aligned"><L/></$.Item></$></I>}export{R as ToggleGroupDemo};
40
2
  //# sourceMappingURL=ToggleGroupDemo.js.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/ToggleGroupDemo.tsx"],
4
4
  "sourcesContent": ["import { AlignCenter, AlignLeft, AlignRight } from '@tamagui/lucide-icons'\nimport { Label, SizeTokens, ToggleGroup, XStack, YStack } from 'tamagui'\n\nexport function ToggleGroupDemo() {\n return (\n <YStack paddingHorizontal=\"$4\">\n <XStack alignItems=\"center\" space=\"$10\">\n <YStack alignItems=\"center\" space=\"$6\">\n <ToggleGroupComponent type=\"single\" size=\"$3\" orientation=\"horizontal\" />\n <ToggleGroupComponent type=\"multiple\" size=\"$4\" orientation=\"horizontal\" />\n </YStack>\n <XStack alignItems=\"center\" space=\"$6\">\n <ToggleGroupComponent type=\"single\" size=\"$3\" orientation=\"vertical\" />\n <ToggleGroupComponent type=\"multiple\" size=\"$4\" orientation=\"vertical\" />\n </XStack>\n </XStack>\n </YStack>\n )\n}\n\nfunction ToggleGroupComponent(props: {\n size: SizeTokens\n type: 'single' | 'multiple'\n orientation: 'vertical' | 'horizontal'\n}) {\n const id = `switch-${props.size.toString().slice(1)}-${props.type}`\n return (\n <XStack\n flexDirection={props.orientation === 'horizontal' ? 'row' : 'column'}\n alignItems=\"center\"\n justifyContent=\"center\"\n space=\"$4\"\n >\n <Label paddingRight=\"$0\" justifyContent=\"flex-end\" size={props.size} htmlFor={id}>\n {props.type === 'single' ? 'Single' : 'Multiple'}\n </Label>\n {/* <Separator vertical={props.orientation === 'horizontal'} /> */}\n\n <ToggleGroup\n orientation={props.orientation}\n id={id}\n type={props.type}\n size={props.size}\n disableDeactivation={props.type === 'single' ? true : undefined}\n >\n <ToggleGroup.Item value=\"left\" aria-label=\"Left aligned\">\n <AlignLeft />\n </ToggleGroup.Item>\n <ToggleGroup.Item value=\"center\" aria-label=\"Center aligned\">\n <AlignCenter />\n </ToggleGroup.Item>\n <ToggleGroup.Item value=\"right\" aria-label=\"Right aligned\">\n <AlignRight />\n </ToggleGroup.Item>\n </ToggleGroup>\n </XStack>\n )\n}\n"],
5
- "mappings": "AAAA,SAAS,aAAa,WAAW,kBAAkB;AACnD,SAAS,OAAmB,aAAa,QAAQ,cAAc;AAExD,SAAS,kBAAkB;AAChC,SACE,CAAC,OAAO,kBAAkB,KACxB,CAAC,OAAO,WAAW,SAAS,MAAM;AAAA,IAChC,CAAC,OAAO,WAAW,SAAS,MAAM;AAAA,MAChC,CAAC,qBAAqB,KAAK,SAAS,KAAK,KAAK,YAAY,aAAa;AAAA,MACvE,CAAC,qBAAqB,KAAK,WAAW,KAAK,KAAK,YAAY,aAAa;AAAA,IAC3E,EAHC;AAAA,IAID,CAAC,OAAO,WAAW,SAAS,MAAM;AAAA,MAChC,CAAC,qBAAqB,KAAK,SAAS,KAAK,KAAK,YAAY,WAAW;AAAA,MACrE,CAAC,qBAAqB,KAAK,WAAW,KAAK,KAAK,YAAY,WAAW;AAAA,IACzE,EAHC;AAAA,EAIH,EATC,OAUH,EAXC;AAaL;AAEA,SAAS,qBAAqB,OAI3B;AACD,QAAM,KAAK,UAAU,MAAM,KAAK,SAAS,EAAE,MAAM,CAAC,KAAK,MAAM;AAC7D,SACE,CAAC;AAAA,IACC,eAAe,MAAM,gBAAgB,eAAe,QAAQ;AAAA,IAC5D,WAAW;AAAA,IACX,eAAe;AAAA,IACf,MAAM;AAAA;AAAA,IAEN,CAAC,MAAM,aAAa,KAAK,eAAe,WAAW,MAAM,MAAM,MAAM,SAAS,KAC3E,MAAM,SAAS,WAAW,WAAW,WACxC,EAFC;AAAA,IAKD,CAAC;AAAA,MACC,aAAa,MAAM;AAAA,MACnB,IAAI;AAAA,MACJ,MAAM,MAAM;AAAA,MACZ,MAAM,MAAM;AAAA,MACZ,qBAAqB,MAAM,SAAS,WAAW,OAAO;AAAA;AAAA,MAEtD,CAAC,YAAY,KAAK,MAAM,OAAO,WAAW,eACxC,CAAC,UAAU,EACb,EAFC,YAAY;AAAA,MAGb,CAAC,YAAY,KAAK,MAAM,SAAS,WAAW,iBAC1C,CAAC,YAAY,EACf,EAFC,YAAY;AAAA,MAGb,CAAC,YAAY,KAAK,MAAM,QAAQ,WAAW,gBACzC,CAAC,WAAW,EACd,EAFC,YAAY;AAAA,IAGf,EAhBC;AAAA,EAiBH,EA5BC;AA8BL;",
6
- "names": []
5
+ "mappings": "AAAA,OAAS,eAAAA,EAAa,aAAAC,EAAW,cAAAC,MAAkB,wBACnD,OAAS,SAAAC,EAAmB,eAAAC,EAAa,UAAAC,EAAQ,UAAAC,MAAc,UAExD,SAASC,GAAkB,CAChC,MACE,CAACD,EAAO,kBAAkB,KACxB,CAACD,EAAO,WAAW,QAAS,MAAM,MAChC,CAACC,EAAO,WAAW,QAAS,MAAM,KAChC,CAACE,EAAqB,KAAK,QAAS,KAAK,IAAK,YAAY,YAAa,EACvE,CAACA,EAAqB,KAAK,UAAW,KAAK,IAAK,YAAY,YAAa,EAC3E,EAHCF,EAID,CAACD,EAAO,WAAW,QAAS,MAAM,KAChC,CAACG,EAAqB,KAAK,QAAS,KAAK,IAAK,YAAY,UAAW,EACrE,CAACA,EAAqB,KAAK,UAAW,KAAK,IAAK,YAAY,UAAW,EACzE,EAHCH,EAIH,EATCA,EAUH,EAXCC,EAaL,CAEA,SAASE,EAAqBC,EAI3B,CACD,MAAMC,EAAK,UAAUD,EAAM,KAAK,SAAS,EAAE,MAAM,CAAC,KAAKA,EAAM,OAC7D,MACE,CAACJ,EACC,eAAeI,EAAM,cAAgB,aAAe,MAAQ,SAC5D,WAAW,QACX,eAAe,QACf,MAAM,KAEN,CAACN,EAAM,aAAa,IAAK,eAAe,UAAW,MAAMM,EAAM,KAAM,SAASC,IAC3ED,EAAM,OAAS,SAAW,SAAW,WACxC,EAFCN,EAKD,CAACC,EACC,aAAaK,EAAM,YACnB,IAAIC,EACJ,MAAMD,EAAM,KACZ,MAAMA,EAAM,KACZ,qBAAqBA,EAAM,OAAS,SAAW,GAAO,QAEtD,CAACL,EAAY,KAAK,MAAM,MAAO,WAAW,eACxC,CAACH,CAAU,EACb,EAFCG,EAAY,KAGb,CAACA,EAAY,KAAK,MAAM,QAAS,WAAW,iBAC1C,CAACJ,CAAY,EACf,EAFCI,EAAY,KAGb,CAACA,EAAY,KAAK,MAAM,OAAQ,WAAW,gBACzC,CAACF,CAAW,EACd,EAFCE,EAAY,KAGf,EAhBCA,EAiBH,EA5BCC,EA8BL",
6
+ "names": ["AlignCenter", "AlignLeft", "AlignRight", "Label", "ToggleGroup", "XStack", "YStack", "ToggleGroupDemo", "ToggleGroupComponent", "props", "id"]
7
7
  }
@@ -1,40 +1,2 @@
1
- import { AlignCenter, AlignLeft, AlignRight } from "@tamagui/lucide-icons";
2
- import { Label, ToggleGroup, XStack, YStack } from "tamagui";
3
- function ToggleGroupDemo() {
4
- return <YStack paddingHorizontal="$4"><XStack alignItems="center" space="$10">
5
- <YStack alignItems="center" space="$6">
6
- <ToggleGroupComponent type="single" size="$3" orientation="horizontal" />
7
- <ToggleGroupComponent type="multiple" size="$4" orientation="horizontal" />
8
- </YStack>
9
- <XStack alignItems="center" space="$6">
10
- <ToggleGroupComponent type="single" size="$3" orientation="vertical" />
11
- <ToggleGroupComponent type="multiple" size="$4" orientation="vertical" />
12
- </XStack>
13
- </XStack></YStack>;
14
- }
15
- function ToggleGroupComponent(props) {
16
- const id = `switch-${props.size.toString().slice(1)}-${props.type}`;
17
- return <XStack
18
- flexDirection={props.orientation === "horizontal" ? "row" : "column"}
19
- alignItems="center"
20
- justifyContent="center"
21
- space="$4"
22
- >
23
- <Label paddingRight="$0" justifyContent="flex-end" size={props.size} htmlFor={id}>{props.type === "single" ? "Single" : "Multiple"}</Label>
24
- <ToggleGroup
25
- orientation={props.orientation}
26
- id={id}
27
- type={props.type}
28
- size={props.size}
29
- disableDeactivation={props.type === "single" ? true : void 0}
30
- >
31
- <ToggleGroup.Item value="left" aria-label="Left aligned"><AlignLeft /></ToggleGroup.Item>
32
- <ToggleGroup.Item value="center" aria-label="Center aligned"><AlignCenter /></ToggleGroup.Item>
33
- <ToggleGroup.Item value="right" aria-label="Right aligned"><AlignRight /></ToggleGroup.Item>
34
- </ToggleGroup>
35
- </XStack>;
36
- }
37
- export {
38
- ToggleGroupDemo
39
- };
1
+ import{AlignCenter as G,AlignLeft as C,AlignRight as L}from"@tamagui/lucide-icons";import{Label as X,ToggleGroup as $,XStack as I,YStack as T}from"tamagui";function R(){return<T paddingHorizontal="$4"><I alignItems="center"space="$10"><T alignItems="center"space="$6"><S type="single"size="$3"orientation="horizontal"/><S type="multiple"size="$4"orientation="horizontal"/></T><I alignItems="center"space="$6"><S type="single"size="$3"orientation="vertical"/><S type="multiple"size="$4"orientation="vertical"/></I></I></T>}function S(e){const k=`switch-${e.size.toString().slice(1)}-${e.type}`;return<I flexDirection={e.orientation==="horizontal"?"row":"column"}alignItems="center"justifyContent="center"space="$4"><X paddingRight="$0"justifyContent="flex-end"size={e.size}htmlFor={k}>{e.type==="single"?"Single":"Multiple"}</X><$ orientation={e.orientation}id={k}type={e.type}size={e.size}disableDeactivation={e.type==="single"?!0:void 0}><$.Item value="left"aria-label="Left aligned"><C/></$.Item><$.Item value="center"aria-label="Center aligned"><G/></$.Item><$.Item value="right"aria-label="Right aligned"><L/></$.Item></$></I>}export{R as ToggleGroupDemo};
40
2
  //# sourceMappingURL=ToggleGroupDemo.mjs.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/ToggleGroupDemo.tsx"],
4
4
  "sourcesContent": ["import { AlignCenter, AlignLeft, AlignRight } from '@tamagui/lucide-icons'\nimport { Label, SizeTokens, ToggleGroup, XStack, YStack } from 'tamagui'\n\nexport function ToggleGroupDemo() {\n return (\n <YStack paddingHorizontal=\"$4\">\n <XStack alignItems=\"center\" space=\"$10\">\n <YStack alignItems=\"center\" space=\"$6\">\n <ToggleGroupComponent type=\"single\" size=\"$3\" orientation=\"horizontal\" />\n <ToggleGroupComponent type=\"multiple\" size=\"$4\" orientation=\"horizontal\" />\n </YStack>\n <XStack alignItems=\"center\" space=\"$6\">\n <ToggleGroupComponent type=\"single\" size=\"$3\" orientation=\"vertical\" />\n <ToggleGroupComponent type=\"multiple\" size=\"$4\" orientation=\"vertical\" />\n </XStack>\n </XStack>\n </YStack>\n )\n}\n\nfunction ToggleGroupComponent(props: {\n size: SizeTokens\n type: 'single' | 'multiple'\n orientation: 'vertical' | 'horizontal'\n}) {\n const id = `switch-${props.size.toString().slice(1)}-${props.type}`\n return (\n <XStack\n flexDirection={props.orientation === 'horizontal' ? 'row' : 'column'}\n alignItems=\"center\"\n justifyContent=\"center\"\n space=\"$4\"\n >\n <Label paddingRight=\"$0\" justifyContent=\"flex-end\" size={props.size} htmlFor={id}>\n {props.type === 'single' ? 'Single' : 'Multiple'}\n </Label>\n {/* <Separator vertical={props.orientation === 'horizontal'} /> */}\n\n <ToggleGroup\n orientation={props.orientation}\n id={id}\n type={props.type}\n size={props.size}\n disableDeactivation={props.type === 'single' ? true : undefined}\n >\n <ToggleGroup.Item value=\"left\" aria-label=\"Left aligned\">\n <AlignLeft />\n </ToggleGroup.Item>\n <ToggleGroup.Item value=\"center\" aria-label=\"Center aligned\">\n <AlignCenter />\n </ToggleGroup.Item>\n <ToggleGroup.Item value=\"right\" aria-label=\"Right aligned\">\n <AlignRight />\n </ToggleGroup.Item>\n </ToggleGroup>\n </XStack>\n )\n}\n"],
5
- "mappings": "AAAA,SAAS,aAAa,WAAW,kBAAkB;AACnD,SAAS,OAAmB,aAAa,QAAQ,cAAc;AAExD,SAAS,kBAAkB;AAChC,SACE,CAAC,OAAO,kBAAkB,KACxB,CAAC,OAAO,WAAW,SAAS,MAAM;AAAA,IAChC,CAAC,OAAO,WAAW,SAAS,MAAM;AAAA,MAChC,CAAC,qBAAqB,KAAK,SAAS,KAAK,KAAK,YAAY,aAAa;AAAA,MACvE,CAAC,qBAAqB,KAAK,WAAW,KAAK,KAAK,YAAY,aAAa;AAAA,IAC3E,EAHC;AAAA,IAID,CAAC,OAAO,WAAW,SAAS,MAAM;AAAA,MAChC,CAAC,qBAAqB,KAAK,SAAS,KAAK,KAAK,YAAY,WAAW;AAAA,MACrE,CAAC,qBAAqB,KAAK,WAAW,KAAK,KAAK,YAAY,WAAW;AAAA,IACzE,EAHC;AAAA,EAIH,EATC,OAUH,EAXC;AAaL;AAEA,SAAS,qBAAqB,OAI3B;AACD,QAAM,KAAK,UAAU,MAAM,KAAK,SAAS,EAAE,MAAM,CAAC,KAAK,MAAM;AAC7D,SACE,CAAC;AAAA,IACC,eAAe,MAAM,gBAAgB,eAAe,QAAQ;AAAA,IAC5D,WAAW;AAAA,IACX,eAAe;AAAA,IACf,MAAM;AAAA;AAAA,IAEN,CAAC,MAAM,aAAa,KAAK,eAAe,WAAW,MAAM,MAAM,MAAM,SAAS,KAC3E,MAAM,SAAS,WAAW,WAAW,WACxC,EAFC;AAAA,IAKD,CAAC;AAAA,MACC,aAAa,MAAM;AAAA,MACnB,IAAI;AAAA,MACJ,MAAM,MAAM;AAAA,MACZ,MAAM,MAAM;AAAA,MACZ,qBAAqB,MAAM,SAAS,WAAW,OAAO;AAAA;AAAA,MAEtD,CAAC,YAAY,KAAK,MAAM,OAAO,WAAW,eACxC,CAAC,UAAU,EACb,EAFC,YAAY;AAAA,MAGb,CAAC,YAAY,KAAK,MAAM,SAAS,WAAW,iBAC1C,CAAC,YAAY,EACf,EAFC,YAAY;AAAA,MAGb,CAAC,YAAY,KAAK,MAAM,QAAQ,WAAW,gBACzC,CAAC,WAAW,EACd,EAFC,YAAY;AAAA,IAGf,EAhBC;AAAA,EAiBH,EA5BC;AA8BL;",
6
- "names": []
5
+ "mappings": "AAAA,OAAS,eAAAA,EAAa,aAAAC,EAAW,cAAAC,MAAkB,wBACnD,OAAS,SAAAC,EAAmB,eAAAC,EAAa,UAAAC,EAAQ,UAAAC,MAAc,UAExD,SAASC,GAAkB,CAChC,MACE,CAACD,EAAO,kBAAkB,KACxB,CAACD,EAAO,WAAW,QAAS,MAAM,MAChC,CAACC,EAAO,WAAW,QAAS,MAAM,KAChC,CAACE,EAAqB,KAAK,QAAS,KAAK,IAAK,YAAY,YAAa,EACvE,CAACA,EAAqB,KAAK,UAAW,KAAK,IAAK,YAAY,YAAa,EAC3E,EAHCF,EAID,CAACD,EAAO,WAAW,QAAS,MAAM,KAChC,CAACG,EAAqB,KAAK,QAAS,KAAK,IAAK,YAAY,UAAW,EACrE,CAACA,EAAqB,KAAK,UAAW,KAAK,IAAK,YAAY,UAAW,EACzE,EAHCH,EAIH,EATCA,EAUH,EAXCC,EAaL,CAEA,SAASE,EAAqBC,EAI3B,CACD,MAAMC,EAAK,UAAUD,EAAM,KAAK,SAAS,EAAE,MAAM,CAAC,KAAKA,EAAM,OAC7D,MACE,CAACJ,EACC,eAAeI,EAAM,cAAgB,aAAe,MAAQ,SAC5D,WAAW,QACX,eAAe,QACf,MAAM,KAEN,CAACN,EAAM,aAAa,IAAK,eAAe,UAAW,MAAMM,EAAM,KAAM,SAASC,IAC3ED,EAAM,OAAS,SAAW,SAAW,WACxC,EAFCN,EAKD,CAACC,EACC,aAAaK,EAAM,YACnB,IAAIC,EACJ,MAAMD,EAAM,KACZ,MAAMA,EAAM,KACZ,qBAAqBA,EAAM,OAAS,SAAW,GAAO,QAEtD,CAACL,EAAY,KAAK,MAAM,MAAO,WAAW,eACxC,CAACH,CAAU,EACb,EAFCG,EAAY,KAGb,CAACA,EAAY,KAAK,MAAM,QAAS,WAAW,iBAC1C,CAACJ,CAAY,EACf,EAFCI,EAAY,KAGb,CAACA,EAAY,KAAK,MAAM,OAAQ,WAAW,gBACzC,CAACF,CAAW,EACd,EAFCE,EAAY,KAGf,EAhBCA,EAiBH,EA5BCC,EA8BL",
6
+ "names": ["AlignCenter", "AlignLeft", "AlignRight", "Label", "ToggleGroup", "XStack", "YStack", "ToggleGroupDemo", "ToggleGroupComponent", "props", "id"]
7
7
  }
@@ -1,78 +1,2 @@
1
- import { getConfig } from "@tamagui/core";
2
- import { useState } from "react";
3
- import { Button, H2, H3, H4, Separator, Square, XGroup, XStack, YStack } from "tamagui";
4
- const sections = [
5
- {
6
- name: `Size`,
7
- key: `size`
8
- },
9
- {
10
- name: `Space`,
11
- key: "space"
12
- },
13
- {
14
- name: `Space (-)`,
15
- key: `spaceNegative`
16
- },
17
- {
18
- name: `Radius`,
19
- key: `radius`
20
- }
21
- ];
22
- function TokensDemo() {
23
- const [section, setSection] = useState("size");
24
- return <YStack space>
25
- <XGroup alignItems="center" alignSelf="center">{sections.map(({ name, key }) => {
26
- return <XGroup.Item key={key}><Button
27
- size="$3"
28
- theme={section === key ? "active" : null}
29
- fontFamily="$silkscreen"
30
- onPress={() => setSection(key)}
31
- >{name}</Button></XGroup.Item>;
32
- })}</XGroup>
33
- {(section === "size" || section === "spaceNegative" || section === "space" || section === "radius") && <SizeSection section={section} />}
34
- </YStack>;
35
- }
36
- function SizeSection({ section }) {
37
- const allTokens = getConfig().tokens;
38
- const tokens = allTokens[section.startsWith("space") ? "space" : section];
39
- const st = Object.keys(tokens).sort((a, b) => parseFloat(a) > parseFloat(b) ? 1 : -1);
40
- const spaceTokens = st.filter((t) => parseFloat(t) >= 0);
41
- const spaceTokensNegative = st.filter((t) => parseFloat(t) < 0).sort((a, b) => parseFloat(a) > parseFloat(b) ? -1 : 1);
42
- return <YStack flex={1} space>
43
- <H2>Sizes</H2>
44
- <YStack width="100%" space="$2" separator={<Separator />}>{(section === "spaceNegative" ? spaceTokensNegative : spaceTokens).map(
45
- (token) => {
46
- return <XStack width="100%" alignItems="center" key={token}>
47
- <YStack width="25%"><H3 size="$6">
48
- {"$"}
49
- {token}
50
- </H3></YStack>
51
- <YStack width="20%"><H4 size="$5">
52
- {tokens[token]?.val}
53
- {"px"}
54
- </H4></YStack>
55
- <Square
56
- size={tokens[token]?.val}
57
- backgroundColor="$color5"
58
- {...section === "spaceNegative" && {
59
- backgroundColor: "$red5",
60
- size: -tokens[spaceTokensNegative.find(
61
- (t) => parseFloat(t) === -parseFloat(token)
62
- ) ?? token]?.val
63
- }}
64
- {...section === "radius" && {
65
- // @ts-ignore
66
- size: allTokens.size[token]?.val,
67
- borderRadius: tokens[token]?.val
68
- }}
69
- />
70
- </XStack>;
71
- }
72
- )}</YStack>
73
- </YStack>;
74
- }
75
- export {
76
- TokensDemo
77
- };
1
+ import{getConfig as h}from"@tamagui/core";import{useState as H}from"react";import{Button as N,H2 as T,H3 as Y,H4 as X,Separator as I,Square as C,XGroup as F,XStack as G,YStack as S}from"tamagui";const B=[{name:"Size",key:"size"},{name:"Space",key:"space"},{name:"Space (-)",key:"spaceNegative"},{name:"Radius",key:"radius"}];function P(){const[a,u]=H("size");return<S space><F alignItems="center"alignSelf="center">{B.map(({name:t,key:s})=><F.Item key={s}><N size="$3"theme={a===s?"active":null}fontFamily="$silkscreen"onPress={()=>u(s)}>{t}</N></F.Item>)}</F>{(a==="size"||a==="spaceNegative"||a==="space"||a==="radius")&&<R section={a}/>}</S>}function R({section:a}){const u=h().tokens,t=u[a.startsWith("space")?"space":a],s=Object.keys(t).sort((e,o)=>parseFloat(e)>parseFloat(o)?1:-1),$=s.filter(e=>parseFloat(e)>=0),m=s.filter(e=>parseFloat(e)<0).sort((e,o)=>parseFloat(e)>parseFloat(o)?-1:1);return<S flex={1}space><T>Sizes</T><S width="100%"space="$2"separator={<I/>}>{(a==="spaceNegative"?m:$).map(e=><G width="100%"alignItems="center"key={e}><S width="25%"><Y size="$6">${e}</Y></S><S width="20%"><X size="$5">{t[e]?.val}px</X></S><C size={t[e]?.val}backgroundColor="$color5"{...a==="spaceNegative"&&{backgroundColor:"$red5",size:-t[m.find(o=>parseFloat(o)===-parseFloat(e))??e]?.val}}{...a==="radius"&&{size:u.size[e]?.val,borderRadius:t[e]?.val}}/></G>)}</S></S>}export{P as TokensDemo};
78
2
  //# sourceMappingURL=TokensDemo.js.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/TokensDemo.tsx"],
4
4
  "sourcesContent": ["import { Tokens, getConfig } from '@tamagui/core'\nimport { useState } from 'react'\nimport { Button, H2, H3, H4, Separator, Square, XGroup, XStack, YStack } from 'tamagui'\n\ntype Section = 'spaceNegative' | keyof Tokens\n\nconst sections: { name: string; key: Section }[] = [\n {\n name: `Size`,\n key: `size`,\n },\n {\n name: `Space`,\n key: 'space',\n },\n {\n name: `Space (-)`,\n key: `spaceNegative`,\n },\n {\n name: `Radius`,\n key: `radius`,\n },\n]\n\nexport function TokensDemo() {\n const [section, setSection] = useState<Section>('size')\n\n return (\n <YStack space>\n <XGroup alignItems=\"center\" alignSelf=\"center\">\n {sections.map(({ name, key }) => {\n return (\n <XGroup.Item key={key}>\n <Button\n size=\"$3\"\n theme={section === key ? 'active' : null}\n fontFamily=\"$silkscreen\"\n onPress={() => setSection(key)}\n >\n {name}\n </Button>\n </XGroup.Item>\n )\n })}\n </XGroup>\n\n {(section === 'size' ||\n section === 'spaceNegative' ||\n section === 'space' ||\n section === 'radius') && <SizeSection section={section} />}\n </YStack>\n )\n}\n\nfunction SizeSection({ section }: { section: Section }) {\n const allTokens = getConfig().tokens\n const tokens = allTokens[section.startsWith('space') ? 'space' : section]\n const st = Object.keys(tokens).sort((a, b) => (parseFloat(a) > parseFloat(b) ? 1 : -1))\n const spaceTokens = st.filter((t) => parseFloat(t) >= 0)\n const spaceTokensNegative = st\n .filter((t) => parseFloat(t) < 0)\n .sort((a, b) => (parseFloat(a) > parseFloat(b) ? -1 : 1))\n\n return (\n <YStack flex={1} space>\n <H2>Sizes</H2>\n <YStack width=\"100%\" space=\"$2\" separator={<Separator />}>\n {(section === 'spaceNegative' ? spaceTokensNegative : spaceTokens).map(\n (token) => {\n return (\n <XStack width=\"100%\" alignItems=\"center\" key={token}>\n <YStack width=\"25%\">\n <H3 size=\"$6\">${token}</H3>\n </YStack>\n <YStack width=\"20%\">\n <H4 size=\"$5\">{tokens[token]?.val}px</H4>\n </YStack>\n <Square\n size={tokens[token]?.val}\n backgroundColor=\"$color5\"\n {...(section === 'spaceNegative' && {\n backgroundColor: '$red5',\n size: -tokens[\n spaceTokensNegative.find(\n (t) => parseFloat(t) === -parseFloat(token)\n ) ?? token\n ]?.val,\n })}\n {...(section === 'radius' && {\n // @ts-ignore\n size: allTokens.size[token]?.val,\n borderRadius: tokens[token]?.val,\n })}\n />\n </XStack>\n )\n }\n )}\n </YStack>\n </YStack>\n )\n}\n"],
5
- "mappings": "AAAA,SAAiB,iBAAiB;AAClC,SAAS,gBAAgB;AACzB,SAAS,QAAQ,IAAI,IAAI,IAAI,WAAW,QAAQ,QAAQ,QAAQ,cAAc;AAI9E,MAAM,WAA6C;AAAA,EACjD;AAAA,IACE,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AACF;AAEO,SAAS,aAAa;AAC3B,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,MAAM;AAEtD,SACE,CAAC,OAAO;AAAA,IACN,CAAC,OAAO,WAAW,SAAS,UAAU,UACnC,SAAS,IAAI,CAAC,EAAE,MAAM,IAAI,MAAM;AAC/B,aACE,CAAC,OAAO,KAAK,KAAK,KAChB,CAAC;AAAA,QACC,KAAK;AAAA,QACL,OAAO,YAAY,MAAM,WAAW;AAAA,QACpC,WAAW;AAAA,QACX,SAAS,MAAM,WAAW,GAAG;AAAA,QAE5B,KACH,EAPC,OAQH,EATC,OAAO;AAAA,IAWZ,CAAC,EACH,EAfC;AAAA,MAiBC,YAAY,UACZ,YAAY,mBACZ,YAAY,WACZ,YAAY,aAAa,CAAC,YAAY,SAAS,SAAS;AAAA,EAC5D,EAtBC;AAwBL;AAEA,SAAS,YAAY,EAAE,QAAQ,GAAyB;AACtD,QAAM,YAAY,UAAU,EAAE;AAC9B,QAAM,SAAS,UAAU,QAAQ,WAAW,OAAO,IAAI,UAAU,OAAO;AACxE,QAAM,KAAK,OAAO,KAAK,MAAM,EAAE,KAAK,CAAC,GAAG,MAAO,WAAW,CAAC,IAAI,WAAW,CAAC,IAAI,IAAI,EAAG;AACtF,QAAM,cAAc,GAAG,OAAO,CAAC,MAAM,WAAW,CAAC,KAAK,CAAC;AACvD,QAAM,sBAAsB,GACzB,OAAO,CAAC,MAAM,WAAW,CAAC,IAAI,CAAC,EAC/B,KAAK,CAAC,GAAG,MAAO,WAAW,CAAC,IAAI,WAAW,CAAC,IAAI,KAAK,CAAE;AAE1D,SACE,CAAC,OAAO,MAAM,GAAG;AAAA,IACf,CAAC,GAAG,KAAK,EAAR;AAAA,IACD,CAAC,OAAO,MAAM,OAAO,MAAM,KAAK,WAAW,CAAC,UAAU,MAClD,YAAY,kBAAkB,sBAAsB,aAAa;AAAA,MACjE,CAAC,UAAU;AACT,eACE,CAAC,OAAO,MAAM,OAAO,WAAW,SAAS,KAAK;AAAA,UAC5C,CAAC,OAAO,MAAM,MACZ,CAAC,GAAG,KAAK;AAAA,aAAK;AAAA,aAAE;AAAA,UAAM,EAArB,GACH,EAFC;AAAA,UAGD,CAAC,OAAO,MAAM,MACZ,CAAC,GAAG,KAAK;AAAA,aAAM,OAAO,KAAK,GAAG;AAAA,aAAI;AAAA,UAAE,EAAnC,GACH,EAFC;AAAA,UAGD,CAAC;AAAA,YACC,MAAM,OAAO,KAAK,GAAG;AAAA,YACrB,gBAAgB;AAAA,gBACX,YAAY,mBAAmB;AAAA,cAClC,iBAAiB;AAAA,cACjB,MAAM,CAAC,OACL,oBAAoB;AAAA,gBAClB,CAAC,MAAM,WAAW,CAAC,MAAM,CAAC,WAAW,KAAK;AAAA,cAC5C,KAAK,KACP,GAAG;AAAA,YACL;AAAA,gBACK,YAAY,YAAY;AAAA;AAAA,cAE3B,MAAM,UAAU,KAAK,KAAK,GAAG;AAAA,cAC7B,cAAc,OAAO,KAAK,GAAG;AAAA,YAC/B;AAAA,UACF;AAAA,QACF,EAxBC;AAAA,MA0BL;AAAA,IACF,EACF,EAhCC;AAAA,EAiCH,EAnCC;AAqCL;",
6
- "names": []
5
+ "mappings": "AAAA,OAAiB,aAAAA,MAAiB,gBAClC,OAAS,YAAAC,MAAgB,QACzB,OAAS,UAAAC,EAAQ,MAAAC,EAAI,MAAAC,EAAI,MAAAC,EAAI,aAAAC,EAAW,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,MAAc,UAI9E,MAAMC,EAA6C,CACjD,CACE,KAAM,OACN,IAAK,MACP,EACA,CACE,KAAM,QACN,IAAK,OACP,EACA,CACE,KAAM,YACN,IAAK,eACP,EACA,CACE,KAAM,SACN,IAAK,QACP,CACF,EAEO,SAASC,GAAa,CAC3B,KAAM,CAACC,EAASC,CAAU,EAAIb,EAAkB,MAAM,EAEtD,MACE,CAACS,EAAO,MACN,CAACF,EAAO,WAAW,QAAS,UAAU,UACnCG,EAAS,IAAI,CAAC,CAAE,KAAAI,EAAM,IAAAC,CAAI,IAEvB,CAACR,EAAO,KAAK,KAAKQ,GAChB,CAACd,EACC,KAAK,IACL,OAAOW,IAAYG,EAAM,SAAW,KACpC,WAAW,aACX,SAAS,IAAMF,EAAWE,CAAG,IAE5BD,EACH,EAPCb,EAQH,EATCM,EAAO,KAWX,EACH,EAfCA,IAiBCK,IAAY,QACZA,IAAY,iBACZA,IAAY,SACZA,IAAY,WAAa,CAACI,EAAY,SAASJ,EAAS,GAC5D,EAtBCH,EAwBL,CAEA,SAASO,EAAY,CAAE,QAAAJ,CAAQ,EAAyB,CACtD,MAAMK,EAAYlB,EAAU,EAAE,OACxBmB,EAASD,EAAUL,EAAQ,WAAW,OAAO,EAAI,QAAUA,CAAO,EAClEO,EAAK,OAAO,KAAKD,CAAM,EAAE,KAAK,CAACE,EAAGC,IAAO,WAAWD,CAAC,EAAI,WAAWC,CAAC,EAAI,EAAI,EAAG,EAChFC,EAAcH,EAAG,OAAQI,GAAM,WAAWA,CAAC,GAAK,CAAC,EACjDC,EAAsBL,EACzB,OAAQI,GAAM,WAAWA,CAAC,EAAI,CAAC,EAC/B,KAAK,CAACH,EAAGC,IAAO,WAAWD,CAAC,EAAI,WAAWC,CAAC,EAAI,GAAK,CAAE,EAE1D,MACE,CAACZ,EAAO,MAAM,EAAG,MACf,CAACP,EAAG,KAAK,EAARA,EACD,CAACO,EAAO,MAAM,MAAO,MAAM,IAAK,WAAW,CAACJ,CAAU,MAClDO,IAAY,gBAAkBY,EAAsBF,GAAa,IAChEG,GAEG,CAACjB,EAAO,MAAM,MAAO,WAAW,QAAS,KAAKiB,GAC5C,CAAChB,EAAO,MAAM,MACZ,CAACN,EAAG,KAAK,KAAK,EAAEsB,EAAM,EAArBtB,EACH,EAFCM,EAGD,CAACA,EAAO,MAAM,MACZ,CAACL,EAAG,KAAK,MAAMc,EAAOO,CAAK,GAAG,IAAI,EAAE,EAAnCrB,EACH,EAFCK,EAGD,CAACH,EACC,MAAMY,EAAOO,CAAK,GAAG,IACrB,gBAAgB,aACXb,IAAY,iBAAmB,CAClC,gBAAiB,QACjB,KAAM,CAACM,EACLM,EAAoB,KACjBD,GAAM,WAAWA,CAAC,IAAM,CAAC,WAAWE,CAAK,CAC5C,GAAKA,CACP,GAAG,GACL,MACKb,IAAY,UAAY,CAE3B,KAAMK,EAAU,KAAKQ,CAAK,GAAG,IAC7B,aAAcP,EAAOO,CAAK,GAAG,GAC/B,EACF,EACF,EAxBCjB,EA2BP,EACF,EAhCCC,EAiCH,EAnCCA,EAqCL",
6
+ "names": ["getConfig", "useState", "Button", "H2", "H3", "H4", "Separator", "Square", "XGroup", "XStack", "YStack", "sections", "TokensDemo", "section", "setSection", "name", "key", "SizeSection", "allTokens", "tokens", "st", "a", "b", "spaceTokens", "t", "spaceTokensNegative", "token"]
7
7
  }
@@ -1,78 +1,2 @@
1
- import { getConfig } from "@tamagui/core";
2
- import { useState } from "react";
3
- import { Button, H2, H3, H4, Separator, Square, XGroup, XStack, YStack } from "tamagui";
4
- const sections = [
5
- {
6
- name: `Size`,
7
- key: `size`
8
- },
9
- {
10
- name: `Space`,
11
- key: "space"
12
- },
13
- {
14
- name: `Space (-)`,
15
- key: `spaceNegative`
16
- },
17
- {
18
- name: `Radius`,
19
- key: `radius`
20
- }
21
- ];
22
- function TokensDemo() {
23
- const [section, setSection] = useState("size");
24
- return <YStack space>
25
- <XGroup alignItems="center" alignSelf="center">{sections.map(({ name, key }) => {
26
- return <XGroup.Item key={key}><Button
27
- size="$3"
28
- theme={section === key ? "active" : null}
29
- fontFamily="$silkscreen"
30
- onPress={() => setSection(key)}
31
- >{name}</Button></XGroup.Item>;
32
- })}</XGroup>
33
- {(section === "size" || section === "spaceNegative" || section === "space" || section === "radius") && <SizeSection section={section} />}
34
- </YStack>;
35
- }
36
- function SizeSection({ section }) {
37
- const allTokens = getConfig().tokens;
38
- const tokens = allTokens[section.startsWith("space") ? "space" : section];
39
- const st = Object.keys(tokens).sort((a, b) => parseFloat(a) > parseFloat(b) ? 1 : -1);
40
- const spaceTokens = st.filter((t) => parseFloat(t) >= 0);
41
- const spaceTokensNegative = st.filter((t) => parseFloat(t) < 0).sort((a, b) => parseFloat(a) > parseFloat(b) ? -1 : 1);
42
- return <YStack flex={1} space>
43
- <H2>Sizes</H2>
44
- <YStack width="100%" space="$2" separator={<Separator />}>{(section === "spaceNegative" ? spaceTokensNegative : spaceTokens).map(
45
- (token) => {
46
- return <XStack width="100%" alignItems="center" key={token}>
47
- <YStack width="25%"><H3 size="$6">
48
- {"$"}
49
- {token}
50
- </H3></YStack>
51
- <YStack width="20%"><H4 size="$5">
52
- {tokens[token]?.val}
53
- {"px"}
54
- </H4></YStack>
55
- <Square
56
- size={tokens[token]?.val}
57
- backgroundColor="$color5"
58
- {...section === "spaceNegative" && {
59
- backgroundColor: "$red5",
60
- size: -tokens[spaceTokensNegative.find(
61
- (t) => parseFloat(t) === -parseFloat(token)
62
- ) ?? token]?.val
63
- }}
64
- {...section === "radius" && {
65
- // @ts-ignore
66
- size: allTokens.size[token]?.val,
67
- borderRadius: tokens[token]?.val
68
- }}
69
- />
70
- </XStack>;
71
- }
72
- )}</YStack>
73
- </YStack>;
74
- }
75
- export {
76
- TokensDemo
77
- };
1
+ import{getConfig as h}from"@tamagui/core";import{useState as H}from"react";import{Button as N,H2 as T,H3 as Y,H4 as X,Separator as I,Square as C,XGroup as F,XStack as G,YStack as S}from"tamagui";const B=[{name:"Size",key:"size"},{name:"Space",key:"space"},{name:"Space (-)",key:"spaceNegative"},{name:"Radius",key:"radius"}];function P(){const[a,u]=H("size");return<S space><F alignItems="center"alignSelf="center">{B.map(({name:t,key:s})=><F.Item key={s}><N size="$3"theme={a===s?"active":null}fontFamily="$silkscreen"onPress={()=>u(s)}>{t}</N></F.Item>)}</F>{(a==="size"||a==="spaceNegative"||a==="space"||a==="radius")&&<R section={a}/>}</S>}function R({section:a}){const u=h().tokens,t=u[a.startsWith("space")?"space":a],s=Object.keys(t).sort((e,o)=>parseFloat(e)>parseFloat(o)?1:-1),$=s.filter(e=>parseFloat(e)>=0),m=s.filter(e=>parseFloat(e)<0).sort((e,o)=>parseFloat(e)>parseFloat(o)?-1:1);return<S flex={1}space><T>Sizes</T><S width="100%"space="$2"separator={<I/>}>{(a==="spaceNegative"?m:$).map(e=><G width="100%"alignItems="center"key={e}><S width="25%"><Y size="$6">${e}</Y></S><S width="20%"><X size="$5">{t[e]?.val}px</X></S><C size={t[e]?.val}backgroundColor="$color5"{...a==="spaceNegative"&&{backgroundColor:"$red5",size:-t[m.find(o=>parseFloat(o)===-parseFloat(e))??e]?.val}}{...a==="radius"&&{size:u.size[e]?.val,borderRadius:t[e]?.val}}/></G>)}</S></S>}export{P as TokensDemo};
78
2
  //# sourceMappingURL=TokensDemo.mjs.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/TokensDemo.tsx"],
4
4
  "sourcesContent": ["import { Tokens, getConfig } from '@tamagui/core'\nimport { useState } from 'react'\nimport { Button, H2, H3, H4, Separator, Square, XGroup, XStack, YStack } from 'tamagui'\n\ntype Section = 'spaceNegative' | keyof Tokens\n\nconst sections: { name: string; key: Section }[] = [\n {\n name: `Size`,\n key: `size`,\n },\n {\n name: `Space`,\n key: 'space',\n },\n {\n name: `Space (-)`,\n key: `spaceNegative`,\n },\n {\n name: `Radius`,\n key: `radius`,\n },\n]\n\nexport function TokensDemo() {\n const [section, setSection] = useState<Section>('size')\n\n return (\n <YStack space>\n <XGroup alignItems=\"center\" alignSelf=\"center\">\n {sections.map(({ name, key }) => {\n return (\n <XGroup.Item key={key}>\n <Button\n size=\"$3\"\n theme={section === key ? 'active' : null}\n fontFamily=\"$silkscreen\"\n onPress={() => setSection(key)}\n >\n {name}\n </Button>\n </XGroup.Item>\n )\n })}\n </XGroup>\n\n {(section === 'size' ||\n section === 'spaceNegative' ||\n section === 'space' ||\n section === 'radius') && <SizeSection section={section} />}\n </YStack>\n )\n}\n\nfunction SizeSection({ section }: { section: Section }) {\n const allTokens = getConfig().tokens\n const tokens = allTokens[section.startsWith('space') ? 'space' : section]\n const st = Object.keys(tokens).sort((a, b) => (parseFloat(a) > parseFloat(b) ? 1 : -1))\n const spaceTokens = st.filter((t) => parseFloat(t) >= 0)\n const spaceTokensNegative = st\n .filter((t) => parseFloat(t) < 0)\n .sort((a, b) => (parseFloat(a) > parseFloat(b) ? -1 : 1))\n\n return (\n <YStack flex={1} space>\n <H2>Sizes</H2>\n <YStack width=\"100%\" space=\"$2\" separator={<Separator />}>\n {(section === 'spaceNegative' ? spaceTokensNegative : spaceTokens).map(\n (token) => {\n return (\n <XStack width=\"100%\" alignItems=\"center\" key={token}>\n <YStack width=\"25%\">\n <H3 size=\"$6\">${token}</H3>\n </YStack>\n <YStack width=\"20%\">\n <H4 size=\"$5\">{tokens[token]?.val}px</H4>\n </YStack>\n <Square\n size={tokens[token]?.val}\n backgroundColor=\"$color5\"\n {...(section === 'spaceNegative' && {\n backgroundColor: '$red5',\n size: -tokens[\n spaceTokensNegative.find(\n (t) => parseFloat(t) === -parseFloat(token)\n ) ?? token\n ]?.val,\n })}\n {...(section === 'radius' && {\n // @ts-ignore\n size: allTokens.size[token]?.val,\n borderRadius: tokens[token]?.val,\n })}\n />\n </XStack>\n )\n }\n )}\n </YStack>\n </YStack>\n )\n}\n"],
5
- "mappings": "AAAA,SAAiB,iBAAiB;AAClC,SAAS,gBAAgB;AACzB,SAAS,QAAQ,IAAI,IAAI,IAAI,WAAW,QAAQ,QAAQ,QAAQ,cAAc;AAI9E,MAAM,WAA6C;AAAA,EACjD;AAAA,IACE,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AAAA,EACA;AAAA,IACE,MAAM;AAAA,IACN,KAAK;AAAA,EACP;AACF;AAEO,SAAS,aAAa;AAC3B,QAAM,CAAC,SAAS,UAAU,IAAI,SAAkB,MAAM;AAEtD,SACE,CAAC,OAAO;AAAA,IACN,CAAC,OAAO,WAAW,SAAS,UAAU,UACnC,SAAS,IAAI,CAAC,EAAE,MAAM,IAAI,MAAM;AAC/B,aACE,CAAC,OAAO,KAAK,KAAK,KAChB,CAAC;AAAA,QACC,KAAK;AAAA,QACL,OAAO,YAAY,MAAM,WAAW;AAAA,QACpC,WAAW;AAAA,QACX,SAAS,MAAM,WAAW,GAAG;AAAA,QAE5B,KACH,EAPC,OAQH,EATC,OAAO;AAAA,IAWZ,CAAC,EACH,EAfC;AAAA,MAiBC,YAAY,UACZ,YAAY,mBACZ,YAAY,WACZ,YAAY,aAAa,CAAC,YAAY,SAAS,SAAS;AAAA,EAC5D,EAtBC;AAwBL;AAEA,SAAS,YAAY,EAAE,QAAQ,GAAyB;AACtD,QAAM,YAAY,UAAU,EAAE;AAC9B,QAAM,SAAS,UAAU,QAAQ,WAAW,OAAO,IAAI,UAAU,OAAO;AACxE,QAAM,KAAK,OAAO,KAAK,MAAM,EAAE,KAAK,CAAC,GAAG,MAAO,WAAW,CAAC,IAAI,WAAW,CAAC,IAAI,IAAI,EAAG;AACtF,QAAM,cAAc,GAAG,OAAO,CAAC,MAAM,WAAW,CAAC,KAAK,CAAC;AACvD,QAAM,sBAAsB,GACzB,OAAO,CAAC,MAAM,WAAW,CAAC,IAAI,CAAC,EAC/B,KAAK,CAAC,GAAG,MAAO,WAAW,CAAC,IAAI,WAAW,CAAC,IAAI,KAAK,CAAE;AAE1D,SACE,CAAC,OAAO,MAAM,GAAG;AAAA,IACf,CAAC,GAAG,KAAK,EAAR;AAAA,IACD,CAAC,OAAO,MAAM,OAAO,MAAM,KAAK,WAAW,CAAC,UAAU,MAClD,YAAY,kBAAkB,sBAAsB,aAAa;AAAA,MACjE,CAAC,UAAU;AACT,eACE,CAAC,OAAO,MAAM,OAAO,WAAW,SAAS,KAAK;AAAA,UAC5C,CAAC,OAAO,MAAM,MACZ,CAAC,GAAG,KAAK;AAAA,aAAK;AAAA,aAAE;AAAA,UAAM,EAArB,GACH,EAFC;AAAA,UAGD,CAAC,OAAO,MAAM,MACZ,CAAC,GAAG,KAAK;AAAA,aAAM,OAAO,KAAK,GAAG;AAAA,aAAI;AAAA,UAAE,EAAnC,GACH,EAFC;AAAA,UAGD,CAAC;AAAA,YACC,MAAM,OAAO,KAAK,GAAG;AAAA,YACrB,gBAAgB;AAAA,gBACX,YAAY,mBAAmB;AAAA,cAClC,iBAAiB;AAAA,cACjB,MAAM,CAAC,OACL,oBAAoB;AAAA,gBAClB,CAAC,MAAM,WAAW,CAAC,MAAM,CAAC,WAAW,KAAK;AAAA,cAC5C,KAAK,KACP,GAAG;AAAA,YACL;AAAA,gBACK,YAAY,YAAY;AAAA;AAAA,cAE3B,MAAM,UAAU,KAAK,KAAK,GAAG;AAAA,cAC7B,cAAc,OAAO,KAAK,GAAG;AAAA,YAC/B;AAAA,UACF;AAAA,QACF,EAxBC;AAAA,MA0BL;AAAA,IACF,EACF,EAhCC;AAAA,EAiCH,EAnCC;AAqCL;",
6
- "names": []
5
+ "mappings": "AAAA,OAAiB,aAAAA,MAAiB,gBAClC,OAAS,YAAAC,MAAgB,QACzB,OAAS,UAAAC,EAAQ,MAAAC,EAAI,MAAAC,EAAI,MAAAC,EAAI,aAAAC,EAAW,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,MAAc,UAI9E,MAAMC,EAA6C,CACjD,CACE,KAAM,OACN,IAAK,MACP,EACA,CACE,KAAM,QACN,IAAK,OACP,EACA,CACE,KAAM,YACN,IAAK,eACP,EACA,CACE,KAAM,SACN,IAAK,QACP,CACF,EAEO,SAASC,GAAa,CAC3B,KAAM,CAACC,EAASC,CAAU,EAAIb,EAAkB,MAAM,EAEtD,MACE,CAACS,EAAO,MACN,CAACF,EAAO,WAAW,QAAS,UAAU,UACnCG,EAAS,IAAI,CAAC,CAAE,KAAAI,EAAM,IAAAC,CAAI,IAEvB,CAACR,EAAO,KAAK,KAAKQ,GAChB,CAACd,EACC,KAAK,IACL,OAAOW,IAAYG,EAAM,SAAW,KACpC,WAAW,aACX,SAAS,IAAMF,EAAWE,CAAG,IAE5BD,EACH,EAPCb,EAQH,EATCM,EAAO,KAWX,EACH,EAfCA,IAiBCK,IAAY,QACZA,IAAY,iBACZA,IAAY,SACZA,IAAY,WAAa,CAACI,EAAY,SAASJ,EAAS,GAC5D,EAtBCH,EAwBL,CAEA,SAASO,EAAY,CAAE,QAAAJ,CAAQ,EAAyB,CACtD,MAAMK,EAAYlB,EAAU,EAAE,OACxBmB,EAASD,EAAUL,EAAQ,WAAW,OAAO,EAAI,QAAUA,CAAO,EAClEO,EAAK,OAAO,KAAKD,CAAM,EAAE,KAAK,CAACE,EAAGC,IAAO,WAAWD,CAAC,EAAI,WAAWC,CAAC,EAAI,EAAI,EAAG,EAChFC,EAAcH,EAAG,OAAQI,GAAM,WAAWA,CAAC,GAAK,CAAC,EACjDC,EAAsBL,EACzB,OAAQI,GAAM,WAAWA,CAAC,EAAI,CAAC,EAC/B,KAAK,CAACH,EAAGC,IAAO,WAAWD,CAAC,EAAI,WAAWC,CAAC,EAAI,GAAK,CAAE,EAE1D,MACE,CAACZ,EAAO,MAAM,EAAG,MACf,CAACP,EAAG,KAAK,EAARA,EACD,CAACO,EAAO,MAAM,MAAO,MAAM,IAAK,WAAW,CAACJ,CAAU,MAClDO,IAAY,gBAAkBY,EAAsBF,GAAa,IAChEG,GAEG,CAACjB,EAAO,MAAM,MAAO,WAAW,QAAS,KAAKiB,GAC5C,CAAChB,EAAO,MAAM,MACZ,CAACN,EAAG,KAAK,KAAK,EAAEsB,EAAM,EAArBtB,EACH,EAFCM,EAGD,CAACA,EAAO,MAAM,MACZ,CAACL,EAAG,KAAK,MAAMc,EAAOO,CAAK,GAAG,IAAI,EAAE,EAAnCrB,EACH,EAFCK,EAGD,CAACH,EACC,MAAMY,EAAOO,CAAK,GAAG,IACrB,gBAAgB,aACXb,IAAY,iBAAmB,CAClC,gBAAiB,QACjB,KAAM,CAACM,EACLM,EAAoB,KACjBD,GAAM,WAAWA,CAAC,IAAM,CAAC,WAAWE,CAAK,CAC5C,GAAKA,CACP,GAAG,GACL,MACKb,IAAY,UAAY,CAE3B,KAAMK,EAAU,KAAKQ,CAAK,GAAG,IAC7B,aAAcP,EAAOO,CAAK,GAAG,GAC/B,EACF,EACF,EAxBCjB,EA2BP,EACF,EAhCCC,EAiCH,EAnCCA,EAqCL",
6
+ "names": ["getConfig", "useState", "Button", "H2", "H3", "H4", "Separator", "Square", "XGroup", "XStack", "YStack", "sections", "TokensDemo", "section", "setSection", "name", "key", "SizeSection", "allTokens", "tokens", "st", "a", "b", "spaceTokens", "t", "spaceTokensNegative", "token"]
7
7
  }
@@ -1,64 +1,2 @@
1
- import {
2
- ChevronDown,
3
- ChevronLeft,
4
- ChevronRight,
5
- ChevronUp,
6
- Circle
7
- } from "@tamagui/lucide-icons";
8
- import {
9
- Button,
10
- Paragraph,
11
- Theme,
12
- Tooltip,
13
- TooltipGroup,
14
- XStack,
15
- YStack
16
- } from "tamagui";
17
- function TooltipDemo() {
18
- return <TooltipGroup delay={{ open: 3e3, close: 100 }}><YStack space="$2" alignSelf="center">
19
- <XStack space="$2">
20
- <Demo groupId="0" placement="top-end" Icon={Circle} />
21
- <Demo groupId="1" placement="top" Icon={ChevronUp} />
22
- <Demo groupId="2" placement="top-start" Icon={Circle} />
23
- </XStack>
24
- <XStack space="$2">
25
- <Demo groupId="3" placement="left" Icon={ChevronLeft} />
26
- <YStack flex={1} />
27
- <Demo groupId="4" placement="right" Icon={ChevronRight} />
28
- </XStack>
29
- <XStack space="$2">
30
- <Demo groupId="5" placement="bottom-end" Icon={Circle} />
31
- <Demo groupId="6" placement="bottom" Icon={ChevronDown} />
32
- <Demo groupId="7" placement="bottom-start" Icon={Circle} />
33
- </XStack>
34
- </YStack></TooltipGroup>;
35
- }
36
- function Demo({ Icon, ...props }) {
37
- return <Tooltip {...props}>
38
- <Tooltip.Trigger><Button icon={Icon} circular /></Tooltip.Trigger>
39
- <Theme inverse><Tooltip.Content
40
- enterStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}
41
- exitStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}
42
- scale={1}
43
- x={0}
44
- y={0}
45
- opacity={1}
46
- animation={[
47
- "quick",
48
- {
49
- opacity: {
50
- overshootClamping: true
51
- }
52
- }
53
- ]}
54
- >
55
- <Tooltip.Arrow />
56
- <Paragraph size="$2" lineHeight="$1">Hello world</Paragraph>
57
- </Tooltip.Content></Theme>
58
- </Tooltip>;
59
- }
60
- export {
61
- Demo,
62
- TooltipDemo
63
- };
1
+ import{ChevronDown as v,ChevronLeft as $,ChevronRight as P,ChevronUp as X,Circle as s}from"@tamagui/lucide-icons";import{Button as D,Paragraph as G,Theme as H,Tooltip as T,TooltipGroup as R,XStack as S,YStack as C}from"tamagui";function L(){return<R delay={{open:3e3,close:100}}><C space="$2"alignSelf="center"><S space="$2"><I groupId="0"placement="top-end"Icon={s}/><I groupId="1"placement="top"Icon={X}/><I groupId="2"placement="top-start"Icon={s}/></S><S space="$2"><I groupId="3"placement="left"Icon={$}/><C flex={1}/><I groupId="4"placement="right"Icon={P}/></S><S space="$2"><I groupId="5"placement="bottom-end"Icon={s}/><I groupId="6"placement="bottom"Icon={v}/><I groupId="7"placement="bottom-start"Icon={s}/></S></C></R>}function I({Icon:k,...x}){return<T{...x}><T.Trigger><D icon={k}circular/></T.Trigger><H inverse><T.Content enterStyle={{x:0,y:-5,opacity:0,scale:.9}}exitStyle={{x:0,y:-5,opacity:0,scale:.9}}scale={1}x={0}y={0}opacity={1}animation={["quick",{opacity:{overshootClamping:!0}}]}><T.Arrow/><G size="$2"lineHeight="$1">Hello world</G></T.Content></H></T>}export{I as Demo,L as TooltipDemo};
64
2
  //# sourceMappingURL=TooltipDemo.js.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/TooltipDemo.tsx"],
4
4
  "sourcesContent": ["import {\n ChevronDown,\n ChevronLeft,\n ChevronRight,\n ChevronUp,\n Circle,\n} from '@tamagui/lucide-icons'\nimport React from 'react'\nimport {\n Button,\n Paragraph,\n Theme,\n Tooltip,\n TooltipGroup,\n TooltipProps,\n XStack,\n YStack,\n} from 'tamagui'\n\nexport function TooltipDemo() {\n return (\n <TooltipGroup delay={{ open: 3000, close: 100 }}>\n <YStack space=\"$2\" alignSelf=\"center\">\n <XStack space=\"$2\">\n <Demo groupId=\"0\" placement=\"top-end\" Icon={Circle} />\n <Demo groupId=\"1\" placement=\"top\" Icon={ChevronUp} />\n <Demo groupId=\"2\" placement=\"top-start\" Icon={Circle} />\n </XStack>\n <XStack space=\"$2\">\n <Demo groupId=\"3\" placement=\"left\" Icon={ChevronLeft} />\n <YStack flex={1} />\n <Demo groupId=\"4\" placement=\"right\" Icon={ChevronRight} />\n </XStack>\n <XStack space=\"$2\">\n <Demo groupId=\"5\" placement=\"bottom-end\" Icon={Circle} />\n <Demo groupId=\"6\" placement=\"bottom\" Icon={ChevronDown} />\n <Demo groupId=\"7\" placement=\"bottom-start\" Icon={Circle} />\n </XStack>\n </YStack>\n </TooltipGroup>\n )\n}\n\nexport function Demo({ Icon, ...props }: TooltipProps & { Icon?: any }) {\n return (\n <Tooltip {...props}>\n <Tooltip.Trigger>\n <Button icon={Icon} circular />\n </Tooltip.Trigger>\n <Theme inverse>\n <Tooltip.Content\n enterStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}\n exitStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}\n scale={1}\n x={0}\n y={0}\n opacity={1}\n animation={[\n 'quick',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n >\n <Tooltip.Arrow />\n <Paragraph size=\"$2\" lineHeight=\"$1\">\n Hello world\n </Paragraph>\n </Tooltip.Content>\n </Theme>\n </Tooltip>\n )\n}\n"],
5
- "mappings": "AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,OACK;AAEA,SAAS,cAAc;AAC5B,SACE,CAAC,aAAa,OAAO,EAAE,MAAM,KAAM,OAAO,IAAI,GAC5C,CAAC,OAAO,MAAM,KAAK,UAAU;AAAA,IAC3B,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,KAAK,QAAQ,IAAI,UAAU,UAAU,MAAM,QAAQ;AAAA,MACpD,CAAC,KAAK,QAAQ,IAAI,UAAU,MAAM,MAAM,WAAW;AAAA,MACnD,CAAC,KAAK,QAAQ,IAAI,UAAU,YAAY,MAAM,QAAQ;AAAA,IACxD,EAJC;AAAA,IAKD,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,KAAK,QAAQ,IAAI,UAAU,OAAO,MAAM,aAAa;AAAA,MACtD,CAAC,OAAO,MAAM,GAAG;AAAA,MACjB,CAAC,KAAK,QAAQ,IAAI,UAAU,QAAQ,MAAM,cAAc;AAAA,IAC1D,EAJC;AAAA,IAKD,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,KAAK,QAAQ,IAAI,UAAU,aAAa,MAAM,QAAQ;AAAA,MACvD,CAAC,KAAK,QAAQ,IAAI,UAAU,SAAS,MAAM,aAAa;AAAA,MACxD,CAAC,KAAK,QAAQ,IAAI,UAAU,eAAe,MAAM,QAAQ;AAAA,IAC3D,EAJC;AAAA,EAKH,EAhBC,OAiBH,EAlBC;AAoBL;AAEO,SAAS,KAAK,EAAE,MAAM,GAAG,MAAM,GAAkC;AACtE,SACE,CAAC,YAAY;AAAA,IACX,CAAC,QAAQ,QACP,CAAC,OAAO,MAAM,MAAM,SAAS,EAC/B,EAFC,QAAQ;AAAA,IAGT,CAAC,MAAM,QACL,CAAC,QAAQ;AAAA,MACP,YAAY,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,IAAI;AAAA,MAClD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,IAAI;AAAA,MACjD,OAAO;AAAA,MACP,GAAG;AAAA,MACH,GAAG;AAAA,MACH,SAAS;AAAA,MACT,WAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,SAAS;AAAA,YACP,mBAAmB;AAAA,UACrB;AAAA,QACF;AAAA,MACF;AAAA;AAAA,MAEA,CAAC,QAAQ,MAAM;AAAA,MACf,CAAC,UAAU,KAAK,KAAK,WAAW,KAAK,WAErC,EAFC;AAAA,IAGH,EApBC,QAAQ,QAqBX,EAtBC;AAAA,EAuBH,EA3BC;AA6BL;",
6
- "names": []
5
+ "mappings": "AAAA,OACE,eAAAA,EACA,eAAAC,EACA,gBAAAC,EACA,aAAAC,EACA,UAAAC,MACK,wBAEP,OACE,UAAAC,EACA,aAAAC,EACA,SAAAC,EACA,WAAAC,EACA,gBAAAC,EAEA,UAAAC,EACA,UAAAC,MACK,UAEA,SAASC,GAAc,CAC5B,MACE,CAACH,EAAa,OAAO,CAAE,KAAM,IAAM,MAAO,GAAI,GAC5C,CAACE,EAAO,MAAM,IAAK,UAAU,SAC3B,CAACD,EAAO,MAAM,KACZ,CAACG,EAAK,QAAQ,GAAI,UAAU,SAAU,MAAMT,EAAQ,EACpD,CAACS,EAAK,QAAQ,GAAI,UAAU,KAAM,MAAMV,EAAW,EACnD,CAACU,EAAK,QAAQ,GAAI,UAAU,WAAY,MAAMT,EAAQ,EACxD,EAJCM,EAKD,CAACA,EAAO,MAAM,KACZ,CAACG,EAAK,QAAQ,GAAI,UAAU,MAAO,MAAMZ,EAAa,EACtD,CAACU,EAAO,MAAM,EAAG,EACjB,CAACE,EAAK,QAAQ,GAAI,UAAU,OAAQ,MAAMX,EAAc,EAC1D,EAJCQ,EAKD,CAACA,EAAO,MAAM,KACZ,CAACG,EAAK,QAAQ,GAAI,UAAU,YAAa,MAAMT,EAAQ,EACvD,CAACS,EAAK,QAAQ,GAAI,UAAU,QAAS,MAAMb,EAAa,EACxD,CAACa,EAAK,QAAQ,GAAI,UAAU,cAAe,MAAMT,EAAQ,EAC3D,EAJCM,EAKH,EAhBCC,EAiBH,EAlBCF,EAoBL,CAEO,SAASI,EAAK,CAAE,KAAAC,EAAM,GAAGC,CAAM,EAAkC,CACtE,MACE,CAACP,KAAYO,GACX,CAACP,EAAQ,QACP,CAACH,EAAO,MAAMS,EAAM,QAAS,EAC/B,EAFCN,EAAQ,QAGT,CAACD,EAAM,QACL,CAACC,EAAQ,QACP,YAAY,CAAE,EAAG,EAAG,EAAG,GAAI,QAAS,EAAG,MAAO,EAAI,EAClD,WAAW,CAAE,EAAG,EAAG,EAAG,GAAI,QAAS,EAAG,MAAO,EAAI,EACjD,OAAO,EACP,GAAG,EACH,GAAG,EACH,SAAS,EACT,WAAW,CACT,QACA,CACE,QAAS,CACP,kBAAmB,EACrB,CACF,CACF,GAEA,CAACA,EAAQ,KAAM,EACf,CAACF,EAAU,KAAK,IAAK,WAAW,KAAK,WAErC,EAFCA,EAGH,EApBCE,EAAQ,QAqBX,EAtBCD,EAuBH,EA3BCC,EA6BL",
6
+ "names": ["ChevronDown", "ChevronLeft", "ChevronRight", "ChevronUp", "Circle", "Button", "Paragraph", "Theme", "Tooltip", "TooltipGroup", "XStack", "YStack", "TooltipDemo", "Demo", "Icon", "props"]
7
7
  }
@@ -1,64 +1,2 @@
1
- import {
2
- ChevronDown,
3
- ChevronLeft,
4
- ChevronRight,
5
- ChevronUp,
6
- Circle
7
- } from "@tamagui/lucide-icons";
8
- import {
9
- Button,
10
- Paragraph,
11
- Theme,
12
- Tooltip,
13
- TooltipGroup,
14
- XStack,
15
- YStack
16
- } from "tamagui";
17
- function TooltipDemo() {
18
- return <TooltipGroup delay={{ open: 3e3, close: 100 }}><YStack space="$2" alignSelf="center">
19
- <XStack space="$2">
20
- <Demo groupId="0" placement="top-end" Icon={Circle} />
21
- <Demo groupId="1" placement="top" Icon={ChevronUp} />
22
- <Demo groupId="2" placement="top-start" Icon={Circle} />
23
- </XStack>
24
- <XStack space="$2">
25
- <Demo groupId="3" placement="left" Icon={ChevronLeft} />
26
- <YStack flex={1} />
27
- <Demo groupId="4" placement="right" Icon={ChevronRight} />
28
- </XStack>
29
- <XStack space="$2">
30
- <Demo groupId="5" placement="bottom-end" Icon={Circle} />
31
- <Demo groupId="6" placement="bottom" Icon={ChevronDown} />
32
- <Demo groupId="7" placement="bottom-start" Icon={Circle} />
33
- </XStack>
34
- </YStack></TooltipGroup>;
35
- }
36
- function Demo({ Icon, ...props }) {
37
- return <Tooltip {...props}>
38
- <Tooltip.Trigger><Button icon={Icon} circular /></Tooltip.Trigger>
39
- <Theme inverse><Tooltip.Content
40
- enterStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}
41
- exitStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}
42
- scale={1}
43
- x={0}
44
- y={0}
45
- opacity={1}
46
- animation={[
47
- "quick",
48
- {
49
- opacity: {
50
- overshootClamping: true
51
- }
52
- }
53
- ]}
54
- >
55
- <Tooltip.Arrow />
56
- <Paragraph size="$2" lineHeight="$1">Hello world</Paragraph>
57
- </Tooltip.Content></Theme>
58
- </Tooltip>;
59
- }
60
- export {
61
- Demo,
62
- TooltipDemo
63
- };
1
+ import{ChevronDown as v,ChevronLeft as $,ChevronRight as P,ChevronUp as X,Circle as s}from"@tamagui/lucide-icons";import{Button as D,Paragraph as G,Theme as H,Tooltip as T,TooltipGroup as R,XStack as S,YStack as C}from"tamagui";function L(){return<R delay={{open:3e3,close:100}}><C space="$2"alignSelf="center"><S space="$2"><I groupId="0"placement="top-end"Icon={s}/><I groupId="1"placement="top"Icon={X}/><I groupId="2"placement="top-start"Icon={s}/></S><S space="$2"><I groupId="3"placement="left"Icon={$}/><C flex={1}/><I groupId="4"placement="right"Icon={P}/></S><S space="$2"><I groupId="5"placement="bottom-end"Icon={s}/><I groupId="6"placement="bottom"Icon={v}/><I groupId="7"placement="bottom-start"Icon={s}/></S></C></R>}function I({Icon:k,...x}){return<T{...x}><T.Trigger><D icon={k}circular/></T.Trigger><H inverse><T.Content enterStyle={{x:0,y:-5,opacity:0,scale:.9}}exitStyle={{x:0,y:-5,opacity:0,scale:.9}}scale={1}x={0}y={0}opacity={1}animation={["quick",{opacity:{overshootClamping:!0}}]}><T.Arrow/><G size="$2"lineHeight="$1">Hello world</G></T.Content></H></T>}export{I as Demo,L as TooltipDemo};
64
2
  //# sourceMappingURL=TooltipDemo.mjs.map
@@ -2,6 +2,6 @@
2
2
  "version": 3,
3
3
  "sources": ["../../src/TooltipDemo.tsx"],
4
4
  "sourcesContent": ["import {\n ChevronDown,\n ChevronLeft,\n ChevronRight,\n ChevronUp,\n Circle,\n} from '@tamagui/lucide-icons'\nimport React from 'react'\nimport {\n Button,\n Paragraph,\n Theme,\n Tooltip,\n TooltipGroup,\n TooltipProps,\n XStack,\n YStack,\n} from 'tamagui'\n\nexport function TooltipDemo() {\n return (\n <TooltipGroup delay={{ open: 3000, close: 100 }}>\n <YStack space=\"$2\" alignSelf=\"center\">\n <XStack space=\"$2\">\n <Demo groupId=\"0\" placement=\"top-end\" Icon={Circle} />\n <Demo groupId=\"1\" placement=\"top\" Icon={ChevronUp} />\n <Demo groupId=\"2\" placement=\"top-start\" Icon={Circle} />\n </XStack>\n <XStack space=\"$2\">\n <Demo groupId=\"3\" placement=\"left\" Icon={ChevronLeft} />\n <YStack flex={1} />\n <Demo groupId=\"4\" placement=\"right\" Icon={ChevronRight} />\n </XStack>\n <XStack space=\"$2\">\n <Demo groupId=\"5\" placement=\"bottom-end\" Icon={Circle} />\n <Demo groupId=\"6\" placement=\"bottom\" Icon={ChevronDown} />\n <Demo groupId=\"7\" placement=\"bottom-start\" Icon={Circle} />\n </XStack>\n </YStack>\n </TooltipGroup>\n )\n}\n\nexport function Demo({ Icon, ...props }: TooltipProps & { Icon?: any }) {\n return (\n <Tooltip {...props}>\n <Tooltip.Trigger>\n <Button icon={Icon} circular />\n </Tooltip.Trigger>\n <Theme inverse>\n <Tooltip.Content\n enterStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}\n exitStyle={{ x: 0, y: -5, opacity: 0, scale: 0.9 }}\n scale={1}\n x={0}\n y={0}\n opacity={1}\n animation={[\n 'quick',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n >\n <Tooltip.Arrow />\n <Paragraph size=\"$2\" lineHeight=\"$1\">\n Hello world\n </Paragraph>\n </Tooltip.Content>\n </Theme>\n </Tooltip>\n )\n}\n"],
5
- "mappings": "AAAA;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,OACK;AAEA,SAAS,cAAc;AAC5B,SACE,CAAC,aAAa,OAAO,EAAE,MAAM,KAAM,OAAO,IAAI,GAC5C,CAAC,OAAO,MAAM,KAAK,UAAU;AAAA,IAC3B,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,KAAK,QAAQ,IAAI,UAAU,UAAU,MAAM,QAAQ;AAAA,MACpD,CAAC,KAAK,QAAQ,IAAI,UAAU,MAAM,MAAM,WAAW;AAAA,MACnD,CAAC,KAAK,QAAQ,IAAI,UAAU,YAAY,MAAM,QAAQ;AAAA,IACxD,EAJC;AAAA,IAKD,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,KAAK,QAAQ,IAAI,UAAU,OAAO,MAAM,aAAa;AAAA,MACtD,CAAC,OAAO,MAAM,GAAG;AAAA,MACjB,CAAC,KAAK,QAAQ,IAAI,UAAU,QAAQ,MAAM,cAAc;AAAA,IAC1D,EAJC;AAAA,IAKD,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,KAAK,QAAQ,IAAI,UAAU,aAAa,MAAM,QAAQ;AAAA,MACvD,CAAC,KAAK,QAAQ,IAAI,UAAU,SAAS,MAAM,aAAa;AAAA,MACxD,CAAC,KAAK,QAAQ,IAAI,UAAU,eAAe,MAAM,QAAQ;AAAA,IAC3D,EAJC;AAAA,EAKH,EAhBC,OAiBH,EAlBC;AAoBL;AAEO,SAAS,KAAK,EAAE,MAAM,GAAG,MAAM,GAAkC;AACtE,SACE,CAAC,YAAY;AAAA,IACX,CAAC,QAAQ,QACP,CAAC,OAAO,MAAM,MAAM,SAAS,EAC/B,EAFC,QAAQ;AAAA,IAGT,CAAC,MAAM,QACL,CAAC,QAAQ;AAAA,MACP,YAAY,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,IAAI;AAAA,MAClD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,IAAI;AAAA,MACjD,OAAO;AAAA,MACP,GAAG;AAAA,MACH,GAAG;AAAA,MACH,SAAS;AAAA,MACT,WAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,SAAS;AAAA,YACP,mBAAmB;AAAA,UACrB;AAAA,QACF;AAAA,MACF;AAAA;AAAA,MAEA,CAAC,QAAQ,MAAM;AAAA,MACf,CAAC,UAAU,KAAK,KAAK,WAAW,KAAK,WAErC,EAFC;AAAA,IAGH,EApBC,QAAQ,QAqBX,EAtBC;AAAA,EAuBH,EA3BC;AA6BL;",
6
- "names": []
5
+ "mappings": "AAAA,OACE,eAAAA,EACA,eAAAC,EACA,gBAAAC,EACA,aAAAC,EACA,UAAAC,MACK,wBAEP,OACE,UAAAC,EACA,aAAAC,EACA,SAAAC,EACA,WAAAC,EACA,gBAAAC,EAEA,UAAAC,EACA,UAAAC,MACK,UAEA,SAASC,GAAc,CAC5B,MACE,CAACH,EAAa,OAAO,CAAE,KAAM,IAAM,MAAO,GAAI,GAC5C,CAACE,EAAO,MAAM,IAAK,UAAU,SAC3B,CAACD,EAAO,MAAM,KACZ,CAACG,EAAK,QAAQ,GAAI,UAAU,SAAU,MAAMT,EAAQ,EACpD,CAACS,EAAK,QAAQ,GAAI,UAAU,KAAM,MAAMV,EAAW,EACnD,CAACU,EAAK,QAAQ,GAAI,UAAU,WAAY,MAAMT,EAAQ,EACxD,EAJCM,EAKD,CAACA,EAAO,MAAM,KACZ,CAACG,EAAK,QAAQ,GAAI,UAAU,MAAO,MAAMZ,EAAa,EACtD,CAACU,EAAO,MAAM,EAAG,EACjB,CAACE,EAAK,QAAQ,GAAI,UAAU,OAAQ,MAAMX,EAAc,EAC1D,EAJCQ,EAKD,CAACA,EAAO,MAAM,KACZ,CAACG,EAAK,QAAQ,GAAI,UAAU,YAAa,MAAMT,EAAQ,EACvD,CAACS,EAAK,QAAQ,GAAI,UAAU,QAAS,MAAMb,EAAa,EACxD,CAACa,EAAK,QAAQ,GAAI,UAAU,cAAe,MAAMT,EAAQ,EAC3D,EAJCM,EAKH,EAhBCC,EAiBH,EAlBCF,EAoBL,CAEO,SAASI,EAAK,CAAE,KAAAC,EAAM,GAAGC,CAAM,EAAkC,CACtE,MACE,CAACP,KAAYO,GACX,CAACP,EAAQ,QACP,CAACH,EAAO,MAAMS,EAAM,QAAS,EAC/B,EAFCN,EAAQ,QAGT,CAACD,EAAM,QACL,CAACC,EAAQ,QACP,YAAY,CAAE,EAAG,EAAG,EAAG,GAAI,QAAS,EAAG,MAAO,EAAI,EAClD,WAAW,CAAE,EAAG,EAAG,EAAG,GAAI,QAAS,EAAG,MAAO,EAAI,EACjD,OAAO,EACP,GAAG,EACH,GAAG,EACH,SAAS,EACT,WAAW,CACT,QACA,CACE,QAAS,CACP,kBAAmB,EACrB,CACF,CACF,GAEA,CAACA,EAAQ,KAAM,EACf,CAACF,EAAU,KAAK,IAAK,WAAW,KAAK,WAErC,EAFCA,EAGH,EApBCE,EAAQ,QAqBX,EAtBCD,EAuBH,EA3BCC,EA6BL",
6
+ "names": ["ChevronDown", "ChevronLeft", "ChevronRight", "ChevronUp", "Circle", "Button", "Paragraph", "Theme", "Tooltip", "TooltipGroup", "XStack", "YStack", "TooltipDemo", "Demo", "Icon", "props"]
7
7
  }