@tamagui/stacks 1.0.0-beta.9 → 1.0.1-beta.101

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.
Files changed (53) hide show
  1. package/dist/cjs/SizableStack.js +9 -65
  2. package/dist/cjs/SizableStack.js.map +2 -2
  3. package/dist/cjs/Stacks.js +30 -25
  4. package/dist/cjs/Stacks.js.map +2 -2
  5. package/dist/cjs/ThemeableSizableStack.js +70 -0
  6. package/dist/cjs/ThemeableSizableStack.js.map +7 -0
  7. package/dist/cjs/ThemeableStack.js +61 -0
  8. package/dist/cjs/ThemeableStack.js.map +7 -0
  9. package/dist/cjs/index.js +1 -0
  10. package/dist/cjs/index.js.map +2 -2
  11. package/dist/cjs/variants.js +138 -0
  12. package/dist/cjs/variants.js.map +7 -0
  13. package/dist/esm/SizableStack.js +10 -66
  14. package/dist/esm/SizableStack.js.map +2 -2
  15. package/dist/esm/Stacks.js +29 -26
  16. package/dist/esm/Stacks.js.map +2 -2
  17. package/dist/esm/ThemeableSizableStack.js +47 -0
  18. package/dist/esm/ThemeableSizableStack.js.map +7 -0
  19. package/dist/esm/ThemeableStack.js +47 -0
  20. package/dist/esm/ThemeableStack.js.map +7 -0
  21. package/dist/esm/index.js +1 -0
  22. package/dist/esm/index.js.map +2 -2
  23. package/dist/esm/variants.js +110 -0
  24. package/dist/esm/variants.js.map +7 -0
  25. package/dist/jsx/SizableStack.js +11 -66
  26. package/dist/jsx/SizableStack.js.map +7 -0
  27. package/dist/jsx/Stacks.js +30 -26
  28. package/dist/jsx/Stacks.js.map +7 -0
  29. package/dist/jsx/ThemeableSizableStack.js +46 -0
  30. package/dist/jsx/ThemeableStack.js +47 -0
  31. package/dist/jsx/ThemeableStack.js.map +7 -0
  32. package/dist/jsx/index.js +2 -0
  33. package/dist/jsx/index.js.map +7 -0
  34. package/dist/jsx/variants.js +97 -0
  35. package/dist/jsx/variants.js.map +7 -0
  36. package/package.json +8 -5
  37. package/src/SizableStack.tsx +29 -0
  38. package/src/Stacks.tsx +91 -0
  39. package/src/ThemeableStack.tsx +53 -0
  40. package/src/index.ts +3 -0
  41. package/src/variants.tsx +98 -0
  42. package/types/SizableStack.d.ts +35 -39
  43. package/types/SizableStack.d.ts.map +1 -1
  44. package/types/Stacks.d.ts +34 -33
  45. package/types/Stacks.d.ts.map +1 -1
  46. package/types/ThemeableSizableStack.d.ts +68 -0
  47. package/types/ThemeableSizableStack.d.ts.map +1 -0
  48. package/types/ThemeableStack.d.ts +68 -0
  49. package/types/ThemeableStack.d.ts.map +1 -0
  50. package/types/index.d.ts +1 -0
  51. package/types/index.d.ts.map +1 -1
  52. package/types/variants.d.ts +268 -0
  53. package/types/variants.d.ts.map +1 -0
