@tamagui/demos 1.22.6 → 1.22.8

package/src/SelectDemo.tsx

@@ -13,30 +13,30 @@ import {
 import { LinearGradient } from 'tamagui/linear-gradient'
 
 export function SelectDemo() {
-  const [val, setVal] = useState('apple')
-
   return (
     <YStack space>
       <XStack ai="center" space>
         <Label f={1} fb={0}>
           Custom
         </Label>
-        <SelectDemoItem value={val} onValueChange={setVal} />
+        <SelectDemoItem />
       </XStack>
 
       <XStack ai="center" space>
         <Label f={1} fb={0}>
           Native
         </Label>
-        <SelectDemoItem value={val} onValueChange={setVal} native />
+        <SelectDemoItem native />
       </XStack>
     </YStack>
   )
 }
 
 export function SelectDemoItem(props: SelectProps) {
+  const [val, setVal] = useState('apple')
+
   return (
-    <Select id="food" {...props}>
+    <Select id="food" value={val} onValueChange={setVal} {...props}>
       <Select.Trigger width={180} iconAfter={ChevronDown}>
         <Select.Value placeholder="Something" />
       </Select.Trigger>
@@ -79,7 +79,7 @@ export function SelectDemoItem(props: SelectProps) {
               {items.map((item, i) => {
                 return (
                   <Select.Item index={i} key={item.name} value={item.name.toLowerCase()}>
-                    <Select.ItemText color="#fff">{item.name}</Select.ItemText>
+                    <Select.ItemText>{item.name}</Select.ItemText>
                     <Select.ItemIndicator marginLeft="auto">
                       <Check size={16} />
                     </Select.ItemIndicator>

package/src/TabsDemo.tsx

@@ -8,6 +8,7 @@ import {
   TabsContentProps,
   XStack,
   YStack,
+  isWeb,
 } from 'tamagui'
 
 const demos = ['horizontal', 'vertical'] as const
@@ -22,7 +23,12 @@ export function TabsDemo() {
 
   return (
     // web only fix for position relative
-    <YStack paddingHorizontal="$4" position={'unset' as any}>
+    <YStack
+      paddingHorizontal="$4"
+      {...(isWeb && {
+        position: 'unset' as any,
+      })}
+    >
       {demo === 'horizontal' ? <HorizontalTabs /> : <VerticalTabs />}
 
       <XStack

package/src/ToastDemo.tsx

@@ -1,6 +1,7 @@
 import { Toast, useToastController, useToastState } from '@tamagui/toast'
 import React from 'react'
-import { Button, SizableText, Switch, XStack, YStack } from 'tamagui'
+import { Text, View } from 'react-native'
+import { Button, Label, SizableText, Switch, XStack, YStack } from 'tamagui'
 
 export const ToastDemo = () => {
   const [native, setNative] = React.useState(false)
@@ -56,6 +57,8 @@ const ToastControl = ({ native }: { native: boolean }) => {
         Show
       </Button>
       <Button
+        id="wot"
+        nativeID="woot"
         onPress={() => {
           toast.hide()
         }}
@@ -75,9 +78,13 @@ const NativeOptions = ({
 }) => {
   return (
     <XStack space="$3">
-      <SizableText size="$1">Custom</SizableText>
-
+      <Label size="$1" onPress={() => setNative(false)}>
+        Custom
+      </Label>
       <Switch
+        debug="verbose"
+        id="native-toggle"
+        nativeID="native-toggle"
         theme="active"
         size="$1"
         checked={!!native}
@@ -95,7 +102,9 @@ const NativeOptions = ({
         />
       </Switch>
 
-      <SizableText size="$1">Native</SizableText>
+      <Label size="$1" onPress={() => setNative(true)}>
+        Native
+      </Label>
     </XStack>
   )
 }

package/types/DialogDemo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DialogDemo.d.ts","sourceRoot":"","sources":["../src/DialogDemo.tsx"],"names":[],"mappings":";AAkBA,wBAAgB,UAAU,gBA6EzB"}
+{"version":3,"file":"DialogDemo.d.ts","sourceRoot":"","sources":["../src/DialogDemo.tsx"],"names":[],"mappings":";AAkBA,wBAAgB,UAAU,gBAoFzB"}

package/types/SelectDemo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SelectDemo.d.ts","sourceRoot":"","sources":["../src/SelectDemo.tsx"],"names":[],"mappings":";AAEA,OAAO,EAIL,WAAW,EAKZ,MAAM,SAAS,CAAA;AAGhB,wBAAgB,UAAU,gBAoBzB;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,WAAW,eA4FhD"}
+{"version":3,"file":"SelectDemo.d.ts","sourceRoot":"","sources":["../src/SelectDemo.tsx"],"names":[],"mappings":";AAEA,OAAO,EAIL,WAAW,EAKZ,MAAM,SAAS,CAAA;AAGhB,wBAAgB,UAAU,gBAkBzB;AAED,wBAAgB,cAAc,CAAC,KAAK,EAAE,WAAW,eA8FhD"}

package/types/TabsDemo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"TabsDemo.d.ts","sourceRoot":"","sources":["../src/TabsDemo.tsx"],"names":[],"mappings":";AAkBA,wBAAgB,QAAQ,gBAuBvB"}
+{"version":3,"file":"TabsDemo.d.ts","sourceRoot":"","sources":["../src/TabsDemo.tsx"],"names":[],"mappings":";AAmBA,wBAAgB,QAAQ,gBA4BvB"}

package/types/ToastDemo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ToastDemo.d.ts","sourceRoot":"","sources":["../src/ToastDemo.tsx"],"names":[],"mappings":";AAIA,eAAO,MAAM,SAAS,mBAWrB,CAAA"}
+{"version":3,"file":"ToastDemo.d.ts","sourceRoot":"","sources":["../src/ToastDemo.tsx"],"names":[],"mappings":";AAKA,eAAO,MAAM,SAAS,mBAWrB,CAAA"}