@tamagui/demos 1.114.4 → 1.115.0

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 (180) hide show
  1. package/dist/cjs/AccordionDemo.cjs +96 -0
  2. package/dist/cjs/AddThemeDemo.cjs +70 -0
  3. package/dist/cjs/AlertDialogDemo.cjs +96 -0
  4. package/dist/cjs/AnimationsDemo.cjs +100 -0
  5. package/dist/cjs/AnimationsEnterDemo.cjs +74 -0
  6. package/dist/cjs/AnimationsHoverDemo.cjs +47 -0
  7. package/dist/cjs/AnimationsPresenceDemo.cjs +124 -0
  8. package/dist/cjs/AnimationsTimingDemo.cjs +46 -0
  9. package/dist/cjs/AvatarDemo.cjs +53 -0
  10. package/dist/cjs/BuildAButtonDemo.cjs +125 -0
  11. package/dist/cjs/ButtonDemo.cjs +83 -0
  12. package/dist/cjs/{CardDemo.js → CardDemo.cjs} +67 -41
  13. package/dist/cjs/CheckboxDemo.cjs +70 -0
  14. package/dist/cjs/CheckboxHeadlessDemo.cjs +87 -0
  15. package/dist/cjs/CheckboxUnstyledDemo.cjs +78 -0
  16. package/dist/cjs/ColorsDemo.cjs +121 -0
  17. package/dist/cjs/DialogDemo.cjs +155 -0
  18. package/dist/cjs/FormsDemo.cjs +70 -0
  19. package/dist/cjs/Grid.cjs +71 -0
  20. package/dist/cjs/GroupDemo.cjs +85 -0
  21. package/dist/cjs/HeadingsDemo.cjs +45 -0
  22. package/dist/cjs/ImageDemo.cjs +36 -0
  23. package/dist/cjs/InputsDemo.cjs +60 -0
  24. package/dist/cjs/LabelDemo.cjs +60 -0
  25. package/dist/cjs/LinearGradientDemo.cjs +48 -0
  26. package/dist/cjs/ListItemDemo.cjs +100 -0
  27. package/dist/cjs/LucideIconsDemo.cjs +93 -0
  28. package/dist/cjs/NewInputsDemo.cjs +60 -0
  29. package/dist/cjs/PopoverDemo.cjs +145 -0
  30. package/dist/cjs/ProgressDemo.cjs +106 -0
  31. package/dist/cjs/RadioGroupDemo.cjs +71 -0
  32. package/dist/cjs/RadioGroupHeadlessDemo.cjs +168 -0
  33. package/dist/cjs/RadioGroupUnstyledDemo.cjs +142 -0
  34. package/dist/cjs/ReplaceThemeDemo.cjs +78 -0
  35. package/dist/cjs/ScrollViewDemo.cjs +74 -0
  36. package/dist/cjs/SelectDemo.cjs +228 -0
  37. package/dist/cjs/SeparatorDemo.cjs +60 -0
  38. package/dist/cjs/ShapesDemo.cjs +42 -0
  39. package/dist/cjs/SheetDemo.cjs +176 -0
  40. package/dist/cjs/SliderDemo.cjs +58 -0
  41. package/dist/cjs/SpinnerDemo.cjs +41 -0
  42. package/dist/cjs/StacksDemo.cjs +104 -0
  43. package/dist/cjs/SwitchDemo.cjs +95 -0
  44. package/dist/cjs/SwitchHeadlessDemo.cjs +101 -0
  45. package/dist/cjs/SwitchUnstyledDemo.cjs +89 -0
  46. package/dist/cjs/TabsAdvancedDemo.cjs +340 -0
  47. package/dist/cjs/TabsDemo.cjs +191 -0
  48. package/dist/cjs/TextDemo.cjs +52 -0
  49. package/dist/cjs/ThemeBuilderDemo.cjs +178 -0
  50. package/dist/cjs/ThemeInverseDemo.cjs +69 -0
  51. package/dist/cjs/ToastDemo.cjs +133 -0
  52. package/dist/cjs/ToastDuplicateDemo.cjs +83 -0
  53. package/dist/cjs/ToggleGroupDemo.cjs +97 -0
  54. package/dist/cjs/TokensDemo.cjs +125 -0
  55. package/dist/cjs/TooltipDemo.cjs +125 -0
  56. package/dist/cjs/UpdateThemeDemo.cjs +81 -0
  57. package/dist/cjs/WebNativeImageDemo.cjs +34 -0
  58. package/dist/cjs/index.cjs +74 -0
  59. package/dist/cjs/tamagui.config.cjs +29 -0
  60. package/dist/cjs/useOnIntersecting.cjs +66 -0
  61. package/package.json +22 -21
  62. package/dist/cjs/AccordionDemo.js +0 -43
  63. package/dist/cjs/AddThemeDemo.js +0 -56
  64. package/dist/cjs/AlertDialogDemo.js +0 -68
  65. package/dist/cjs/AnimationsDemo.js +0 -99
  66. package/dist/cjs/AnimationsEnterDemo.js +0 -55
  67. package/dist/cjs/AnimationsHoverDemo.js +0 -41
  68. package/dist/cjs/AnimationsPresenceDemo.js +0 -102
  69. package/dist/cjs/AnimationsTimingDemo.js +0 -40
  70. package/dist/cjs/AvatarDemo.js +0 -45
  71. package/dist/cjs/BuildAButtonDemo.js +0 -57
  72. package/dist/cjs/ButtonDemo.js +0 -39
  73. package/dist/cjs/CheckboxDemo.js +0 -40
  74. package/dist/cjs/CheckboxHeadlessDemo.js +0 -62
  75. package/dist/cjs/CheckboxUnstyledDemo.js +0 -52
  76. package/dist/cjs/ColorsDemo.js +0 -95
  77. package/dist/cjs/DialogDemo.js +0 -99
  78. package/dist/cjs/FormsDemo.js +0 -57
  79. package/dist/cjs/Grid.js +0 -58
  80. package/dist/cjs/GroupDemo.js +0 -39
  81. package/dist/cjs/HeadingsDemo.js +0 -31
  82. package/dist/cjs/ImageDemo.js +0 -33
  83. package/dist/cjs/InputsDemo.js +0 -46
  84. package/dist/cjs/LabelDemo.js +0 -33
  85. package/dist/cjs/LinearGradientDemo.js +0 -47
  86. package/dist/cjs/ListItemDemo.js +0 -61
  87. package/dist/cjs/LucideIconsDemo.js +0 -72
  88. package/dist/cjs/NewInputsDemo.js +0 -46
  89. package/dist/cjs/PopoverDemo.js +0 -126
  90. package/dist/cjs/ProgressDemo.js +0 -88
  91. package/dist/cjs/RadioGroupDemo.js +0 -36
  92. package/dist/cjs/RadioGroupHeadlessDemo.js +0 -117
  93. package/dist/cjs/RadioGroupUnstyledDemo.js +0 -107
  94. package/dist/cjs/ReplaceThemeDemo.js +0 -58
  95. package/dist/cjs/ScrollViewDemo.js +0 -43
  96. package/dist/cjs/SelectDemo.js +0 -190
  97. package/dist/cjs/SeparatorDemo.js +0 -35
  98. package/dist/cjs/ShapesDemo.js +0 -27
  99. package/dist/cjs/SheetDemo.js +0 -120
  100. package/dist/cjs/SliderDemo.js +0 -34
  101. package/dist/cjs/SpinnerDemo.js +0 -27
  102. package/dist/cjs/StacksDemo.js +0 -93
  103. package/dist/cjs/SwitchDemo.js +0 -56
  104. package/dist/cjs/SwitchHeadlessDemo.js +0 -87
  105. package/dist/cjs/SwitchUnstyledDemo.js +0 -64
  106. package/dist/cjs/TabsAdvancedDemo.js +0 -283
  107. package/dist/cjs/TabsDemo.js +0 -144
  108. package/dist/cjs/TextDemo.js +0 -31
  109. package/dist/cjs/ThemeBuilderDemo.js +0 -149
  110. package/dist/cjs/ThemeInverseDemo.js +0 -56
  111. package/dist/cjs/ToastDemo.js +0 -112
  112. package/dist/cjs/ToastDuplicateDemo.js +0 -64
  113. package/dist/cjs/ToggleGroupDemo.js +0 -63
  114. package/dist/cjs/TokensDemo.js +0 -100
  115. package/dist/cjs/TooltipDemo.js +0 -68
  116. package/dist/cjs/UpdateThemeDemo.js +0 -61
  117. package/dist/cjs/WebNativeImageDemo.js +0 -24
  118. package/dist/cjs/index.js +0 -71
  119. package/dist/cjs/tamagui.config.js +0 -22
  120. package/dist/cjs/useOnIntersecting.js +0 -63
  121. /package/dist/cjs/{AccordionDemo.js.map → AccordionDemo.cjs.map} +0 -0
  122. /package/dist/cjs/{AddThemeDemo.js.map → AddThemeDemo.cjs.map} +0 -0
  123. /package/dist/cjs/{AlertDialogDemo.js.map → AlertDialogDemo.cjs.map} +0 -0
  124. /package/dist/cjs/{AnimationsDemo.js.map → AnimationsDemo.cjs.map} +0 -0
  125. /package/dist/cjs/{AnimationsEnterDemo.js.map → AnimationsEnterDemo.cjs.map} +0 -0
  126. /package/dist/cjs/{AnimationsHoverDemo.js.map → AnimationsHoverDemo.cjs.map} +0 -0
  127. /package/dist/cjs/{AnimationsPresenceDemo.js.map → AnimationsPresenceDemo.cjs.map} +0 -0
  128. /package/dist/cjs/{AnimationsTimingDemo.js.map → AnimationsTimingDemo.cjs.map} +0 -0
  129. /package/dist/cjs/{AvatarDemo.js.map → AvatarDemo.cjs.map} +0 -0
  130. /package/dist/cjs/{BuildAButtonDemo.js.map → BuildAButtonDemo.cjs.map} +0 -0
  131. /package/dist/cjs/{ButtonDemo.js.map → ButtonDemo.cjs.map} +0 -0
  132. /package/dist/cjs/{CardDemo.js.map → CardDemo.cjs.map} +0 -0
  133. /package/dist/cjs/{CheckboxDemo.js.map → CheckboxDemo.cjs.map} +0 -0
  134. /package/dist/cjs/{CheckboxHeadlessDemo.js.map → CheckboxHeadlessDemo.cjs.map} +0 -0
  135. /package/dist/cjs/{CheckboxUnstyledDemo.js.map → CheckboxUnstyledDemo.cjs.map} +0 -0
  136. /package/dist/cjs/{ColorsDemo.js.map → ColorsDemo.cjs.map} +0 -0
  137. /package/dist/cjs/{DialogDemo.js.map → DialogDemo.cjs.map} +0 -0
  138. /package/dist/cjs/{FormsDemo.js.map → FormsDemo.cjs.map} +0 -0
  139. /package/dist/cjs/{Grid.js.map → Grid.cjs.map} +0 -0
  140. /package/dist/cjs/{GroupDemo.js.map → GroupDemo.cjs.map} +0 -0
  141. /package/dist/cjs/{HeadingsDemo.js.map → HeadingsDemo.cjs.map} +0 -0
  142. /package/dist/cjs/{ImageDemo.js.map → ImageDemo.cjs.map} +0 -0
  143. /package/dist/cjs/{InputsDemo.js.map → InputsDemo.cjs.map} +0 -0
  144. /package/dist/cjs/{LabelDemo.js.map → LabelDemo.cjs.map} +0 -0
  145. /package/dist/cjs/{LinearGradientDemo.js.map → LinearGradientDemo.cjs.map} +0 -0
  146. /package/dist/cjs/{ListItemDemo.js.map → ListItemDemo.cjs.map} +0 -0
  147. /package/dist/cjs/{LucideIconsDemo.js.map → LucideIconsDemo.cjs.map} +0 -0
  148. /package/dist/cjs/{NewInputsDemo.js.map → NewInputsDemo.cjs.map} +0 -0
  149. /package/dist/cjs/{PopoverDemo.js.map → PopoverDemo.cjs.map} +0 -0
  150. /package/dist/cjs/{ProgressDemo.js.map → ProgressDemo.cjs.map} +0 -0
  151. /package/dist/cjs/{RadioGroupDemo.js.map → RadioGroupDemo.cjs.map} +0 -0
  152. /package/dist/cjs/{RadioGroupHeadlessDemo.js.map → RadioGroupHeadlessDemo.cjs.map} +0 -0
  153. /package/dist/cjs/{RadioGroupUnstyledDemo.js.map → RadioGroupUnstyledDemo.cjs.map} +0 -0
  154. /package/dist/cjs/{ReplaceThemeDemo.js.map → ReplaceThemeDemo.cjs.map} +0 -0
  155. /package/dist/cjs/{ScrollViewDemo.js.map → ScrollViewDemo.cjs.map} +0 -0
  156. /package/dist/cjs/{SelectDemo.js.map → SelectDemo.cjs.map} +0 -0
  157. /package/dist/cjs/{SeparatorDemo.js.map → SeparatorDemo.cjs.map} +0 -0
  158. /package/dist/cjs/{ShapesDemo.js.map → ShapesDemo.cjs.map} +0 -0
  159. /package/dist/cjs/{SheetDemo.js.map → SheetDemo.cjs.map} +0 -0
  160. /package/dist/cjs/{SliderDemo.js.map → SliderDemo.cjs.map} +0 -0
  161. /package/dist/cjs/{SpinnerDemo.js.map → SpinnerDemo.cjs.map} +0 -0
  162. /package/dist/cjs/{StacksDemo.js.map → StacksDemo.cjs.map} +0 -0
  163. /package/dist/cjs/{SwitchDemo.js.map → SwitchDemo.cjs.map} +0 -0
  164. /package/dist/cjs/{SwitchHeadlessDemo.js.map → SwitchHeadlessDemo.cjs.map} +0 -0
  165. /package/dist/cjs/{SwitchUnstyledDemo.js.map → SwitchUnstyledDemo.cjs.map} +0 -0
  166. /package/dist/cjs/{TabsAdvancedDemo.js.map → TabsAdvancedDemo.cjs.map} +0 -0
  167. /package/dist/cjs/{TabsDemo.js.map → TabsDemo.cjs.map} +0 -0
  168. /package/dist/cjs/{TextDemo.js.map → TextDemo.cjs.map} +0 -0
  169. /package/dist/cjs/{ThemeBuilderDemo.js.map → ThemeBuilderDemo.cjs.map} +0 -0
  170. /package/dist/cjs/{ThemeInverseDemo.js.map → ThemeInverseDemo.cjs.map} +0 -0
  171. /package/dist/cjs/{ToastDemo.js.map → ToastDemo.cjs.map} +0 -0
  172. /package/dist/cjs/{ToastDuplicateDemo.js.map → ToastDuplicateDemo.cjs.map} +0 -0
  173. /package/dist/cjs/{ToggleGroupDemo.js.map → ToggleGroupDemo.cjs.map} +0 -0
  174. /package/dist/cjs/{TokensDemo.js.map → TokensDemo.cjs.map} +0 -0
  175. /package/dist/cjs/{TooltipDemo.js.map → TooltipDemo.cjs.map} +0 -0
  176. /package/dist/cjs/{UpdateThemeDemo.js.map → UpdateThemeDemo.cjs.map} +0 -0
  177. /package/dist/cjs/{WebNativeImageDemo.js.map → WebNativeImageDemo.cjs.map} +0 -0
  178. /package/dist/cjs/{index.js.map → index.cjs.map} +0 -0
  179. /package/dist/cjs/{tamagui.config.js.map → tamagui.config.cjs.map} +0 -0
  180. /package/dist/cjs/{useOnIntersecting.js.map → useOnIntersecting.cjs.map} +0 -0