@@ -0,0 +1,47 @@
1
+ import { styled } from "@tamagui/core";
2
+ import { YStack } from "./Stacks";
3
+ import {
4
+ bordered,
5
+ circular,
6
+ elevate,
7
+ focusTheme,
8
+ hoverTheme,
9
+ padded,
10
+ pressTheme,
11
+ radiused
12
+ } from "./variants";
13
+ const ThemeableStack = styled(YStack, {
14
+ name: "SizableStack",
15
+ variants: {
16
+ fontFamily: () => ({}),
17
+ backgrounded: {
18
+ true: {
19
+ backgroundColor: "$background"
20
+ }
21
+ },
22
+ radiused,
23
+ hoverTheme,
24
+ pressTheme,
25
+ focusTheme,
26
+ circular,
27
+ padded,
28
+ elevate,
29
+ bordered,
30
+ transparent: {
31
+ true: {
32
+ backgroundColor: "transparent"
33
+ }
34
+ },
35
+ chromeless: {
36
+ true: {
37
+ backgroundColor: "transparent",
38
+ borderColor: "transparent",
39
+ shadowColor: "transparent"
40
+ }
41
+ }
42
+ }
43
+ });
44
+ export {
45
+ ThemeableStack
46
+ };
47
+ //# sourceMappingURL=ThemeableStack.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/ThemeableStack.tsx"],
4
+ "sourcesContent": ["import { GetProps, styled } from '@tamagui/core'\n\nimport { YStack } from './Stacks'\nimport {\n bordered,\n circular,\n elevate,\n focusTheme,\n hoverTheme,\n padded,\n pressTheme,\n radiused,\n} from './variants'\n\nexport const ThemeableStack = styled(YStack, {\n name: 'SizableStack',\n\n variants: {\n // allows the type to come in for use in size\n fontFamily: () => ({}),\n\n backgrounded: {\n true: {\n backgroundColor: '$background',\n },\n },\n\n radiused,\n hoverTheme,\n pressTheme,\n focusTheme,\n circular,\n padded,\n elevate,\n bordered,\n\n transparent: {\n true: {\n backgroundColor: 'transparent',\n },\n },\n\n chromeless: {\n true: {\n backgroundColor: 'transparent',\n borderColor: 'transparent',\n shadowColor: 'transparent',\n },\n },\n },\n})\n\nexport type ThemeableStackProps = GetProps<typeof ThemeableStack>\n"],
5
+ "mappings": "AAAA;AAEA;AACA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAWO,MAAM,iBAAiB,OAAO,QAAQ;AAAA,EAC3C,MAAM;AAAA,EAEN,UAAU;AAAA,IAER,YAAY,MAAO,EAAC;AAAA,IAEpB,cAAc;AAAA,MACZ,MAAM;AAAA,QACJ,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IAEA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IAEA,aAAa;AAAA,MACX,MAAM;AAAA,QACJ,iBAAiB;AAAA,MACnB;AAAA,IACF;AAAA,IAEA,YAAY;AAAA,MACV,MAAM;AAAA,QACJ,iBAAiB;AAAA,QACjB,aAAa;AAAA,QACb,aAAa;AAAA,MACf;AAAA,IACF;AAAA,EACF;AACF,CAAC;",
6
+ "names": []
7
+ }
package/dist/jsx/index.js CHANGED
@@ -1,2 +1,4 @@
1
1
  export * from "./Stacks";
2
2
  export * from "./SizableStack";
