@tamagui/demos 1.15.24 → 1.15.26
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/CardDemo.js +1 -1
- package/dist/cjs/CardDemo.js.map +1 -1
- package/dist/cjs/ColorsDemo.js +1 -1
- package/dist/cjs/ColorsDemo.js.map +1 -1
- package/dist/cjs/InputsDemo.js +17 -6
- package/dist/cjs/InputsDemo.js.map +1 -1
- package/dist/cjs/LucideIconsDemo.js +27 -18
- package/dist/cjs/LucideIconsDemo.js.map +1 -1
- package/dist/cjs/ProgressDemo.js +32 -21
- package/dist/cjs/ProgressDemo.js.map +1 -1
- package/dist/cjs/ReplaceThemeDemo.js +65 -0
- package/dist/cjs/ReplaceThemeDemo.js.map +6 -0
- package/dist/cjs/StacksDemo.js +1 -1
- package/dist/cjs/StacksDemo.js.map +1 -1
- package/dist/cjs/TabsAdvancedDemo.js +12 -1
- package/dist/cjs/TabsAdvancedDemo.js.map +1 -1
- package/dist/cjs/UpdateThemeDemo.js +6 -2
- package/dist/cjs/UpdateThemeDemo.js.map +1 -1
- package/dist/cjs/index.js +3 -0
- package/dist/cjs/index.js.map +1 -1
- package/dist/esm/CardDemo.js +1 -1
- package/dist/esm/CardDemo.js.map +1 -1
- package/dist/esm/CardDemo.mjs +1 -1
- package/dist/esm/CardDemo.mjs.map +1 -1
- package/dist/esm/ColorsDemo.js +1 -1
- package/dist/esm/ColorsDemo.js.map +1 -1
- package/dist/esm/ColorsDemo.mjs +1 -1
- package/dist/esm/ColorsDemo.mjs.map +1 -1
- package/dist/esm/InputsDemo.js +17 -6
- package/dist/esm/InputsDemo.js.map +1 -1
- package/dist/esm/InputsDemo.mjs +17 -6
- package/dist/esm/InputsDemo.mjs.map +1 -1
- package/dist/esm/LucideIconsDemo.js +27 -18
- package/dist/esm/LucideIconsDemo.js.map +1 -1
- package/dist/esm/LucideIconsDemo.mjs +27 -18
- package/dist/esm/LucideIconsDemo.mjs.map +1 -1
- package/dist/esm/ProgressDemo.js +32 -21
- package/dist/esm/ProgressDemo.js.map +1 -1
- package/dist/esm/ProgressDemo.mjs +32 -21
- package/dist/esm/ProgressDemo.mjs.map +1 -1
- package/dist/esm/ReplaceThemeDemo.js +49 -0
- package/dist/esm/ReplaceThemeDemo.js.map +6 -0
- package/dist/esm/ReplaceThemeDemo.mjs +49 -0
- package/dist/esm/ReplaceThemeDemo.mjs.map +6 -0
- package/dist/esm/StacksDemo.js +1 -1
- package/dist/esm/StacksDemo.js.map +1 -1
- package/dist/esm/StacksDemo.mjs +1 -1
- package/dist/esm/StacksDemo.mjs.map +1 -1
- package/dist/esm/TabsAdvancedDemo.js +12 -1
- package/dist/esm/TabsAdvancedDemo.js.map +1 -1
- package/dist/esm/TabsAdvancedDemo.mjs +12 -1
- package/dist/esm/TabsAdvancedDemo.mjs.map +1 -1
- package/dist/esm/UpdateThemeDemo.js +7 -2
- package/dist/esm/UpdateThemeDemo.js.map +1 -1
- package/dist/esm/UpdateThemeDemo.mjs +7 -2
- package/dist/esm/UpdateThemeDemo.mjs.map +1 -1
- package/dist/esm/index.js +2 -0
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/index.mjs +2 -0
- package/dist/esm/index.mjs.map +1 -1
- package/dist/jsx/CardDemo.js +1 -1
- package/dist/jsx/CardDemo.js.map +1 -1
- package/dist/jsx/CardDemo.mjs +1 -1
- package/dist/jsx/CardDemo.mjs.map +1 -1
- package/dist/jsx/ColorsDemo.js +1 -1
- package/dist/jsx/ColorsDemo.js.map +1 -1
- package/dist/jsx/ColorsDemo.mjs +1 -1
- package/dist/jsx/ColorsDemo.mjs.map +1 -1
- package/dist/jsx/InputsDemo.js +8 -1
- package/dist/jsx/InputsDemo.js.map +1 -1
- package/dist/jsx/InputsDemo.mjs +8 -1
- package/dist/jsx/InputsDemo.mjs.map +1 -1
- package/dist/jsx/LucideIconsDemo.js +13 -8
- package/dist/jsx/LucideIconsDemo.js.map +1 -1
- package/dist/jsx/LucideIconsDemo.mjs +13 -8
- package/dist/jsx/LucideIconsDemo.mjs.map +1 -1
- package/dist/jsx/ProgressDemo.js +8 -1
- package/dist/jsx/ProgressDemo.js.map +1 -1
- package/dist/jsx/ProgressDemo.mjs +8 -1
- package/dist/jsx/ProgressDemo.mjs.map +1 -1
- package/dist/jsx/ReplaceThemeDemo.js +44 -0
- package/dist/jsx/ReplaceThemeDemo.js.map +6 -0
- package/dist/jsx/ReplaceThemeDemo.mjs +44 -0
- package/dist/jsx/ReplaceThemeDemo.mjs.map +6 -0
- package/dist/jsx/StacksDemo.js +1 -1
- package/dist/jsx/StacksDemo.js.map +1 -1
- package/dist/jsx/StacksDemo.mjs +1 -1
- package/dist/jsx/StacksDemo.mjs.map +1 -1
- package/dist/jsx/TabsAdvancedDemo.js +8 -1
- package/dist/jsx/TabsAdvancedDemo.js.map +1 -1
- package/dist/jsx/TabsAdvancedDemo.mjs +8 -1
- package/dist/jsx/TabsAdvancedDemo.mjs.map +1 -1
- package/dist/jsx/UpdateThemeDemo.js +7 -2
- package/dist/jsx/UpdateThemeDemo.js.map +1 -1
- package/dist/jsx/UpdateThemeDemo.mjs +7 -2
- package/dist/jsx/UpdateThemeDemo.mjs.map +1 -1
- package/dist/jsx/index.js +2 -0
- package/dist/jsx/index.js.map +1 -1
- package/dist/jsx/index.mjs +2 -0
- package/dist/jsx/index.mjs.map +1 -1
- package/package.json +18 -18
- package/src/CardDemo.tsx +1 -1
- package/src/ColorsDemo.tsx +2 -2
- package/src/InputsDemo.tsx +9 -2
- package/src/LucideIconsDemo.tsx +13 -8
- package/src/ProgressDemo.tsx +8 -1
- package/src/ReplaceThemeDemo.tsx +52 -0
- package/src/StacksDemo.tsx +1 -1
- package/src/TabsAdvancedDemo.tsx +8 -1
- package/src/UpdateThemeDemo.tsx +8 -3
- package/src/index.tsx +1 -0
- package/types/InputsDemo.d.ts.map +1 -1
- package/types/LucideIconsDemo.d.ts.map +1 -1
- package/types/ProgressDemo.d.ts.map +1 -1
- package/types/ReplaceThemeDemo.d.ts +3 -0
- package/types/ReplaceThemeDemo.d.ts.map +1 -0
- package/types/TabsAdvancedDemo.d.ts.map +1 -1
- package/types/UpdateThemeDemo.d.ts.map +1 -1
- package/types/index.d.ts +1 -0
- package/types/index.d.ts.map +1 -1
- package/dist/cjs/AccordionDemo.js +0 -42
- package/dist/cjs/AccordionDemo.js.map +0 -7
- package/dist/cjs/DrawerDemo.js +0 -79
- package/dist/cjs/DrawerDemo.js.map +0 -7
- package/dist/cjs/FeatherIconsDemo.js +0 -67
- package/dist/cjs/FeatherIconsDemo.js.map +0 -7
- package/dist/cjs/MenuDemo.js +0 -62
- package/dist/cjs/MenuDemo.js.map +0 -7
- package/dist/cjs/PopperDemo.js +0 -111
- package/dist/cjs/PopperDemo.js.map +0 -7
- package/dist/cjs/TabsAnimatedDemo.js +0 -167
- package/dist/cjs/TabsAnimatedDemo.js.map +0 -7
- package/dist/cjs/TabsHighlightedDemo.js +0 -184
- package/dist/cjs/TabsHighlightedDemo.js.map +0 -7
- package/dist/cjs/TabsUnderlinedDemo.js +0 -176
- package/dist/cjs/TabsUnderlinedDemo.js.map +0 -7
- package/dist/cjs/TamaguiLogo.js +0 -127
- package/dist/cjs/TamaguiLogo.js.map +0 -7
- package/dist/cjs/fixtures/zstack.js +0 -2
- package/dist/cjs/fixtures/zstack.js.map +0 -7
- package/dist/cjs/snapshots/zstack.js +0 -48
- package/dist/cjs/snapshots/zstack.js.map +0 -7
- package/dist/cjs/tests/zstack.js +0 -48
- package/dist/cjs/tests/zstack.js.map +0 -7
- package/dist/esm/AccordionDemo.js +0 -18
- package/dist/esm/AccordionDemo.js.map +0 -7
- package/dist/esm/AccordionDemo.mjs +0 -18
- package/dist/esm/AccordionDemo.mjs.map +0 -7
- package/dist/esm/DrawerDemo.js +0 -55
- package/dist/esm/DrawerDemo.js.map +0 -7
- package/dist/esm/FeatherIconsDemo.js +0 -33
- package/dist/esm/FeatherIconsDemo.js.map +0 -7
- package/dist/esm/FeatherIconsDemo.mjs +0 -33
- package/dist/esm/FeatherIconsDemo.mjs.map +0 -7
- package/dist/esm/MenuDemo.js +0 -38
- package/dist/esm/MenuDemo.js.map +0 -7
- package/dist/esm/PopperDemo.js +0 -97
- package/dist/esm/PopperDemo.js.map +0 -7
- package/dist/esm/TabsAnimatedDemo.js +0 -143
- package/dist/esm/TabsAnimatedDemo.js.map +0 -7
- package/dist/esm/TabsAnimatedDemo.mjs +0 -143
- package/dist/esm/TabsAnimatedDemo.mjs.map +0 -7
- package/dist/esm/TabsHighlightedDemo.js +0 -168
- package/dist/esm/TabsHighlightedDemo.js.map +0 -7
- package/dist/esm/TabsHighlightedDemo.mjs +0 -168
- package/dist/esm/TabsHighlightedDemo.mjs.map +0 -7
- package/dist/esm/TabsUnderlinedDemo.js +0 -160
- package/dist/esm/TabsUnderlinedDemo.js.map +0 -7
- package/dist/esm/TabsUnderlinedDemo.mjs +0 -160
- package/dist/esm/TabsUnderlinedDemo.mjs.map +0 -7
- package/dist/esm/TamaguiLogo.js +0 -96
- package/dist/esm/TamaguiLogo.js.map +0 -7
- package/dist/esm/fixtures/zstack.js +0 -1
- package/dist/esm/fixtures/zstack.js.map +0 -7
- package/dist/esm/snapshots/zstack.js +0 -24
- package/dist/esm/snapshots/zstack.js.map +0 -7
- package/dist/esm/tests/zstack.js +0 -24
- package/dist/esm/tests/zstack.js.map +0 -7
- package/dist/jsx/AccordionDemo.js +0 -17
- package/dist/jsx/AccordionDemo.js.map +0 -7
- package/dist/jsx/AccordionDemo.mjs +0 -17
- package/dist/jsx/AccordionDemo.mjs.map +0 -7
- package/dist/jsx/DrawerDemo.js +0 -18
- package/dist/jsx/DrawerDemo.js.map +0 -7
- package/dist/jsx/FeatherIconsDemo.js +0 -32
- package/dist/jsx/FeatherIconsDemo.js.map +0 -7
- package/dist/jsx/FeatherIconsDemo.mjs +0 -32
- package/dist/jsx/FeatherIconsDemo.mjs.map +0 -7
- package/dist/jsx/MenuDemo.js +0 -15
- package/dist/jsx/MenuDemo.js.map +0 -7
- package/dist/jsx/PopperDemo.js +0 -41
- package/dist/jsx/PopperDemo.js.map +0 -7
- package/dist/jsx/TabsAnimatedDemo.js +0 -114
- package/dist/jsx/TabsAnimatedDemo.js.map +0 -7
- package/dist/jsx/TabsAnimatedDemo.mjs +0 -114
- package/dist/jsx/TabsAnimatedDemo.mjs.map +0 -7
- package/dist/jsx/TabsHighlightedDemo.js +0 -137
- package/dist/jsx/TabsHighlightedDemo.js.map +0 -7
- package/dist/jsx/TabsHighlightedDemo.mjs +0 -137
- package/dist/jsx/TabsHighlightedDemo.mjs.map +0 -7
- package/dist/jsx/TabsUnderlinedDemo.js +0 -133
- package/dist/jsx/TabsUnderlinedDemo.js.map +0 -7
- package/dist/jsx/TabsUnderlinedDemo.mjs +0 -133
- package/dist/jsx/TabsUnderlinedDemo.mjs.map +0 -7
- package/dist/jsx/TamaguiLogo.js +0 -42
- package/dist/jsx/TamaguiLogo.js.map +0 -7
- package/dist/jsx/fixtures/zstack.js +0 -1
- package/dist/jsx/fixtures/zstack.js.map +0 -7
- package/dist/jsx/snapshots/zstack.js +0 -11
- package/dist/jsx/snapshots/zstack.js.map +0 -7
- package/dist/jsx/tests/zstack.js +0 -11
- package/dist/jsx/tests/zstack.js.map +0 -7
- package/types/AccordionDemo.d.ts.map +0 -1
- package/types/DrawerDemo.d.ts.map +0 -1
- package/types/FeatherIconsDemo.d.ts.map +0 -1
- package/types/MenuDemo.d.ts.map +0 -1
- package/types/PopperDemo.d.ts.map +0 -1
- package/types/TabsHighlightedDemo.d.ts.map +0 -1
- package/types/TabsUnderlinedDemo.d.ts.map +0 -1
package/dist/cjs/DrawerDemo.js
DELETED
|
@@ -1,79 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var DrawerDemo_exports = {};
|
|
20
|
-
__export(DrawerDemo_exports, {
|
|
21
|
-
DrawerDemo: () => DrawerDemo
|
|
22
|
-
});
|
|
23
|
-
module.exports = __toCommonJS(DrawerDemo_exports);
|
|
24
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
25
|
-
var import_drawer = require("@tamagui/drawer");
|
|
26
|
-
var import_feather_icons = require("@tamagui/feather-icons");
|
|
27
|
-
var import_react2 = require("react");
|
|
28
|
-
var import_tamagui = require("tamagui");
|
|
29
|
-
function DrawerDemo() {
|
|
30
|
-
const [show, setShow] = (0, import_react2.useState)(false);
|
|
31
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
|
|
32
|
-
minWidth: 230,
|
|
33
|
-
w: "100%",
|
|
34
|
-
h: "100%",
|
|
35
|
-
ai: "center",
|
|
36
|
-
jc: "center",
|
|
37
|
-
position: "relative",
|
|
38
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_drawer.Drawer.Provider, {
|
|
39
|
-
children: [
|
|
40
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, {
|
|
41
|
-
size: "$6",
|
|
42
|
-
icon: show ? import_feather_icons.ChevronDown : import_feather_icons.ChevronUp,
|
|
43
|
-
circular: true,
|
|
44
|
-
onPress: () => setShow((x) => !x),
|
|
45
|
-
elevation: "$2"
|
|
46
|
-
}),
|
|
47
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_drawer.Drawer, {
|
|
48
|
-
open: show,
|
|
49
|
-
onOpenChange: setShow,
|
|
50
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_drawer.Drawer.Frame, {
|
|
51
|
-
h: 200,
|
|
52
|
-
ai: "center",
|
|
53
|
-
jc: "center",
|
|
54
|
-
p: "$6",
|
|
55
|
-
space: true,
|
|
56
|
-
children: [
|
|
57
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
|
|
58
|
-
selectable: false,
|
|
59
|
-
children: "Hello."
|
|
60
|
-
}),
|
|
61
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, {
|
|
62
|
-
size: "$6",
|
|
63
|
-
icon: show ? import_feather_icons.ChevronDown : import_feather_icons.ChevronUp,
|
|
64
|
-
circular: true,
|
|
65
|
-
onPress: () => setShow((x) => !x),
|
|
66
|
-
elevation: "$2"
|
|
67
|
-
})
|
|
68
|
-
]
|
|
69
|
-
})
|
|
70
|
-
})
|
|
71
|
-
]
|
|
72
|
-
})
|
|
73
|
-
});
|
|
74
|
-
}
|
|
75
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
76
|
-
0 && (module.exports = {
|
|
77
|
-
DrawerDemo
|
|
78
|
-
});
|
|
79
|
-
//# sourceMappingURL=DrawerDemo.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/DrawerDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Drawer } from '@tamagui/drawer'\nimport { ChevronDown, ChevronUp } from '@tamagui/feather-icons'\nimport React from 'react'\nimport { useState } from 'react'\nimport { Button, Paragraph, YStack } from 'tamagui'\n\nexport function DrawerDemo() {\n const [show, setShow] = useState(false)\n return (\n <YStack minWidth={230} w=\"100%\" h=\"100%\" ai=\"center\" jc=\"center\" position=\"relative\">\n <Drawer.Provider>\n <Button\n size=\"$6\"\n icon={show ? ChevronDown : ChevronUp}\n circular\n onPress={() => setShow((x) => !x)}\n elevation=\"$2\"\n />\n <Drawer open={show} onOpenChange={setShow}>\n <Drawer.Frame h={200} ai=\"center\" jc=\"center\" p=\"$6\" space>\n <Paragraph selectable={false}>Hello.</Paragraph>\n <Button\n size=\"$6\"\n icon={show ? ChevronDown : ChevronUp}\n circular\n onPress={() => setShow((x) => !x)}\n elevation=\"$2\"\n />\n </Drawer.Frame>\n </Drawer>\n </Drawer.Provider>\n </YStack>\n )\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAWQ;AAXR,oBAAuB;AACvB,2BAAuC;AAEvC,IAAAA,gBAAyB;AACzB,qBAA0C;AAEnC,SAAS,aAAa;AAC3B,QAAM,CAAC,MAAM,OAAO,QAAI,wBAAS,KAAK;AACtC,SACE,4CAAC;AAAA,IAAO,UAAU;AAAA,IAAK,GAAE;AAAA,IAAO,GAAE;AAAA,IAAO,IAAG;AAAA,IAAS,IAAG;AAAA,IAAS,UAAS;AAAA,IACxE,uDAAC,qBAAO,UAAP;AAAA,MACC;AAAA,oDAAC;AAAA,UACC,MAAK;AAAA,UACL,MAAM,OAAO,mCAAc;AAAA,UAC3B,UAAQ;AAAA,UACR,SAAS,MAAM,QAAQ,CAAC,MAAM,CAAC,CAAC;AAAA,UAChC,WAAU;AAAA,SACZ;AAAA,QACA,4CAAC;AAAA,UAAO,MAAM;AAAA,UAAM,cAAc;AAAA,UAChC,uDAAC,qBAAO,OAAP;AAAA,YAAa,GAAG;AAAA,YAAK,IAAG;AAAA,YAAS,IAAG;AAAA,YAAS,GAAE;AAAA,YAAK,OAAK;AAAA,YACxD;AAAA,0DAAC;AAAA,gBAAU,YAAY;AAAA,gBAAO;AAAA,eAAM;AAAA,cACpC,4CAAC;AAAA,gBACC,MAAK;AAAA,gBACL,MAAM,OAAO,mCAAc;AAAA,gBAC3B,UAAQ;AAAA,gBACR,SAAS,MAAM,QAAQ,CAAC,MAAM,CAAC,CAAC;AAAA,gBAChC,WAAU;AAAA,eACZ;AAAA;AAAA,WACF;AAAA,SACF;AAAA;AAAA,KACF;AAAA,GACF;AAEJ;",
|
|
6
|
-
"names": ["import_react"]
|
|
7
|
-
}
|
|
@@ -1,67 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __create = Object.create;
|
|
3
|
-
var __defProp = Object.defineProperty;
|
|
4
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
5
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
6
|
-
var __getProtoOf = Object.getPrototypeOf;
|
|
7
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
8
|
-
var __export = (target, all) => {
|
|
9
|
-
for (var name in all)
|
|
10
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
11
|
-
};
|
|
12
|
-
var __copyProps = (to, from, except, desc) => {
|
|
13
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
14
|
-
for (let key of __getOwnPropNames(from))
|
|
15
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
16
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
17
|
-
}
|
|
18
|
-
return to;
|
|
19
|
-
};
|
|
20
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
|
21
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
|
22
|
-
// file that has been converted to a CommonJS file using a Babel-
|
|
23
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
|
24
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
|
25
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
|
26
|
-
mod
|
|
27
|
-
));
|
|
28
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
29
|
-
var FeatherIconsDemo_exports = {};
|
|
30
|
-
__export(FeatherIconsDemo_exports, {
|
|
31
|
-
FeatherIconsDemo: () => FeatherIconsDemo
|
|
32
|
-
});
|
|
33
|
-
module.exports = __toCommonJS(FeatherIconsDemo_exports);
|
|
34
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
35
|
-
var FeatherIcons = __toESM(require("@tamagui/lucide-icons"), 1);
|
|
36
|
-
var import_react2 = require("react");
|
|
37
|
-
var import_react_native = require("react-native");
|
|
38
|
-
var import_tamagui = require("tamagui");
|
|
39
|
-
const featherIcons = Object.keys(FeatherIcons).map((name) => ({
|
|
40
|
-
key: name.toLowerCase(),
|
|
41
|
-
name,
|
|
42
|
-
Icon: FeatherIcons[name]
|
|
43
|
-
}));
|
|
44
|
-
function FeatherIconsDemo() {
|
|
45
|
-
const [searchRaw, setSearch] = (0, import_react2.useState)("");
|
|
46
|
-
const search = (0, import_tamagui.useDebounceValue)(searchRaw, 400);
|
|
47
|
-
const size = 100;
|
|
48
|
-
const iconsMemo = (0, import_react2.useMemo)(() => {
|
|
49
|
-
const icons = featherIcons.filter((x) => x.key.startsWith(search.toLowerCase()));
|
|
50
|
-
return icons.map(({ Icon, name }) => {
|
|
51
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { h: size, ai: "center", jc: "center", children: [
|
|
52
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Icon, { size: size * 0.25 }),
|
|
53
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Spacer, {}),
|
|
54
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, { size: "$2", o: 0.5, children: name })
|
|
55
|
-
] }, name);
|
|
56
|
-
});
|
|
57
|
-
}, [search]);
|
|
58
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { als: "stretch", p: "$4", pb: "$0", space: true, children: [
|
|
59
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Input, { value: searchRaw, onChangeText: setSearch, placeholder: "Search..." }),
|
|
60
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { h: 420, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native.ScrollView, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Grid, { itemMinWidth: size, children: iconsMemo }) }) })
|
|
61
|
-
] });
|
|
62
|
-
}
|
|
63
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
64
|
-
0 && (module.exports = {
|
|
65
|
-
FeatherIconsDemo
|
|
66
|
-
});
|
|
67
|
-
//# sourceMappingURL=FeatherIconsDemo.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/FeatherIconsDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import * as FeatherIcons from '@tamagui/lucide-icons'\nimport React from 'react'\nimport { useMemo, useState } from 'react'\nimport { ScrollView } from 'react-native'\nimport { Grid, Input, Paragraph, Spacer, YStack, useDebounceValue } from 'tamagui'\n\nconst featherIcons = Object.keys(FeatherIcons).map((name) => ({\n key: name.toLowerCase(),\n name,\n Icon: FeatherIcons[name],\n}))\n\nexport function FeatherIconsDemo() {\n const [searchRaw, setSearch] = useState('')\n const search = useDebounceValue(searchRaw, 400)\n\n const size = 100\n\n const iconsMemo = useMemo(() => {\n const icons = featherIcons.filter((x) => x.key.startsWith(search.toLowerCase()))\n return icons.map(({ Icon, name }) => {\n return (\n <YStack h={size} ai=\"center\" jc=\"center\" key={name}>\n <Icon size={size * 0.25} />\n <Spacer />\n <Paragraph size=\"$2\" o={0.5}>\n {name}\n </Paragraph>\n </YStack>\n )\n })\n }, [search])\n\n return (\n <YStack als=\"stretch\" p=\"$4\" pb=\"$0\" space>\n <Input value={searchRaw} onChangeText={setSearch} placeholder=\"Search...\" />\n\n <YStack h={420}>\n <ScrollView>\n <Grid itemMinWidth={size}>{iconsMemo}</Grid>\n </ScrollView>\n </YStack>\n </YStack>\n )\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsBQ;AAtBR,mBAA8B;AAE9B,IAAAA,gBAAkC;AAClC,0BAA2B;AAC3B,qBAAyE;AAEzE,MAAM,eAAe,OAAO,KAAK,YAAY,EAAE,IAAI,CAAC,UAAU;AAAA,EAC5D,KAAK,KAAK,YAAY;AAAA,EACtB;AAAA,EACA,MAAM,aAAa,IAAI;AACzB,EAAE;AAEK,SAAS,mBAAmB;AACjC,QAAM,CAAC,WAAW,SAAS,QAAI,wBAAS,EAAE;AAC1C,QAAM,aAAS,iCAAiB,WAAW,GAAG;AAE9C,QAAM,OAAO;AAEb,QAAM,gBAAY,uBAAQ,MAAM;AAC9B,UAAM,QAAQ,aAAa,OAAO,CAAC,MAAM,EAAE,IAAI,WAAW,OAAO,YAAY,CAAC,CAAC;AAC/E,WAAO,MAAM,IAAI,CAAC,EAAE,MAAM,KAAK,MAAM;AACnC,aACE,6CAAC,yBAAO,GAAG,MAAM,IAAG,UAAS,IAAG,UAC9B;AAAA,oDAAC,QAAK,MAAM,OAAO,MAAM;AAAA,QACzB,4CAAC,yBAAO;AAAA,QACR,4CAAC,4BAAU,MAAK,MAAK,GAAG,KACrB,gBACH;AAAA,WAL4C,IAM9C;AAAA,IAEJ,CAAC;AAAA,EACH,GAAG,CAAC,MAAM,CAAC;AAEX,SACE,6CAAC,yBAAO,KAAI,WAAU,GAAE,MAAK,IAAG,MAAK,OAAK,MACxC;AAAA,gDAAC,wBAAM,OAAO,WAAW,cAAc,WAAW,aAAY,aAAY;AAAA,IAE1E,4CAAC,yBAAO,GAAG,KACT,sDAAC,kCACC,sDAAC,uBAAK,cAAc,MAAO,qBAAU,GACvC,GACF;AAAA,KACF;AAEJ;",
|
|
6
|
-
"names": ["import_react"]
|
|
7
|
-
}
|
package/dist/cjs/MenuDemo.js
DELETED
|
@@ -1,62 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var MenuDemo_exports = {};
|
|
20
|
-
__export(MenuDemo_exports, {
|
|
21
|
-
MenuDemo: () => MenuDemo
|
|
22
|
-
});
|
|
23
|
-
module.exports = __toCommonJS(MenuDemo_exports);
|
|
24
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
25
|
-
var import_feather_icons = require("@tamagui/feather-icons");
|
|
26
|
-
var import_menu = require("@tamagui/menu");
|
|
27
|
-
var import_react = require("react");
|
|
28
|
-
var import_tamagui = require("tamagui");
|
|
29
|
-
function MenuDemo() {
|
|
30
|
-
const [show, setShow] = (0, import_react.useState)(false);
|
|
31
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.Menu.Provider, {
|
|
32
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.Menu, {
|
|
33
|
-
open: show,
|
|
34
|
-
onOpenChange: setShow,
|
|
35
|
-
trigger: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, {
|
|
36
|
-
size: "$6",
|
|
37
|
-
icon: import_feather_icons.Menu,
|
|
38
|
-
theme: show ? "active" : null,
|
|
39
|
-
circular: true,
|
|
40
|
-
onPress: () => setShow((x) => !x)
|
|
41
|
-
}),
|
|
42
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_menu.Menu.Item, {
|
|
43
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
|
|
44
|
-
p: "$2",
|
|
45
|
-
children: [
|
|
46
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.H4, {
|
|
47
|
-
children: "Menu contents"
|
|
48
|
-
}),
|
|
49
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Paragraph, {
|
|
50
|
-
children: "Lorem ipsum dolor sit amet."
|
|
51
|
-
})
|
|
52
|
-
]
|
|
53
|
-
})
|
|
54
|
-
})
|
|
55
|
-
})
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
59
|
-
0 && (module.exports = {
|
|
60
|
-
MenuDemo
|
|
61
|
-
});
|
|
62
|
-
//# sourceMappingURL=MenuDemo.js.map
|
package/dist/cjs/MenuDemo.js.map
DELETED
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/MenuDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { Menu as MenuIcon } from '@tamagui/feather-icons'\nimport { Menu } from '@tamagui/menu'\nimport React, { useState } from 'react'\nimport { Button, H4, Paragraph, YStack } from 'tamagui'\n\nexport function MenuDemo() {\n const [show, setShow] = useState(false)\n\n return (\n <Menu.Provider>\n <Menu\n open={show}\n onOpenChange={setShow}\n trigger={\n <Button\n size=\"$6\"\n icon={MenuIcon}\n theme={show ? 'active' : null}\n circular\n onPress={() => setShow((x) => !x)}\n />\n }\n >\n <Menu.Item>\n <YStack p=\"$2\">\n <H4>Menu contents</H4>\n <Paragraph>Lorem ipsum dolor sit amet.</Paragraph>\n </YStack>\n </Menu.Item>\n </Menu>\n </Menu.Provider>\n )\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAcU;AAdV,2BAAiC;AACjC,kBAAqB;AACrB,mBAAgC;AAChC,qBAA8C;AAEvC,SAAS,WAAW;AACzB,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAS,KAAK;AAEtC,SACE,4CAAC,iBAAK,UAAL;AAAA,IACC,sDAAC;AAAA,MACC,MAAM;AAAA,MACN,cAAc;AAAA,MACd,SACE,4CAAC;AAAA,QACC,MAAK;AAAA,QACL,MAAM,qBAAAA;AAAA,QACN,OAAO,OAAO,WAAW;AAAA,QACzB,UAAQ;AAAA,QACR,SAAS,MAAM,QAAQ,CAAC,MAAM,CAAC,CAAC;AAAA,OAClC;AAAA,MAGF,sDAAC,iBAAK,MAAL;AAAA,QACC,uDAAC;AAAA,UAAO,GAAE;AAAA,UACR;AAAA,wDAAC;AAAA,cAAG;AAAA,aAAa;AAAA,YACjB,4CAAC;AAAA,cAAU;AAAA,aAA2B;AAAA;AAAA,SACxC;AAAA,OACF;AAAA,KACF;AAAA,GACF;AAEJ;",
|
|
6
|
-
"names": ["MenuIcon"]
|
|
7
|
-
}
|
package/dist/cjs/PopperDemo.js
DELETED
|
@@ -1,111 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var PopperDemo_exports = {};
|
|
20
|
-
__export(PopperDemo_exports, {
|
|
21
|
-
Demo: () => Demo,
|
|
22
|
-
PopperDemo: () => PopperDemo
|
|
23
|
-
});
|
|
24
|
-
module.exports = __toCommonJS(PopperDemo_exports);
|
|
25
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
26
|
-
var import_lucide_icons = require("@tamagui/lucide-icons");
|
|
27
|
-
var import_tamagui = require("tamagui");
|
|
28
|
-
function PopperDemo() {
|
|
29
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
|
|
30
|
-
space: "$2",
|
|
31
|
-
f: 1,
|
|
32
|
-
justifyContent: "center",
|
|
33
|
-
alignItems: "center",
|
|
34
|
-
children: [
|
|
35
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Demo, {
|
|
36
|
-
placement: "left-end",
|
|
37
|
-
Icon: import_lucide_icons.ChevronLeft,
|
|
38
|
-
Id: "left"
|
|
39
|
-
}),
|
|
40
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Demo, {
|
|
41
|
-
placement: "bottom-end",
|
|
42
|
-
Icon: import_lucide_icons.ChevronDown,
|
|
43
|
-
Id: "bottom"
|
|
44
|
-
}),
|
|
45
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Demo, {
|
|
46
|
-
placement: "top-end",
|
|
47
|
-
Icon: import_lucide_icons.ChevronUp,
|
|
48
|
-
Id: "top"
|
|
49
|
-
}),
|
|
50
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(Demo, {
|
|
51
|
-
placement: "right-end",
|
|
52
|
-
Icon: import_lucide_icons.ChevronRight,
|
|
53
|
-
Id: "right"
|
|
54
|
-
})
|
|
55
|
-
]
|
|
56
|
-
});
|
|
57
|
-
}
|
|
58
|
-
function Demo({ Icon, Id, ...props }) {
|
|
59
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Popper, {
|
|
60
|
-
placement: props.placement,
|
|
61
|
-
children: [
|
|
62
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.PopperAnchor, {
|
|
63
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, {
|
|
64
|
-
icon: Icon
|
|
65
|
-
})
|
|
66
|
-
}),
|
|
67
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Portal, {
|
|
68
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.PopperContent, {
|
|
69
|
-
children: [
|
|
70
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.PopperArrow, {
|
|
71
|
-
bw: 1,
|
|
72
|
-
boc: "$borderColor"
|
|
73
|
-
}),
|
|
74
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YGroup, {
|
|
75
|
-
space: "$3",
|
|
76
|
-
width: 200,
|
|
77
|
-
bw: 1,
|
|
78
|
-
boc: "$borderColor",
|
|
79
|
-
children: [
|
|
80
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, {
|
|
81
|
-
space: "$3",
|
|
82
|
-
children: [
|
|
83
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Label, {
|
|
84
|
-
size: "$3",
|
|
85
|
-
htmlFor: Id,
|
|
86
|
-
children: "Name"
|
|
87
|
-
}),
|
|
88
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Input, {
|
|
89
|
-
size: "$3",
|
|
90
|
-
id: Id
|
|
91
|
-
})
|
|
92
|
-
]
|
|
93
|
-
}),
|
|
94
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Button, {
|
|
95
|
-
size: "$3",
|
|
96
|
-
children: "Submit"
|
|
97
|
-
})
|
|
98
|
-
]
|
|
99
|
-
})
|
|
100
|
-
]
|
|
101
|
-
})
|
|
102
|
-
})
|
|
103
|
-
]
|
|
104
|
-
});
|
|
105
|
-
}
|
|
106
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
107
|
-
0 && (module.exports = {
|
|
108
|
-
Demo,
|
|
109
|
-
PopperDemo
|
|
110
|
-
});
|
|
111
|
-
//# sourceMappingURL=PopperDemo.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/PopperDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { ChevronDown, ChevronLeft, ChevronRight, ChevronUp } from '@tamagui/lucide-icons'\nimport {\n Adapt,\n Button,\n Input,\n Label,\n Popper,\n PopperAnchor,\n PopperArrow,\n PopperContent,\n PopperProps,\n Portal,\n PortalHost,\n PortalItem,\n XGroup,\n XStack,\n YGroup,\n} from 'tamagui'\n\nexport function PopperDemo() {\n return (\n\n\n <XStack space=\"$2\" f={1} justifyContent='center' alignItems='center'>\n <Demo placement=\"left-end\" Icon={ChevronLeft} Id=\"left\" />\n <Demo placement=\"bottom-end\" Icon={ChevronDown} Id=\"bottom\" />\n <Demo placement=\"top-end\" Icon={ChevronUp} Id=\"top\" />\n <Demo placement=\"right-end\" Icon={ChevronRight} Id=\"right\" />\n </XStack>\n\n )\n}\n\nexport function Demo({ Icon, Id, ...props }: PopperProps & { Icon?: any, Id?: string }) {\n return (\n \n <Popper placement={props.placement}>\n <PopperAnchor>\n <Button icon={Icon} />\n </PopperAnchor>\n\n <Portal>\n <PopperContent>\n <PopperArrow bw={1} boc=\"$borderColor\" />\n\n <YGroup space=\"$3\" width={200} bw={1} boc=\"$borderColor\">\n <XStack space=\"$3\">\n <Label size=\"$3\" htmlFor={Id}>\n Name\n </Label>\n <Input size=\"$3\" id={Id} />\n </XStack>\n \n <Button\n size=\"$3\"\n >\n Submit\n </Button>\n </YGroup>\n\n </PopperContent>\n </Portal>\n\n\n </Popper>\n\n )\n\n\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAuBM;AAvBN,0BAAkE;AAClE,qBAgBO;AAEA,SAAS,aAAa;AAC3B,SAGI,6CAAC;AAAA,IAAO,OAAM;AAAA,IAAK,GAAG;AAAA,IAAG,gBAAe;AAAA,IAAS,YAAW;AAAA,IAC1D;AAAA,kDAAC;AAAA,QAAK,WAAU;AAAA,QAAW,MAAM;AAAA,QAAa,IAAG;AAAA,OAAO;AAAA,MACxD,4CAAC;AAAA,QAAK,WAAU;AAAA,QAAa,MAAM;AAAA,QAAa,IAAG;AAAA,OAAS;AAAA,MAC5D,4CAAC;AAAA,QAAK,WAAU;AAAA,QAAU,MAAM;AAAA,QAAW,IAAG;AAAA,OAAM;AAAA,MACpD,4CAAC;AAAA,QAAK,WAAU;AAAA,QAAY,MAAM;AAAA,QAAc,IAAG;AAAA,OAAQ;AAAA;AAAA,GAC7D;AAGN;AAEO,SAAS,KAAK,EAAE,MAAM,OAAO,MAAM,GAA8C;AACtF,SAEE,6CAAC;AAAA,IAAO,WAAW,MAAM;AAAA,IACvB;AAAA,kDAAC;AAAA,QACC,sDAAC;AAAA,UAAO,MAAM;AAAA,SAAM;AAAA,OACtB;AAAA,MAEA,4CAAC;AAAA,QACC,uDAAC;AAAA,UACG;AAAA,wDAAC;AAAA,cAAY,IAAI;AAAA,cAAG,KAAI;AAAA,aAAe;AAAA,YAEvC,6CAAC;AAAA,cAAO,OAAM;AAAA,cAAK,OAAO;AAAA,cAAK,IAAI;AAAA,cAAG,KAAI;AAAA,cACxC;AAAA,6DAAC;AAAA,kBAAO,OAAM;AAAA,kBACZ;AAAA,gEAAC;AAAA,sBAAM,MAAK;AAAA,sBAAK,SAAS;AAAA,sBAAI;AAAA,qBAE9B;AAAA,oBACA,4CAAC;AAAA,sBAAM,MAAK;AAAA,sBAAK,IAAI;AAAA,qBAAI;AAAA;AAAA,iBAC3B;AAAA,gBAEE,4CAAC;AAAA,kBACC,MAAK;AAAA,kBACN;AAAA,iBAED;AAAA;AAAA,aACJ;AAAA;AAAA,SAEF;AAAA,OACF;AAAA;AAAA,GAGJ;AAKJ;",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|
|
@@ -1,167 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __defProp = Object.defineProperty;
|
|
3
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
4
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
5
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
6
|
-
var __export = (target, all) => {
|
|
7
|
-
for (var name in all)
|
|
8
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
9
|
-
};
|
|
10
|
-
var __copyProps = (to, from, except, desc) => {
|
|
11
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
12
|
-
for (let key of __getOwnPropNames(from))
|
|
13
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
14
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
15
|
-
}
|
|
16
|
-
return to;
|
|
17
|
-
};
|
|
18
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
19
|
-
var TabsAnimatedDemo_exports = {};
|
|
20
|
-
__export(TabsAnimatedDemo_exports, {
|
|
21
|
-
TabsAnimatedDemo: () => TabsAnimatedDemo
|
|
22
|
-
});
|
|
23
|
-
module.exports = __toCommonJS(TabsAnimatedDemo_exports);
|
|
24
|
-
var import_jsx_runtime = require("react/jsx-runtime");
|
|
25
|
-
var import_react = require("react");
|
|
26
|
-
var import_tamagui = require("tamagui");
|
|
27
|
-
function TabsAnimatedDemo() {
|
|
28
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.XStack, { maxHeight: "100%", maxWidth: "100%", justifyContent: "flex-start", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.XStack, { space: "$3", px: "$8", children: [
|
|
29
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(UnderlineTabs, {}),
|
|
30
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(HighlightTabs, {})
|
|
31
|
-
] }) });
|
|
32
|
-
}
|
|
33
|
-
const UnderlineTabs = () => {
|
|
34
|
-
const [currentTab, setCurrentTab] = (0, import_react.useState)("tab1");
|
|
35
|
-
const [direction, setDirection] = (0, import_react.useState)(0);
|
|
36
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
37
|
-
import_tamagui.Tabs,
|
|
38
|
-
{
|
|
39
|
-
value: currentTab,
|
|
40
|
-
onValueChange: setCurrentTab,
|
|
41
|
-
onDirectionChange: setDirection,
|
|
42
|
-
orientation: "vertical",
|
|
43
|
-
width: 300,
|
|
44
|
-
br: "$4",
|
|
45
|
-
ai: "center",
|
|
46
|
-
children: [
|
|
47
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.YStack, { borderColor: "$color3", borderRightWidth: "$0.5", mr: "$2", children: /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { children: [
|
|
48
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
49
|
-
import_tamagui.Tabs.RovingIndicator,
|
|
50
|
-
{
|
|
51
|
-
highlightMode: "hoverOrFocus",
|
|
52
|
-
width: "$0.5",
|
|
53
|
-
right: 0,
|
|
54
|
-
animation: "100ms"
|
|
55
|
-
}
|
|
56
|
-
),
|
|
57
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
58
|
-
import_tamagui.Tabs.RovingIndicator,
|
|
59
|
-
{
|
|
60
|
-
highlightMode: "select",
|
|
61
|
-
width: "$0.5",
|
|
62
|
-
right: 0,
|
|
63
|
-
animation: "100ms"
|
|
64
|
-
}
|
|
65
|
-
),
|
|
66
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Tabs.List, { "aria-label": "Manage your account", flexDirection: "column", children: [
|
|
67
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Tabs.Trigger, { unstyled: true, color: "$color12", value: "tab1", children: "Profile" }),
|
|
68
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Tabs.Trigger, { unstyled: true, color: "$color12", value: "tab2", children: "Connections" }),
|
|
69
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Tabs.Trigger, { unstyled: true, color: "$color12", value: "tab3", children: "Notifications" })
|
|
70
|
-
] })
|
|
71
|
-
] }) }),
|
|
72
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.AnimatePresence, { exitBeforeEnter: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
73
|
-
import_tamagui.Tabs.Content,
|
|
74
|
-
{
|
|
75
|
-
value: currentTab,
|
|
76
|
-
forceMount: true,
|
|
77
|
-
p: "$2",
|
|
78
|
-
animation: "100ms",
|
|
79
|
-
o: 1,
|
|
80
|
-
y: 0,
|
|
81
|
-
f: 1,
|
|
82
|
-
enterStyle: {
|
|
83
|
-
...direction === -1 ? { y: -25 } : {},
|
|
84
|
-
...direction === 1 ? { y: 25 } : {},
|
|
85
|
-
opacity: 0
|
|
86
|
-
},
|
|
87
|
-
exitStyle: {
|
|
88
|
-
...direction === -1 ? { y: 25 } : {},
|
|
89
|
-
...direction === 1 ? { y: -25 } : {},
|
|
90
|
-
opacity: 0
|
|
91
|
-
},
|
|
92
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.H5, { ta: "center", children: currentTab })
|
|
93
|
-
},
|
|
94
|
-
currentTab
|
|
95
|
-
) })
|
|
96
|
-
]
|
|
97
|
-
}
|
|
98
|
-
);
|
|
99
|
-
};
|
|
100
|
-
const HighlightTabs = () => {
|
|
101
|
-
const [currentTab, setCurrentTab] = (0, import_react.useState)("tab1");
|
|
102
|
-
const [direction, setDirection] = (0, import_react.useState)(0);
|
|
103
|
-
return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
|
|
104
|
-
import_tamagui.Tabs,
|
|
105
|
-
{
|
|
106
|
-
value: currentTab,
|
|
107
|
-
onValueChange: setCurrentTab,
|
|
108
|
-
onDirectionChange: setDirection,
|
|
109
|
-
orientation: "horizontal",
|
|
110
|
-
br: "$4",
|
|
111
|
-
flexDirection: "column",
|
|
112
|
-
children: [
|
|
113
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.YStack, { children: [
|
|
114
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
115
|
-
import_tamagui.Tabs.RovingIndicator,
|
|
116
|
-
{
|
|
117
|
-
highlightMode: "hoverOrFocus",
|
|
118
|
-
borderRadius: "$4",
|
|
119
|
-
animation: "100ms"
|
|
120
|
-
}
|
|
121
|
-
),
|
|
122
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
123
|
-
import_tamagui.Tabs.RovingIndicator,
|
|
124
|
-
{
|
|
125
|
-
highlightMode: "select",
|
|
126
|
-
borderRadius: "$4",
|
|
127
|
-
animation: "100ms"
|
|
128
|
-
}
|
|
129
|
-
),
|
|
130
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_tamagui.Tabs.List, { "aria-label": "Manage your account", children: [
|
|
131
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Tabs.Trigger, { unstyled: true, color: "$color12", value: "tab1", children: "Profile" }),
|
|
132
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Tabs.Trigger, { unstyled: true, color: "$color12", value: "tab2", children: "Connections" }),
|
|
133
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.Tabs.Trigger, { unstyled: true, color: "$color12", value: "tab3", children: "Notifications" })
|
|
134
|
-
] })
|
|
135
|
-
] }),
|
|
136
|
-
/* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.AnimatePresence, { exitBeforeEnter: true, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
|
|
137
|
-
import_tamagui.Tabs.Content,
|
|
138
|
-
{
|
|
139
|
-
value: currentTab,
|
|
140
|
-
forceMount: true,
|
|
141
|
-
p: "$2",
|
|
142
|
-
animation: "100ms",
|
|
143
|
-
o: 1,
|
|
144
|
-
x: 0,
|
|
145
|
-
enterStyle: {
|
|
146
|
-
...direction === -1 ? { x: -25 } : {},
|
|
147
|
-
...direction === 1 ? { x: 25 } : {},
|
|
148
|
-
opacity: 0
|
|
149
|
-
},
|
|
150
|
-
exitStyle: {
|
|
151
|
-
...direction === -1 ? { x: 25 } : {},
|
|
152
|
-
...direction === 1 ? { x: -25 } : {},
|
|
153
|
-
opacity: 0
|
|
154
|
-
},
|
|
155
|
-
children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_tamagui.H5, { ta: "center", children: currentTab })
|
|
156
|
-
},
|
|
157
|
-
currentTab
|
|
158
|
-
) })
|
|
159
|
-
]
|
|
160
|
-
}
|
|
161
|
-
);
|
|
162
|
-
};
|
|
163
|
-
// Annotate the CommonJS export names for ESM import in node:
|
|
164
|
-
0 && (module.exports = {
|
|
165
|
-
TabsAnimatedDemo
|
|
166
|
-
});
|
|
167
|
-
//# sourceMappingURL=TabsAnimatedDemo.js.map
|
|
@@ -1,7 +0,0 @@
|
|
|
1
|
-
{
|
|
2
|
-
"version": 3,
|
|
3
|
-
"sources": ["../../src/TabsAnimatedDemo.tsx"],
|
|
4
|
-
"sourcesContent": ["import { useState } from 'react'\nimport { AnimatePresence, H5, Tabs, XStack, YStack } from 'tamagui'\n\nexport function TabsAnimatedDemo() {\n return (\n <XStack maxHeight=\"100%\" maxWidth=\"100%\" justifyContent=\"flex-start\">\n <XStack space=\"$3\" px=\"$8\">\n <UnderlineTabs />\n <HighlightTabs />\n </XStack>\n </XStack>\n )\n}\n\nconst UnderlineTabs = () => {\n const [currentTab, setCurrentTab] = useState('tab1')\n const [direction, setDirection] = useState<-1 | 0 | 1>(0)\n\n return (\n <Tabs\n value={currentTab}\n onValueChange={setCurrentTab}\n onDirectionChange={setDirection}\n orientation=\"vertical\"\n width={300}\n br=\"$4\"\n ai=\"center\"\n >\n <YStack borderColor=\"$color3\" borderRightWidth=\"$0.5\" mr=\"$2\">\n <YStack>\n <Tabs.RovingIndicator\n highlightMode=\"hoverOrFocus\"\n width=\"$0.5\"\n right={0}\n animation=\"100ms\"\n />\n <Tabs.RovingIndicator\n highlightMode=\"select\"\n width=\"$0.5\"\n right={0}\n animation=\"100ms\"\n />\n <Tabs.List aria-label=\"Manage your account\" flexDirection=\"column\">\n <Tabs.Trigger unstyled color=\"$color12\" value=\"tab1\">\n Profile\n </Tabs.Trigger>\n <Tabs.Trigger unstyled color=\"$color12\" value=\"tab2\">\n Connections\n </Tabs.Trigger>\n <Tabs.Trigger unstyled color=\"$color12\" value=\"tab3\">\n Notifications\n </Tabs.Trigger>\n </Tabs.List>\n </YStack>\n </YStack>\n <AnimatePresence exitBeforeEnter>\n <Tabs.Content\n value={currentTab}\n key={currentTab}\n forceMount\n p=\"$2\"\n animation=\"100ms\"\n o={1}\n y={0}\n f={1}\n enterStyle={{\n ...(direction === -1 ? { y: -25 } : {}),\n ...(direction === 1 ? { y: 25 } : {}),\n opacity: 0,\n }}\n exitStyle={{\n ...(direction === -1 ? { y: 25 } : {}),\n ...(direction === 1 ? { y: -25 } : {}),\n opacity: 0,\n }}\n >\n <H5 ta=\"center\">{currentTab}</H5>\n </Tabs.Content>\n </AnimatePresence>\n </Tabs>\n )\n}\n\nconst HighlightTabs = () => {\n const [currentTab, setCurrentTab] = useState('tab1')\n const [direction, setDirection] = useState<-1 | 0 | 1>(0)\n\n return (\n <Tabs\n value={currentTab}\n onValueChange={setCurrentTab}\n onDirectionChange={setDirection}\n orientation=\"horizontal\"\n br=\"$4\"\n flexDirection=\"column\"\n >\n <YStack>\n <Tabs.RovingIndicator\n highlightMode=\"hoverOrFocus\"\n borderRadius=\"$4\"\n animation=\"100ms\"\n />\n <Tabs.RovingIndicator\n highlightMode=\"select\"\n borderRadius=\"$4\"\n animation=\"100ms\"\n />\n <Tabs.List aria-label=\"Manage your account\">\n <Tabs.Trigger unstyled color=\"$color12\" value=\"tab1\">\n Profile\n </Tabs.Trigger>\n <Tabs.Trigger unstyled color=\"$color12\" value=\"tab2\">\n Connections\n </Tabs.Trigger>\n <Tabs.Trigger unstyled color=\"$color12\" value=\"tab3\">\n Notifications\n </Tabs.Trigger>\n </Tabs.List>\n </YStack>\n <AnimatePresence exitBeforeEnter>\n <Tabs.Content\n value={currentTab}\n key={currentTab}\n forceMount\n p=\"$2\"\n animation=\"100ms\"\n o={1}\n x={0}\n enterStyle={{\n ...(direction === -1 ? { x: -25 } : {}),\n ...(direction === 1 ? { x: 25 } : {}),\n opacity: 0,\n }}\n exitStyle={{\n ...(direction === -1 ? { x: 25 } : {}),\n ...(direction === 1 ? { x: -25 } : {}),\n opacity: 0,\n }}\n >\n <H5 ta=\"center\">{currentTab}</H5>\n </Tabs.Content>\n </AnimatePresence>\n </Tabs>\n )\n}\n"],
|
|
5
|
-
"mappings": "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",
|
|
6
|
-
"names": []
|
|
7
|
-
}
|