@tamagui/demos 1.0.22 → 1.1.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/DialogDemo.js.map +2 -2
- package/dist/cjs/LinearGradientDemo.js +3 -2
- package/dist/cjs/LinearGradientDemo.js.map +2 -2
- package/dist/cjs/SelectDemo.js +4 -2
- package/dist/cjs/SelectDemo.js.map +2 -2
- package/dist/esm/DialogDemo.js.map +2 -2
- package/dist/esm/LinearGradientDemo.js +2 -1
- package/dist/esm/LinearGradientDemo.js.map +2 -2
- package/dist/esm/SelectDemo.js +3 -1
- package/dist/esm/SelectDemo.js.map +2 -2
- package/dist/jsx/DialogDemo.js.map +2 -2
- package/dist/jsx/LinearGradientDemo.js +2 -1
- package/dist/jsx/LinearGradientDemo.js.map +2 -2
- package/dist/jsx/SelectDemo.js +3 -2
- package/dist/jsx/SelectDemo.js.map +2 -2
- package/package.json +17 -16
- package/src/DialogDemo.tsx +1 -1
- package/src/LinearGradientDemo.tsx +2 -2
- package/src/SelectDemo.tsx +4 -3
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DialogDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Dialog,\n Fieldset,\n H2,\n Input,\n Label,\n Sheet,\n Unspaced,\n YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n return (\n <Dialog modal>\n <Dialog.Trigger asChild>\n <Button>Edit Profile</Button>\n </Dialog.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet zIndex={
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBQ;AApBR,0BAAkB;AAClB,qBAWO;AAEP,wBAA2B;AAEpB,SAAS,aAAa;AAC3B,SACE,6CAAC;AAAA,IAAO,OAAK;AAAA,IACX;AAAA,kDAAC,sBAAO,SAAP;AAAA,QAAe,SAAO;AAAA,QACrB,sDAAC;AAAA,UAAO;AAAA,SAAY;AAAA,OACtB;AAAA,MAEA,4CAAC;AAAA,QAAM,MAAK;AAAA,QAAK,UAAS;AAAA,QACxB,uDAAC;AAAA,UAAM,QAAQ;AAAA,
|
|
4
|
+
"sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Dialog,\n Fieldset,\n H2,\n Input,\n Label,\n Sheet,\n Unspaced,\n YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n return (\n <Dialog modal>\n <Dialog.Trigger asChild>\n <Button>Edit Profile</Button>\n </Dialog.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n <Sheet.Frame padding=\"$4\" space>\n <Adapt.Contents />\n </Sheet.Frame>\n <Sheet.Overlay />\n </Sheet>\n </Adapt>\n\n <Dialog.Portal>\n <Dialog.Overlay\n key=\"overlay\"\n animation=\"quick\"\n o={0.5}\n enterStyle={{ o: 0 }}\n exitStyle={{ o: 0 }}\n />\n\n <Dialog.Content\n bordered\n elevate\n key=\"content\"\n animation={[\n 'quick',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n space\n >\n <Dialog.Title>Edit profile</Dialog.Title>\n <Dialog.Description>\n Make changes to your profile here. Click save when you're done.\n </Dialog.Description>\n <Fieldset space=\"$4\" horizontal>\n <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n Name\n </Label>\n <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n </Fieldset>\n <Fieldset space=\"$4\" horizontal>\n <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n Food\n </Label>\n <SelectDemo />\n </Fieldset>\n\n <YStack ai=\"flex-end\" mt=\"$2\">\n <Dialog.Close displayWhenAdapted asChild>\n <Button theme=\"alt1\" aria-label=\"Close\">\n Save changes\n </Button>\n </Dialog.Close>\n </YStack>\n\n <Unspaced>\n <Dialog.Close asChild>\n <Button pos=\"absolute\" t=\"$2\" r=\"$2\" size=\"$3\" circular icon={X} />\n </Dialog.Close>\n </Unspaced>\n </Dialog.Content>\n </Dialog.Portal>\n </Dialog>\n )\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAoBQ;AApBR,0BAAkB;AAClB,qBAWO;AAEP,wBAA2B;AAEpB,SAAS,aAAa;AAC3B,SACE,6CAAC;AAAA,IAAO,OAAK;AAAA,IACX;AAAA,kDAAC,sBAAO,SAAP;AAAA,QAAe,SAAO;AAAA,QACrB,sDAAC;AAAA,UAAO;AAAA,SAAY;AAAA,OACtB;AAAA,MAEA,4CAAC;AAAA,QAAM,MAAK;AAAA,QAAK,UAAS;AAAA,QACxB,uDAAC;AAAA,UAAM,QAAQ;AAAA,UAAQ,OAAK;AAAA,UAAC,uBAAqB;AAAA,UAChD;AAAA,wDAAC,qBAAM,OAAN;AAAA,cAAY,SAAQ;AAAA,cAAK,OAAK;AAAA,cAC7B,sDAAC,qBAAM,UAAN,EAAe;AAAA,aAClB;AAAA,YACA,4CAAC,qBAAM,SAAN,EAAc;AAAA;AAAA,SACjB;AAAA,OACF;AAAA,MAEA,6CAAC,sBAAO,QAAP;AAAA,QACC;AAAA,sDAAC,sBAAO,SAAP;AAAA,YAEC,WAAU;AAAA,YACV,GAAG;AAAA,YACH,YAAY,EAAE,GAAG,EAAE;AAAA,YACnB,WAAW,EAAE,GAAG,EAAE;AAAA,aAJd,SAKN;AAAA,UAEA,6CAAC,sBAAO,SAAP;AAAA,YACC,UAAQ;AAAA,YACR,SAAO;AAAA,YAEP,WAAW;AAAA,cACT;AAAA,cACA;AAAA,gBACE,SAAS;AAAA,kBACP,mBAAmB;AAAA,gBACrB;AAAA,cACF;AAAA,YACF;AAAA,YACA,YAAY,EAAE,GAAG,GAAG,GAAG,KAAK,SAAS,GAAG,OAAO,IAAI;AAAA,YACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK;AAAA,YAClD,OAAK;AAAA,YAEL;AAAA,0DAAC,sBAAO,OAAP;AAAA,gBAAa;AAAA,eAAY;AAAA,cAC1B,4CAAC,sBAAO,aAAP;AAAA,gBAAmB;AAAA,eAEpB;AAAA,cACA,6CAAC;AAAA,gBAAS,OAAM;AAAA,gBAAK,YAAU;AAAA,gBAC7B;AAAA,8DAAC;AAAA,oBAAM,GAAG;AAAA,oBAAK,gBAAe;AAAA,oBAAW,SAAQ;AAAA,oBAAO;AAAA,mBAExD;AAAA,kBACA,4CAAC;AAAA,oBAAM,GAAG;AAAA,oBAAG,IAAG;AAAA,oBAAO,cAAa;AAAA,mBAAe;AAAA;AAAA,eACrD;AAAA,cACA,6CAAC;AAAA,gBAAS,OAAM;AAAA,gBAAK,YAAU;AAAA,gBAC7B;AAAA,8DAAC;AAAA,oBAAM,GAAG;AAAA,oBAAK,gBAAe;AAAA,oBAAW,SAAQ;AAAA,oBAAW;AAAA,mBAE5D;AAAA,kBACA,4CAAC,gCAAW;AAAA;AAAA,eACd;AAAA,cAEA,4CAAC;AAAA,gBAAO,IAAG;AAAA,gBAAW,IAAG;AAAA,gBACvB,sDAAC,sBAAO,OAAP;AAAA,kBAAa,oBAAkB;AAAA,kBAAC,SAAO;AAAA,kBACtC,sDAAC;AAAA,oBAAO,OAAM;AAAA,oBAAO,cAAW;AAAA,oBAAQ;AAAA,mBAExC;AAAA,iBACF;AAAA,eACF;AAAA,cAEA,4CAAC;AAAA,gBACC,sDAAC,sBAAO,OAAP;AAAA,kBAAa,SAAO;AAAA,kBACnB,sDAAC;AAAA,oBAAO,KAAI;AAAA,oBAAW,GAAE;AAAA,oBAAK,GAAE;AAAA,oBAAK,MAAK;AAAA,oBAAK,UAAQ;AAAA,oBAAC,MAAM;AAAA,mBAAG;AAAA,iBACnE;AAAA,eACF;AAAA;AAAA,aA1CI,SA2CN;AAAA;AAAA,OACF;AAAA;AAAA,GACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -23,11 +23,12 @@ __export(LinearGradientDemo_exports, {
|
|
|
23
23
|
module.exports = __toCommonJS(LinearGradientDemo_exports);
|
|
24
24
|
var import_jsx_runtime = require("react/jsx-runtime");
|
|
25
25
|
var import_tamagui = require("tamagui");
|
|
26
|
+
var import_linear_gradient = require("tamagui/linear-gradient");
|
|
26
27
|
function LinearGradientDemo() {
|
|
27
28
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
|
|
28
29
|
space: true,
|
|
29
30
|
children: [
|
|
30
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
31
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_linear_gradient.LinearGradient, {
|
|
31
32
|
width: "$6",
|
|
32
33
|
height: "$6",
|
|
33
34
|
br: "$4",
|
|
@@ -35,7 +36,7 @@ function LinearGradientDemo() {
|
|
|
35
36
|
start: [0, 1],
|
|
36
37
|
end: [0, 0]
|
|
37
38
|
}),
|
|
38
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
39
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_linear_gradient.LinearGradient, {
|
|
39
40
|
width: "$6",
|
|
40
41
|
height: "$6",
|
|
41
42
|
br: "$4",
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/LinearGradientDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKI;
|
|
4
|
+
"sourcesContent": ["import { XStack } from 'tamagui'\nimport { LinearGradient } from 'tamagui/linear-gradient'\n\nexport function LinearGradientDemo() {\n return (\n <XStack space>\n {/* tokens */}\n <LinearGradient\n width=\"$6\"\n height=\"$6\"\n br=\"$4\"\n colors={['$red10', '$yellow10']}\n start={[0, 1]}\n end={[0, 0]}\n />\n\n {/* theme values */}\n <LinearGradient\n width=\"$6\"\n height=\"$6\"\n br=\"$4\"\n colors={['$background', '$color']}\n start={[1, 1]}\n end={[0, 0]}\n />\n </XStack>\n )\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAKI;AALJ,qBAAuB;AACvB,6BAA+B;AAExB,SAAS,qBAAqB;AACnC,SACE,6CAAC;AAAA,IAAO,OAAK;AAAA,IAEX;AAAA,kDAAC;AAAA,QACC,OAAM;AAAA,QACN,QAAO;AAAA,QACP,IAAG;AAAA,QACH,QAAQ,CAAC,UAAU,WAAW;AAAA,QAC9B,OAAO,CAAC,GAAG,CAAC;AAAA,QACZ,KAAK,CAAC,GAAG,CAAC;AAAA,OACZ;AAAA,MAGA,4CAAC;AAAA,QACC,OAAM;AAAA,QACN,QAAO;AAAA,QACP,IAAG;AAAA,QACH,QAAQ,CAAC,eAAe,QAAQ;AAAA,QAChC,OAAO,CAAC,GAAG,CAAC;AAAA,QACZ,KAAK,CAAC,GAAG,CAAC;AAAA,OACZ;AAAA;AAAA,GACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/cjs/SelectDemo.js
CHANGED
|
@@ -25,6 +25,7 @@ var import_jsx_runtime = require("react/jsx-runtime");
|
|
|
25
25
|
var import_lucide_icons = require("@tamagui/lucide-icons");
|
|
26
26
|
var import_react = require("react");
|
|
27
27
|
var import_tamagui = require("tamagui");
|
|
28
|
+
var import_linear_gradient = require("tamagui/linear-gradient");
|
|
28
29
|
function SelectDemo() {
|
|
29
30
|
const [val, setVal] = (0, import_react.useState)("apple");
|
|
30
31
|
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Select, {
|
|
@@ -71,7 +72,7 @@ function SelectDemo() {
|
|
|
71
72
|
size: 20
|
|
72
73
|
})
|
|
73
74
|
}),
|
|
74
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
75
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_linear_gradient.LinearGradient, {
|
|
75
76
|
start: [0, 0],
|
|
76
77
|
end: [0, 1],
|
|
77
78
|
fullscreen: true,
|
|
@@ -83,6 +84,7 @@ function SelectDemo() {
|
|
|
83
84
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Select.Viewport, {
|
|
84
85
|
minWidth: 200,
|
|
85
86
|
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Select.Group, {
|
|
87
|
+
space: "$-0",
|
|
86
88
|
children: [
|
|
87
89
|
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Select.Label, {
|
|
88
90
|
children: "Fruits"
|
|
@@ -120,7 +122,7 @@ function SelectDemo() {
|
|
|
120
122
|
size: 20
|
|
121
123
|
})
|
|
122
124
|
}),
|
|
123
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
125
|
+
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_linear_gradient.LinearGradient, {
|
|
124
126
|
start: [0, 0],
|
|
125
127
|
end: [0, 1],
|
|
126
128
|
fullscreen: true,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SelectDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'\nimport { useState } from 'react'\nimport { Adapt,
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;
|
|
4
|
+
"sourcesContent": ["import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'\nimport { useState } from 'react'\nimport { Adapt, Select, Sheet, YStack } from 'tamagui'\nimport { LinearGradient } from 'tamagui/linear-gradient'\n\nexport function SelectDemo() {\n const [val, setVal] = useState('apple')\n return (\n <Select id=\"food\" value={val} onValueChange={setVal}>\n <Select.Trigger w={180} iconAfter={ChevronDown}>\n <Select.Value placeholder=\"Something\" />\n </Select.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet modal dismissOnSnapToBottom>\n <Sheet.Frame>\n <Sheet.ScrollView>\n <Adapt.Contents />\n </Sheet.ScrollView>\n </Sheet.Frame>\n <Sheet.Overlay />\n </Sheet>\n </Adapt>\n\n <Select.Content zIndex={200000}>\n <Select.ScrollUpButton ai=\"center\" jc=\"center\" pos=\"relative\" w=\"100%\" h=\"$3\">\n <YStack zi={10}>\n <ChevronUp size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$background', '$backgroundTransparent']}\n br=\"$4\"\n />\n </Select.ScrollUpButton>\n\n <Select.Viewport minWidth={200}>\n <Select.Group space=\"$-0\">\n <Select.Label>Fruits</Select.Label>\n {items.map((item, i) => {\n return (\n <Select.Item index={i} key={item.name} value={item.name.toLowerCase()}>\n <Select.ItemText>{item.name}</Select.ItemText>\n <Select.ItemIndicator ml=\"auto\">\n <Check size={16} />\n </Select.ItemIndicator>\n </Select.Item>\n )\n })}\n </Select.Group>\n </Select.Viewport>\n\n <Select.ScrollDownButton ai=\"center\" jc=\"center\" pos=\"relative\" w=\"100%\" h=\"$3\">\n <YStack zi={10}>\n <ChevronDown size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$backgroundTransparent', '$background']}\n br=\"$4\"\n />\n </Select.ScrollDownButton>\n </Select.Content>\n </Select>\n )\n}\n\nconst items = [\n { name: 'Apple' },\n { name: 'Pear' },\n { name: 'Blackberry' },\n { name: 'Peach' },\n { name: 'Apricot' },\n { name: 'Melon' },\n { name: 'Honeydew' },\n { name: 'Starfruit' },\n { name: 'Blueberry' },\n { name: 'Rasberry' },\n { name: 'Strawberry' },\n { name: 'Mango' },\n { name: 'Pineapple' },\n { name: 'Lime' },\n { name: 'Lemon' },\n { name: 'Coconut' },\n { name: 'Guava' },\n { name: 'Papaya' },\n { name: 'Orange' },\n { name: 'Grape' },\n { name: 'Jackfruit' },\n { name: 'Durian' },\n]\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DialogDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Dialog,\n Fieldset,\n H2,\n Input,\n Label,\n Sheet,\n Unspaced,\n YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n return (\n <Dialog modal>\n <Dialog.Trigger asChild>\n <Button>Edit Profile</Button>\n </Dialog.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet zIndex={
|
|
5
|
-
"mappings": "AAoBQ,cAIA,YAJA;AApBR,SAAS,SAAS;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,kBAAkB;AAEpB,SAAS,aAAa;AAC3B,SACE,qBAAC;AAAA,IAAO,OAAK;AAAA,IACX;AAAA,0BAAC,OAAO,SAAP;AAAA,QAAe,SAAO;AAAA,QACrB,8BAAC;AAAA,UAAO;AAAA,SAAY;AAAA,OACtB;AAAA,MAEA,oBAAC;AAAA,QAAM,MAAK;AAAA,QAAK,UAAS;AAAA,QACxB,+BAAC;AAAA,UAAM,QAAQ;AAAA,
|
|
4
|
+
"sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Dialog,\n Fieldset,\n H2,\n Input,\n Label,\n Sheet,\n Unspaced,\n YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n return (\n <Dialog modal>\n <Dialog.Trigger asChild>\n <Button>Edit Profile</Button>\n </Dialog.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n <Sheet.Frame padding=\"$4\" space>\n <Adapt.Contents />\n </Sheet.Frame>\n <Sheet.Overlay />\n </Sheet>\n </Adapt>\n\n <Dialog.Portal>\n <Dialog.Overlay\n key=\"overlay\"\n animation=\"quick\"\n o={0.5}\n enterStyle={{ o: 0 }}\n exitStyle={{ o: 0 }}\n />\n\n <Dialog.Content\n bordered\n elevate\n key=\"content\"\n animation={[\n 'quick',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n space\n >\n <Dialog.Title>Edit profile</Dialog.Title>\n <Dialog.Description>\n Make changes to your profile here. Click save when you're done.\n </Dialog.Description>\n <Fieldset space=\"$4\" horizontal>\n <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n Name\n </Label>\n <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n </Fieldset>\n <Fieldset space=\"$4\" horizontal>\n <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n Food\n </Label>\n <SelectDemo />\n </Fieldset>\n\n <YStack ai=\"flex-end\" mt=\"$2\">\n <Dialog.Close displayWhenAdapted asChild>\n <Button theme=\"alt1\" aria-label=\"Close\">\n Save changes\n </Button>\n </Dialog.Close>\n </YStack>\n\n <Unspaced>\n <Dialog.Close asChild>\n <Button pos=\"absolute\" t=\"$2\" r=\"$2\" size=\"$3\" circular icon={X} />\n </Dialog.Close>\n </Unspaced>\n </Dialog.Content>\n </Dialog.Portal>\n </Dialog>\n )\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
|
-
import {
|
|
2
|
+
import { XStack } from "tamagui";
|
|
3
|
+
import { LinearGradient } from "tamagui/linear-gradient";
|
|
3
4
|
function LinearGradientDemo() {
|
|
4
5
|
return /* @__PURE__ */ jsxs(XStack, {
|
|
5
6
|
space: true,
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/LinearGradientDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import
|
|
5
|
-
"mappings": "AAKI,SAEE,KAFF;
|
|
4
|
+
"sourcesContent": ["import { XStack } from 'tamagui'\nimport { LinearGradient } from 'tamagui/linear-gradient'\n\nexport function LinearGradientDemo() {\n return (\n <XStack space>\n {/* tokens */}\n <LinearGradient\n width=\"$6\"\n height=\"$6\"\n br=\"$4\"\n colors={['$red10', '$yellow10']}\n start={[0, 1]}\n end={[0, 0]}\n />\n\n {/* theme values */}\n <LinearGradient\n width=\"$6\"\n height=\"$6\"\n br=\"$4\"\n colors={['$background', '$color']}\n start={[1, 1]}\n end={[0, 0]}\n />\n </XStack>\n )\n}\n"],
|
|
5
|
+
"mappings": "AAKI,SAEE,KAFF;AALJ,SAAS,cAAc;AACvB,SAAS,sBAAsB;AAExB,SAAS,qBAAqB;AACnC,SACE,qBAAC;AAAA,IAAO,OAAK;AAAA,IAEX;AAAA,0BAAC;AAAA,QACC,OAAM;AAAA,QACN,QAAO;AAAA,QACP,IAAG;AAAA,QACH,QAAQ,CAAC,UAAU,WAAW;AAAA,QAC9B,OAAO,CAAC,GAAG,CAAC;AAAA,QACZ,KAAK,CAAC,GAAG,CAAC;AAAA,OACZ;AAAA,MAGA,oBAAC;AAAA,QACC,OAAM;AAAA,QACN,QAAO;AAAA,QACP,IAAG;AAAA,QACH,QAAQ,CAAC,eAAe,QAAQ;AAAA,QAChC,OAAO,CAAC,GAAG,CAAC;AAAA,QACZ,KAAK,CAAC,GAAG,CAAC;AAAA,OACZ;AAAA;AAAA,GACF;AAEJ;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/esm/SelectDemo.js
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { Check, ChevronDown, ChevronUp } from "@tamagui/lucide-icons";
|
|
3
3
|
import { useState } from "react";
|
|
4
|
-
import { Adapt,
|
|
4
|
+
import { Adapt, Select, Sheet, YStack } from "tamagui";
|
|
5
|
+
import { LinearGradient } from "tamagui/linear-gradient";
|
|
5
6
|
function SelectDemo() {
|
|
6
7
|
const [val, setVal] = useState("apple");
|
|
7
8
|
return /* @__PURE__ */ jsxs(Select, {
|
|
@@ -60,6 +61,7 @@ function SelectDemo() {
|
|
|
60
61
|
/* @__PURE__ */ jsx(Select.Viewport, {
|
|
61
62
|
minWidth: 200,
|
|
62
63
|
children: /* @__PURE__ */ jsxs(Select.Group, {
|
|
64
|
+
space: "$-0",
|
|
63
65
|
children: [
|
|
64
66
|
/* @__PURE__ */ jsx(Select.Label, {
|
|
65
67
|
children: "Fruits"
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SelectDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'\nimport { useState } from 'react'\nimport { Adapt,
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'\nimport { useState } from 'react'\nimport { Adapt, Select, Sheet, YStack } from 'tamagui'\nimport { LinearGradient } from 'tamagui/linear-gradient'\n\nexport function SelectDemo() {\n const [val, setVal] = useState('apple')\n return (\n <Select id=\"food\" value={val} onValueChange={setVal}>\n <Select.Trigger w={180} iconAfter={ChevronDown}>\n <Select.Value placeholder=\"Something\" />\n </Select.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet modal dismissOnSnapToBottom>\n <Sheet.Frame>\n <Sheet.ScrollView>\n <Adapt.Contents />\n </Sheet.ScrollView>\n </Sheet.Frame>\n <Sheet.Overlay />\n </Sheet>\n </Adapt>\n\n <Select.Content zIndex={200000}>\n <Select.ScrollUpButton ai=\"center\" jc=\"center\" pos=\"relative\" w=\"100%\" h=\"$3\">\n <YStack zi={10}>\n <ChevronUp size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$background', '$backgroundTransparent']}\n br=\"$4\"\n />\n </Select.ScrollUpButton>\n\n <Select.Viewport minWidth={200}>\n <Select.Group space=\"$-0\">\n <Select.Label>Fruits</Select.Label>\n {items.map((item, i) => {\n return (\n <Select.Item index={i} key={item.name} value={item.name.toLowerCase()}>\n <Select.ItemText>{item.name}</Select.ItemText>\n <Select.ItemIndicator ml=\"auto\">\n <Check size={16} />\n </Select.ItemIndicator>\n </Select.Item>\n )\n })}\n </Select.Group>\n </Select.Viewport>\n\n <Select.ScrollDownButton ai=\"center\" jc=\"center\" pos=\"relative\" w=\"100%\" h=\"$3\">\n <YStack zi={10}>\n <ChevronDown size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$backgroundTransparent', '$background']}\n br=\"$4\"\n />\n </Select.ScrollDownButton>\n </Select.Content>\n </Select>\n )\n}\n\nconst items = [\n { name: 'Apple' },\n { name: 'Pear' },\n { name: 'Blackberry' },\n { name: 'Peach' },\n { name: 'Apricot' },\n { name: 'Melon' },\n { name: 'Honeydew' },\n { name: 'Starfruit' },\n { name: 'Blueberry' },\n { name: 'Rasberry' },\n { name: 'Strawberry' },\n { name: 'Mango' },\n { name: 'Pineapple' },\n { name: 'Lime' },\n { name: 'Lemon' },\n { name: 'Coconut' },\n { name: 'Guava' },\n { name: 'Papaya' },\n { name: 'Orange' },\n { name: 'Grape' },\n { name: 'Jackfruit' },\n { name: 'Durian' },\n]\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/DialogDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Dialog,\n Fieldset,\n H2,\n Input,\n Label,\n Sheet,\n Unspaced,\n YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n return (\n <Dialog modal>\n <Dialog.Trigger asChild>\n <Button>Edit Profile</Button>\n </Dialog.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet zIndex={
|
|
5
|
-
"mappings": "AAAA,SAAS,SAAS;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,kBAAkB;AAEpB,SAAS,aAAa;AAC3B,SACE,CAAC,OAAO;AAAA,IACN,CAAC,OAAO,QAAQ,QACd,CAAC,OAAO,YAAY,EAAnB,OACH,EAFC,OAAO;AAAA,IAIR,CAAC,MAAM,KAAK,KAAK,SAAS,QACxB,CAAC,MAAM,QAAQ,
|
|
4
|
+
"sourcesContent": ["import { X } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Dialog,\n Fieldset,\n H2,\n Input,\n Label,\n Sheet,\n Unspaced,\n YStack,\n} from 'tamagui'\n\nimport { SelectDemo } from './SelectDemo'\n\nexport function DialogDemo() {\n return (\n <Dialog modal>\n <Dialog.Trigger asChild>\n <Button>Edit Profile</Button>\n </Dialog.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet zIndex={200000} modal dismissOnSnapToBottom>\n <Sheet.Frame padding=\"$4\" space>\n <Adapt.Contents />\n </Sheet.Frame>\n <Sheet.Overlay />\n </Sheet>\n </Adapt>\n\n <Dialog.Portal>\n <Dialog.Overlay\n key=\"overlay\"\n animation=\"quick\"\n o={0.5}\n enterStyle={{ o: 0 }}\n exitStyle={{ o: 0 }}\n />\n\n <Dialog.Content\n bordered\n elevate\n key=\"content\"\n animation={[\n 'quick',\n {\n opacity: {\n overshootClamping: true,\n },\n },\n ]}\n enterStyle={{ x: 0, y: -20, opacity: 0, scale: 0.9 }}\n exitStyle={{ x: 0, y: 10, opacity: 0, scale: 0.95 }}\n space\n >\n <Dialog.Title>Edit profile</Dialog.Title>\n <Dialog.Description>\n Make changes to your profile here. Click save when you're done.\n </Dialog.Description>\n <Fieldset space=\"$4\" horizontal>\n <Label w={160} justifyContent=\"flex-end\" htmlFor=\"name\">\n Name\n </Label>\n <Input f={1} id=\"name\" defaultValue=\"Nate Wienert\" />\n </Fieldset>\n <Fieldset space=\"$4\" horizontal>\n <Label w={160} justifyContent=\"flex-end\" htmlFor=\"username\">\n Food\n </Label>\n <SelectDemo />\n </Fieldset>\n\n <YStack ai=\"flex-end\" mt=\"$2\">\n <Dialog.Close displayWhenAdapted asChild>\n <Button theme=\"alt1\" aria-label=\"Close\">\n Save changes\n </Button>\n </Dialog.Close>\n </YStack>\n\n <Unspaced>\n <Dialog.Close asChild>\n <Button pos=\"absolute\" t=\"$2\" r=\"$2\" size=\"$3\" circular icon={X} />\n </Dialog.Close>\n </Unspaced>\n </Dialog.Content>\n </Dialog.Portal>\n </Dialog>\n )\n}\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,SAAS;AAClB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAEA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAEP,SAAS,kBAAkB;AAEpB,SAAS,aAAa;AAC3B,SACE,CAAC,OAAO;AAAA,IACN,CAAC,OAAO,QAAQ,QACd,CAAC,OAAO,YAAY,EAAnB,OACH,EAFC,OAAO;AAAA,IAIR,CAAC,MAAM,KAAK,KAAK,SAAS,QACxB,CAAC,MAAM,QAAQ,KAAQ,MAAM;AAAA,MAC3B,CAAC,MAAM,MAAM,QAAQ,KAAK,MACxB,CAAC,MAAM,SAAS,EAClB,EAFC,MAAM;AAAA,MAGP,CAAC,MAAM,QAAQ;AAAA,IACjB,EALC,MAMH,EAPC;AAAA,IASD,CAAC,OAAO;AAAA,MACN,CAAC,OAAO,QACN,IAAI,UACJ,UAAU,QACV,GAAG,KACH,YAAY,EAAE,GAAG,EAAE,GACnB,WAAW,EAAE,GAAG,EAAE,GACpB;AAAA,MAEA,CAAC,OAAO,QACN,SACA,QACA,IAAI,UACJ,WAAW;AAAA,QACT;AAAA,QACA;AAAA,UACE,SAAS;AAAA,YACP,mBAAmB;AAAA,UACrB;AAAA,QACF;AAAA,MACF,GACA,YAAY,EAAE,GAAG,GAAG,GAAG,KAAK,SAAS,GAAG,OAAO,IAAI,GACnD,WAAW,EAAE,GAAG,GAAG,GAAG,IAAI,SAAS,GAAG,OAAO,KAAK,GAClD;AAAA,QAEA,CAAC,OAAO,MAAM,YAAY,EAAzB,OAAO;AAAA,QACR,CAAC,OAAO,YAAY,+DAEpB,EAFC,OAAO;AAAA,QAGR,CAAC,SAAS,MAAM,KAAK;AAAA,UACnB,CAAC,MAAM,GAAG,KAAK,eAAe,WAAW,QAAQ,OAAO,IAExD,EAFC;AAAA,UAGD,CAAC,MAAM,GAAG,GAAG,GAAG,OAAO,aAAa,eAAe;AAAA,QACrD,EALC;AAAA,QAMD,CAAC,SAAS,MAAM,KAAK;AAAA,UACnB,CAAC,MAAM,GAAG,KAAK,eAAe,WAAW,QAAQ,WAAW,IAE5D,EAFC;AAAA,UAGD,CAAC,WAAW;AAAA,QACd,EALC;AAAA,QAOD,CAAC,OAAO,GAAG,WAAW,GAAG,KACvB,CAAC,OAAO,MAAM,mBAAmB,QAC/B,CAAC,OAAO,MAAM,OAAO,WAAW,QAAQ,YAExC,EAFC,OAGH,EAJC,OAAO,MAKV,EANC;AAAA,QAQD,CAAC,SACC,CAAC,OAAO,MAAM,QACZ,CAAC,OAAO,IAAI,WAAW,EAAE,KAAK,EAAE,KAAK,KAAK,KAAK,SAAS,MAAM,GAAG,EACnE,EAFC,OAAO,MAGV,EAJC;AAAA,MAKH,EA9CC,OAAO;AAAA,IA+CV,EAxDC,OAAO;AAAA,EAyDV,EAvEC;AAyEL;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { XStack } from "tamagui";
|
|
2
|
+
import { LinearGradient } from "tamagui/linear-gradient";
|
|
2
3
|
function LinearGradientDemo() {
|
|
3
4
|
return <XStack space>
|
|
4
5
|
<LinearGradient width="$6" height="$6" br="$4" colors={["$red10", "$yellow10"]} start={[0, 1]} end={[0, 0]} />
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/LinearGradientDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { XStack } from 'tamagui'\nimport { LinearGradient } from 'tamagui/linear-gradient'\n\nexport function LinearGradientDemo() {\n return (\n <XStack space>\n {/* tokens */}\n <LinearGradient\n width=\"$6\"\n height=\"$6\"\n br=\"$4\"\n colors={['$red10', '$yellow10']}\n start={[0, 1]}\n end={[0, 0]}\n />\n\n {/* theme values */}\n <LinearGradient\n width=\"$6\"\n height=\"$6\"\n br=\"$4\"\n colors={['$background', '$color']}\n start={[1, 1]}\n end={[0, 0]}\n />\n </XStack>\n )\n}\n"],
|
|
5
|
+
"mappings": "AAAA,SAAS,cAAc;AACvB,SAAS,sBAAsB;AAExB,SAAS,qBAAqB;AACnC,SACE,CAAC,OAAO;AAAA,IAEN,CAAC,eACC,MAAM,KACN,OAAO,KACP,GAAG,KACH,QAAQ,CAAC,UAAU,WAAW,GAC9B,OAAO,CAAC,GAAG,CAAC,GACZ,KAAK,CAAC,GAAG,CAAC,GACZ;AAAA,IAGA,CAAC,eACC,MAAM,KACN,OAAO,KACP,GAAG,KACH,QAAQ,CAAC,eAAe,QAAQ,GAChC,OAAO,CAAC,GAAG,CAAC,GACZ,KAAK,CAAC,GAAG,CAAC,GACZ;AAAA,EACF,EApBC;AAsBL;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/dist/jsx/SelectDemo.js
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Check, ChevronDown, ChevronUp } from "@tamagui/lucide-icons";
|
|
2
2
|
import { useState } from "react";
|
|
3
|
-
import { Adapt,
|
|
3
|
+
import { Adapt, Select, Sheet, YStack } from "tamagui";
|
|
4
|
+
import { LinearGradient } from "tamagui/linear-gradient";
|
|
4
5
|
function SelectDemo() {
|
|
5
6
|
const [val, setVal] = useState("apple");
|
|
6
7
|
return <Select id="food" value={val} onValueChange={setVal}>
|
|
@@ -14,7 +15,7 @@ function SelectDemo() {
|
|
|
14
15
|
<YStack zi={10}><ChevronUp size={20} /></YStack>
|
|
15
16
|
<LinearGradient start={[0, 0]} end={[0, 1]} fullscreen colors={["$background", "$backgroundTransparent"]} br="$4" />
|
|
16
17
|
</Select.ScrollUpButton>
|
|
17
|
-
<Select.Viewport minWidth={200}><Select.Group>
|
|
18
|
+
<Select.Viewport minWidth={200}><Select.Group space="$-0">
|
|
18
19
|
<Select.Label>Fruits</Select.Label>
|
|
19
20
|
{items.map((item, i) => {
|
|
20
21
|
return <Select.Item index={i} key={item.name} value={item.name.toLowerCase()}>
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../src/SelectDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'\nimport { useState } from 'react'\nimport { Adapt,
|
|
5
|
-
"mappings": "AAAA,SAAS,OAAO,aAAa,iBAAiB;AAC9C,SAAS,gBAAgB;AACzB,SAAS,OAAO,
|
|
4
|
+
"sourcesContent": ["import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'\nimport { useState } from 'react'\nimport { Adapt, Select, Sheet, YStack } from 'tamagui'\nimport { LinearGradient } from 'tamagui/linear-gradient'\n\nexport function SelectDemo() {\n const [val, setVal] = useState('apple')\n return (\n <Select id=\"food\" value={val} onValueChange={setVal}>\n <Select.Trigger w={180} iconAfter={ChevronDown}>\n <Select.Value placeholder=\"Something\" />\n </Select.Trigger>\n\n <Adapt when=\"sm\" platform=\"touch\">\n <Sheet modal dismissOnSnapToBottom>\n <Sheet.Frame>\n <Sheet.ScrollView>\n <Adapt.Contents />\n </Sheet.ScrollView>\n </Sheet.Frame>\n <Sheet.Overlay />\n </Sheet>\n </Adapt>\n\n <Select.Content zIndex={200000}>\n <Select.ScrollUpButton ai=\"center\" jc=\"center\" pos=\"relative\" w=\"100%\" h=\"$3\">\n <YStack zi={10}>\n <ChevronUp size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$background', '$backgroundTransparent']}\n br=\"$4\"\n />\n </Select.ScrollUpButton>\n\n <Select.Viewport minWidth={200}>\n <Select.Group space=\"$-0\">\n <Select.Label>Fruits</Select.Label>\n {items.map((item, i) => {\n return (\n <Select.Item index={i} key={item.name} value={item.name.toLowerCase()}>\n <Select.ItemText>{item.name}</Select.ItemText>\n <Select.ItemIndicator ml=\"auto\">\n <Check size={16} />\n </Select.ItemIndicator>\n </Select.Item>\n )\n })}\n </Select.Group>\n </Select.Viewport>\n\n <Select.ScrollDownButton ai=\"center\" jc=\"center\" pos=\"relative\" w=\"100%\" h=\"$3\">\n <YStack zi={10}>\n <ChevronDown size={20} />\n </YStack>\n <LinearGradient\n start={[0, 0]}\n end={[0, 1]}\n fullscreen\n colors={['$backgroundTransparent', '$background']}\n br=\"$4\"\n />\n </Select.ScrollDownButton>\n </Select.Content>\n </Select>\n )\n}\n\nconst items = [\n { name: 'Apple' },\n { name: 'Pear' },\n { name: 'Blackberry' },\n { name: 'Peach' },\n { name: 'Apricot' },\n { name: 'Melon' },\n { name: 'Honeydew' },\n { name: 'Starfruit' },\n { name: 'Blueberry' },\n { name: 'Rasberry' },\n { name: 'Strawberry' },\n { name: 'Mango' },\n { name: 'Pineapple' },\n { name: 'Lime' },\n { name: 'Lemon' },\n { name: 'Coconut' },\n { name: 'Guava' },\n { name: 'Papaya' },\n { name: 'Orange' },\n { name: 'Grape' },\n { name: 'Jackfruit' },\n { name: 'Durian' },\n]\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@tamagui/demos",
|
|
3
|
-
"version": "1.0
|
|
3
|
+
"version": "1.1.0",
|
|
4
4
|
"sideEffects": [
|
|
5
5
|
"*.css"
|
|
6
6
|
],
|
|
@@ -23,32 +23,33 @@
|
|
|
23
23
|
"./package.json": "./package.json",
|
|
24
24
|
"./photo/*": "./public/*.jpg",
|
|
25
25
|
".": {
|
|
26
|
+
"types": "./types/index.d.ts",
|
|
26
27
|
"import": "./dist/esm/index.js",
|
|
27
28
|
"require": "./dist/cjs/index.js"
|
|
28
29
|
}
|
|
29
30
|
},
|
|
30
31
|
"dependencies": {
|
|
31
|
-
"@tamagui/avatar": "^1.0
|
|
32
|
-
"@tamagui/button": "^1.0
|
|
33
|
-
"@tamagui/config-base": "^1.0
|
|
34
|
-
"@tamagui/core": "^1.0
|
|
35
|
-
"@tamagui/list-item": "^1.0
|
|
36
|
-
"@tamagui/logo": "^1.0
|
|
37
|
-
"@tamagui/menu": "^1.0
|
|
38
|
-
"@tamagui/popover": "^1.0
|
|
39
|
-
"@tamagui/progress": "^1.0
|
|
40
|
-
"@tamagui/select": "^1.0
|
|
41
|
-
"@tamagui/sheet": "^1.0
|
|
42
|
-
"@tamagui/slider": "^1.0
|
|
43
|
-
"@tamagui/stacks": "^1.0
|
|
44
|
-
"tamagui": "^1.0
|
|
32
|
+
"@tamagui/avatar": "^1.1.0",
|
|
33
|
+
"@tamagui/button": "^1.1.0",
|
|
34
|
+
"@tamagui/config-base": "^1.1.0",
|
|
35
|
+
"@tamagui/core": "^1.1.0",
|
|
36
|
+
"@tamagui/list-item": "^1.1.0",
|
|
37
|
+
"@tamagui/logo": "^1.1.0",
|
|
38
|
+
"@tamagui/menu": "^1.1.0",
|
|
39
|
+
"@tamagui/popover": "^1.1.0",
|
|
40
|
+
"@tamagui/progress": "^1.1.0",
|
|
41
|
+
"@tamagui/select": "^1.1.0",
|
|
42
|
+
"@tamagui/sheet": "^1.1.0",
|
|
43
|
+
"@tamagui/slider": "^1.1.0",
|
|
44
|
+
"@tamagui/stacks": "^1.1.0",
|
|
45
|
+
"tamagui": "^1.1.0"
|
|
45
46
|
},
|
|
46
47
|
"peerDependencies": {
|
|
47
48
|
"react": "*",
|
|
48
49
|
"react-dom": "*"
|
|
49
50
|
},
|
|
50
51
|
"devDependencies": {
|
|
51
|
-
"@tamagui/build": "^1.0
|
|
52
|
+
"@tamagui/build": "^1.1.0",
|
|
52
53
|
"react": "^18.2.0",
|
|
53
54
|
"react-dom": "^18.2.0"
|
|
54
55
|
},
|
package/src/DialogDemo.tsx
CHANGED
|
@@ -22,7 +22,7 @@ export function DialogDemo() {
|
|
|
22
22
|
</Dialog.Trigger>
|
|
23
23
|
|
|
24
24
|
<Adapt when="sm" platform="touch">
|
|
25
|
-
<Sheet zIndex={
|
|
25
|
+
<Sheet zIndex={200000} modal dismissOnSnapToBottom>
|
|
26
26
|
<Sheet.Frame padding="$4" space>
|
|
27
27
|
<Adapt.Contents />
|
|
28
28
|
</Sheet.Frame>
|
package/src/SelectDemo.tsx
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { Check, ChevronDown, ChevronUp } from '@tamagui/lucide-icons'
|
|
2
2
|
import { useState } from 'react'
|
|
3
|
-
import { Adapt,
|
|
3
|
+
import { Adapt, Select, Sheet, YStack } from 'tamagui'
|
|
4
|
+
import { LinearGradient } from 'tamagui/linear-gradient'
|
|
4
5
|
|
|
5
6
|
export function SelectDemo() {
|
|
6
7
|
const [val, setVal] = useState('apple')
|
|
@@ -21,7 +22,7 @@ export function SelectDemo() {
|
|
|
21
22
|
</Sheet>
|
|
22
23
|
</Adapt>
|
|
23
24
|
|
|
24
|
-
<Select.Content zIndex={
|
|
25
|
+
<Select.Content zIndex={200000}>
|
|
25
26
|
<Select.ScrollUpButton ai="center" jc="center" pos="relative" w="100%" h="$3">
|
|
26
27
|
<YStack zi={10}>
|
|
27
28
|
<ChevronUp size={20} />
|
|
@@ -36,7 +37,7 @@ export function SelectDemo() {
|
|
|
36
37
|
</Select.ScrollUpButton>
|
|
37
38
|
|
|
38
39
|
<Select.Viewport minWidth={200}>
|
|
39
|
-
<Select.Group>
|
|
40
|
+
<Select.Group space="$-0">
|
|
40
41
|
<Select.Label>Fruits</Select.Label>
|
|
41
42
|
{items.map((item, i) => {
|
|
42
43
|
return (
|