@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
|
@@ -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": "AAKM,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAKM,OACE,OAAAA,EADF,QAAAC,MAAA,oBALN,OAAS,SAAAC,EAAO,cAAAC,EAAwC,UAAAC,EAAQ,UAAAC,MAAc,UAEvE,SAASC,GAAiB,CAC/B,OACEN,EAACG,EAAA,CAAW,aAAa,IAAI,KAAK,OAChC,SAAAF,EAACI,EAAA,CAAO,MAAO,IAAK,WAAW,SAAS,MAAM,KAC5C,UAAAL,EAACO,EAAA,CAAwB,KAAK,KAAK,MAAM,IAAI,MAAM,eAAe,EAClEP,EAACO,EAAA,CAAwB,KAAK,KAAK,MAAM,IAAI,MAAM,cAAc,EACjEP,EAACO,EAAA,CAAwB,KAAK,KAAK,MAAM,IAAI,MAAM,eAAe,GACpE,EACF,CAEJ,CAEA,SAASA,EAAwBC,EAI9B,CACD,MAAMC,EAAK,cAAcD,EAAM,QAC/B,OACEP,EAACG,EAAA,CAAO,MAAO,IAAK,WAAW,SAAS,MAAM,KAC5C,UAAAJ,EAACG,EAAW,KAAX,CAAgB,MAAOK,EAAM,MAAO,GAAIC,EAAI,KAAMD,EAAM,KACvD,SAAAR,EAACG,EAAW,UAAX,EAAqB,EACxB,EAEAH,EAACE,EAAA,CAAM,KAAMM,EAAM,KAAM,QAASC,EAC/B,SAAAD,EAAM,MACT,GACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "Label", "RadioGroup", "XStack", "YStack", "RadioGroupDemo", "RadioGroupItemWithLabel", "props", "id"]
|
|
7
7
|
}
|
|
@@ -1,18 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Circle, ScrollView, Square, XStack } from "tamagui";
|
|
3
|
-
function ScrollViewDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsx(ScrollView, { maxHeight: 250, width: "75%", backgroundColor: "$background", padding: "$4", borderRadius: "$4", children: /* @__PURE__ */ jsxs(XStack, { flexWrap: "wrap", alignItems: "center", justifyContent: "center", children: [
|
|
5
|
-
/* @__PURE__ */ jsx(Square, { margin: "$4", size: 120, backgroundColor: "$red9" }),
|
|
6
|
-
/* @__PURE__ */ jsx(Circle, { margin: "$4", size: 120, backgroundColor: "$orange9" }),
|
|
7
|
-
/* @__PURE__ */ jsx(Square, { margin: "$4", size: 120, backgroundColor: "$yellow9" }),
|
|
8
|
-
/* @__PURE__ */ jsx(Circle, { margin: "$4", size: 120, backgroundColor: "$green9" }),
|
|
9
|
-
/* @__PURE__ */ jsx(Square, { margin: "$4", size: 120, backgroundColor: "$blue9" }),
|
|
10
|
-
/* @__PURE__ */ jsx(Circle, { margin: "$4", size: 120, backgroundColor: "$purple9" }),
|
|
11
|
-
/* @__PURE__ */ jsx(Square, { margin: "$4", size: 120, backgroundColor: "$pink9" }),
|
|
12
|
-
/* @__PURE__ */ jsx(Circle, { margin: "$4", size: 120, backgroundColor: "$red9" })
|
|
13
|
-
] }) });
|
|
14
|
-
}
|
|
15
|
-
export {
|
|
16
|
-
ScrollViewDemo
|
|
17
|
-
};
|
|
1
|
+
import{jsx as r,jsxs as a}from"react/jsx-runtime";import{Circle as o,ScrollView as n,Square as e,XStack as i}from"tamagui";function l(){return r(n,{maxHeight:250,width:"75%",backgroundColor:"$background",padding:"$4",borderRadius:"$4",children:a(i,{flexWrap:"wrap",alignItems:"center",justifyContent:"center",children:[r(e,{margin:"$4",size:120,backgroundColor:"$red9"}),r(o,{margin:"$4",size:120,backgroundColor:"$orange9"}),r(e,{margin:"$4",size:120,backgroundColor:"$yellow9"}),r(o,{margin:"$4",size:120,backgroundColor:"$green9"}),r(e,{margin:"$4",size:120,backgroundColor:"$blue9"}),r(o,{margin:"$4",size:120,backgroundColor:"$purple9"}),r(e,{margin:"$4",size:120,backgroundColor:"$pink9"}),r(o,{margin:"$4",size:120,backgroundColor:"$red9"})]})})}export{l as ScrollViewDemo};
|
|
18
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": "AAKM,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAKM,OACE,OAAAA,EADF,QAAAC,MAAA,oBALN,OAAS,UAAAC,EAAQ,cAAAC,EAAY,UAAAC,EAAQ,UAAAC,MAAc,UAE5C,SAASC,GAAiB,CAC/B,OACEN,EAACG,EAAA,CAAW,UAAW,IAAK,MAAM,MAAM,gBAAgB,cAAc,QAAQ,KAAK,aAAa,KAC9F,SAAAF,EAACI,EAAA,CAAO,SAAS,OAAO,WAAW,SAAS,eAAe,SACzD,UAAAL,EAACI,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,QAAQ,EACvDJ,EAACE,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,WAAW,EAC1DF,EAACI,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,WAAW,EAC1DJ,EAACE,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,UAAU,EACzDF,EAACI,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,SAAS,EACxDJ,EAACE,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,WAAW,EAC1DF,EAACI,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,SAAS,EACxDJ,EAACE,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,QAAQ,GACzD,EACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "Circle", "ScrollView", "Square", "XStack", "ScrollViewDemo"]
|
|
7
7
|
}
|
|
@@ -1,18 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Circle, ScrollView, Square, XStack } from "tamagui";
|
|
3
|
-
function ScrollViewDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsx(ScrollView, { maxHeight: 250, width: "75%", backgroundColor: "$background", padding: "$4", borderRadius: "$4", children: /* @__PURE__ */ jsxs(XStack, { flexWrap: "wrap", alignItems: "center", justifyContent: "center", children: [
|
|
5
|
-
/* @__PURE__ */ jsx(Square, { margin: "$4", size: 120, backgroundColor: "$red9" }),
|
|
6
|
-
/* @__PURE__ */ jsx(Circle, { margin: "$4", size: 120, backgroundColor: "$orange9" }),
|
|
7
|
-
/* @__PURE__ */ jsx(Square, { margin: "$4", size: 120, backgroundColor: "$yellow9" }),
|
|
8
|
-
/* @__PURE__ */ jsx(Circle, { margin: "$4", size: 120, backgroundColor: "$green9" }),
|
|
9
|
-
/* @__PURE__ */ jsx(Square, { margin: "$4", size: 120, backgroundColor: "$blue9" }),
|
|
10
|
-
/* @__PURE__ */ jsx(Circle, { margin: "$4", size: 120, backgroundColor: "$purple9" }),
|
|
11
|
-
/* @__PURE__ */ jsx(Square, { margin: "$4", size: 120, backgroundColor: "$pink9" }),
|
|
12
|
-
/* @__PURE__ */ jsx(Circle, { margin: "$4", size: 120, backgroundColor: "$red9" })
|
|
13
|
-
] }) });
|
|
14
|
-
}
|
|
15
|
-
export {
|
|
16
|
-
ScrollViewDemo
|
|
17
|
-
};
|
|
1
|
+
import{jsx as r,jsxs as a}from"react/jsx-runtime";import{Circle as o,ScrollView as n,Square as e,XStack as i}from"tamagui";function l(){return r(n,{maxHeight:250,width:"75%",backgroundColor:"$background",padding:"$4",borderRadius:"$4",children:a(i,{flexWrap:"wrap",alignItems:"center",justifyContent:"center",children:[r(e,{margin:"$4",size:120,backgroundColor:"$red9"}),r(o,{margin:"$4",size:120,backgroundColor:"$orange9"}),r(e,{margin:"$4",size:120,backgroundColor:"$yellow9"}),r(o,{margin:"$4",size:120,backgroundColor:"$green9"}),r(e,{margin:"$4",size:120,backgroundColor:"$blue9"}),r(o,{margin:"$4",size:120,backgroundColor:"$purple9"}),r(e,{margin:"$4",size:120,backgroundColor:"$pink9"}),r(o,{margin:"$4",size:120,backgroundColor:"$red9"})]})})}export{l as ScrollViewDemo};
|
|
18
2
|
//# sourceMappingURL=ScrollViewDemo.mjs.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": "AAKM,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAKM,OACE,OAAAA,EADF,QAAAC,MAAA,oBALN,OAAS,UAAAC,EAAQ,cAAAC,EAAY,UAAAC,EAAQ,UAAAC,MAAc,UAE5C,SAASC,GAAiB,CAC/B,OACEN,EAACG,EAAA,CAAW,UAAW,IAAK,MAAM,MAAM,gBAAgB,cAAc,QAAQ,KAAK,aAAa,KAC9F,SAAAF,EAACI,EAAA,CAAO,SAAS,OAAO,WAAW,SAAS,eAAe,SACzD,UAAAL,EAACI,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,QAAQ,EACvDJ,EAACE,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,WAAW,EAC1DF,EAACI,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,WAAW,EAC1DJ,EAACE,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,UAAU,EACzDF,EAACI,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,SAAS,EACxDJ,EAACE,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,WAAW,EAC1DF,EAACI,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,SAAS,EACxDJ,EAACE,EAAA,CAAO,OAAO,KAAK,KAAM,IAAK,gBAAgB,QAAQ,GACzD,EACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "Circle", "ScrollView", "Square", "XStack", "ScrollViewDemo"]
|
|
7
7
|
}
|
package/dist/esm/SelectDemo.js
CHANGED
|
@@ -1,80 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Check, ChevronDown, ChevronUp } from "@tamagui/lucide-icons";
|
|
3
|
-
import { useState } from "react";
|
|
4
|
-
import { Adapt, Select, Sheet, YStack } from "tamagui";
|
|
5
|
-
import { LinearGradient } from "tamagui/linear-gradient";
|
|
6
|
-
function SelectDemo() {
|
|
7
|
-
const [val, setVal] = useState("apple");
|
|
8
|
-
return /* @__PURE__ */ jsxs(Select, { id: "food", value: val, onValueChange: setVal, children: [
|
|
9
|
-
/* @__PURE__ */ jsx(Select.Trigger, { width: 180, iconAfter: ChevronDown, children: /* @__PURE__ */ jsx(Select.Value, { placeholder: "Something" }) }),
|
|
10
|
-
/* @__PURE__ */ jsx(Adapt, { when: "sm", platform: "touch", children: /* @__PURE__ */ jsxs(Sheet, { modal: true, dismissOnSnapToBottom: true, children: [
|
|
11
|
-
/* @__PURE__ */ jsx(Sheet.Frame, { children: /* @__PURE__ */ jsx(Sheet.ScrollView, { children: /* @__PURE__ */ jsx(Adapt.Contents, {}) }) }),
|
|
12
|
-
/* @__PURE__ */ jsx(Sheet.Overlay, {})
|
|
13
|
-
] }) }),
|
|
14
|
-
/* @__PURE__ */ jsxs(Select.Content, { zIndex: 2e5, children: [
|
|
15
|
-
/* @__PURE__ */ jsxs(Select.ScrollUpButton, { alignItems: "center", justifyContent: "center", position: "relative", width: "100%", height: "$3", children: [
|
|
16
|
-
/* @__PURE__ */ jsx(YStack, { zIndex: 10, children: /* @__PURE__ */ jsx(ChevronUp, { size: 20 }) }),
|
|
17
|
-
/* @__PURE__ */ jsx(
|
|
18
|
-
LinearGradient,
|
|
19
|
-
{
|
|
20
|
-
start: [0, 0],
|
|
21
|
-
end: [0, 1],
|
|
22
|
-
fullscreen: true,
|
|
23
|
-
colors: ["$background", "$backgroundTransparent"],
|
|
24
|
-
borderRadius: "$4"
|
|
25
|
-
}
|
|
26
|
-
)
|
|
27
|
-
] }),
|
|
28
|
-
/* @__PURE__ */ jsx(Select.Viewport, { minWidth: 200, children: /* @__PURE__ */ jsxs(Select.Group, { space: "$0", children: [
|
|
29
|
-
/* @__PURE__ */ jsx(Select.Label, { children: "Fruits" }),
|
|
30
|
-
items.map((item, i) => {
|
|
31
|
-
return /* @__PURE__ */ jsxs(Select.Item, { index: i, value: item.name.toLowerCase(), children: [
|
|
32
|
-
/* @__PURE__ */ jsx(Select.ItemText, { children: item.name }),
|
|
33
|
-
/* @__PURE__ */ jsx(Select.ItemIndicator, { marginLeft: "auto", children: /* @__PURE__ */ jsx(Check, { size: 16 }) })
|
|
34
|
-
] }, item.name);
|
|
35
|
-
})
|
|
36
|
-
] }) }),
|
|
37
|
-
/* @__PURE__ */ jsxs(Select.ScrollDownButton, { alignItems: "center", justifyContent: "center", position: "relative", width: "100%", height: "$3", children: [
|
|
38
|
-
/* @__PURE__ */ jsx(YStack, { zIndex: 10, children: /* @__PURE__ */ jsx(ChevronDown, { size: 20 }) }),
|
|
39
|
-
/* @__PURE__ */ jsx(
|
|
40
|
-
LinearGradient,
|
|
41
|
-
{
|
|
42
|
-
start: [0, 0],
|
|
43
|
-
end: [0, 1],
|
|
44
|
-
fullscreen: true,
|
|
45
|
-
colors: ["$backgroundTransparent", "$background"],
|
|
46
|
-
borderRadius: "$4"
|
|
47
|
-
}
|
|
48
|
-
)
|
|
49
|
-
] })
|
|
50
|
-
] })
|
|
51
|
-
] });
|
|
52
|
-
}
|
|
53
|
-
const items = [
|
|
54
|
-
{ name: "Apple" },
|
|
55
|
-
{ name: "Pear" },
|
|
56
|
-
{ name: "Blackberry" },
|
|
57
|
-
{ name: "Peach" },
|
|
58
|
-
{ name: "Apricot" },
|
|
59
|
-
{ name: "Melon" },
|
|
60
|
-
{ name: "Honeydew" },
|
|
61
|
-
{ name: "Starfruit" },
|
|
62
|
-
{ name: "Blueberry" },
|
|
63
|
-
{ name: "Raspberry" },
|
|
64
|
-
{ name: "Strawberry" },
|
|
65
|
-
{ name: "Mango" },
|
|
66
|
-
{ name: "Pineapple" },
|
|
67
|
-
{ name: "Lime" },
|
|
68
|
-
{ name: "Lemon" },
|
|
69
|
-
{ name: "Coconut" },
|
|
70
|
-
{ name: "Guava" },
|
|
71
|
-
{ name: "Papaya" },
|
|
72
|
-
{ name: "Orange" },
|
|
73
|
-
{ name: "Grape" },
|
|
74
|
-
{ name: "Jackfruit" },
|
|
75
|
-
{ name: "Durian" }
|
|
76
|
-
];
|
|
77
|
-
export {
|
|
78
|
-
SelectDemo
|
|
79
|
-
};
|
|
1
|
+
import{jsx as e,jsxs as n}from"react/jsx-runtime";import{Check as u,ChevronDown as o,ChevronUp as S}from"@tamagui/lucide-icons";import{useState as d}from"react";import{Adapt as l,Select as t,Sheet as a,YStack as m}from"tamagui";import{LinearGradient as i}from"tamagui/linear-gradient";function b(){const[c,p]=d("apple");return n(t,{id:"food",value:c,onValueChange:p,children:[e(t.Trigger,{width:180,iconAfter:o,children:e(t.Value,{placeholder:"Something"})}),e(l,{when:"sm",platform:"touch",children:n(a,{modal:!0,dismissOnSnapToBottom:!0,children:[e(a.Frame,{children:e(a.ScrollView,{children:e(l.Contents,{})})}),e(a.Overlay,{})]})}),n(t.Content,{zIndex:2e5,children:[n(t.ScrollUpButton,{alignItems:"center",justifyContent:"center",position:"relative",width:"100%",height:"$3",children:[e(m,{zIndex:10,children:e(S,{size:20})}),e(i,{start:[0,0],end:[0,1],fullscreen:!0,colors:["$background","$backgroundTransparent"],borderRadius:"$4"})]}),e(t.Viewport,{minWidth:200,children:n(t.Group,{space:"$0",children:[e(t.Label,{children:"Fruits"}),h.map((r,s)=>n(t.Item,{index:s,value:r.name.toLowerCase(),children:[e(t.ItemText,{children:r.name}),e(t.ItemIndicator,{marginLeft:"auto",children:e(u,{size:16})})]},r.name))]})}),n(t.ScrollDownButton,{alignItems:"center",justifyContent:"center",position:"relative",width:"100%",height:"$3",children:[e(m,{zIndex:10,children:e(o,{size:20})}),e(i,{start:[0,0],end:[0,1],fullscreen:!0,colors:["$backgroundTransparent","$background"],borderRadius:"$4"})]})]})]})}const h=[{name:"Apple"},{name:"Pear"},{name:"Blackberry"},{name:"Peach"},{name:"Apricot"},{name:"Melon"},{name:"Honeydew"},{name:"Starfruit"},{name:"Blueberry"},{name:"Raspberry"},{name:"Strawberry"},{name:"Mango"},{name:"Pineapple"},{name:"Lime"},{name:"Lemon"},{name:"Coconut"},{name:"Guava"},{name:"Papaya"},{name:"Orange"},{name:"Grape"},{name:"Jackfruit"},{name:"Durian"}];export{b as SelectDemo};
|
|
80
2
|
//# sourceMappingURL=SelectDemo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SelectDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'\nimport { useState } from 'react'\nimport { Adapt, Select, Sheet, YStack } from 'tamagui'\nimport { LinearGradient } from 'tamagui/linear-gradient'\n\nexport function SelectDemo() {\n const [val, setVal] = useState('apple')\n return (\n <Select id=\"food\" value={val} onValueChange={setVal}>\n <Select.Trigger width={180} iconAfter={ChevronDown}>\n <Select.Value placeholder=\"Something\" />\n </Select.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet modal dismissOnSnapToBottom>\n <Sheet.Frame>\n <Sheet.ScrollView>\n <Adapt.Contents />\n </Sheet.ScrollView>\n </Sheet.Frame>\n <Sheet.Overlay />\n </Sheet>\n </Adapt>\n\n <Select.Content zIndex={200000}>\n <Select.ScrollUpButton alignItems=\"center\" justifyContent=\"center\" position=\"relative\" width=\"100%\" height=\"$3\">\n <YStack zIndex={10}>\n <ChevronUp size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$background', '$backgroundTransparent']}\n borderRadius=\"$4\"\n />\n </Select.ScrollUpButton>\n\n <Select.Viewport minWidth={200}>\n <Select.Group space=\"$0\">\n <Select.Label>Fruits</Select.Label>\n {items.map((item, i) => {\n return (\n <Select.Item index={i} key={item.name} value={item.name.toLowerCase()}>\n <Select.ItemText>{item.name}</Select.ItemText>\n <Select.ItemIndicator marginLeft=\"auto\">\n <Check size={16} />\n </Select.ItemIndicator>\n </Select.Item>\n )\n })}\n </Select.Group>\n </Select.Viewport>\n\n <Select.ScrollDownButton alignItems=\"center\" justifyContent=\"center\" position=\"relative\" width=\"100%\" height=\"$3\">\n <YStack zIndex={10}>\n <ChevronDown size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$backgroundTransparent', '$background']}\n borderRadius=\"$4\"\n />\n </Select.ScrollDownButton>\n </Select.Content>\n </Select>\n )\n}\n\nconst items = [\n { name: 'Apple' },\n { name: 'Pear' },\n { name: 'Blackberry' },\n { name: 'Peach' },\n { name: 'Apricot' },\n { name: 'Melon' },\n { name: 'Honeydew' },\n { name: 'Starfruit' },\n { name: 'Blueberry' },\n { name: 'Raspberry' },\n { name: 'Strawberry' },\n { name: 'Mango' },\n { name: 'Pineapple' },\n { name: 'Lime' },\n { name: 'Lemon' },\n { name: 'Coconut' },\n { name: 'Guava' },\n { name: 'Papaya' },\n { name: 'Orange' },\n { name: 'Grape' },\n { name: 'Jackfruit' },\n { name: 'Durian' },\n]\n"],
|
|
5
|
-
"mappings": "AAUQ,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["jsx", "jsxs", "Check", "ChevronDown", "ChevronUp", "useState", "Adapt", "Select", "Sheet", "YStack", "LinearGradient", "SelectDemo", "val", "setVal", "items", "item", "i"]
|
|
7
7
|
}
|
package/dist/esm/SelectDemo.mjs
CHANGED
|
@@ -1,80 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Check, ChevronDown, ChevronUp } from "@tamagui/lucide-icons";
|
|
3
|
-
import { useState } from "react";
|
|
4
|
-
import { Adapt, Select, Sheet, YStack } from "tamagui";
|
|
5
|
-
import { LinearGradient } from "tamagui/linear-gradient";
|
|
6
|
-
function SelectDemo() {
|
|
7
|
-
const [val, setVal] = useState("apple");
|
|
8
|
-
return /* @__PURE__ */ jsxs(Select, { id: "food", value: val, onValueChange: setVal, children: [
|
|
9
|
-
/* @__PURE__ */ jsx(Select.Trigger, { width: 180, iconAfter: ChevronDown, children: /* @__PURE__ */ jsx(Select.Value, { placeholder: "Something" }) }),
|
|
10
|
-
/* @__PURE__ */ jsx(Adapt, { when: "sm", platform: "touch", children: /* @__PURE__ */ jsxs(Sheet, { modal: true, dismissOnSnapToBottom: true, children: [
|
|
11
|
-
/* @__PURE__ */ jsx(Sheet.Frame, { children: /* @__PURE__ */ jsx(Sheet.ScrollView, { children: /* @__PURE__ */ jsx(Adapt.Contents, {}) }) }),
|
|
12
|
-
/* @__PURE__ */ jsx(Sheet.Overlay, {})
|
|
13
|
-
] }) }),
|
|
14
|
-
/* @__PURE__ */ jsxs(Select.Content, { zIndex: 2e5, children: [
|
|
15
|
-
/* @__PURE__ */ jsxs(Select.ScrollUpButton, { alignItems: "center", justifyContent: "center", position: "relative", width: "100%", height: "$3", children: [
|
|
16
|
-
/* @__PURE__ */ jsx(YStack, { zIndex: 10, children: /* @__PURE__ */ jsx(ChevronUp, { size: 20 }) }),
|
|
17
|
-
/* @__PURE__ */ jsx(
|
|
18
|
-
LinearGradient,
|
|
19
|
-
{
|
|
20
|
-
start: [0, 0],
|
|
21
|
-
end: [0, 1],
|
|
22
|
-
fullscreen: true,
|
|
23
|
-
colors: ["$background", "$backgroundTransparent"],
|
|
24
|
-
borderRadius: "$4"
|
|
25
|
-
}
|
|
26
|
-
)
|
|
27
|
-
] }),
|
|
28
|
-
/* @__PURE__ */ jsx(Select.Viewport, { minWidth: 200, children: /* @__PURE__ */ jsxs(Select.Group, { space: "$0", children: [
|
|
29
|
-
/* @__PURE__ */ jsx(Select.Label, { children: "Fruits" }),
|
|
30
|
-
items.map((item, i) => {
|
|
31
|
-
return /* @__PURE__ */ jsxs(Select.Item, { index: i, value: item.name.toLowerCase(), children: [
|
|
32
|
-
/* @__PURE__ */ jsx(Select.ItemText, { children: item.name }),
|
|
33
|
-
/* @__PURE__ */ jsx(Select.ItemIndicator, { marginLeft: "auto", children: /* @__PURE__ */ jsx(Check, { size: 16 }) })
|
|
34
|
-
] }, item.name);
|
|
35
|
-
})
|
|
36
|
-
] }) }),
|
|
37
|
-
/* @__PURE__ */ jsxs(Select.ScrollDownButton, { alignItems: "center", justifyContent: "center", position: "relative", width: "100%", height: "$3", children: [
|
|
38
|
-
/* @__PURE__ */ jsx(YStack, { zIndex: 10, children: /* @__PURE__ */ jsx(ChevronDown, { size: 20 }) }),
|
|
39
|
-
/* @__PURE__ */ jsx(
|
|
40
|
-
LinearGradient,
|
|
41
|
-
{
|
|
42
|
-
start: [0, 0],
|
|
43
|
-
end: [0, 1],
|
|
44
|
-
fullscreen: true,
|
|
45
|
-
colors: ["$backgroundTransparent", "$background"],
|
|
46
|
-
borderRadius: "$4"
|
|
47
|
-
}
|
|
48
|
-
)
|
|
49
|
-
] })
|
|
50
|
-
] })
|
|
51
|
-
] });
|
|
52
|
-
}
|
|
53
|
-
const items = [
|
|
54
|
-
{ name: "Apple" },
|
|
55
|
-
{ name: "Pear" },
|
|
56
|
-
{ name: "Blackberry" },
|
|
57
|
-
{ name: "Peach" },
|
|
58
|
-
{ name: "Apricot" },
|
|
59
|
-
{ name: "Melon" },
|
|
60
|
-
{ name: "Honeydew" },
|
|
61
|
-
{ name: "Starfruit" },
|
|
62
|
-
{ name: "Blueberry" },
|
|
63
|
-
{ name: "Raspberry" },
|
|
64
|
-
{ name: "Strawberry" },
|
|
65
|
-
{ name: "Mango" },
|
|
66
|
-
{ name: "Pineapple" },
|
|
67
|
-
{ name: "Lime" },
|
|
68
|
-
{ name: "Lemon" },
|
|
69
|
-
{ name: "Coconut" },
|
|
70
|
-
{ name: "Guava" },
|
|
71
|
-
{ name: "Papaya" },
|
|
72
|
-
{ name: "Orange" },
|
|
73
|
-
{ name: "Grape" },
|
|
74
|
-
{ name: "Jackfruit" },
|
|
75
|
-
{ name: "Durian" }
|
|
76
|
-
];
|
|
77
|
-
export {
|
|
78
|
-
SelectDemo
|
|
79
|
-
};
|
|
1
|
+
import{jsx as e,jsxs as n}from"react/jsx-runtime";import{Check as u,ChevronDown as o,ChevronUp as S}from"@tamagui/lucide-icons";import{useState as d}from"react";import{Adapt as l,Select as t,Sheet as a,YStack as m}from"tamagui";import{LinearGradient as i}from"tamagui/linear-gradient";function b(){const[c,p]=d("apple");return n(t,{id:"food",value:c,onValueChange:p,children:[e(t.Trigger,{width:180,iconAfter:o,children:e(t.Value,{placeholder:"Something"})}),e(l,{when:"sm",platform:"touch",children:n(a,{modal:!0,dismissOnSnapToBottom:!0,children:[e(a.Frame,{children:e(a.ScrollView,{children:e(l.Contents,{})})}),e(a.Overlay,{})]})}),n(t.Content,{zIndex:2e5,children:[n(t.ScrollUpButton,{alignItems:"center",justifyContent:"center",position:"relative",width:"100%",height:"$3",children:[e(m,{zIndex:10,children:e(S,{size:20})}),e(i,{start:[0,0],end:[0,1],fullscreen:!0,colors:["$background","$backgroundTransparent"],borderRadius:"$4"})]}),e(t.Viewport,{minWidth:200,children:n(t.Group,{space:"$0",children:[e(t.Label,{children:"Fruits"}),h.map((r,s)=>n(t.Item,{index:s,value:r.name.toLowerCase(),children:[e(t.ItemText,{children:r.name}),e(t.ItemIndicator,{marginLeft:"auto",children:e(u,{size:16})})]},r.name))]})}),n(t.ScrollDownButton,{alignItems:"center",justifyContent:"center",position:"relative",width:"100%",height:"$3",children:[e(m,{zIndex:10,children:e(o,{size:20})}),e(i,{start:[0,0],end:[0,1],fullscreen:!0,colors:["$backgroundTransparent","$background"],borderRadius:"$4"})]})]})]})}const h=[{name:"Apple"},{name:"Pear"},{name:"Blackberry"},{name:"Peach"},{name:"Apricot"},{name:"Melon"},{name:"Honeydew"},{name:"Starfruit"},{name:"Blueberry"},{name:"Raspberry"},{name:"Strawberry"},{name:"Mango"},{name:"Pineapple"},{name:"Lime"},{name:"Lemon"},{name:"Coconut"},{name:"Guava"},{name:"Papaya"},{name:"Orange"},{name:"Grape"},{name:"Jackfruit"},{name:"Durian"}];export{b as SelectDemo};
|
|
80
2
|
//# sourceMappingURL=SelectDemo.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SelectDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'\nimport { useState } from 'react'\nimport { Adapt, Select, Sheet, YStack } from 'tamagui'\nimport { LinearGradient } from 'tamagui/linear-gradient'\n\nexport function SelectDemo() {\n const [val, setVal] = useState('apple')\n return (\n <Select id=\"food\" value={val} onValueChange={setVal}>\n <Select.Trigger width={180} iconAfter={ChevronDown}>\n <Select.Value placeholder=\"Something\" />\n </Select.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet modal dismissOnSnapToBottom>\n <Sheet.Frame>\n <Sheet.ScrollView>\n <Adapt.Contents />\n </Sheet.ScrollView>\n </Sheet.Frame>\n <Sheet.Overlay />\n </Sheet>\n </Adapt>\n\n <Select.Content zIndex={200000}>\n <Select.ScrollUpButton alignItems=\"center\" justifyContent=\"center\" position=\"relative\" width=\"100%\" height=\"$3\">\n <YStack zIndex={10}>\n <ChevronUp size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$background', '$backgroundTransparent']}\n borderRadius=\"$4\"\n />\n </Select.ScrollUpButton>\n\n <Select.Viewport minWidth={200}>\n <Select.Group space=\"$0\">\n <Select.Label>Fruits</Select.Label>\n {items.map((item, i) => {\n return (\n <Select.Item index={i} key={item.name} value={item.name.toLowerCase()}>\n <Select.ItemText>{item.name}</Select.ItemText>\n <Select.ItemIndicator marginLeft=\"auto\">\n <Check size={16} />\n </Select.ItemIndicator>\n </Select.Item>\n )\n })}\n </Select.Group>\n </Select.Viewport>\n\n <Select.ScrollDownButton alignItems=\"center\" justifyContent=\"center\" position=\"relative\" width=\"100%\" height=\"$3\">\n <YStack zIndex={10}>\n <ChevronDown size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$backgroundTransparent', '$background']}\n borderRadius=\"$4\"\n />\n </Select.ScrollDownButton>\n </Select.Content>\n </Select>\n )\n}\n\nconst items = [\n { name: 'Apple' },\n { name: 'Pear' },\n { name: 'Blackberry' },\n { name: 'Peach' },\n { name: 'Apricot' },\n { name: 'Melon' },\n { name: 'Honeydew' },\n { name: 'Starfruit' },\n { name: 'Blueberry' },\n { name: 'Raspberry' },\n { name: 'Strawberry' },\n { name: 'Mango' },\n { name: 'Pineapple' },\n { name: 'Lime' },\n { name: 'Lemon' },\n { name: 'Coconut' },\n { name: 'Guava' },\n { name: 'Papaya' },\n { name: 'Orange' },\n { name: 'Grape' },\n { name: 'Jackfruit' },\n { name: 'Durian' },\n]\n"],
|
|
5
|
-
"mappings": "AAUQ,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "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",
|
|
6
|
+
"names": ["jsx", "jsxs", "Check", "ChevronDown", "ChevronUp", "useState", "Adapt", "Select", "Sheet", "YStack", "LinearGradient", "SelectDemo", "val", "setVal", "items", "item", "i"]
|
|
7
7
|
}
|
|
@@ -1,20 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Paragraph, Separator, XStack, YStack } from "tamagui";
|
|
3
|
-
function SeparatorDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsxs(YStack, { width: "100%", maxWidth: 300, marginHorizontal: 15, children: [
|
|
5
|
-
/* @__PURE__ */ jsx(Paragraph, { fontWeight: "800", children: "Tamagui" }),
|
|
6
|
-
/* @__PURE__ */ jsx(Paragraph, { children: "A cross-platform component library." }),
|
|
7
|
-
/* @__PURE__ */ jsx(Separator, { marginVertical: 15 }),
|
|
8
|
-
/* @__PURE__ */ jsxs(XStack, { height: 20, alignItems: "center", children: [
|
|
9
|
-
/* @__PURE__ */ jsx(Paragraph, { children: "Blog" }),
|
|
10
|
-
/* @__PURE__ */ jsx(Separator, { alignSelf: "stretch", vertical: true, marginHorizontal: 15 }),
|
|
11
|
-
/* @__PURE__ */ jsx(Paragraph, { children: "Docs" }),
|
|
12
|
-
/* @__PURE__ */ jsx(Separator, { alignSelf: "stretch", vertical: true, marginHorizontal: 15 }),
|
|
13
|
-
/* @__PURE__ */ jsx(Paragraph, { children: "Source" })
|
|
14
|
-
] })
|
|
15
|
-
] });
|
|
16
|
-
}
|
|
17
|
-
export {
|
|
18
|
-
SeparatorDemo
|
|
19
|
-
};
|
|
1
|
+
import{jsx as a,jsxs as o}from"react/jsx-runtime";import{Paragraph as r,Separator as t,XStack as i,YStack as e}from"tamagui";function l(){return o(e,{width:"100%",maxWidth:300,marginHorizontal:15,children:[a(r,{fontWeight:"800",children:"Tamagui"}),a(r,{children:"A cross-platform component library."}),a(t,{marginVertical:15}),o(i,{height:20,alignItems:"center",children:[a(r,{children:"Blog"}),a(t,{alignSelf:"stretch",vertical:!0,marginHorizontal:15}),a(r,{children:"Docs"}),a(t,{alignSelf:"stretch",vertical:!0,marginHorizontal:15}),a(r,{children:"Source"})]})]})}export{l as SeparatorDemo};
|
|
20
2
|
//# sourceMappingURL=SeparatorDemo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SeparatorDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import React from 'react'\nimport { Paragraph, Separator, XStack, YStack } from 'tamagui'\n\nexport function SeparatorDemo() {\n return (\n <YStack width=\"100%\" maxWidth={300} marginHorizontal={15}>\n <Paragraph fontWeight=\"800\">Tamagui</Paragraph>\n <Paragraph>A cross-platform component library.</Paragraph>\n <Separator marginVertical={15} />\n <XStack height={20} alignItems=\"center\">\n <Paragraph>Blog</Paragraph>\n <Separator alignSelf=\"stretch\" vertical marginHorizontal={15} />\n <Paragraph>Docs</Paragraph>\n <Separator alignSelf=\"stretch\" vertical marginHorizontal={15} />\n <Paragraph>Source</Paragraph>\n </XStack>\n </YStack>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAMM,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAMM,cAAAA,EAGA,QAAAC,MAHA,oBALN,OAAS,aAAAC,EAAW,aAAAC,EAAW,UAAAC,EAAQ,UAAAC,MAAc,UAE9C,SAASC,GAAgB,CAC9B,OACEL,EAACI,EAAA,CAAO,MAAM,OAAO,SAAU,IAAK,iBAAkB,GACpD,UAAAL,EAACE,EAAA,CAAU,WAAW,MAAM,mBAAO,EACnCF,EAACE,EAAA,CAAU,+CAAmC,EAC9CF,EAACG,EAAA,CAAU,eAAgB,GAAI,EAC/BF,EAACG,EAAA,CAAO,OAAQ,GAAI,WAAW,SAC7B,UAAAJ,EAACE,EAAA,CAAU,gBAAI,EACfF,EAACG,EAAA,CAAU,UAAU,UAAU,SAAQ,GAAC,iBAAkB,GAAI,EAC9DH,EAACE,EAAA,CAAU,gBAAI,EACfF,EAACG,EAAA,CAAU,UAAU,UAAU,SAAQ,GAAC,iBAAkB,GAAI,EAC9DH,EAACE,EAAA,CAAU,kBAAM,GACnB,GACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "Paragraph", "Separator", "XStack", "YStack", "SeparatorDemo"]
|
|
7
7
|
}
|
|
@@ -1,20 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Paragraph, Separator, XStack, YStack } from "tamagui";
|
|
3
|
-
function SeparatorDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsxs(YStack, { width: "100%", maxWidth: 300, marginHorizontal: 15, children: [
|
|
5
|
-
/* @__PURE__ */ jsx(Paragraph, { fontWeight: "800", children: "Tamagui" }),
|
|
6
|
-
/* @__PURE__ */ jsx(Paragraph, { children: "A cross-platform component library." }),
|
|
7
|
-
/* @__PURE__ */ jsx(Separator, { marginVertical: 15 }),
|
|
8
|
-
/* @__PURE__ */ jsxs(XStack, { height: 20, alignItems: "center", children: [
|
|
9
|
-
/* @__PURE__ */ jsx(Paragraph, { children: "Blog" }),
|
|
10
|
-
/* @__PURE__ */ jsx(Separator, { alignSelf: "stretch", vertical: true, marginHorizontal: 15 }),
|
|
11
|
-
/* @__PURE__ */ jsx(Paragraph, { children: "Docs" }),
|
|
12
|
-
/* @__PURE__ */ jsx(Separator, { alignSelf: "stretch", vertical: true, marginHorizontal: 15 }),
|
|
13
|
-
/* @__PURE__ */ jsx(Paragraph, { children: "Source" })
|
|
14
|
-
] })
|
|
15
|
-
] });
|
|
16
|
-
}
|
|
17
|
-
export {
|
|
18
|
-
SeparatorDemo
|
|
19
|
-
};
|
|
1
|
+
import{jsx as a,jsxs as o}from"react/jsx-runtime";import{Paragraph as r,Separator as t,XStack as i,YStack as e}from"tamagui";function l(){return o(e,{width:"100%",maxWidth:300,marginHorizontal:15,children:[a(r,{fontWeight:"800",children:"Tamagui"}),a(r,{children:"A cross-platform component library."}),a(t,{marginVertical:15}),o(i,{height:20,alignItems:"center",children:[a(r,{children:"Blog"}),a(t,{alignSelf:"stretch",vertical:!0,marginHorizontal:15}),a(r,{children:"Docs"}),a(t,{alignSelf:"stretch",vertical:!0,marginHorizontal:15}),a(r,{children:"Source"})]})]})}export{l as SeparatorDemo};
|
|
20
2
|
//# sourceMappingURL=SeparatorDemo.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SeparatorDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import React from 'react'\nimport { Paragraph, Separator, XStack, YStack } from 'tamagui'\n\nexport function SeparatorDemo() {\n return (\n <YStack width=\"100%\" maxWidth={300} marginHorizontal={15}>\n <Paragraph fontWeight=\"800\">Tamagui</Paragraph>\n <Paragraph>A cross-platform component library.</Paragraph>\n <Separator marginVertical={15} />\n <XStack height={20} alignItems=\"center\">\n <Paragraph>Blog</Paragraph>\n <Separator alignSelf=\"stretch\" vertical marginHorizontal={15} />\n <Paragraph>Docs</Paragraph>\n <Separator alignSelf=\"stretch\" vertical marginHorizontal={15} />\n <Paragraph>Source</Paragraph>\n </XStack>\n </YStack>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAMM,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAMM,cAAAA,EAGA,QAAAC,MAHA,oBALN,OAAS,aAAAC,EAAW,aAAAC,EAAW,UAAAC,EAAQ,UAAAC,MAAc,UAE9C,SAASC,GAAgB,CAC9B,OACEL,EAACI,EAAA,CAAO,MAAM,OAAO,SAAU,IAAK,iBAAkB,GACpD,UAAAL,EAACE,EAAA,CAAU,WAAW,MAAM,mBAAO,EACnCF,EAACE,EAAA,CAAU,+CAAmC,EAC9CF,EAACG,EAAA,CAAU,eAAgB,GAAI,EAC/BF,EAACG,EAAA,CAAO,OAAQ,GAAI,WAAW,SAC7B,UAAAJ,EAACE,EAAA,CAAU,gBAAI,EACfF,EAACG,EAAA,CAAU,UAAU,UAAU,SAAQ,GAAC,iBAAkB,GAAI,EAC9DH,EAACE,EAAA,CAAU,gBAAI,EACfF,EAACG,EAAA,CAAU,UAAU,UAAU,SAAQ,GAAC,iBAAkB,GAAI,EAC9DH,EAACE,EAAA,CAAU,kBAAM,GACnB,GACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "Paragraph", "Separator", "XStack", "YStack", "SeparatorDemo"]
|
|
7
7
|
}
|
package/dist/esm/ShapesDemo.js
CHANGED
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Circle, Square, XStack } from "tamagui";
|
|
3
|
-
function ShapesDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsxs(XStack, { padding: "$2", space: "$4", children: [
|
|
5
|
-
/* @__PURE__ */ jsx(Square, { size: 100, backgroundColor: "$color", elevation: "$4" }),
|
|
6
|
-
/* @__PURE__ */ jsx(Circle, { size: 100, backgroundColor: "$color", elevation: "$4" })
|
|
7
|
-
] });
|
|
8
|
-
}
|
|
9
|
-
export {
|
|
10
|
-
ShapesDemo
|
|
11
|
-
};
|
|
1
|
+
import{jsx as o,jsxs as c}from"react/jsx-runtime";import{Circle as e,Square as r,XStack as a}from"tamagui";function l(){return c(a,{padding:"$2",space:"$4",children:[o(r,{size:100,backgroundColor:"$color",elevation:"$4"}),o(e,{size:100,backgroundColor:"$color",elevation:"$4"})]})}export{l as ShapesDemo};
|
|
12
2
|
//# sourceMappingURL=ShapesDemo.js.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ShapesDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { Circle, Square, XStack } from 'tamagui'\n\nexport function ShapesDemo() {\n return (\n <XStack padding=\"$2\" space=\"$4\">\n <Square size={100} backgroundColor=\"$color\" elevation=\"$4\" />\n <Circle size={100} backgroundColor=\"$color\" elevation=\"$4\" />\n </XStack>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAII,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAII,OACE,OAAAA,EADF,QAAAC,MAAA,oBAJJ,OAAS,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,MAAc,UAEhC,SAASC,GAAa,CAC3B,OACEJ,EAACG,EAAA,CAAO,QAAQ,KAAK,MAAM,KACzB,UAAAJ,EAACG,EAAA,CAAO,KAAM,IAAK,gBAAgB,SAAS,UAAU,KAAK,EAC3DH,EAACE,EAAA,CAAO,KAAM,IAAK,gBAAgB,SAAS,UAAU,KAAK,GAC7D,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "Circle", "Square", "XStack", "ShapesDemo"]
|
|
7
7
|
}
|
package/dist/esm/ShapesDemo.mjs
CHANGED
|
@@ -1,12 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Circle, Square, XStack } from "tamagui";
|
|
3
|
-
function ShapesDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsxs(XStack, { padding: "$2", space: "$4", children: [
|
|
5
|
-
/* @__PURE__ */ jsx(Square, { size: 100, backgroundColor: "$color", elevation: "$4" }),
|
|
6
|
-
/* @__PURE__ */ jsx(Circle, { size: 100, backgroundColor: "$color", elevation: "$4" })
|
|
7
|
-
] });
|
|
8
|
-
}
|
|
9
|
-
export {
|
|
10
|
-
ShapesDemo
|
|
11
|
-
};
|
|
1
|
+
import{jsx as o,jsxs as c}from"react/jsx-runtime";import{Circle as e,Square as r,XStack as a}from"tamagui";function l(){return c(a,{padding:"$2",space:"$4",children:[o(r,{size:100,backgroundColor:"$color",elevation:"$4"}),o(e,{size:100,backgroundColor:"$color",elevation:"$4"})]})}export{l as ShapesDemo};
|
|
12
2
|
//# sourceMappingURL=ShapesDemo.mjs.map
|
|
@@ -2,6 +2,6 @@
|
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ShapesDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { Circle, Square, XStack } from 'tamagui'\n\nexport function ShapesDemo() {\n return (\n <XStack padding=\"$2\" space=\"$4\">\n <Square size={100} backgroundColor=\"$color\" elevation=\"$4\" />\n <Circle size={100} backgroundColor=\"$color\" elevation=\"$4\" />\n </XStack>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAII,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAII,OACE,OAAAA,EADF,QAAAC,MAAA,oBAJJ,OAAS,UAAAC,EAAQ,UAAAC,EAAQ,UAAAC,MAAc,UAEhC,SAASC,GAAa,CAC3B,OACEJ,EAACG,EAAA,CAAO,QAAQ,KAAK,MAAM,KACzB,UAAAJ,EAACG,EAAA,CAAO,KAAM,IAAK,gBAAgB,SAAS,UAAU,KAAK,EAC3DH,EAACE,EAAA,CAAO,KAAM,IAAK,gBAAgB,SAAS,UAAU,KAAK,GAC7D,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "Circle", "Square", "XStack", "ShapesDemo"]
|
|
7
7
|
}
|
package/dist/esm/SheetDemo.js
CHANGED
|
@@ -1,80 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { ChevronDown, ChevronUp } from "@tamagui/lucide-icons";
|
|
3
|
-
import { Sheet } from "@tamagui/sheet";
|
|
4
|
-
import { useState } from "react";
|
|
5
|
-
import { Button, H1, H2, Input, Paragraph, XStack } from "tamagui";
|
|
6
|
-
const SheetDemo = () => {
|
|
7
|
-
const [position, setPosition] = useState(0);
|
|
8
|
-
const [open, setOpen] = useState(false);
|
|
9
|
-
const [modal, setModal] = useState(false);
|
|
10
|
-
const [innerOpen, setInnerOpen] = useState(false);
|
|
11
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
12
|
-
/* @__PURE__ */ jsxs(XStack, { space: true, children: [
|
|
13
|
-
/* @__PURE__ */ jsx(Button, { onPress: () => setOpen(true), children: "Open" }),
|
|
14
|
-
/* @__PURE__ */ jsx(Button, { onPress: () => setModal((x) => !x), children: modal ? "Type: Modal" : "Type: Inline" })
|
|
15
|
-
] }),
|
|
16
|
-
/* @__PURE__ */ jsxs(
|
|
17
|
-
Sheet,
|
|
18
|
-
{
|
|
19
|
-
forceRemoveScrollEnabled: open,
|
|
20
|
-
modal,
|
|
21
|
-
open,
|
|
22
|
-
onOpenChange: setOpen,
|
|
23
|
-
snapPoints: [85, 50, 25],
|
|
24
|
-
dismissOnSnapToBottom: true,
|
|
25
|
-
position,
|
|
26
|
-
onPositionChange: setPosition,
|
|
27
|
-
zIndex: 1e5,
|
|
28
|
-
animation: "bouncy",
|
|
29
|
-
children: [
|
|
30
|
-
/* @__PURE__ */ jsx(Sheet.Overlay, {}),
|
|
31
|
-
/* @__PURE__ */ jsx(Sheet.Handle, {}),
|
|
32
|
-
/* @__PURE__ */ jsxs(Sheet.Frame, { flex: 1, padding: "$4", justifyContent: "center", alignItems: "center", space: "$5", children: [
|
|
33
|
-
/* @__PURE__ */ jsx(Button, { size: "$6", circular: true, icon: ChevronDown, onPress: () => setOpen(false) }),
|
|
34
|
-
/* @__PURE__ */ jsx(Input, { width: 200 }),
|
|
35
|
-
modal && /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
36
|
-
/* @__PURE__ */ jsx(InnerSheet, { open: innerOpen, onOpenChange: setInnerOpen }),
|
|
37
|
-
/* @__PURE__ */ jsx(
|
|
38
|
-
Button,
|
|
39
|
-
{
|
|
40
|
-
size: "$6",
|
|
41
|
-
circular: true,
|
|
42
|
-
icon: ChevronUp,
|
|
43
|
-
onPress: () => setInnerOpen(true)
|
|
44
|
-
}
|
|
45
|
-
)
|
|
46
|
-
] })
|
|
47
|
-
] })
|
|
48
|
-
]
|
|
49
|
-
}
|
|
50
|
-
)
|
|
51
|
-
] });
|
|
52
|
-
};
|
|
53
|
-
function InnerSheet(props) {
|
|
54
|
-
return /* @__PURE__ */ jsxs(Sheet, { modal: true, snapPoints: [90], dismissOnSnapToBottom: true, ...props, children: [
|
|
55
|
-
/* @__PURE__ */ jsx(Sheet.Overlay, {}),
|
|
56
|
-
/* @__PURE__ */ jsx(Sheet.Handle, {}),
|
|
57
|
-
/* @__PURE__ */ jsx(Sheet.Frame, { flex: 1, justifyContent: "center", alignItems: "center", space: "$5", children: /* @__PURE__ */ jsxs(Sheet.ScrollView, { padding: "$4", space: true, children: [
|
|
58
|
-
/* @__PURE__ */ jsx(
|
|
59
|
-
Button,
|
|
60
|
-
{
|
|
61
|
-
size: "$8",
|
|
62
|
-
circular: true,
|
|
63
|
-
alignSelf: "center",
|
|
64
|
-
icon: ChevronDown,
|
|
65
|
-
onPress: () => {
|
|
66
|
-
var _a;
|
|
67
|
-
return (_a = props.onOpenChange) == null ? void 0 : _a.call(props, false);
|
|
68
|
-
}
|
|
69
|
-
}
|
|
70
|
-
),
|
|
71
|
-
/* @__PURE__ */ jsx(H1, { children: "Hello world" }),
|
|
72
|
-
/* @__PURE__ */ jsx(H2, { children: "You can scroll me" }),
|
|
73
|
-
[1, 2, 3].map((i) => /* @__PURE__ */ jsx(Paragraph, { size: "$10", children: "Eu officia sunt ipsum nisi dolore labore est laborum laborum in esse ad pariatur. Dolor excepteur esse deserunt voluptate labore ea. Exercitation ipsum deserunt occaecat cupidatat consequat est adipisicing velit cupidatat ullamco veniam aliquip reprehenderit officia. Officia labore culpa ullamco velit. In sit occaecat velit ipsum fugiat esse aliqua dolor sint." }, i))
|
|
74
|
-
] }) })
|
|
75
|
-
] });
|
|
76
|
-
}
|
|
77
|
-
export {
|
|
78
|
-
SheetDemo
|
|
79
|
-
};
|
|
1
|
+
import{Fragment as m,jsx as e,jsxs as o}from"react/jsx-runtime";import{ChevronDown as u,ChevronUp as S}from"@tamagui/lucide-icons";import{Sheet as n}from"@tamagui/sheet";import{useState as r}from"react";import{Button as i,H1 as g,H2 as P,Input as O,Paragraph as v,XStack as y}from"tamagui";const x=()=>{const[t,a]=r(0),[c,s]=r(!1),[l,d]=r(!1),[f,p]=r(!1);return o(m,{children:[o(y,{space:!0,children:[e(i,{onPress:()=>s(!0),children:"Open"}),e(i,{onPress:()=>d(h=>!h),children:l?"Type: Modal":"Type: Inline"})]}),o(n,{forceRemoveScrollEnabled:c,modal:l,open:c,onOpenChange:s,snapPoints:[85,50,25],dismissOnSnapToBottom:!0,position:t,onPositionChange:a,zIndex:1e5,animation:"bouncy",children:[e(n.Overlay,{}),e(n.Handle,{}),o(n.Frame,{flex:1,padding:"$4",justifyContent:"center",alignItems:"center",space:"$5",children:[e(i,{size:"$6",circular:!0,icon:u,onPress:()=>s(!1)}),e(O,{width:200}),l&&o(m,{children:[e(C,{open:f,onOpenChange:p}),e(i,{size:"$6",circular:!0,icon:S,onPress:()=>p(!0)})]})]})]})]})};function C(t){return o(n,{modal:!0,snapPoints:[90],dismissOnSnapToBottom:!0,...t,children:[e(n.Overlay,{}),e(n.Handle,{}),e(n.Frame,{flex:1,justifyContent:"center",alignItems:"center",space:"$5",children:o(n.ScrollView,{padding:"$4",space:!0,children:[e(i,{size:"$8",circular:!0,alignSelf:"center",icon:u,onPress:()=>{var a;return(a=t.onOpenChange)==null?void 0:a.call(t,!1)}}),e(g,{children:"Hello world"}),e(P,{children:"You can scroll me"}),[1,2,3].map(a=>e(v,{size:"$10",children:"Eu officia sunt ipsum nisi dolore labore est laborum laborum in esse ad pariatur. Dolor excepteur esse deserunt voluptate labore ea. Exercitation ipsum deserunt occaecat cupidatat consequat est adipisicing velit cupidatat ullamco veniam aliquip reprehenderit officia. Officia labore culpa ullamco velit. In sit occaecat velit ipsum fugiat esse aliqua dolor sint."},a))]})})]})}export{x as SheetDemo};
|
|
80
2
|
//# sourceMappingURL=SheetDemo.js.map
|