@tamagui/demos 1.88.13 → 1.88.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +21 -0
- package/dist/cjs/BuildAButtonDemo.js.map +1 -1
- package/dist/cjs/BuildAButtonDemo.native.js.map +1 -1
- package/dist/cjs/CardDemo.js.map +1 -1
- package/dist/cjs/CardDemo.native.js.map +1 -1
- package/dist/cjs/CheckboxDemo.js.map +1 -1
- package/dist/cjs/CheckboxDemo.native.js.map +1 -1
- package/dist/cjs/FormsDemo.js.map +1 -1
- package/dist/cjs/FormsDemo.native.js.map +1 -1
- package/dist/cjs/InputsDemo.js.map +1 -1
- package/dist/cjs/InputsDemo.native.js.map +1 -1
- package/dist/cjs/PopoverDemo.js.map +1 -1
- package/dist/cjs/PopoverDemo.native.js.map +1 -1
- package/dist/cjs/ProgressDemo.js.map +1 -1
- package/dist/cjs/ProgressDemo.native.js.map +1 -1
- package/dist/cjs/RadioGroupDemo.js.map +1 -1
- package/dist/cjs/RadioGroupDemo.native.js.map +1 -1
- package/dist/cjs/SelectDemo.js.map +1 -1
- package/dist/cjs/SelectDemo.native.js.map +1 -1
- package/dist/cjs/SheetDemo.js.map +1 -1
- package/dist/cjs/SheetDemo.native.js.map +1 -1
- package/dist/cjs/SliderDemo.js.map +1 -1
- package/dist/cjs/SliderDemo.native.js.map +1 -1
- package/dist/cjs/SwitchDemo.js.map +1 -1
- package/dist/cjs/SwitchDemo.native.js.map +1 -1
- package/dist/cjs/TabsAdvancedDemo.js.map +1 -1
- package/dist/cjs/TabsAdvancedDemo.native.js.map +1 -1
- package/dist/cjs/TabsDemo.js.map +1 -1
- package/dist/cjs/TabsDemo.native.js.map +1 -1
- package/dist/cjs/ThemeBuilderDemo.js.map +1 -1
- package/dist/cjs/ThemeBuilderDemo.native.js.map +1 -1
- package/dist/cjs/ToggleGroupDemo.js.map +1 -1
- package/dist/cjs/ToggleGroupDemo.native.js.map +1 -1
- package/dist/cjs/TokensDemo.js.map +1 -1
- package/dist/cjs/TokensDemo.native.js.map +1 -1
- package/dist/cjs/TooltipDemo.js.map +1 -1
- package/dist/cjs/TooltipDemo.native.js.map +1 -1
- package/dist/cjs/useOnIntersecting.js +0 -1
- package/dist/cjs/useOnIntersecting.js.map +1 -1
- package/dist/cjs/useOnIntersecting.native.js +0 -1
- package/dist/cjs/useOnIntersecting.native.js.map +1 -1
- package/dist/esm/AccordionDemo.mjs +58 -0
- package/dist/esm/AddThemeDemo.mjs +35 -0
- package/dist/esm/AlertDialogDemo.mjs +72 -0
- package/dist/esm/AnimationsDemo.mjs +75 -0
- package/dist/esm/AnimationsEnterDemo.mjs +40 -0
- package/dist/esm/AnimationsHoverDemo.mjs +23 -0
- package/dist/esm/AnimationsPresenceDemo.mjs +88 -0
- package/dist/esm/AnimationsTimingDemo.mjs +22 -0
- package/dist/esm/AvatarDemo.mjs +29 -0
- package/dist/esm/BuildAButtonDemo.js.map +1 -1
- package/dist/esm/BuildAButtonDemo.mjs +101 -0
- package/dist/esm/BuildAButtonDemo.native.js.map +1 -1
- package/dist/esm/ButtonDemo.mjs +59 -0
- package/dist/esm/CardDemo.js.map +1 -1
- package/dist/esm/CardDemo.mjs +64 -0
- package/dist/esm/CardDemo.native.js.map +1 -1
- package/dist/esm/CheckboxDemo.js.map +1 -1
- package/dist/esm/CheckboxDemo.mjs +45 -0
- package/dist/esm/CheckboxDemo.native.js.map +1 -1
- package/dist/esm/CheckboxHeadlessDemo.mjs +50 -0
- package/dist/esm/CheckboxUnstyledDemo.mjs +53 -0
- package/dist/esm/ColorsDemo.mjs +97 -0
- package/dist/esm/DialogDemo.mjs +136 -0
- package/dist/esm/FormsDemo.js.map +1 -1
- package/dist/esm/FormsDemo.mjs +35 -0
- package/dist/esm/FormsDemo.native.js.map +1 -1
- package/dist/esm/Grid.mjs +37 -0
- package/dist/esm/GroupDemo.mjs +61 -0
- package/dist/esm/HeadingsDemo.mjs +21 -0
- package/dist/esm/ImageDemo.mjs +12 -0
- package/dist/esm/InputsDemo.js.map +1 -1
- package/dist/esm/InputsDemo.mjs +36 -0
- package/dist/esm/InputsDemo.native.js.map +1 -1
- package/dist/esm/LabelDemo.mjs +36 -0
- package/dist/esm/LinearGradientDemo.mjs +24 -0
- package/dist/esm/ListItemDemo.mjs +76 -0
- package/dist/esm/LucideIconsDemo.mjs +58 -0
- package/dist/esm/PopoverDemo.js +1 -9
- package/dist/esm/PopoverDemo.js.map +1 -1
- package/dist/esm/PopoverDemo.mjs +106 -0
- package/dist/esm/PopoverDemo.native.js.map +1 -1
- package/dist/esm/ProgressDemo.js.map +1 -1
- package/dist/esm/ProgressDemo.mjs +64 -0
- package/dist/esm/ProgressDemo.native.js.map +1 -1
- package/dist/esm/RadioGroupDemo.js.map +1 -1
- package/dist/esm/RadioGroupDemo.mjs +46 -0
- package/dist/esm/RadioGroupDemo.native.js.map +1 -1
- package/dist/esm/ReplaceThemeDemo.mjs +43 -0
- package/dist/esm/ScrollViewDemo.mjs +50 -0
- package/dist/esm/SelectDemo.js +1 -9
- package/dist/esm/SelectDemo.js.map +1 -1
- package/dist/esm/SelectDemo.mjs +188 -0
- package/dist/esm/SelectDemo.native.js.map +1 -1
- package/dist/esm/SeparatorDemo.mjs +36 -0
- package/dist/esm/ShapesDemo.mjs +18 -0
- package/dist/esm/SheetDemo.js.map +1 -1
- package/dist/esm/SheetDemo.mjs +141 -0
- package/dist/esm/SheetDemo.native.js.map +1 -1
- package/dist/esm/SliderDemo.js.map +1 -1
- package/dist/esm/SliderDemo.mjs +34 -0
- package/dist/esm/SliderDemo.native.js.map +1 -1
- package/dist/esm/SpinnerDemo.mjs +17 -0
- package/dist/esm/StacksDemo.mjs +80 -0
- package/dist/esm/SwitchDemo.js.map +1 -1
- package/dist/esm/SwitchDemo.mjs +81 -0
- package/dist/esm/SwitchDemo.native.js.map +1 -1
- package/dist/esm/SwitchHeadlessDemo.mjs +66 -0
- package/dist/esm/SwitchUnstyledDemo.mjs +68 -0
- package/dist/esm/TabsAdvancedDemo.js.map +1 -1
- package/dist/esm/TabsAdvancedDemo.mjs +303 -0
- package/dist/esm/TabsAdvancedDemo.native.js.map +1 -1
- package/dist/esm/TabsDemo.js +1 -10
- package/dist/esm/TabsDemo.js.map +1 -1
- package/dist/esm/TabsDemo.mjs +158 -0
- package/dist/esm/TabsDemo.native.js.map +1 -1
- package/dist/esm/TextDemo.mjs +28 -0
- package/dist/esm/ThemeBuilderDemo.js.map +1 -1
- package/dist/esm/ThemeBuilderDemo.mjs +154 -0
- package/dist/esm/ThemeBuilderDemo.native.js.map +1 -1
- package/dist/esm/ThemeInverseDemo.mjs +45 -0
- package/dist/esm/ToastDemo.mjs +98 -0
- package/dist/esm/ToastDuplicateDemo.mjs +48 -0
- package/dist/esm/ToggleGroupDemo.js.map +1 -1
- package/dist/esm/ToggleGroupDemo.mjs +73 -0
- package/dist/esm/ToggleGroupDemo.native.js.map +1 -1
- package/dist/esm/TokensDemo.js.map +1 -1
- package/dist/esm/TokensDemo.mjs +90 -0
- package/dist/esm/TokensDemo.native.js.map +1 -1
- package/dist/esm/TooltipDemo.js +1 -8
- package/dist/esm/TooltipDemo.js.map +1 -1
- package/dist/esm/TooltipDemo.mjs +101 -0
- package/dist/esm/TooltipDemo.native.js.map +1 -1
- package/dist/esm/UpdateThemeDemo.mjs +46 -0
- package/dist/esm/index.mjs +49 -0
- package/dist/esm/tamagui.config.mjs +4 -0
- package/dist/esm/useOnIntersecting.js +0 -1
- package/dist/esm/useOnIntersecting.js.map +1 -1
- package/dist/esm/useOnIntersecting.mjs +41 -0
- package/dist/esm/useOnIntersecting.native.js +0 -1
- package/dist/esm/useOnIntersecting.native.js.map +1 -1
- package/dist/jsx/AccordionDemo.mjs +58 -0
- package/dist/jsx/AddThemeDemo.mjs +35 -0
- package/dist/jsx/AlertDialogDemo.mjs +72 -0
- package/dist/jsx/AnimationsDemo.mjs +75 -0
- package/dist/jsx/AnimationsEnterDemo.mjs +40 -0
- package/dist/jsx/AnimationsHoverDemo.mjs +23 -0
- package/dist/jsx/AnimationsPresenceDemo.mjs +88 -0
- package/dist/jsx/AnimationsTimingDemo.mjs +22 -0
- package/dist/jsx/AvatarDemo.mjs +29 -0
- package/dist/jsx/BuildAButtonDemo.js.map +1 -1
- package/dist/jsx/BuildAButtonDemo.mjs +101 -0
- package/dist/jsx/BuildAButtonDemo.native.js.map +1 -1
- package/dist/jsx/ButtonDemo.mjs +59 -0
- package/dist/jsx/CardDemo.js.map +1 -1
- package/dist/jsx/CardDemo.mjs +64 -0
- package/dist/jsx/CardDemo.native.js.map +1 -1
- package/dist/jsx/CheckboxDemo.js.map +1 -1
- package/dist/jsx/CheckboxDemo.mjs +45 -0
- package/dist/jsx/CheckboxDemo.native.js.map +1 -1
- package/dist/jsx/CheckboxHeadlessDemo.mjs +50 -0
- package/dist/jsx/CheckboxUnstyledDemo.mjs +53 -0
- package/dist/jsx/ColorsDemo.mjs +97 -0
- package/dist/jsx/DialogDemo.mjs +136 -0
- package/dist/jsx/FormsDemo.js.map +1 -1
- package/dist/jsx/FormsDemo.mjs +35 -0
- package/dist/jsx/FormsDemo.native.js.map +1 -1
- package/dist/jsx/Grid.mjs +37 -0
- package/dist/jsx/GroupDemo.mjs +61 -0
- package/dist/jsx/HeadingsDemo.mjs +21 -0
- package/dist/jsx/ImageDemo.mjs +12 -0
- package/dist/jsx/InputsDemo.js.map +1 -1
- package/dist/jsx/InputsDemo.mjs +36 -0
- package/dist/jsx/InputsDemo.native.js.map +1 -1
- package/dist/jsx/LabelDemo.mjs +36 -0
- package/dist/jsx/LinearGradientDemo.mjs +24 -0
- package/dist/jsx/ListItemDemo.mjs +76 -0
- package/dist/jsx/LucideIconsDemo.mjs +58 -0
- package/dist/jsx/PopoverDemo.js +1 -9
- package/dist/jsx/PopoverDemo.js.map +1 -1
- package/dist/jsx/PopoverDemo.mjs +106 -0
- package/dist/jsx/PopoverDemo.native.js.map +1 -1
- package/dist/jsx/ProgressDemo.js.map +1 -1
- package/dist/jsx/ProgressDemo.mjs +64 -0
- package/dist/jsx/ProgressDemo.native.js.map +1 -1
- package/dist/jsx/RadioGroupDemo.js.map +1 -1
- package/dist/jsx/RadioGroupDemo.mjs +46 -0
- package/dist/jsx/RadioGroupDemo.native.js.map +1 -1
- package/dist/jsx/ReplaceThemeDemo.mjs +43 -0
- package/dist/jsx/ScrollViewDemo.mjs +50 -0
- package/dist/jsx/SelectDemo.js +1 -9
- package/dist/jsx/SelectDemo.js.map +1 -1
- package/dist/jsx/SelectDemo.mjs +188 -0
- package/dist/jsx/SelectDemo.native.js.map +1 -1
- package/dist/jsx/SeparatorDemo.mjs +36 -0
- package/dist/jsx/ShapesDemo.mjs +18 -0
- package/dist/jsx/SheetDemo.js.map +1 -1
- package/dist/jsx/SheetDemo.mjs +141 -0
- package/dist/jsx/SheetDemo.native.js.map +1 -1
- package/dist/jsx/SliderDemo.js.map +1 -1
- package/dist/jsx/SliderDemo.mjs +34 -0
- package/dist/jsx/SliderDemo.native.js.map +1 -1
- package/dist/jsx/SpinnerDemo.mjs +17 -0
- package/dist/jsx/StacksDemo.mjs +80 -0
- package/dist/jsx/SwitchDemo.js.map +1 -1
- package/dist/jsx/SwitchDemo.mjs +81 -0
- package/dist/jsx/SwitchDemo.native.js.map +1 -1
- package/dist/jsx/SwitchHeadlessDemo.mjs +66 -0
- package/dist/jsx/SwitchUnstyledDemo.mjs +68 -0
- package/dist/jsx/TabsAdvancedDemo.js.map +1 -1
- package/dist/jsx/TabsAdvancedDemo.mjs +303 -0
- package/dist/jsx/TabsAdvancedDemo.native.js.map +1 -1
- package/dist/jsx/TabsDemo.js +1 -10
- package/dist/jsx/TabsDemo.js.map +1 -1
- package/dist/jsx/TabsDemo.mjs +158 -0
- package/dist/jsx/TabsDemo.native.js.map +1 -1
- package/dist/jsx/TextDemo.mjs +28 -0
- package/dist/jsx/ThemeBuilderDemo.js.map +1 -1
- package/dist/jsx/ThemeBuilderDemo.mjs +154 -0
- package/dist/jsx/ThemeBuilderDemo.native.js.map +1 -1
- package/dist/jsx/ThemeInverseDemo.mjs +45 -0
- package/dist/jsx/ToastDemo.mjs +98 -0
- package/dist/jsx/ToastDuplicateDemo.mjs +48 -0
- package/dist/jsx/ToggleGroupDemo.js.map +1 -1
- package/dist/jsx/ToggleGroupDemo.mjs +73 -0
- package/dist/jsx/ToggleGroupDemo.native.js.map +1 -1
- package/dist/jsx/TokensDemo.js.map +1 -1
- package/dist/jsx/TokensDemo.mjs +90 -0
- package/dist/jsx/TokensDemo.native.js.map +1 -1
- package/dist/jsx/TooltipDemo.js +1 -8
- package/dist/jsx/TooltipDemo.js.map +1 -1
- package/dist/jsx/TooltipDemo.mjs +101 -0
- package/dist/jsx/TooltipDemo.native.js.map +1 -1
- package/dist/jsx/UpdateThemeDemo.mjs +46 -0
- package/dist/jsx/index.mjs +49 -0
- package/dist/jsx/tamagui.config.mjs +4 -0
- package/dist/jsx/useOnIntersecting.js +0 -1
- package/dist/jsx/useOnIntersecting.js.map +1 -1
- package/dist/jsx/useOnIntersecting.mjs +41 -0
- package/dist/jsx/useOnIntersecting.native.js +0 -1
- package/dist/jsx/useOnIntersecting.native.js.map +1 -1
- package/package.json +19 -19
- package/src/BuildAButtonDemo.tsx +2 -1
- package/src/CardDemo.tsx +2 -1
- package/src/CheckboxDemo.tsx +2 -1
- package/src/ColorsDemo.tsx +1 -1
- package/src/FormsDemo.tsx +2 -1
- package/src/InputsDemo.tsx +2 -1
- package/src/PopoverDemo.tsx +2 -10
- package/src/ProgressDemo.tsx +2 -1
- package/src/RadioGroupDemo.tsx +2 -1
- package/src/SelectDemo.tsx +2 -11
- package/src/SheetDemo.tsx +2 -1
- package/src/SliderDemo.tsx +2 -1
- package/src/SwitchDemo.tsx +2 -1
- package/src/TabsAdvancedDemo.tsx +1 -3
- package/src/TabsDemo.tsx +2 -11
- package/src/ThemeBuilderDemo.tsx +2 -1
- package/src/ToggleGroupDemo.tsx +2 -1
- package/src/TokensDemo.tsx +2 -1
- package/src/TooltipDemo.tsx +2 -9
- package/src/useOnIntersecting.tsx +3 -2
- package/types/BuildAButtonDemo.d.ts.map +1 -1
- package/types/CardDemo.d.ts +1 -1
- package/types/CardDemo.d.ts.map +1 -1
- package/types/CheckboxDemo.d.ts +1 -1
- package/types/CheckboxDemo.d.ts.map +1 -1
- package/types/FormsDemo.d.ts +1 -1
- package/types/FormsDemo.d.ts.map +1 -1
- package/types/InputsDemo.d.ts.map +1 -1
- package/types/PopoverDemo.d.ts +1 -1
- package/types/PopoverDemo.d.ts.map +1 -1
- package/types/ProgressDemo.d.ts.map +1 -1
- package/types/RadioGroupDemo.d.ts +1 -1
- package/types/RadioGroupDemo.d.ts.map +1 -1
- package/types/SelectDemo.d.ts +1 -1
- package/types/SelectDemo.d.ts.map +1 -1
- package/types/SheetDemo.d.ts.map +1 -1
- package/types/SliderDemo.d.ts.map +1 -1
- package/types/SwitchDemo.d.ts +1 -1
- package/types/SwitchDemo.d.ts.map +1 -1
- package/types/TabsAdvancedDemo.d.ts.map +1 -1
- package/types/TabsDemo.d.ts.map +1 -1
- package/types/ThemeBuilderDemo.d.ts.map +1 -1
- package/types/ToggleGroupDemo.d.ts.map +1 -1
- package/types/TokensDemo.d.ts.map +1 -1
- package/types/TooltipDemo.d.ts.map +1 -1
- package/types/useOnIntersecting.d.ts +1 -1
- package/types/useOnIntersecting.d.ts.map +1 -1
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from "@tamagui/lucide-icons";
|
|
2
|
+
import { Adapt, Button, Input, Label, Popover, XStack, YStack } from "tamagui";
|
|
3
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
function PopoverDemo() {
|
|
5
|
+
return /* @__PURE__ */jsxs(XStack, {
|
|
6
|
+
space: "$2",
|
|
7
|
+
flex: 1,
|
|
8
|
+
justifyContent: "center",
|
|
9
|
+
alignItems: "center",
|
|
10
|
+
children: [/* @__PURE__ */jsx(Demo, {
|
|
11
|
+
placement: "left",
|
|
12
|
+
Icon: ChevronLeft,
|
|
13
|
+
Name: "left-popover"
|
|
14
|
+
}), /* @__PURE__ */jsx(Demo, {
|
|
15
|
+
placement: "bottom",
|
|
16
|
+
Icon: ChevronDown,
|
|
17
|
+
Name: "bottom-popover"
|
|
18
|
+
}), /* @__PURE__ */jsx(Demo, {
|
|
19
|
+
placement: "top",
|
|
20
|
+
Icon: ChevronUp,
|
|
21
|
+
Name: "top-popover"
|
|
22
|
+
}), /* @__PURE__ */jsx(Demo, {
|
|
23
|
+
placement: "right",
|
|
24
|
+
Icon: ChevronRight,
|
|
25
|
+
Name: "right-popover"
|
|
26
|
+
})]
|
|
27
|
+
});
|
|
28
|
+
}
|
|
29
|
+
function Demo({
|
|
30
|
+
Icon,
|
|
31
|
+
Name,
|
|
32
|
+
...props
|
|
33
|
+
}) {
|
|
34
|
+
return /* @__PURE__ */jsxs(Popover, {
|
|
35
|
+
size: "$5",
|
|
36
|
+
allowFlip: !0,
|
|
37
|
+
...props,
|
|
38
|
+
children: [/* @__PURE__ */jsx(Popover.Trigger, {
|
|
39
|
+
asChild: !0,
|
|
40
|
+
children: /* @__PURE__ */jsx(Button, {
|
|
41
|
+
icon: Icon
|
|
42
|
+
})
|
|
43
|
+
}), /* @__PURE__ */jsx(Adapt, {
|
|
44
|
+
when: "sm",
|
|
45
|
+
platform: "touch",
|
|
46
|
+
children: /* @__PURE__ */jsxs(Popover.Sheet, {
|
|
47
|
+
modal: !0,
|
|
48
|
+
dismissOnSnapToBottom: !0,
|
|
49
|
+
children: [/* @__PURE__ */jsx(Popover.Sheet.Frame, {
|
|
50
|
+
padding: "$4",
|
|
51
|
+
children: /* @__PURE__ */jsx(Adapt.Contents, {})
|
|
52
|
+
}), /* @__PURE__ */jsx(Popover.Sheet.Overlay, {
|
|
53
|
+
animation: "lazy",
|
|
54
|
+
enterStyle: {
|
|
55
|
+
opacity: 0
|
|
56
|
+
},
|
|
57
|
+
exitStyle: {
|
|
58
|
+
opacity: 0
|
|
59
|
+
}
|
|
60
|
+
})]
|
|
61
|
+
})
|
|
62
|
+
}), /* @__PURE__ */jsxs(Popover.Content, {
|
|
63
|
+
borderWidth: 1,
|
|
64
|
+
borderColor: "$borderColor",
|
|
65
|
+
enterStyle: {
|
|
66
|
+
y: -10,
|
|
67
|
+
opacity: 0
|
|
68
|
+
},
|
|
69
|
+
exitStyle: {
|
|
70
|
+
y: -10,
|
|
71
|
+
opacity: 0
|
|
72
|
+
},
|
|
73
|
+
elevate: !0,
|
|
74
|
+
animation: ["quick", {
|
|
75
|
+
opacity: {
|
|
76
|
+
overshootClamping: !0
|
|
77
|
+
}
|
|
78
|
+
}],
|
|
79
|
+
children: [/* @__PURE__ */jsx(Popover.Arrow, {
|
|
80
|
+
borderWidth: 1,
|
|
81
|
+
borderColor: "$borderColor"
|
|
82
|
+
}), /* @__PURE__ */jsxs(YStack, {
|
|
83
|
+
space: "$3",
|
|
84
|
+
children: [/* @__PURE__ */jsxs(XStack, {
|
|
85
|
+
space: "$3",
|
|
86
|
+
children: [/* @__PURE__ */jsx(Label, {
|
|
87
|
+
size: "$3",
|
|
88
|
+
htmlFor: Name,
|
|
89
|
+
children: "Name"
|
|
90
|
+
}), /* @__PURE__ */jsx(Input, {
|
|
91
|
+
size: "$3",
|
|
92
|
+
id: Name
|
|
93
|
+
})]
|
|
94
|
+
}), /* @__PURE__ */jsx(Popover.Close, {
|
|
95
|
+
asChild: !0,
|
|
96
|
+
children: /* @__PURE__ */jsx(Button, {
|
|
97
|
+
size: "$3",
|
|
98
|
+
onPress: () => {},
|
|
99
|
+
children: "Submit"
|
|
100
|
+
})
|
|
101
|
+
})]
|
|
102
|
+
})]
|
|
103
|
+
})]
|
|
104
|
+
});
|
|
105
|
+
}
|
|
106
|
+
export { Demo, PopoverDemo };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/PopoverDemo.tsx"],
|
|
4
|
-
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAkE,
|
|
4
|
+
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAAkE,kCAElE,iBAAqE,oBAIjE;AAFG,SAAS,cAAc;AAC5B,SACE,6CAAC,yBAAO,OAAM,MAAK,MAAM,GAAG,gBAAe,UAAS,YAAW,UAC7D;AAAA,gDAAC,QAAK,WAAU,QAAO,MAAM,iCAAa,MAAK,gBAAe;AAAA,IAC9D,4CAAC,QAAK,WAAU,UAAS,MAAM,iCAAa,MAAK,kBAAiB;AAAA,IAClE,4CAAC,QAAK,WAAU,OAAM,MAAM,+BAAW,MAAK,eAAc;AAAA,IAC1D,4CAAC,QAAK,WAAU,SAAQ,MAAM,kCAAc,MAAK,iBAAgB;AAAA,KACnE;AAEJ;AAEO,SAAS,KAAK;AAAA,EACnB;AAAA,EACA;AAAA,EACA,GAAG;AACL,GAAiD;AAC/C,SACE,6CAAC,0BAAQ,MAAK,MAAK,WAAS,IAAE,GAAG,OAC/B;AAAA,gDAAC,uBAAQ,SAAR,EAAgB,SAAO,IACtB,sDAAC,yBAAO,MAAM,MAAM,GACtB;AAAA,IAEA,4CAAC,wBAAM,MAAK,MAAK,UAAS,SACxB,uDAAC,uBAAQ,OAAR,EAAc,OAAK,IAAC,uBAAqB,IACxC;AAAA,kDAAC,uBAAQ,MAAM,OAAd,EAAoB,SAAQ,MAC3B,sDAAC,qBAAM,UAAN,EAAe,GAClB;AAAA,MACA;AAAA,QAAC,uBAAQ,MAAM;AAAA,QAAd;AAAA,UACC,WAAU;AAAA,UACV,YAAY,EAAE,SAAS,EAAE;AAAA,UACzB,WAAW,EAAE,SAAS,EAAE;AAAA;AAAA,MAC1B;AAAA,OACF,GACF;AAAA,IAEA;AAAA,MAAC,uBAAQ;AAAA,MAAR;AAAA,QACC,aAAa;AAAA,QACb,aAAY;AAAA,QACZ,YAAY,EAAE,GAAG,KAAK,SAAS,EAAE;AAAA,QACjC,WAAW,EAAE,GAAG,KAAK,SAAS,EAAE;AAAA,QAChC,SAAO;AAAA,QACP,WAAW;AAAA,UACT;AAAA,UACA;AAAA,YACE,SAAS;AAAA,cACP,mBAAmB;AAAA,YACrB;AAAA,UACF;AAAA,QACF;AAAA,QAEA;AAAA,sDAAC,uBAAQ,OAAR,EAAc,aAAa,GAAG,aAAY,gBAAe;AAAA,UAE1D,6CAAC,yBAAO,OAAM,MACZ;AAAA,yDAAC,yBAAO,OAAM,MACZ;AAAA,0DAAC,wBAAM,MAAK,MAAK,SAAS,MAAM,kBAEhC;AAAA,cACA,4CAAC,wBAAM,MAAK,MAAK,IAAI,MAAM;AAAA,eAC7B;AAAA,YAEA,4CAAC,uBAAQ,OAAR,EAAc,SAAO,IACpB;AAAA,cAAC;AAAA;AAAA,gBACC,MAAK;AAAA,gBACL,SAAS,MAAM;AAAA,gBAEf;AAAA,gBACD;AAAA;AAAA,YAED,GACF;AAAA,aACF;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ProgressDemo.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,WAAW,gBAAgB;
|
|
4
|
+
"mappings": "AAAA,SAAS,WAAW,gBAAgB;AAEpC,SAAS,QAAQ,WAAW,UAAU,QAAQ,QAAQ,cAAc;AAehE,mBAMM,KAJF,YAFJ;AAbG,SAAS,eAAe;AAC7B,QAAM,CAAC,MAAM,OAAO,IAAI,SAAS,CAAC,GAC5B,CAAC,UAAU,WAAW,IAAI,SAAS,EAAE,GACrC,WAAW,IAAI,IAAI;AAEzB,mBAAU,MAAM;AACd,UAAM,QAAQ,WAAW,MAAM,YAAY,EAAE,GAAG,GAAI;AACpD,WAAO,MAAM;AACX,mBAAa,KAAK;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC,GAGH,iCACE;AAAA,yBAAC,UAAO,QAAQ,IAAI,YAAW,UAAS,OAAK,IAC3C;AAAA,2BAAC,aAAU,QAAQ,IAAI,SAAS,KAAK;AAAA;AAAA,QAC5B;AAAA,SACT;AAAA,MACA,oBAAC,YAAS,MAAM,UAAU,OAAO,UAC/B,8BAAC,SAAS,WAAT,EAAmB,WAAU,UAAS,GACzC;AAAA,OACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,YAAW;AAAA,QACX,OAAK;AAAA,QACL,UAAS;AAAA,QACT,QAAO;AAAA,QACP,MAAK;AAAA,QACL,MAAM,EAAE,SAAS,OAAO;AAAA,QAExB;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,OAAO;AAAA,cACP,cAAc,CAAC,CAAC;AAAA,cAChB,KAAK;AAAA,cACL,KAAK;AAAA,cACL,MAAM;AAAA,cACN,eAAe,CAAC,CAAC,GAAG,MAAM;AACxB,wBAAQ,GAAG;AAAA,cACb;AAAA,cAEA;AAAA,oCAAC,OAAO,OAAP,EAAa,aAAa,GAAG,aAAY,WACxC,8BAAC,OAAO,aAAP,EAAmB,GACtB;AAAA,gBACA,oBAAC,OAAO,OAAP,EAAa,UAAQ,IAAC,OAAO,GAAG;AAAA;AAAA;AAAA,UACnC;AAAA,UAEA,oBAAC,UAAO,MAAK,MAAK,SAAS,MAAM,YAAY,CAAC,UAAU,OAAO,MAAM,GAAG,GAAG,kBAE3E;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -0,0 +1,64 @@
|
|
|
1
|
+
import { useEffect, useState } from "react";
|
|
2
|
+
import { Button, Paragraph, Progress, Slider, XStack, YStack } from "tamagui";
|
|
3
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
function ProgressDemo() {
|
|
5
|
+
const [size, setSize] = useState(4),
|
|
6
|
+
[progress, setProgress] = useState(20),
|
|
7
|
+
sizeProp = `$${size}`;
|
|
8
|
+
return useEffect(() => {
|
|
9
|
+
const timer = setTimeout(() => setProgress(60), 1e3);
|
|
10
|
+
return () => {
|
|
11
|
+
clearTimeout(timer);
|
|
12
|
+
};
|
|
13
|
+
}, []), /* @__PURE__ */jsxs(Fragment, {
|
|
14
|
+
children: [/* @__PURE__ */jsxs(YStack, {
|
|
15
|
+
height: 60,
|
|
16
|
+
alignItems: "center",
|
|
17
|
+
space: !0,
|
|
18
|
+
children: [/* @__PURE__ */jsxs(Paragraph, {
|
|
19
|
+
height: 30,
|
|
20
|
+
opacity: 0.5,
|
|
21
|
+
children: ["Size: ", size]
|
|
22
|
+
}), /* @__PURE__ */jsx(Progress, {
|
|
23
|
+
size: sizeProp,
|
|
24
|
+
value: progress,
|
|
25
|
+
children: /* @__PURE__ */jsx(Progress.Indicator, {
|
|
26
|
+
animation: "bouncy"
|
|
27
|
+
})
|
|
28
|
+
})]
|
|
29
|
+
}), /* @__PURE__ */jsxs(XStack, {
|
|
30
|
+
alignItems: "center",
|
|
31
|
+
space: !0,
|
|
32
|
+
position: "absolute",
|
|
33
|
+
bottom: "$3",
|
|
34
|
+
left: "$4",
|
|
35
|
+
$xxs: {
|
|
36
|
+
display: "none"
|
|
37
|
+
},
|
|
38
|
+
children: [/* @__PURE__ */jsxs(Slider, {
|
|
39
|
+
size: "$2",
|
|
40
|
+
width: 130,
|
|
41
|
+
defaultValue: [4],
|
|
42
|
+
min: 2,
|
|
43
|
+
max: 6,
|
|
44
|
+
step: 1,
|
|
45
|
+
onValueChange: ([val]) => {
|
|
46
|
+
setSize(val);
|
|
47
|
+
},
|
|
48
|
+
children: [/* @__PURE__ */jsx(Slider.Track, {
|
|
49
|
+
borderWidth: 1,
|
|
50
|
+
borderColor: "$color5",
|
|
51
|
+
children: /* @__PURE__ */jsx(Slider.TrackActive, {})
|
|
52
|
+
}), /* @__PURE__ */jsx(Slider.Thumb, {
|
|
53
|
+
circular: !0,
|
|
54
|
+
index: 0
|
|
55
|
+
})]
|
|
56
|
+
}), /* @__PURE__ */jsx(Button, {
|
|
57
|
+
size: "$2",
|
|
58
|
+
onPress: () => setProgress(prev => (prev + 20) % 100),
|
|
59
|
+
children: "Load"
|
|
60
|
+
})]
|
|
61
|
+
})]
|
|
62
|
+
});
|
|
63
|
+
}
|
|
64
|
+
export { ProgressDemo };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ProgressDemo.tsx"],
|
|
4
|
-
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAoC,
|
|
4
|
+
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAoC,kBAEpC,iBAAoE,oBAehE;AAbG,SAAS,eAAe;AAC7B,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,CAAC,GAC5B,CAAC,UAAU,WAAW,QAAI,uBAAS,EAAE,GACrC,WAAW,IAAI,IAAI;AAEzB,qCAAU,MAAM;AACd,UAAM,QAAQ,WAAW,MAAM,YAAY,EAAE,GAAG,GAAI;AACpD,WAAO,MAAM;AACX,mBAAa,KAAK;AAAA,IACpB;AAAA,EACF,GAAG,CAAC,CAAC,GAGH,4EACE;AAAA,iDAAC,yBAAO,QAAQ,IAAI,YAAW,UAAS,OAAK,IAC3C;AAAA,mDAAC,4BAAU,QAAQ,IAAI,SAAS,KAAK;AAAA;AAAA,QAC5B;AAAA,SACT;AAAA,MACA,4CAAC,2BAAS,MAAM,UAAU,OAAO,UAC/B,sDAAC,wBAAS,WAAT,EAAmB,WAAU,UAAS,GACzC;AAAA,OACF;AAAA,IAEA;AAAA,MAAC;AAAA;AAAA,QACC,YAAW;AAAA,QACX,OAAK;AAAA,QACL,UAAS;AAAA,QACT,QAAO;AAAA,QACP,MAAK;AAAA,QACL,MAAM,EAAE,SAAS,OAAO;AAAA,QAExB;AAAA;AAAA,YAAC;AAAA;AAAA,cACC,MAAK;AAAA,cACL,OAAO;AAAA,cACP,cAAc,CAAC,CAAC;AAAA,cAChB,KAAK;AAAA,cACL,KAAK;AAAA,cACL,MAAM;AAAA,cACN,eAAe,CAAC,CAAC,GAAG,MAAM;AACxB,wBAAQ,GAAG;AAAA,cACb;AAAA,cAEA;AAAA,4DAAC,sBAAO,OAAP,EAAa,aAAa,GAAG,aAAY,WACxC,sDAAC,sBAAO,aAAP,EAAmB,GACtB;AAAA,gBACA,4CAAC,sBAAO,OAAP,EAAa,UAAQ,IAAC,OAAO,GAAG;AAAA;AAAA;AAAA,UACnC;AAAA,UAEA,4CAAC,yBAAO,MAAK,MAAK,SAAS,MAAM,YAAY,CAAC,UAAU,OAAO,MAAM,GAAG,GAAG,kBAE3E;AAAA;AAAA;AAAA,IACF;AAAA,KACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/RadioGroupDemo.tsx"],
|
|
4
|
-
"mappings": "
|
|
4
|
+
"mappings": "AACA,SAAS,OAAO,YAAY,QAAQ,cAAc;AAK5C,SACE,KADF;AAHC,SAAS,iBAAiB;AAC/B,SACE,oBAAC,cAAW,mBAAgB,mBAAkB,cAAa,KAAI,MAAK,QAClE,+BAAC,UAAO,OAAO,KAAK,YAAW,UAAS,OAAM,MAC5C;AAAA,wBAAC,2BAAwB,MAAK,MAAK,OAAM,KAAI,OAAM,gBAAe;AAAA,IAClE,oBAAC,2BAAwB,MAAK,MAAK,OAAM,KAAI,OAAM,eAAc;AAAA,IACjE,oBAAC,2BAAwB,MAAK,MAAK,OAAM,KAAI,OAAM,gBAAe;AAAA,KACpE,GACF;AAEJ;AAEO,SAAS,wBAAwB,OAIrC;AACD,QAAM,KAAK,cAAc,MAAM,KAAK;AACpC,SACE,qBAAC,UAAO,OAAO,KAAK,YAAW,UAAS,OAAM,MAC5C;AAAA,wBAAC,WAAW,MAAX,EAAgB,OAAO,MAAM,OAAO,IAAQ,MAAM,MAAM,MACvD,8BAAC,WAAW,WAAX,EAAqB,GACxB;AAAA,IAEA,oBAAC,SAAM,MAAM,MAAM,MAAM,SAAS,IAC/B,gBAAM,OACT;AAAA,KACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -0,0 +1,46 @@
|
|
|
1
|
+
import { Label, RadioGroup, XStack, YStack } from "tamagui";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
function RadioGroupDemo() {
|
|
4
|
+
return /* @__PURE__ */jsx(RadioGroup, {
|
|
5
|
+
"aria-labelledby": "Select one item",
|
|
6
|
+
defaultValue: "3",
|
|
7
|
+
name: "form",
|
|
8
|
+
children: /* @__PURE__ */jsxs(YStack, {
|
|
9
|
+
width: 300,
|
|
10
|
+
alignItems: "center",
|
|
11
|
+
space: "$2",
|
|
12
|
+
children: [/* @__PURE__ */jsx(RadioGroupItemWithLabel, {
|
|
13
|
+
size: "$3",
|
|
14
|
+
value: "2",
|
|
15
|
+
label: "Second value"
|
|
16
|
+
}), /* @__PURE__ */jsx(RadioGroupItemWithLabel, {
|
|
17
|
+
size: "$4",
|
|
18
|
+
value: "3",
|
|
19
|
+
label: "Third value"
|
|
20
|
+
}), /* @__PURE__ */jsx(RadioGroupItemWithLabel, {
|
|
21
|
+
size: "$5",
|
|
22
|
+
value: "4",
|
|
23
|
+
label: "Fourth value"
|
|
24
|
+
})]
|
|
25
|
+
})
|
|
26
|
+
});
|
|
27
|
+
}
|
|
28
|
+
function RadioGroupItemWithLabel(props) {
|
|
29
|
+
const id = `radiogroup-${props.value}`;
|
|
30
|
+
return /* @__PURE__ */jsxs(XStack, {
|
|
31
|
+
width: 300,
|
|
32
|
+
alignItems: "center",
|
|
33
|
+
space: "$4",
|
|
34
|
+
children: [/* @__PURE__ */jsx(RadioGroup.Item, {
|
|
35
|
+
value: props.value,
|
|
36
|
+
id,
|
|
37
|
+
size: props.size,
|
|
38
|
+
children: /* @__PURE__ */jsx(RadioGroup.Indicator, {})
|
|
39
|
+
}), /* @__PURE__ */jsx(Label, {
|
|
40
|
+
size: props.size,
|
|
41
|
+
htmlFor: id,
|
|
42
|
+
children: props.label
|
|
43
|
+
})]
|
|
44
|
+
});
|
|
45
|
+
}
|
|
46
|
+
export { RadioGroupDemo, RadioGroupItemWithLabel };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/RadioGroupDemo.tsx"],
|
|
4
|
-
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AACA,qBAAkD,oBAK5C;AAHC,SAAS,iBAAiB;AAC/B,SACE,4CAAC,6BAAW,mBAAgB,mBAAkB,cAAa,KAAI,MAAK,QAClE,uDAAC,yBAAO,OAAO,KAAK,YAAW,UAAS,OAAM,MAC5C;AAAA,gDAAC,2BAAwB,MAAK,MAAK,OAAM,KAAI,OAAM,gBAAe;AAAA,IAClE,4CAAC,2BAAwB,MAAK,MAAK,OAAM,KAAI,OAAM,eAAc;AAAA,IACjE,4CAAC,2BAAwB,MAAK,MAAK,OAAM,KAAI,OAAM,gBAAe;AAAA,KACpE,GACF;AAEJ;AAEO,SAAS,wBAAwB,OAIrC;AACD,QAAM,KAAK,cAAc,MAAM,KAAK;AACpC,SACE,6CAAC,yBAAO,OAAO,KAAK,YAAW,UAAS,OAAM,MAC5C;AAAA,gDAAC,0BAAW,MAAX,EAAgB,OAAO,MAAM,OAAO,IAAQ,MAAM,MAAM,MACvD,sDAAC,0BAAW,WAAX,EAAqB,GACxB;AAAA,IAEA,4CAAC,wBAAM,MAAM,MAAM,MAAM,SAAS,IAC/B,gBAAM,OACT;AAAA,KACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
import { addTheme, replaceTheme } from "@tamagui/theme";
|
|
2
|
+
import { useState } from "react";
|
|
3
|
+
import { Button, Square, Theme, XStack, YStack, useForceUpdate, useIsomorphicLayoutEffect } from "tamagui";
|
|
4
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
5
|
+
function ReplaceThemeDemo() {
|
|
6
|
+
const [theme, setTheme] = useState(),
|
|
7
|
+
update = useForceUpdate();
|
|
8
|
+
return useIsomorphicLayoutEffect(() => {
|
|
9
|
+
addTheme({
|
|
10
|
+
name: "mytheme",
|
|
11
|
+
insertCSS: !0,
|
|
12
|
+
theme: {
|
|
13
|
+
color: "red",
|
|
14
|
+
color2: "green"
|
|
15
|
+
}
|
|
16
|
+
}), setTheme("mytheme");
|
|
17
|
+
}, []), /* @__PURE__ */jsxs(YStack, {
|
|
18
|
+
alignItems: "center",
|
|
19
|
+
space: !0,
|
|
20
|
+
children: [/* @__PURE__ */jsx(XStack, {
|
|
21
|
+
gap: "$5",
|
|
22
|
+
children: /* @__PURE__ */jsx(Theme, {
|
|
23
|
+
name: theme ?? null,
|
|
24
|
+
children: /* @__PURE__ */jsx(Square, {
|
|
25
|
+
borderRadius: "$8",
|
|
26
|
+
size: 100,
|
|
27
|
+
backgroundColor: "$color"
|
|
28
|
+
})
|
|
29
|
+
})
|
|
30
|
+
}), /* @__PURE__ */jsx(Button, {
|
|
31
|
+
onPress: () => {
|
|
32
|
+
replaceTheme({
|
|
33
|
+
name: "mytheme",
|
|
34
|
+
theme: {
|
|
35
|
+
color: "blue"
|
|
36
|
+
}
|
|
37
|
+
}), update();
|
|
38
|
+
},
|
|
39
|
+
children: "Replace theme to only have $color: blue"
|
|
40
|
+
})]
|
|
41
|
+
});
|
|
42
|
+
}
|
|
43
|
+
export { ReplaceThemeDemo };
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
import { Circle, ScrollView, Square, XStack } from "tamagui";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
function ScrollViewDemo() {
|
|
4
|
+
return /* @__PURE__ */jsx(ScrollView, {
|
|
5
|
+
maxHeight: 250,
|
|
6
|
+
width: "75%",
|
|
7
|
+
backgroundColor: "$background",
|
|
8
|
+
padding: "$4",
|
|
9
|
+
borderRadius: "$4",
|
|
10
|
+
children: /* @__PURE__ */jsxs(XStack, {
|
|
11
|
+
flexWrap: "wrap",
|
|
12
|
+
alignItems: "center",
|
|
13
|
+
justifyContent: "center",
|
|
14
|
+
children: [/* @__PURE__ */jsx(Square, {
|
|
15
|
+
margin: "$4",
|
|
16
|
+
size: 120,
|
|
17
|
+
backgroundColor: "$red9"
|
|
18
|
+
}), /* @__PURE__ */jsx(Circle, {
|
|
19
|
+
margin: "$4",
|
|
20
|
+
size: 120,
|
|
21
|
+
backgroundColor: "$orange9"
|
|
22
|
+
}), /* @__PURE__ */jsx(Square, {
|
|
23
|
+
margin: "$4",
|
|
24
|
+
size: 120,
|
|
25
|
+
backgroundColor: "$yellow9"
|
|
26
|
+
}), /* @__PURE__ */jsx(Circle, {
|
|
27
|
+
margin: "$4",
|
|
28
|
+
size: 120,
|
|
29
|
+
backgroundColor: "$green9"
|
|
30
|
+
}), /* @__PURE__ */jsx(Square, {
|
|
31
|
+
margin: "$4",
|
|
32
|
+
size: 120,
|
|
33
|
+
backgroundColor: "$blue9"
|
|
34
|
+
}), /* @__PURE__ */jsx(Circle, {
|
|
35
|
+
margin: "$4",
|
|
36
|
+
size: 120,
|
|
37
|
+
backgroundColor: "$purple9"
|
|
38
|
+
}), /* @__PURE__ */jsx(Square, {
|
|
39
|
+
margin: "$4",
|
|
40
|
+
size: 120,
|
|
41
|
+
backgroundColor: "$pink9"
|
|
42
|
+
}), /* @__PURE__ */jsx(Circle, {
|
|
43
|
+
margin: "$4",
|
|
44
|
+
size: 120,
|
|
45
|
+
backgroundColor: "$red9"
|
|
46
|
+
})]
|
|
47
|
+
})
|
|
48
|
+
});
|
|
49
|
+
}
|
|
50
|
+
export { ScrollViewDemo };
|
package/dist/esm/SelectDemo.js
CHANGED
|
@@ -1,14 +1,6 @@
|
|
|
1
1
|
import { Check, ChevronDown, ChevronUp } from "@tamagui/lucide-icons";
|
|
2
2
|
import { useMemo, useState } from "react";
|
|
3
|
-
import {
|
|
4
|
-
Adapt,
|
|
5
|
-
Label,
|
|
6
|
-
Select,
|
|
7
|
-
Sheet,
|
|
8
|
-
XStack,
|
|
9
|
-
YStack,
|
|
10
|
-
getFontSize
|
|
11
|
-
} from "tamagui";
|
|
3
|
+
import { Adapt, Label, Select, Sheet, XStack, YStack, getFontSize } from "tamagui";
|
|
12
4
|
import { LinearGradient } from "tamagui/linear-gradient";
|
|
13
5
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
14
6
|
function SelectDemo() {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SelectDemo.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,OAAO,aAAa,iBAAiB;AAC9C,SAAS,SAAS,gBAAgB;
|
|
4
|
+
"mappings": "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",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -0,0 +1,188 @@
|
|
|
1
|
+
import { Check, ChevronDown, ChevronUp } from "@tamagui/lucide-icons";
|
|
2
|
+
import { useMemo, useState } from "react";
|
|
3
|
+
import { Adapt, Label, Select, Sheet, XStack, YStack, getFontSize } from "tamagui";
|
|
4
|
+
import { LinearGradient } from "tamagui/linear-gradient";
|
|
5
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
6
|
+
function SelectDemo() {
|
|
7
|
+
return /* @__PURE__ */jsxs(YStack, {
|
|
8
|
+
space: !0,
|
|
9
|
+
children: [/* @__PURE__ */jsxs(XStack, {
|
|
10
|
+
ai: "center",
|
|
11
|
+
space: !0,
|
|
12
|
+
children: [/* @__PURE__ */jsx(Label, {
|
|
13
|
+
f: 1,
|
|
14
|
+
fb: 0,
|
|
15
|
+
children: "Custom"
|
|
16
|
+
}), /* @__PURE__ */jsx(SelectDemoItem, {})]
|
|
17
|
+
}), /* @__PURE__ */jsxs(XStack, {
|
|
18
|
+
ai: "center",
|
|
19
|
+
space: !0,
|
|
20
|
+
children: [/* @__PURE__ */jsx(Label, {
|
|
21
|
+
f: 1,
|
|
22
|
+
fb: 0,
|
|
23
|
+
children: "Native"
|
|
24
|
+
}), /* @__PURE__ */jsx(SelectDemoItem, {
|
|
25
|
+
native: !0
|
|
26
|
+
})]
|
|
27
|
+
})]
|
|
28
|
+
});
|
|
29
|
+
}
|
|
30
|
+
function SelectDemoItem(props) {
|
|
31
|
+
const [val, setVal] = useState("apple");
|
|
32
|
+
return /* @__PURE__ */jsxs(Select, {
|
|
33
|
+
id: "food",
|
|
34
|
+
value: val,
|
|
35
|
+
onValueChange: setVal,
|
|
36
|
+
disablePreventBodyScroll: !0,
|
|
37
|
+
...props,
|
|
38
|
+
children: [/* @__PURE__ */jsx(Select.Trigger, {
|
|
39
|
+
width: 220,
|
|
40
|
+
iconAfter: ChevronDown,
|
|
41
|
+
children: /* @__PURE__ */jsx(Select.Value, {
|
|
42
|
+
placeholder: "Something"
|
|
43
|
+
})
|
|
44
|
+
}), /* @__PURE__ */jsx(Adapt, {
|
|
45
|
+
when: "sm",
|
|
46
|
+
platform: "touch",
|
|
47
|
+
children: /* @__PURE__ */jsxs(Sheet, {
|
|
48
|
+
native: !!props.native,
|
|
49
|
+
modal: !0,
|
|
50
|
+
dismissOnSnapToBottom: !0,
|
|
51
|
+
animationConfig: {
|
|
52
|
+
type: "spring",
|
|
53
|
+
damping: 20,
|
|
54
|
+
mass: 1.2,
|
|
55
|
+
stiffness: 250
|
|
56
|
+
},
|
|
57
|
+
children: [/* @__PURE__ */jsx(Sheet.Frame, {
|
|
58
|
+
children: /* @__PURE__ */jsx(Sheet.ScrollView, {
|
|
59
|
+
children: /* @__PURE__ */jsx(Adapt.Contents, {})
|
|
60
|
+
})
|
|
61
|
+
}), /* @__PURE__ */jsx(Sheet.Overlay, {
|
|
62
|
+
animation: "lazy",
|
|
63
|
+
enterStyle: {
|
|
64
|
+
opacity: 0
|
|
65
|
+
},
|
|
66
|
+
exitStyle: {
|
|
67
|
+
opacity: 0
|
|
68
|
+
}
|
|
69
|
+
})]
|
|
70
|
+
})
|
|
71
|
+
}), /* @__PURE__ */jsxs(Select.Content, {
|
|
72
|
+
zIndex: 2e5,
|
|
73
|
+
children: [/* @__PURE__ */jsxs(Select.ScrollUpButton, {
|
|
74
|
+
alignItems: "center",
|
|
75
|
+
justifyContent: "center",
|
|
76
|
+
position: "relative",
|
|
77
|
+
width: "100%",
|
|
78
|
+
height: "$3",
|
|
79
|
+
children: [/* @__PURE__ */jsx(YStack, {
|
|
80
|
+
zIndex: 10,
|
|
81
|
+
children: /* @__PURE__ */jsx(ChevronUp, {
|
|
82
|
+
size: 20
|
|
83
|
+
})
|
|
84
|
+
}), /* @__PURE__ */jsx(LinearGradient, {
|
|
85
|
+
start: [0, 0],
|
|
86
|
+
end: [0, 1],
|
|
87
|
+
fullscreen: !0,
|
|
88
|
+
colors: ["$background", "transparent"],
|
|
89
|
+
borderRadius: "$4"
|
|
90
|
+
})]
|
|
91
|
+
}), /* @__PURE__ */jsxs(Select.Viewport, {
|
|
92
|
+
minWidth: 200,
|
|
93
|
+
children: [/* @__PURE__ */jsxs(Select.Group, {
|
|
94
|
+
children: [/* @__PURE__ */jsx(Select.Label, {
|
|
95
|
+
children: "Fruits"
|
|
96
|
+
}), useMemo(() => items.map((item, i) => /* @__PURE__ */jsxs(Select.Item, {
|
|
97
|
+
index: i,
|
|
98
|
+
value: item.name.toLowerCase(),
|
|
99
|
+
children: [/* @__PURE__ */jsx(Select.ItemText, {
|
|
100
|
+
children: item.name
|
|
101
|
+
}), /* @__PURE__ */jsx(Select.ItemIndicator, {
|
|
102
|
+
marginLeft: "auto",
|
|
103
|
+
children: /* @__PURE__ */jsx(Check, {
|
|
104
|
+
size: 16
|
|
105
|
+
})
|
|
106
|
+
})]
|
|
107
|
+
}, item.name)), [items])]
|
|
108
|
+
}), props.native && /* @__PURE__ */jsx(YStack, {
|
|
109
|
+
position: "absolute",
|
|
110
|
+
right: 0,
|
|
111
|
+
top: 0,
|
|
112
|
+
bottom: 0,
|
|
113
|
+
alignItems: "center",
|
|
114
|
+
justifyContent: "center",
|
|
115
|
+
width: "$4",
|
|
116
|
+
pointerEvents: "none",
|
|
117
|
+
children: /* @__PURE__ */jsx(ChevronDown, {
|
|
118
|
+
size: getFontSize(props.size ?? "$true")
|
|
119
|
+
})
|
|
120
|
+
})]
|
|
121
|
+
}), /* @__PURE__ */jsxs(Select.ScrollDownButton, {
|
|
122
|
+
alignItems: "center",
|
|
123
|
+
justifyContent: "center",
|
|
124
|
+
position: "relative",
|
|
125
|
+
width: "100%",
|
|
126
|
+
height: "$3",
|
|
127
|
+
children: [/* @__PURE__ */jsx(YStack, {
|
|
128
|
+
zIndex: 10,
|
|
129
|
+
children: /* @__PURE__ */jsx(ChevronDown, {
|
|
130
|
+
size: 20
|
|
131
|
+
})
|
|
132
|
+
}), /* @__PURE__ */jsx(LinearGradient, {
|
|
133
|
+
start: [0, 0],
|
|
134
|
+
end: [0, 1],
|
|
135
|
+
fullscreen: !0,
|
|
136
|
+
colors: ["transparent", "$background"],
|
|
137
|
+
borderRadius: "$4"
|
|
138
|
+
})]
|
|
139
|
+
})]
|
|
140
|
+
})]
|
|
141
|
+
});
|
|
142
|
+
}
|
|
143
|
+
const items = [{
|
|
144
|
+
name: "Apple"
|
|
145
|
+
}, {
|
|
146
|
+
name: "Pear"
|
|
147
|
+
}, {
|
|
148
|
+
name: "Blackberry"
|
|
149
|
+
}, {
|
|
150
|
+
name: "Peach"
|
|
151
|
+
}, {
|
|
152
|
+
name: "Apricot"
|
|
153
|
+
}, {
|
|
154
|
+
name: "Melon"
|
|
155
|
+
}, {
|
|
156
|
+
name: "Honeydew"
|
|
157
|
+
}, {
|
|
158
|
+
name: "Starfruit"
|
|
159
|
+
}, {
|
|
160
|
+
name: "Blueberry"
|
|
161
|
+
}, {
|
|
162
|
+
name: "Raspberry"
|
|
163
|
+
}, {
|
|
164
|
+
name: "Strawberry"
|
|
165
|
+
}, {
|
|
166
|
+
name: "Mango"
|
|
167
|
+
}, {
|
|
168
|
+
name: "Pineapple"
|
|
169
|
+
}, {
|
|
170
|
+
name: "Lime"
|
|
171
|
+
}, {
|
|
172
|
+
name: "Lemon"
|
|
173
|
+
}, {
|
|
174
|
+
name: "Coconut"
|
|
175
|
+
}, {
|
|
176
|
+
name: "Guava"
|
|
177
|
+
}, {
|
|
178
|
+
name: "Papaya"
|
|
179
|
+
}, {
|
|
180
|
+
name: "Orange"
|
|
181
|
+
}, {
|
|
182
|
+
name: "Grape"
|
|
183
|
+
}, {
|
|
184
|
+
name: "Jackfruit"
|
|
185
|
+
}, {
|
|
186
|
+
name: "Durian"
|
|
187
|
+
}];
|
|
188
|
+
export { SelectDemo, SelectDemoItem };
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SelectDemo.tsx"],
|
|
4
|
-
"mappings": ";;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,0BAA8C,kCAC9C,eAAkC,
|
|
4
|
+
"mappings": "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",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { Paragraph, Separator, XStack, YStack } from "tamagui";
|
|
2
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
3
|
+
function SeparatorDemo() {
|
|
4
|
+
return /* @__PURE__ */jsxs(YStack, {
|
|
5
|
+
width: "100%",
|
|
6
|
+
maxWidth: 300,
|
|
7
|
+
marginHorizontal: 15,
|
|
8
|
+
children: [/* @__PURE__ */jsx(Paragraph, {
|
|
9
|
+
fontWeight: "800",
|
|
10
|
+
children: "Tamagui"
|
|
11
|
+
}), /* @__PURE__ */jsx(Paragraph, {
|
|
12
|
+
children: "A cross-platform component library."
|
|
13
|
+
}), /* @__PURE__ */jsx(Separator, {
|
|
14
|
+
marginVertical: 15
|
|
15
|
+
}), /* @__PURE__ */jsxs(XStack, {
|
|
16
|
+
height: 20,
|
|
17
|
+
alignItems: "center",
|
|
18
|
+
children: [/* @__PURE__ */jsx(Paragraph, {
|
|
19
|
+
children: "Blog"
|
|
20
|
+
}), /* @__PURE__ */jsx(Separator, {
|
|
21
|
+
alignSelf: "stretch",
|
|
22
|
+
vertical: !0,
|
|
23
|
+
marginHorizontal: 15
|
|
24
|
+
}), /* @__PURE__ */jsx(Paragraph, {
|
|
25
|
+
children: "Docs"
|
|
26
|
+
}), /* @__PURE__ */jsx(Separator, {
|
|
27
|
+
alignSelf: "stretch",
|
|
28
|
+
vertical: !0,
|
|
29
|
+
marginHorizontal: 15
|
|
30
|
+
}), /* @__PURE__ */jsx(Paragraph, {
|
|
31
|
+
children: "Source"
|
|
32
|
+
})]
|
|
33
|
+
})]
|
|
34
|
+
});
|
|
35
|
+
}
|
|
36
|
+
export { SeparatorDemo };
|