3
+ export * from "./ThemeableStack";
4
+ //# sourceMappingURL=index.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/index.ts"],
4
+ "sourcesContent": ["export * from './Stacks'\nexport * from './SizableStack'\nexport * from './ThemeableStack'\n"],
5
+ "mappings": "AAAA;AACA;AACA;",
6
+ "names": []
7
+ }
@@ -0,0 +1,97 @@
1
+ import { getElevation } from "./Stacks";
2
+ const elevate = {
3
+ true: (_, extras) => {
4
+ return getElevation(extras.props["size"], extras);
5
+ }
6
+ };
7
+ const bordered = (val, { props }) => {
8
+ return {
9
+ borderWidth: typeof val === "number" ? val : 1,
10
+ borderColor: "$borderColor",
11
+ ...props.hoverTheme && {
12
+ hoverStyle: {
13
+ borderColor: "$borderColorHover"
14
+ }
15
+ },
16
+ ...props.pressTheme && {
17
+ pressStyle: {
18
+ borderColor: "$borderColorPress"
19
+ }
20
+ },
21
+ ...props.focusTheme && {
22
+ focusStyle: {
23
+ borderColor: "$borderColorFocus"
24
+ }
25
+ }
26
+ };
27
+ };
28
+ const padded = {
29
+ true: (_, extras) => {
30
+ const { tokens, props } = extras;
31
+ return {
32
+ padding: tokens.space[props.size] || tokens.space["$4"]
33
+ };
34
+ }
35
+ };
36
+ const radiused = {
37
+ true: (_, extras) => {
38
+ const { tokens, props } = extras;
39
+ return {
40
+ borderRadius: tokens.radius[props.size] || tokens.radius["$4"]
41
+ };
42
+ }
43
+ };
44
+ const circular = {
45
+ true: (_, { props, tokens }) => {
46
+ const size = tokens.size[props.size];
47
+ return {
48
+ width: size,
49
+ height: size,
50
+ maxWidth: size,
51
+ maxHeight: size,
52
+ minWidth: size,
53
+ minHeight: size,
54
+ borderRadius: 1e5,
55
+ paddingVertical: 0,
56
+ paddingHorizontal: 0
57
+ };
58
+ }
59
+ };
60
+ const hoverTheme = {
61
+ true: {
62
+ hoverStyle: {
63
+ backgroundColor: "$backgroundHover",
64
+ borderColor: "$borderColorHover"
65
+ }
66
+ },
67
+ false: {}
68
+ };
69
+ const pressTheme = {
70
+ true: {
71
+ pressStyle: {
72
+ backgroundColor: "$backgroundPress",
73
+ borderColor: "$borderColorPress"
74
+ }
75
+ },
76
+ false: {}
77
+ };
78
+ const focusTheme = {
79
+ true: {
80
+ focusStyle: {
81
+ backgroundColor: "$backgroundFocus",
82
+ borderColor: "$borderColorFocus"
83
+ }
84
+ },
85
+ false: {}
86
+ };
87
+ export {
88
+ bordered,
89
+ circular,
90
+ elevate,
91
+ focusTheme,
92
+ hoverTheme,
93
+ padded,
94
+ pressTheme,
95
+ radiused
96
+ };
97
+ //# sourceMappingURL=variants.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../src/variants.tsx"],
4
+ "sourcesContent": ["import { getElevation } from './Stacks'\n\nexport const elevate = {\n true: (_: boolean, extras: any) => {\n return getElevation(extras.props['size'], extras)\n },\n}\n\nexport const bordered = (val: boolean | number, { props }) => {\n return {\n // TODO size it with size in '...size'\n borderWidth: typeof val === 'number' ? val : 1,\n borderColor: '$borderColor',\n\n ...(props.hoverTheme && {\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n }),\n\n ...(props.pressTheme && {\n pressStyle: {\n borderColor: '$borderColorPress',\n },\n }),\n\n ...(props.focusTheme && {\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n }),\n }\n}\n\nexport const padded = {\n true: (_, extras) => {\n const { tokens, props } = extras\n return {\n padding: tokens.space[props.size] || tokens.space['$4'],\n }\n },\n}\n\nexport const radiused = {\n true: (_, extras) => {\n const { tokens, props } = extras\n return {\n borderRadius: tokens.radius[props.size] || tokens.radius['$4'],\n }\n },\n}\n\nexport const circular = {\n true: (_, { props, tokens }) => {\n const size = tokens.size[props.size]\n return {\n width: size,\n height: size,\n maxWidth: size,\n maxHeight: size,\n minWidth: size,\n minHeight: size,\n borderRadius: 100_000,\n paddingVertical: 0,\n paddingHorizontal: 0,\n }\n },\n}\n\nexport const hoverTheme = {\n true: {\n hoverStyle: {\n backgroundColor: '$backgroundHover',\n borderColor: '$borderColorHover',\n },\n },\n false: {},\n}\n\nexport const pressTheme = {\n true: {\n pressStyle: {\n backgroundColor: '$backgroundPress',\n borderColor: '$borderColorPress',\n },\n },\n false: {},\n}\n\nexport const focusTheme = {\n true: {\n focusStyle: {\n backgroundColor: '$backgroundFocus',\n borderColor: '$borderColorFocus',\n },\n },\n false: {},\n}\n"],
5
+ "mappings": "AAAA;AAEO,MAAM,UAAU;AAAA,EACrB,MAAM,CAAC,GAAY,WAAgB;AACjC,WAAO,aAAa,OAAO,MAAM,SAAS,MAAM;AAAA,EAClD;AACF;AAEO,MAAM,WAAW,CAAC,KAAuB,EAAE,YAAY;AAC5D,SAAO;AAAA,IAEL,aAAa,OAAO,QAAQ,WAAW,MAAM;AAAA,IAC7C,aAAa;AAAA,IAEb,GAAI,MAAM,cAAc;AAAA,MACtB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IAEA,GAAI,MAAM,cAAc;AAAA,MACtB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,IAEA,GAAI,MAAM,cAAc;AAAA,MACtB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,EACF;AACF;AAEO,MAAM,SAAS;AAAA,EACpB,MAAM,CAAC,GAAG,WAAW;AACnB,UAAM,EAAE,QAAQ,UAAU;AAC1B,WAAO;AAAA,MACL,SAAS,OAAO,MAAM,MAAM,SAAS,OAAO,MAAM;AAAA,IACpD;AAAA,EACF;AACF;AAEO,MAAM,WAAW;AAAA,EACtB,MAAM,CAAC,GAAG,WAAW;AACnB,UAAM,EAAE,QAAQ,UAAU;AAC1B,WAAO;AAAA,MACL,cAAc,OAAO,OAAO,MAAM,SAAS,OAAO,OAAO;AAAA,IAC3D;AAAA,EACF;AACF;AAEO,MAAM,WAAW;AAAA,EACtB,MAAM,CAAC,GAAG,EAAE,OAAO,aAAa;AAC9B,UAAM,OAAO,OAAO,KAAK,MAAM;AAC/B,WAAO;AAAA,MACL,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,UAAU;AAAA,MACV,WAAW;AAAA,MACX,UAAU;AAAA,MACV,WAAW;AAAA,MACX,cAAc;AAAA,MACd,iBAAiB;AAAA,MACjB,mBAAmB;AAAA,IACrB;AAAA,EACF;AACF;AAEO,MAAM,aAAa;AAAA,EACxB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO,CAAC;AACV;AAEO,MAAM,aAAa;AAAA,EACxB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO,CAAC;AACV;AAEO,MAAM,aAAa;AAAA,EACxB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO,CAAC;AACV;",
6
+ "names": []
7
+ }
package/package.json CHANGED
@@ -1,13 +1,16 @@
1
1
  {
2
2
  "name": "@tamagui/stacks",
3
- "version": "1.0.0-beta.9",
4
- "sideEffects": false,
3
+ "version": "1.0.1-beta.101",
4
+ "sideEffects": [
5
+ "*.css"
6
+ ],
5
7
  "source": "src/index.ts",
6
- "typings": "types",
8
+ "types": "./types/index.d.ts",
7
9
  "main": "dist/cjs",
8
10
  "module": "dist/esm",
9
11
  "module:jsx": "dist/jsx",
10
12
  "files": [
13
+ "src",
11
14
  "types",
12
15
  "dist"
13
16
  ],
@@ -16,14 +19,14 @@
16
19
  "watch": "tamagui-build --watch"
17
20
  },
