@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/ListItemDemo.tsx"],
|
|
4
4
|
"sourcesContent": ["import { ChevronRight, Cloud, Moon, Star, Sun } from '@tamagui/lucide-icons'\nimport { ListItem, Separator, XStack, YGroup } from 'tamagui'\n\nexport function ListItemDemo() {\n return (\n <XStack $sm={{ flexDirection: 'column' }} paddingHorizontal=\"$4\" space>\n <ListItemDemo1 />\n <ListItemDemo2 />\n </XStack>\n )\n}\n\nfunction ListItemDemo1() {\n return (\n <YGroup alignSelf=\"center\" bordered width={240} size=\"$4\">\n <YGroup.Item>\n <ListItem hoverTheme icon={Star} title=\"Star\" subTitle=\"Twinkles\" />\n </YGroup.Item>\n <YGroup.Item>\n <ListItem hoverTheme icon={Moon}>\n Moon\n </ListItem>\n </YGroup.Item>\n <YGroup.Item>\n <ListItem hoverTheme icon={Sun}>\n Sun\n </ListItem>\n </YGroup.Item>\n <YGroup.Item>\n <ListItem hoverTheme icon={Cloud}>\n Cloud\n </ListItem>\n </YGroup.Item>\n </YGroup>\n )\n}\n\nfunction ListItemDemo2() {\n return (\n <YGroup alignSelf=\"center\" bordered width={240} size=\"$5\" separator={<Separator />}>\n <YGroup.Item>\n <ListItem\n hoverTheme\n pressTheme\n title=\"Star\"\n subTitle=\"Subtitle\"\n icon={Star}\n iconAfter={ChevronRight}\n />\n </YGroup.Item>\n <YGroup.Item>\n <ListItem\n hoverTheme\n pressTheme\n title=\"Moon\"\n subTitle=\"Subtitle\"\n icon={Moon}\n iconAfter={ChevronRight}\n />\n </YGroup.Item>\n </YGroup>\n )\n}\n"],
|
|
5
|
-
"mappings": "AAKI,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAKI,OACE,OAAAA,EADF,QAAAC,MAAA,oBALJ,OAAS,gBAAAC,EAAc,SAAAC,EAAO,QAAAC,EAAM,QAAAC,EAAM,OAAAC,MAAW,wBACrD,OAAS,YAAAC,EAAU,aAAAC,EAAW,UAAAC,EAAQ,UAAAC,MAAc,UAE7C,SAASC,GAAe,CAC7B,OACEV,EAACQ,EAAA,CAAO,IAAK,CAAE,cAAe,QAAS,EAAG,kBAAkB,KAAK,MAAK,GACpE,UAAAT,EAACY,EAAA,EAAc,EACfZ,EAACa,EAAA,EAAc,GACjB,CAEJ,CAEA,SAASD,GAAgB,CACvB,OACEX,EAACS,EAAA,CAAO,UAAU,SAAS,SAAQ,GAAC,MAAO,IAAK,KAAK,KACnD,UAAAV,EAACU,EAAO,KAAP,CACC,SAAAV,EAACO,EAAA,CAAS,WAAU,GAAC,KAAMF,EAAM,MAAM,OAAO,SAAS,WAAW,EACpE,EACAL,EAACU,EAAO,KAAP,CACC,SAAAV,EAACO,EAAA,CAAS,WAAU,GAAC,KAAMH,EAAM,gBAEjC,EACF,EACAJ,EAACU,EAAO,KAAP,CACC,SAAAV,EAACO,EAAA,CAAS,WAAU,GAAC,KAAMD,EAAK,eAEhC,EACF,EACAN,EAACU,EAAO,KAAP,CACC,SAAAV,EAACO,EAAA,CAAS,WAAU,GAAC,KAAMJ,EAAO,iBAElC,EACF,GACF,CAEJ,CAEA,SAASU,GAAgB,CACvB,OACEZ,EAACS,EAAA,CAAO,UAAU,SAAS,SAAQ,GAAC,MAAO,IAAK,KAAK,KAAK,UAAWV,EAACQ,EAAA,EAAU,EAC9E,UAAAR,EAACU,EAAO,KAAP,CACC,SAAAV,EAACO,EAAA,CACC,WAAU,GACV,WAAU,GACV,MAAM,OACN,SAAS,WACT,KAAMF,EACN,UAAWH,EACb,EACF,EACAF,EAACU,EAAO,KAAP,CACC,SAAAV,EAACO,EAAA,CACC,WAAU,GACV,WAAU,GACV,MAAM,OACN,SAAS,WACT,KAAMH,EACN,UAAWF,EACb,EACF,GACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "ChevronRight", "Cloud", "Moon", "Star", "Sun", "ListItem", "Separator", "XStack", "YGroup", "ListItemDemo", "ListItemDemo1", "ListItemDemo2"]
|
|
7
7
|
}
|
|
@@ -1,33 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import * as LucideIcons from "@tamagui/lucide-icons";
|
|
3
|
-
import { useMemo, useState } from "react";
|
|
4
|
-
import { ScrollView } from "react-native";
|
|
5
|
-
import { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from "tamagui";
|
|
6
|
-
const lucideIcons = Object.keys(LucideIcons).map((name) => ({
|
|
7
|
-
key: name.toLowerCase(),
|
|
8
|
-
name,
|
|
9
|
-
Icon: LucideIcons[name]
|
|
10
|
-
}));
|
|
11
|
-
function LucideIconsDemo() {
|
|
12
|
-
const [searchRaw, setSearch] = useState("");
|
|
13
|
-
const search = useDebounceValue(searchRaw, 400);
|
|
14
|
-
const size = 100;
|
|
15
|
-
const iconsMemo = useMemo(() => {
|
|
16
|
-
const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
|
|
17
|
-
return icons.slice(0, 835).map(({ Icon, name }) => {
|
|
18
|
-
return /* @__PURE__ */ jsxs(YStack, { height: size, alignItems: "center", justifyContent: "center", children: [
|
|
19
|
-
/* @__PURE__ */ jsx(Icon, { size: size * 0.25 }),
|
|
20
|
-
/* @__PURE__ */ jsx(Spacer, {}),
|
|
21
|
-
/* @__PURE__ */ jsx(Paragraph, { size: "$2", o: 0.5, children: name })
|
|
22
|
-
] }, name);
|
|
23
|
-
});
|
|
24
|
-
}, [search]);
|
|
25
|
-
return /* @__PURE__ */ jsxs(YStack, { alignSelf: "stretch", padding: "$4", paddingBottom: "$0", space: true, children: [
|
|
26
|
-
/* @__PURE__ */ jsx(Input, { value: searchRaw, onChangeText: setSearch, placeholder: "Search..." }),
|
|
27
|
-
/* @__PURE__ */ jsx(YStack, { height: 420, children: /* @__PURE__ */ jsx(ScrollView, { children: /* @__PURE__ */ jsx(Grid, { itemMinWidth: size, children: iconsMemo }) }) })
|
|
28
|
-
] });
|
|
29
|
-
}
|
|
30
|
-
export {
|
|
31
|
-
LucideIconsDemo
|
|
32
|
-
};
|
|
1
|
+
import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as a from"@tamagui/lucide-icons";import{useMemo as l,useState as u}from"react";import{ScrollView as m}from"react-native";import{Grid as d,Input as S,Paragraph as g,Spacer as f,YStack as r,useDebounceValue as k}from"tamagui";const I=Object.keys(a).map(t=>({key:t.toLowerCase(),name:t,Icon:a[t]}));function Y(){const[t,h]=u(""),s=k(t,400),o=100,p=l(()=>I.filter(c=>c.key.startsWith(s.toLowerCase())).slice(0,835).map(({Icon:c,name:i})=>n(r,{height:o,alignItems:"center",justifyContent:"center",children:[e(c,{size:o*.25}),e(f,{}),e(g,{size:"$2",o:.5,children:i})]},i)),[s]);return n(r,{alignSelf:"stretch",padding:"$4",paddingBottom:"$0",space:!0,children:[e(S,{value:t,onChangeText:h,placeholder:"Search..."}),e(r,{height:420,children:e(m,{children:e(d,{itemMinWidth:o,children:p})})})]})}export{Y as LucideIconsDemo};
|
|
33
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": "AAqBQ,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAqBQ,OACE,OAAAA,EADF,QAAAC,MAAA,oBArBR,UAAYC,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,IAEzCZ,EAACS,EAAA,CAAO,OAAQQ,EAAM,WAAW,SAAS,eAAe,SACvD,UAAAlB,EAACqB,EAAA,CAAK,KAAMH,EAAO,IAAM,EACzBlB,EAACS,EAAA,EAAO,EACRT,EAACQ,EAAA,CAAU,KAAK,KAAK,EAAG,GACrB,SAAAK,EACH,IALqEA,CAMvE,CAEH,EACA,CAACI,CAAM,CAAC,EAEX,OACEhB,EAACS,EAAA,CAAO,UAAU,UAAU,QAAQ,KAAK,cAAc,KAAK,MAAK,GAC/D,UAAAV,EAACO,EAAA,CAAM,MAAOQ,EAAW,aAAcC,EAAW,YAAY,YAAY,EAE1EhB,EAACU,EAAA,CAAO,OAAQ,IACd,SAAAV,EAACK,EAAA,CACC,SAAAL,EAACM,EAAA,CAAK,aAAcY,EAAO,SAAAC,EAAU,EACvC,EACF,GACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "LucideIcons", "useMemo", "useState", "ScrollView", "Grid", "Input", "Paragraph", "Spacer", "YStack", "useDebounceValue", "lucideIcons", "name", "LucideIconsDemo", "searchRaw", "setSearch", "search", "size", "iconsMemo", "x", "Icon"]
|
|
7
7
|
}
|
|
@@ -1,33 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import * as LucideIcons from "@tamagui/lucide-icons";
|
|
3
|
-
import { useMemo, useState } from "react";
|
|
4
|
-
import { ScrollView } from "react-native";
|
|
5
|
-
import { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from "tamagui";
|
|
6
|
-
const lucideIcons = Object.keys(LucideIcons).map((name) => ({
|
|
7
|
-
key: name.toLowerCase(),
|
|
8
|
-
name,
|
|
9
|
-
Icon: LucideIcons[name]
|
|
10
|
-
}));
|
|
11
|
-
function LucideIconsDemo() {
|
|
12
|
-
const [searchRaw, setSearch] = useState("");
|
|
13
|
-
const search = useDebounceValue(searchRaw, 400);
|
|
14
|
-
const size = 100;
|
|
15
|
-
const iconsMemo = useMemo(() => {
|
|
16
|
-
const icons = lucideIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
|
|
17
|
-
return icons.slice(0, 835).map(({ Icon, name }) => {
|
|
18
|
-
return /* @__PURE__ */ jsxs(YStack, { height: size, alignItems: "center", justifyContent: "center", children: [
|
|
19
|
-
/* @__PURE__ */ jsx(Icon, { size: size * 0.25 }),
|
|
20
|
-
/* @__PURE__ */ jsx(Spacer, {}),
|
|
21
|
-
/* @__PURE__ */ jsx(Paragraph, { size: "$2", o: 0.5, children: name })
|
|
22
|
-
] }, name);
|
|
23
|
-
});
|
|
24
|
-
}, [search]);
|
|
25
|
-
return /* @__PURE__ */ jsxs(YStack, { alignSelf: "stretch", padding: "$4", paddingBottom: "$0", space: true, children: [
|
|
26
|
-
/* @__PURE__ */ jsx(Input, { value: searchRaw, onChangeText: setSearch, placeholder: "Search..." }),
|
|
27
|
-
/* @__PURE__ */ jsx(YStack, { height: 420, children: /* @__PURE__ */ jsx(ScrollView, { children: /* @__PURE__ */ jsx(Grid, { itemMinWidth: size, children: iconsMemo }) }) })
|
|
28
|
-
] });
|
|
29
|
-
}
|
|
30
|
-
export {
|
|
31
|
-
LucideIconsDemo
|
|
32
|
-
};
|
|
1
|
+
import{jsx as e,jsxs as n}from"react/jsx-runtime";import*as a from"@tamagui/lucide-icons";import{useMemo as l,useState as u}from"react";import{ScrollView as m}from"react-native";import{Grid as d,Input as S,Paragraph as g,Spacer as f,YStack as r,useDebounceValue as k}from"tamagui";const I=Object.keys(a).map(t=>({key:t.toLowerCase(),name:t,Icon:a[t]}));function Y(){const[t,h]=u(""),s=k(t,400),o=100,p=l(()=>I.filter(c=>c.key.startsWith(s.toLowerCase())).slice(0,835).map(({Icon:c,name:i})=>n(r,{height:o,alignItems:"center",justifyContent:"center",children:[e(c,{size:o*.25}),e(f,{}),e(g,{size:"$2",o:.5,children:i})]},i)),[s]);return n(r,{alignSelf:"stretch",padding:"$4",paddingBottom:"$0",space:!0,children:[e(S,{value:t,onChangeText:h,placeholder:"Search..."}),e(r,{height:420,children:e(m,{children:e(d,{itemMinWidth:o,children:p})})})]})}export{Y as LucideIconsDemo};
|
|
33
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": "AAqBQ,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAqBQ,OACE,OAAAA,EADF,QAAAC,MAAA,oBArBR,UAAYC,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,IAEzCZ,EAACS,EAAA,CAAO,OAAQQ,EAAM,WAAW,SAAS,eAAe,SACvD,UAAAlB,EAACqB,EAAA,CAAK,KAAMH,EAAO,IAAM,EACzBlB,EAACS,EAAA,EAAO,EACRT,EAACQ,EAAA,CAAU,KAAK,KAAK,EAAG,GACrB,SAAAK,EACH,IALqEA,CAMvE,CAEH,EACA,CAACI,CAAM,CAAC,EAEX,OACEhB,EAACS,EAAA,CAAO,UAAU,UAAU,QAAQ,KAAK,cAAc,KAAK,MAAK,GAC/D,UAAAV,EAACO,EAAA,CAAM,MAAOQ,EAAW,aAAcC,EAAW,YAAY,YAAY,EAE1EhB,EAACU,EAAA,CAAO,OAAQ,IACd,SAAAV,EAACK,EAAA,CACC,SAAAL,EAACM,EAAA,CAAK,aAAcY,EAAO,SAAAC,EAAU,EACvC,EACF,GACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "LucideIcons", "useMemo", "useState", "ScrollView", "Grid", "Input", "Paragraph", "Spacer", "YStack", "useDebounceValue", "lucideIcons", "name", "LucideIconsDemo", "searchRaw", "setSearch", "search", "size", "iconsMemo", "x", "Icon"]
|
|
7
7
|
}
|
package/dist/esm/PopoverDemo.js
CHANGED
|
@@ -1,76 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from "@tamagui/lucide-icons";
|
|
3
|
-
import {
|
|
4
|
-
Adapt,
|
|
5
|
-
Button,
|
|
6
|
-
Input,
|
|
7
|
-
Label,
|
|
8
|
-
Popover,
|
|
9
|
-
XStack,
|
|
10
|
-
YGroup
|
|
11
|
-
} from "tamagui";
|
|
12
|
-
function PopoverDemo() {
|
|
13
|
-
return /* @__PURE__ */ jsxs(XStack, { space: "$2", flex: 1, justifyContent: "center", alignItems: "center", children: [
|
|
14
|
-
/* @__PURE__ */ jsx(Demo, { placement: "left", Icon: ChevronLeft, Name: "left-popover" }),
|
|
15
|
-
/* @__PURE__ */ jsx(Demo, { placement: "bottom", Icon: ChevronDown, Name: "bottom-popover" }),
|
|
16
|
-
/* @__PURE__ */ jsx(Demo, { placement: "top", Icon: ChevronUp, Name: "top-popover" }),
|
|
17
|
-
/* @__PURE__ */ jsx(Demo, { placement: "right", Icon: ChevronRight, Name: "right-popover" })
|
|
18
|
-
] });
|
|
19
|
-
}
|
|
20
|
-
function Demo({
|
|
21
|
-
Icon,
|
|
22
|
-
Name,
|
|
23
|
-
...props
|
|
24
|
-
}) {
|
|
25
|
-
return /* @__PURE__ */ jsxs(Popover, { size: "$5", ...props, children: [
|
|
26
|
-
/* @__PURE__ */ jsx(Popover.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { icon: Icon }) }),
|
|
27
|
-
/* @__PURE__ */ jsx(Adapt, { when: "sm", platform: "web", children: /* @__PURE__ */ jsxs(Popover.Sheet, { modal: true, dismissOnSnapToBottom: true, children: [
|
|
28
|
-
/* @__PURE__ */ jsx(Popover.Sheet.Frame, { padding: "$4", children: /* @__PURE__ */ jsx(Adapt.Contents, {}) }),
|
|
29
|
-
/* @__PURE__ */ jsx(Popover.Sheet.Overlay, {})
|
|
30
|
-
] }) }),
|
|
31
|
-
/* @__PURE__ */ jsxs(
|
|
32
|
-
Popover.Content,
|
|
33
|
-
{
|
|
34
|
-
borderWidth: 1,
|
|
35
|
-
borderColor: "$borderColor",
|
|
36
|
-
enterStyle: { x: 0, y: -10, opacity: 0 },
|
|
37
|
-
exitStyle: { x: 0, y: -10, opacity: 0 },
|
|
38
|
-
x: 0,
|
|
39
|
-
y: 0,
|
|
40
|
-
opacity: 1,
|
|
41
|
-
animation: [
|
|
42
|
-
"quick",
|
|
43
|
-
{
|
|
44
|
-
opacity: {
|
|
45
|
-
overshootClamping: true
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
],
|
|
49
|
-
elevate: true,
|
|
50
|
-
children: [
|
|
51
|
-
/* @__PURE__ */ jsx(Popover.Arrow, { borderWidth: 1, borderColor: "$borderColor" }),
|
|
52
|
-
/* @__PURE__ */ jsxs(YGroup, { space: "$3", children: [
|
|
53
|
-
/* @__PURE__ */ jsx(YGroup.Item, { children: /* @__PURE__ */ jsxs(XStack, { space: "$3", children: [
|
|
54
|
-
/* @__PURE__ */ jsx(Label, { size: "$3", htmlFor: Name, children: "Name" }),
|
|
55
|
-
/* @__PURE__ */ jsx(Input, { size: "$3", id: Name })
|
|
56
|
-
] }) }),
|
|
57
|
-
/* @__PURE__ */ jsx(YGroup.Item, { children: /* @__PURE__ */ jsx(Popover.Close, { asChild: true, children: /* @__PURE__ */ jsx(
|
|
58
|
-
Button,
|
|
59
|
-
{
|
|
60
|
-
size: "$3",
|
|
61
|
-
onPress: () => {
|
|
62
|
-
},
|
|
63
|
-
children: "Submit"
|
|
64
|
-
}
|
|
65
|
-
) }) })
|
|
66
|
-
] })
|
|
67
|
-
]
|
|
68
|
-
}
|
|
69
|
-
)
|
|
70
|
-
] });
|
|
71
|
-
}
|
|
72
|
-
export {
|
|
73
|
-
Demo,
|
|
74
|
-
PopoverDemo
|
|
75
|
-
};
|
|
1
|
+
import{jsx as o,jsxs as t}from"react/jsx-runtime";import{ChevronDown as s,ChevronLeft as v,ChevronRight as h,ChevronUp as d}from"@tamagui/lucide-icons";import{Adapt as a,Button as i,Input as C,Label as u,Popover as e,XStack as m,YGroup as p}from"tamagui";function S(){return t(m,{space:"$2",flex:1,justifyContent:"center",alignItems:"center",children:[o(r,{placement:"left",Icon:v,Name:"left-popover"}),o(r,{placement:"bottom",Icon:s,Name:"bottom-popover"}),o(r,{placement:"top",Icon:d,Name:"top-popover"}),o(r,{placement:"right",Icon:h,Name:"right-popover"})]})}function r({Icon:l,Name:n,...c}){return t(e,{size:"$5",...c,children:[o(e.Trigger,{asChild:!0,children:o(i,{icon:l})}),o(a,{when:"sm",platform:"web",children:t(e.Sheet,{modal:!0,dismissOnSnapToBottom:!0,children:[o(e.Sheet.Frame,{padding:"$4",children:o(a.Contents,{})}),o(e.Sheet.Overlay,{})]})}),t(e.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:!0,children:[o(e.Arrow,{borderWidth:1,borderColor:"$borderColor"}),t(p,{space:"$3",children:[o(p.Item,{children:t(m,{space:"$3",children:[o(u,{size:"$3",htmlFor:n,children:"Name"}),o(C,{size:"$3",id:n})]})}),o(p.Item,{children:o(e.Close,{asChild:!0,children:o(i,{size:"$3",onPress:()=>{},children:"Submit"})})})]})]})]})}export{r as Demo,S as PopoverDemo};
|
|
76
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": "AAcI,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAcI,OACE,OAAAA,EADF,QAAAC,MAAA,oBAdJ,OAAS,eAAAC,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,OACEZ,EAACU,EAAA,CAAO,MAAM,KAAK,KAAM,EAAG,eAAe,SAAS,WAAW,SAC7D,UAAAX,EAACc,EAAA,CAAK,UAAU,OAAO,KAAMX,EAAa,KAAK,eAAe,EAC9DH,EAACc,EAAA,CAAK,UAAU,SAAS,KAAMZ,EAAa,KAAK,iBAAiB,EAClEF,EAACc,EAAA,CAAK,UAAU,MAAM,KAAMT,EAAW,KAAK,cAAc,EAC1DL,EAACc,EAAA,CAAK,UAAU,QAAQ,KAAMV,EAAc,KAAK,gBAAgB,GACnE,CAEJ,CAEO,SAASU,EAAK,CACnB,KAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAiD,CAC/C,OACEhB,EAACS,EAAA,CAAQ,KAAK,KAAM,GAAGO,EACrB,UAAAjB,EAACU,EAAQ,QAAR,CAAgB,QAAO,GACtB,SAAAV,EAACO,EAAA,CAAO,KAAMQ,EAAM,EACtB,EAEAf,EAACM,EAAA,CAAM,KAAK,KAAK,SAAS,MACxB,SAAAL,EAACS,EAAQ,MAAR,CAAc,MAAK,GAAC,sBAAqB,GACxC,UAAAV,EAACU,EAAQ,MAAM,MAAd,CAAoB,QAAQ,KAC3B,SAAAV,EAACM,EAAM,SAAN,EAAe,EAClB,EACAN,EAACU,EAAQ,MAAM,QAAd,EAAsB,GACzB,EACF,EAEAT,EAACS,EAAQ,QAAR,CACC,YAAa,EACb,YAAY,eACZ,WAAY,CAAE,EAAG,EAAG,EAAG,IAAK,QAAS,CAAE,EACvC,UAAW,CAAE,EAAG,EAAG,EAAG,IAAK,QAAS,CAAE,EACtC,EAAG,EACH,EAAG,EACH,QAAS,EACT,UAAW,CACT,QACA,CACE,QAAS,CACP,kBAAmB,EACrB,CACF,CACF,EACA,QAAO,GAEP,UAAAV,EAACU,EAAQ,MAAR,CAAc,YAAa,EAAG,YAAY,eAAe,EAE1DT,EAACW,EAAA,CAAO,MAAM,KACZ,UAAAZ,EAACY,EAAO,KAAP,CACC,SAAAX,EAACU,EAAA,CAAO,MAAM,KACZ,UAAAX,EAACS,EAAA,CAAM,KAAK,KAAK,QAASO,EAAM,gBAEhC,EACAhB,EAACQ,EAAA,CAAM,KAAK,KAAK,GAAIQ,EAAM,GAC7B,EACF,EACAhB,EAACY,EAAO,KAAP,CACC,SAAAZ,EAACU,EAAQ,MAAR,CAAc,QAAO,GACpB,SAAAV,EAACO,EAAA,CACC,KAAK,KACL,QAAS,IAAM,CAEf,EACD,kBAED,EACF,EACF,GACF,GACF,GACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "ChevronDown", "ChevronLeft", "ChevronRight", "ChevronUp", "Adapt", "Button", "Input", "Label", "Popover", "XStack", "YGroup", "PopoverDemo", "Demo", "Icon", "Name", "props"]
|
|
7
7
|
}
|
package/dist/esm/PopoverDemo.mjs
CHANGED
|
@@ -1,76 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from "@tamagui/lucide-icons";
|
|
3
|
-
import {
|
|
4
|
-
Adapt,
|
|
5
|
-
Button,
|
|
6
|
-
Input,
|
|
7
|
-
Label,
|
|
8
|
-
Popover,
|
|
9
|
-
XStack,
|
|
10
|
-
YGroup
|
|
11
|
-
} from "tamagui";
|
|
12
|
-
function PopoverDemo() {
|
|
13
|
-
return /* @__PURE__ */ jsxs(XStack, { space: "$2", flex: 1, justifyContent: "center", alignItems: "center", children: [
|
|
14
|
-
/* @__PURE__ */ jsx(Demo, { placement: "left", Icon: ChevronLeft, Name: "left-popover" }),
|
|
15
|
-
/* @__PURE__ */ jsx(Demo, { placement: "bottom", Icon: ChevronDown, Name: "bottom-popover" }),
|
|
16
|
-
/* @__PURE__ */ jsx(Demo, { placement: "top", Icon: ChevronUp, Name: "top-popover" }),
|
|
17
|
-
/* @__PURE__ */ jsx(Demo, { placement: "right", Icon: ChevronRight, Name: "right-popover" })
|
|
18
|
-
] });
|
|
19
|
-
}
|
|
20
|
-
function Demo({
|
|
21
|
-
Icon,
|
|
22
|
-
Name,
|
|
23
|
-
...props
|
|
24
|
-
}) {
|
|
25
|
-
return /* @__PURE__ */ jsxs(Popover, { size: "$5", ...props, children: [
|
|
26
|
-
/* @__PURE__ */ jsx(Popover.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { icon: Icon }) }),
|
|
27
|
-
/* @__PURE__ */ jsx(Adapt, { when: "sm", platform: "web", children: /* @__PURE__ */ jsxs(Popover.Sheet, { modal: true, dismissOnSnapToBottom: true, children: [
|
|
28
|
-
/* @__PURE__ */ jsx(Popover.Sheet.Frame, { padding: "$4", children: /* @__PURE__ */ jsx(Adapt.Contents, {}) }),
|
|
29
|
-
/* @__PURE__ */ jsx(Popover.Sheet.Overlay, {})
|
|
30
|
-
] }) }),
|
|
31
|
-
/* @__PURE__ */ jsxs(
|
|
32
|
-
Popover.Content,
|
|
33
|
-
{
|
|
34
|
-
borderWidth: 1,
|
|
35
|
-
borderColor: "$borderColor",
|
|
36
|
-
enterStyle: { x: 0, y: -10, opacity: 0 },
|
|
37
|
-
exitStyle: { x: 0, y: -10, opacity: 0 },
|
|
38
|
-
x: 0,
|
|
39
|
-
y: 0,
|
|
40
|
-
opacity: 1,
|
|
41
|
-
animation: [
|
|
42
|
-
"quick",
|
|
43
|
-
{
|
|
44
|
-
opacity: {
|
|
45
|
-
overshootClamping: true
|
|
46
|
-
}
|
|
47
|
-
}
|
|
48
|
-
],
|
|
49
|
-
elevate: true,
|
|
50
|
-
children: [
|
|
51
|
-
/* @__PURE__ */ jsx(Popover.Arrow, { borderWidth: 1, borderColor: "$borderColor" }),
|
|
52
|
-
/* @__PURE__ */ jsxs(YGroup, { space: "$3", children: [
|
|
53
|
-
/* @__PURE__ */ jsx(YGroup.Item, { children: /* @__PURE__ */ jsxs(XStack, { space: "$3", children: [
|
|
54
|
-
/* @__PURE__ */ jsx(Label, { size: "$3", htmlFor: Name, children: "Name" }),
|
|
55
|
-
/* @__PURE__ */ jsx(Input, { size: "$3", id: Name })
|
|
56
|
-
] }) }),
|
|
57
|
-
/* @__PURE__ */ jsx(YGroup.Item, { children: /* @__PURE__ */ jsx(Popover.Close, { asChild: true, children: /* @__PURE__ */ jsx(
|
|
58
|
-
Button,
|
|
59
|
-
{
|
|
60
|
-
size: "$3",
|
|
61
|
-
onPress: () => {
|
|
62
|
-
},
|
|
63
|
-
children: "Submit"
|
|
64
|
-
}
|
|
65
|
-
) }) })
|
|
66
|
-
] })
|
|
67
|
-
]
|
|
68
|
-
}
|
|
69
|
-
)
|
|
70
|
-
] });
|
|
71
|
-
}
|
|
72
|
-
export {
|
|
73
|
-
Demo,
|
|
74
|
-
PopoverDemo
|
|
75
|
-
};
|
|
1
|
+
import{jsx as o,jsxs as t}from"react/jsx-runtime";import{ChevronDown as s,ChevronLeft as v,ChevronRight as h,ChevronUp as d}from"@tamagui/lucide-icons";import{Adapt as a,Button as i,Input as C,Label as u,Popover as e,XStack as m,YGroup as p}from"tamagui";function S(){return t(m,{space:"$2",flex:1,justifyContent:"center",alignItems:"center",children:[o(r,{placement:"left",Icon:v,Name:"left-popover"}),o(r,{placement:"bottom",Icon:s,Name:"bottom-popover"}),o(r,{placement:"top",Icon:d,Name:"top-popover"}),o(r,{placement:"right",Icon:h,Name:"right-popover"})]})}function r({Icon:l,Name:n,...c}){return t(e,{size:"$5",...c,children:[o(e.Trigger,{asChild:!0,children:o(i,{icon:l})}),o(a,{when:"sm",platform:"web",children:t(e.Sheet,{modal:!0,dismissOnSnapToBottom:!0,children:[o(e.Sheet.Frame,{padding:"$4",children:o(a.Contents,{})}),o(e.Sheet.Overlay,{})]})}),t(e.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:!0,children:[o(e.Arrow,{borderWidth:1,borderColor:"$borderColor"}),t(p,{space:"$3",children:[o(p.Item,{children:t(m,{space:"$3",children:[o(u,{size:"$3",htmlFor:n,children:"Name"}),o(C,{size:"$3",id:n})]})}),o(p.Item,{children:o(e.Close,{asChild:!0,children:o(i,{size:"$3",onPress:()=>{},children:"Submit"})})})]})]})]})}export{r as Demo,S as PopoverDemo};
|
|
76
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": "AAcI,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAcI,OACE,OAAAA,EADF,QAAAC,MAAA,oBAdJ,OAAS,eAAAC,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,OACEZ,EAACU,EAAA,CAAO,MAAM,KAAK,KAAM,EAAG,eAAe,SAAS,WAAW,SAC7D,UAAAX,EAACc,EAAA,CAAK,UAAU,OAAO,KAAMX,EAAa,KAAK,eAAe,EAC9DH,EAACc,EAAA,CAAK,UAAU,SAAS,KAAMZ,EAAa,KAAK,iBAAiB,EAClEF,EAACc,EAAA,CAAK,UAAU,MAAM,KAAMT,EAAW,KAAK,cAAc,EAC1DL,EAACc,EAAA,CAAK,UAAU,QAAQ,KAAMV,EAAc,KAAK,gBAAgB,GACnE,CAEJ,CAEO,SAASU,EAAK,CACnB,KAAAC,EACA,KAAAC,EACA,GAAGC,CACL,EAAiD,CAC/C,OACEhB,EAACS,EAAA,CAAQ,KAAK,KAAM,GAAGO,EACrB,UAAAjB,EAACU,EAAQ,QAAR,CAAgB,QAAO,GACtB,SAAAV,EAACO,EAAA,CAAO,KAAMQ,EAAM,EACtB,EAEAf,EAACM,EAAA,CAAM,KAAK,KAAK,SAAS,MACxB,SAAAL,EAACS,EAAQ,MAAR,CAAc,MAAK,GAAC,sBAAqB,GACxC,UAAAV,EAACU,EAAQ,MAAM,MAAd,CAAoB,QAAQ,KAC3B,SAAAV,EAACM,EAAM,SAAN,EAAe,EAClB,EACAN,EAACU,EAAQ,MAAM,QAAd,EAAsB,GACzB,EACF,EAEAT,EAACS,EAAQ,QAAR,CACC,YAAa,EACb,YAAY,eACZ,WAAY,CAAE,EAAG,EAAG,EAAG,IAAK,QAAS,CAAE,EACvC,UAAW,CAAE,EAAG,EAAG,EAAG,IAAK,QAAS,CAAE,EACtC,EAAG,EACH,EAAG,EACH,QAAS,EACT,UAAW,CACT,QACA,CACE,QAAS,CACP,kBAAmB,EACrB,CACF,CACF,EACA,QAAO,GAEP,UAAAV,EAACU,EAAQ,MAAR,CAAc,YAAa,EAAG,YAAY,eAAe,EAE1DT,EAACW,EAAA,CAAO,MAAM,KACZ,UAAAZ,EAACY,EAAO,KAAP,CACC,SAAAX,EAACU,EAAA,CAAO,MAAM,KACZ,UAAAX,EAACS,EAAA,CAAM,KAAK,KAAK,QAASO,EAAM,gBAEhC,EACAhB,EAACQ,EAAA,CAAM,KAAK,KAAK,GAAIQ,EAAM,GAC7B,EACF,EACAhB,EAACY,EAAO,KAAP,CACC,SAAAZ,EAACU,EAAQ,MAAR,CAAc,QAAO,GACpB,SAAAV,EAACO,EAAA,CACC,KAAK,KACL,QAAS,IAAM,CAEf,EACD,kBAED,EACF,EACF,GACF,GACF,GACF,CAEJ",
|
|
6
|
+
"names": ["jsx", "jsxs", "ChevronDown", "ChevronLeft", "ChevronRight", "ChevronUp", "Adapt", "Button", "Input", "Label", "Popover", "XStack", "YGroup", "PopoverDemo", "Demo", "Icon", "Name", "props"]
|
|
7
7
|
}
|
package/dist/esm/ProgressDemo.js
CHANGED
|
@@ -1,48 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useEffect, useState } from "react";
|
|
3
|
-
import { Button, Paragraph, Progress, Slider, XStack, YStack } from "tamagui";
|
|
4
|
-
function ProgressDemo() {
|
|
5
|
-
const [size, setSize] = useState(4);
|
|
6
|
-
const [progress, setProgress] = useState(20);
|
|
7
|
-
const sizeProp = `$${size}`;
|
|
8
|
-
useEffect(() => {
|
|
9
|
-
const timer = setTimeout(() => setProgress(60), 1e3);
|
|
10
|
-
return () => {
|
|
11
|
-
clearTimeout(timer);
|
|
12
|
-
};
|
|
13
|
-
}, []);
|
|
14
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
15
|
-
/* @__PURE__ */ jsxs(YStack, { height: 60, alignItems: "center", space: true, children: [
|
|
16
|
-
/* @__PURE__ */ jsxs(Paragraph, { height: 30, opacity: 0.5, children: [
|
|
17
|
-
"Size: ",
|
|
18
|
-
size
|
|
19
|
-
] }),
|
|
20
|
-
/* @__PURE__ */ jsx(Progress, { size: sizeProp, value: progress, children: /* @__PURE__ */ jsx(Progress.Indicator, { animation: "bouncy" }) })
|
|
21
|
-
] }),
|
|
22
|
-
/* @__PURE__ */ jsxs(XStack, { ai: "center", space: true, position: "absolute", bottom: "$3", left: "$4", $xxs: { display: "none" }, children: [
|
|
23
|
-
/* @__PURE__ */ jsxs(
|
|
24
|
-
Slider,
|
|
25
|
-
{
|
|
26
|
-
size: "$2",
|
|
27
|
-
width: 130,
|
|
28
|
-
defaultValue: [4],
|
|
29
|
-
min: 2,
|
|
30
|
-
max: 6,
|
|
31
|
-
step: 1,
|
|
32
|
-
onValueChange: ([val]) => {
|
|
33
|
-
setSize(val);
|
|
34
|
-
},
|
|
35
|
-
children: [
|
|
36
|
-
/* @__PURE__ */ jsx(Slider.Track, { borderWidth: 1, borderColor: "$color5", children: /* @__PURE__ */ jsx(Slider.TrackActive, {}) }),
|
|
37
|
-
/* @__PURE__ */ jsx(Slider.Thumb, { circular: true, index: 0 })
|
|
38
|
-
]
|
|
39
|
-
}
|
|
40
|
-
),
|
|
41
|
-
/* @__PURE__ */ jsx(Button, { size: "$2", onPress: () => setProgress((prev) => (prev + 20) % 100), children: "Load" })
|
|
42
|
-
] })
|
|
43
|
-
] });
|
|
44
|
-
}
|
|
45
|
-
export {
|
|
46
|
-
ProgressDemo
|
|
47
|
-
};
|
|
1
|
+
import{Fragment as h,jsx as e,jsxs as o}from"react/jsx-runtime";import{useEffect as m,useState as a}from"react";import{Button as p,Paragraph as d,Progress as n,Slider as r,XStack as S,YStack as g}from"tamagui";function T(){const[s,c]=a(4),[u,i]=a(20),l=`$${s}`;return m(()=>{const t=setTimeout(()=>i(60),1e3);return()=>{clearTimeout(t)}},[]),o(h,{children:[o(g,{height:60,alignItems:"center",space:!0,children:[o(d,{height:30,opacity:.5,children:["Size: ",s]}),e(n,{size:l,value:u,children:e(n.Indicator,{animation:"bouncy"})})]}),o(S,{ai:"center",space:!0,position:"absolute",bottom:"$3",left:"$4",$xxs:{display:"none"},children:[o(r,{size:"$2",width:130,defaultValue:[4],min:2,max:6,step:1,onValueChange:([t])=>{c(t)},children:[e(r.Track,{borderWidth:1,borderColor:"$color5",children:e(r.TrackActive,{})}),e(r.Thumb,{circular:!0,index:0})]}),e(p,{size:"$2",onPress:()=>i(t=>(t+20)%100),children:"Load"})]})]})}export{T as ProgressDemo};
|
|
48
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": "AAgBI,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAgBI,mBAAAA,EAMM,OAAAC,EAJF,QAAAC,MAFJ,oBAhBJ,OAAS,aAAAC,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,EAGHf,EAAAF,EAAA,CACE,UAAAE,EAACQ,EAAA,CAAO,OAAQ,GAAI,WAAW,SAAS,MAAK,GAC3C,UAAAR,EAACI,EAAA,CAAU,OAAQ,GAAI,QAAS,GAAK,mBAC5BM,GACT,EACAX,EAACM,EAAA,CAAS,KAAMS,EAAU,MAAOF,EAC/B,SAAAb,EAACM,EAAS,UAAT,CAAmB,UAAU,SAAS,EACzC,GACF,EAEAL,EAACO,EAAA,CAAO,GAAG,SAAS,MAAK,GAAC,SAAS,WAAW,OAAO,KAAK,KAAK,KAAK,KAAM,CAAE,QAAS,MAAO,EAC1F,UAAAP,EAACM,EAAA,CACC,KAAK,KACL,MAAO,IACP,aAAc,CAAC,CAAC,EAChB,IAAK,EACL,IAAK,EACL,KAAM,EACN,cAAe,CAAC,CAACU,CAAG,IAAM,CACxBL,EAAQK,CAAG,CACb,EAEA,UAAAjB,EAACO,EAAO,MAAP,CAAa,YAAa,EAAG,YAAY,UACxC,SAAAP,EAACO,EAAO,YAAP,EAAmB,EACtB,EACAP,EAACO,EAAO,MAAP,CAAa,SAAQ,GAAC,MAAO,EAAG,GACnC,EAEAP,EAACI,EAAA,CAAO,KAAK,KAAK,QAAS,IAAMU,EAAaI,IAAUA,EAAO,IAAM,GAAG,EAAG,gBAE3E,GACF,GACF,CAEJ",
|
|
6
|
+
"names": ["Fragment", "jsx", "jsxs", "useEffect", "useState", "Button", "Paragraph", "Progress", "Slider", "XStack", "YStack", "ProgressDemo", "size", "setSize", "progress", "setProgress", "sizeProp", "timer", "val", "prev"]
|
|
7
7
|
}
|
|
@@ -1,48 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { useEffect, useState } from "react";
|
|
3
|
-
import { Button, Paragraph, Progress, Slider, XStack, YStack } from "tamagui";
|
|
4
|
-
function ProgressDemo() {
|
|
5
|
-
const [size, setSize] = useState(4);
|
|
6
|
-
const [progress, setProgress] = useState(20);
|
|
7
|
-
const sizeProp = `$${size}`;
|
|
8
|
-
useEffect(() => {
|
|
9
|
-
const timer = setTimeout(() => setProgress(60), 1e3);
|
|
10
|
-
return () => {
|
|
11
|
-
clearTimeout(timer);
|
|
12
|
-
};
|
|
13
|
-
}, []);
|
|
14
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
15
|
-
/* @__PURE__ */ jsxs(YStack, { height: 60, alignItems: "center", space: true, children: [
|
|
16
|
-
/* @__PURE__ */ jsxs(Paragraph, { height: 30, opacity: 0.5, children: [
|
|
17
|
-
"Size: ",
|
|
18
|
-
size
|
|
19
|
-
] }),
|
|
20
|
-
/* @__PURE__ */ jsx(Progress, { size: sizeProp, value: progress, children: /* @__PURE__ */ jsx(Progress.Indicator, { animation: "bouncy" }) })
|
|
21
|
-
] }),
|
|
22
|
-
/* @__PURE__ */ jsxs(XStack, { ai: "center", space: true, position: "absolute", bottom: "$3", left: "$4", $xxs: { display: "none" }, children: [
|
|
23
|
-
/* @__PURE__ */ jsxs(
|
|
24
|
-
Slider,
|
|
25
|
-
{
|
|
26
|
-
size: "$2",
|
|
27
|
-
width: 130,
|
|
28
|
-
defaultValue: [4],
|
|
29
|
-
min: 2,
|
|
30
|
-
max: 6,
|
|
31
|
-
step: 1,
|
|
32
|
-
onValueChange: ([val]) => {
|
|
33
|
-
setSize(val);
|
|
34
|
-
},
|
|
35
|
-
children: [
|
|
36
|
-
/* @__PURE__ */ jsx(Slider.Track, { borderWidth: 1, borderColor: "$color5", children: /* @__PURE__ */ jsx(Slider.TrackActive, {}) }),
|
|
37
|
-
/* @__PURE__ */ jsx(Slider.Thumb, { circular: true, index: 0 })
|
|
38
|
-
]
|
|
39
|
-
}
|
|
40
|
-
),
|
|
41
|
-
/* @__PURE__ */ jsx(Button, { size: "$2", onPress: () => setProgress((prev) => (prev + 20) % 100), children: "Load" })
|
|
42
|
-
] })
|
|
43
|
-
] });
|
|
44
|
-
}
|
|
45
|
-
export {
|
|
46
|
-
ProgressDemo
|
|
47
|
-
};
|
|
1
|
+
import{Fragment as h,jsx as e,jsxs as o}from"react/jsx-runtime";import{useEffect as m,useState as a}from"react";import{Button as p,Paragraph as d,Progress as n,Slider as r,XStack as S,YStack as g}from"tamagui";function T(){const[s,c]=a(4),[u,i]=a(20),l=`$${s}`;return m(()=>{const t=setTimeout(()=>i(60),1e3);return()=>{clearTimeout(t)}},[]),o(h,{children:[o(g,{height:60,alignItems:"center",space:!0,children:[o(d,{height:30,opacity:.5,children:["Size: ",s]}),e(n,{size:l,value:u,children:e(n.Indicator,{animation:"bouncy"})})]}),o(S,{ai:"center",space:!0,position:"absolute",bottom:"$3",left:"$4",$xxs:{display:"none"},children:[o(r,{size:"$2",width:130,defaultValue:[4],min:2,max:6,step:1,onValueChange:([t])=>{c(t)},children:[e(r.Track,{borderWidth:1,borderColor:"$color5",children:e(r.TrackActive,{})}),e(r.Thumb,{circular:!0,index:0})]}),e(p,{size:"$2",onPress:()=>i(t=>(t+20)%100),children:"Load"})]})]})}export{T as ProgressDemo};
|
|
48
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": "AAgBI,
|
|
6
|
-
"names": []
|
|
5
|
+
"mappings": "AAgBI,mBAAAA,EAMM,OAAAC,EAJF,QAAAC,MAFJ,oBAhBJ,OAAS,aAAAC,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,EAGHf,EAAAF,EAAA,CACE,UAAAE,EAACQ,EAAA,CAAO,OAAQ,GAAI,WAAW,SAAS,MAAK,GAC3C,UAAAR,EAACI,EAAA,CAAU,OAAQ,GAAI,QAAS,GAAK,mBAC5BM,GACT,EACAX,EAACM,EAAA,CAAS,KAAMS,EAAU,MAAOF,EAC/B,SAAAb,EAACM,EAAS,UAAT,CAAmB,UAAU,SAAS,EACzC,GACF,EAEAL,EAACO,EAAA,CAAO,GAAG,SAAS,MAAK,GAAC,SAAS,WAAW,OAAO,KAAK,KAAK,KAAK,KAAM,CAAE,QAAS,MAAO,EAC1F,UAAAP,EAACM,EAAA,CACC,KAAK,KACL,MAAO,IACP,aAAc,CAAC,CAAC,EAChB,IAAK,EACL,IAAK,EACL,KAAM,EACN,cAAe,CAAC,CAACU,CAAG,IAAM,CACxBL,EAAQK,CAAG,CACb,EAEA,UAAAjB,EAACO,EAAO,MAAP,CAAa,YAAa,EAAG,YAAY,UACxC,SAAAP,EAACO,EAAO,YAAP,EAAmB,EACtB,EACAP,EAACO,EAAO,MAAP,CAAa,SAAQ,GAAC,MAAO,EAAG,GACnC,EAEAP,EAACI,EAAA,CAAO,KAAK,KAAK,QAAS,IAAMU,EAAaI,IAAUA,EAAO,IAAM,GAAG,EAAG,gBAE3E,GACF,GACF,CAEJ",
|
|
6
|
+
"names": ["Fragment", "jsx", "jsxs", "useEffect", "useState", "Button", "Paragraph", "Progress", "Slider", "XStack", "YStack", "ProgressDemo", "size", "setSize", "progress", "setProgress", "sizeProp", "timer", "val", "prev"]
|
|
7
7
|
}
|
|
@@ -1,20 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Label, RadioGroup, XStack, YStack } from "tamagui";
|
|
3
|
-
function RadioGroupDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsx(RadioGroup, { defaultValue: "3", name: "form", children: /* @__PURE__ */ jsxs(YStack, { width: 300, alignItems: "center", space: "$2", children: [
|
|
5
|
-
/* @__PURE__ */ jsx(RadioGroupItemWithLabel, { size: "$3", value: "2", label: "Second value" }),
|
|
6
|
-
/* @__PURE__ */ jsx(RadioGroupItemWithLabel, { size: "$4", value: "3", label: "Third value" }),
|
|
7
|
-
/* @__PURE__ */ jsx(RadioGroupItemWithLabel, { size: "$5", value: "4", label: "Fourth value" })
|
|
8
|
-
] }) });
|
|
9
|
-
}
|
|
10
|
-
function RadioGroupItemWithLabel(props) {
|
|
11
|
-
const id = `radiogroup-${props.value}`;
|
|
12
|
-
return /* @__PURE__ */ jsxs(XStack, { width: 300, alignItems: "center", space: "$4", children: [
|
|
13
|
-
/* @__PURE__ */ jsx(RadioGroup.Item, { value: props.value, id, size: props.size, children: /* @__PURE__ */ jsx(RadioGroup.Indicator, {}) }),
|
|
14
|
-
/* @__PURE__ */ jsx(Label, { size: props.size, htmlFor: id, children: props.label })
|
|
15
|
-
] });
|
|
16
|
-
}
|
|
17
|
-
export {
|
|
18
|
-
RadioGroupDemo
|
|
19
|
-
};
|
|
1
|
+
import{jsx as e,jsxs as o}from"react/jsx-runtime";import{Label as u,RadioGroup as i,XStack as n,YStack as r}from"tamagui";function m(){return e(i,{defaultValue:"3",name:"form",children:o(r,{width:300,alignItems:"center",space:"$2",children:[e(l,{size:"$3",value:"2",label:"Second value"}),e(l,{size:"$4",value:"3",label:"Third value"}),e(l,{size:"$5",value:"4",label:"Fourth value"})]})})}function l(a){const t=`radiogroup-${a.value}`;return o(n,{width:300,alignItems:"center",space:"$4",children:[e(i.Item,{value:a.value,id:t,size:a.size,children:e(i.Indicator,{})}),e(u,{size:a.size,htmlFor:t,children:a.label})]})}export{m as RadioGroupDemo};
|
|
20
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": "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,20 +1,2 @@
|
|
|
1
|
-
import
|
|
2
|
-
import { Label, RadioGroup, XStack, YStack } from "tamagui";
|
|
3
|
-
function RadioGroupDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsx(RadioGroup, { defaultValue: "3", name: "form", children: /* @__PURE__ */ jsxs(YStack, { width: 300, alignItems: "center", space: "$2", children: [
|
|
5
|
-
/* @__PURE__ */ jsx(RadioGroupItemWithLabel, { size: "$3", value: "2", label: "Second value" }),
|
|
6
|
-
/* @__PURE__ */ jsx(RadioGroupItemWithLabel, { size: "$4", value: "3", label: "Third value" }),
|
|
7
|
-
/* @__PURE__ */ jsx(RadioGroupItemWithLabel, { size: "$5", value: "4", label: "Fourth value" })
|
|
8
|
-
] }) });
|
|
9
|
-
}
|
|
10
|
-
function RadioGroupItemWithLabel(props) {
|
|
11
|
-
const id = `radiogroup-${props.value}`;
|
|
12
|
-
return /* @__PURE__ */ jsxs(XStack, { width: 300, alignItems: "center", space: "$4", children: [
|
|
13
|
-
/* @__PURE__ */ jsx(RadioGroup.Item, { value: props.value, id, size: props.size, children: /* @__PURE__ */ jsx(RadioGroup.Indicator, {}) }),
|
|
14
|
-
/* @__PURE__ */ jsx(Label, { size: props.size, htmlFor: id, children: props.label })
|
|
15
|
-
] });
|
|
16
|
-
}
|
|
17
|
-
export {
|
|
18
|
-
RadioGroupDemo
|
|
19
|
-
};
|
|
1
|
+
import{jsx as e,jsxs as o}from"react/jsx-runtime";import{Label as u,RadioGroup as i,XStack as n,YStack as r}from"tamagui";function m(){return e(i,{defaultValue:"3",name:"form",children:o(r,{width:300,alignItems:"center",space:"$2",children:[e(l,{size:"$3",value:"2",label:"Second value"}),e(l,{size:"$4",value:"3",label:"Third value"}),e(l,{size:"$5",value:"4",label:"Fourth value"})]})})}function l(a){const t=`radiogroup-${a.value}`;return o(n,{width:300,alignItems:"center",space:"$4",children:[e(i.Item,{value:a.value,id:t,size:a.size,children:e(i.Indicator,{})}),e(u,{size:a.size,htmlFor:t,children:a.label})]})}export{m as RadioGroupDemo};
|
|
20
2
|
//# sourceMappingURL=RadioGroupDemo.mjs.map
|