@hanzogui/stacks 8.3.5 → 8.4.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/LICENSE +26 -0
- package/NOTICE +60 -0
- package/dist/cjs/Stacks.js +24 -1
- package/dist/cjs/Stacks.js.map +1 -1
- package/dist/esm/Stacks.js +23 -0
- package/dist/esm/Stacks.js.map +1 -1
- package/package.json +8 -7
- package/src/Stacks.tsx +26 -0
- package/types/Stacks.d.ts +20 -0
- package/types/Stacks.d.ts.map +1 -1
package/LICENSE
ADDED
|
@@ -0,0 +1,26 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2020 Nate Wienert
|
|
4
|
+
Copyright (c) 2015-present, Nicolas Gallagher.
|
|
5
|
+
Copyright (c) 2015-present, Facebook, Inc.
|
|
6
|
+
Copyright (c) 2021 Radix
|
|
7
|
+
Copyright (c) 2017 Carmelo Pullara
|
|
8
|
+
Copyright (c) 2018 Framer B.V.
|
|
9
|
+
|
|
10
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
11
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
12
|
+
in the Software without restriction, including without limitation the rights
|
|
13
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
14
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
15
|
+
furnished to do so, subject to the following conditions:
|
|
16
|
+
|
|
17
|
+
The above copyright notice and this permission notice shall be included in all
|
|
18
|
+
copies or substantial portions of the Software.
|
|
19
|
+
|
|
20
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
21
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
22
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
23
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
24
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
25
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
26
|
+
SOFTWARE.
|
package/NOTICE
ADDED
|
@@ -0,0 +1,60 @@
|
|
|
1
|
+
Hanzo GUI
|
|
2
|
+
Copyright (c) 2026-present, Hanzo AI, Inc.
|
|
3
|
+
|
|
4
|
+
This product is derived from Tamagui (https://github.com/tamagui/tamagui),
|
|
5
|
+
licensed under the MIT License. Its original copyright and permission notices
|
|
6
|
+
are reproduced below, as that license requires:
|
|
7
|
+
|
|
8
|
+
MIT License
|
|
9
|
+
|
|
10
|
+
Copyright (c) 2020 Nate Wienert
|
|
11
|
+
Copyright (c) 2015-present, Nicolas Gallagher.
|
|
12
|
+
Copyright (c) 2015-present, Facebook, Inc.
|
|
13
|
+
Copyright (c) 2021 Radix
|
|
14
|
+
Copyright (c) 2017 Carmelo Pullara
|
|
15
|
+
Copyright (c) 2018 Framer B.V.
|
|
16
|
+
|
|
17
|
+
Permission is hereby granted, free of charge, to any person obtaining a copy
|
|
18
|
+
of this software and associated documentation files (the "Software"), to deal
|
|
19
|
+
in the Software without restriction, including without limitation the rights
|
|
20
|
+
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
|
21
|
+
copies of the Software, and to permit persons to whom the Software is
|
|
22
|
+
furnished to do so, subject to the following conditions:
|
|
23
|
+
|
|
24
|
+
The above copyright notice and this permission notice shall be included in all
|
|
25
|
+
copies or substantial portions of the Software.
|
|
26
|
+
|
|
27
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
28
|
+
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
29
|
+
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
30
|
+
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
31
|
+
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
32
|
+
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
33
|
+
SOFTWARE.
|
|
34
|
+
|
|
35
|
+
--- Fork provenance ---
|
|
36
|
+
|
|
37
|
+
Hanzo GUI is a fork of Tamagui, not a product that bundles it. The git history
|
|
38
|
+
in this repository is Tamagui's history continued, and every package in this
|
|
39
|
+
workspace except the nine listed below is Tamagui's work, carried here under the
|
|
40
|
+
MIT license above. Renaming those packages into the @hanzogui scope changed what
|
|
41
|
+
they are called, not who wrote them.
|
|
42
|
+
|
|
43
|
+
Written at Hanzo:
|
|
44
|
+
|
|
45
|
+
@hanzogui/shell pkgs/ui/shell
|
|
46
|
+
@hanzogui/chrome pkgs/ui/chrome
|
|
47
|
+
@hanzogui/telemetry pkgs/telemetry
|
|
48
|
+
@hanzo/booker pkgs/calendar
|
|
49
|
+
@hanzogui/tauri pkgs/tauri
|
|
50
|
+
@hanzogui/get pkgs/get
|
|
51
|
+
@hanzogui/recipes pkgs/recipes
|
|
52
|
+
@hanzogui/font-zen pkgs/core/font-zen
|
|
53
|
+
@hanzogui/desktop apps/desktop
|
|
54
|
+
|
|
55
|
+
This file is the whole of the attribution, and it has to be exact rather than
|
|
56
|
+
approximate. Apart from it, the LICENSE, and one line of descent in the README,
|
|
57
|
+
the upstream name is deliberately absent from the product surface — the package
|
|
58
|
+
names, the UI, and the documentation site. That is the house rule for every
|
|
59
|
+
import we carry. Hanzo GUI is not affiliated with, sponsored by, or endorsed by
|
|
60
|
+
Tamagui.
|
package/dist/cjs/Stacks.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.ZStack = exports.XStack = exports.YStack = exports.fullscreenStyle = void 0;
|
|
3
|
+
exports.Wrap = exports.ZStack = exports.XStack = exports.YStack = exports.fullscreenStyle = void 0;
|
|
4
4
|
const core_1 = require("@hanzogui/core");
|
|
5
5
|
const getElevation_tsx_1 = require("./getElevation.js");
|
|
6
6
|
exports.fullscreenStyle = {
|
|
@@ -18,6 +18,10 @@ const variants = {
|
|
|
18
18
|
};
|
|
19
19
|
/**
|
|
20
20
|
* @summary A view that arranges its children in a vertical line.
|
|
21
|
+
*
|
|
22
|
+
* `tracks` lays them on grid tracks the stack sizes instead:
|
|
23
|
+
* `<YStack tracks="auto 1fr auto">` is a header, a body that fills and a
|
|
24
|
+
* footer, with no flex prop on any of them. See `tracks` in @hanzogui/web.
|
|
21
25
|
* @see — Docs https://hanzogui.dev/ui/stacks#xstack-ystack-zstack
|
|
22
26
|
*/
|
|
23
27
|
exports.YStack = (0, core_1.styled)(core_1.View, {
|
|
@@ -27,6 +31,9 @@ exports.YStack = (0, core_1.styled)(core_1.View, {
|
|
|
27
31
|
exports.YStack['displayName'] = 'YStack';
|
|
28
32
|
/**
|
|
29
33
|
* @summary A view that arranges its children in a horizontal line.
|
|
34
|
+
*
|
|
35
|
+
* `tracks` lays them on grid tracks the stack sizes instead:
|
|
36
|
+
* `<XStack tracks="240px 1fr">` is a fixed rail and the page beside it.
|
|
30
37
|
* @see — Docs https://hanzogui.dev/ui/stacks#xstack-ystack-zstack
|
|
31
38
|
*/
|
|
32
39
|
exports.XStack = (0, core_1.styled)(core_1.View, {
|
|
@@ -45,4 +52,20 @@ exports.ZStack = (0, core_1.styled)(exports.YStack, {
|
|
|
45
52
|
isZStack: true,
|
|
46
53
|
});
|
|
47
54
|
exports.ZStack['displayName'] = 'ZStack';
|
|
55
|
+
/**
|
|
56
|
+
* @summary A row that wraps its children onto as many lines as they need, each
|
|
57
|
+
* at its own content size, spaced by `gap`.
|
|
58
|
+
*
|
|
59
|
+
* The one place content-sized wrapping lives. A stack sizes its children on
|
|
60
|
+
* tracks; what has no tracks — chips, tags, a run of buttons — wraps here, and
|
|
61
|
+
* a child of a Wrap is the one place a flex prop (`grow`, `shrink`,
|
|
62
|
+
* `flexBasis`) still means something.
|
|
63
|
+
*
|
|
64
|
+
* @example <Wrap gap="$2">{tags.map((t) => <Chip key={t}>{t}</Chip>)}</Wrap>
|
|
65
|
+
*/
|
|
66
|
+
exports.Wrap = (0, core_1.styled)(core_1.View, {
|
|
67
|
+
flexDirection: 'row',
|
|
68
|
+
flexWrap: 'wrap',
|
|
69
|
+
});
|
|
70
|
+
exports.Wrap['displayName'] = 'Wrap';
|
|
48
71
|
//# sourceMappingURL=Stacks.js.map
|
package/dist/cjs/Stacks.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stacks.js","sourceRoot":"","sources":["../../src/Stacks.tsx"],"names":[],"mappings":";;;AACA,yCAA6C;AAE7C,wDAAiD;
|
|
1
|
+
{"version":3,"file":"Stacks.js","sourceRoot":"","sources":["../../src/Stacks.tsx"],"names":[],"mappings":";;;AACA,yCAA6C;AAE7C,wDAAiD;AAkBpC,QAAA,eAAe,GAAG;IAC7B,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,CAAC;CACA,CAAA;AAEV,MAAM,QAAQ,GAAG;IACf,UAAU,EAAE;QACV,IAAI,EAAE,QAAA,eAAe;KACtB;IAED,SAAS,EAAE;QACT,SAAS,EAAE,+BAAY;QACvB,SAAS,EAAE,+BAAY;KACxB;CACO,CAAA;AAEV;;;;;;;GAOG;AACU,QAAA,MAAM,GAAG,IAAA,aAAM,EAAC,WAAI,EAAE;IACjC,aAAa,EAAE,QAAQ;IACvB,QAAQ;CACT,CAAC,CAAA;AAEF,QAAA,MAAM,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAA;AAEhC;;;;;;GAMG;AACU,QAAA,MAAM,GAAG,IAAA,aAAM,EAAC,WAAI,EAAE;IACjC,aAAa,EAAE,KAAK;IACpB,QAAQ;CACT,CAAC,CAAA;AAEF,QAAA,MAAM,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAA;AAEhC;;;GAGG;AACU,QAAA,MAAM,GAAG,IAAA,aAAM,EAC1B,QAAA,MAAM,EACN;IACE,QAAQ,EAAE,UAAU;CACrB,EACD;IACE,YAAY,EAAE,IAAI;IAClB,QAAQ,EAAE,IAAI;CACf,CACF,CAAA;AAED,QAAA,MAAM,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAA;AAEhC;;;;;;;;;;GAUG;AACU,QAAA,IAAI,GAAG,IAAA,aAAM,EAAC,WAAI,EAAE;IAC/B,aAAa,EAAE,KAAK;IACpB,QAAQ,EAAE,MAAM;CACjB,CAAC,CAAA;AAEF,QAAA,IAAI,CAAC,aAAa,CAAC,GAAG,MAAM,CAAA"}
|
package/dist/esm/Stacks.js
CHANGED
|
@@ -15,6 +15,10 @@ const variants = {
|
|
|
15
15
|
};
|
|
16
16
|
/**
|
|
17
17
|
* @summary A view that arranges its children in a vertical line.
|
|
18
|
+
*
|
|
19
|
+
* `tracks` lays them on grid tracks the stack sizes instead:
|
|
20
|
+
* `<YStack tracks="auto 1fr auto">` is a header, a body that fills and a
|
|
21
|
+
* footer, with no flex prop on any of them. See `tracks` in @hanzogui/web.
|
|
18
22
|
* @see — Docs https://hanzogui.dev/ui/stacks#xstack-ystack-zstack
|
|
19
23
|
*/
|
|
20
24
|
export const YStack = styled(View, {
|
|
@@ -24,6 +28,9 @@ export const YStack = styled(View, {
|
|
|
24
28
|
YStack['displayName'] = 'YStack';
|
|
25
29
|
/**
|
|
26
30
|
* @summary A view that arranges its children in a horizontal line.
|
|
31
|
+
*
|
|
32
|
+
* `tracks` lays them on grid tracks the stack sizes instead:
|
|
33
|
+
* `<XStack tracks="240px 1fr">` is a fixed rail and the page beside it.
|
|
27
34
|
* @see — Docs https://hanzogui.dev/ui/stacks#xstack-ystack-zstack
|
|
28
35
|
*/
|
|
29
36
|
export const XStack = styled(View, {
|
|
@@ -42,4 +49,20 @@ export const ZStack = styled(YStack, {
|
|
|
42
49
|
isZStack: true,
|
|
43
50
|
});
|
|
44
51
|
ZStack['displayName'] = 'ZStack';
|
|
52
|
+
/**
|
|
53
|
+
* @summary A row that wraps its children onto as many lines as they need, each
|
|
54
|
+
* at its own content size, spaced by `gap`.
|
|
55
|
+
*
|
|
56
|
+
* The one place content-sized wrapping lives. A stack sizes its children on
|
|
57
|
+
* tracks; what has no tracks — chips, tags, a run of buttons — wraps here, and
|
|
58
|
+
* a child of a Wrap is the one place a flex prop (`grow`, `shrink`,
|
|
59
|
+
* `flexBasis`) still means something.
|
|
60
|
+
*
|
|
61
|
+
* @example <Wrap gap="$2">{tags.map((t) => <Chip key={t}>{t}</Chip>)}</Wrap>
|
|
62
|
+
*/
|
|
63
|
+
export const Wrap = styled(View, {
|
|
64
|
+
flexDirection: 'row',
|
|
65
|
+
flexWrap: 'wrap',
|
|
66
|
+
});
|
|
67
|
+
Wrap['displayName'] = 'Wrap';
|
|
45
68
|
//# sourceMappingURL=Stacks.js.map
|
package/dist/esm/Stacks.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stacks.js","sourceRoot":"","sources":["../../src/Stacks.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAE7C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAoB,CAAA;
|
|
1
|
+
{"version":3,"file":"Stacks.js","sourceRoot":"","sources":["../../src/Stacks.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,MAAM,gBAAgB,CAAA;AAE7C,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAoB,CAAA;AAkBjD,MAAM,CAAC,MAAM,eAAe,GAAG;IAC7B,QAAQ,EAAE,UAAU;IACpB,KAAK,EAAE,CAAC;CACA,CAAA;AAEV,MAAM,QAAQ,GAAG;IACf,UAAU,EAAE;QACV,IAAI,EAAE,eAAe;KACtB;IAED,SAAS,EAAE;QACT,SAAS,EAAE,YAAY;QACvB,SAAS,EAAE,YAAY;KACxB;CACO,CAAA;AAEV;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,EAAE;IACjC,aAAa,EAAE,QAAQ;IACvB,QAAQ;CACT,CAAC,CAAA;AAEF,MAAM,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAA;AAEhC;;;;;;GAMG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAAC,IAAI,EAAE;IACjC,aAAa,EAAE,KAAK;IACpB,QAAQ;CACT,CAAC,CAAA;AAEF,MAAM,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAA;AAEhC;;;GAGG;AACH,MAAM,CAAC,MAAM,MAAM,GAAG,MAAM,CAC1B,MAAM,EACN;IACE,QAAQ,EAAE,UAAU;CACrB,EACD;IACE,YAAY,EAAE,IAAI;IAClB,QAAQ,EAAE,IAAI;CACf,CACF,CAAA;AAED,MAAM,CAAC,aAAa,CAAC,GAAG,QAAQ,CAAA;AAEhC;;;;;;;;;;GAUG;AACH,MAAM,CAAC,MAAM,IAAI,GAAG,MAAM,CAAC,IAAI,EAAE;IAC/B,aAAa,EAAE,KAAK;IACpB,QAAQ,EAAE,MAAM;CACjB,CAAC,CAAA;AAEF,IAAI,CAAC,aAAa,CAAC,GAAG,MAAM,CAAA"}
|
package/package.json
CHANGED
|
@@ -1,12 +1,13 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@hanzogui/stacks",
|
|
3
|
-
"version": "8.
|
|
3
|
+
"version": "8.4.0",
|
|
4
4
|
"gitHead": "a49cc7ea6b93ba384e77a4880ae48ac4a5635c14",
|
|
5
5
|
"source": "src/index.ts",
|
|
6
6
|
"files": [
|
|
7
|
+
"NOTICE",
|
|
8
|
+
"dist",
|
|
7
9
|
"src",
|
|
8
|
-
"types"
|
|
9
|
-
"dist"
|
|
10
|
+
"types"
|
|
10
11
|
],
|
|
11
12
|
"type": "module",
|
|
12
13
|
"sideEffects": false,
|
|
@@ -35,12 +36,12 @@
|
|
|
35
36
|
"clean:build": "hanzogui-build clean:build"
|
|
36
37
|
},
|
|
37
38
|
"dependencies": {
|
|
38
|
-
"@hanzogui/core": "8.
|
|
39
|
-
"@hanzogui/get-button-sized": "8.
|
|
40
|
-
"@hanzogui/web": "8.
|
|
39
|
+
"@hanzogui/core": "8.4.0",
|
|
40
|
+
"@hanzogui/get-button-sized": "8.4.0",
|
|
41
|
+
"@hanzogui/web": "8.4.0"
|
|
41
42
|
},
|
|
42
43
|
"devDependencies": {
|
|
43
|
-
"@hanzogui/build": "8.
|
|
44
|
+
"@hanzogui/build": "8.4.0",
|
|
44
45
|
"react": "19.2.8"
|
|
45
46
|
},
|
|
46
47
|
"peerDependencies": {
|
package/src/Stacks.tsx
CHANGED
|
@@ -17,6 +17,7 @@ export type YStackProps = Omit<GetProps<typeof YStack>, keyof StackVariants> &
|
|
|
17
17
|
|
|
18
18
|
export type XStackProps = YStackProps
|
|
19
19
|
export type ZStackProps = YStackProps
|
|
20
|
+
export type WrapProps = GetProps<typeof Wrap>
|
|
20
21
|
|
|
21
22
|
export const fullscreenStyle = {
|
|
22
23
|
position: 'absolute',
|
|
@@ -36,6 +37,10 @@ const variants = {
|
|
|
36
37
|
|
|
37
38
|
/**
|
|
38
39
|
* @summary A view that arranges its children in a vertical line.
|
|
40
|
+
*
|
|
41
|
+
* `tracks` lays them on grid tracks the stack sizes instead:
|
|
42
|
+
* `<YStack tracks="auto 1fr auto">` is a header, a body that fills and a
|
|
43
|
+
* footer, with no flex prop on any of them. See `tracks` in @hanzogui/web.
|
|
39
44
|
* @see — Docs https://hanzogui.dev/ui/stacks#xstack-ystack-zstack
|
|
40
45
|
*/
|
|
41
46
|
export const YStack = styled(View, {
|
|
@@ -47,6 +52,9 @@ YStack['displayName'] = 'YStack'
|
|
|
47
52
|
|
|
48
53
|
/**
|
|
49
54
|
* @summary A view that arranges its children in a horizontal line.
|
|
55
|
+
*
|
|
56
|
+
* `tracks` lays them on grid tracks the stack sizes instead:
|
|
57
|
+
* `<XStack tracks="240px 1fr">` is a fixed rail and the page beside it.
|
|
50
58
|
* @see — Docs https://hanzogui.dev/ui/stacks#xstack-ystack-zstack
|
|
51
59
|
*/
|
|
52
60
|
export const XStack = styled(View, {
|
|
@@ -72,3 +80,21 @@ export const ZStack = styled(
|
|
|
72
80
|
)
|
|
73
81
|
|
|
74
82
|
ZStack['displayName'] = 'ZStack'
|
|
83
|
+
|
|
84
|
+
/**
|
|
85
|
+
* @summary A row that wraps its children onto as many lines as they need, each
|
|
86
|
+
* at its own content size, spaced by `gap`.
|
|
87
|
+
*
|
|
88
|
+
* The one place content-sized wrapping lives. A stack sizes its children on
|
|
89
|
+
* tracks; what has no tracks — chips, tags, a run of buttons — wraps here, and
|
|
90
|
+
* a child of a Wrap is the one place a flex prop (`grow`, `shrink`,
|
|
91
|
+
* `flexBasis`) still means something.
|
|
92
|
+
*
|
|
93
|
+
* @example <Wrap gap="$2">{tags.map((t) => <Chip key={t}>{t}</Chip>)}</Wrap>
|
|
94
|
+
*/
|
|
95
|
+
export const Wrap = styled(View, {
|
|
96
|
+
flexDirection: 'row',
|
|
97
|
+
flexWrap: 'wrap',
|
|
98
|
+
})
|
|
99
|
+
|
|
100
|
+
Wrap['displayName'] = 'Wrap'
|
package/types/Stacks.d.ts
CHANGED
|
@@ -9,12 +9,17 @@ export interface StackVariants {
|
|
|
9
9
|
export type YStackProps = Omit<GetProps<typeof YStack>, keyof StackVariants> & StackVariants;
|
|
10
10
|
export type XStackProps = YStackProps;
|
|
11
11
|
export type ZStackProps = YStackProps;
|
|
12
|
+
export type WrapProps = GetProps<typeof Wrap>;
|
|
12
13
|
export declare const fullscreenStyle: {
|
|
13
14
|
readonly position: 'absolute';
|
|
14
15
|
readonly inset: 0;
|
|
15
16
|
};
|
|
16
17
|
/**
|
|
17
18
|
* @summary A view that arranges its children in a vertical line.
|
|
19
|
+
*
|
|
20
|
+
* `tracks` lays them on grid tracks the stack sizes instead:
|
|
21
|
+
* `<YStack tracks="auto 1fr auto">` is a header, a body that fills and a
|
|
22
|
+
* footer, with no flex prop on any of them. See `tracks` in @hanzogui/web.
|
|
18
23
|
* @see — Docs https://hanzogui.dev/ui/stacks#xstack-ystack-zstack
|
|
19
24
|
*/
|
|
20
25
|
export declare const YStack: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
|
|
@@ -23,6 +28,9 @@ export declare const YStack: import("@hanzogui/web").GuiComponent<import("@hanzo
|
|
|
23
28
|
}, import("@hanzogui/web").StaticConfigPublic>;
|
|
24
29
|
/**
|
|
25
30
|
* @summary A view that arranges its children in a horizontal line.
|
|
31
|
+
*
|
|
32
|
+
* `tracks` lays them on grid tracks the stack sizes instead:
|
|
33
|
+
* `<XStack tracks="240px 1fr">` is a fixed rail and the page beside it.
|
|
26
34
|
* @see — Docs https://hanzogui.dev/ui/stacks#xstack-ystack-zstack
|
|
27
35
|
*/
|
|
28
36
|
export declare const XStack: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {
|
|
@@ -40,4 +48,16 @@ export declare const ZStack: import("@hanzogui/web").GuiComponent<import("@hanzo
|
|
|
40
48
|
neverFlatten: true;
|
|
41
49
|
isZStack: true;
|
|
42
50
|
}>;
|
|
51
|
+
/**
|
|
52
|
+
* @summary A row that wraps its children onto as many lines as they need, each
|
|
53
|
+
* at its own content size, spaced by `gap`.
|
|
54
|
+
*
|
|
55
|
+
* The one place content-sized wrapping lives. A stack sizes its children on
|
|
56
|
+
* tracks; what has no tracks — chips, tags, a run of buttons — wraps here, and
|
|
57
|
+
* a child of a Wrap is the one place a flex prop (`grow`, `shrink`,
|
|
58
|
+
* `flexBasis`) still means something.
|
|
59
|
+
*
|
|
60
|
+
* @example <Wrap gap="$2">{tags.map((t) => <Chip key={t}>{t}</Chip>)}</Wrap>
|
|
61
|
+
*/
|
|
62
|
+
export declare const Wrap: import("@hanzogui/web").GuiComponent<import("@hanzogui/web").TamaDefer, import("@hanzogui/web").GuiElement, import("@hanzogui/core").RNGuiViewNonStyleProps, import("@hanzogui/web").StackStyleBase, {}, import("@hanzogui/web").StaticConfigPublic>;
|
|
43
63
|
//# sourceMappingURL=Stacks.d.ts.map
|
package/types/Stacks.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Stacks.d.ts","sourceRoot":"","sources":["../src/Stacks.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAK1D,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB,SAAS,CAAC,EAAE,MAAM,GAAG,UAAU,CAAA;CAChC;AAED,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,MAAM,CAAC,EAAE,MAAM,aAAa,CAAC,GAC1E,aAAa,CAAA;AAEf,MAAM,MAAM,WAAW,GAAG,WAAW,CAAA;AACrC,MAAM,MAAM,WAAW,GAAG,WAAW,CAAA;
|
|
1
|
+
{"version":3,"file":"Stacks.d.ts","sourceRoot":"","sources":["../src/Stacks.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAA;AAK1D,MAAM,WAAW,aAAa;IAC5B;;OAEG;IACH,UAAU,CAAC,EAAE,OAAO,CAAA;IAEpB,SAAS,CAAC,EAAE,MAAM,GAAG,UAAU,CAAA;CAChC;AAED,MAAM,MAAM,WAAW,GAAG,IAAI,CAAC,QAAQ,CAAC,OAAO,MAAM,CAAC,EAAE,MAAM,aAAa,CAAC,GAC1E,aAAa,CAAA;AAEf,MAAM,MAAM,WAAW,GAAG,WAAW,CAAA;AACrC,MAAM,MAAM,WAAW,GAAG,WAAW,CAAA;AACrC,MAAM,MAAM,SAAS,GAAG,QAAQ,CAAC,OAAO,IAAI,CAAC,CAAA;AAE7C,eAAO,MAAM,eAAe;aAC1B,QAAQ,EAAE,UAAU;aACpB,KAAK,EAAE,CAAC;CACA,CAAA;AAaV;;;;;;;GAOG;AACH,eAAO,MAAM,MAAM;;;8CAGjB,CAAA;AAIF;;;;;;GAMG;AACH,eAAO,MAAM,MAAM;;;8CAGjB,CAAA;AAIF;;;GAGG;AACH,eAAO,MAAM,MAAM;;;;;;EASlB,CAAA;AAID;;;;;;;;;;GAUG;AACH,eAAO,MAAM,IAAI,sPAGf,CAAA"}
|