18
21
  "dependencies": {
19
- "@tamagui/core": "^1.0.0-beta.9"
22
+ "@tamagui/core": "^1.0.1-beta.101"
20
23
  },
21
24
  "peerDependencies": {
22
25
  "react": "*",
23
26
  "react-dom": "*"
24
27
  },
25
28
  "devDependencies": {
26
- "@tamagui/build": "^1.0.0-beta.9",
29
+ "@tamagui/build": "^1.0.1-beta.101",
27
30
  "react": "*",
28
31
  "react-dom": "*"
29
32
  },
@@ -0,0 +1,29 @@
1
+ import { GetProps, getButtonSize, styled } from '@tamagui/core'
2
+
3
+ import { YStack } from './Stacks'
4
+ import { bordered, circular, elevate, focusTheme, hoverTheme, pressTheme } from './variants'
5
+
6
+ export const SizableStack = styled(YStack, {
7
+ name: 'SizableStack',
8
+ backgroundColor: '$background',
9
+ flexDirection: 'row',
10
+ flexShrink: 1,
11
+
12
+ variants: {
13
+ // allows the type to come in for use in size
14
+ fontFamily: () => ({}),
15
+
16
+ hoverTheme,
17
+ pressTheme,
18
+ focusTheme,
19
+ circular,
20
+ elevate,
21
+ bordered,
22
+
23
+ size: {
24
+ '...size': getButtonSize,
25
+ },
26
+ },
27
+ })
28
+
29
+ export type SizableStackProps = GetProps<typeof SizableStack>
package/src/Stacks.tsx ADDED
@@ -0,0 +1,91 @@
1
+ import {
2
+ GetProps,
3
+ SizeTokens,
4
+ SizeVariantSpreadFunction,
5
+ Stack,
6
+ StackProps,
7
+ VariantSpreadExtras,
8
+ getVariableValue,
9
+ isVariable,
10
+ styled,
11
+ } from '@tamagui/core'
12
+
13
+ export type YStackProps = GetProps<typeof YStack>
14
+ export type XStackProps = YStackProps
15
+ export type ZStackProps = YStackProps
16
+
17
+ export const getElevation: SizeVariantSpreadFunction<StackProps> = (size, extras) => {
18
+ if (!size) return
19
+ const { tokens } = extras
20
+ const token = tokens.size[size]
21
+ const sizeNum = (isVariable(token) ? +token.val : size) as number
22
+ return getSizedElevation(sizeNum, extras)
23
+ }
24
+
25
+ const fullscreenStyle = {
26
+ position: 'absolute',
27
+ top: 0,
28
+ left: 0,
29
+ right: 0,
30
+ bottom: 0,
31
+ } as const
32
+
33
+ const variants = {
34
+ fullscreen: {
35
+ true: fullscreenStyle,
36
+ },
37
+ elevation: {
38
+ '...size': getElevation,
39
+ },
40
+ } as const
41
+
42
+ export const YStack = styled(Stack, {
43
+ flexDirection: 'column',
44
+ name: 'YStack',
45
+ variants,
46
+ })
47
+
48
+ export const XStack = styled(Stack, {
49
+ flexDirection: 'row',
50
+ name: 'XStack',
51
+ variants,
52
+ })
53
+
54
+ export const ZStack = styled(
55
+ YStack,
56
+ {
57
+ name: 'ZStack',
58
+ position: 'relative',
59
+ },
60
+ {
61
+ neverFlatten: true,
62
+ isZStack: true,
63
+ }
64
+ )
65
+
66
+ export const getSizedElevation = (
67
+ val: SizeTokens | number | boolean,
68
+ { theme, tokens }: VariantSpreadExtras<any>
69
+ ) => {
70
+ let num = 0
71
+ if (val === true) {
72
+ const val = getVariableValue(tokens.size['true'])
73
+ if (typeof val === 'number') {
74
+ num = val
75
+ } else {
76
+ num = 10
77
+ }
78
+ } else {
79
+ num = +val
80
+ }
81
+ if (process.env.NODE_ENV === 'development') {
82
+ if (isNaN(num)) console.warn('NaN shadow', num, val)
83
+ }
84
+ const [height, shadowRadius] = [Math.round(num / 4 + 1), Math.round(num / 2 + 2)]
85
+ const shadow = {
86
+ shadowColor: theme.shadowColor,
87
+ shadowRadius,
88
+ shadowOffset: { height, width: 0 },
89
+ }
90
+ return shadow
91
+ }
@@ -0,0 +1,53 @@
1
+ import { GetProps, styled } from '@tamagui/core'
2
+
3
+ import { YStack } from './Stacks'
4
+ import {
5
+ bordered,
6
+ circular,
7
+ elevate,
8
+ focusTheme,
9
+ hoverTheme,
10
+ padded,
11
+ pressTheme,
12
+ radiused,
13
+ } from './variants'
14
+
15
+ export const ThemeableStack = styled(YStack, {
16
+ name: 'SizableStack',
17
+
18
+ variants: {
19
+ // allows the type to come in for use in size
20
+ fontFamily: () => ({}),
21
+
22
+ backgrounded: {
23
+ true: {
24
+ backgroundColor: '$background',
25
+ },
26
+ },
27
+
28
+ radiused,
29
+ hoverTheme,
30
+ pressTheme,
31
+ focusTheme,
32
+ circular,
33
+ padded,
34
+ elevate,
35
+ bordered,
36
+
37
+ transparent: {
38
+ true: {
39
+ backgroundColor: 'transparent',
40
+ },
41
+ },
42
+
43
+ chromeless: {
44
+ true: {
45
+ backgroundColor: 'transparent',
46
+ borderColor: 'transparent',
47
+ shadowColor: 'transparent',
48
+ },
49
+ },
50
+ },
51
+ })
52
+
53
+ export type ThemeableStackProps = GetProps<typeof ThemeableStack>
package/src/index.ts ADDED
@@ -0,0 +1,3 @@
1
+ export * from './Stacks'
2
+ export * from './SizableStack'
3
+ export * from './ThemeableStack'
@@ -0,0 +1,98 @@
1
+ import { getElevation } from './Stacks'
2
+
3
+ export const elevate = {
4
+ true: (_: boolean, extras: any) => {
5
+ return getElevation(extras.props['size'], extras)
6
+ },
7
+ }
8
+
9
+ export const bordered = (val: boolean | number, { props }) => {
10
+ return {
11
+ // TODO size it with size in '...size'
12
+ borderWidth: typeof val === 'number' ? val : 1,
13
+ borderColor: '$borderColor',
14
+
15
+ ...(props.hoverTheme && {
16
+ hoverStyle: {
17
+ borderColor: '$borderColorHover',
18
+ },
19
+ }),
20
+
21
+ ...(props.pressTheme && {
22
+ pressStyle: {
23
+ borderColor: '$borderColorPress',
24
+ },
25
+ }),
26
+
27
+ ...(props.focusTheme && {
28
+ focusStyle: {
29
+ borderColor: '$borderColorFocus',
30
+ },
31
+ }),
32
+ }
33
+ }
34
+
35
+ export const padded = {
36
+ true: (_, extras) => {
37
+ const { tokens, props } = extras
38
+ return {
39
+ padding: tokens.space[props.size] || tokens.space['$4'],
40
+ }
41
+ },
42
+ }
43
+
44
+ export const radiused = {
45
+ true: (_, extras) => {
46
+ const { tokens, props } = extras
47
+ return {
48
+ borderRadius: tokens.radius[props.size] || tokens.radius['$4'],
49
+ }
50
+ },
51
+ }
52
+
53
+ export const circular = {
54
+ true: (_, { props, tokens }) => {
55
+ const size = tokens.size[props.size]
56
+ return {
57
+ width: size,
58
+ height: size,
59
+ maxWidth: size,
60
+ maxHeight: size,
61
+ minWidth: size,
62
+ minHeight: size,
63
+ borderRadius: 100_000,
64
+ paddingVertical: 0,
65
+ paddingHorizontal: 0,
66
+ }
67
+ },
68
+ }
69
+
70
+ export const hoverTheme = {
71
+ true: {
72
+ hoverStyle: {
73
+ backgroundColor: '$backgroundHover',
74
+ borderColor: '$borderColorHover',
75
+ },
76
+ },
77
+ false: {},
78
+ }
79
+
80
+ export const pressTheme = {
81
+ true: {
82
+ pressStyle: {
83
+ backgroundColor: '$backgroundPress',
84
+ borderColor: '$borderColorPress',
85
+ },
86
+ },
87
+ false: {},
88
+ }
89
+
90
+ export const focusTheme = {
91
+ true: {
92
+ focusStyle: {
93
+ backgroundColor: '$backgroundFocus',
94
+ borderColor: '$borderColorFocus',
95
+ },
96
+ },
97
+ false: {},
98
+ }
@@ -1,56 +1,52 @@
1
1
  import { GetProps } from '@tamagui/core';
