@tamagui/demos 1.27.2 → 1.28.0
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/ButtonDemo.js +2 -2
- package/dist/cjs/ButtonDemo.js.map +1 -1
- package/dist/esm/ButtonDemo.js +2 -2
- package/dist/esm/ButtonDemo.js.map +1 -1
- package/dist/jsx/ButtonDemo.js +2 -2
- package/dist/jsx/ButtonDemo.js.map +1 -1
- package/dist/jsx/ButtonDemo.mjs +2 -2
- package/dist/jsx/ButtonDemo.mjs.map +1 -1
- package/package.json +18 -18
- package/src/ButtonDemo.tsx +2 -2
- package/dist/esm/AddThemeDemo.mjs +0 -36
- package/dist/esm/AlertDialogDemo.mjs +0 -53
- package/dist/esm/AnimationsDemo.mjs +0 -89
- package/dist/esm/AnimationsEnterDemo.mjs +0 -40
- package/dist/esm/AnimationsHoverDemo.mjs +0 -27
- package/dist/esm/AnimationsPresenceDemo.mjs +0 -73
- package/dist/esm/AnimationsTimingDemo.mjs +0 -26
- package/dist/esm/AvatarDemo.mjs +0 -30
- package/dist/esm/ButtonDemo.mjs +0 -25
- package/dist/esm/ButtonNewDemo.mjs +0 -31
- package/dist/esm/CardDemo.mjs +0 -48
- package/dist/esm/CheckboxDemo.mjs +0 -22
- package/dist/esm/ColorsDemo.mjs +0 -98
- package/dist/esm/DialogDemo.mjs +0 -84
- package/dist/esm/FormsDemo.mjs +0 -36
- package/dist/esm/GroupDemo.mjs +0 -25
- package/dist/esm/HeadingsDemo.mjs +0 -16
- package/dist/esm/ImageDemo.mjs +0 -18
- package/dist/esm/InputsDemo.mjs +0 -31
- package/dist/esm/LabelDemo.mjs +0 -18
- package/dist/esm/LinearGradientDemo.mjs +0 -33
- package/dist/esm/ListItemDemo.mjs +0 -47
- package/dist/esm/LucideIconsDemo.mjs +0 -52
- package/dist/esm/PopoverDemo.mjs +0 -76
- package/dist/esm/ProgressDemo.mjs +0 -59
- package/dist/esm/RadioGroupDemo.mjs +0 -21
- package/dist/esm/ReplaceThemeDemo.mjs +0 -49
- package/dist/esm/ScrollViewDemo.mjs +0 -18
- package/dist/esm/SelectDemo.mjs +0 -137
- package/dist/esm/SeparatorDemo.mjs +0 -20
- package/dist/esm/ShapesDemo.mjs +0 -12
- package/dist/esm/SheetDemo.mjs +0 -91
- package/dist/esm/SliderDemo.mjs +0 -19
- package/dist/esm/SpinnerDemo.mjs +0 -12
- package/dist/esm/StacksDemo.mjs +0 -58
- package/dist/esm/SwitchDemo.mjs +0 -33
- package/dist/esm/TabsAdvancedDemo.mjs +0 -283
- package/dist/esm/TabsDemo.mjs +0 -141
- package/dist/esm/TextDemo.mjs +0 -16
- package/dist/esm/ThemeInverseDemo.mjs +0 -42
- package/dist/esm/ToastDemo.mjs +0 -101
- package/dist/esm/ToastDuplicateDemo.mjs +0 -44
- package/dist/esm/ToggleGroupDemo.mjs +0 -49
- package/dist/esm/TokensDemo.mjs +0 -87
- package/dist/esm/TooltipDemo.mjs +0 -68
- package/dist/esm/UpdateThemeDemo.mjs +0 -56
- package/dist/esm/conf.mjs +0 -5
- package/dist/esm/index.mjs +0 -48
- package/dist/esm/tamagui.config.mjs +0 -6
- package/dist/esm/useOnIntersecting.mjs +0 -68
- package/dist/jsx/ButtonHeadlessDemo.mjs +0 -92
- package/dist/jsx/ButtonSimpleDemo.mjs +0 -24
package/dist/cjs/ButtonDemo.js
CHANGED
|
@@ -33,8 +33,8 @@ function ButtonDemo(props) {
|
|
|
33
33
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { size: "$3", theme: "yellow", children: "Yellow" })
|
|
34
34
|
] }),
|
|
35
35
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { space: "$2", children: [
|
|
36
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { themeInverse: true, size: "$3", children: "
|
|
37
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { iconAfter: import_lucide_icons.Activity, size: "$3", children: "
|
|
36
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { themeInverse: true, size: "$3", children: "Inverse" }),
|
|
37
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { iconAfter: import_lucide_icons.Activity, size: "$3", children: "iconAfter" })
|
|
38
38
|
] }),
|
|
39
39
|
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XGroup, { children: [
|
|
40
40
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XGroup.Item, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, { width: "50%", size: "$2", disabled: true, opacity: 0.5, children: "disabled" }) }),
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ButtonDemo.tsx"],
|
|
4
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAMM;AANN,0BAAkC;AAClC,qBAA+C;AAExC,SAAS,WAAW,OAAO;AAChC,SACE,6CAAC,yBAAO,SAAQ,MAAK,OAAM,MAAM,GAAG,OAClC;AAAA,gDAAC,yBAAO,mBAAK;AAAA,IACb,4CAAC,yBAAO,WAAU,UAAS,MAAM,6BAAS,MAAK,MAAK,mBAEpD;AAAA,IACA,6CAAC,yBAAO,OAAM,MAAK,gBAAe,UAChC;AAAA,kDAAC,yBAAO,MAAK,MAAK,OAAM,QAAO,kBAE/B;AAAA,MACA,4CAAC,yBAAO,MAAK,MAAK,OAAM,UAAS,oBAEjC;AAAA,OACF;AAAA,IACA,6CAAC,yBAAO,OAAM,MACZ;AAAA,kDAAC,yBAAO,cAAY,MAAC,MAAK,MAAK,
|
|
4
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAMM;AANN,0BAAkC;AAClC,qBAA+C;AAExC,SAAS,WAAW,OAAO;AAChC,SACE,6CAAC,yBAAO,SAAQ,MAAK,OAAM,MAAM,GAAG,OAClC;AAAA,gDAAC,yBAAO,mBAAK;AAAA,IACb,4CAAC,yBAAO,WAAU,UAAS,MAAM,6BAAS,MAAK,MAAK,mBAEpD;AAAA,IACA,6CAAC,yBAAO,OAAM,MAAK,gBAAe,UAChC;AAAA,kDAAC,yBAAO,MAAK,MAAK,OAAM,QAAO,kBAE/B;AAAA,MACA,4CAAC,yBAAO,MAAK,MAAK,OAAM,UAAS,oBAEjC;AAAA,OACF;AAAA,IACA,6CAAC,yBAAO,OAAM,MACZ;AAAA,kDAAC,yBAAO,cAAY,MAAC,MAAK,MAAK,qBAE/B;AAAA,MACA,4CAAC,yBAAO,WAAW,8BAAU,MAAK,MAAK,uBAEvC;AAAA,OACF;AAAA,IACA,6CAAC,yBACC;AAAA,kDAAC,sBAAO,MAAP,EACC,sDAAC,yBAAO,OAAM,OAAM,MAAK,MAAK,UAAQ,MAAC,SAAS,KAAK,sBAErD,GACF;AAAA,MAEA,4CAAC,sBAAO,MAAP,EACC,sDAAC,yBAAO,OAAM,OAAM,MAAK,MAAK,YAAU,MAAC,wBAEzC,GACF;AAAA,OACF;AAAA,KACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
package/dist/esm/ButtonDemo.js
CHANGED
|
@@ -10,8 +10,8 @@ function ButtonDemo(props) {
|
|
|
10
10
|
/* @__PURE__ */ jsx(Button, { size: "$3", theme: "yellow", children: "Yellow" })
|
|
11
11
|
] }),
|
|
12
12
|
/* @__PURE__ */ jsxs(XStack, { space: "$2", children: [
|
|
13
|
-
/* @__PURE__ */ jsx(Button, { themeInverse: true, size: "$3", children: "
|
|
14
|
-
/* @__PURE__ */ jsx(Button, { iconAfter: Activity, size: "$3", children: "
|
|
13
|
+
/* @__PURE__ */ jsx(Button, { themeInverse: true, size: "$3", children: "Inverse" }),
|
|
14
|
+
/* @__PURE__ */ jsx(Button, { iconAfter: Activity, size: "$3", children: "iconAfter" })
|
|
15
15
|
] }),
|
|
16
16
|
/* @__PURE__ */ jsxs(XGroup, { children: [
|
|
17
17
|
/* @__PURE__ */ jsx(XGroup.Item, { children: /* @__PURE__ */ jsx(Button, { width: "50%", size: "$2", disabled: true, opacity: 0.5, children: "disabled" }) }),
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ButtonDemo.tsx"],
|
|
4
|
-
"mappings": "AAMM,cAIA,YAJA;AANN,SAAS,UAAU,eAAe;AAClC,SAAS,QAAQ,QAAQ,QAAQ,cAAc;AAExC,SAAS,WAAW,OAAO;AAChC,SACE,qBAAC,UAAO,SAAQ,MAAK,OAAM,MAAM,GAAG,OAClC;AAAA,wBAAC,UAAO,mBAAK;AAAA,IACb,oBAAC,UAAO,WAAU,UAAS,MAAM,SAAS,MAAK,MAAK,mBAEpD;AAAA,IACA,qBAAC,UAAO,OAAM,MAAK,gBAAe,UAChC;AAAA,0BAAC,UAAO,MAAK,MAAK,OAAM,QAAO,kBAE/B;AAAA,MACA,oBAAC,UAAO,MAAK,MAAK,OAAM,UAAS,oBAEjC;AAAA,OACF;AAAA,IACA,qBAAC,UAAO,OAAM,MACZ;AAAA,0BAAC,UAAO,cAAY,MAAC,MAAK,MAAK,
|
|
4
|
+
"mappings": "AAMM,cAIA,YAJA;AANN,SAAS,UAAU,eAAe;AAClC,SAAS,QAAQ,QAAQ,QAAQ,cAAc;AAExC,SAAS,WAAW,OAAO;AAChC,SACE,qBAAC,UAAO,SAAQ,MAAK,OAAM,MAAM,GAAG,OAClC;AAAA,wBAAC,UAAO,mBAAK;AAAA,IACb,oBAAC,UAAO,WAAU,UAAS,MAAM,SAAS,MAAK,MAAK,mBAEpD;AAAA,IACA,qBAAC,UAAO,OAAM,MAAK,gBAAe,UAChC;AAAA,0BAAC,UAAO,MAAK,MAAK,OAAM,QAAO,kBAE/B;AAAA,MACA,oBAAC,UAAO,MAAK,MAAK,OAAM,UAAS,oBAEjC;AAAA,OACF;AAAA,IACA,qBAAC,UAAO,OAAM,MACZ;AAAA,0BAAC,UAAO,cAAY,MAAC,MAAK,MAAK,qBAE/B;AAAA,MACA,oBAAC,UAAO,WAAW,UAAU,MAAK,MAAK,uBAEvC;AAAA,OACF;AAAA,IACA,qBAAC,UACC;AAAA,0BAAC,OAAO,MAAP,EACC,8BAAC,UAAO,OAAM,OAAM,MAAK,MAAK,UAAQ,MAAC,SAAS,KAAK,sBAErD,GACF;AAAA,MAEA,oBAAC,OAAO,MAAP,EACC,8BAAC,UAAO,OAAM,OAAM,MAAK,MAAK,YAAU,MAAC,wBAEzC,GACF;AAAA,OACF;AAAA,KACF;AAEJ;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
package/dist/jsx/ButtonDemo.js
CHANGED
|
@@ -9,8 +9,8 @@ function ButtonDemo(props) {
|
|
|
9
9
|
<Button size="$3" theme="yellow">Yellow</Button>
|
|
10
10
|
</XStack>
|
|
11
11
|
<XStack space="$2">
|
|
12
|
-
<Button themeInverse size="$3">
|
|
13
|
-
<Button iconAfter={Activity} size="$3">
|
|
12
|
+
<Button themeInverse size="$3">Inverse</Button>
|
|
13
|
+
<Button iconAfter={Activity} size="$3">iconAfter</Button>
|
|
14
14
|
</XStack>
|
|
15
15
|
<XGroup>
|
|
16
16
|
<XGroup.Item><Button width="50%" size="$2" disabled opacity={0.5}>disabled</Button></XGroup.Item>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ButtonDemo.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,QAAQ,QAAQ,QAAQ,cAAc;AAExC,SAAS,WAAW,OAAO;AAChC,SACE,CAAC,OAAO,QAAQ,KAAK,MAAM,SAAS;AAAA,IAClC,CAAC,OAAO,KAAK,EAAZ;AAAA,IACD,CAAC,OAAO,UAAU,SAAS,MAAM,SAAS,KAAK,KAAK,KAEpD,EAFC;AAAA,IAGD,CAAC,OAAO,MAAM,KAAK,eAAe;AAAA,MAChC,CAAC,OAAO,KAAK,KAAK,MAAM,OAAO,IAE/B,EAFC;AAAA,MAGD,CAAC,OAAO,KAAK,KAAK,MAAM,SAAS,MAEjC,EAFC;AAAA,IAGH,EAPC;AAAA,IAQD,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,OAAO,aAAa,KAAK,KAAK,
|
|
4
|
+
"mappings": "AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,QAAQ,QAAQ,QAAQ,cAAc;AAExC,SAAS,WAAW,OAAO;AAChC,SACE,CAAC,OAAO,QAAQ,KAAK,MAAM,SAAS;AAAA,IAClC,CAAC,OAAO,KAAK,EAAZ;AAAA,IACD,CAAC,OAAO,UAAU,SAAS,MAAM,SAAS,KAAK,KAAK,KAEpD,EAFC;AAAA,IAGD,CAAC,OAAO,MAAM,KAAK,eAAe;AAAA,MAChC,CAAC,OAAO,KAAK,KAAK,MAAM,OAAO,IAE/B,EAFC;AAAA,MAGD,CAAC,OAAO,KAAK,KAAK,MAAM,SAAS,MAEjC,EAFC;AAAA,IAGH,EAPC;AAAA,IAQD,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,OAAO,aAAa,KAAK,KAAK,OAE/B,EAFC;AAAA,MAGD,CAAC,OAAO,WAAW,UAAU,KAAK,KAAK,SAEvC,EAFC;AAAA,IAGH,EAPC;AAAA,IAQD,CAAC;AAAA,MACC,CAAC,OAAO,KACN,CAAC,OAAO,MAAM,MAAM,KAAK,KAAK,SAAS,SAAS,KAAK,QAErD,EAFC,OAGH,EAJC,OAAO;AAAA,MAMR,CAAC,OAAO,KACN,CAAC,OAAO,MAAM,MAAM,KAAK,KAAK,WAAW,UAEzC,EAFC,OAGH,EAJC,OAAO;AAAA,IAKV,EAZC;AAAA,EAaH,EAlCC;AAoCL;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
package/dist/jsx/ButtonDemo.mjs
CHANGED
|
@@ -9,8 +9,8 @@ function ButtonDemo(props) {
|
|
|
9
9
|
<Button size="$3" theme="yellow">Yellow</Button>
|
|
10
10
|
</XStack>
|
|
11
11
|
<XStack space="$2">
|
|
12
|
-
<Button themeInverse size="$3">
|
|
13
|
-
<Button iconAfter={Activity} size="$3">
|
|
12
|
+
<Button themeInverse size="$3">Inverse</Button>
|
|
13
|
+
<Button iconAfter={Activity} size="$3">iconAfter</Button>
|
|
14
14
|
</XStack>
|
|
15
15
|
<XGroup>
|
|
16
16
|
<XGroup.Item><Button width="50%" size="$2" disabled opacity={0.5}>disabled</Button></XGroup.Item>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/ButtonDemo.tsx"],
|
|
4
|
-
"mappings": "AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,QAAQ,QAAQ,QAAQ,cAAc;AAExC,SAAS,WAAW,OAAO;AAChC,SACE,CAAC,OAAO,QAAQ,KAAK,MAAM,SAAS;AAAA,IAClC,CAAC,OAAO,KAAK,EAAZ;AAAA,IACD,CAAC,OAAO,UAAU,SAAS,MAAM,SAAS,KAAK,KAAK,KAEpD,EAFC;AAAA,IAGD,CAAC,OAAO,MAAM,KAAK,eAAe;AAAA,MAChC,CAAC,OAAO,KAAK,KAAK,MAAM,OAAO,IAE/B,EAFC;AAAA,MAGD,CAAC,OAAO,KAAK,KAAK,MAAM,SAAS,MAEjC,EAFC;AAAA,IAGH,EAPC;AAAA,IAQD,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,OAAO,aAAa,KAAK,KAAK,
|
|
4
|
+
"mappings": "AAAA,SAAS,UAAU,eAAe;AAClC,SAAS,QAAQ,QAAQ,QAAQ,cAAc;AAExC,SAAS,WAAW,OAAO;AAChC,SACE,CAAC,OAAO,QAAQ,KAAK,MAAM,SAAS;AAAA,IAClC,CAAC,OAAO,KAAK,EAAZ;AAAA,IACD,CAAC,OAAO,UAAU,SAAS,MAAM,SAAS,KAAK,KAAK,KAEpD,EAFC;AAAA,IAGD,CAAC,OAAO,MAAM,KAAK,eAAe;AAAA,MAChC,CAAC,OAAO,KAAK,KAAK,MAAM,OAAO,IAE/B,EAFC;AAAA,MAGD,CAAC,OAAO,KAAK,KAAK,MAAM,SAAS,MAEjC,EAFC;AAAA,IAGH,EAPC;AAAA,IAQD,CAAC,OAAO,MAAM;AAAA,MACZ,CAAC,OAAO,aAAa,KAAK,KAAK,OAE/B,EAFC;AAAA,MAGD,CAAC,OAAO,WAAW,UAAU,KAAK,KAAK,SAEvC,EAFC;AAAA,IAGH,EAPC;AAAA,IAQD,CAAC;AAAA,MACC,CAAC,OAAO,KACN,CAAC,OAAO,MAAM,MAAM,KAAK,KAAK,SAAS,SAAS,KAAK,QAErD,EAFC,OAGH,EAJC,OAAO;AAAA,MAMR,CAAC,OAAO,KACN,CAAC,OAAO,MAAM,MAAM,KAAK,KAAK,WAAW,UAEzC,EAFC,OAGH,EAJC,OAAO;AAAA,IAKV,EAZC;AAAA,EAaH,EAlCC;AAoCL;",
|
|
5
5
|
"names": []
|
|
6
6
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/demos",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.28.0",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -28,29 +28,29 @@
|
|
|
28
28
|
}
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
|
-
"@tamagui/avatar": "1.
|
|
32
|
-
"@tamagui/button": "1.
|
|
33
|
-
"@tamagui/config": "1.
|
|
34
|
-
"@tamagui/core": "1.
|
|
35
|
-
"@tamagui/list-item": "1.
|
|
36
|
-
"@tamagui/logo": "1.
|
|
37
|
-
"@tamagui/menu": "1.
|
|
38
|
-
"@tamagui/popover": "1.
|
|
39
|
-
"@tamagui/progress": "1.
|
|
40
|
-
"@tamagui/radio-group": "1.
|
|
41
|
-
"@tamagui/select": "1.
|
|
42
|
-
"@tamagui/sheet": "1.
|
|
43
|
-
"@tamagui/slider": "1.
|
|
44
|
-
"@tamagui/stacks": "1.
|
|
45
|
-
"@tamagui/toast": "1.
|
|
46
|
-
"tamagui": "1.
|
|
31
|
+
"@tamagui/avatar": "1.28.0",
|
|
32
|
+
"@tamagui/button": "1.28.0",
|
|
33
|
+
"@tamagui/config": "1.28.0",
|
|
34
|
+
"@tamagui/core": "1.28.0",
|
|
35
|
+
"@tamagui/list-item": "1.28.0",
|
|
36
|
+
"@tamagui/logo": "1.28.0",
|
|
37
|
+
"@tamagui/menu": "1.28.0",
|
|
38
|
+
"@tamagui/popover": "1.28.0",
|
|
39
|
+
"@tamagui/progress": "1.28.0",
|
|
40
|
+
"@tamagui/radio-group": "1.28.0",
|
|
41
|
+
"@tamagui/select": "1.28.0",
|
|
42
|
+
"@tamagui/sheet": "1.28.0",
|
|
43
|
+
"@tamagui/slider": "1.28.0",
|
|
44
|
+
"@tamagui/stacks": "1.28.0",
|
|
45
|
+
"@tamagui/toast": "1.28.0",
|
|
46
|
+
"tamagui": "1.28.0"
|
|
47
47
|
},
|
|
48
48
|
"peerDependencies": {
|
|
49
49
|
"react": "*",
|
|
50
50
|
"react-dom": "*"
|
|
51
51
|
},
|
|
52
52
|
"devDependencies": {
|
|
53
|
-
"@tamagui/build": "1.
|
|
53
|
+
"@tamagui/build": "1.28.0",
|
|
54
54
|
"react": "^18.2.0",
|
|
55
55
|
"react-dom": "^18.2.0"
|
|
56
56
|
},
|
package/src/ButtonDemo.tsx
CHANGED
|
@@ -18,10 +18,10 @@ export function ButtonDemo(props) {
|
|
|
18
18
|
</XStack>
|
|
19
19
|
<XStack space="$2">
|
|
20
20
|
<Button themeInverse size="$3">
|
|
21
|
-
|
|
21
|
+
Inverse
|
|
22
22
|
</Button>
|
|
23
23
|
<Button iconAfter={Activity} size="$3">
|
|
24
|
-
|
|
24
|
+
iconAfter
|
|
25
25
|
</Button>
|
|
26
26
|
</XStack>
|
|
27
27
|
<XGroup>
|
|
@@ -1,36 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { addTheme } from "@tamagui/theme";
|
|
3
|
-
import { useState } from "react";
|
|
4
|
-
import { Button, H3, Square, Theme, YStack } from "tamagui";
|
|
5
|
-
function AddThemeDemo() {
|
|
6
|
-
const [theme, setTheme] = useState();
|
|
7
|
-
return /* @__PURE__ */ jsxs(YStack, { alignItems: "center", space: true, children: [
|
|
8
|
-
/* @__PURE__ */ jsxs(H3, { children: [
|
|
9
|
-
"Theme: ",
|
|
10
|
-
theme ?? "none"
|
|
11
|
-
] }),
|
|
12
|
-
/* @__PURE__ */ jsx(Theme, { name: theme ?? "red", children: /* @__PURE__ */ jsx(Square, { borderRadius: "$8", size: 100, backgroundColor: "$color" }) }),
|
|
13
|
-
/* @__PURE__ */ jsx(
|
|
14
|
-
Button,
|
|
15
|
-
{
|
|
16
|
-
disabled: theme === "superblue",
|
|
17
|
-
onPress: () => {
|
|
18
|
-
addTheme({
|
|
19
|
-
name: "superblue",
|
|
20
|
-
insertCSS: true,
|
|
21
|
-
theme: {
|
|
22
|
-
background: "#000",
|
|
23
|
-
color: "blue"
|
|
24
|
-
}
|
|
25
|
-
});
|
|
26
|
-
setTheme("superblue");
|
|
27
|
-
},
|
|
28
|
-
children: "Add superblue theme"
|
|
29
|
-
}
|
|
30
|
-
)
|
|
31
|
-
] });
|
|
32
|
-
}
|
|
33
|
-
export {
|
|
34
|
-
AddThemeDemo
|
|
35
|
-
};
|
|
36
|
-
//# sourceMappingURL=AddThemeDemo.mjs.map
|
|
@@ -1,53 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { AlertDialog, Button, XStack, YStack } from "tamagui";
|
|
3
|
-
function AlertDialogDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsxs(AlertDialog, { native: true, children: [
|
|
5
|
-
/* @__PURE__ */ jsx(AlertDialog.Trigger, { asChild: true, children: /* @__PURE__ */ jsx(Button, { children: "Show Alert" }) }),
|
|
6
|
-
/* @__PURE__ */ jsxs(AlertDialog.Portal, { children: [
|
|
7
|
-
/* @__PURE__ */ jsx(
|
|
8
|
-
AlertDialog.Overlay,
|
|
9
|
-
{
|
|
10
|
-
animation: "quick",
|
|
11
|
-
opacity: 0.5,
|
|
12
|
-
enterStyle: { opacity: 0 },
|
|
13
|
-
exitStyle: { opacity: 0 }
|
|
14
|
-
},
|
|
15
|
-
"overlay"
|
|
16
|
-
),
|
|
17
|
-
/* @__PURE__ */ jsx(
|
|
18
|
-
AlertDialog.Content,
|
|
19
|
-
{
|
|
20
|
-
bordered: true,
|
|
21
|
-
elevate: true,
|
|
22
|
-
animation: [
|
|
23
|
-
"quick",
|
|
24
|
-
{
|
|
25
|
-
opacity: {
|
|
26
|
-
overshootClamping: true
|
|
27
|
-
}
|
|
28
|
-
}
|
|
29
|
-
],
|
|
30
|
-
enterStyle: { x: 0, y: -20, opacity: 0, scale: 0.9 },
|
|
31
|
-
exitStyle: { x: 0, y: 10, opacity: 0, scale: 0.95 },
|
|
32
|
-
x: 0,
|
|
33
|
-
scale: 1,
|
|
34
|
-
opacity: 1,
|
|
35
|
-
y: 0,
|
|
36
|
-
children: /* @__PURE__ */ jsxs(YStack, { space: true, children: [
|
|
37
|
-
/* @__PURE__ */ jsx(AlertDialog.Title, { children: "Accept" }),
|
|
38
|
-
/* @__PURE__ */ jsx(AlertDialog.Description, { children: "By pressing yes, you accept our terms and conditions." }),
|
|
39
|
-
/* @__PURE__ */ jsxs(XStack, { space: "$3", justifyContent: "flex-end", children: [
|
|
40
|
-
/* @__PURE__ */ jsx(AlertDialog.Cancel, { asChild: true, children: /* @__PURE__ */ jsx(Button, { children: "Cancel" }) }),
|
|
41
|
-
/* @__PURE__ */ jsx(AlertDialog.Action, { asChild: true, children: /* @__PURE__ */ jsx(Button, { theme: "active", children: "Accept" }) })
|
|
42
|
-
] })
|
|
43
|
-
] })
|
|
44
|
-
},
|
|
45
|
-
"content"
|
|
46
|
-
)
|
|
47
|
-
] })
|
|
48
|
-
] });
|
|
49
|
-
}
|
|
50
|
-
export {
|
|
51
|
-
AlertDialogDemo
|
|
52
|
-
};
|
|
53
|
-
//# sourceMappingURL=AlertDialogDemo.mjs.map
|
|
@@ -1,89 +0,0 @@
|
|
|
1
|
-
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { LogoIcon } from "@tamagui/logo";
|
|
3
|
-
import { Play } from "@tamagui/lucide-icons";
|
|
4
|
-
import { Button, Square, useControllableState, useEvent } from "tamagui";
|
|
5
|
-
function AnimationsDemo(props) {
|
|
6
|
-
const [positionI, setPositionI] = useControllableState({
|
|
7
|
-
strategy: "most-recent-wins",
|
|
8
|
-
prop: props.position,
|
|
9
|
-
defaultProp: 0
|
|
10
|
-
});
|
|
11
|
-
const position = positions[positionI];
|
|
12
|
-
const onPress = useEvent(() => {
|
|
13
|
-
setPositionI((x) => {
|
|
14
|
-
return (x + 1) % positions.length;
|
|
15
|
-
});
|
|
16
|
-
});
|
|
17
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
18
|
-
/* @__PURE__ */ jsx(
|
|
19
|
-
Square,
|
|
20
|
-
{
|
|
21
|
-
animation: props.animation || "bouncy",
|
|
22
|
-
onPress,
|
|
23
|
-
size: 104,
|
|
24
|
-
borderColor: "$borderColor",
|
|
25
|
-
borderWidth: 1,
|
|
26
|
-
borderRadius: "$9",
|
|
27
|
-
backgroundColor: "$color9",
|
|
28
|
-
hoverStyle: {
|
|
29
|
-
scale: 1.1
|
|
30
|
-
},
|
|
31
|
-
pressStyle: {
|
|
32
|
-
scale: 0.9
|
|
33
|
-
},
|
|
34
|
-
...position,
|
|
35
|
-
children: props.children || /* @__PURE__ */ jsx(LogoIcon, { downscale: 0.75 })
|
|
36
|
-
}
|
|
37
|
-
),
|
|
38
|
-
/* @__PURE__ */ jsx(
|
|
39
|
-
Button,
|
|
40
|
-
{
|
|
41
|
-
position: "absolute",
|
|
42
|
-
bottom: 20,
|
|
43
|
-
left: 20,
|
|
44
|
-
icon: Play,
|
|
45
|
-
theme: props.tint,
|
|
46
|
-
size: "$5",
|
|
47
|
-
circular: true,
|
|
48
|
-
onPress
|
|
49
|
-
}
|
|
50
|
-
)
|
|
51
|
-
] });
|
|
52
|
-
}
|
|
53
|
-
const positions = [
|
|
54
|
-
{
|
|
55
|
-
x: 0,
|
|
56
|
-
y: 0,
|
|
57
|
-
scale: 1,
|
|
58
|
-
rotate: "0deg"
|
|
59
|
-
},
|
|
60
|
-
{
|
|
61
|
-
x: -50,
|
|
62
|
-
y: -50,
|
|
63
|
-
scale: 0.5,
|
|
64
|
-
rotate: "-45deg",
|
|
65
|
-
hoverStyle: {
|
|
66
|
-
scale: 0.6
|
|
67
|
-
},
|
|
68
|
-
pressStyle: {
|
|
69
|
-
scale: 0.4
|
|
70
|
-
}
|
|
71
|
-
},
|
|
72
|
-
{
|
|
73
|
-
x: 50,
|
|
74
|
-
y: 50,
|
|
75
|
-
scale: 1,
|
|
76
|
-
rotate: "180deg",
|
|
77
|
-
hoverStyle: {
|
|
78
|
-
scale: 1.1
|
|
79
|
-
},
|
|
80
|
-
pressStyle: {
|
|
81
|
-
scale: 0.9
|
|
82
|
-
}
|
|
83
|
-
}
|
|
84
|
-
];
|
|
85
|
-
export {
|
|
86
|
-
AnimationsDemo,
|
|
87
|
-
positions
|
|
88
|
-
};
|
|
89
|
-
//# sourceMappingURL=AnimationsDemo.mjs.map
|
|
@@ -1,40 +0,0 @@
|
|
|
1
|
-
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { LogoIcon } from "@tamagui/logo";
|
|
3
|
-
import { useRef, useState } from "react";
|
|
4
|
-
import { Button, Square, YStack } from "tamagui";
|
|
5
|
-
import { useIsIntersecting } from "./useOnIntersecting";
|
|
6
|
-
function AnimationsEnterDemo(props) {
|
|
7
|
-
const ref = useRef(null);
|
|
8
|
-
const hasIntersected = useIsIntersecting(ref, { once: true });
|
|
9
|
-
const [key, setKey] = useState(0);
|
|
10
|
-
if (!hasIntersected) {
|
|
11
|
-
return /* @__PURE__ */ jsx(YStack, { ref });
|
|
12
|
-
}
|
|
13
|
-
return /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
14
|
-
/* @__PURE__ */ jsx(
|
|
15
|
-
Square,
|
|
16
|
-
{
|
|
17
|
-
enterStyle: {
|
|
18
|
-
scale: 1.5,
|
|
19
|
-
y: -10,
|
|
20
|
-
opacity: 0
|
|
21
|
-
},
|
|
22
|
-
animation: "bouncy",
|
|
23
|
-
elevation: "$4",
|
|
24
|
-
size: 110,
|
|
25
|
-
opacity: 1,
|
|
26
|
-
scale: 1,
|
|
27
|
-
y: 0,
|
|
28
|
-
backgroundColor: "$pink10",
|
|
29
|
-
borderRadius: "$9",
|
|
30
|
-
children: props.children ?? /* @__PURE__ */ jsx(LogoIcon, { downscale: 0.75 })
|
|
31
|
-
},
|
|
32
|
-
key
|
|
33
|
-
),
|
|
34
|
-
/* @__PURE__ */ jsx(Button, { size: "$3", marginTop: "$4", onPress: () => setKey(Math.random()), children: "Re-mount" })
|
|
35
|
-
] });
|
|
36
|
-
}
|
|
37
|
-
export {
|
|
38
|
-
AnimationsEnterDemo
|
|
39
|
-
};
|
|
40
|
-
//# sourceMappingURL=AnimationsEnterDemo.mjs.map
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import { LogoIcon } from "@tamagui/logo";
|
|
3
|
-
import { Square } from "tamagui";
|
|
4
|
-
function AnimationsHoverDemo() {
|
|
5
|
-
return /* @__PURE__ */ jsx(
|
|
6
|
-
Square,
|
|
7
|
-
{
|
|
8
|
-
borderColor: "$borderColor",
|
|
9
|
-
animation: "bouncy",
|
|
10
|
-
elevation: "$4",
|
|
11
|
-
backgroundColor: "$color9",
|
|
12
|
-
size: 104,
|
|
13
|
-
borderRadius: "$9",
|
|
14
|
-
hoverStyle: {
|
|
15
|
-
scale: 1.2
|
|
16
|
-
},
|
|
17
|
-
pressStyle: {
|
|
18
|
-
scale: 0.9
|
|
19
|
-
},
|
|
20
|
-
children: /* @__PURE__ */ jsx(LogoIcon, { downscale: 0.75 })
|
|
21
|
-
}
|
|
22
|
-
);
|
|
23
|
-
}
|
|
24
|
-
export {
|
|
25
|
-
AnimationsHoverDemo
|
|
26
|
-
};
|
|
27
|
-
//# sourceMappingURL=AnimationsHoverDemo.mjs.map
|
|
@@ -1,73 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { AnimatePresence } from "@tamagui/animate-presence";
|
|
3
|
-
import { ArrowLeft, ArrowRight } from "@tamagui/lucide-icons";
|
|
4
|
-
import { useState } from "react";
|
|
5
|
-
import { Button, Image, XStack, YStack, styled } from "tamagui";
|
|
6
|
-
import photo1 from "../../public/photo1.jpg";
|
|
7
|
-
import photo2 from "../../public/photo2.jpg";
|
|
8
|
-
import photo3 from "../../public/photo3.jpg";
|
|
9
|
-
const images = [photo1, photo2, photo3].map((x) => x.src || x);
|
|
10
|
-
const YStackEnterable = styled(YStack, {
|
|
11
|
-
variants: {
|
|
12
|
-
isLeft: { true: { x: -300, opacity: 0 } },
|
|
13
|
-
isRight: { true: { x: 300, opacity: 0 } }
|
|
14
|
-
}
|
|
15
|
-
});
|
|
16
|
-
function AnimationsPresenceDemo() {
|
|
17
|
-
const [[page, direction], setPage] = useState([0, 0]);
|
|
18
|
-
const imageIndex = wrap(0, images.length, page);
|
|
19
|
-
const paginate = (newDirection) => {
|
|
20
|
-
setPage([page + newDirection, newDirection]);
|
|
21
|
-
};
|
|
22
|
-
const enterVariant = direction === 1 || direction === 0 ? "isRight" : "isLeft";
|
|
23
|
-
const exitVariant = direction === 1 ? "isLeft" : "isRight";
|
|
24
|
-
return /* @__PURE__ */ jsxs(
|
|
25
|
-
XStack,
|
|
26
|
-
{
|
|
27
|
-
overflow: "hidden",
|
|
28
|
-
backgroundColor: "#000",
|
|
29
|
-
position: "relative",
|
|
30
|
-
height: 300,
|
|
31
|
-
width: "100%",
|
|
32
|
-
alignItems: "center",
|
|
33
|
-
children: [
|
|
34
|
-
/* @__PURE__ */ jsx(AnimatePresence, { enterVariant, exitVariant, children: /* @__PURE__ */ jsx(YStackEnterable, { animation: "bouncy", fullscreen: true, x: 0, opacity: 1, children: /* @__PURE__ */ jsx(Image, { source: { uri: images[imageIndex], width: 780, height: 300 } }) }, page) }),
|
|
35
|
-
/* @__PURE__ */ jsx(
|
|
36
|
-
Button,
|
|
37
|
-
{
|
|
38
|
-
accessibilityLabel: "Carousel left",
|
|
39
|
-
icon: ArrowLeft,
|
|
40
|
-
size: "$5",
|
|
41
|
-
position: "absolute",
|
|
42
|
-
left: "$4",
|
|
43
|
-
circular: true,
|
|
44
|
-
elevate: true,
|
|
45
|
-
onPress: () => paginate(-1)
|
|
46
|
-
}
|
|
47
|
-
),
|
|
48
|
-
/* @__PURE__ */ jsx(
|
|
49
|
-
Button,
|
|
50
|
-
{
|
|
51
|
-
accessibilityLabel: "Carousel right",
|
|
52
|
-
icon: ArrowRight,
|
|
53
|
-
size: "$5",
|
|
54
|
-
position: "absolute",
|
|
55
|
-
right: "$4",
|
|
56
|
-
circular: true,
|
|
57
|
-
elevate: true,
|
|
58
|
-
onPress: () => paginate(1)
|
|
59
|
-
}
|
|
60
|
-
)
|
|
61
|
-
]
|
|
62
|
-
}
|
|
63
|
-
);
|
|
64
|
-
}
|
|
65
|
-
const wrap = (min, max, v) => {
|
|
66
|
-
const rangeSize = max - min;
|
|
67
|
-
return ((v - min) % rangeSize + rangeSize) % rangeSize + min;
|
|
68
|
-
};
|
|
69
|
-
export {
|
|
70
|
-
AnimationsPresenceDemo,
|
|
71
|
-
images
|
|
72
|
-
};
|
|
73
|
-
//# sourceMappingURL=AnimationsPresenceDemo.mjs.map
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import { jsx } from "react/jsx-runtime";
|
|
2
|
-
import { LogoIcon } from "@tamagui/logo";
|
|
3
|
-
import { Square } from "tamagui";
|
|
4
|
-
function AnimationsTimingDemo() {
|
|
5
|
-
return /* @__PURE__ */ jsx(
|
|
6
|
-
Square,
|
|
7
|
-
{
|
|
8
|
-
backgroundColor: "$pink10",
|
|
9
|
-
animation: "100ms",
|
|
10
|
-
elevation: "$4",
|
|
11
|
-
size: 110,
|
|
12
|
-
borderRadius: "$9",
|
|
13
|
-
hoverStyle: {
|
|
14
|
-
scale: 1.2
|
|
15
|
-
},
|
|
16
|
-
pressStyle: {
|
|
17
|
-
scale: 0.9
|
|
18
|
-
},
|
|
19
|
-
children: /* @__PURE__ */ jsx(LogoIcon, { downscale: 0.75 })
|
|
20
|
-
}
|
|
21
|
-
);
|
|
22
|
-
}
|
|
23
|
-
export {
|
|
24
|
-
AnimationsTimingDemo
|
|
25
|
-
};
|
|
26
|
-
//# sourceMappingURL=AnimationsTimingDemo.mjs.map
|
package/dist/esm/AvatarDemo.mjs
DELETED
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Avatar, XStack } from "tamagui";
|
|
3
|
-
function AvatarDemo() {
|
|
4
|
-
return /* @__PURE__ */ jsxs(XStack, { alignItems: "center", space: "$6", children: [
|
|
5
|
-
/* @__PURE__ */ jsxs(Avatar, { circular: true, size: "$10", children: [
|
|
6
|
-
/* @__PURE__ */ jsx(
|
|
7
|
-
Avatar.Image,
|
|
8
|
-
{
|
|
9
|
-
accessibilityLabel: "Cam",
|
|
10
|
-
src: "https://images.unsplash.com/photo-1548142813-c348350df52b?&w=150&h=150&dpr=2&q=80"
|
|
11
|
-
}
|
|
12
|
-
),
|
|
13
|
-
/* @__PURE__ */ jsx(Avatar.Fallback, { backgroundColor: "$blue10" })
|
|
14
|
-
] }),
|
|
15
|
-
/* @__PURE__ */ jsxs(Avatar, { circular: true, size: "$8", children: [
|
|
16
|
-
/* @__PURE__ */ jsx(
|
|
17
|
-
Avatar.Image,
|
|
18
|
-
{
|
|
19
|
-
accessibilityLabel: "Nate Wienert",
|
|
20
|
-
src: "https://images.unsplash.com/photo-1531384441138-2736e62e0919?&w=100&h=100&dpr=2&q=80"
|
|
21
|
-
}
|
|
22
|
-
),
|
|
23
|
-
/* @__PURE__ */ jsx(Avatar.Fallback, { delayMs: 600, backgroundColor: "$blue10" })
|
|
24
|
-
] })
|
|
25
|
-
] });
|
|
26
|
-
}
|
|
27
|
-
export {
|
|
28
|
-
AvatarDemo
|
|
29
|
-
};
|
|
30
|
-
//# sourceMappingURL=AvatarDemo.mjs.map
|
package/dist/esm/ButtonDemo.mjs
DELETED
|
@@ -1,25 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Activity, Airplay } from "@tamagui/lucide-icons";
|
|
3
|
-
import { Button, XGroup, XStack, YStack } from "tamagui";
|
|
4
|
-
function ButtonDemo(props) {
|
|
5
|
-
return /* @__PURE__ */ jsxs(YStack, { padding: "$3", space: "$3", ...props, children: [
|
|
6
|
-
/* @__PURE__ */ jsx(Button, { children: "Plain" }),
|
|
7
|
-
/* @__PURE__ */ jsx(Button, { alignSelf: "center", icon: Airplay, size: "$6", children: "Large" }),
|
|
8
|
-
/* @__PURE__ */ jsxs(XStack, { space: "$2", justifyContent: "center", children: [
|
|
9
|
-
/* @__PURE__ */ jsx(Button, { size: "$3", theme: "alt2", children: "Alt2" }),
|
|
10
|
-
/* @__PURE__ */ jsx(Button, { size: "$3", theme: "yellow", children: "Yellow" })
|
|
11
|
-
] }),
|
|
12
|
-
/* @__PURE__ */ jsxs(XStack, { space: "$2", children: [
|
|
13
|
-
/* @__PURE__ */ jsx(Button, { themeInverse: true, size: "$3", children: "Small Inverse" }),
|
|
14
|
-
/* @__PURE__ */ jsx(Button, { iconAfter: Activity, size: "$3", children: "After" })
|
|
15
|
-
] }),
|
|
16
|
-
/* @__PURE__ */ jsxs(XGroup, { children: [
|
|
17
|
-
/* @__PURE__ */ jsx(XGroup.Item, { children: /* @__PURE__ */ jsx(Button, { width: "50%", size: "$2", disabled: true, opacity: 0.5, children: "disabled" }) }),
|
|
18
|
-
/* @__PURE__ */ jsx(XGroup.Item, { children: /* @__PURE__ */ jsx(Button, { width: "50%", size: "$2", chromeless: true, children: "chromeless" }) })
|
|
19
|
-
] })
|
|
20
|
-
] });
|
|
21
|
-
}
|
|
22
|
-
export {
|
|
23
|
-
ButtonDemo
|
|
24
|
-
};
|
|
25
|
-
//# sourceMappingURL=ButtonDemo.mjs.map
|
|
@@ -1,31 +0,0 @@
|
|
|
1
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import { Activity, Airplay } from "@tamagui/lucide-icons";
|
|
3
|
-
import { Button, XGroup, XStack, YStack } from "tamagui";
|
|
4
|
-
function ButtonNewDemo(props) {
|
|
5
|
-
return /* @__PURE__ */ jsxs(YStack, { padding: "$3", space: "$3", ...props, children: [
|
|
6
|
-
/* @__PURE__ */ jsx(Button, { children: /* @__PURE__ */ jsx(Button.Text, { children: "Plain" }) }),
|
|
7
|
-
/* @__PURE__ */ jsxs(Button, { alignSelf: "center", size: "$6", space: "$2", children: [
|
|
8
|
-
/* @__PURE__ */ jsx(Button.Icon, { children: /* @__PURE__ */ jsx(Airplay, {}) }),
|
|
9
|
-
/* @__PURE__ */ jsx(Button.Text, { children: "Large" })
|
|
10
|
-
] }),
|
|
11
|
-
/* @__PURE__ */ jsxs(XStack, { space: "$2", justifyContent: "center", children: [
|
|
12
|
-
/* @__PURE__ */ jsx(Button, { size: "$3", theme: "alt2", children: /* @__PURE__ */ jsx(Button.Text, { children: "Alt2" }) }),
|
|
13
|
-
/* @__PURE__ */ jsx(Button, { size: "$3", theme: "yellow", children: /* @__PURE__ */ jsx(Button.Text, { children: "Yellow" }) })
|
|
14
|
-
] }),
|
|
15
|
-
/* @__PURE__ */ jsxs(XStack, { space: "$2", children: [
|
|
16
|
-
/* @__PURE__ */ jsx(Button, { themeInverse: true, size: "$3", children: /* @__PURE__ */ jsx(Button.Text, { children: "Small Inverse" }) }),
|
|
17
|
-
/* @__PURE__ */ jsxs(Button, { size: "$3", space: "$2", children: [
|
|
18
|
-
/* @__PURE__ */ jsx(Button.Text, { children: "After" }),
|
|
19
|
-
/* @__PURE__ */ jsx(Button.Icon, { children: /* @__PURE__ */ jsx(Activity, {}) })
|
|
20
|
-
] })
|
|
21
|
-
] }),
|
|
22
|
-
/* @__PURE__ */ jsxs(XGroup, { children: [
|
|
23
|
-
/* @__PURE__ */ jsx(XGroup.Item, { children: /* @__PURE__ */ jsx(Button, { width: "50%", size: "$2", disabled: true, opacity: 0.5, children: /* @__PURE__ */ jsx(Button.Text, { children: "disabled" }) }) }),
|
|
24
|
-
/* @__PURE__ */ jsx(XGroup.Item, { children: /* @__PURE__ */ jsx(Button, { width: "50%", size: "$2", chromeless: true, children: /* @__PURE__ */ jsx(Button.Text, { children: "chromeless" }) }) })
|
|
25
|
-
] })
|
|
26
|
-
] });
|
|
27
|
-
}
|
|
28
|
-
export {
|
|
29
|
-
ButtonNewDemo
|
|
30
|
-
};
|
|
31
|
-
//# sourceMappingURL=ButtonNewDemo.mjs.map
|