@@ -1,99 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var AnimationsDemo_exports = {};
16
- __export(AnimationsDemo_exports, {
17
- AnimationsDemo: () => AnimationsDemo,
18
- positions: () => positions
19
- });
20
- module.exports = __toCommonJS(AnimationsDemo_exports);
21
- var import_logo = require("@tamagui/logo"), import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
22
- function AnimationsDemo(props) {
23
- const [positionI, setPositionI] = (0, import_tamagui.useControllableState)({
24
- strategy: "most-recent-wins",
25
- prop: props.position,
26
- defaultProp: 0
27
- }), position = positions[positionI], onPress = (0, import_tamagui.useEvent)(() => {
28
- setPositionI((x) => (x + 1) % positions.length);
29
- });
30
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
31
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
32
- import_tamagui.Square,
33
- {
34
- animation: props.animation || "bouncy",
35
- animateOnly: ["transform"],
36
- onPress,
37
- size: 104,
38
- borderColor: "$borderColor",
39
- borderWidth: 1,
40
- borderRadius: "$9",
41
- backgroundColor: "$color9",
42
- hoverStyle: {
43
- scale: 1.5
44
- },
45
- pressStyle: {
46
- scale: 0.9
47
- },
48
- ...position,
49
- children: props.children || /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_logo.LogoIcon, { downscale: 0.75 })
50
- }
51
- ),
52
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
53
- import_tamagui.Button,
54
- {
55
- position: "absolute",
56
- bottom: 20,
57
- left: 20,
58
- icon: import_lucide_icons.Play,
59
- theme: props.tint,
60
- size: "$5",
61
- circular: !0,
62
- onPress
63
- }
64
- )
65
- ] });
66
- }
67
- const positions = [
68
- {
69
- x: 0,
70
- y: 0,
71
- scale: 1,
72
- rotate: "0deg"
73
- },
74
- {
75
- x: -50,
76
- y: -50,
77
- scale: 0.5,
78
- rotate: "-45deg",
79
- hoverStyle: {
80
- scale: 0.6
81
- },
82
- pressStyle: {
83
- scale: 0.4
84
- }
85
- },
86
- {
87
- x: 50,
88
- y: 50,
89
- scale: 1,
90
- rotate: "180deg",
91
- hoverStyle: {
92
- scale: 1.1
93
- },
94
- pressStyle: {
95
- scale: 0.9
96
- }
97
- }
98
- ];
99
- //# sourceMappingURL=AnimationsDemo.js.map
@@ -1,55 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: !0 });
9
- }, __copyProps = (to, from, except, desc) => {
10
- if (from && typeof from == "object" || typeof from == "function")
11
- for (let key of __getOwnPropNames(from))
12
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
13
- return to;
14
- };
15
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
16
- // If the importer is in node compatibility mode or this is not an ESM
17
- // file that has been converted to a CommonJS file using a Babel-
18
- // compatible transform (i.e. "__esModule" has not been set), then set
19
- // "default" to the CommonJS "module.exports" for node compatibility.
20
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
21
- mod
22
- )), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
23
- var AnimationsEnterDemo_exports = {};
24
- __export(AnimationsEnterDemo_exports, {
25
- AnimationsEnterDemo: () => AnimationsEnterDemo
26
- });
27
- module.exports = __toCommonJS(AnimationsEnterDemo_exports);
28
- var import_react = __toESM(require("react")), import_logo = require("@tamagui/logo"), import_tamagui = require("tamagui"), import_useOnIntersecting = require("./useOnIntersecting"), import_jsx_runtime = require("react/jsx-runtime");
29
- function AnimationsEnterDemo(props) {
30
- const ref = import_react.default.useRef(null), [key, setKey] = import_react.default.useState(0);
31
- return import_tamagui.isWeb && !(0, import_useOnIntersecting.useIsIntersecting)(ref, { once: !0 }) ? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { ref }) : /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_jsx_runtime.Fragment, { children: [
32
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
33
- import_tamagui.Square,
34
- {
35
- enterStyle: {
36
- scale: 1.5,
37
- y: -10,
38
- opacity: 0
39
- },
40
- animation: "bouncy",
41
- elevation: "$4",
42
- size: 110,
43
- opacity: 1,
44
- scale: 1,
45
- y: 0,
46
- backgroundColor: "$pink10",
47
- borderRadius: "$9",
48
- children: props.children ?? /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_logo.LogoIcon, { downscale: 0.75 })
49
- },
50
- key
51
- ),
52
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { size: "$3", marginTop: "$4", onPress: () => setKey(Math.random()), children: "Re-mount" })
53
- ] });
54
- }
55
- //# sourceMappingURL=AnimationsEnterDemo.js.map
@@ -1,41 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var AnimationsHoverDemo_exports = {};
16
- __export(AnimationsHoverDemo_exports, {
17
- AnimationsHoverDemo: () => AnimationsHoverDemo
18
- });
19
- module.exports = __toCommonJS(AnimationsHoverDemo_exports);
20
- var import_logo = require("@tamagui/logo"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
21
- function AnimationsHoverDemo() {
22
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
23
- import_tamagui.Square,
24
- {
25
- borderColor: "$borderColor",
26
- animation: "bouncy",
27
- elevation: "$4",
28
- backgroundColor: "$color9",
29
- size: 104,
30
- borderRadius: "$9",
31
- hoverStyle: {
32
- scale: 1.2
33
- },
34
- pressStyle: {
35
- scale: 0.9
36
- },
37
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_logo.LogoIcon, { downscale: 0.75 })
38
- }
39
- );
40
- }
41
- //# sourceMappingURL=AnimationsHoverDemo.js.map
@@ -1,102 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: !0 });
9
- }, __copyProps = (to, from, except, desc) => {
10
- if (from && typeof from == "object" || typeof from == "function")
11
- for (let key of __getOwnPropNames(from))
12
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
13
- return to;
14
- };
15
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
16
- // If the importer is in node compatibility mode or this is not an ESM
17
- // file that has been converted to a CommonJS file using a Babel-
18
- // compatible transform (i.e. "__esModule" has not been set), then set
19
- // "default" to the CommonJS "module.exports" for node compatibility.
20
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
21
- mod
22
- )), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
23
- var AnimationsPresenceDemo_exports = {};
24
- __export(AnimationsPresenceDemo_exports, {
25
- AnimationsPresenceDemo: () => AnimationsPresenceDemo,
26
- images: () => images
27
- });
28
- module.exports = __toCommonJS(AnimationsPresenceDemo_exports);
29
- var import_react = __toESM(require("react")), import_animate_presence = require("@tamagui/animate-presence"), import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), import_photo1 = __toESM(require("../../public/photo1.jpg")), import_photo2 = __toESM(require("../../public/photo2.jpg")), import_photo3 = __toESM(require("../../public/photo3.jpg")), import_jsx_runtime = require("react/jsx-runtime");
30
- const images = [import_photo1.default, import_photo2.default, import_photo3.default].map((x) => x.src || x), GalleryItem = (0, import_tamagui.styled)(import_tamagui.YStack, {
31
- zIndex: 1,
32
- x: 0,
33
- opacity: 1,
34
- fullscreen: !0,
35
- variants: {
36
- // 1 = right, 0 = nowhere, -1 = left
37
- going: {
38
- ":number": (going) => ({
39
- enterStyle: {
40
- x: going > 0 ? 1e3 : -1e3,
41
- opacity: 0
42
- },
43
- exitStyle: {
44
- zIndex: 0,
45
- x: going < 0 ? 1e3 : -1e3,
46
- opacity: 0
47
- }
48
- })
49
- }
50
- }
51
- }), wrap = (min, max, v) => {
52
- const rangeSize = max - min;
53
- return ((v - min) % rangeSize + rangeSize) % rangeSize + min;
54
- };
55
- function AnimationsPresenceDemo() {
56
- const [[page, going], setPage] = import_react.default.useState([0, 0]), imageIndex = wrap(0, images.length, page), paginate = (going2) => {
57
- setPage([page + going2, going2]);
58
- };
59
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
60
- import_tamagui.XStack,
61
- {
62
- overflow: "hidden",
63
- backgroundColor: "#000",
64
- position: "relative",
65
- height: 300,
66
- width: "100%",
67
- alignItems: "center",
68
- children: [
69
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_animate_presence.AnimatePresence, { initial: !1, custom: { going }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(GalleryItem, { animation: "slow", going, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Image, { source: { uri: images[imageIndex], width: 820, height: 300 } }) }, page) }),
70
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
71
- import_tamagui.Button,
72
- {
73
- accessibilityLabel: "Carousel left",
74
- icon: import_lucide_icons.ArrowLeft,
75
- size: "$5",
76
- position: "absolute",
77
- left: "$4",
78
- circular: !0,
79
- elevate: !0,
80
- onPress: () => paginate(-1),
81
- zi: 100
82
- }
83
- ),
84
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
85
- import_tamagui.Button,
86
- {
87
- accessibilityLabel: "Carousel right",
88
- icon: import_lucide_icons.ArrowRight,
89
- size: "$5",
90
- position: "absolute",
91
- right: "$4",
92
- circular: !0,
93
- elevate: !0,
94
- onPress: () => paginate(1),
95
- zi: 100
96
- }
97
- )
98
- ]
99
- }
100
- );
101
- }
102
- //# sourceMappingURL=AnimationsPresenceDemo.js.map
@@ -1,40 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var AnimationsTimingDemo_exports = {};
16
- __export(AnimationsTimingDemo_exports, {
17
- AnimationsTimingDemo: () => AnimationsTimingDemo
18
- });
19
- module.exports = __toCommonJS(AnimationsTimingDemo_exports);
20
- var import_logo = require("@tamagui/logo"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
21
- function AnimationsTimingDemo() {
22
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
23
- import_tamagui.Square,
24
- {
25
- backgroundColor: "$pink10",
26
- animation: "100ms",
27
- elevation: "$4",
28
- size: 110,
29
- borderRadius: "$9",
30
- hoverStyle: {
31
- scale: 1.2
32
- },
33
- pressStyle: {
34
- scale: 0.9
35
- },
36
- children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_logo.LogoIcon, { downscale: 0.75 })
37
- }
38
- );
39
- }
40
- //# sourceMappingURL=AnimationsTimingDemo.js.map
@@ -1,45 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var AvatarDemo_exports = {};
16
- __export(AvatarDemo_exports, {
17
- AvatarDemo: () => AvatarDemo
18
- });
19
- module.exports = __toCommonJS(AvatarDemo_exports);
20
- var import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
21
- function AvatarDemo() {
22
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { alignItems: "center", gap: "$6", children: [
23
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Avatar, { circular: !0, size: "$10", children: [
24
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
25
- import_tamagui.Avatar.Image,
26
- {
27
- accessibilityLabel: "Cam",
28
- src: "https://images.unsplash.com/photo-1548142813-c348350df52b?&w=150&h=150&dpr=2&q=80"
29
- }
30
- ),
31
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Avatar.Fallback, { backgroundColor: "$blue10" })
32
- ] }),
33
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Avatar, { circular: !0, size: "$8", children: [
34
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
35
- import_tamagui.Avatar.Image,
36
- {
37
- accessibilityLabel: "Nate Wienert",
38
- src: "https://images.unsplash.com/photo-1531384441138-2736e62e0919?&w=100&h=100&dpr=2&q=80"
39
- }
40
- ),
41
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Avatar.Fallback, { delayMs: 600, backgroundColor: "$blue10" })
42
- ] })
43
- ] });
44
- }
45
- //# sourceMappingURL=AvatarDemo.js.map
@@ -1,57 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var BuildAButtonDemo_exports = {};
16
- __export(BuildAButtonDemo_exports, {
17
- BuildAButtonDemo: () => BuildAButtonDemo
18
- });
19
- module.exports = __toCommonJS(BuildAButtonDemo_exports);
20
- var import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
21
- const outlined = {
22
- backgroundColor: "transparent",
23
- borderWidth: 2,
24
- borderColor: "$background",
25
- borderRadius: "$10",
26
- hoverStyle: {
27
- backgroundColor: "transparent",
28
- borderColor: "$backgroundPress"
29
- }
30
- };
31
- function BuildAButtonDemo() {
32
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { fullscreen: !0, ov: "hidden", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { mah: 200, y: -100, x: -40, rotate: "-10deg", children: [
33
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { y: 35, size: "$2", ...outlined, subTheme: "alt1", borderWidth: 1 }),
34
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { y: 30 }),
35
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { y: -50, ...outlined }),
36
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { ...outlined, icon: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.Hand, {}) }),
37
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { size: "$6", subTheme: "alt2" }),
38
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { size: "$6", subTheme: "alt2", ...outlined }),
39
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { size: "$8", subTheme: "alt2", iconAfter: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.Drumstick, {}), ...outlined }),
40
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { size: "$10", subTheme: "alt1" }),
41
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ButtonCol, { size: "$8", subTheme: "alt2", ...outlined, borderRadius: 0 })
42
- ] }) });
43
- }
44
- function ButtonCol(props) {
45
- const subTheme = props.subTheme ? `_${props.subTheme}` : "";
46
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { padding: "$2", gap: "$3", children: [
47
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: props.subTheme, ...props, children: "Hello" }),
48
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: "orange" + subTheme, ...props, children: "Hello" }),
49
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: "yellow" + subTheme, ...props, children: "Hello" }),
50
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: "green" + subTheme, ...props, children: "Hello" }),
51
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: "blue" + subTheme, ...props, children: "Hello" }),
52
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: "purple" + subTheme, ...props, children: "Hello" }),
53
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: "pink" + subTheme, ...props, children: "Hello" }),
54
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { theme: "red" + subTheme, ...props, children: "Hello" })
55
- ] });
56
- }
57
- //# sourceMappingURL=BuildAButtonDemo.js.map
@@ -1,39 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var ButtonDemo_exports = {};
16
- __export(ButtonDemo_exports, {
17
- ButtonDemo: () => ButtonDemo
18
- });
19
- module.exports = __toCommonJS(ButtonDemo_exports);
20
- var import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
21
- function ButtonDemo(props) {
22
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { padding: "$3", gap: "$3", ...props, children: [
23
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { children: "Plain" }),
24
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { alignSelf: "center", icon: import_lucide_icons.Airplay, size: "$6", children: "Large" }),
25
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { gap: "$2", justifyContent: "center", children: [
26
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { size: "$3", theme: "active", children: "Active" }),
27
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { size: "$3", variant: "outlined", children: "Outlined" })
28
- ] }),
29
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { gap: "$2", children: [
30
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { themeInverse: !0, size: "$3", children: "Inverse" }),
31
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { iconAfter: import_lucide_icons.Activity, size: "$3", children: "iconAfter" })
32
- ] }),
33
- /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XGroup, { children: [
34
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XGroup.Item, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { width: "50%", size: "$2", disabled: !0, opacity: 0.5, children: "disabled" }) }),
35
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XGroup.Item, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { width: "50%", size: "$2", chromeless: !0, children: "chromeless" }) })
36
- ] })
37
- ] });
38
- }
39
- //# sourceMappingURL=ButtonDemo.js.map
@@ -1,40 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var CheckboxDemo_exports = {};
16
- __export(CheckboxDemo_exports, {
17
- CheckboxDemo: () => CheckboxDemo,
18
- CheckboxWithLabel: () => CheckboxWithLabel
19
- });
20
- module.exports = __toCommonJS(CheckboxDemo_exports);
21
- var import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
22
- function CheckboxDemo() {
23
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { width: 300, alignItems: "center", gap: "$2", children: [
24
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxWithLabel, { size: "$3" }),
25
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxWithLabel, { size: "$4", defaultChecked: !0 }),
26
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(CheckboxWithLabel, { size: "$5", disabled: !0, label: "Accept terms (disabled)" })
27
- ] });
28
- }
29
- function CheckboxWithLabel({
30
- size,
31
- label = "Accept terms and conditions",
32
- ...checkboxProps
33
- }) {
34
- const id = `checkbox-${(size || "").toString().slice(1)}`;
35
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { width: 300, alignItems: "center", gap: "$4", children: [
36
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Checkbox, { id, size, ...checkboxProps, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Checkbox.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.Check, {}) }) }),
37
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Label, { size, htmlFor: id, children: label })
38
- ] });
39
- }
40
- //# sourceMappingURL=CheckboxDemo.js.map
@@ -1,62 +0,0 @@
1
- var __create = Object.create;
2
- var __defProp = Object.defineProperty;
3
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
4
- var __getOwnPropNames = Object.getOwnPropertyNames;
5
- var __getProtoOf = Object.getPrototypeOf, __hasOwnProp = Object.prototype.hasOwnProperty;
6
- var __export = (target, all) => {
7
- for (var name in all)
8
- __defProp(target, name, { get: all[name], enumerable: !0 });
9
- }, __copyProps = (to, from, except, desc) => {
10
- if (from && typeof from == "object" || typeof from == "function")
11
- for (let key of __getOwnPropNames(from))
12
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
13
- return to;
14
- };
15
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
16
- // If the importer is in node compatibility mode or this is not an ESM
17
- // file that has been converted to a CommonJS file using a Babel-
18
- // compatible transform (i.e. "__esModule" has not been set), then set
19
- // "default" to the CommonJS "module.exports" for node compatibility.
20
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: !0 }) : target,
21
- mod
22
- )), __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
23
- var CheckboxHeadlessDemo_exports = {};
24
- __export(CheckboxHeadlessDemo_exports, {
25
- CheckboxHeadlessDemo: () => CheckboxHeadlessDemo
26
- });
27
- module.exports = __toCommonJS(CheckboxHeadlessDemo_exports);
28
- var import_react = __toESM(require("react")), import_checkbox_headless = require("@tamagui/checkbox-headless"), import_lucide_icons = require("@tamagui/lucide-icons"), import_react_native = require("react-native-web"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
29
- function CheckboxHeadlessDemo() {
30
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { width: 200, alignItems: "center", gap: "$3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { gap: "$3", alignItems: "center", children: [
31
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(HeadlessCheckbox, { defaultChecked: "indeterminate", id: "headless" }),
32
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Label, { htmlFor: "headless", children: "Headless" })
33
- ] }) });
34
- }
35
- const HeadlessCheckbox = import_react.default.forwardRef((props, ref) => {
36
- const [checked, setChecked] = import_react.default.useState(props.defaultChecked || !1), { checkboxProps, checkboxRef, bubbleInput } = (0, import_checkbox_headless.useCheckbox)(
37
- props,
38
- [checked, setChecked],
39
- ref
40
- );
41
- return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
42
- import_react_native.Pressable,
43
- {
44
- style: {
45
- width: 20,
46
- height: 20,
47
- borderRadius: 4,
48
- justifyContent: "center",
49
- alignItems: "center",
50
- backgroundColor: checked === !0 ? "lightblue" : "silver"
51
- },
52
- ref: checkboxRef,
53
- ...checkboxProps,
54
- children: [
55
- checked === "indeterminate" && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.Minus, { width: 18, height: 18 }),
56
- checked === !0 && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.Check, { width: 18, height: 18 }),
57
- bubbleInput
58
- ]
59
- }
60
- );
61
- });
62
- //# sourceMappingURL=CheckboxHeadlessDemo.js.map
@@ -1,52 +0,0 @@
1
- var __defProp = Object.defineProperty;
2
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
3
- var __getOwnPropNames = Object.getOwnPropertyNames;
4
- var __hasOwnProp = Object.prototype.hasOwnProperty;
5
- var __export = (target, all) => {
6
- for (var name in all)
7
- __defProp(target, name, { get: all[name], enumerable: !0 });
8
- }, __copyProps = (to, from, except, desc) => {
9
- if (from && typeof from == "object" || typeof from == "function")
10
- for (let key of __getOwnPropNames(from))
11
- !__hasOwnProp.call(to, key) && key !== except && __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
12
- return to;
13
- };
14
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: !0 }), mod);
15
- var CheckboxUnstyledDemo_exports = {};
16
- __export(CheckboxUnstyledDemo_exports, {
17
- Checkbox: () => Checkbox,
18
- CheckboxUnstyledDemo: () => CheckboxUnstyledDemo
19
- });
20
- module.exports = __toCommonJS(CheckboxUnstyledDemo_exports);
21
- var import_checkbox = require("@tamagui/checkbox"), import_core = require("@tamagui/core"), import_lucide_icons = require("@tamagui/lucide-icons"), import_tamagui = require("tamagui"), import_jsx_runtime = require("react/jsx-runtime");
22
- const Frame = (0, import_core.styled)(import_core.Stack, {
23
- borderWidth: 1,
24
- borderColor: "$borderColor",
25
- borderRadius: 5,
26
- alignItems: "center",
27
- justifyContent: "center",
28
- variants: {
29
- checked: {
30
- indeterminate: {},
31
- true: {
32
- backgroundColor: "$color5"
33
- },
34
- false: {
35
- backgroundColor: "$color3"
36
- }
37
- }
38
- },
39
- defaultVariants: {
40
- checked: !1
41
- }
42
- }), Indicator = (0, import_core.styled)(import_core.Stack, {}), Checkbox = (0, import_checkbox.createCheckbox)({
43
- Frame,
44
- Indicator
45
- });
46
- function CheckboxUnstyledDemo() {
47
- return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { width: 200, alignItems: "center", gap: "$3", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { gap: "$3", alignItems: "center", children: [
48
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Checkbox, { defaultChecked: !0, id: "unstyled", children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(Checkbox.Indicator, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_lucide_icons.Check, {}) }) }),
49
- /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Label, { htmlFor: "unstyled", children: "Unstyled" })
50
- ] }) });
51
- }
52
- //# sourceMappingURL=CheckboxUnstyledDemo.js.map