2
2
  export declare const SizableStack: import("@tamagui/core").TamaguiComponent<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
3
- fullscreen?: boolean | undefined;
4
- elevation?: import("@tamagui/core").SizeTokens | undefined;
5
- }, "focusable" | "fontFamily" | "disabled" | "size" | "transparent" | "hoverable" | "pressable" | "bordered" | "chromeless"> & {
3
+ readonly fullscreen?: boolean | undefined;
4
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
5
+ }, "fontFamily" | "size" | "hoverTheme" | "pressTheme" | "focusTheme" | "circular" | "elevate" | "bordered"> & {
6
6
  fontFamily?: unknown;
7
- hoverable?: boolean | undefined;
8
- pressable?: boolean | undefined;
9
- focusable?: boolean | undefined;
10
- bordered?: boolean | undefined;
7
+ hoverTheme?: boolean | undefined;
8
+ pressTheme?: boolean | undefined;
9
+ focusTheme?: boolean | undefined;
10
+ circular?: boolean | undefined;
11
+ elevate?: boolean | undefined;
12
+ bordered?: number | boolean | undefined;
11
13
  size?: import("@tamagui/core").SizeTokens | undefined;
12
- disabled?: boolean | undefined;
13
- transparent?: boolean | undefined;
14
- chromeless?: boolean | undefined;
15
14
  } & import("@tamagui/core").MediaProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
