@tamagui/demos 1.0.1-beta.100
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/AnimationsDemo.js +120 -0
- package/dist/cjs/AnimationsDemo.js.map +7 -0
- package/dist/cjs/AnimationsEnterDemo.js +67 -0
- package/dist/cjs/AnimationsEnterDemo.js.map +7 -0
- package/dist/cjs/AnimationsHoverDemo.js +50 -0
- package/dist/cjs/AnimationsHoverDemo.js.map +7 -0
- package/dist/cjs/AnimationsPresenceDemo.js +99 -0
- package/dist/cjs/AnimationsPresenceDemo.js.map +7 -0
- package/dist/cjs/AvatarDemo.js +55 -0
- package/dist/cjs/AvatarDemo.js.map +7 -0
- package/dist/cjs/ButtonDemo.js +81 -0
- package/dist/cjs/ButtonDemo.js.map +7 -0
- package/dist/cjs/CardDemo.js +90 -0
- package/dist/cjs/CardDemo.js.map +7 -0
- package/dist/cjs/Demos.js +127 -0
- package/dist/cjs/Demos.js.map +7 -0
- package/dist/cjs/DialogDemo.js +103 -0
- package/dist/cjs/DialogDemo.js.map +7 -0
- package/dist/cjs/DrawerDemo.js +69 -0
- package/dist/cjs/DrawerDemo.js.map +7 -0
- package/dist/cjs/DrawerSimpleDemo.js +52 -0
- package/dist/cjs/DrawerSimpleDemo.js.map +7 -0
- package/dist/cjs/FeatherIconsDemo.js +75 -0
- package/dist/cjs/FeatherIconsDemo.js.map +7 -0
- package/dist/cjs/FormsDemo.js +63 -0
- package/dist/cjs/FormsDemo.js.map +7 -0
- package/dist/cjs/GroupDemo.js +52 -0
- package/dist/cjs/GroupDemo.js.map +7 -0
- package/dist/cjs/HeadingsDemo.js +37 -0
- package/dist/cjs/HeadingsDemo.js.map +7 -0
- package/dist/cjs/ImageDemo.js +39 -0
- package/dist/cjs/ImageDemo.js.map +7 -0
- package/dist/cjs/KitchenSink.js +127 -0
- package/dist/cjs/KitchenSink.js.map +7 -0
- package/dist/cjs/LabelDemo.js +45 -0
- package/dist/cjs/LabelDemo.js.map +7 -0
- package/dist/cjs/LinearGradientDemo.js +43 -0
- package/dist/cjs/LinearGradientDemo.js.map +7 -0
- package/dist/cjs/ListItemDemo.js +83 -0
- package/dist/cjs/ListItemDemo.js.map +7 -0
- package/dist/cjs/MenuDemo.js +50 -0
- package/dist/cjs/MenuDemo.js.map +7 -0
- package/dist/cjs/PopoverDemo.js +99 -0
- package/dist/cjs/PopoverDemo.js.map +7 -0
- package/dist/cjs/ProgressDemo.js +80 -0
- package/dist/cjs/ProgressDemo.js.map +7 -0
- package/dist/cjs/SelectDemo.js +105 -0
- package/dist/cjs/SelectDemo.js.map +7 -0
- package/dist/cjs/SeparatorDemo.js +54 -0
- package/dist/cjs/SeparatorDemo.js.map +7 -0
- package/dist/cjs/ShapesDemo.js +46 -0
- package/dist/cjs/ShapesDemo.js.map +7 -0
- package/dist/cjs/SheetDemo.js +52 -0
- package/dist/cjs/SheetDemo.js.map +7 -0
- package/dist/cjs/SliderDemo.js +83 -0
- package/dist/cjs/SliderDemo.js.map +7 -0
- package/dist/cjs/SpinnerDemo.js +45 -0
- package/dist/cjs/SpinnerDemo.js.map +7 -0
- package/dist/cjs/StacksDemo.js +103 -0
- package/dist/cjs/StacksDemo.js.map +7 -0
- package/dist/cjs/SwitchDemo.js +68 -0
- package/dist/cjs/SwitchDemo.js.map +7 -0
- package/dist/cjs/TamaguiLogo.js +157 -0
- package/dist/cjs/TamaguiLogo.js.map +7 -0
- package/dist/cjs/TextDemo.js +54 -0
- package/dist/cjs/TextDemo.js.map +7 -0
- package/dist/cjs/ThemeInverseDemo.js +52 -0
- package/dist/cjs/ThemeInverseDemo.js.map +7 -0
- package/dist/cjs/TooltipDemo.js +127 -0
- package/dist/cjs/TooltipDemo.js.map +7 -0
- package/dist/cjs/conf.js +16 -0
- package/dist/cjs/conf.js.map +7 -0
- package/dist/cjs/demos/AnimationsDemo.js +121 -0
- package/dist/cjs/demos/AnimationsDemo.js.map +7 -0
- package/dist/cjs/demos/AnimationsEnterDemo.js +62 -0
- package/dist/cjs/demos/AnimationsEnterDemo.js.map +7 -0
- package/dist/cjs/demos/AnimationsHoverDemo.js +45 -0
- package/dist/cjs/demos/AnimationsHoverDemo.js.map +7 -0
- package/dist/cjs/demos/AnimationsPresenceDemo.js +96 -0
- package/dist/cjs/demos/AnimationsPresenceDemo.js.map +7 -0
- package/dist/cjs/demos/AvatarDemo.js +55 -0
- package/dist/cjs/demos/AvatarDemo.js.map +7 -0
- package/dist/cjs/demos/ButtonDemo.js +81 -0
- package/dist/cjs/demos/ButtonDemo.js.map +7 -0
- package/dist/cjs/demos/CardDemo.js +89 -0
- package/dist/cjs/demos/CardDemo.js.map +7 -0
- package/dist/cjs/demos/DialogDemo.js +94 -0
- package/dist/cjs/demos/DialogDemo.js.map +7 -0
- package/dist/cjs/demos/DrawerDemo.js +65 -0
- package/dist/cjs/demos/DrawerDemo.js.map +7 -0
- package/dist/cjs/demos/FeatherIconsDemo.js +74 -0
- package/dist/cjs/demos/FeatherIconsDemo.js.map +7 -0
- package/dist/cjs/demos/FormsDemo.js +63 -0
- package/dist/cjs/demos/FormsDemo.js.map +7 -0
- package/dist/cjs/demos/GroupDemo.js +44 -0
- package/dist/cjs/demos/GroupDemo.js.map +7 -0
- package/dist/cjs/demos/HeadingsDemo.js +37 -0
- package/dist/cjs/demos/HeadingsDemo.js.map +7 -0
- package/dist/cjs/demos/ImageDemo.js +39 -0
- package/dist/cjs/demos/ImageDemo.js.map +7 -0
- package/dist/cjs/demos/LabelDemo.js +39 -0
- package/dist/cjs/demos/LabelDemo.js.map +7 -0
- package/dist/cjs/demos/LinearGradientDemo.js +43 -0
- package/dist/cjs/demos/LinearGradientDemo.js.map +7 -0
- package/dist/cjs/demos/ListItemDemo.js +75 -0
- package/dist/cjs/demos/ListItemDemo.js.map +7 -0
- package/dist/cjs/demos/MenuDemo.js +50 -0
- package/dist/cjs/demos/MenuDemo.js.map +7 -0
- package/dist/cjs/demos/PopoverDemo.js +99 -0
- package/dist/cjs/demos/PopoverDemo.js.map +7 -0
- package/dist/cjs/demos/ProgressDemo.js +76 -0
- package/dist/cjs/demos/ProgressDemo.js.map +7 -0
- package/dist/cjs/demos/SeparatorDemo.js +54 -0
- package/dist/cjs/demos/SeparatorDemo.js.map +7 -0
- package/dist/cjs/demos/ShapesDemo.js +42 -0
- package/dist/cjs/demos/ShapesDemo.js.map +7 -0
- package/dist/cjs/demos/SliderDemo.js +59 -0
- package/dist/cjs/demos/SliderDemo.js.map +7 -0
- package/dist/cjs/demos/SpinnerDemo.js +41 -0
- package/dist/cjs/demos/SpinnerDemo.js.map +7 -0
- package/dist/cjs/demos/StacksDemo.js +101 -0
- package/dist/cjs/demos/StacksDemo.js.map +7 -0
- package/dist/cjs/demos/SwitchDemo.js +78 -0
- package/dist/cjs/demos/SwitchDemo.js.map +7 -0
- package/dist/cjs/demos/TextDemo.js +54 -0
- package/dist/cjs/demos/TextDemo.js.map +7 -0
- package/dist/cjs/demos/ThemeInverseDemo.js +53 -0
- package/dist/cjs/demos/ThemeInverseDemo.js.map +7 -0
- package/dist/cjs/demos/TooltipDemo.js +122 -0
- package/dist/cjs/demos/TooltipDemo.js.map +7 -0
- package/dist/cjs/demos/index.js +116 -0
- package/dist/cjs/demos/index.js.map +7 -0
- package/dist/cjs/index.js +115 -0
- package/dist/cjs/index.js.map +7 -0
- package/dist/cjs/useOnIntersecting.js +86 -0
- package/dist/cjs/useOnIntersecting.js.map +7 -0
- package/dist/esm/AnimationsDemo.js +95 -0
- package/dist/esm/AnimationsDemo.js.map +7 -0
- package/dist/esm/AnimationsEnterDemo.js +41 -0
- package/dist/esm/AnimationsEnterDemo.js.map +7 -0
- package/dist/esm/AnimationsHoverDemo.js +24 -0
- package/dist/esm/AnimationsHoverDemo.js.map +7 -0
- package/dist/esm/AnimationsPresenceDemo.js +72 -0
- package/dist/esm/AnimationsPresenceDemo.js.map +7 -0
- package/dist/esm/AvatarDemo.js +29 -0
- package/dist/esm/AvatarDemo.js.map +7 -0
- package/dist/esm/ButtonDemo.js +57 -0
- package/dist/esm/ButtonDemo.js.map +7 -0
- package/dist/esm/CardDemo.js +66 -0
- package/dist/esm/CardDemo.js.map +7 -0
- package/dist/esm/Demos.js +110 -0
- package/dist/esm/Demos.js.map +7 -0
- package/dist/esm/DialogDemo.js +77 -0
- package/dist/esm/DialogDemo.js.map +7 -0
- package/dist/esm/DrawerDemo.js +43 -0
- package/dist/esm/DrawerDemo.js.map +7 -0
- package/dist/esm/DrawerSimpleDemo.js +26 -0
- package/dist/esm/DrawerSimpleDemo.js.map +7 -0
- package/dist/esm/FeatherIconsDemo.js +49 -0
- package/dist/esm/FeatherIconsDemo.js.map +7 -0
- package/dist/esm/FormsDemo.js +37 -0
- package/dist/esm/FormsDemo.js.map +7 -0
- package/dist/esm/GroupDemo.js +26 -0
- package/dist/esm/GroupDemo.js.map +7 -0
- package/dist/esm/HeadingsDemo.js +11 -0
- package/dist/esm/HeadingsDemo.js.map +7 -0
- package/dist/esm/ImageDemo.js +13 -0
- package/dist/esm/ImageDemo.js.map +7 -0
- package/dist/esm/KitchenSink.js +110 -0
- package/dist/esm/KitchenSink.js.map +7 -0
- package/dist/esm/LabelDemo.js +19 -0
- package/dist/esm/LabelDemo.js.map +7 -0
- package/dist/esm/LinearGradientDemo.js +17 -0
- package/dist/esm/LinearGradientDemo.js.map +7 -0
- package/dist/esm/ListItemDemo.js +57 -0
- package/dist/esm/ListItemDemo.js.map +7 -0
- package/dist/esm/MenuDemo.js +24 -0
- package/dist/esm/MenuDemo.js.map +7 -0
- package/dist/esm/PopoverDemo.js +74 -0
- package/dist/esm/PopoverDemo.js.map +7 -0
- package/dist/esm/ProgressDemo.js +54 -0
- package/dist/esm/ProgressDemo.js.map +7 -0
- package/dist/esm/SelectDemo.js +79 -0
- package/dist/esm/SelectDemo.js.map +7 -0
- package/dist/esm/SeparatorDemo.js +28 -0
- package/dist/esm/SeparatorDemo.js.map +7 -0
- package/dist/esm/ShapesDemo.js +20 -0
- package/dist/esm/ShapesDemo.js.map +7 -0
- package/dist/esm/SheetDemo.js +26 -0
- package/dist/esm/SheetDemo.js.map +7 -0
- package/dist/esm/SliderDemo.js +59 -0
- package/dist/esm/SliderDemo.js.map +7 -0
- package/dist/esm/SpinnerDemo.js +19 -0
- package/dist/esm/SpinnerDemo.js.map +7 -0
- package/dist/esm/StacksDemo.js +77 -0
- package/dist/esm/StacksDemo.js.map +7 -0
- package/dist/esm/SwitchDemo.js +42 -0
- package/dist/esm/SwitchDemo.js.map +7 -0
- package/dist/esm/TamaguiLogo.js +129 -0
- package/dist/esm/TamaguiLogo.js.map +7 -0
- package/dist/esm/TextDemo.js +28 -0
- package/dist/esm/TextDemo.js.map +7 -0
- package/dist/esm/ThemeInverseDemo.js +26 -0
- package/dist/esm/ThemeInverseDemo.js.map +7 -0
- package/dist/esm/TooltipDemo.js +102 -0
- package/dist/esm/TooltipDemo.js.map +7 -0
- package/dist/esm/conf.js +1 -0
- package/dist/esm/conf.js.map +7 -0
- package/dist/esm/demos/AnimationsDemo.js +83 -0
- package/dist/esm/demos/AnimationsDemo.js.map +7 -0
- package/dist/esm/demos/AnimationsEnterDemo.js +42 -0
- package/dist/esm/demos/AnimationsEnterDemo.js.map +7 -0
- package/dist/esm/demos/AnimationsHoverDemo.js +25 -0
- package/dist/esm/demos/AnimationsHoverDemo.js.map +7 -0
- package/dist/esm/demos/AnimationsPresenceDemo.js +71 -0
- package/dist/esm/demos/AnimationsPresenceDemo.js.map +7 -0
- package/dist/esm/demos/AvatarDemo.js +35 -0
- package/dist/esm/demos/AvatarDemo.js.map +7 -0
- package/dist/esm/demos/ButtonDemo.js +48 -0
- package/dist/esm/demos/ButtonDemo.js.map +7 -0
- package/dist/esm/demos/CardDemo.js +53 -0
- package/dist/esm/demos/CardDemo.js.map +7 -0
- package/dist/esm/demos/DialogDemo.js +74 -0
- package/dist/esm/demos/DialogDemo.js.map +7 -0
- package/dist/esm/demos/DrawerDemo.js +45 -0
- package/dist/esm/demos/DrawerDemo.js.map +7 -0
- package/dist/esm/demos/FeatherIconsDemo.js +51 -0
- package/dist/esm/demos/FeatherIconsDemo.js.map +7 -0
- package/dist/esm/demos/FormsDemo.js +40 -0
- package/dist/esm/demos/FormsDemo.js.map +7 -0
- package/dist/esm/demos/GroupDemo.js +24 -0
- package/dist/esm/demos/GroupDemo.js.map +7 -0
- package/dist/esm/demos/HeadingsDemo.js +14 -0
- package/dist/esm/demos/HeadingsDemo.js.map +7 -0
- package/dist/esm/demos/ImageDemo.js +16 -0
- package/dist/esm/demos/ImageDemo.js.map +7 -0
- package/dist/esm/demos/LabelDemo.js +19 -0
- package/dist/esm/demos/LabelDemo.js.map +7 -0
- package/dist/esm/demos/LinearGradientDemo.js +20 -0
- package/dist/esm/demos/LinearGradientDemo.js.map +7 -0
- package/dist/esm/demos/ListItemDemo.js +55 -0
- package/dist/esm/demos/ListItemDemo.js.map +7 -0
- package/dist/esm/demos/MenuDemo.js +27 -0
- package/dist/esm/demos/MenuDemo.js.map +7 -0
- package/dist/esm/demos/PopoverDemo.js +51 -0
- package/dist/esm/demos/PopoverDemo.js.map +7 -0
- package/dist/esm/demos/ProgressDemo.js +56 -0
- package/dist/esm/demos/ProgressDemo.js.map +7 -0
- package/dist/esm/demos/SeparatorDemo.js +31 -0
- package/dist/esm/demos/SeparatorDemo.js.map +7 -0
- package/dist/esm/demos/ShapesDemo.js +22 -0
- package/dist/esm/demos/ShapesDemo.js.map +7 -0
- package/dist/esm/demos/SliderDemo.js +39 -0
- package/dist/esm/demos/SliderDemo.js.map +7 -0
- package/dist/esm/demos/SpinnerDemo.js +21 -0
- package/dist/esm/demos/SpinnerDemo.js.map +7 -0
- package/dist/esm/demos/StacksDemo.js +78 -0
- package/dist/esm/demos/StacksDemo.js.map +7 -0
- package/dist/esm/demos/SwitchDemo.js +58 -0
- package/dist/esm/demos/SwitchDemo.js.map +7 -0
- package/dist/esm/demos/TextDemo.js +31 -0
- package/dist/esm/demos/TextDemo.js.map +7 -0
- package/dist/esm/demos/ThemeInverseDemo.js +30 -0
- package/dist/esm/demos/ThemeInverseDemo.js.map +7 -0
- package/dist/esm/demos/TooltipDemo.js +75 -0
- package/dist/esm/demos/TooltipDemo.js.map +7 -0
- package/dist/esm/demos/index.js +62 -0
- package/dist/esm/demos/index.js.map +7 -0
- package/dist/esm/index.js +63 -0
- package/dist/esm/index.js.map +7 -0
- package/dist/esm/useOnIntersecting.js +62 -0
- package/dist/esm/useOnIntersecting.js.map +7 -0
- package/dist/jsx/AnimationsDemo.js +61 -0
- package/dist/jsx/AnimationsDemo.js.map +7 -0
- package/dist/jsx/AnimationsEnterDemo.js +24 -0
- package/dist/jsx/AnimationsEnterDemo.js.map +7 -0
- package/dist/jsx/AnimationsHoverDemo.js +13 -0
- package/dist/jsx/AnimationsHoverDemo.js.map +7 -0
- package/dist/jsx/AnimationsPresenceDemo.js +37 -0
- package/dist/jsx/AnimationsPresenceDemo.js.map +7 -0
- package/dist/jsx/AvatarDemo.js +17 -0
- package/dist/jsx/AvatarDemo.js.map +7 -0
- package/dist/jsx/ButtonDemo.js +24 -0
- package/dist/jsx/ButtonDemo.js.map +7 -0
- package/dist/jsx/CardDemo.js +25 -0
- package/dist/jsx/CardDemo.js.map +7 -0
- package/dist/jsx/Demos.js +69 -0
- package/dist/jsx/DialogDemo.js +35 -0
- package/dist/jsx/DialogDemo.js.map +7 -0
- package/dist/jsx/DrawerDemo.js +18 -0
- package/dist/jsx/DrawerDemo.js.map +7 -0
- package/dist/jsx/DrawerSimpleDemo.js +20 -0
- package/dist/jsx/DrawerSimpleDemo.js.map +7 -0
- package/dist/jsx/FeatherIconsDemo.js +32 -0
- package/dist/jsx/FeatherIconsDemo.js.map +7 -0
- package/dist/jsx/FormsDemo.js +19 -0
- package/dist/jsx/FormsDemo.js.map +7 -0
- package/dist/jsx/GroupDemo.js +24 -0
- package/dist/jsx/GroupDemo.js.map +7 -0
- package/dist/jsx/HeadingsDemo.js +15 -0
- package/dist/jsx/HeadingsDemo.js.map +7 -0
- package/dist/jsx/ImageDemo.js +8 -0
- package/dist/jsx/ImageDemo.js.map +7 -0
- package/dist/jsx/KitchenSink.js +69 -0
- package/dist/jsx/LabelDemo.js +11 -0
- package/dist/jsx/LabelDemo.js.map +7 -0
- package/dist/jsx/LinearGradientDemo.js +8 -0
- package/dist/jsx/LinearGradientDemo.js.map +7 -0
- package/dist/jsx/ListItemDemo.js +26 -0
- package/dist/jsx/ListItemDemo.js.map +7 -0
- package/dist/jsx/MenuDemo.js +15 -0
- package/dist/jsx/MenuDemo.js.map +7 -0
- package/dist/jsx/PopoverDemo.js +26 -0
- package/dist/jsx/PopoverDemo.js.map +7 -0
- package/dist/jsx/ProgressDemo.js +35 -0
- package/dist/jsx/ProgressDemo.js.map +7 -0
- package/dist/jsx/SelectDemo.js +51 -0
- package/dist/jsx/SelectDemo.js.map +7 -0
- package/dist/jsx/SeparatorDemo.js +19 -0
- package/dist/jsx/SeparatorDemo.js.map +7 -0
- package/dist/jsx/ShapesDemo.js +11 -0
- package/dist/jsx/ShapesDemo.js.map +7 -0
- package/dist/jsx/SheetDemo.js +20 -0
- package/dist/jsx/SheetDemo.js.map +7 -0
- package/dist/jsx/SliderDemo.js +18 -0
- package/dist/jsx/SliderDemo.js.map +7 -0
- package/dist/jsx/SpinnerDemo.js +11 -0
- package/dist/jsx/SpinnerDemo.js.map +7 -0
- package/dist/jsx/StacksDemo.js +24 -0
- package/dist/jsx/StacksDemo.js.map +7 -0
- package/dist/jsx/SwitchDemo.js +20 -0
- package/dist/jsx/SwitchDemo.js.map +7 -0
- package/dist/jsx/TamaguiLogo.js +42 -0
- package/dist/jsx/TamaguiLogo.js.map +7 -0
- package/dist/jsx/TextDemo.js +17 -0
- package/dist/jsx/TextDemo.js.map +7 -0
- package/dist/jsx/ThemeInverseDemo.js +20 -0
- package/dist/jsx/ThemeInverseDemo.js.map +7 -0
- package/dist/jsx/TooltipDemo.js +35 -0
- package/dist/jsx/TooltipDemo.js.map +7 -0
- package/dist/jsx/conf.js +1 -0
- package/dist/jsx/conf.js.map +7 -0
- package/dist/jsx/index.js +63 -0
- package/dist/jsx/index.js.map +7 -0
- package/dist/jsx/useOnIntersecting.js +62 -0
- package/dist/jsx/useOnIntersecting.js.map +7 -0
- package/package.json +47 -0
- package/src/AnimationsDemo.tsx +85 -0
- package/src/AnimationsEnterDemo.tsx +43 -0
- package/src/AnimationsHoverDemo.tsx +24 -0
- package/src/AnimationsPresenceDemo.tsx +73 -0
- package/src/AvatarDemo.tsx +24 -0
- package/src/ButtonDemo.tsx +38 -0
- package/src/CardDemo.tsx +40 -0
- package/src/DialogDemo.tsx +73 -0
- package/src/DrawerDemo.tsx +34 -0
- package/src/FeatherIconsDemo.tsx +45 -0
- package/src/FormsDemo.tsx +22 -0
- package/src/GroupDemo.tsx +26 -0
- package/src/HeadingsDemo.tsx +15 -0
- package/src/ImageDemo.tsx +6 -0
- package/src/LabelDemo.tsx +11 -0
- package/src/LinearGradientDemo.tsx +16 -0
- package/src/ListItemDemo.tsx +40 -0
- package/src/MenuDemo.tsx +33 -0
- package/src/PopoverDemo.tsx +41 -0
- package/src/ProgressDemo.tsx +52 -0
- package/src/SelectDemo.tsx +77 -0
- package/src/SeparatorDemo.tsx +19 -0
- package/src/ShapesDemo.tsx +11 -0
- package/src/SheetDemo.tsx +25 -0
- package/src/SliderDemo.tsx +23 -0
- package/src/SpinnerDemo.tsx +11 -0
- package/src/StacksDemo.tsx +26 -0
- package/src/SwitchDemo.tsx +27 -0
- package/src/TamaguiLogo.tsx +114 -0
- package/src/TextDemo.tsx +25 -0
- package/src/ThemeInverseDemo.tsx +27 -0
- package/src/TooltipDemo.tsx +51 -0
- package/src/conf.tsx +8 -0
- package/src/index.tsx +34 -0
- package/src/useOnIntersecting.tsx +80 -0
- package/types/AnimationsDemo.d.ts +22 -0
- package/types/AnimationsDemo.d.ts.map +1 -0
- package/types/AnimationsEnterDemo.d.ts +3 -0
- package/types/AnimationsEnterDemo.d.ts.map +1 -0
- package/types/AnimationsHoverDemo.d.ts +3 -0
- package/types/AnimationsHoverDemo.d.ts.map +1 -0
- package/types/AnimationsPresenceDemo.d.ts +4 -0
- package/types/AnimationsPresenceDemo.d.ts.map +1 -0
- package/types/AvatarDemo.d.ts +3 -0
- package/types/AvatarDemo.d.ts.map +1 -0
- package/types/ButtonDemo.d.ts +3 -0
- package/types/ButtonDemo.d.ts.map +1 -0
- package/types/CardDemo.d.ts +3 -0
- package/types/CardDemo.d.ts.map +1 -0
- package/types/Demos.d.ts +9 -0
- package/types/Demos.d.ts.map +1 -0
- package/types/DialogDemo.d.ts +3 -0
- package/types/DialogDemo.d.ts.map +1 -0
- package/types/DrawerDemo.d.ts +3 -0
- package/types/DrawerDemo.d.ts.map +1 -0
- package/types/DrawerSimpleDemo.d.ts +2 -0
- package/types/DrawerSimpleDemo.d.ts.map +1 -0
- package/types/FeatherIconsDemo.d.ts +3 -0
- package/types/FeatherIconsDemo.d.ts.map +1 -0
- package/types/FormsDemo.d.ts +3 -0
- package/types/FormsDemo.d.ts.map +1 -0
- package/types/GroupDemo.d.ts +3 -0
- package/types/GroupDemo.d.ts.map +1 -0
- package/types/HeadingsDemo.d.ts +3 -0
- package/types/HeadingsDemo.d.ts.map +1 -0
- package/types/ImageDemo.d.ts +3 -0
- package/types/ImageDemo.d.ts.map +1 -0
- package/types/KitchenSink.d.ts.map +1 -0
- package/types/LabelDemo.d.ts +3 -0
- package/types/LabelDemo.d.ts.map +1 -0
- package/types/LinearGradientDemo.d.ts +3 -0
- package/types/LinearGradientDemo.d.ts.map +1 -0
- package/types/ListItemDemo.d.ts +3 -0
- package/types/ListItemDemo.d.ts.map +1 -0
- package/types/MenuDemo.d.ts +3 -0
- package/types/MenuDemo.d.ts.map +1 -0
- package/types/PopoverDemo.d.ts +7 -0
- package/types/PopoverDemo.d.ts.map +1 -0
- package/types/ProgressDemo.d.ts +3 -0
- package/types/ProgressDemo.d.ts.map +1 -0
- package/types/SelectDemo.d.ts +3 -0
- package/types/SelectDemo.d.ts.map +1 -0
- package/types/SeparatorDemo.d.ts +3 -0
- package/types/SeparatorDemo.d.ts.map +1 -0
- package/types/ShapesDemo.d.ts +3 -0
- package/types/ShapesDemo.d.ts.map +1 -0
- package/types/SheetDemo.d.ts +2 -0
- package/types/SheetDemo.d.ts.map +1 -0
- package/types/SliderDemo.d.ts +3 -0
- package/types/SliderDemo.d.ts.map +1 -0
- package/types/SpinnerDemo.d.ts +3 -0
- package/types/SpinnerDemo.d.ts.map +1 -0
- package/types/StacksDemo.d.ts +3 -0
- package/types/StacksDemo.d.ts.map +1 -0
- package/types/SwitchDemo.d.ts +3 -0
- package/types/SwitchDemo.d.ts.map +1 -0
- package/types/TamaguiLogo.d.ts +26 -0
- package/types/TamaguiLogo.d.ts.map +1 -0
- package/types/TextDemo.d.ts +3 -0
- package/types/TextDemo.d.ts.map +1 -0
- package/types/ThemeInverseDemo.d.ts +3 -0
- package/types/ThemeInverseDemo.d.ts.map +1 -0
- package/types/TooltipDemo.d.ts +7 -0
- package/types/TooltipDemo.d.ts.map +1 -0
- package/types/conf.d.ts +8 -0
- package/types/conf.d.ts.map +1 -0
- package/types/demos/AnimationsDemo.d.ts +23 -0
- package/types/demos/AnimationsDemo.d.ts.map +1 -0
- package/types/demos/AnimationsEnterDemo.d.ts +4 -0
- package/types/demos/AnimationsEnterDemo.d.ts.map +1 -0
- package/types/demos/AnimationsHoverDemo.d.ts +4 -0
- package/types/demos/AnimationsHoverDemo.d.ts.map +1 -0
- package/types/demos/AnimationsPresenceDemo.d.ts +5 -0
- package/types/demos/AnimationsPresenceDemo.d.ts.map +1 -0
- package/types/demos/AvatarDemo.d.ts +3 -0
- package/types/demos/AvatarDemo.d.ts.map +1 -0
- package/types/demos/ButtonDemo.d.ts +3 -0
- package/types/demos/ButtonDemo.d.ts.map +1 -0
- package/types/demos/CardDemo.d.ts +3 -0
- package/types/demos/CardDemo.d.ts.map +1 -0
- package/types/demos/DialogDemo.d.ts +3 -0
- package/types/demos/DialogDemo.d.ts.map +1 -0
- package/types/demos/DrawerDemo.d.ts +3 -0
- package/types/demos/DrawerDemo.d.ts.map +1 -0
- package/types/demos/FeatherIconsDemo.d.ts +3 -0
- package/types/demos/FeatherIconsDemo.d.ts.map +1 -0
- package/types/demos/FormsDemo.d.ts +3 -0
- package/types/demos/FormsDemo.d.ts.map +1 -0
- package/types/demos/GroupDemo.d.ts +3 -0
- package/types/demos/GroupDemo.d.ts.map +1 -0
- package/types/demos/HeadingsDemo.d.ts +3 -0
- package/types/demos/HeadingsDemo.d.ts.map +1 -0
- package/types/demos/ImageDemo.d.ts +3 -0
- package/types/demos/ImageDemo.d.ts.map +1 -0
- package/types/demos/LabelDemo.d.ts +3 -0
- package/types/demos/LabelDemo.d.ts.map +1 -0
- package/types/demos/LinearGradientDemo.d.ts +3 -0
- package/types/demos/LinearGradientDemo.d.ts.map +1 -0
- package/types/demos/ListItemDemo.d.ts +3 -0
- package/types/demos/ListItemDemo.d.ts.map +1 -0
- package/types/demos/MenuDemo.d.ts +3 -0
- package/types/demos/MenuDemo.d.ts.map +1 -0
- package/types/demos/PopoverDemo.d.ts +7 -0
- package/types/demos/PopoverDemo.d.ts.map +1 -0
- package/types/demos/ProgressDemo.d.ts +3 -0
- package/types/demos/ProgressDemo.d.ts.map +1 -0
- package/types/demos/SeparatorDemo.d.ts +3 -0
- package/types/demos/SeparatorDemo.d.ts.map +1 -0
- package/types/demos/ShapesDemo.d.ts +3 -0
- package/types/demos/ShapesDemo.d.ts.map +1 -0
- package/types/demos/SliderDemo.d.ts +3 -0
- package/types/demos/SliderDemo.d.ts.map +1 -0
- package/types/demos/SpinnerDemo.d.ts +3 -0
- package/types/demos/SpinnerDemo.d.ts.map +1 -0
- package/types/demos/StacksDemo.d.ts +3 -0
- package/types/demos/StacksDemo.d.ts.map +1 -0
- package/types/demos/SwitchDemo.d.ts +3 -0
- package/types/demos/SwitchDemo.d.ts.map +1 -0
- package/types/demos/TextDemo.d.ts +3 -0
- package/types/demos/TextDemo.d.ts.map +1 -0
- package/types/demos/ThemeInverseDemo.d.ts +3 -0
- package/types/demos/ThemeInverseDemo.d.ts.map +1 -0
- package/types/demos/TooltipDemo.d.ts +7 -0
- package/types/demos/TooltipDemo.d.ts.map +1 -0
- package/types/demos/index.d.ts +31 -0
- package/types/demos/index.d.ts.map +1 -0
- package/types/index.d.ts +32 -0
- package/types/index.d.ts.map +1 -0
- package/types/useOnIntersecting.d.ts +11 -0
- package/types/useOnIntersecting.d.ts.map +1 -0
|
@@ -0,0 +1,120 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
+
var __spreadValues = (a, b) => {
|
|
11
|
+
for (var prop in b || (b = {}))
|
|
12
|
+
if (__hasOwnProp.call(b, prop))
|
|
13
|
+
__defNormalProp(a, prop, b[prop]);
|
|
14
|
+
if (__getOwnPropSymbols)
|
|
15
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
+
if (__propIsEnum.call(b, prop))
|
|
17
|
+
__defNormalProp(a, prop, b[prop]);
|
|
18
|
+
}
|
|
19
|
+
return a;
|
|
20
|
+
};
|
|
21
|
+
var __export = (target, all) => {
|
|
22
|
+
for (var name in all)
|
|
23
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
24
|
+
};
|
|
25
|
+
var __copyProps = (to, from, except, desc) => {
|
|
26
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
27
|
+
for (let key of __getOwnPropNames(from))
|
|
28
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
29
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
30
|
+
}
|
|
31
|
+
return to;
|
|
32
|
+
};
|
|
33
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
34
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
35
|
+
var AnimationsDemo_exports = {};
|
|
36
|
+
__export(AnimationsDemo_exports, {
|
|
37
|
+
AnimationsDemo: () => AnimationsDemo,
|
|
38
|
+
positions: () => positions
|
|
39
|
+
});
|
|
40
|
+
module.exports = __toCommonJS(AnimationsDemo_exports);
|
|
41
|
+
var import_feather_icons = require("@tamagui/feather-icons");
|
|
42
|
+
var import_react = __toESM(require("react"));
|
|
43
|
+
var import_tamagui = require("tamagui");
|
|
44
|
+
var import_TamaguiLogo = require("./TamaguiLogo");
|
|
45
|
+
function AnimationsDemo(props) {
|
|
46
|
+
const [positionI, setPositionI] = (0, import_tamagui.useControllableState)({
|
|
47
|
+
strategy: "most-recent-wins",
|
|
48
|
+
prop: props.position,
|
|
49
|
+
defaultProp: 0
|
|
50
|
+
});
|
|
51
|
+
const position = positions[positionI];
|
|
52
|
+
const next = (to = 1) => {
|
|
53
|
+
setPositionI((x) => {
|
|
54
|
+
return (x + to) % positions.length;
|
|
55
|
+
});
|
|
56
|
+
};
|
|
57
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Square, __spreadValues({
|
|
58
|
+
focusable: false,
|
|
59
|
+
animation: props.animation || "bouncy",
|
|
60
|
+
onPress: () => next(),
|
|
61
|
+
size: 110,
|
|
62
|
+
bc: "$pink10",
|
|
63
|
+
br: "$9",
|
|
64
|
+
hoverStyle: {
|
|
65
|
+
scale: 1.1
|
|
66
|
+
},
|
|
67
|
+
pressStyle: {
|
|
68
|
+
scale: 0.9
|
|
69
|
+
}
|
|
70
|
+
}, position), props.children || /* @__PURE__ */ import_react.default.createElement(import_TamaguiLogo.LogoIcon, {
|
|
71
|
+
downscale: 0.75
|
|
72
|
+
})), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
73
|
+
pos: "absolute",
|
|
74
|
+
b: 20,
|
|
75
|
+
l: 20,
|
|
76
|
+
icon: import_feather_icons.Play,
|
|
77
|
+
theme: props.tint,
|
|
78
|
+
size: "$5",
|
|
79
|
+
circular: true,
|
|
80
|
+
onPress: () => next()
|
|
81
|
+
}));
|
|
82
|
+
}
|
|
83
|
+
const positions = [
|
|
84
|
+
{
|
|
85
|
+
x: 0,
|
|
86
|
+
y: 0,
|
|
87
|
+
scale: 1,
|
|
88
|
+
rotate: "0deg"
|
|
89
|
+
},
|
|
90
|
+
{
|
|
91
|
+
x: -50,
|
|
92
|
+
y: -50,
|
|
93
|
+
scale: 0.5,
|
|
94
|
+
rotate: "-45deg",
|
|
95
|
+
hoverStyle: {
|
|
96
|
+
scale: 0.6
|
|
97
|
+
},
|
|
98
|
+
pressStyle: {
|
|
99
|
+
scale: 0.4
|
|
100
|
+
}
|
|
101
|
+
},
|
|
102
|
+
{
|
|
103
|
+
x: 50,
|
|
104
|
+
y: 50,
|
|
105
|
+
scale: 1,
|
|
106
|
+
rotate: "180deg",
|
|
107
|
+
hoverStyle: {
|
|
108
|
+
scale: 1.1
|
|
109
|
+
},
|
|
110
|
+
pressStyle: {
|
|
111
|
+
scale: 0.9
|
|
112
|
+
}
|
|
113
|
+
}
|
|
114
|
+
];
|
|
115
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
116
|
+
0 && (module.exports = {
|
|
117
|
+
AnimationsDemo,
|
|
118
|
+
positions
|
|
119
|
+
});
|
|
120
|
+
//# sourceMappingURL=AnimationsDemo.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/AnimationsDemo.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Play } from '@tamagui/feather-icons'\nimport React from 'react'\nimport { Button, Square, useControllableState } from 'tamagui'\n\nimport { LogoIcon } from './TamaguiLogo'\n\nexport function AnimationsDemo(props) {\n const [positionI, setPositionI] = useControllableState({\n strategy: 'most-recent-wins',\n prop: props.position,\n defaultProp: 0,\n })\n const position = positions[positionI]\n const next = (to = 1) => {\n setPositionI((x) => {\n return (x + to) % positions.length\n })\n }\n\n return (\n <>\n <Square\n focusable={false}\n animation={props.animation || 'bouncy'}\n onPress={() => next()}\n size={110}\n bc=\"$pink10\"\n br=\"$9\"\n hoverStyle={{\n scale: 1.1,\n }}\n pressStyle={{\n scale: 0.9,\n }}\n {...position}\n >\n {props.children || <LogoIcon downscale={0.75} />}\n </Square>\n\n <Button\n pos=\"absolute\"\n b={20}\n l={20}\n icon={Play}\n theme={props.tint}\n size=\"$5\"\n circular\n onPress={() => next()}\n />\n </>\n )\n}\n\nexport const positions = [\n {\n x: 0,\n y: 0,\n scale: 1,\n rotate: '0deg',\n },\n {\n x: -50,\n y: -50,\n scale: 0.5,\n rotate: '-45deg',\n hoverStyle: {\n scale: 0.6,\n },\n pressStyle: {\n scale: 0.4,\n },\n },\n {\n x: 50,\n y: 50,\n scale: 1,\n rotate: '180deg',\n hoverStyle: {\n scale: 1.1,\n },\n pressStyle: {\n scale: 0.9,\n },\n },\n]\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAqB;AACrB,mBAAkB;AAClB,qBAAqD;AAErD,yBAAyB;AAElB,wBAAwB,OAAO;AACpC,QAAM,CAAC,WAAW,gBAAgB,yCAAqB;AAAA,IACrD,UAAU;AAAA,IACV,MAAM,MAAM;AAAA,IACZ,aAAa;AAAA,EACf,CAAC;AACD,QAAM,WAAW,UAAU;AAC3B,QAAM,OAAO,CAAC,KAAK,MAAM;AACvB,iBAAa,CAAC,MAAM;AAClB,aAAQ,KAAI,MAAM,UAAU;AAAA,IAC9B,CAAC;AAAA,EACH;AAEA,SACE,wFACE,mDAAC;AAAA,IACC,WAAW;AAAA,IACX,WAAW,MAAM,aAAa;AAAA,IAC9B,SAAS,MAAM,KAAK;AAAA,IACpB,MAAM;AAAA,IACN,IAAG;AAAA,IACH,IAAG;AAAA,IACH,YAAY;AAAA,MACV,OAAO;AAAA,IACT;AAAA,IACA,YAAY;AAAA,MACV,OAAO;AAAA,IACT;AAAA,KACI,WAEH,MAAM,YAAY,mDAAC;AAAA,IAAS,WAAW;AAAA,GAAM,CAChD,GAEA,mDAAC;AAAA,IACC,KAAI;AAAA,IACJ,GAAG;AAAA,IACH,GAAG;AAAA,IACH,MAAM;AAAA,IACN,OAAO,MAAM;AAAA,IACb,MAAK;AAAA,IACL,UAAQ;AAAA,IACR,SAAS,MAAM,KAAK;AAAA,GACtB,CACF;AAEJ;AAEO,MAAM,YAAY;AAAA,EACvB;AAAA,IACE,GAAG;AAAA,IACH,GAAG;AAAA,IACH,OAAO;AAAA,IACP,QAAQ;AAAA,EACV;AAAA,EACA;AAAA,IACE,GAAG;AAAA,IACH,GAAG;AAAA,IACH,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAY;AAAA,MACV,OAAO;AAAA,IACT;AAAA,IACA,YAAY;AAAA,MACV,OAAO;AAAA,IACT;AAAA,EACF;AAAA,EACA;AAAA,IACE,GAAG;AAAA,IACH,GAAG;AAAA,IACH,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,YAAY;AAAA,MACV,OAAO;AAAA,IACT;AAAA,IACA,YAAY;AAAA,MACV,OAAO;AAAA,IACT;AAAA,EACF;AACF;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,67 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
|
+
var AnimationsEnterDemo_exports = {};
|
|
22
|
+
__export(AnimationsEnterDemo_exports, {
|
|
23
|
+
AnimationsEnterDemo: () => AnimationsEnterDemo
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(AnimationsEnterDemo_exports);
|
|
26
|
+
var import_react = __toESM(require("react"));
|
|
27
|
+
var import_react2 = require("react");
|
|
28
|
+
var import_tamagui = require("tamagui");
|
|
29
|
+
var import_TamaguiLogo = require("./TamaguiLogo");
|
|
30
|
+
var import_useOnIntersecting = require("./useOnIntersecting");
|
|
31
|
+
function AnimationsEnterDemo() {
|
|
32
|
+
const ref = (0, import_react2.useRef)(null);
|
|
33
|
+
const hasIntersected = (0, import_useOnIntersecting.useIsIntersecting)(ref, { once: true });
|
|
34
|
+
const [key, setKey] = (0, import_react2.useState)(0);
|
|
35
|
+
if (!hasIntersected) {
|
|
36
|
+
return /* @__PURE__ */ import_react.default.createElement(import_tamagui.YStack, {
|
|
37
|
+
ref
|
|
38
|
+
});
|
|
39
|
+
}
|
|
40
|
+
return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Square, {
|
|
41
|
+
key,
|
|
42
|
+
enterStyle: {
|
|
43
|
+
scale: 1.5,
|
|
44
|
+
y: -10,
|
|
45
|
+
opacity: 0
|
|
46
|
+
},
|
|
47
|
+
animation: "bouncy",
|
|
48
|
+
elevation: "$4",
|
|
49
|
+
size: 110,
|
|
50
|
+
opacity: 1,
|
|
51
|
+
scale: 1,
|
|
52
|
+
y: 0,
|
|
53
|
+
bc: "$pink10",
|
|
54
|
+
br: "$9"
|
|
55
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_TamaguiLogo.LogoIcon, {
|
|
56
|
+
downscale: 0.75
|
|
57
|
+
})), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
58
|
+
size: "$3",
|
|
59
|
+
mt: "$4",
|
|
60
|
+
onPress: () => setKey(Math.random())
|
|
61
|
+
}, "Re-mount"));
|
|
62
|
+
}
|
|
63
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
64
|
+
0 && (module.exports = {
|
|
65
|
+
AnimationsEnterDemo
|
|
66
|
+
});
|
|
67
|
+
//# sourceMappingURL=AnimationsEnterDemo.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/AnimationsEnterDemo.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { useRef, useState } from 'react'\nimport { Button, Square, YStack } from 'tamagui'\n\nimport { LogoIcon } from './TamaguiLogo'\nimport { useIsIntersecting } from './useOnIntersecting'\n\nexport function AnimationsEnterDemo() {\n const ref = useRef<HTMLElement>(null)\n const hasIntersected = useIsIntersecting(ref, { once: true })\n const [key, setKey] = useState(0)\n\n if (!hasIntersected) {\n return <YStack ref={ref} />\n }\n\n return (\n <>\n <Square\n key={key}\n enterStyle={{\n scale: 1.5,\n y: -10,\n opacity: 0,\n }}\n animation=\"bouncy\"\n elevation=\"$4\"\n size={110}\n opacity={1}\n scale={1}\n y={0}\n bc=\"$pink10\"\n br=\"$9\"\n >\n <LogoIcon downscale={0.75} />\n </Square>\n\n <Button size=\"$3\" mt=\"$4\" onPress={() => setKey(Math.random())}>\n Re-mount\n </Button>\n </>\n )\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,oBAAiC;AACjC,qBAAuC;AAEvC,yBAAyB;AACzB,+BAAkC;AAE3B,+BAA+B;AACpC,QAAM,MAAM,0BAAoB,IAAI;AACpC,QAAM,iBAAiB,gDAAkB,KAAK,EAAE,MAAM,KAAK,CAAC;AAC5D,QAAM,CAAC,KAAK,UAAU,4BAAS,CAAC;AAEhC,MAAI,CAAC,gBAAgB;AACnB,WAAO,mDAAC;AAAA,MAAO;AAAA,KAAU;AAAA,EAC3B;AAEA,SACE,wFACE,mDAAC;AAAA,IACC;AAAA,IACA,YAAY;AAAA,MACV,OAAO;AAAA,MACP,GAAG;AAAA,MACH,SAAS;AAAA,IACX;AAAA,IACA,WAAU;AAAA,IACV,WAAU;AAAA,IACV,MAAM;AAAA,IACN,SAAS;AAAA,IACT,OAAO;AAAA,IACP,GAAG;AAAA,IACH,IAAG;AAAA,IACH,IAAG;AAAA,KAEH,mDAAC;AAAA,IAAS,WAAW;AAAA,GAAM,CAC7B,GAEA,mDAAC;AAAA,IAAO,MAAK;AAAA,IAAK,IAAG;AAAA,IAAK,SAAS,MAAM,OAAO,KAAK,OAAO,CAAC;AAAA,KAAG,UAEhE,CACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
|
+
var AnimationsHoverDemo_exports = {};
|
|
22
|
+
__export(AnimationsHoverDemo_exports, {
|
|
23
|
+
AnimationsHoverDemo: () => AnimationsHoverDemo
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(AnimationsHoverDemo_exports);
|
|
26
|
+
var import_react = __toESM(require("react"));
|
|
27
|
+
var import_tamagui = require("tamagui");
|
|
28
|
+
var import_TamaguiLogo = require("./TamaguiLogo");
|
|
29
|
+
function AnimationsHoverDemo() {
|
|
30
|
+
return /* @__PURE__ */ import_react.default.createElement(import_tamagui.Square, {
|
|
31
|
+
bc: "$pink10",
|
|
32
|
+
animation: "bouncy",
|
|
33
|
+
elevation: "$4",
|
|
34
|
+
size: 110,
|
|
35
|
+
br: "$9",
|
|
36
|
+
hoverStyle: {
|
|
37
|
+
scale: 1.2
|
|
38
|
+
},
|
|
39
|
+
pressStyle: {
|
|
40
|
+
scale: 0.9
|
|
41
|
+
}
|
|
42
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_TamaguiLogo.LogoIcon, {
|
|
43
|
+
downscale: 0.75
|
|
44
|
+
}));
|
|
45
|
+
}
|
|
46
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
47
|
+
0 && (module.exports = {
|
|
48
|
+
AnimationsHoverDemo
|
|
49
|
+
});
|
|
50
|
+
//# sourceMappingURL=AnimationsHoverDemo.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/AnimationsHoverDemo.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { Square } from 'tamagui'\n\nimport { LogoIcon } from './TamaguiLogo'\n\nexport function AnimationsHoverDemo() {\n return (\n <Square\n bc=\"$pink10\"\n animation=\"bouncy\"\n elevation=\"$4\"\n size={110}\n br=\"$9\"\n hoverStyle={{\n scale: 1.2,\n }}\n pressStyle={{\n scale: 0.9,\n }}\n >\n <LogoIcon downscale={0.75} />\n </Square>\n )\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,qBAAuB;AAEvB,yBAAyB;AAElB,+BAA+B;AACpC,SACE,mDAAC;AAAA,IACC,IAAG;AAAA,IACH,WAAU;AAAA,IACV,WAAU;AAAA,IACV,MAAM;AAAA,IACN,IAAG;AAAA,IACH,YAAY;AAAA,MACV,OAAO;AAAA,IACT;AAAA,IACA,YAAY;AAAA,MACV,OAAO;AAAA,IACT;AAAA,KAEA,mDAAC;AAAA,IAAS,WAAW;AAAA,GAAM,CAC7B;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,99 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
|
+
var AnimationsPresenceDemo_exports = {};
|
|
22
|
+
__export(AnimationsPresenceDemo_exports, {
|
|
23
|
+
AnimationsPresenceDemo: () => AnimationsPresenceDemo,
|
|
24
|
+
images: () => images
|
|
25
|
+
});
|
|
26
|
+
module.exports = __toCommonJS(AnimationsPresenceDemo_exports);
|
|
27
|
+
var import_animate_presence = require("@tamagui/animate-presence");
|
|
28
|
+
var import_feather_icons = require("@tamagui/feather-icons");
|
|
29
|
+
var import_react = __toESM(require("react"));
|
|
30
|
+
var import_react2 = require("react");
|
|
31
|
+
var import_tamagui = require("tamagui");
|
|
32
|
+
var import_photo1 = __toESM(require("../../public/photo1.jpg"));
|
|
33
|
+
var import_photo2 = __toESM(require("../../public/photo2.jpg"));
|
|
34
|
+
var import_photo3 = __toESM(require("../../public/photo3.jpg"));
|
|
35
|
+
const images = [import_photo1.default.src, import_photo2.default.src, import_photo3.default.src];
|
|
36
|
+
const YStackEnterable = (0, import_tamagui.styled)(import_tamagui.YStack, {
|
|
37
|
+
variants: {
|
|
38
|
+
isLeft: { true: { x: -300, opacity: 0 } },
|
|
39
|
+
isRight: { true: { x: 300, opacity: 0 } }
|
|
40
|
+
}
|
|
41
|
+
});
|
|
42
|
+
function AnimationsPresenceDemo() {
|
|
43
|
+
const [[page, direction], setPage] = (0, import_react2.useState)([0, 0]);
|
|
44
|
+
const imageIndex = wrap(0, images.length, page);
|
|
45
|
+
const paginate = (newDirection) => {
|
|
46
|
+
setPage([page + newDirection, newDirection]);
|
|
47
|
+
};
|
|
48
|
+
const enterVariant = direction === 1 || direction === 0 ? "isRight" : "isLeft";
|
|
49
|
+
const exitVariant = direction === 1 ? "isLeft" : "isRight";
|
|
50
|
+
return /* @__PURE__ */ import_react.default.createElement(import_tamagui.XStack, {
|
|
51
|
+
ov: "hidden",
|
|
52
|
+
bc: "#000",
|
|
53
|
+
pos: "relative",
|
|
54
|
+
h: 300,
|
|
55
|
+
w: "100%",
|
|
56
|
+
ai: "center"
|
|
57
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_animate_presence.AnimatePresence, {
|
|
58
|
+
enterVariant,
|
|
59
|
+
exitVariant
|
|
60
|
+
}, /* @__PURE__ */ import_react.default.createElement(YStackEnterable, {
|
|
61
|
+
key: page,
|
|
62
|
+
animation: "bouncy",
|
|
63
|
+
fullscreen: true,
|
|
64
|
+
x: 0,
|
|
65
|
+
o: 1
|
|
66
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Image, {
|
|
67
|
+
src: images[imageIndex],
|
|
68
|
+
width: 780,
|
|
69
|
+
height: 300
|
|
70
|
+
}))), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
71
|
+
accessibilityLabel: "Carousel left",
|
|
72
|
+
icon: import_feather_icons.ArrowLeft,
|
|
73
|
+
size: "$5",
|
|
74
|
+
pos: "absolute",
|
|
75
|
+
l: "$4",
|
|
76
|
+
circular: true,
|
|
77
|
+
elevate: true,
|
|
78
|
+
onPress: () => paginate(-1)
|
|
79
|
+
}), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
80
|
+
accessibilityLabel: "Carousel right",
|
|
81
|
+
icon: import_feather_icons.ArrowRight,
|
|
82
|
+
size: "$5",
|
|
83
|
+
pos: "absolute",
|
|
84
|
+
r: "$4",
|
|
85
|
+
circular: true,
|
|
86
|
+
elevate: true,
|
|
87
|
+
onPress: () => paginate(1)
|
|
88
|
+
}));
|
|
89
|
+
}
|
|
90
|
+
const wrap = (min, max, v) => {
|
|
91
|
+
const rangeSize = max - min;
|
|
92
|
+
return ((v - min) % rangeSize + rangeSize) % rangeSize + min;
|
|
93
|
+
};
|
|
94
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
95
|
+
0 && (module.exports = {
|
|
96
|
+
AnimationsPresenceDemo,
|
|
97
|
+
images
|
|
98
|
+
});
|
|
99
|
+
//# sourceMappingURL=AnimationsPresenceDemo.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/AnimationsPresenceDemo.tsx"],
|
|
4
|
+
"sourcesContent": ["// adapted from Framer Motion\n// https://codesandbox.io/s/framer-motion-image-gallery-pqvx3?from-embed=&file=/src/Example.tsx:1422-1470\n\nimport { AnimatePresence } from '@tamagui/animate-presence'\nimport { ArrowLeft, ArrowRight } from '@tamagui/feather-icons'\nimport React from 'react'\nimport { useState } from 'react'\nimport { Button, Image, XStack, YStack, styled } from 'tamagui'\n\n// @ts-ignore\nimport photo1 from '../../public/photo1.jpg'\n// @ts-ignore\nimport photo2 from '../../public/photo2.jpg'\n// @ts-ignore\nimport photo3 from '../../public/photo3.jpg'\n\nexport const images = [photo1.src, photo2.src, photo3.src]\n\nconst YStackEnterable = styled(YStack, {\n variants: {\n isLeft: { true: { x: -300, opacity: 0 } },\n isRight: { true: { x: 300, opacity: 0 } },\n },\n})\n\nexport function AnimationsPresenceDemo() {\n const [[page, direction], setPage] = useState([0, 0])\n\n const imageIndex = wrap(0, images.length, page)\n\n const paginate = (newDirection: number) => {\n setPage([page + newDirection, newDirection])\n }\n\n const enterVariant = direction === 1 || direction === 0 ? 'isRight' : 'isLeft'\n const exitVariant = direction === 1 ? 'isLeft' : 'isRight'\n\n return (\n <XStack ov=\"hidden\" bc=\"#000\" pos=\"relative\" h={300} w=\"100%\" ai=\"center\">\n <AnimatePresence enterVariant={enterVariant} exitVariant={exitVariant}>\n <YStackEnterable key={page} animation=\"bouncy\" fullscreen x={0} o={1}>\n <Image src={images[imageIndex]} width={780} height={300} />\n </YStackEnterable>\n </AnimatePresence>\n\n <Button\n accessibilityLabel=\"Carousel left\"\n icon={ArrowLeft}\n size=\"$5\"\n pos=\"absolute\"\n l=\"$4\"\n circular\n elevate\n onPress={() => paginate(-1)}\n />\n <Button\n accessibilityLabel=\"Carousel right\"\n icon={ArrowRight}\n size=\"$5\"\n pos=\"absolute\"\n r=\"$4\"\n circular\n elevate\n onPress={() => paginate(1)}\n />\n </XStack>\n )\n}\n\nconst wrap = (min: number, max: number, v: number) => {\n const rangeSize = max - min\n return ((((v - min) % rangeSize) + rangeSize) % rangeSize) + min\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAGA,8BAAgC;AAChC,2BAAsC;AACtC,mBAAkB;AAClB,oBAAyB;AACzB,qBAAsD;AAGtD,oBAAmB;AAEnB,oBAAmB;AAEnB,oBAAmB;AAEZ,MAAM,SAAS,CAAC,sBAAO,KAAK,sBAAO,KAAK,sBAAO,GAAG;AAEzD,MAAM,kBAAkB,2BAAO,uBAAQ;AAAA,EACrC,UAAU;AAAA,IACR,QAAQ,EAAE,MAAM,EAAE,GAAG,MAAM,SAAS,EAAE,EAAE;AAAA,IACxC,SAAS,EAAE,MAAM,EAAE,GAAG,KAAK,SAAS,EAAE,EAAE;AAAA,EAC1C;AACF,CAAC;AAEM,kCAAkC;AACvC,QAAM,CAAC,CAAC,MAAM,YAAY,WAAW,4BAAS,CAAC,GAAG,CAAC,CAAC;AAEpD,QAAM,aAAa,KAAK,GAAG,OAAO,QAAQ,IAAI;AAE9C,QAAM,WAAW,CAAC,iBAAyB;AACzC,YAAQ,CAAC,OAAO,cAAc,YAAY,CAAC;AAAA,EAC7C;AAEA,QAAM,eAAe,cAAc,KAAK,cAAc,IAAI,YAAY;AACtE,QAAM,cAAc,cAAc,IAAI,WAAW;AAEjD,SACE,mDAAC;AAAA,IAAO,IAAG;AAAA,IAAS,IAAG;AAAA,IAAO,KAAI;AAAA,IAAW,GAAG;AAAA,IAAK,GAAE;AAAA,IAAO,IAAG;AAAA,KAC/D,mDAAC;AAAA,IAAgB;AAAA,IAA4B;AAAA,KAC3C,mDAAC;AAAA,IAAgB,KAAK;AAAA,IAAM,WAAU;AAAA,IAAS,YAAU;AAAA,IAAC,GAAG;AAAA,IAAG,GAAG;AAAA,KACjE,mDAAC;AAAA,IAAM,KAAK,OAAO;AAAA,IAAa,OAAO;AAAA,IAAK,QAAQ;AAAA,GAAK,CAC3D,CACF,GAEA,mDAAC;AAAA,IACC,oBAAmB;AAAA,IACnB,MAAM;AAAA,IACN,MAAK;AAAA,IACL,KAAI;AAAA,IACJ,GAAE;AAAA,IACF,UAAQ;AAAA,IACR,SAAO;AAAA,IACP,SAAS,MAAM,SAAS,EAAE;AAAA,GAC5B,GACA,mDAAC;AAAA,IACC,oBAAmB;AAAA,IACnB,MAAM;AAAA,IACN,MAAK;AAAA,IACL,KAAI;AAAA,IACJ,GAAE;AAAA,IACF,UAAQ;AAAA,IACR,SAAO;AAAA,IACP,SAAS,MAAM,SAAS,CAAC;AAAA,GAC3B,CACF;AAEJ;AAEA,MAAM,OAAO,CAAC,KAAa,KAAa,MAAc;AACpD,QAAM,YAAY,MAAM;AACxB,SAAW,MAAI,OAAO,YAAa,aAAa,YAAa;AAC/D;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
6
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
7
|
+
var __export = (target, all) => {
|
|
8
|
+
for (var name in all)
|
|
9
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
10
|
+
};
|
|
11
|
+
var __copyProps = (to, from, except, desc) => {
|
|
12
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
13
|
+
for (let key of __getOwnPropNames(from))
|
|
14
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
15
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
16
|
+
}
|
|
17
|
+
return to;
|
|
18
|
+
};
|
|
19
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
20
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
21
|
+
var AvatarDemo_exports = {};
|
|
22
|
+
__export(AvatarDemo_exports, {
|
|
23
|
+
AvatarDemo: () => AvatarDemo
|
|
24
|
+
});
|
|
25
|
+
module.exports = __toCommonJS(AvatarDemo_exports);
|
|
26
|
+
var import_react = __toESM(require("react"));
|
|
27
|
+
var import_tamagui = require("tamagui");
|
|
28
|
+
function AvatarDemo() {
|
|
29
|
+
return /* @__PURE__ */ import_react.default.createElement(import_tamagui.XStack, {
|
|
30
|
+
ai: "center",
|
|
31
|
+
space: "$6"
|
|
32
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Avatar, {
|
|
33
|
+
circular: true,
|
|
34
|
+
size: "$10"
|
|
35
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Avatar.Image, {
|
|
36
|
+
accessibilityLabel: "Cam",
|
|
37
|
+
src: "https://images.unsplash.com/photo-1548142813-c348350df52b?&w=150&h=150&dpr=2&q=80"
|
|
38
|
+
}), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Avatar.Fallback, {
|
|
39
|
+
backgroundColor: "$blue10"
|
|
40
|
+
})), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Avatar, {
|
|
41
|
+
circular: true,
|
|
42
|
+
size: "$8"
|
|
43
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Avatar.Image, {
|
|
44
|
+
accessibilityLabel: "Nate Wienert",
|
|
45
|
+
src: "https://images.unsplash.com/photo-1531384441138-2736e62e0919?&w=100&h=100&dpr=2&q=80"
|
|
46
|
+
}), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Avatar.Fallback, {
|
|
47
|
+
delayMs: 600,
|
|
48
|
+
backgroundColor: "$blue10"
|
|
49
|
+
})));
|
|
50
|
+
}
|
|
51
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
52
|
+
0 && (module.exports = {
|
|
53
|
+
AvatarDemo
|
|
54
|
+
});
|
|
55
|
+
//# sourceMappingURL=AvatarDemo.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/AvatarDemo.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { Avatar, XStack } from 'tamagui'\n\nexport function AvatarDemo() {\n return (\n <XStack ai=\"center\" space=\"$6\">\n <Avatar circular size=\"$10\">\n <Avatar.Image\n accessibilityLabel=\"Cam\"\n src=\"https://images.unsplash.com/photo-1548142813-c348350df52b?&w=150&h=150&dpr=2&q=80\"\n />\n <Avatar.Fallback backgroundColor=\"$blue10\" />\n </Avatar>\n\n <Avatar circular size=\"$8\">\n <Avatar.Image\n accessibilityLabel=\"Nate Wienert\"\n src=\"https://images.unsplash.com/photo-1531384441138-2736e62e0919?&w=100&h=100&dpr=2&q=80\"\n />\n <Avatar.Fallback delayMs={600} backgroundColor=\"$blue10\" />\n </Avatar>\n </XStack>\n )\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,qBAA+B;AAExB,sBAAsB;AAC3B,SACE,mDAAC;AAAA,IAAO,IAAG;AAAA,IAAS,OAAM;AAAA,KACxB,mDAAC;AAAA,IAAO,UAAQ;AAAA,IAAC,MAAK;AAAA,KACpB,mDAAC,sBAAO,OAAP;AAAA,IACC,oBAAmB;AAAA,IACnB,KAAI;AAAA,GACN,GACA,mDAAC,sBAAO,UAAP;AAAA,IAAgB,iBAAgB;AAAA,GAAU,CAC7C,GAEA,mDAAC;AAAA,IAAO,UAAQ;AAAA,IAAC,MAAK;AAAA,KACpB,mDAAC,sBAAO,OAAP;AAAA,IACC,oBAAmB;AAAA,IACnB,KAAI;AAAA,GACN,GACA,mDAAC,sBAAO,UAAP;AAAA,IAAgB,SAAS;AAAA,IAAK,iBAAgB;AAAA,GAAU,CAC3D,CACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,81 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
+
var __spreadValues = (a, b) => {
|
|
11
|
+
for (var prop in b || (b = {}))
|
|
12
|
+
if (__hasOwnProp.call(b, prop))
|
|
13
|
+
__defNormalProp(a, prop, b[prop]);
|
|
14
|
+
if (__getOwnPropSymbols)
|
|
15
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
+
if (__propIsEnum.call(b, prop))
|
|
17
|
+
__defNormalProp(a, prop, b[prop]);
|
|
18
|
+
}
|
|
19
|
+
return a;
|
|
20
|
+
};
|
|
21
|
+
var __export = (target, all) => {
|
|
22
|
+
for (var name in all)
|
|
23
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
24
|
+
};
|
|
25
|
+
var __copyProps = (to, from, except, desc) => {
|
|
26
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
27
|
+
for (let key of __getOwnPropNames(from))
|
|
28
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
29
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
30
|
+
}
|
|
31
|
+
return to;
|
|
32
|
+
};
|
|
33
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
34
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
35
|
+
var ButtonDemo_exports = {};
|
|
36
|
+
__export(ButtonDemo_exports, {
|
|
37
|
+
ButtonDemo: () => ButtonDemo
|
|
38
|
+
});
|
|
39
|
+
module.exports = __toCommonJS(ButtonDemo_exports);
|
|
40
|
+
var import_feather_icons = require("@tamagui/feather-icons");
|
|
41
|
+
var import_react = __toESM(require("react"));
|
|
42
|
+
var import_tamagui = require("tamagui");
|
|
43
|
+
function ButtonDemo(props) {
|
|
44
|
+
return /* @__PURE__ */ import_react.default.createElement(import_tamagui.YStack, __spreadValues({
|
|
45
|
+
p: "$3",
|
|
46
|
+
space: true
|
|
47
|
+
}, props), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, null, "Plain"), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
48
|
+
als: "center",
|
|
49
|
+
icon: import_feather_icons.Airplay,
|
|
50
|
+
size: "$6"
|
|
51
|
+
}, "Large"), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Group, null, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
52
|
+
w: "50%",
|
|
53
|
+
size: "$3",
|
|
54
|
+
theme: "alt2"
|
|
55
|
+
}, "Alt2"), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
56
|
+
w: "50%",
|
|
57
|
+
size: "$3",
|
|
58
|
+
theme: "yellow"
|
|
59
|
+
}, "Yellow")), /* @__PURE__ */ import_react.default.createElement(import_tamagui.XStack, {
|
|
60
|
+
space: "$2"
|
|
61
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
62
|
+
themeInverse: true,
|
|
63
|
+
size: "$3"
|
|
64
|
+
}, "Small Inverse"), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
65
|
+
iconAfter: import_feather_icons.Activity,
|
|
66
|
+
size: "$3"
|
|
67
|
+
}, "After")), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Group, null, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
68
|
+
w: "50%",
|
|
69
|
+
size: "$2",
|
|
70
|
+
disabled: true
|
|
71
|
+
}, "disabled"), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
72
|
+
w: "50%",
|
|
73
|
+
size: "$2",
|
|
74
|
+
chromeless: true
|
|
75
|
+
}, "chromeless")));
|
|
76
|
+
}
|
|
77
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
78
|
+
0 && (module.exports = {
|
|
79
|
+
ButtonDemo
|
|
80
|
+
});
|
|
81
|
+
//# sourceMappingURL=ButtonDemo.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/ButtonDemo.tsx"],
|
|
4
|
+
"sourcesContent": ["import { Activity, Airplay } from '@tamagui/feather-icons'\nimport React from 'react'\nimport { Button, Group, XStack, YStack } from 'tamagui'\n\nexport function ButtonDemo(props) {\n return (\n <YStack p=\"$3\" space {...props}>\n <Button>Plain</Button>\n <Button als=\"center\" icon={Airplay} size=\"$6\">\n Large\n </Button>\n <Group>\n <Button w=\"50%\" size=\"$3\" theme=\"alt2\">\n Alt2\n </Button>\n <Button w=\"50%\" size=\"$3\" theme=\"yellow\">\n Yellow\n </Button>\n </Group>\n <XStack space=\"$2\">\n <Button themeInverse size=\"$3\">\n Small Inverse\n </Button>\n <Button iconAfter={Activity} size=\"$3\">\n After\n </Button>\n </XStack>\n <Group>\n <Button w=\"50%\" size=\"$2\" disabled>\n disabled\n </Button>\n <Button w=\"50%\" size=\"$2\" chromeless>\n chromeless\n </Button>\n </Group>\n </YStack>\n )\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,2BAAkC;AAClC,mBAAkB;AAClB,qBAA8C;AAEvC,oBAAoB,OAAO;AAChC,SACE,mDAAC;AAAA,IAAO,GAAE;AAAA,IAAK,OAAK;AAAA,KAAK,QACvB,mDAAC,6BAAO,OAAK,GACb,mDAAC;AAAA,IAAO,KAAI;AAAA,IAAS,MAAM;AAAA,IAAS,MAAK;AAAA,KAAK,OAE9C,GACA,mDAAC,4BACC,mDAAC;AAAA,IAAO,GAAE;AAAA,IAAM,MAAK;AAAA,IAAK,OAAM;AAAA,KAAO,MAEvC,GACA,mDAAC;AAAA,IAAO,GAAE;AAAA,IAAM,MAAK;AAAA,IAAK,OAAM;AAAA,KAAS,QAEzC,CACF,GACA,mDAAC;AAAA,IAAO,OAAM;AAAA,KACZ,mDAAC;AAAA,IAAO,cAAY;AAAA,IAAC,MAAK;AAAA,KAAK,eAE/B,GACA,mDAAC;AAAA,IAAO,WAAW;AAAA,IAAU,MAAK;AAAA,KAAK,OAEvC,CACF,GACA,mDAAC,4BACC,mDAAC;AAAA,IAAO,GAAE;AAAA,IAAM,MAAK;AAAA,IAAK,UAAQ;AAAA,KAAC,UAEnC,GACA,mDAAC;AAAA,IAAO,GAAE;AAAA,IAAM,MAAK;AAAA,IAAK,YAAU;AAAA,KAAC,YAErC,CACF,CACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|
|
@@ -0,0 +1,90 @@
|
|
|
1
|
+
var __create = Object.create;
|
|
2
|
+
var __defProp = Object.defineProperty;
|
|
3
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
+
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
|
6
|
+
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
+
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
+
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
|
9
|
+
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
|
10
|
+
var __spreadValues = (a, b) => {
|
|
11
|
+
for (var prop in b || (b = {}))
|
|
12
|
+
if (__hasOwnProp.call(b, prop))
|
|
13
|
+
__defNormalProp(a, prop, b[prop]);
|
|
14
|
+
if (__getOwnPropSymbols)
|
|
15
|
+
for (var prop of __getOwnPropSymbols(b)) {
|
|
16
|
+
if (__propIsEnum.call(b, prop))
|
|
17
|
+
__defNormalProp(a, prop, b[prop]);
|
|
18
|
+
}
|
|
19
|
+
return a;
|
|
20
|
+
};
|
|
21
|
+
var __export = (target, all) => {
|
|
22
|
+
for (var name in all)
|
|
23
|
+
__defProp(target, name, { get: all[name], enumerable: true });
|
|
24
|
+
};
|
|
25
|
+
var __copyProps = (to, from, except, desc) => {
|
|
26
|
+
if (from && typeof from === "object" || typeof from === "function") {
|
|
27
|
+
for (let key of __getOwnPropNames(from))
|
|
28
|
+
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
29
|
+
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
30
|
+
}
|
|
31
|
+
return to;
|
|
32
|
+
};
|
|
33
|
+
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target, mod));
|
|
34
|
+
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
35
|
+
var CardDemo_exports = {};
|
|
36
|
+
__export(CardDemo_exports, {
|
|
37
|
+
CardDemo: () => CardDemo
|
|
38
|
+
});
|
|
39
|
+
module.exports = __toCommonJS(CardDemo_exports);
|
|
40
|
+
var import_react = __toESM(require("react"));
|
|
41
|
+
var import_tamagui = require("tamagui");
|
|
42
|
+
var import_camera = __toESM(require("../../public/camera.jpg"));
|
|
43
|
+
function CardDemo() {
|
|
44
|
+
return /* @__PURE__ */ import_react.default.createElement(import_tamagui.XStack, {
|
|
45
|
+
$sm: { flexDirection: "column" },
|
|
46
|
+
px: "$4",
|
|
47
|
+
space: true
|
|
48
|
+
}, /* @__PURE__ */ import_react.default.createElement(DemoCard, {
|
|
49
|
+
animation: "bouncy",
|
|
50
|
+
size: "$4",
|
|
51
|
+
w: 250,
|
|
52
|
+
h: 300,
|
|
53
|
+
scale: 0.9,
|
|
54
|
+
hoverStyle: { scale: 0.925 },
|
|
55
|
+
pressStyle: { scale: 0.875 }
|
|
56
|
+
}), /* @__PURE__ */ import_react.default.createElement(DemoCard, {
|
|
57
|
+
size: "$5",
|
|
58
|
+
w: 250,
|
|
59
|
+
h: 300
|
|
60
|
+
}));
|
|
61
|
+
}
|
|
62
|
+
function DemoCard(props) {
|
|
63
|
+
return /* @__PURE__ */ import_react.default.createElement(import_tamagui.Card, __spreadValues({
|
|
64
|
+
theme: "dark",
|
|
65
|
+
elevate: true,
|
|
66
|
+
size: "$4",
|
|
67
|
+
bordered: true
|
|
68
|
+
}, props), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Card.Header, {
|
|
69
|
+
padded: true
|
|
70
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_tamagui.H2, null, "Sony A7IV"), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Paragraph, {
|
|
71
|
+
theme: "alt2"
|
|
72
|
+
}, "Now available")), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Card.Footer, {
|
|
73
|
+
padded: true
|
|
74
|
+
}, /* @__PURE__ */ import_react.default.createElement(import_tamagui.XStack, {
|
|
75
|
+
f: 1
|
|
76
|
+
}), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Button, {
|
|
77
|
+
br: "$10"
|
|
78
|
+
}, "Purchase")), /* @__PURE__ */ import_react.default.createElement(import_tamagui.Card.Background, null, /* @__PURE__ */ import_react.default.createElement(import_tamagui.Image, {
|
|
79
|
+
pos: "absolute",
|
|
80
|
+
width: 300,
|
|
81
|
+
height: 500,
|
|
82
|
+
resizeMode: "cover",
|
|
83
|
+
src: import_camera.default.src
|
|
84
|
+
})));
|
|
85
|
+
}
|
|
86
|
+
// Annotate the CommonJS export names for ESM import in node:
|
|
87
|
+
0 && (module.exports = {
|
|
88
|
+
CardDemo
|
|
89
|
+
});
|
|
90
|
+
//# sourceMappingURL=CardDemo.js.map
|
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
{
|
|
2
|
+
"version": 3,
|
|
3
|
+
"sources": ["../../src/CardDemo.tsx"],
|
|
4
|
+
"sourcesContent": ["import React from 'react'\nimport { Button, Card, CardProps, H2, H3, Image, Paragraph, XStack } from 'tamagui'\n\n// @ts-ignore\nimport camera from '../../public/camera.jpg'\n\nexport function CardDemo() {\n return (\n <XStack $sm={{ flexDirection: 'column' }} px=\"$4\" space>\n <DemoCard\n animation=\"bouncy\"\n size=\"$4\"\n w={250}\n h={300}\n scale={0.9}\n hoverStyle={{ scale: 0.925 }}\n pressStyle={{ scale: 0.875 }}\n />\n <DemoCard size=\"$5\" w={250} h={300} />\n </XStack>\n )\n}\n\nfunction DemoCard(props: CardProps) {\n return (\n <Card theme=\"dark\" elevate size=\"$4\" bordered {...props}>\n <Card.Header padded>\n <H2>Sony A7IV</H2>\n <Paragraph theme=\"alt2\">Now available</Paragraph>\n </Card.Header>\n <Card.Footer padded>\n <XStack f={1} />\n <Button br=\"$10\">Purchase</Button>\n </Card.Footer>\n <Card.Background>\n <Image pos=\"absolute\" width={300} height={500} resizeMode=\"cover\" src={camera.src} />\n </Card.Background>\n </Card>\n )\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAAkB;AAClB,qBAA0E;AAG1E,oBAAmB;AAEZ,oBAAoB;AACzB,SACE,mDAAC;AAAA,IAAO,KAAK,EAAE,eAAe,SAAS;AAAA,IAAG,IAAG;AAAA,IAAK,OAAK;AAAA,KACrD,mDAAC;AAAA,IACC,WAAU;AAAA,IACV,MAAK;AAAA,IACL,GAAG;AAAA,IACH,GAAG;AAAA,IACH,OAAO;AAAA,IACP,YAAY,EAAE,OAAO,MAAM;AAAA,IAC3B,YAAY,EAAE,OAAO,MAAM;AAAA,GAC7B,GACA,mDAAC;AAAA,IAAS,MAAK;AAAA,IAAK,GAAG;AAAA,IAAK,GAAG;AAAA,GAAK,CACtC;AAEJ;AAEA,kBAAkB,OAAkB;AAClC,SACE,mDAAC;AAAA,IAAK,OAAM;AAAA,IAAO,SAAO;AAAA,IAAC,MAAK;AAAA,IAAK,UAAQ;AAAA,KAAK,QAChD,mDAAC,oBAAK,QAAL;AAAA,IAAY,QAAM;AAAA,KACjB,mDAAC,yBAAG,WAAS,GACb,mDAAC;AAAA,IAAU,OAAM;AAAA,KAAO,eAAa,CACvC,GACA,mDAAC,oBAAK,QAAL;AAAA,IAAY,QAAM;AAAA,KACjB,mDAAC;AAAA,IAAO,GAAG;AAAA,GAAG,GACd,mDAAC;AAAA,IAAO,IAAG;AAAA,KAAM,UAAQ,CAC3B,GACA,mDAAC,oBAAK,YAAL,MACC,mDAAC;AAAA,IAAM,KAAI;AAAA,IAAW,OAAO;AAAA,IAAK,QAAQ;AAAA,IAAK,YAAW;AAAA,IAAQ,KAAK,sBAAO;AAAA,GAAK,CACrF,CACF;AAEJ;",
|
|
6
|
+
"names": []
|
|
7
|
+
}
|