@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.
- package/dist/cjs/AddThemeDemo.js +1 -59
- package/dist/cjs/AddThemeDemo.js.map +2 -2
- package/dist/cjs/AlertDialogDemo.js +1 -76
- package/dist/cjs/AlertDialogDemo.js.map +2 -2
- package/dist/cjs/AnimationsDemo.js +1 -113
- package/dist/cjs/AnimationsDemo.js.map +2 -2
- package/dist/cjs/AnimationsEnterDemo.js +1 -63
- package/dist/cjs/AnimationsEnterDemo.js.map +2 -2
- package/dist/cjs/AnimationsHoverDemo.js +1 -49
- package/dist/cjs/AnimationsHoverDemo.js.map +2 -2
- package/dist/cjs/AnimationsPresenceDemo.js +1 -96
- package/dist/cjs/AnimationsPresenceDemo.js.map +2 -2
- package/dist/cjs/AnimationsTimingDemo.js +1 -49
- package/dist/cjs/AnimationsTimingDemo.js.map +2 -2
- package/dist/cjs/AvatarDemo.js +1 -53
- package/dist/cjs/AvatarDemo.js.map +2 -2
- package/dist/cjs/ButtonDemo.js +1 -48
- package/dist/cjs/ButtonDemo.js.map +2 -2
- package/dist/cjs/CardDemo.js +1 -69
- package/dist/cjs/CardDemo.js.map +2 -2
- package/dist/cjs/CheckboxDemo.js +1 -44
- package/dist/cjs/CheckboxDemo.js.map +2 -2
- package/dist/cjs/ColorsDemo.js +1 -112
- package/dist/cjs/ColorsDemo.js.map +2 -2
- package/dist/cjs/DialogDemo.js +1 -85
- package/dist/cjs/DialogDemo.js.map +2 -2
- package/dist/cjs/FormsDemo.js +1 -59
- package/dist/cjs/FormsDemo.js.map +2 -2
- package/dist/cjs/GroupDemo.js +1 -48
- package/dist/cjs/GroupDemo.js.map +2 -2
- package/dist/cjs/HeadingsDemo.js +1 -39
- package/dist/cjs/HeadingsDemo.js.map +2 -2
- package/dist/cjs/ImageDemo.js +1 -32
- package/dist/cjs/ImageDemo.js.map +2 -2
- package/dist/cjs/InputsDemo.js +1 -43
- package/dist/cjs/InputsDemo.js.map +2 -2
- package/dist/cjs/LabelDemo.js +1 -41
- package/dist/cjs/LabelDemo.js.map +2 -2
- package/dist/cjs/LinearGradientDemo.js +1 -56
- package/dist/cjs/LinearGradientDemo.js.map +2 -2
- package/dist/cjs/ListItemDemo.js +1 -70
- package/dist/cjs/ListItemDemo.js.map +2 -2
- package/dist/cjs/LucideIconsDemo.js +1 -66
- package/dist/cjs/LucideIconsDemo.js.map +2 -2
- package/dist/cjs/PopoverDemo.js +1 -92
- package/dist/cjs/PopoverDemo.js.map +2 -2
- package/dist/cjs/ProgressDemo.js +1 -71
- package/dist/cjs/ProgressDemo.js.map +2 -2
- package/dist/cjs/RadioGroupDemo.js +1 -43
- package/dist/cjs/RadioGroupDemo.js.map +2 -2
- package/dist/cjs/ScrollViewDemo.js +1 -41
- package/dist/cjs/ScrollViewDemo.js.map +2 -2
- package/dist/cjs/SelectDemo.js +1 -103
- package/dist/cjs/SelectDemo.js.map +2 -2
- package/dist/cjs/SeparatorDemo.js +1 -43
- package/dist/cjs/SeparatorDemo.js.map +2 -2
- package/dist/cjs/ShapesDemo.js +1 -35
- package/dist/cjs/ShapesDemo.js.map +2 -2
- package/dist/cjs/SheetDemo.js +1 -103
- package/dist/cjs/SheetDemo.js.map +2 -2
- package/dist/cjs/SliderDemo.js +1 -42
- package/dist/cjs/SliderDemo.js.map +2 -2
- package/dist/cjs/SpinnerDemo.js +1 -35
- package/dist/cjs/SpinnerDemo.js.map +2 -2
- package/dist/cjs/StacksDemo.js +1 -81
- package/dist/cjs/StacksDemo.js.map +2 -2
- package/dist/cjs/SwitchDemo.js +1 -55
- package/dist/cjs/SwitchDemo.js.map +2 -2
- package/dist/cjs/TabsAdvancedDemo.js +1 -282
- package/dist/cjs/TabsAdvancedDemo.js.map +2 -2
- package/dist/cjs/TabsDemo.js +1 -146
- package/dist/cjs/TabsDemo.js.map +2 -2
- package/dist/cjs/TextDemo.js +1 -39
- package/dist/cjs/TextDemo.js.map +2 -2
- package/dist/cjs/ThemeInverseDemo.js +1 -43
- package/dist/cjs/ThemeInverseDemo.js.map +2 -2
- package/dist/cjs/ToastDemo.js +1 -128
- package/dist/cjs/ToastDemo.js.map +3 -3
- package/dist/cjs/ToastDuplicateDemo.js +1 -77
- package/dist/cjs/ToastDuplicateDemo.js.map +2 -2
- package/dist/cjs/ToggleGroupDemo.js +1 -72
- package/dist/cjs/ToggleGroupDemo.js.map +2 -2
- package/dist/cjs/TokensDemo.js +1 -110
- package/dist/cjs/TokensDemo.js.map +2 -2
- package/dist/cjs/TooltipDemo.js +1 -79
- package/dist/cjs/TooltipDemo.js.map +2 -2
- package/dist/cjs/UpdateThemeDemo.js +1 -79
- package/dist/cjs/UpdateThemeDemo.js.map +2 -2
- package/dist/cjs/conf.js +1 -28
- package/dist/cjs/conf.js.map +2 -2
- package/dist/cjs/index.js +1 -159
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/tamagui.config.js +1 -27
- package/dist/cjs/tamagui.config.js.map +2 -2
- package/dist/cjs/useOnIntersecting.js +1 -92
- package/dist/cjs/useOnIntersecting.js.map +2 -2
- package/dist/esm/AddThemeDemo.js +1 -35
- package/dist/esm/AddThemeDemo.js.map +2 -2
- package/dist/esm/AddThemeDemo.mjs +1 -35
- package/dist/esm/AddThemeDemo.mjs.map +2 -2
- package/dist/esm/AlertDialogDemo.js +1 -52
- package/dist/esm/AlertDialogDemo.js.map +2 -2
- package/dist/esm/AlertDialogDemo.mjs +1 -52
- package/dist/esm/AlertDialogDemo.mjs.map +2 -2
- package/dist/esm/AnimationsDemo.js +1 -88
- package/dist/esm/AnimationsDemo.js.map +2 -2
- package/dist/esm/AnimationsDemo.mjs +1 -88
- package/dist/esm/AnimationsDemo.mjs.map +2 -2
- package/dist/esm/AnimationsEnterDemo.js +1 -39
- package/dist/esm/AnimationsEnterDemo.js.map +2 -2
- package/dist/esm/AnimationsEnterDemo.mjs +1 -39
- package/dist/esm/AnimationsEnterDemo.mjs.map +2 -2
- package/dist/esm/AnimationsHoverDemo.js +1 -25
- package/dist/esm/AnimationsHoverDemo.js.map +2 -2
- package/dist/esm/AnimationsHoverDemo.mjs +1 -25
- package/dist/esm/AnimationsHoverDemo.mjs.map +2 -2
- package/dist/esm/AnimationsPresenceDemo.js +1 -61
- package/dist/esm/AnimationsPresenceDemo.js.map +2 -2
- package/dist/esm/AnimationsPresenceDemo.mjs +1 -61
- package/dist/esm/AnimationsPresenceDemo.mjs.map +2 -2
- package/dist/esm/AnimationsTimingDemo.js +1 -25
- package/dist/esm/AnimationsTimingDemo.js.map +2 -2
- package/dist/esm/AnimationsTimingDemo.mjs +1 -25
- package/dist/esm/AnimationsTimingDemo.mjs.map +2 -2
- package/dist/esm/AvatarDemo.js +1 -29
- package/dist/esm/AvatarDemo.js.map +2 -2
- package/dist/esm/AvatarDemo.mjs +1 -29
- package/dist/esm/AvatarDemo.mjs.map +2 -2
- package/dist/esm/ButtonDemo.js +1 -24
- package/dist/esm/ButtonDemo.js.map +2 -2
- package/dist/esm/ButtonDemo.mjs +1 -24
- package/dist/esm/ButtonDemo.mjs.map +2 -2
- package/dist/esm/CardDemo.js +1 -45
- package/dist/esm/CardDemo.js.map +2 -2
- package/dist/esm/CardDemo.mjs +1 -45
- package/dist/esm/CardDemo.mjs.map +2 -2
- package/dist/esm/CheckboxDemo.js +1 -20
- package/dist/esm/CheckboxDemo.js.map +2 -2
- package/dist/esm/CheckboxDemo.mjs +1 -20
- package/dist/esm/CheckboxDemo.mjs.map +2 -2
- package/dist/esm/ColorsDemo.js +1 -97
- package/dist/esm/ColorsDemo.js.map +2 -2
- package/dist/esm/ColorsDemo.mjs +1 -97
- package/dist/esm/ColorsDemo.mjs.map +2 -2
- package/dist/esm/DialogDemo.js +1 -73
- package/dist/esm/DialogDemo.js.map +2 -2
- package/dist/esm/DialogDemo.mjs +1 -73
- package/dist/esm/DialogDemo.mjs.map +2 -2
- package/dist/esm/FormsDemo.js +1 -35
- package/dist/esm/FormsDemo.js.map +2 -2
- package/dist/esm/FormsDemo.mjs +1 -35
- package/dist/esm/FormsDemo.mjs.map +2 -2
- package/dist/esm/GroupDemo.js +1 -24
- package/dist/esm/GroupDemo.js.map +2 -2
- package/dist/esm/GroupDemo.mjs +1 -24
- package/dist/esm/GroupDemo.mjs.map +2 -2
- package/dist/esm/HeadingsDemo.js +1 -15
- package/dist/esm/HeadingsDemo.js.map +2 -2
- package/dist/esm/HeadingsDemo.mjs +1 -15
- package/dist/esm/HeadingsDemo.mjs.map +2 -2
- package/dist/esm/ImageDemo.js +1 -8
- package/dist/esm/ImageDemo.js.map +2 -2
- package/dist/esm/ImageDemo.mjs +1 -8
- package/dist/esm/ImageDemo.mjs.map +2 -2
- package/dist/esm/InputsDemo.js +1 -19
- package/dist/esm/InputsDemo.js.map +2 -2
- package/dist/esm/InputsDemo.mjs +1 -19
- package/dist/esm/InputsDemo.mjs.map +2 -2
- package/dist/esm/LabelDemo.js +1 -17
- package/dist/esm/LabelDemo.js.map +2 -2
- package/dist/esm/LabelDemo.mjs +1 -17
- package/dist/esm/LabelDemo.mjs.map +2 -2
- package/dist/esm/LinearGradientDemo.js +1 -32
- package/dist/esm/LinearGradientDemo.js.map +2 -2
- package/dist/esm/LinearGradientDemo.mjs +1 -32
- package/dist/esm/LinearGradientDemo.mjs.map +2 -2
- package/dist/esm/ListItemDemo.js +1 -46
- package/dist/esm/ListItemDemo.js.map +2 -2
- package/dist/esm/ListItemDemo.mjs +1 -46
- package/dist/esm/ListItemDemo.mjs.map +2 -2
- package/dist/esm/LucideIconsDemo.js +1 -32
- package/dist/esm/LucideIconsDemo.js.map +2 -2
- package/dist/esm/LucideIconsDemo.mjs +1 -32
- package/dist/esm/LucideIconsDemo.mjs.map +2 -2
- package/dist/esm/PopoverDemo.js +1 -75
- package/dist/esm/PopoverDemo.js.map +2 -2
- package/dist/esm/PopoverDemo.mjs +1 -75
- package/dist/esm/PopoverDemo.mjs.map +2 -2
- package/dist/esm/ProgressDemo.js +1 -47
- package/dist/esm/ProgressDemo.js.map +2 -2
- package/dist/esm/ProgressDemo.mjs +1 -47
- package/dist/esm/ProgressDemo.mjs.map +2 -2
- package/dist/esm/RadioGroupDemo.js +1 -19
- package/dist/esm/RadioGroupDemo.js.map +2 -2
- package/dist/esm/RadioGroupDemo.mjs +1 -19
- package/dist/esm/RadioGroupDemo.mjs.map +2 -2
- package/dist/esm/ScrollViewDemo.js +1 -17
- package/dist/esm/ScrollViewDemo.js.map +2 -2
- package/dist/esm/ScrollViewDemo.mjs +1 -17
- package/dist/esm/ScrollViewDemo.mjs.map +2 -2
- package/dist/esm/SelectDemo.js +1 -79
- package/dist/esm/SelectDemo.js.map +2 -2
- package/dist/esm/SelectDemo.mjs +1 -79
- package/dist/esm/SelectDemo.mjs.map +2 -2
- package/dist/esm/SeparatorDemo.js +1 -19
- package/dist/esm/SeparatorDemo.js.map +2 -2
- package/dist/esm/SeparatorDemo.mjs +1 -19
- package/dist/esm/SeparatorDemo.mjs.map +2 -2
- package/dist/esm/ShapesDemo.js +1 -11
- package/dist/esm/ShapesDemo.js.map +2 -2
- package/dist/esm/ShapesDemo.mjs +1 -11
- package/dist/esm/ShapesDemo.mjs.map +2 -2
- package/dist/esm/SheetDemo.js +1 -79
- package/dist/esm/SheetDemo.js.map +2 -2
- package/dist/esm/SheetDemo.mjs +1 -79
- package/dist/esm/SheetDemo.mjs.map +2 -2
- package/dist/esm/SliderDemo.js +1 -18
- package/dist/esm/SliderDemo.js.map +2 -2
- package/dist/esm/SliderDemo.mjs +1 -18
- package/dist/esm/SliderDemo.mjs.map +2 -2
- package/dist/esm/SpinnerDemo.js +1 -11
- package/dist/esm/SpinnerDemo.js.map +2 -2
- package/dist/esm/SpinnerDemo.mjs +1 -11
- package/dist/esm/SpinnerDemo.mjs.map +2 -2
- package/dist/esm/StacksDemo.js +1 -57
- package/dist/esm/StacksDemo.js.map +2 -2
- package/dist/esm/StacksDemo.mjs +1 -57
- package/dist/esm/StacksDemo.mjs.map +2 -2
- package/dist/esm/SwitchDemo.js +1 -31
- package/dist/esm/SwitchDemo.js.map +2 -2
- package/dist/esm/SwitchDemo.mjs +1 -31
- package/dist/esm/SwitchDemo.mjs.map +2 -2
- package/dist/esm/TabsAdvancedDemo.js +1 -268
- package/dist/esm/TabsAdvancedDemo.js.map +2 -2
- package/dist/esm/TabsAdvancedDemo.mjs +1 -268
- package/dist/esm/TabsAdvancedDemo.mjs.map +2 -2
- package/dist/esm/TabsDemo.js +1 -130
- package/dist/esm/TabsDemo.js.map +2 -2
- package/dist/esm/TabsDemo.mjs +1 -130
- package/dist/esm/TabsDemo.mjs.map +2 -2
- package/dist/esm/TextDemo.js +1 -15
- package/dist/esm/TextDemo.js.map +2 -2
- package/dist/esm/TextDemo.mjs +1 -15
- package/dist/esm/TextDemo.mjs.map +2 -2
- package/dist/esm/ThemeInverseDemo.js +1 -19
- package/dist/esm/ThemeInverseDemo.js.map +2 -2
- package/dist/esm/ThemeInverseDemo.mjs +1 -19
- package/dist/esm/ThemeInverseDemo.mjs.map +2 -2
- package/dist/esm/ToastDemo.js +1 -94
- package/dist/esm/ToastDemo.js.map +3 -3
- package/dist/esm/ToastDemo.mjs +1 -94
- package/dist/esm/ToastDemo.mjs.map +3 -3
- package/dist/esm/ToastDuplicateDemo.js +1 -43
- package/dist/esm/ToastDuplicateDemo.js.map +2 -2
- package/dist/esm/ToastDuplicateDemo.mjs +1 -43
- package/dist/esm/ToastDuplicateDemo.mjs.map +2 -2
- package/dist/esm/ToggleGroupDemo.js +1 -48
- package/dist/esm/ToggleGroupDemo.js.map +2 -2
- package/dist/esm/ToggleGroupDemo.mjs +1 -48
- package/dist/esm/ToggleGroupDemo.mjs.map +2 -2
- package/dist/esm/TokensDemo.js +1 -86
- package/dist/esm/TokensDemo.js.map +2 -2
- package/dist/esm/TokensDemo.mjs +1 -86
- package/dist/esm/TokensDemo.mjs.map +2 -2
- package/dist/esm/TooltipDemo.js +1 -68
- package/dist/esm/TooltipDemo.js.map +2 -2
- package/dist/esm/TooltipDemo.mjs +1 -68
- package/dist/esm/TooltipDemo.mjs.map +2 -2
- package/dist/esm/UpdateThemeDemo.js +1 -53
- package/dist/esm/UpdateThemeDemo.js.map +2 -2
- package/dist/esm/UpdateThemeDemo.mjs +1 -53
- package/dist/esm/UpdateThemeDemo.mjs.map +2 -2
- package/dist/esm/conf.js +1 -4
- package/dist/esm/conf.js.map +1 -1
- package/dist/esm/conf.mjs +1 -4
- package/dist/esm/conf.mjs.map +1 -1
- package/dist/esm/index.js +1 -91
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/index.mjs +1 -91
- package/dist/esm/index.mjs.map +2 -2
- package/dist/esm/tamagui.config.js +1 -5
- package/dist/esm/tamagui.config.js.map +2 -2
- package/dist/esm/tamagui.config.mjs +1 -5
- package/dist/esm/tamagui.config.mjs.map +2 -2
- package/dist/esm/useOnIntersecting.js +1 -67
- package/dist/esm/useOnIntersecting.js.map +2 -2
- package/dist/esm/useOnIntersecting.mjs +1 -67
- package/dist/esm/useOnIntersecting.mjs.map +2 -2
- package/dist/jsx/AddThemeDemo.js +1 -30
- package/dist/jsx/AddThemeDemo.js.map +2 -2
- package/dist/jsx/AddThemeDemo.mjs +1 -30
- package/dist/jsx/AddThemeDemo.mjs.map +2 -2
- package/dist/jsx/AlertDialogDemo.js +1 -44
- package/dist/jsx/AlertDialogDemo.js.map +2 -2
- package/dist/jsx/AlertDialogDemo.mjs +1 -44
- package/dist/jsx/AlertDialogDemo.mjs.map +2 -2
- package/dist/jsx/AnimationsDemo.js +1 -80
- package/dist/jsx/AnimationsDemo.js.map +2 -2
- package/dist/jsx/AnimationsDemo.mjs +1 -80
- package/dist/jsx/AnimationsDemo.mjs.map +2 -2
- package/dist/jsx/AnimationsEnterDemo.js +1 -34
- package/dist/jsx/AnimationsEnterDemo.js.map +2 -2
- package/dist/jsx/AnimationsEnterDemo.mjs +1 -34
- package/dist/jsx/AnimationsEnterDemo.mjs.map +2 -2
- package/dist/jsx/AnimationsHoverDemo.js +1 -20
- package/dist/jsx/AnimationsHoverDemo.js.map +2 -2
- package/dist/jsx/AnimationsHoverDemo.mjs +1 -20
- package/dist/jsx/AnimationsHoverDemo.mjs.map +2 -2
- package/dist/jsx/AnimationsPresenceDemo.js +1 -54
- package/dist/jsx/AnimationsPresenceDemo.js.map +2 -2
- package/dist/jsx/AnimationsPresenceDemo.mjs +1 -54
- package/dist/jsx/AnimationsPresenceDemo.mjs.map +2 -2
- package/dist/jsx/AnimationsTimingDemo.js +1 -20
- package/dist/jsx/AnimationsTimingDemo.js.map +2 -2
- package/dist/jsx/AnimationsTimingDemo.mjs +1 -20
- package/dist/jsx/AnimationsTimingDemo.mjs.map +2 -2
- package/dist/jsx/AvatarDemo.js +1 -22
- package/dist/jsx/AvatarDemo.js.map +2 -2
- package/dist/jsx/AvatarDemo.mjs +1 -22
- package/dist/jsx/AvatarDemo.mjs.map +2 -2
- package/dist/jsx/ButtonDemo.js +1 -23
- package/dist/jsx/ButtonDemo.js.map +2 -2
- package/dist/jsx/ButtonDemo.mjs +1 -23
- package/dist/jsx/ButtonDemo.mjs.map +2 -2
- package/dist/jsx/CardDemo.js +1 -38
- package/dist/jsx/CardDemo.js.map +2 -2
- package/dist/jsx/CardDemo.mjs +1 -38
- package/dist/jsx/CardDemo.mjs.map +2 -2
- package/dist/jsx/CheckboxDemo.js +1 -19
- package/dist/jsx/CheckboxDemo.js.map +2 -2
- package/dist/jsx/CheckboxDemo.mjs +1 -19
- package/dist/jsx/CheckboxDemo.mjs.map +2 -2
- package/dist/jsx/ColorsDemo.js +1 -85
- package/dist/jsx/ColorsDemo.js.map +2 -2
- package/dist/jsx/ColorsDemo.mjs +1 -85
- package/dist/jsx/ColorsDemo.mjs.map +2 -2
- package/dist/jsx/DialogDemo.js +1 -65
- package/dist/jsx/DialogDemo.js.map +2 -2
- package/dist/jsx/DialogDemo.mjs +1 -65
- package/dist/jsx/DialogDemo.mjs.map +2 -2
- package/dist/jsx/FormsDemo.js +1 -30
- package/dist/jsx/FormsDemo.js.map +2 -2
- package/dist/jsx/FormsDemo.mjs +1 -30
- package/dist/jsx/FormsDemo.mjs.map +2 -2
- package/dist/jsx/GroupDemo.js +1 -23
- package/dist/jsx/GroupDemo.js.map +2 -2
- package/dist/jsx/GroupDemo.mjs +1 -23
- package/dist/jsx/GroupDemo.mjs.map +2 -2
- package/dist/jsx/HeadingsDemo.js +1 -14
- package/dist/jsx/HeadingsDemo.js.map +2 -2
- package/dist/jsx/HeadingsDemo.mjs +1 -14
- package/dist/jsx/HeadingsDemo.mjs.map +2 -2
- package/dist/jsx/ImageDemo.js +1 -7
- package/dist/jsx/ImageDemo.js.map +2 -2
- package/dist/jsx/ImageDemo.mjs +1 -7
- package/dist/jsx/ImageDemo.mjs.map +2 -2
- package/dist/jsx/InputsDemo.js +1 -18
- package/dist/jsx/InputsDemo.js.map +2 -2
- package/dist/jsx/InputsDemo.mjs +1 -18
- package/dist/jsx/InputsDemo.mjs.map +2 -2
- package/dist/jsx/LabelDemo.js +1 -16
- package/dist/jsx/LabelDemo.js.map +2 -2
- package/dist/jsx/LabelDemo.mjs +1 -16
- package/dist/jsx/LabelDemo.mjs.map +2 -2
- package/dist/jsx/LinearGradientDemo.js +1 -25
- package/dist/jsx/LinearGradientDemo.js.map +2 -2
- package/dist/jsx/LinearGradientDemo.mjs +1 -25
- package/dist/jsx/LinearGradientDemo.mjs.map +2 -2
- package/dist/jsx/ListItemDemo.js +1 -39
- package/dist/jsx/ListItemDemo.js.map +2 -2
- package/dist/jsx/ListItemDemo.mjs +1 -39
- package/dist/jsx/ListItemDemo.mjs.map +2 -2
- package/dist/jsx/LucideIconsDemo.js +1 -31
- package/dist/jsx/LucideIconsDemo.js.map +2 -2
- package/dist/jsx/LucideIconsDemo.mjs +1 -31
- package/dist/jsx/LucideIconsDemo.mjs.map +2 -2
- package/dist/jsx/PopoverDemo.js +1 -66
- package/dist/jsx/PopoverDemo.js.map +2 -2
- package/dist/jsx/PopoverDemo.mjs +1 -66
- package/dist/jsx/PopoverDemo.mjs.map +2 -2
- package/dist/jsx/ProgressDemo.js +1 -42
- package/dist/jsx/ProgressDemo.js.map +2 -2
- package/dist/jsx/ProgressDemo.mjs +1 -42
- package/dist/jsx/ProgressDemo.mjs.map +2 -2
- package/dist/jsx/RadioGroupDemo.js +1 -18
- package/dist/jsx/RadioGroupDemo.js.map +2 -2
- package/dist/jsx/RadioGroupDemo.mjs +1 -18
- package/dist/jsx/RadioGroupDemo.mjs.map +2 -2
- package/dist/jsx/ScrollViewDemo.js +1 -16
- package/dist/jsx/ScrollViewDemo.js.map +2 -2
- package/dist/jsx/ScrollViewDemo.mjs +1 -16
- package/dist/jsx/ScrollViewDemo.mjs.map +2 -2
- package/dist/jsx/SelectDemo.js +1 -72
- package/dist/jsx/SelectDemo.js.map +2 -2
- package/dist/jsx/SelectDemo.mjs +1 -72
- package/dist/jsx/SelectDemo.mjs.map +2 -2
- package/dist/jsx/SeparatorDemo.js +1 -18
- package/dist/jsx/SeparatorDemo.js.map +2 -2
- package/dist/jsx/SeparatorDemo.mjs +1 -18
- package/dist/jsx/SeparatorDemo.mjs.map +2 -2
- package/dist/jsx/ShapesDemo.js +1 -10
- package/dist/jsx/ShapesDemo.js.map +2 -2
- package/dist/jsx/ShapesDemo.mjs +1 -10
- package/dist/jsx/ShapesDemo.mjs.map +2 -2
- package/dist/jsx/SheetDemo.js +1 -65
- package/dist/jsx/SheetDemo.js.map +2 -2
- package/dist/jsx/SheetDemo.mjs +1 -65
- package/dist/jsx/SheetDemo.mjs.map +2 -2
- package/dist/jsx/SliderDemo.js +1 -17
- package/dist/jsx/SliderDemo.js.map +2 -2
- package/dist/jsx/SliderDemo.mjs +1 -17
- package/dist/jsx/SliderDemo.mjs.map +2 -2
- package/dist/jsx/SpinnerDemo.js +1 -10
- package/dist/jsx/SpinnerDemo.js.map +2 -2
- package/dist/jsx/SpinnerDemo.mjs +1 -10
- package/dist/jsx/SpinnerDemo.mjs.map +2 -2
- package/dist/jsx/StacksDemo.js +1 -45
- package/dist/jsx/StacksDemo.js.map +2 -2
- package/dist/jsx/StacksDemo.mjs +1 -45
- package/dist/jsx/StacksDemo.mjs.map +2 -2
- package/dist/jsx/SwitchDemo.js +1 -26
- package/dist/jsx/SwitchDemo.js.map +2 -2
- package/dist/jsx/SwitchDemo.mjs +1 -26
- package/dist/jsx/SwitchDemo.mjs.map +2 -2
- package/dist/jsx/TabsAdvancedDemo.js +1 -219
- package/dist/jsx/TabsAdvancedDemo.js.map +2 -2
- package/dist/jsx/TabsAdvancedDemo.mjs +1 -219
- package/dist/jsx/TabsAdvancedDemo.mjs.map +2 -2
- package/dist/jsx/TabsDemo.js +1 -105
- package/dist/jsx/TabsDemo.js.map +2 -2
- package/dist/jsx/TabsDemo.mjs +1 -105
- package/dist/jsx/TabsDemo.mjs.map +2 -2
- package/dist/jsx/TextDemo.js +1 -14
- package/dist/jsx/TextDemo.js.map +2 -2
- package/dist/jsx/TextDemo.mjs +1 -14
- package/dist/jsx/TextDemo.mjs.map +2 -2
- package/dist/jsx/ThemeInverseDemo.js +1 -18
- package/dist/jsx/ThemeInverseDemo.js.map +2 -2
- package/dist/jsx/ThemeInverseDemo.mjs +1 -18
- package/dist/jsx/ThemeInverseDemo.mjs.map +2 -2
- package/dist/jsx/ToastDemo.js +1 -74
- package/dist/jsx/ToastDemo.js.map +3 -3
- package/dist/jsx/ToastDemo.mjs +1 -74
- package/dist/jsx/ToastDemo.mjs.map +3 -3
- package/dist/jsx/ToastDuplicateDemo.js +1 -34
- package/dist/jsx/ToastDuplicateDemo.js.map +2 -2
- package/dist/jsx/ToastDuplicateDemo.mjs +1 -34
- package/dist/jsx/ToastDuplicateDemo.mjs.map +2 -2
- package/dist/jsx/ToggleGroupDemo.js +1 -39
- package/dist/jsx/ToggleGroupDemo.js.map +2 -2
- package/dist/jsx/ToggleGroupDemo.mjs +1 -39
- package/dist/jsx/ToggleGroupDemo.mjs.map +2 -2
- package/dist/jsx/TokensDemo.js +1 -77
- package/dist/jsx/TokensDemo.js.map +2 -2
- package/dist/jsx/TokensDemo.mjs +1 -77
- package/dist/jsx/TokensDemo.mjs.map +2 -2
- package/dist/jsx/TooltipDemo.js +1 -63
- package/dist/jsx/TooltipDemo.js.map +2 -2
- package/dist/jsx/TooltipDemo.mjs +1 -63
- package/dist/jsx/TooltipDemo.mjs.map +2 -2
- package/dist/jsx/UpdateThemeDemo.js +1 -48
- package/dist/jsx/UpdateThemeDemo.js.map +2 -2
- package/dist/jsx/UpdateThemeDemo.mjs +1 -48
- package/dist/jsx/UpdateThemeDemo.mjs.map +2 -2
- package/dist/jsx/conf.js +1 -4
- package/dist/jsx/conf.js.map +1 -1
- package/dist/jsx/conf.mjs +1 -4
- package/dist/jsx/conf.mjs.map +1 -1
- package/dist/jsx/index.js +1 -91
- package/dist/jsx/index.js.map +2 -2
- package/dist/jsx/index.mjs +1 -91
- package/dist/jsx/index.mjs.map +2 -2
- package/dist/jsx/tamagui.config.js +1 -5
- package/dist/jsx/tamagui.config.js.map +2 -2
- package/dist/jsx/tamagui.config.mjs +1 -5
- package/dist/jsx/tamagui.config.mjs.map +2 -2
- package/dist/jsx/useOnIntersecting.js +1 -67
- package/dist/jsx/useOnIntersecting.js.map +2 -2
- package/dist/jsx/useOnIntersecting.mjs +1 -67
- package/dist/jsx/useOnIntersecting.mjs.map +2 -2
- package/package.json +18 -18
- package/src/ToastDemo.tsx +4 -4
|
@@ -1,32 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useMemo, useState } from "react";
|
|
3
|
-
import { ScrollView } from "react-native";
|
|
4
|
-
import { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from "tamagui";
|
|
5
|
-
const lucideIcons = Object.keys(LucideIcons).map((name) => ({
|
|
6
|
-
key: name.toLowerCase(),
|
|
7
|
-
name,
|
|
8
|
-
Icon: LucideIcons[name]
|
|
9
|
-
}));
|
|
10
|
-
function LucideIconsDemo() {
|
|
11
|
-
const [searchRaw, setSearch] = useState("");
|
|
12
|
-
const search = useDebounceValue(searchRaw, 400);
|
|
13
|
-
const size = 100;
|
|
14
|
-
const iconsMemo = useMemo(() => {
|
|
15
|
-
const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
|
|
16
|
-
return icons.slice(0, 835).map(({ Icon, name }) => {
|
|
17
|
-
return <YStack height={size} alignItems="center" justifyContent="center" key={name}>
|
|
18
|
-
<Icon size={size * 0.25} />
|
|
19
|
-
<Spacer />
|
|
20
|
-
<Paragraph size="$2" o={0.5}>{name}</Paragraph>
|
|
21
|
-
</YStack>;
|
|
22
|
-
});
|
|
23
|
-
}, [search]);
|
|
24
|
-
return <YStack alignSelf="stretch" padding="$4" paddingBottom="$0" space>
|
|
25
|
-
<Input value={searchRaw} onChangeText={setSearch} placeholder="Search..." />
|
|
26
|
-
<YStack height={420}><ScrollView><Grid itemMinWidth={size}>{iconsMemo}</Grid></ScrollView></YStack>
|
|
27
|
-
</YStack>;
|
|
28
|
-
}
|
|
29
|
-
export {
|
|
30
|
-
LucideIconsDemo
|
|
31
|
-
};
|
|
1
|
+
import*as C from"@tamagui/lucide-icons";import{useMemo as z,useState as M}from"react";import{ScrollView as V}from"react-native";import{Grid as $,Input as D,Paragraph as G,Spacer as P,YStack as I,useDebounceValue as W}from"tamagui";const v=Object.keys(C).map(e=>({key:e.toLowerCase(),name:e,Icon:C[e]}));function q(){const[e,L]=M(""),w=W(e,400),t=100,Y=z(()=>v.filter(S=>S.key.startsWith(w.toLowerCase())).slice(0,835).map(({Icon:S,name:y})=><I height={t}alignItems="center"justifyContent="center"key={y}><S size={t*.25}/><P/><G size="$2"o={.5}>{y}</G></I>),[w]);return<I alignSelf="stretch"padding="$4"paddingBottom="$0"space><D value={e}onChangeText={L}placeholder="Search..."/><I height={420}><V><$ itemMinWidth={t}>{Y}</$></V></I></I>}export{q as LucideIconsDemo};
|
|
32
2
|
//# sourceMappingURL=LucideIconsDemo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/LucideIconsDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n key: name.toLowerCase(),\n name,\n Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n const [searchRaw, setSearch] = useState('')\n const search = useDebounceValue(searchRaw, 400)\n\n const size = 100\n\n const iconsMemo = useMemo(() => {\n const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()))\n return icons.slice(0, 835).map(({ Icon, name }) => {\n return (\n <YStack height={size} alignItems=\"center\" justifyContent=\"center\" key={name}>\n <Icon size={size * 0.25} />\n <Spacer />\n <Paragraph size=\"$2\" o={0.5}>\n {name}\n </Paragraph>\n </YStack>\n )\n })\n }, [search])\n\n return (\n <YStack alignSelf=\"stretch\" padding=\"$4\" paddingBottom=\"$0\" space>\n <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n <YStack height={420}>\n <ScrollView>\n <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n </ScrollView>\n </YStack>\n </YStack>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,UAAYA,MAAiB,wBAC7B,OAAS,WAAAC,EAAS,YAAAC,MAAgB,QAClC,OAAS,cAAAC,MAAkB,eAC3B,OAAS,QAAAC,EAAM,SAAAC,EAAO,aAAAC,EAAW,UAAAC,EAAQ,UAAAC,EAAQ,oBAAAC,MAAwB,UAEzE,MAAMC,EAAc,OAAO,KAAKV,CAAW,EAAE,IAAKW,IAAU,CAC1D,IAAKA,EAAK,YAAY,EACtB,KAAAA,EACA,KAAMX,EAAYW,CAAI,CACxB,EAAE,EAEK,SAASC,GAAkB,CAChC,KAAM,CAACC,EAAWC,CAAS,EAAIZ,EAAS,EAAE,EACpCa,EAASN,EAAiBI,EAAW,GAAG,EAExCG,EAAO,IAEPC,EAAYhB,EAAQ,IACVS,EAAY,OAAQQ,GAAMA,EAAE,IAAI,WAAWH,EAAO,YAAY,CAAC,CAAC,EACjE,MAAM,EAAG,GAAG,EAAE,IAAI,CAAC,CAAE,KAAAI,EAAM,KAAAR,CAAK,IAEzC,CAACH,EAAO,QAAQQ,EAAM,WAAW,QAAS,eAAe,QAAS,KAAKL,GACrE,CAACQ,EAAK,MAAMH,EAAO,IAAM,EACzB,CAACT,CAAO,EACR,CAACD,EAAU,KAAK,IAAK,GAAG,KACrBK,EACH,EAFCL,EAGH,EANCE,EAQJ,EACA,CAACO,CAAM,CAAC,EAEX,MACE,CAACP,EAAO,UAAU,SAAU,QAAQ,IAAK,cAAc,IAAK,MAC1D,CAACH,EAAM,OAAOQ,EAAW,cAAcC,EAAW,YAAY,WAAY,EAE1E,CAACN,EAAO,QAAQ,KACd,CAACL,EACC,CAACC,EAAK,cAAcY,IAAOC,EAAU,EAApCb,EACH,EAFCD,EAGH,EAJCK,EAKH,EARCA,EAUL",
|
|
6
|
+
"names": ["LucideIcons", "useMemo", "useState", "ScrollView", "Grid", "Input", "Paragraph", "Spacer", "YStack", "useDebounceValue", "lucideIcons", "name", "LucideIconsDemo", "searchRaw", "setSearch", "search", "size", "iconsMemo", "x", "Icon"]
|
|
7
7
|
}
|
|
@@ -1,32 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useMemo, useState } from "react";
|
|
3
|
-
import { ScrollView } from "react-native";
|
|
4
|
-
import { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from "tamagui";
|
|
5
|
-
const lucideIcons = Object.keys(LucideIcons).map((name) => ({
|
|
6
|
-
key: name.toLowerCase(),
|
|
7
|
-
name,
|
|
8
|
-
Icon: LucideIcons[name]
|
|
9
|
-
}));
|
|
10
|
-
function LucideIconsDemo() {
|
|
11
|
-
const [searchRaw, setSearch] = useState("");
|
|
12
|
-
const search = useDebounceValue(searchRaw, 400);
|
|
13
|
-
const size = 100;
|
|
14
|
-
const iconsMemo = useMemo(() => {
|
|
15
|
-
const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
|
|
16
|
-
return icons.slice(0, 835).map(({ Icon, name }) => {
|
|
17
|
-
return <YStack height={size} alignItems="center" justifyContent="center" key={name}>
|
|
18
|
-
<Icon size={size * 0.25} />
|
|
19
|
-
<Spacer />
|
|
20
|
-
<Paragraph size="$2" o={0.5}>{name}</Paragraph>
|
|
21
|
-
</YStack>;
|
|
22
|
-
});
|
|
23
|
-
}, [search]);
|
|
24
|
-
return <YStack alignSelf="stretch" padding="$4" paddingBottom="$0" space>
|
|
25
|
-
<Input value={searchRaw} onChangeText={setSearch} placeholder="Search..." />
|
|
26
|
-
<YStack height={420}><ScrollView><Grid itemMinWidth={size}>{iconsMemo}</Grid></ScrollView></YStack>
|
|
27
|
-
</YStack>;
|
|
28
|
-
}
|
|
29
|
-
export {
|
|
30
|
-
LucideIconsDemo
|
|
31
|
-
};
|
|
1
|
+
import*as C from"@tamagui/lucide-icons";import{useMemo as z,useState as M}from"react";import{ScrollView as V}from"react-native";import{Grid as $,Input as D,Paragraph as G,Spacer as P,YStack as I,useDebounceValue as W}from"tamagui";const v=Object.keys(C).map(e=>({key:e.toLowerCase(),name:e,Icon:C[e]}));function q(){const[e,L]=M(""),w=W(e,400),t=100,Y=z(()=>v.filter(S=>S.key.startsWith(w.toLowerCase())).slice(0,835).map(({Icon:S,name:y})=><I height={t}alignItems="center"justifyContent="center"key={y}><S size={t*.25}/><P/><G size="$2"o={.5}>{y}</G></I>),[w]);return<I alignSelf="stretch"padding="$4"paddingBottom="$0"space><D value={e}onChangeText={L}placeholder="Search..."/><I height={420}><V><$ itemMinWidth={t}>{Y}</$></V></I></I>}export{q as LucideIconsDemo};
|
|
32
2
|
//# sourceMappingURL=LucideIconsDemo.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/LucideIconsDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import * as LucideIcons from '@tamagui/lucide-icons'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst lucideIcons = Object.keys(LucideIcons).map((name) => ({\n key: name.toLowerCase(),\n name,\n Icon: LucideIcons[name],\n}))\n\nexport function LucideIconsDemo() {\n const [searchRaw, setSearch] = useState('')\n const search = useDebounceValue(searchRaw, 400)\n\n const size = 100\n\n const iconsMemo = useMemo(() => {\n const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()))\n return icons.slice(0, 835).map(({ Icon, name }) => {\n return (\n <YStack height={size} alignItems=\"center\" justifyContent=\"center\" key={name}>\n <Icon size={size * 0.25} />\n <Spacer />\n <Paragraph size=\"$2\" o={0.5}>\n {name}\n </Paragraph>\n </YStack>\n )\n })\n }, [search])\n\n return (\n <YStack alignSelf=\"stretch\" padding=\"$4\" paddingBottom=\"$0\" space>\n <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n <YStack height={420}>\n <ScrollView>\n <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n </ScrollView>\n </YStack>\n </YStack>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,UAAYA,MAAiB,wBAC7B,OAAS,WAAAC,EAAS,YAAAC,MAAgB,QAClC,OAAS,cAAAC,MAAkB,eAC3B,OAAS,QAAAC,EAAM,SAAAC,EAAO,aAAAC,EAAW,UAAAC,EAAQ,UAAAC,EAAQ,oBAAAC,MAAwB,UAEzE,MAAMC,EAAc,OAAO,KAAKV,CAAW,EAAE,IAAKW,IAAU,CAC1D,IAAKA,EAAK,YAAY,EACtB,KAAAA,EACA,KAAMX,EAAYW,CAAI,CACxB,EAAE,EAEK,SAASC,GAAkB,CAChC,KAAM,CAACC,EAAWC,CAAS,EAAIZ,EAAS,EAAE,EACpCa,EAASN,EAAiBI,EAAW,GAAG,EAExCG,EAAO,IAEPC,EAAYhB,EAAQ,IACVS,EAAY,OAAQQ,GAAMA,EAAE,IAAI,WAAWH,EAAO,YAAY,CAAC,CAAC,EACjE,MAAM,EAAG,GAAG,EAAE,IAAI,CAAC,CAAE,KAAAI,EAAM,KAAAR,CAAK,IAEzC,CAACH,EAAO,QAAQQ,EAAM,WAAW,QAAS,eAAe,QAAS,KAAKL,GACrE,CAACQ,EAAK,MAAMH,EAAO,IAAM,EACzB,CAACT,CAAO,EACR,CAACD,EAAU,KAAK,IAAK,GAAG,KACrBK,EACH,EAFCL,EAGH,EANCE,EAQJ,EACA,CAACO,CAAM,CAAC,EAEX,MACE,CAACP,EAAO,UAAU,SAAU,QAAQ,IAAK,cAAc,IAAK,MAC1D,CAACH,EAAM,OAAOQ,EAAW,cAAcC,EAAW,YAAY,WAAY,EAE1E,CAACN,EAAO,QAAQ,KACd,CAACL,EACC,CAACC,EAAK,cAAcY,IAAOC,EAAU,EAApCb,EACH,EAFCD,EAGH,EAJCK,EAKH,EARCA,EAUL",
|
|
6
|
+
"names": ["LucideIcons", "useMemo", "useState", "ScrollView", "Grid", "Input", "Paragraph", "Spacer", "YStack", "useDebounceValue", "lucideIcons", "name", "LucideIconsDemo", "searchRaw", "setSearch", "search", "size", "iconsMemo", "x", "Icon"]
|
|
7
7
|
}
|
package/dist/jsx/PopoverDemo.js
CHANGED
|
@@ -1,67 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
Adapt,
|
|
4
|
-
Button,
|
|
5
|
-
Input,
|
|
6
|
-
Label,
|
|
7
|
-
Popover,
|
|
8
|
-
XStack,
|
|
9
|
-
YGroup
|
|
10
|
-
} from "tamagui";
|
|
11
|
-
function PopoverDemo() {
|
|
12
|
-
return <XStack space="$2" flex={1} justifyContent="center" alignItems="center">
|
|
13
|
-
<Demo placement="left" Icon={ChevronLeft} Name="left-popover" />
|
|
14
|
-
<Demo placement="bottom" Icon={ChevronDown} Name="bottom-popover" />
|
|
15
|
-
<Demo placement="top" Icon={ChevronUp} Name="top-popover" />
|
|
16
|
-
<Demo placement="right" Icon={ChevronRight} Name="right-popover" />
|
|
17
|
-
</XStack>;
|
|
18
|
-
}
|
|
19
|
-
function Demo({
|
|
20
|
-
Icon,
|
|
21
|
-
Name,
|
|
22
|
-
...props
|
|
23
|
-
}) {
|
|
24
|
-
return <Popover size="$5" {...props}>
|
|
25
|
-
<Popover.Trigger asChild><Button icon={Icon} /></Popover.Trigger>
|
|
26
|
-
<Adapt when="sm" platform="web"><Popover.Sheet modal dismissOnSnapToBottom>
|
|
27
|
-
<Popover.Sheet.Frame padding="$4"><Adapt.Contents /></Popover.Sheet.Frame>
|
|
28
|
-
<Popover.Sheet.Overlay />
|
|
29
|
-
</Popover.Sheet></Adapt>
|
|
30
|
-
<Popover.Content
|
|
31
|
-
borderWidth={1}
|
|
32
|
-
borderColor="$borderColor"
|
|
33
|
-
enterStyle={{ x: 0, y: -10, opacity: 0 }}
|
|
34
|
-
exitStyle={{ x: 0, y: -10, opacity: 0 }}
|
|
35
|
-
x={0}
|
|
36
|
-
y={0}
|
|
37
|
-
opacity={1}
|
|
38
|
-
animation={[
|
|
39
|
-
"quick",
|
|
40
|
-
{
|
|
41
|
-
opacity: {
|
|
42
|
-
overshootClamping: true
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
]}
|
|
46
|
-
elevate
|
|
47
|
-
>
|
|
48
|
-
<Popover.Arrow borderWidth={1} borderColor="$borderColor" />
|
|
49
|
-
<YGroup space="$3">
|
|
50
|
-
<YGroup.Item><XStack space="$3">
|
|
51
|
-
<Label size="$3" htmlFor={Name}>Name</Label>
|
|
52
|
-
<Input size="$3" id={Name} />
|
|
53
|
-
</XStack></YGroup.Item>
|
|
54
|
-
<YGroup.Item><Popover.Close asChild><Button
|
|
55
|
-
size="$3"
|
|
56
|
-
onPress={() => {
|
|
57
|
-
}}
|
|
58
|
-
>Submit</Button></Popover.Close></YGroup.Item>
|
|
59
|
-
</YGroup>
|
|
60
|
-
</Popover.Content>
|
|
61
|
-
</Popover>;
|
|
62
|
-
}
|
|
63
|
-
export {
|
|
64
|
-
Demo,
|
|
65
|
-
PopoverDemo
|
|
66
|
-
};
|
|
1
|
+
import{ChevronDown as z,ChevronLeft as G,ChevronRight as Y,ChevronUp as A}from"@tamagui/lucide-icons";import{Adapt as I,Button as $,Input as B,Label as D,Popover as C,XStack as N,YGroup as S}from"tamagui";function X(){return<N space="$2"flex={1}justifyContent="center"alignItems="center"><P placement="left"Icon={G}Name="left-popover"/><P placement="bottom"Icon={z}Name="bottom-popover"/><P placement="top"Icon={A}Name="top-popover"/><P placement="right"Icon={Y}Name="right-popover"/></N>}function P({Icon:k,Name:g,...w}){return<C size="$5"{...w}><C.Trigger asChild><$ icon={k}/></C.Trigger><I when="sm"platform="web"><C.Sheet modal dismissOnSnapToBottom><C.Sheet.Frame padding="$4"><I.Contents/></C.Sheet.Frame><C.Sheet.Overlay/></C.Sheet></I><C.Content borderWidth={1}borderColor="$borderColor"enterStyle={{x:0,y:-10,opacity:0}}exitStyle={{x:0,y:-10,opacity:0}}x={0}y={0}opacity={1}animation={["quick",{opacity:{overshootClamping:!0}}]}elevate><C.Arrow borderWidth={1}borderColor="$borderColor"/><S space="$3"><S.Item><N space="$3"><D size="$3"htmlFor={g}>Name</D><B size="$3"id={g}/></N></S.Item><S.Item><C.Close asChild><$ size="$3"onPress={()=>{}}>Submit</$></C.Close></S.Item></S></C.Content></C>}export{P as Demo,X as PopoverDemo};
|
|
67
2
|
//# sourceMappingURL=PopoverDemo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/PopoverDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Input,\n Label,\n Popover,\n PopoverProps,\n XStack,\n YGroup,\n} from 'tamagui'\n\nexport function PopoverDemo() {\n return (\n <XStack space=\"$2\" flex={1} justifyContent=\"center\" alignItems=\"center\">\n <Demo placement=\"left\" Icon={ChevronLeft} Name=\"left-popover\" />\n <Demo placement=\"bottom\" Icon={ChevronDown} Name=\"bottom-popover\" />\n <Demo placement=\"top\" Icon={ChevronUp} Name=\"top-popover\" />\n <Demo placement=\"right\" Icon={ChevronRight} Name=\"right-popover\" />\n </XStack>\n )\n}\n\nexport function Demo({\n Icon,\n Name,\n ...props\n}: PopoverProps & { Icon?: any; Name?: string }) {\n return (\n <Popover size=\"$5\" {...props}>\n <Popover.Trigger asChild>\n <Button icon={Icon} />\n </Popover.Trigger>\n\n <Adapt when=\"sm\" platform=\"web\">\n <Popover.Sheet modal dismissOnSnapToBottom>\n <Popover.Sheet.Frame padding=\"$4\">\n <Adapt.Contents />\n </Popover.Sheet.Frame>\n <Popover.Sheet.Overlay />\n </Popover.Sheet>\n </Adapt>\n\n <Popover.Content\n borderWidth={1}\n borderColor=\"$borderColor\"\n enterStyle={{ x: 0, y: -10, opacity: 0 }}\n exitStyle={{ x: 0, y: -10, opacity: 0 }}\n x={0}\n y={0}\n opacity={1}\n animation={[\n 'quick',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n elevate\n >\n <Popover.Arrow borderWidth={1} borderColor=\"$borderColor\" />\n\n <YGroup space=\"$3\">\n <YGroup.Item>\n <XStack space=\"$3\">\n <Label size=\"$3\" htmlFor={Name}>\n Name\n </Label>\n <Input size=\"$3\" id={Name} />\n </XStack>\n </YGroup.Item>\n <YGroup.Item>\n <Popover.Close asChild>\n <Button\n size=\"$3\"\n onPress={() => {\n /* Custom code goes here, does not interfere with popover closure */\n }}\n >\n Submit\n </Button>\n </Popover.Close>\n </YGroup.Item>\n </YGroup>\n </Popover.Content>\n </Popover>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,OAAS,eAAAA,EAAa,eAAAC,EAAa,gBAAAC,EAAc,aAAAC,MAAiB,wBAClE,OACE,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,SAAAC,EACA,WAAAC,EAEA,UAAAC,EACA,UAAAC,MACK,UAEA,SAASC,GAAc,CAC5B,MACE,CAACF,EAAO,MAAM,IAAK,MAAM,EAAG,eAAe,QAAS,WAAW,SAC7D,CAACG,EAAK,UAAU,MAAO,MAAMX,EAAa,KAAK,cAAe,EAC9D,CAACW,EAAK,UAAU,QAAS,MAAMZ,EAAa,KAAK,gBAAiB,EAClE,CAACY,EAAK,UAAU,KAAM,MAAMT,EAAW,KAAK,aAAc,EAC1D,CAACS,EAAK,UAAU,OAAQ,MAAMV,EAAc,KAAK,eAAgB,EACnE,EALCO,EAOL,CAEO,SAASG,EAAK,CACnB,KAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAiD,CAC/C,MACE,CAACP,EAAQ,KAAK,QAASO,GACrB,CAACP,EAAQ,QAAQ,QACf,CAACH,EAAO,MAAMQ,EAAM,EACtB,EAFCL,EAAQ,QAIT,CAACJ,EAAM,KAAK,IAAK,SAAS,MACxB,CAACI,EAAQ,MAAM,MAAM,sBACnB,CAACA,EAAQ,MAAM,MAAM,QAAQ,KAC3B,CAACJ,EAAM,QAAS,EAClB,EAFCI,EAAQ,MAAM,MAGf,CAACA,EAAQ,MAAM,OAAQ,EACzB,EALCA,EAAQ,MAMX,EAPCJ,EASD,CAACI,EAAQ,QACP,aAAa,EACb,YAAY,cACZ,YAAY,CAAE,EAAG,EAAG,EAAG,IAAK,QAAS,CAAE,EACvC,WAAW,CAAE,EAAG,EAAG,EAAG,IAAK,QAAS,CAAE,EACtC,GAAG,EACH,GAAG,EACH,SAAS,EACT,WAAW,CACT,QACA,CACE,QAAS,CACP,kBAAmB,EACrB,CACF,CACF,EACA,QAEA,CAACA,EAAQ,MAAM,aAAa,EAAG,YAAY,cAAe,EAE1D,CAACE,EAAO,MAAM,KACZ,CAACA,EAAO,KACN,CAACD,EAAO,MAAM,KACZ,CAACF,EAAM,KAAK,IAAK,SAASO,GAAM,IAEhC,EAFCP,EAGD,CAACD,EAAM,KAAK,IAAK,IAAIQ,EAAM,EAC7B,EALCL,EAMH,EAPCC,EAAO,KAQR,CAACA,EAAO,KACN,CAACF,EAAQ,MAAM,QACb,CAACH,EACC,KAAK,IACL,SAAS,IAAM,CAEf,GACD,MAED,EAPCA,EAQH,EATCG,EAAQ,MAUX,EAXCE,EAAO,KAYV,EArBCA,EAsBH,EA1CCF,EAAQ,QA2CX,EAzDCA,EA2DL",
|
|
6
|
+
"names": ["ChevronDown", "ChevronLeft", "ChevronRight", "ChevronUp", "Adapt", "Button", "Input", "Label", "Popover", "XStack", "YGroup", "PopoverDemo", "Demo", "Icon", "Name", "props"]
|
|
7
7
|
}
|
package/dist/jsx/PopoverDemo.mjs
CHANGED
|
@@ -1,67 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import {
|
|
3
|
-
Adapt,
|
|
4
|
-
Button,
|
|
5
|
-
Input,
|
|
6
|
-
Label,
|
|
7
|
-
Popover,
|
|
8
|
-
XStack,
|
|
9
|
-
YGroup
|
|
10
|
-
} from "tamagui";
|
|
11
|
-
function PopoverDemo() {
|
|
12
|
-
return <XStack space="$2" flex={1} justifyContent="center" alignItems="center">
|
|
13
|
-
<Demo placement="left" Icon={ChevronLeft} Name="left-popover" />
|
|
14
|
-
<Demo placement="bottom" Icon={ChevronDown} Name="bottom-popover" />
|
|
15
|
-
<Demo placement="top" Icon={ChevronUp} Name="top-popover" />
|
|
16
|
-
<Demo placement="right" Icon={ChevronRight} Name="right-popover" />
|
|
17
|
-
</XStack>;
|
|
18
|
-
}
|
|
19
|
-
function Demo({
|
|
20
|
-
Icon,
|
|
21
|
-
Name,
|
|
22
|
-
...props
|
|
23
|
-
}) {
|
|
24
|
-
return <Popover size="$5" {...props}>
|
|
25
|
-
<Popover.Trigger asChild><Button icon={Icon} /></Popover.Trigger>
|
|
26
|
-
<Adapt when="sm" platform="web"><Popover.Sheet modal dismissOnSnapToBottom>
|
|
27
|
-
<Popover.Sheet.Frame padding="$4"><Adapt.Contents /></Popover.Sheet.Frame>
|
|
28
|
-
<Popover.Sheet.Overlay />
|
|
29
|
-
</Popover.Sheet></Adapt>
|
|
30
|
-
<Popover.Content
|
|
31
|
-
borderWidth={1}
|
|
32
|
-
borderColor="$borderColor"
|
|
33
|
-
enterStyle={{ x: 0, y: -10, opacity: 0 }}
|
|
34
|
-
exitStyle={{ x: 0, y: -10, opacity: 0 }}
|
|
35
|
-
x={0}
|
|
36
|
-
y={0}
|
|
37
|
-
opacity={1}
|
|
38
|
-
animation={[
|
|
39
|
-
"quick",
|
|
40
|
-
{
|
|
41
|
-
opacity: {
|
|
42
|
-
overshootClamping: true
|
|
43
|
-
}
|
|
44
|
-
}
|
|
45
|
-
]}
|
|
46
|
-
elevate
|
|
47
|
-
>
|
|
48
|
-
<Popover.Arrow borderWidth={1} borderColor="$borderColor" />
|
|
49
|
-
<YGroup space="$3">
|
|
50
|
-
<YGroup.Item><XStack space="$3">
|
|
51
|
-
<Label size="$3" htmlFor={Name}>Name</Label>
|
|
52
|
-
<Input size="$3" id={Name} />
|
|
53
|
-
</XStack></YGroup.Item>
|
|
54
|
-
<YGroup.Item><Popover.Close asChild><Button
|
|
55
|
-
size="$3"
|
|
56
|
-
onPress={() => {
|
|
57
|
-
}}
|
|
58
|
-
>Submit</Button></Popover.Close></YGroup.Item>
|
|
59
|
-
</YGroup>
|
|
60
|
-
</Popover.Content>
|
|
61
|
-
</Popover>;
|
|
62
|
-
}
|
|
63
|
-
export {
|
|
64
|
-
Demo,
|
|
65
|
-
PopoverDemo
|
|
66
|
-
};
|
|
1
|
+
import{ChevronDown as z,ChevronLeft as G,ChevronRight as Y,ChevronUp as A}from"@tamagui/lucide-icons";import{Adapt as I,Button as $,Input as B,Label as D,Popover as C,XStack as N,YGroup as S}from"tamagui";function X(){return<N space="$2"flex={1}justifyContent="center"alignItems="center"><P placement="left"Icon={G}Name="left-popover"/><P placement="bottom"Icon={z}Name="bottom-popover"/><P placement="top"Icon={A}Name="top-popover"/><P placement="right"Icon={Y}Name="right-popover"/></N>}function P({Icon:k,Name:g,...w}){return<C size="$5"{...w}><C.Trigger asChild><$ icon={k}/></C.Trigger><I when="sm"platform="web"><C.Sheet modal dismissOnSnapToBottom><C.Sheet.Frame padding="$4"><I.Contents/></C.Sheet.Frame><C.Sheet.Overlay/></C.Sheet></I><C.Content borderWidth={1}borderColor="$borderColor"enterStyle={{x:0,y:-10,opacity:0}}exitStyle={{x:0,y:-10,opacity:0}}x={0}y={0}opacity={1}animation={["quick",{opacity:{overshootClamping:!0}}]}elevate><C.Arrow borderWidth={1}borderColor="$borderColor"/><S space="$3"><S.Item><N space="$3"><D size="$3"htmlFor={g}>Name</D><B size="$3"id={g}/></N></S.Item><S.Item><C.Close asChild><$ size="$3"onPress={()=>{}}>Submit</$></C.Close></S.Item></S></C.Content></C>}export{P as Demo,X as PopoverDemo};
|
|
67
2
|
//# sourceMappingURL=PopoverDemo.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/PopoverDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Input,\n Label,\n Popover,\n PopoverProps,\n XStack,\n YGroup,\n} from 'tamagui'\n\nexport function PopoverDemo() {\n return (\n <XStack space=\"$2\" flex={1} justifyContent=\"center\" alignItems=\"center\">\n <Demo placement=\"left\" Icon={ChevronLeft} Name=\"left-popover\" />\n <Demo placement=\"bottom\" Icon={ChevronDown} Name=\"bottom-popover\" />\n <Demo placement=\"top\" Icon={ChevronUp} Name=\"top-popover\" />\n <Demo placement=\"right\" Icon={ChevronRight} Name=\"right-popover\" />\n </XStack>\n )\n}\n\nexport function Demo({\n Icon,\n Name,\n ...props\n}: PopoverProps & { Icon?: any; Name?: string }) {\n return (\n <Popover size=\"$5\" {...props}>\n <Popover.Trigger asChild>\n <Button icon={Icon} />\n </Popover.Trigger>\n\n <Adapt when=\"sm\" platform=\"web\">\n <Popover.Sheet modal dismissOnSnapToBottom>\n <Popover.Sheet.Frame padding=\"$4\">\n <Adapt.Contents />\n </Popover.Sheet.Frame>\n <Popover.Sheet.Overlay />\n </Popover.Sheet>\n </Adapt>\n\n <Popover.Content\n borderWidth={1}\n borderColor=\"$borderColor\"\n enterStyle={{ x: 0, y: -10, opacity: 0 }}\n exitStyle={{ x: 0, y: -10, opacity: 0 }}\n x={0}\n y={0}\n opacity={1}\n animation={[\n 'quick',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n elevate\n >\n <Popover.Arrow borderWidth={1} borderColor=\"$borderColor\" />\n\n <YGroup space=\"$3\">\n <YGroup.Item>\n <XStack space=\"$3\">\n <Label size=\"$3\" htmlFor={Name}>\n Name\n </Label>\n <Input size=\"$3\" id={Name} />\n </XStack>\n </YGroup.Item>\n <YGroup.Item>\n <Popover.Close asChild>\n <Button\n size=\"$3\"\n onPress={() => {\n /* Custom code goes here, does not interfere with popover closure */\n }}\n >\n Submit\n </Button>\n </Popover.Close>\n </YGroup.Item>\n </YGroup>\n </Popover.Content>\n </Popover>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,OAAS,eAAAA,EAAa,eAAAC,EAAa,gBAAAC,EAAc,aAAAC,MAAiB,wBAClE,OACE,SAAAC,EACA,UAAAC,EACA,SAAAC,EACA,SAAAC,EACA,WAAAC,EAEA,UAAAC,EACA,UAAAC,MACK,UAEA,SAASC,GAAc,CAC5B,MACE,CAACF,EAAO,MAAM,IAAK,MAAM,EAAG,eAAe,QAAS,WAAW,SAC7D,CAACG,EAAK,UAAU,MAAO,MAAMX,EAAa,KAAK,cAAe,EAC9D,CAACW,EAAK,UAAU,QAAS,MAAMZ,EAAa,KAAK,gBAAiB,EAClE,CAACY,EAAK,UAAU,KAAM,MAAMT,EAAW,KAAK,aAAc,EAC1D,CAACS,EAAK,UAAU,OAAQ,MAAMV,EAAc,KAAK,eAAgB,EACnE,EALCO,EAOL,CAEO,SAASG,EAAK,CACnB,KAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAiD,CAC/C,MACE,CAACP,EAAQ,KAAK,QAASO,GACrB,CAACP,EAAQ,QAAQ,QACf,CAACH,EAAO,MAAMQ,EAAM,EACtB,EAFCL,EAAQ,QAIT,CAACJ,EAAM,KAAK,IAAK,SAAS,MACxB,CAACI,EAAQ,MAAM,MAAM,sBACnB,CAACA,EAAQ,MAAM,MAAM,QAAQ,KAC3B,CAACJ,EAAM,QAAS,EAClB,EAFCI,EAAQ,MAAM,MAGf,CAACA,EAAQ,MAAM,OAAQ,EACzB,EALCA,EAAQ,MAMX,EAPCJ,EASD,CAACI,EAAQ,QACP,aAAa,EACb,YAAY,cACZ,YAAY,CAAE,EAAG,EAAG,EAAG,IAAK,QAAS,CAAE,EACvC,WAAW,CAAE,EAAG,EAAG,EAAG,IAAK,QAAS,CAAE,EACtC,GAAG,EACH,GAAG,EACH,SAAS,EACT,WAAW,CACT,QACA,CACE,QAAS,CACP,kBAAmB,EACrB,CACF,CACF,EACA,QAEA,CAACA,EAAQ,MAAM,aAAa,EAAG,YAAY,cAAe,EAE1D,CAACE,EAAO,MAAM,KACZ,CAACA,EAAO,KACN,CAACD,EAAO,MAAM,KACZ,CAACF,EAAM,KAAK,IAAK,SAASO,GAAM,IAEhC,EAFCP,EAGD,CAACD,EAAM,KAAK,IAAK,IAAIQ,EAAM,EAC7B,EALCL,EAMH,EAPCC,EAAO,KAQR,CAACA,EAAO,KACN,CAACF,EAAQ,MAAM,QACb,CAACH,EACC,KAAK,IACL,SAAS,IAAM,CAEf,GACD,MAED,EAPCA,EAQH,EATCG,EAAQ,MAUX,EAXCE,EAAO,KAYV,EArBCA,EAsBH,EA1CCF,EAAQ,QA2CX,EAzDCA,EA2DL",
|
|
6
|
+
"names": ["ChevronDown", "ChevronLeft", "ChevronRight", "ChevronUp", "Adapt", "Button", "Input", "Label", "Popover", "XStack", "YGroup", "PopoverDemo", "Demo", "Icon", "Name", "props"]
|
|
7
7
|
}
|
package/dist/jsx/ProgressDemo.js
CHANGED
|
@@ -1,43 +1,2 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { Button, Paragraph, Progress, Slider, XStack, YStack } from "tamagui";
|
|
3
|
-
function ProgressDemo() {
|
|
4
|
-
const [size, setSize] = useState(4);
|
|
5
|
-
const [progress, setProgress] = useState(20);
|
|
6
|
-
const sizeProp = `$${size}`;
|
|
7
|
-
useEffect(() => {
|
|
8
|
-
const timer = setTimeout(() => setProgress(60), 1e3);
|
|
9
|
-
return () => {
|
|
10
|
-
clearTimeout(timer);
|
|
11
|
-
};
|
|
12
|
-
}, []);
|
|
13
|
-
return <>
|
|
14
|
-
<YStack height={60} alignItems="center" space>
|
|
15
|
-
<Paragraph height={30} opacity={0.5}>
|
|
16
|
-
{"Size: "}
|
|
17
|
-
{size}
|
|
18
|
-
</Paragraph>
|
|
19
|
-
<Progress size={sizeProp} value={progress}><Progress.Indicator animation="bouncy" /></Progress>
|
|
20
|
-
</YStack>
|
|
21
|
-
<XStack ai="center" space position="absolute" bottom="$3" left="$4" $xxs={{ display: "none" }}>
|
|
22
|
-
<Slider
|
|
23
|
-
size="$2"
|
|
24
|
-
width={130}
|
|
25
|
-
defaultValue={[4]}
|
|
26
|
-
min={2}
|
|
27
|
-
max={6}
|
|
28
|
-
step={1}
|
|
29
|
-
onValueChange={([val]) => {
|
|
30
|
-
setSize(val);
|
|
31
|
-
}}
|
|
32
|
-
>
|
|
33
|
-
<Slider.Track borderWidth={1} borderColor="$color5"><Slider.TrackActive /></Slider.Track>
|
|
34
|
-
<Slider.Thumb circular index={0} />
|
|
35
|
-
</Slider>
|
|
36
|
-
<Button size="$2" onPress={() => setProgress((prev) => (prev + 20) % 100)}>Load</Button>
|
|
37
|
-
</XStack>
|
|
38
|
-
</>;
|
|
39
|
-
}
|
|
40
|
-
export {
|
|
41
|
-
ProgressDemo
|
|
42
|
-
};
|
|
1
|
+
import{useEffect as b,useState as k}from"react";import{Button as B,Paragraph as C,Progress as P,Slider as S,XStack as I,YStack as V}from"tamagui";function A(){const[g,T]=k(4),[$,h]=k(20),f=`$${g}`;return b(()=>{const e=setTimeout(()=>h(60),1e3);return()=>{clearTimeout(e)}},[]),<><V height={60}alignItems="center"space><C height={30}opacity={.5}>Size: {g}</C><P size={f}value={$}><P.Indicator animation="bouncy"/></P></V><I ai="center"space position="absolute"bottom="$3"left="$4"$xxs={{display:"none"}}><S size="$2"width={130}defaultValue={[4]}min={2}max={6}step={1}onValueChange={([e])=>{T(e)}}><S.Track borderWidth={1}borderColor="$color5"><S.TrackActive/></S.Track><S.Thumb circular index={0}/></S><B size="$2"onPress={()=>h(e=>(e+20)%100)}>Load</B></I></>}export{A as ProgressDemo};
|
|
43
2
|
//# sourceMappingURL=ProgressDemo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ProgressDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { useEffect, useState } from 'react'\nimport { Button, Paragraph, Progress, SizeTokens, Slider, XStack, YStack } from 'tamagui'\n\nexport function ProgressDemo() {\n const [size, setSize] = useState(4)\n const [progress, setProgress] = useState(20)\n const sizeProp = `$${size}` as SizeTokens\n\n useEffect(() => {\n const timer = setTimeout(() => setProgress(60), 1000)\n return () => {\n clearTimeout(timer)\n }\n }, [])\n\n return (\n <>\n <YStack height={60} alignItems=\"center\" space>\n <Paragraph height={30} opacity={0.5}>\n Size: {size}\n </Paragraph>\n <Progress size={sizeProp} value={progress}>\n <Progress.Indicator animation=\"bouncy\" />\n </Progress>\n </YStack>\n\n <XStack ai=\"center\" space position=\"absolute\" bottom=\"$3\" left=\"$4\" $xxs={{ display: 'none' }}>\n <Slider\n size=\"$2\"\n width={130}\n defaultValue={[4]}\n min={2}\n max={6}\n step={1}\n onValueChange={([val]) => {\n setSize(val)\n }}\n >\n <Slider.Track borderWidth={1} borderColor=\"$color5\">\n <Slider.TrackActive />\n </Slider.Track>\n <Slider.Thumb circular index={0} />\n </Slider>\n\n <Button size=\"$2\" onPress={() => setProgress((prev) => (prev + 20) % 100)}>\n Load\n </Button>\n </XStack>\n </>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,OAAS,aAAAA,EAAW,YAAAC,MAAgB,QACpC,OAAS,UAAAC,EAAQ,aAAAC,EAAW,YAAAC,EAAsB,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,MAAc,UAEzE,SAASC,GAAe,CAC7B,KAAM,CAACC,EAAMC,CAAO,EAAIT,EAAS,CAAC,EAC5B,CAACU,EAAUC,CAAW,EAAIX,EAAS,EAAE,EACrCY,EAAW,IAAIJ,IAErB,OAAAT,EAAU,IAAM,CACd,MAAMc,EAAQ,WAAW,IAAMF,EAAY,EAAE,EAAG,GAAI,EACpD,MAAO,IAAM,CACX,aAAaE,CAAK,CACpB,CACF,EAAG,CAAC,CAAC,EAGH,EACE,CAACP,EAAO,QAAQ,GAAI,WAAW,QAAS,MACtC,CAACJ,EAAU,QAAQ,GAAI,SAAS,IAAK,OAC5BM,EACT,EAFCN,EAGD,CAACC,EAAS,MAAMS,EAAU,OAAOF,GAC/B,CAACP,EAAS,UAAU,UAAU,QAAS,EACzC,EAFCA,EAGH,EAPCG,EASD,CAACD,EAAO,GAAG,QAAS,MAAM,SAAS,UAAW,OAAO,IAAK,KAAK,IAAK,MAAM,CAAE,QAAS,MAAO,GAC1F,CAACD,EACC,KAAK,IACL,OAAO,IACP,cAAc,CAAC,CAAC,EAChB,KAAK,EACL,KAAK,EACL,MAAM,EACN,eAAe,CAAC,CAACU,CAAG,IAAM,CACxBL,EAAQK,CAAG,CACb,GAEA,CAACV,EAAO,MAAM,aAAa,EAAG,YAAY,UACxC,CAACA,EAAO,WAAY,EACtB,EAFCA,EAAO,MAGR,CAACA,EAAO,MAAM,SAAS,OAAO,EAAG,EACnC,EAfCA,EAiBD,CAACH,EAAO,KAAK,IAAK,SAAS,IAAMU,EAAaI,IAAUA,EAAO,IAAM,GAAG,GAAG,IAE3E,EAFCd,EAGH,EArBCI,EAsBH,GAEJ",
|
|
6
|
+
"names": ["useEffect", "useState", "Button", "Paragraph", "Progress", "Slider", "XStack", "YStack", "ProgressDemo", "size", "setSize", "progress", "setProgress", "sizeProp", "timer", "val", "prev"]
|
|
7
7
|
}
|
|
@@ -1,43 +1,2 @@
|
|
|
1
|
-
import {
|
|
2
|
-
import { Button, Paragraph, Progress, Slider, XStack, YStack } from "tamagui";
|
|
3
|
-
function ProgressDemo() {
|
|
4
|
-
const [size, setSize] = useState(4);
|
|
5
|
-
const [progress, setProgress] = useState(20);
|
|
6
|
-
const sizeProp = `$${size}`;
|
|
7
|
-
useEffect(() => {
|
|
8
|
-
const timer = setTimeout(() => setProgress(60), 1e3);
|
|
9
|
-
return () => {
|
|
10
|
-
clearTimeout(timer);
|
|
11
|
-
};
|
|
12
|
-
}, []);
|
|
13
|
-
return <>
|
|
14
|
-
<YStack height={60} alignItems="center" space>
|
|
15
|
-
<Paragraph height={30} opacity={0.5}>
|
|
16
|
-
{"Size: "}
|
|
17
|
-
{size}
|
|
18
|
-
</Paragraph>
|
|
19
|
-
<Progress size={sizeProp} value={progress}><Progress.Indicator animation="bouncy" /></Progress>
|
|
20
|
-
</YStack>
|
|
21
|
-
<XStack ai="center" space position="absolute" bottom="$3" left="$4" $xxs={{ display: "none" }}>
|
|
22
|
-
<Slider
|
|
23
|
-
size="$2"
|
|
24
|
-
width={130}
|
|
25
|
-
defaultValue={[4]}
|
|
26
|
-
min={2}
|
|
27
|
-
max={6}
|
|
28
|
-
step={1}
|
|
29
|
-
onValueChange={([val]) => {
|
|
30
|
-
setSize(val);
|
|
31
|
-
}}
|
|
32
|
-
>
|
|
33
|
-
<Slider.Track borderWidth={1} borderColor="$color5"><Slider.TrackActive /></Slider.Track>
|
|
34
|
-
<Slider.Thumb circular index={0} />
|
|
35
|
-
</Slider>
|
|
36
|
-
<Button size="$2" onPress={() => setProgress((prev) => (prev + 20) % 100)}>Load</Button>
|
|
37
|
-
</XStack>
|
|
38
|
-
</>;
|
|
39
|
-
}
|
|
40
|
-
export {
|
|
41
|
-
ProgressDemo
|
|
42
|
-
};
|
|
1
|
+
import{useEffect as b,useState as k}from"react";import{Button as B,Paragraph as C,Progress as P,Slider as S,XStack as I,YStack as V}from"tamagui";function A(){const[g,T]=k(4),[$,h]=k(20),f=`$${g}`;return b(()=>{const e=setTimeout(()=>h(60),1e3);return()=>{clearTimeout(e)}},[]),<><V height={60}alignItems="center"space><C height={30}opacity={.5}>Size: {g}</C><P size={f}value={$}><P.Indicator animation="bouncy"/></P></V><I ai="center"space position="absolute"bottom="$3"left="$4"$xxs={{display:"none"}}><S size="$2"width={130}defaultValue={[4]}min={2}max={6}step={1}onValueChange={([e])=>{T(e)}}><S.Track borderWidth={1}borderColor="$color5"><S.TrackActive/></S.Track><S.Thumb circular index={0}/></S><B size="$2"onPress={()=>h(e=>(e+20)%100)}>Load</B></I></>}export{A as ProgressDemo};
|
|
43
2
|
//# sourceMappingURL=ProgressDemo.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ProgressDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { useEffect, useState } from 'react'\nimport { Button, Paragraph, Progress, SizeTokens, Slider, XStack, YStack } from 'tamagui'\n\nexport function ProgressDemo() {\n const [size, setSize] = useState(4)\n const [progress, setProgress] = useState(20)\n const sizeProp = `$${size}` as SizeTokens\n\n useEffect(() => {\n const timer = setTimeout(() => setProgress(60), 1000)\n return () => {\n clearTimeout(timer)\n }\n }, [])\n\n return (\n <>\n <YStack height={60} alignItems=\"center\" space>\n <Paragraph height={30} opacity={0.5}>\n Size: {size}\n </Paragraph>\n <Progress size={sizeProp} value={progress}>\n <Progress.Indicator animation=\"bouncy\" />\n </Progress>\n </YStack>\n\n <XStack ai=\"center\" space position=\"absolute\" bottom=\"$3\" left=\"$4\" $xxs={{ display: 'none' }}>\n <Slider\n size=\"$2\"\n width={130}\n defaultValue={[4]}\n min={2}\n max={6}\n step={1}\n onValueChange={([val]) => {\n setSize(val)\n }}\n >\n <Slider.Track borderWidth={1} borderColor=\"$color5\">\n <Slider.TrackActive />\n </Slider.Track>\n <Slider.Thumb circular index={0} />\n </Slider>\n\n <Button size=\"$2\" onPress={() => setProgress((prev) => (prev + 20) % 100)}>\n Load\n </Button>\n </XStack>\n </>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,OAAS,aAAAA,EAAW,YAAAC,MAAgB,QACpC,OAAS,UAAAC,EAAQ,aAAAC,EAAW,YAAAC,EAAsB,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,MAAc,UAEzE,SAASC,GAAe,CAC7B,KAAM,CAACC,EAAMC,CAAO,EAAIT,EAAS,CAAC,EAC5B,CAACU,EAAUC,CAAW,EAAIX,EAAS,EAAE,EACrCY,EAAW,IAAIJ,IAErB,OAAAT,EAAU,IAAM,CACd,MAAMc,EAAQ,WAAW,IAAMF,EAAY,EAAE,EAAG,GAAI,EACpD,MAAO,IAAM,CACX,aAAaE,CAAK,CACpB,CACF,EAAG,CAAC,CAAC,EAGH,EACE,CAACP,EAAO,QAAQ,GAAI,WAAW,QAAS,MACtC,CAACJ,EAAU,QAAQ,GAAI,SAAS,IAAK,OAC5BM,EACT,EAFCN,EAGD,CAACC,EAAS,MAAMS,EAAU,OAAOF,GAC/B,CAACP,EAAS,UAAU,UAAU,QAAS,EACzC,EAFCA,EAGH,EAPCG,EASD,CAACD,EAAO,GAAG,QAAS,MAAM,SAAS,UAAW,OAAO,IAAK,KAAK,IAAK,MAAM,CAAE,QAAS,MAAO,GAC1F,CAACD,EACC,KAAK,IACL,OAAO,IACP,cAAc,CAAC,CAAC,EAChB,KAAK,EACL,KAAK,EACL,MAAM,EACN,eAAe,CAAC,CAACU,CAAG,IAAM,CACxBL,EAAQK,CAAG,CACb,GAEA,CAACV,EAAO,MAAM,aAAa,EAAG,YAAY,UACxC,CAACA,EAAO,WAAY,EACtB,EAFCA,EAAO,MAGR,CAACA,EAAO,MAAM,SAAS,OAAO,EAAG,EACnC,EAfCA,EAiBD,CAACH,EAAO,KAAK,IAAK,SAAS,IAAMU,EAAaI,IAAUA,EAAO,IAAM,GAAG,GAAG,IAE3E,EAFCd,EAGH,EArBCI,EAsBH,GAEJ",
|
|
6
|
+
"names": ["useEffect", "useState", "Button", "Paragraph", "Progress", "Slider", "XStack", "YStack", "ProgressDemo", "size", "setSize", "progress", "setProgress", "sizeProp", "timer", "val", "prev"]
|
|
7
7
|
}
|
|
@@ -1,19 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
function RadioGroupDemo() {
|
|
3
|
-
return <RadioGroup defaultValue="3" name="form"><YStack width={300} alignItems="center" space="$2">
|
|
4
|
-
<RadioGroupItemWithLabel size="$3" value="2" label="Second value" />
|
|
5
|
-
<RadioGroupItemWithLabel size="$4" value="3" label="Third value" />
|
|
6
|
-
<RadioGroupItemWithLabel size="$5" value="4" label="Fourth value" />
|
|
7
|
-
</YStack></RadioGroup>;
|
|
8
|
-
}
|
|
9
|
-
function RadioGroupItemWithLabel(props) {
|
|
10
|
-
const id = `radiogroup-${props.value}`;
|
|
11
|
-
return <XStack width={300} alignItems="center" space="$4">
|
|
12
|
-
<RadioGroup.Item value={props.value} id={id} size={props.size}><RadioGroup.Indicator /></RadioGroup.Item>
|
|
13
|
-
<Label size={props.size} htmlFor={id}>{props.label}</Label>
|
|
14
|
-
</XStack>;
|
|
15
|
-
}
|
|
16
|
-
export {
|
|
17
|
-
RadioGroupDemo
|
|
18
|
-
};
|
|
1
|
+
import{Label as G,RadioGroup as S,XStack as R,YStack as T}from"tamagui";function F(){return<S defaultValue="3"name="form"><T width={300}alignItems="center"space="$2"><I size="$3"value="2"label="Second value"/><I size="$4"value="3"label="Third value"/><I size="$5"value="4"label="Fourth value"/></T></S>}function I(e){const $=`radiogroup-${e.value}`;return<R width={300}alignItems="center"space="$4"><S.Item value={e.value}id={$}size={e.size}><S.Indicator/></S.Item><G size={e.size}htmlFor={$}>{e.label}</G></R>}export{F as RadioGroupDemo};
|
|
19
2
|
//# sourceMappingURL=RadioGroupDemo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/RadioGroupDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { Label, RadioGroup, SizeTokens, ThemeableStack, XStack, YStack } from 'tamagui'\n\nexport function RadioGroupDemo() {\n return (\n <RadioGroup defaultValue=\"3\" name=\"form\">\n <YStack width={300} alignItems=\"center\" space=\"$2\">\n <RadioGroupItemWithLabel size=\"$3\" value=\"2\" label=\"Second value\" />\n <RadioGroupItemWithLabel size=\"$4\" value=\"3\" label=\"Third value\" />\n <RadioGroupItemWithLabel size=\"$5\" value=\"4\" label=\"Fourth value\" />\n </YStack>\n </RadioGroup>\n )\n}\n\nfunction RadioGroupItemWithLabel(props: {\n size: SizeTokens\n value: string\n label: string\n}) {\n const id = `radiogroup-${props.value}`\n return (\n <XStack width={300} alignItems=\"center\" space=\"$4\">\n <RadioGroup.Item value={props.value} id={id} size={props.size}>\n <RadioGroup.Indicator />\n </RadioGroup.Item>\n\n <Label size={props.size} htmlFor={id}>\n {props.label}\n </Label>\n </XStack>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,OAAS,SAAAA,EAAO,cAAAC,EAAwC,UAAAC,EAAQ,UAAAC,MAAc,UAEvE,SAASC,GAAiB,CAC/B,MACE,CAACH,EAAW,aAAa,GAAI,KAAK,OAChC,CAACE,EAAO,OAAO,IAAK,WAAW,QAAS,MAAM,KAC5C,CAACE,EAAwB,KAAK,IAAK,MAAM,GAAI,MAAM,cAAe,EAClE,CAACA,EAAwB,KAAK,IAAK,MAAM,GAAI,MAAM,aAAc,EACjE,CAACA,EAAwB,KAAK,IAAK,MAAM,GAAI,MAAM,cAAe,EACpE,EAJCF,EAKH,EANCF,EAQL,CAEA,SAASI,EAAwBC,EAI9B,CACD,MAAMC,EAAK,cAAcD,EAAM,QAC/B,MACE,CAACJ,EAAO,OAAO,IAAK,WAAW,QAAS,MAAM,KAC5C,CAACD,EAAW,KAAK,OAAOK,EAAM,MAAO,IAAIC,EAAI,MAAMD,EAAM,MACvD,CAACL,EAAW,SAAU,EACxB,EAFCA,EAAW,KAIZ,CAACD,EAAM,MAAMM,EAAM,KAAM,SAASC,IAC/BD,EAAM,MACT,EAFCN,EAGH,EARCE,EAUL",
|
|
6
|
+
"names": ["Label", "RadioGroup", "XStack", "YStack", "RadioGroupDemo", "RadioGroupItemWithLabel", "props", "id"]
|
|
7
7
|
}
|
|
@@ -1,19 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
function RadioGroupDemo() {
|
|
3
|
-
return <RadioGroup defaultValue="3" name="form"><YStack width={300} alignItems="center" space="$2">
|
|
4
|
-
<RadioGroupItemWithLabel size="$3" value="2" label="Second value" />
|
|
5
|
-
<RadioGroupItemWithLabel size="$4" value="3" label="Third value" />
|
|
6
|
-
<RadioGroupItemWithLabel size="$5" value="4" label="Fourth value" />
|
|
7
|
-
</YStack></RadioGroup>;
|
|
8
|
-
}
|
|
9
|
-
function RadioGroupItemWithLabel(props) {
|
|
10
|
-
const id = `radiogroup-${props.value}`;
|
|
11
|
-
return <XStack width={300} alignItems="center" space="$4">
|
|
12
|
-
<RadioGroup.Item value={props.value} id={id} size={props.size}><RadioGroup.Indicator /></RadioGroup.Item>
|
|
13
|
-
<Label size={props.size} htmlFor={id}>{props.label}</Label>
|
|
14
|
-
</XStack>;
|
|
15
|
-
}
|
|
16
|
-
export {
|
|
17
|
-
RadioGroupDemo
|
|
18
|
-
};
|
|
1
|
+
import{Label as G,RadioGroup as S,XStack as R,YStack as T}from"tamagui";function F(){return<S defaultValue="3"name="form"><T width={300}alignItems="center"space="$2"><I size="$3"value="2"label="Second value"/><I size="$4"value="3"label="Third value"/><I size="$5"value="4"label="Fourth value"/></T></S>}function I(e){const $=`radiogroup-${e.value}`;return<R width={300}alignItems="center"space="$4"><S.Item value={e.value}id={$}size={e.size}><S.Indicator/></S.Item><G size={e.size}htmlFor={$}>{e.label}</G></R>}export{F as RadioGroupDemo};
|
|
19
2
|
//# sourceMappingURL=RadioGroupDemo.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/RadioGroupDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { Label, RadioGroup, SizeTokens, ThemeableStack, XStack, YStack } from 'tamagui'\n\nexport function RadioGroupDemo() {\n return (\n <RadioGroup defaultValue=\"3\" name=\"form\">\n <YStack width={300} alignItems=\"center\" space=\"$2\">\n <RadioGroupItemWithLabel size=\"$3\" value=\"2\" label=\"Second value\" />\n <RadioGroupItemWithLabel size=\"$4\" value=\"3\" label=\"Third value\" />\n <RadioGroupItemWithLabel size=\"$5\" value=\"4\" label=\"Fourth value\" />\n </YStack>\n </RadioGroup>\n )\n}\n\nfunction RadioGroupItemWithLabel(props: {\n size: SizeTokens\n value: string\n label: string\n}) {\n const id = `radiogroup-${props.value}`\n return (\n <XStack width={300} alignItems=\"center\" space=\"$4\">\n <RadioGroup.Item value={props.value} id={id} size={props.size}>\n <RadioGroup.Indicator />\n </RadioGroup.Item>\n\n <Label size={props.size} htmlFor={id}>\n {props.label}\n </Label>\n </XStack>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,OAAS,SAAAA,EAAO,cAAAC,EAAwC,UAAAC,EAAQ,UAAAC,MAAc,UAEvE,SAASC,GAAiB,CAC/B,MACE,CAACH,EAAW,aAAa,GAAI,KAAK,OAChC,CAACE,EAAO,OAAO,IAAK,WAAW,QAAS,MAAM,KAC5C,CAACE,EAAwB,KAAK,IAAK,MAAM,GAAI,MAAM,cAAe,EAClE,CAACA,EAAwB,KAAK,IAAK,MAAM,GAAI,MAAM,aAAc,EACjE,CAACA,EAAwB,KAAK,IAAK,MAAM,GAAI,MAAM,cAAe,EACpE,EAJCF,EAKH,EANCF,EAQL,CAEA,SAASI,EAAwBC,EAI9B,CACD,MAAMC,EAAK,cAAcD,EAAM,QAC/B,MACE,CAACJ,EAAO,OAAO,IAAK,WAAW,QAAS,MAAM,KAC5C,CAACD,EAAW,KAAK,OAAOK,EAAM,MAAO,IAAIC,EAAI,MAAMD,EAAM,MACvD,CAACL,EAAW,SAAU,EACxB,EAFCA,EAAW,KAIZ,CAACD,EAAM,MAAMM,EAAM,KAAM,SAASC,IAC/BD,EAAM,MACT,EAFCN,EAGH,EARCE,EAUL",
|
|
6
|
+
"names": ["Label", "RadioGroup", "XStack", "YStack", "RadioGroupDemo", "RadioGroupItemWithLabel", "props", "id"]
|
|
7
7
|
}
|
|
@@ -1,17 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
function ScrollViewDemo() {
|
|
3
|
-
return <ScrollView maxHeight={250} width="75%" backgroundColor="$background" padding="$4" borderRadius="$4"><XStack flexWrap="wrap" alignItems="center" justifyContent="center">
|
|
4
|
-
<Square margin="$4" size={120} backgroundColor="$red9" />
|
|
5
|
-
<Circle margin="$4" size={120} backgroundColor="$orange9" />
|
|
6
|
-
<Square margin="$4" size={120} backgroundColor="$yellow9" />
|
|
7
|
-
<Circle margin="$4" size={120} backgroundColor="$green9" />
|
|
8
|
-
<Square margin="$4" size={120} backgroundColor="$blue9" />
|
|
9
|
-
<Circle margin="$4" size={120} backgroundColor="$purple9" />
|
|
10
|
-
<Square margin="$4" size={120} backgroundColor="$pink9" />
|
|
11
|
-
<Circle margin="$4" size={120} backgroundColor="$red9" />
|
|
12
|
-
</XStack></ScrollView>;
|
|
13
|
-
}
|
|
14
|
-
export {
|
|
15
|
-
ScrollViewDemo
|
|
16
|
-
};
|
|
1
|
+
import{Circle as $,ScrollView as S,Square as C,XStack as V}from"tamagui";function y(){return<S maxHeight={250}width="75%"backgroundColor="$background"padding="$4"borderRadius="$4"><V flexWrap="wrap"alignItems="center"justifyContent="center"><C margin="$4"size={120}backgroundColor="$red9"/><$ margin="$4"size={120}backgroundColor="$orange9"/><C margin="$4"size={120}backgroundColor="$yellow9"/><$ margin="$4"size={120}backgroundColor="$green9"/><C margin="$4"size={120}backgroundColor="$blue9"/><$ margin="$4"size={120}backgroundColor="$purple9"/><C margin="$4"size={120}backgroundColor="$pink9"/><$ margin="$4"size={120}backgroundColor="$red9"/></V></S>}export{y as ScrollViewDemo};
|
|
17
2
|
//# sourceMappingURL=ScrollViewDemo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ScrollViewDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { Circle, ScrollView, Square, XStack } from 'tamagui'\n\nexport function ScrollViewDemo() {\n return (\n <ScrollView maxHeight={250} width=\"75%\" backgroundColor=\"$background\" padding=\"$4\" borderRadius=\"$4\">\n <XStack flexWrap=\"wrap\" alignItems=\"center\" justifyContent=\"center\">\n <Square margin=\"$4\" size={120} backgroundColor=\"$red9\" />\n <Circle margin=\"$4\" size={120} backgroundColor=\"$orange9\" />\n <Square margin=\"$4\" size={120} backgroundColor=\"$yellow9\" />\n <Circle margin=\"$4\" size={120} backgroundColor=\"$green9\" />\n <Square margin=\"$4\" size={120} backgroundColor=\"$blue9\" />\n <Circle margin=\"$4\" size={120} backgroundColor=\"$purple9\" />\n <Square margin=\"$4\" size={120} backgroundColor=\"$pink9\" />\n <Circle margin=\"$4\" size={120} backgroundColor=\"$red9\" />\n </XStack>\n </ScrollView>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAAA,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAAA,OAAS,UAAAA,EAAQ,cAAAC,EAAY,UAAAC,EAAQ,UAAAC,MAAc,UAE5C,SAASC,GAAiB,CAC/B,MACE,CAACH,EAAW,WAAW,IAAK,MAAM,KAAM,gBAAgB,aAAc,QAAQ,IAAK,aAAa,KAC9F,CAACE,EAAO,SAAS,MAAO,WAAW,QAAS,eAAe,SACzD,CAACD,EAAO,OAAO,IAAK,MAAM,IAAK,gBAAgB,OAAQ,EACvD,CAACF,EAAO,OAAO,IAAK,MAAM,IAAK,gBAAgB,UAAW,EAC1D,CAACE,EAAO,OAAO,IAAK,MAAM,IAAK,gBAAgB,UAAW,EAC1D,CAACF,EAAO,OAAO,IAAK,MAAM,IAAK,gBAAgB,SAAU,EACzD,CAACE,EAAO,OAAO,IAAK,MAAM,IAAK,gBAAgB,QAAS,EACxD,CAACF,EAAO,OAAO,IAAK,MAAM,IAAK,gBAAgB,UAAW,EAC1D,CAACE,EAAO,OAAO,IAAK,MAAM,IAAK,gBAAgB,QAAS,EACxD,CAACF,EAAO,OAAO,IAAK,MAAM,IAAK,gBAAgB,OAAQ,EACzD,EATCG,EAUH,EAXCF,EAaL",
|
|
6
|
+
"names": ["Circle", "ScrollView", "Square", "XStack", "ScrollViewDemo"]
|
|
7
7
|
}
|
|
@@ -1,17 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
function ScrollViewDemo() {
|
|
3
|
-
return <ScrollView maxHeight={250} width="75%" backgroundColor="$background" padding="$4" borderRadius="$4"><XStack flexWrap="wrap" alignItems="center" justifyContent="center">
|
|
4
|
-
<Square margin="$4" size={120} backgroundColor="$red9" />
|
|
5
|
-
<Circle margin="$4" size={120} backgroundColor="$orange9" />
|
|
6
|
-
<Square margin="$4" size={120} backgroundColor="$yellow9" />
|
|
7
|
-
<Circle margin="$4" size={120} backgroundColor="$green9" />
|
|
8
|
-
<Square margin="$4" size={120} backgroundColor="$blue9" />
|
|
9
|
-
<Circle margin="$4" size={120} backgroundColor="$purple9" />
|
|
10
|
-
<Square margin="$4" size={120} backgroundColor="$pink9" />
|
|
11
|
-
<Circle margin="$4" size={120} backgroundColor="$red9" />
|
|
12
|
-
</XStack></ScrollView>;
|
|
13
|
-
}
|
|
14
|
-
export {
|
|
15
|
-
ScrollViewDemo
|
|
16
|
-
};
|
|
1
|
+
import{Circle as $,ScrollView as S,Square as C,XStack as V}from"tamagui";function y(){return<S maxHeight={250}width="75%"backgroundColor="$background"padding="$4"borderRadius="$4"><V flexWrap="wrap"alignItems="center"justifyContent="center"><C margin="$4"size={120}backgroundColor="$red9"/><$ margin="$4"size={120}backgroundColor="$orange9"/><C margin="$4"size={120}backgroundColor="$yellow9"/><$ margin="$4"size={120}backgroundColor="$green9"/><C margin="$4"size={120}backgroundColor="$blue9"/><$ margin="$4"size={120}backgroundColor="$purple9"/><C margin="$4"size={120}backgroundColor="$pink9"/><$ margin="$4"size={120}backgroundColor="$red9"/></V></S>}export{y as ScrollViewDemo};
|
|
17
2
|
//# sourceMappingURL=ScrollViewDemo.mjs.map
|