16
- fullscreen?: boolean | undefined;
17
- elevation?: import("@tamagui/core").SizeTokens | undefined;
18
- }, "focusable" | "fontFamily" | "disabled" | "size" | "transparent" | "hoverable" | "pressable" | "bordered" | "chromeless"> & {
15
+ readonly fullscreen?: boolean | undefined;
16
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
17
+ }, "fontFamily" | "size" | "hoverTheme" | "pressTheme" | "focusTheme" | "circular" | "elevate" | "bordered"> & {
19
18
  fontFamily?: unknown;
20
- hoverable?: boolean | undefined;
21
- pressable?: boolean | undefined;
22
- focusable?: boolean | undefined;
23
- bordered?: boolean | undefined;
19
+ hoverTheme?: boolean | undefined;
20
+ pressTheme?: boolean | undefined;
21
+ focusTheme?: boolean | undefined;
22
+ circular?: boolean | undefined;
23
+ elevate?: boolean | undefined;
24
+ bordered?: number | boolean | undefined;
24
25
  size?: import("@tamagui/core").SizeTokens | undefined;
25
- disabled?: boolean | undefined;
26
- transparent?: boolean | undefined;
27
- chromeless?: boolean | undefined;
28
26
  }>> & import("@tamagui/core").PseudoProps<Partial<Omit<import("react-native").ViewProps, "display" | "children"> & import("@tamagui/core").RNWViewProps & import("@tamagui/core").TamaguiComponentPropsBase & import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase> & import("@tamagui/core").WithShorthands<import("@tamagui/core").WithThemeValues<import("@tamagui/core").StackStylePropsBase>> & Omit<{
29
- fullscreen?: boolean | undefined;
30
- elevation?: import("@tamagui/core").SizeTokens | undefined;
31
- }, "focusable" | "fontFamily" | "disabled" | "size" | "transparent" | "hoverable" | "pressable" | "bordered" | "chromeless"> & {
27
+ readonly fullscreen?: boolean | undefined;
28
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
29
+ }, "fontFamily" | "size" | "hoverTheme" | "pressTheme" | "focusTheme" | "circular" | "elevate" | "bordered"> & {
32
30
  fontFamily?: unknown;
33
- hoverable?: boolean | undefined;
34
- pressable?: boolean | undefined;
35
- focusable?: boolean | undefined;
36
- bordered?: boolean | undefined;
31
+ hoverTheme?: boolean | undefined;
32
+ pressTheme?: boolean | undefined;
33
+ focusTheme?: boolean | undefined;
34
+ circular?: boolean | undefined;
35
+ elevate?: boolean | undefined;
36
+ bordered?: number | boolean | undefined;
37
37
  size?: import("@tamagui/core").SizeTokens | undefined;
38
- disabled?: boolean | undefined;
39
- transparent?: boolean | undefined;
40
- chromeless?: boolean | undefined;
41
38
  }>>, any, import("@tamagui/core").StackPropsBase, {
42
- fullscreen?: boolean | undefined;
43
- elevation?: import("@tamagui/core").SizeTokens | undefined;
39
+ readonly fullscreen?: boolean | undefined;
40
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
44
41
  } & {
45
42
  fontFamily?: unknown;
46
- hoverable?: boolean | undefined;
47
- pressable?: boolean | undefined;
48
- focusable?: boolean | undefined;
49
- bordered?: boolean | undefined;
43
+ hoverTheme?: boolean | undefined;
44
+ pressTheme?: boolean | undefined;
45
+ focusTheme?: boolean | undefined;
46
+ circular?: boolean | undefined;
47
+ elevate?: boolean | undefined;
48
+ bordered?: number | boolean | undefined;
50
49
  size?: import("@tamagui/core").SizeTokens | undefined;
51
- disabled?: boolean | undefined;
52
- transparent?: boolean | undefined;
53
- chromeless?: boolean | undefined;
54
50
  }>;
55
51
  export declare type SizableStackProps = GetProps<typeof SizableStack>;
56
52
  //# sourceMappingURL=SizableStack.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"SizableStack.d.ts","sourceRoot":"","sources":["../src/SizableStack.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAyB,MAAM,eAAe,CAAA;AAI/D,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAyFvB,CAAA;AAEF,oBAAY,iBAAiB,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAA"}
1
+ {"version":3,"file":"SizableStack.d.ts","sourceRoot":"","sources":["../src/SizableStack.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAyB,MAAM,eAAe,CAAA;AAK/D,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAqBvB,CAAA;AAEF,oBAAY,iBAAiB,GAAG,QAAQ,CAAC,OAAO,YAAY,CAAC,CAAA"}