@tamagui/stacks 1.0.1-beta.41 → 1.0.1-beta.44

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 (23) hide show
  1. package/dist/cjs/Stacks.js +10 -16
  2. package/dist/cjs/Stacks.js.map +2 -2
  3. package/dist/cjs/ThemeableStack.js +7 -4
  4. package/dist/cjs/ThemeableStack.js.map +2 -2
  5. package/dist/cjs/variants.js +15 -5
  6. package/dist/cjs/variants.js.map +2 -2
  7. package/dist/esm/Stacks.js +10 -16
  8. package/dist/esm/Stacks.js.map +2 -2
  9. package/dist/esm/ThemeableStack.js +17 -5
  10. package/dist/esm/ThemeableStack.js.map +2 -2
  11. package/dist/esm/variants.js +12 -3
  12. package/dist/esm/variants.js.map +2 -2
  13. package/dist/jsx/Stacks.js +10 -16
  14. package/dist/jsx/ThemeableStack.js +17 -5
  15. package/dist/jsx/variants.js +12 -3
  16. package/package.json +3 -3
  17. package/types/SizableStack.d.ts +8 -8
  18. package/types/Stacks.d.ts +32 -32
  19. package/types/Stacks.d.ts.map +1 -1
  20. package/types/ThemeableStack.d.ts +23 -15
  21. package/types/ThemeableStack.d.ts.map +1 -1
  22. package/types/variants.d.ts +8 -2
  23. package/types/variants.d.ts.map +1 -1
package/dist/cjs/Stacks.js CHANGED
@@ -39,29 +39,23 @@ const fullscreenStyle = {
39
39
  right: 0,
40
40
  bottom: 0
41
41
  };
42
+ const variants = {
43
+ fullscreen: {
44
+ true: fullscreenStyle
45
+ },
46
+ elevation: {
47
+ "...size": getElevation
48
+ }
49
+ };
42
50
  const YStack = (0, import_core.styled)(import_core.Stack, {
43
51
  flexDirection: "column",
44
52
  name: "YStack",
45
- variants: {
46
- fullscreen: {
47
- true: fullscreenStyle
48
- },
49
- elevation: {
50
- "...size": getElevation
51
- }
52
- }
53
+ variants
53
54
  });
54
55
  const XStack = (0, import_core.styled)(import_core.Stack, {
55
56
  flexDirection: "row",
56
57
  name: "XStack",
57
- variants: {
58
- fullscreen: {
59
- true: fullscreenStyle
60
- },
61
- elevation: {
62
- "...size": getElevation
63
- }
64
- }
58
+ variants
65
59
  });
66
60
  const ZStack = (0, import_core.styled)(YStack, {
67
61
  name: "ZStack",
package/dist/cjs/Stacks.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Stacks.tsx"],
4
- "sourcesContent": ["import {\n GetProps,\n SizeTokens,\n SizeVariantSpreadFunction,\n Stack,\n StackProps,\n VariantSpreadExtras,\n getVariableValue,\n isVariable,\n styled,\n} from '@tamagui/core'\n\nexport type YStackProps = GetProps<typeof YStack>\nexport type XStackProps = GetProps<typeof YStack>\nexport type ZStackProps = GetProps<typeof ZStack>\n\nexport const getElevation: SizeVariantSpreadFunction<StackProps> = (size, extras) => {\n const { tokens } = extras\n const token = tokens.size[size]\n const sizeNum = (isVariable(token) ? +token.val : size) as number\n // TODO this could be configurable with require('tamagui').configure({ elevation: () => {} })\n return getSizedElevation(sizeNum, extras)\n}\n\nconst fullscreenStyle = {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n} as const\n\nexport const YStack = styled(Stack, {\n flexDirection: 'column',\n name: 'YStack',\n variants: {\n fullscreen: {\n true: fullscreenStyle,\n },\n elevation: {\n '...size': getElevation,\n },\n },\n})\n\nexport const XStack = styled(Stack, {\n flexDirection: 'row',\n name: 'XStack',\n variants: {\n fullscreen: {\n true: fullscreenStyle,\n },\n elevation: {\n '...size': getElevation,\n },\n },\n})\n\nexport const ZStack = styled(\n YStack,\n {\n name: 'ZStack',\n position: 'relative',\n },\n {\n neverFlatten: true,\n isZStack: true,\n }\n)\n\nexport const getSizedElevation = (\n val: SizeTokens | number | boolean,\n { theme, tokens }: VariantSpreadExtras<any>\n) => {\n const num =\n val === false\n ? 0\n : val === true\n ? // handles true\n (() => {\n const val = getVariableValue(tokens.size['true'])\n if (typeof val === 'number') {\n return val\n }\n return 10\n })()\n : +val\n const [height, shadowRadius] = [Math.round(num / 4 + 1), Math.round(num / 2 + 2)]\n const shadow = {\n shadowColor: theme.shadowColor,\n shadowRadius,\n shadowOffset: { height, width: 0 },\n }\n return shadow\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAUO;AAMA,MAAM,eAAsD,wBAAC,MAAM,WAAW;AACnF,QAAM,EAAE,WAAW;AACnB,QAAM,QAAQ,OAAO,KAAK;AAC1B,QAAM,UAAW,4BAAW,KAAK,IAAI,CAAC,MAAM,MAAM;AAElD,SAAO,kBAAkB,SAAS,MAAM;AAC1C,GANmE;AAQnE,MAAM,kBAAkB;AAAA,EACtB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AACV;AAEO,MAAM,SAAS,wBAAO,mBAAO;AAAA,EAClC,eAAe;AAAA,EACf,MAAM;AAAA,EACN,UAAU;AAAA,IACR,YAAY;AAAA,MACV,MAAM;AAAA,IACR;AAAA,IACA,WAAW;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;AAEM,MAAM,SAAS,wBAAO,mBAAO;AAAA,EAClC,eAAe;AAAA,EACf,MAAM;AAAA,EACN,UAAU;AAAA,IACR,YAAY;AAAA,MACV,MAAM;AAAA,IACR;AAAA,IACA,WAAW;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;AAEM,MAAM,SAAS,wBACpB,QACA;AAAA,EACE,MAAM;AAAA,EACN,UAAU;AACZ,GACA;AAAA,EACE,cAAc;AAAA,EACd,UAAU;AACZ,CACF;AAEO,MAAM,oBAAoB,wBAC/B,KACA,EAAE,OAAO,aACN;AACH,QAAM,MACJ,QAAQ,QACJ,IACA,QAAQ,OAEP,OAAM;AACL,UAAM,OAAM,kCAAiB,OAAO,KAAK,OAAO;AAChD,QAAI,OAAO,SAAQ,UAAU;AAC3B,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,IACH,CAAC;AACP,QAAM,CAAC,QAAQ,gBAAgB,CAAC,KAAK,MAAM,MAAM,IAAI,CAAC,GAAG,KAAK,MAAM,MAAM,IAAI,CAAC,CAAC;AAChF,QAAM,SAAS;AAAA,IACb,aAAa,MAAM;AAAA,IACnB;AAAA,IACA,cAAc,EAAE,QAAQ,OAAO,EAAE;AAAA,EACnC;AACA,SAAO;AACT,GAxBiC;",
4
+ "sourcesContent": ["import {\n GetProps,\n SizeTokens,\n SizeVariantSpreadFunction,\n Stack,\n StackProps,\n VariantSpreadExtras,\n getVariableValue,\n isVariable,\n styled,\n} from '@tamagui/core'\n\nexport type YStackProps = GetProps<typeof YStack>\nexport type XStackProps = YStackProps\nexport type ZStackProps = YStackProps\n\nexport const getElevation: SizeVariantSpreadFunction<StackProps> = (size, extras) => {\n const { tokens } = extras\n const token = tokens.size[size]\n const sizeNum = (isVariable(token) ? +token.val : size) as number\n // TODO this could be configurable with require('tamagui').configure({ elevation: () => {} })\n return getSizedElevation(sizeNum, extras)\n}\n\nconst fullscreenStyle = {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n} as const\n\nconst variants = {\n fullscreen: {\n true: fullscreenStyle,\n },\n elevation: {\n '...size': getElevation,\n },\n} as const\n\nexport const YStack = styled(Stack, {\n flexDirection: 'column',\n name: 'YStack',\n variants,\n})\n\nexport const XStack = styled(Stack, {\n flexDirection: 'row',\n name: 'XStack',\n variants,\n})\n\nexport const ZStack = styled(\n YStack,\n {\n name: 'ZStack',\n position: 'relative',\n },\n {\n neverFlatten: true,\n isZStack: true,\n }\n)\n\nexport const getSizedElevation = (\n val: SizeTokens | number | boolean,\n { theme, tokens }: VariantSpreadExtras<any>\n) => {\n const num =\n val === false\n ? 0\n : val === true\n ? // handles true\n (() => {\n const val = getVariableValue(tokens.size['true'])\n if (typeof val === 'number') {\n return val\n }\n return 10\n })()\n : +val\n const [height, shadowRadius] = [Math.round(num / 4 + 1), Math.round(num / 2 + 2)]\n const shadow = {\n shadowColor: theme.shadowColor,\n shadowRadius,\n shadowOffset: { height, width: 0 },\n }\n return shadow\n}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAUO;AAMA,MAAM,eAAsD,wBAAC,MAAM,WAAW;AACnF,QAAM,EAAE,WAAW;AACnB,QAAM,QAAQ,OAAO,KAAK;AAC1B,QAAM,UAAW,4BAAW,KAAK,IAAI,CAAC,MAAM,MAAM;AAElD,SAAO,kBAAkB,SAAS,MAAM;AAC1C,GANmE;AAQnE,MAAM,kBAAkB;AAAA,EACtB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AACV;AAEA,MAAM,WAAW;AAAA,EACf,YAAY;AAAA,IACV,MAAM;AAAA,EACR;AAAA,EACA,WAAW;AAAA,IACT,WAAW;AAAA,EACb;AACF;AAEO,MAAM,SAAS,wBAAO,mBAAO;AAAA,EAClC,eAAe;AAAA,EACf,MAAM;AAAA,EACN;AACF,CAAC;AAEM,MAAM,SAAS,wBAAO,mBAAO;AAAA,EAClC,eAAe;AAAA,EACf,MAAM;AAAA,EACN;AACF,CAAC;AAEM,MAAM,SAAS,wBACpB,QACA;AAAA,EACE,MAAM;AAAA,EACN,UAAU;AACZ,GACA;AAAA,EACE,cAAc;AAAA,EACd,UAAU;AACZ,CACF;AAEO,MAAM,oBAAoB,wBAC/B,KACA,EAAE,OAAO,aACN;AACH,QAAM,MACJ,QAAQ,QACJ,IACA,QAAQ,OAEP,OAAM;AACL,UAAM,OAAM,kCAAiB,OAAO,KAAK,OAAO;AAChD,QAAI,OAAO,SAAQ,UAAU;AAC3B,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,IACH,CAAC;AACP,QAAM,CAAC,QAAQ,gBAAgB,CAAC,KAAK,MAAM,MAAM,IAAI,CAAC,GAAG,KAAK,MAAM,MAAM,IAAI,CAAC,CAAC;AAChF,QAAM,SAAS;AAAA,IACb,aAAa,MAAM;AAAA,IACnB;AAAA,IACA,cAAc,EAAE,QAAQ,OAAO,EAAE;AAAA,EACnC;AACA,SAAO;AACT,GAxBiC;",
6
6
  "names": []
7
7
  }
package/dist/cjs/ThemeableStack.js CHANGED
@@ -25,16 +25,19 @@ var import_Stacks = require("./Stacks");
25
25
  var import_variants = require("./variants");
26
26
  const ThemeableStack = (0, import_core.styled)(import_Stacks.YStack, {
27
27
  name: "SizableStack",
28
- backgroundColor: "$background",
29
- flexDirection: "row",
30
- flexShrink: 1,
31
28
  variants: {
32
29
  fontFamily: () => ({}),
30
+ backgrounded: {
31
+ true: {
32
+ backgroundColor: "$background"
33
+ }
34
+ },
35
+ radiused: import_variants.radiused,
33
36
  hoverable: import_variants.hoverable,
34
37
  pressable: import_variants.pressable,
35
38
  focusable: import_variants.focusable,
36
39
  circular: import_variants.circular,
37
- pad: import_variants.pad,
40
+ padded: import_variants.padded,
38
41
  elevate: import_variants.elevate,
39
42
  bordered: import_variants.bordered,
40
43
  transparent: {
package/dist/cjs/ThemeableStack.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/ThemeableStack.tsx"],
4
- "sourcesContent": ["import { GetProps, styled } from '@tamagui/core'\n\nimport { YStack } from './Stacks'\nimport { bordered, circular, elevate, focusable, hoverable, pad, pressable } from './variants'\n\nexport const ThemeableStack = styled(YStack, {\n name: 'SizableStack',\n backgroundColor: '$background',\n flexDirection: 'row',\n flexShrink: 1,\n\n variants: {\n // allows the type to come in for use in size\n fontFamily: () => ({}),\n\n hoverable,\n pressable,\n focusable,\n circular,\n pad,\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\nconst Test = styled(ThemeableStack, {\n variants: {\n something: {\n true: {},\n },\n },\n})\n\ntype T = GetProps<typeof Test>\ntype x = T['chromeless']\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAiC;AAEjC,oBAAuB;AACvB,sBAAkF;AAE3E,MAAM,iBAAiB,wBAAO,sBAAQ;AAAA,EAC3C,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,YAAY;AAAA,EAEZ,UAAU;AAAA,IAER,YAAY,MAAO,EAAC;AAAA,IAEpB;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;AAID,MAAM,OAAO,wBAAO,gBAAgB;AAAA,EAClC,UAAU;AAAA,IACR,WAAW;AAAA,MACT,MAAM,CAAC;AAAA,IACT;AAAA,EACF;AACF,CAAC;",
4
+ "sourcesContent": ["import { GetProps, styled } from '@tamagui/core'\n\nimport { YStack } from './Stacks'\nimport {\n bordered,\n circular,\n elevate,\n focusable,\n hoverable,\n padded,\n pressable,\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 hoverable,\n pressable,\n focusable,\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\nconst Test = styled(ThemeableStack, {\n variants: {\n something: {\n true: {},\n },\n },\n})\n\ntype T = GetProps<typeof Test>\ntype x = T['chromeless']\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAiC;AAEjC,oBAAuB;AACvB,sBASO;AAEA,MAAM,iBAAiB,wBAAO,sBAAQ;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;AAID,MAAM,OAAO,wBAAO,gBAAgB;AAAA,EAClC,UAAU;AAAA,IACR,WAAW;AAAA,MACT,MAAM,CAAC;AAAA,IACT;AAAA,EACF;AACF,CAAC;",
6
6
  "names": []
7
7
  }
package/dist/cjs/variants.js CHANGED
@@ -38,8 +38,9 @@ __export(variants_exports, {
38
38
  focusable: () => focusable,
39
39
  getCircleSize: () => getCircleSize,
40
40
  hoverable: () => hoverable,
41
- pad: () => pad,
42
- pressable: () => pressable
41
+ padded: () => padded,
42
+ pressable: () => pressable,
43
+ radiused: () => radiused
43
44
  });
44
45
  module.exports = __toCommonJS(variants_exports);
45
46
  var import_core = require("@tamagui/core");
@@ -73,7 +74,7 @@ const bordered = /* @__PURE__ */ __name((val, { props }) => {
73
74
  }
74
75
  });
75
76
  }, "bordered");
76
- const pad = {
77
+ const padded = {
77
78
  true: (_, extras) => {
78
79
  const { tokens, props } = extras;
79
80
  return {
@@ -81,6 +82,14 @@ const pad = {
81
82
  };
82
83
  }
83
84
  };
85
+ const radiused = {
86
+ true: (_, extras) => {
87
+ const { tokens, props } = extras;
88
+ return {
89
+ borderRadius: tokens.radius[props.size] || tokens.radius["$4"]
90
+ };
91
+ }
92
+ };
84
93
  const circular = {
85
94
  true: (_, extras) => {
86
95
  const { props } = extras;
@@ -148,7 +157,8 @@ const focusable = {
148
157
  focusable,
149
158
  getCircleSize,
150
159
  hoverable,
151
- pad,
152
- pressable
160
+ padded,
161
+ pressable,
162
+ radiused
153
163
  });
154
164
  //# sourceMappingURL=variants.js.map
package/dist/cjs/variants.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/variants.tsx"],
4
- "sourcesContent": ["import { ScaleVariantExtras, SizeTokens, buttonScaling, getSizeScaledToFont } from '@tamagui/core'\n\nimport { getElevation } from './Stacks'\n\nexport function getCircleSize(size: SizeTokens, extras: ScaleVariantExtras) {\n const sizeVal = size ?? '$4'\n const scale = getSizeScaledToFont(sizeVal, buttonScaling, extras)\n return scale.minHeight\n}\n\nexport const elevate = {\n true: (_, extras) => {\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.hoverable && {\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n }),\n\n ...(props.pressable && {\n pressStyle: {\n borderColor: '$borderColorPress',\n },\n }),\n\n ...(props.focusable && {\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n }),\n }\n}\n\nexport const pad = {\n true: (_, extras) => {\n const { tokens, props } = extras\n return {\n padding: tokens.size[props.size] || tokens.size['$4'],\n }\n },\n}\n\nexport const circular = {\n true: (_, extras) => {\n const { props } = extras\n const size = getCircleSize(props.size, extras)\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 hoverable = {\n true: {\n hoverStyle: {\n backgroundColor: '$backgroundHover',\n borderColor: '$borderColorHover',\n },\n },\n false: {\n hoverStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n\nexport const pressable = {\n true: {\n pressStyle: {\n backgroundColor: '$backgroundPress',\n borderColor: '$borderColorPress',\n },\n },\n false: {\n pressStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n\nexport const focusable = {\n true: {\n focusStyle: {\n backgroundColor: '$backgroundFocus',\n borderColor: '$borderColorFocus',\n },\n },\n false: {\n focusStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n"],
5
- "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAmF;AAEnF,oBAA6B;AAEtB,uBAAuB,MAAkB,QAA4B;AAC1E,QAAM,UAAU,QAAQ;AACxB,QAAM,QAAQ,qCAAoB,SAAS,2BAAe,MAAM;AAChE,SAAO,MAAM;AACf;AAJgB;AAMT,MAAM,UAAU;AAAA,EACrB,MAAM,CAAC,GAAG,WAAW;AACnB,WAAO,gCAAa,OAAO,MAAM,SAAS,MAAM;AAAA,EAClD;AACF;AAEO,MAAM,WAAW,wBAAC,KAAuB,EAAE,YAAY;AAC5D,SAAO;AAAA,IAEL,aAAa,OAAO,QAAQ,WAAW,MAAM;AAAA,IAC7C,aAAa;AAAA,KAET,MAAM,aAAa;AAAA,IACrB,YAAY;AAAA,MACV,aAAa;AAAA,IACf;AAAA,EACF,IAEI,MAAM,aAAa;AAAA,IACrB,YAAY;AAAA,MACV,aAAa;AAAA,IACf;AAAA,EACF,IAEI,MAAM,aAAa;AAAA,IACrB,YAAY;AAAA,MACV,aAAa;AAAA,IACf;AAAA,EACF;AAEJ,GAxBwB;AA0BjB,MAAM,MAAM;AAAA,EACjB,MAAM,CAAC,GAAG,WAAW;AACnB,UAAM,EAAE,QAAQ,UAAU;AAC1B,WAAO;AAAA,MACL,SAAS,OAAO,KAAK,MAAM,SAAS,OAAO,KAAK;AAAA,IAClD;AAAA,EACF;AACF;AAEO,MAAM,WAAW;AAAA,EACtB,MAAM,CAAC,GAAG,WAAW;AACnB,UAAM,EAAE,UAAU;AAClB,UAAM,OAAO,cAAc,MAAM,MAAM,MAAM;AAC7C,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,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import { ScaleVariantExtras, SizeTokens, buttonScaling, getSizeScaledToFont } from '@tamagui/core'\n\nimport { getElevation } from './Stacks'\n\nexport function getCircleSize(size: SizeTokens, extras: ScaleVariantExtras) {\n const sizeVal = size ?? '$4'\n const scale = getSizeScaledToFont(sizeVal, buttonScaling, extras)\n return scale.minHeight\n}\n\nexport const elevate = {\n true: (_, extras) => {\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.hoverable && {\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n }),\n\n ...(props.pressable && {\n pressStyle: {\n borderColor: '$borderColorPress',\n },\n }),\n\n ...(props.focusable && {\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.size[props.size] || tokens.size['$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: (_, extras) => {\n const { props } = extras\n const size = getCircleSize(props.size, extras)\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 hoverable = {\n true: {\n hoverStyle: {\n backgroundColor: '$backgroundHover',\n borderColor: '$borderColorHover',\n },\n },\n false: {\n hoverStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n\nexport const pressable = {\n true: {\n pressStyle: {\n backgroundColor: '$backgroundPress',\n borderColor: '$borderColorPress',\n },\n },\n false: {\n pressStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n\nexport const focusable = {\n true: {\n focusStyle: {\n backgroundColor: '$backgroundFocus',\n borderColor: '$borderColorFocus',\n },\n },\n false: {\n focusStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n"],
5
+ "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAAmF;AAEnF,oBAA6B;AAEtB,uBAAuB,MAAkB,QAA4B;AAC1E,QAAM,UAAU,QAAQ;AACxB,QAAM,QAAQ,qCAAoB,SAAS,2BAAe,MAAM;AAChE,SAAO,MAAM;AACf;AAJgB;AAMT,MAAM,UAAU;AAAA,EACrB,MAAM,CAAC,GAAG,WAAW;AACnB,WAAO,gCAAa,OAAO,MAAM,SAAS,MAAM;AAAA,EAClD;AACF;AAEO,MAAM,WAAW,wBAAC,KAAuB,EAAE,YAAY;AAC5D,SAAO;AAAA,IAEL,aAAa,OAAO,QAAQ,WAAW,MAAM;AAAA,IAC7C,aAAa;AAAA,KAET,MAAM,aAAa;AAAA,IACrB,YAAY;AAAA,MACV,aAAa;AAAA,IACf;AAAA,EACF,IAEI,MAAM,aAAa;AAAA,IACrB,YAAY;AAAA,MACV,aAAa;AAAA,IACf;AAAA,EACF,IAEI,MAAM,aAAa;AAAA,IACrB,YAAY;AAAA,MACV,aAAa;AAAA,IACf;AAAA,EACF;AAEJ,GAxBwB;AA0BjB,MAAM,SAAS;AAAA,EACpB,MAAM,CAAC,GAAG,WAAW;AACnB,UAAM,EAAE,QAAQ,UAAU;AAC1B,WAAO;AAAA,MACL,SAAS,OAAO,KAAK,MAAM,SAAS,OAAO,KAAK;AAAA,IAClD;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,WAAW;AACnB,UAAM,EAAE,UAAU;AAClB,UAAM,OAAO,cAAc,MAAM,MAAM,MAAM;AAC7C,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,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/esm/Stacks.js CHANGED
@@ -19,29 +19,23 @@ const fullscreenStyle = {
19
19
  right: 0,
20
20
  bottom: 0
21
21
  };
22
+ const variants = {
23
+ fullscreen: {
24
+ true: fullscreenStyle
25
+ },
26
+ elevation: {
27
+ "...size": getElevation
28
+ }
29
+ };
22
30
  const YStack = styled(Stack, {
23
31
  flexDirection: "column",
24
32
  name: "YStack",
25
- variants: {
26
- fullscreen: {
27
- true: fullscreenStyle
28
- },
29
- elevation: {
30
- "...size": getElevation
31
- }
32
- }
33
+ variants
33
34
  });
34
35
  const XStack = styled(Stack, {
35
36
  flexDirection: "row",
36
37
  name: "XStack",
37
- variants: {
38
- fullscreen: {
39
- true: fullscreenStyle
40
- },
41
- elevation: {
42
- "...size": getElevation
43
- }
44
- }
38
+ variants
45
39
  });
46
40
  const ZStack = styled(YStack, {
47
41
  name: "ZStack",
package/dist/esm/Stacks.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/Stacks.tsx"],
4
- "sourcesContent": ["import {\n GetProps,\n SizeTokens,\n SizeVariantSpreadFunction,\n Stack,\n StackProps,\n VariantSpreadExtras,\n getVariableValue,\n isVariable,\n styled,\n} from '@tamagui/core'\n\nexport type YStackProps = GetProps<typeof YStack>\nexport type XStackProps = GetProps<typeof YStack>\nexport type ZStackProps = GetProps<typeof ZStack>\n\nexport const getElevation: SizeVariantSpreadFunction<StackProps> = (size, extras) => {\n const { tokens } = extras\n const token = tokens.size[size]\n const sizeNum = (isVariable(token) ? +token.val : size) as number\n // TODO this could be configurable with require('tamagui').configure({ elevation: () => {} })\n return getSizedElevation(sizeNum, extras)\n}\n\nconst fullscreenStyle = {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n} as const\n\nexport const YStack = styled(Stack, {\n flexDirection: 'column',\n name: 'YStack',\n variants: {\n fullscreen: {\n true: fullscreenStyle,\n },\n elevation: {\n '...size': getElevation,\n },\n },\n})\n\nexport const XStack = styled(Stack, {\n flexDirection: 'row',\n name: 'XStack',\n variants: {\n fullscreen: {\n true: fullscreenStyle,\n },\n elevation: {\n '...size': getElevation,\n },\n },\n})\n\nexport const ZStack = styled(\n YStack,\n {\n name: 'ZStack',\n position: 'relative',\n },\n {\n neverFlatten: true,\n isZStack: true,\n }\n)\n\nexport const getSizedElevation = (\n val: SizeTokens | number | boolean,\n { theme, tokens }: VariantSpreadExtras<any>\n) => {\n const num =\n val === false\n ? 0\n : val === true\n ? // handles true\n (() => {\n const val = getVariableValue(tokens.size['true'])\n if (typeof val === 'number') {\n return val\n }\n return 10\n })()\n : +val\n const [height, shadowRadius] = [Math.round(num / 4 + 1), Math.round(num / 2 + 2)]\n const shadow = {\n shadowColor: theme.shadowColor,\n shadowRadius,\n shadowOffset: { height, width: 0 },\n }\n return shadow\n}\n"],
5
- "mappings": ";;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBO,MAAM,eAAsD,wBAAC,MAAM,WAAW;AACnF,QAAM,EAAE,WAAW;AACnB,QAAM,QAAQ,OAAO,KAAK;AAC1B,QAAM,UAAW,WAAW,KAAK,IAAI,CAAC,MAAM,MAAM;AAElD,SAAO,kBAAkB,SAAS,MAAM;AAC1C,GANmE;AAQnE,MAAM,kBAAkB;AAAA,EACtB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AACV;AAEO,MAAM,SAAS,OAAO,OAAO;AAAA,EAClC,eAAe;AAAA,EACf,MAAM;AAAA,EACN,UAAU;AAAA,IACR,YAAY;AAAA,MACV,MAAM;AAAA,IACR;AAAA,IACA,WAAW;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;AAEM,MAAM,SAAS,OAAO,OAAO;AAAA,EAClC,eAAe;AAAA,EACf,MAAM;AAAA,EACN,UAAU;AAAA,IACR,YAAY;AAAA,MACV,MAAM;AAAA,IACR;AAAA,IACA,WAAW;AAAA,MACT,WAAW;AAAA,IACb;AAAA,EACF;AACF,CAAC;AAEM,MAAM,SAAS,OACpB,QACA;AAAA,EACE,MAAM;AAAA,EACN,UAAU;AACZ,GACA;AAAA,EACE,cAAc;AAAA,EACd,UAAU;AACZ,CACF;AAEO,MAAM,oBAAoB,wBAC/B,KACA,EAAE,OAAO,aACN;AACH,QAAM,MACJ,QAAQ,QACJ,IACA,QAAQ,OAEP,OAAM;AACL,UAAM,OAAM,iBAAiB,OAAO,KAAK,OAAO;AAChD,QAAI,OAAO,SAAQ,UAAU;AAC3B,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,IACH,CAAC;AACP,QAAM,CAAC,QAAQ,gBAAgB,CAAC,KAAK,MAAM,MAAM,IAAI,CAAC,GAAG,KAAK,MAAM,MAAM,IAAI,CAAC,CAAC;AAChF,QAAM,SAAS;AAAA,IACb,aAAa,MAAM;AAAA,IACnB;AAAA,IACA,cAAc,EAAE,QAAQ,OAAO,EAAE;AAAA,EACnC;AACA,SAAO;AACT,GAxBiC;",
4
+ "sourcesContent": ["import {\n GetProps,\n SizeTokens,\n SizeVariantSpreadFunction,\n Stack,\n StackProps,\n VariantSpreadExtras,\n getVariableValue,\n isVariable,\n styled,\n} from '@tamagui/core'\n\nexport type YStackProps = GetProps<typeof YStack>\nexport type XStackProps = YStackProps\nexport type ZStackProps = YStackProps\n\nexport const getElevation: SizeVariantSpreadFunction<StackProps> = (size, extras) => {\n const { tokens } = extras\n const token = tokens.size[size]\n const sizeNum = (isVariable(token) ? +token.val : size) as number\n // TODO this could be configurable with require('tamagui').configure({ elevation: () => {} })\n return getSizedElevation(sizeNum, extras)\n}\n\nconst fullscreenStyle = {\n position: 'absolute',\n top: 0,\n left: 0,\n right: 0,\n bottom: 0,\n} as const\n\nconst variants = {\n fullscreen: {\n true: fullscreenStyle,\n },\n elevation: {\n '...size': getElevation,\n },\n} as const\n\nexport const YStack = styled(Stack, {\n flexDirection: 'column',\n name: 'YStack',\n variants,\n})\n\nexport const XStack = styled(Stack, {\n flexDirection: 'row',\n name: 'XStack',\n variants,\n})\n\nexport const ZStack = styled(\n YStack,\n {\n name: 'ZStack',\n position: 'relative',\n },\n {\n neverFlatten: true,\n isZStack: true,\n }\n)\n\nexport const getSizedElevation = (\n val: SizeTokens | number | boolean,\n { theme, tokens }: VariantSpreadExtras<any>\n) => {\n const num =\n val === false\n ? 0\n : val === true\n ? // handles true\n (() => {\n const val = getVariableValue(tokens.size['true'])\n if (typeof val === 'number') {\n return val\n }\n return 10\n })()\n : +val\n const [height, shadowRadius] = [Math.round(num / 4 + 1), Math.round(num / 2 + 2)]\n const shadow = {\n shadowColor: theme.shadowColor,\n shadowRadius,\n shadowOffset: { height, width: 0 },\n }\n return shadow\n}\n"],
5
+ "mappings": ";;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAgBO,MAAM,eAAsD,wBAAC,MAAM,WAAW;AACnF,QAAM,EAAE,WAAW;AACnB,QAAM,QAAQ,OAAO,KAAK;AAC1B,QAAM,UAAW,WAAW,KAAK,IAAI,CAAC,MAAM,MAAM;AAElD,SAAO,kBAAkB,SAAS,MAAM;AAC1C,GANmE;AAQnE,MAAM,kBAAkB;AAAA,EACtB,UAAU;AAAA,EACV,KAAK;AAAA,EACL,MAAM;AAAA,EACN,OAAO;AAAA,EACP,QAAQ;AACV;AAEA,MAAM,WAAW;AAAA,EACf,YAAY;AAAA,IACV,MAAM;AAAA,EACR;AAAA,EACA,WAAW;AAAA,IACT,WAAW;AAAA,EACb;AACF;AAEO,MAAM,SAAS,OAAO,OAAO;AAAA,EAClC,eAAe;AAAA,EACf,MAAM;AAAA,EACN;AACF,CAAC;AAEM,MAAM,SAAS,OAAO,OAAO;AAAA,EAClC,eAAe;AAAA,EACf,MAAM;AAAA,EACN;AACF,CAAC;AAEM,MAAM,SAAS,OACpB,QACA;AAAA,EACE,MAAM;AAAA,EACN,UAAU;AACZ,GACA;AAAA,EACE,cAAc;AAAA,EACd,UAAU;AACZ,CACF;AAEO,MAAM,oBAAoB,wBAC/B,KACA,EAAE,OAAO,aACN;AACH,QAAM,MACJ,QAAQ,QACJ,IACA,QAAQ,OAEP,OAAM;AACL,UAAM,OAAM,iBAAiB,OAAO,KAAK,OAAO;AAChD,QAAI,OAAO,SAAQ,UAAU;AAC3B,aAAO;AAAA,IACT;AACA,WAAO;AAAA,EACT,GAAG,IACH,CAAC;AACP,QAAM,CAAC,QAAQ,gBAAgB,CAAC,KAAK,MAAM,MAAM,IAAI,CAAC,GAAG,KAAK,MAAM,MAAM,IAAI,CAAC,CAAC;AAChF,QAAM,SAAS;AAAA,IACb,aAAa,MAAM;AAAA,IACnB;AAAA,IACA,cAAc,EAAE,QAAQ,OAAO,EAAE;AAAA,EACnC;AACA,SAAO;AACT,GAxBiC;",
6
6
  "names": []
7
7
  }
package/dist/esm/ThemeableStack.js CHANGED
@@ -1,18 +1,30 @@
1
1
  import { styled } from "@tamagui/core";
2
2
  import { YStack } from "./Stacks";
3
- import { bordered, circular, elevate, focusable, hoverable, pad, pressable } from "./variants";
3
+ import {
4
+ bordered,
5
+ circular,
6
+ elevate,
7
+ focusable,
8
+ hoverable,
9
+ padded,
10
+ pressable,
11
+ radiused
12
+ } from "./variants";
4
13
  const ThemeableStack = styled(YStack, {
5
14
  name: "SizableStack",
6
- backgroundColor: "$background",
7
- flexDirection: "row",
8
- flexShrink: 1,
9
15
  variants: {
10
16
  fontFamily: () => ({}),
17
+ backgrounded: {
18
+ true: {
19
+ backgroundColor: "$background"
20
+ }
21
+ },
22
+ radiused,
11
23
  hoverable,
12
24
  pressable,
13
25
  focusable,
14
26
  circular,
15
- pad,
27
+ padded,
16
28
  elevate,
17
29
  bordered,
18
30
  transparent: {
package/dist/esm/ThemeableStack.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/ThemeableStack.tsx"],
4
- "sourcesContent": ["import { GetProps, styled } from '@tamagui/core'\n\nimport { YStack } from './Stacks'\nimport { bordered, circular, elevate, focusable, hoverable, pad, pressable } from './variants'\n\nexport const ThemeableStack = styled(YStack, {\n name: 'SizableStack',\n backgroundColor: '$background',\n flexDirection: 'row',\n flexShrink: 1,\n\n variants: {\n // allows the type to come in for use in size\n fontFamily: () => ({}),\n\n hoverable,\n pressable,\n focusable,\n circular,\n pad,\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\nconst Test = styled(ThemeableStack, {\n variants: {\n something: {\n true: {},\n },\n },\n})\n\ntype T = GetProps<typeof Test>\ntype x = T['chromeless']\n"],
5
- "mappings": "AAAA;AAEA;AACA;AAEO,MAAM,iBAAiB,OAAO,QAAQ;AAAA,EAC3C,MAAM;AAAA,EACN,iBAAiB;AAAA,EACjB,eAAe;AAAA,EACf,YAAY;AAAA,EAEZ,UAAU;AAAA,IAER,YAAY,MAAO,EAAC;AAAA,IAEpB;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;AAID,MAAM,OAAO,OAAO,gBAAgB;AAAA,EAClC,UAAU;AAAA,IACR,WAAW;AAAA,MACT,MAAM,CAAC;AAAA,IACT;AAAA,EACF;AACF,CAAC;",
4
+ "sourcesContent": ["import { GetProps, styled } from '@tamagui/core'\n\nimport { YStack } from './Stacks'\nimport {\n bordered,\n circular,\n elevate,\n focusable,\n hoverable,\n padded,\n pressable,\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 hoverable,\n pressable,\n focusable,\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\nconst Test = styled(ThemeableStack, {\n variants: {\n something: {\n true: {},\n },\n },\n})\n\ntype T = GetProps<typeof Test>\ntype x = T['chromeless']\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;AAID,MAAM,OAAO,OAAO,gBAAgB;AAAA,EAClC,UAAU;AAAA,IACR,WAAW;AAAA,MACT,MAAM,CAAC;AAAA,IACT;AAAA,EACF;AACF,CAAC;",
6
6
  "names": []
7
7
  }
package/dist/esm/variants.js CHANGED
@@ -34,7 +34,7 @@ const bordered = /* @__PURE__ */ __name((val, { props }) => {
34
34
  }
35
35
  };
36
36
  }, "bordered");
37
- const pad = {
37
+ const padded = {
38
38
  true: (_, extras) => {
39
39
  const { tokens, props } = extras;
40
40
  return {
@@ -42,6 +42,14 @@ const pad = {
42
42
  };
43
43
  }
44
44
  };
45
+ const radiused = {
46
+ true: (_, extras) => {
47
+ const { tokens, props } = extras;
48
+ return {
49
+ borderRadius: tokens.radius[props.size] || tokens.radius["$4"]
50
+ };
51
+ }
52
+ };
45
53
  const circular = {
46
54
  true: (_, extras) => {
47
55
  const { props } = extras;
@@ -108,7 +116,8 @@ export {
108
116
  focusable,
109
117
  getCircleSize,
110
118
  hoverable,
111
- pad,
112
- pressable
119
+ padded,
120
+ pressable,
121
+ radiused
113
122
  };
114
123
  //# sourceMappingURL=variants.js.map
package/dist/esm/variants.js.map CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/variants.tsx"],
4
- "sourcesContent": ["import { ScaleVariantExtras, SizeTokens, buttonScaling, getSizeScaledToFont } from '@tamagui/core'\n\nimport { getElevation } from './Stacks'\n\nexport function getCircleSize(size: SizeTokens, extras: ScaleVariantExtras) {\n const sizeVal = size ?? '$4'\n const scale = getSizeScaledToFont(sizeVal, buttonScaling, extras)\n return scale.minHeight\n}\n\nexport const elevate = {\n true: (_, extras) => {\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.hoverable && {\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n }),\n\n ...(props.pressable && {\n pressStyle: {\n borderColor: '$borderColorPress',\n },\n }),\n\n ...(props.focusable && {\n focusStyle: {\n borderColor: '$borderColorFocus',\n },\n }),\n }\n}\n\nexport const pad = {\n true: (_, extras) => {\n const { tokens, props } = extras\n return {\n padding: tokens.size[props.size] || tokens.size['$4'],\n }\n },\n}\n\nexport const circular = {\n true: (_, extras) => {\n const { props } = extras\n const size = getCircleSize(props.size, extras)\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 hoverable = {\n true: {\n hoverStyle: {\n backgroundColor: '$backgroundHover',\n borderColor: '$borderColorHover',\n },\n },\n false: {\n hoverStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n\nexport const pressable = {\n true: {\n pressStyle: {\n backgroundColor: '$backgroundPress',\n borderColor: '$borderColorPress',\n },\n },\n false: {\n pressStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n\nexport const focusable = {\n true: {\n focusStyle: {\n backgroundColor: '$backgroundFocus',\n borderColor: '$borderColorFocus',\n },\n },\n false: {\n focusStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n"],
5
- "mappings": ";;AAAA;AAEA;AAEO,uBAAuB,MAAkB,QAA4B;AAC1E,QAAM,UAAU,sBAAQ;AACxB,QAAM,QAAQ,oBAAoB,SAAS,eAAe,MAAM;AAChE,SAAO,MAAM;AACf;AAJgB;AAMT,MAAM,UAAU;AAAA,EACrB,MAAM,CAAC,GAAG,WAAW;AACnB,WAAO,aAAa,OAAO,MAAM,SAAS,MAAM;AAAA,EAClD;AACF;AAEO,MAAM,WAAW,wBAAC,KAAuB,EAAE,YAAY;AAC5D,SAAO;AAAA,IAEL,aAAa,OAAO,QAAQ,WAAW,MAAM;AAAA,IAC7C,aAAa;AAAA,OAET,MAAM,aAAa;AAAA,MACrB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,OAEI,MAAM,aAAa;AAAA,MACrB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,OAEI,MAAM,aAAa;AAAA,MACrB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,EACF;AACF,GAxBwB;AA0BjB,MAAM,MAAM;AAAA,EACjB,MAAM,CAAC,GAAG,WAAW;AACnB,UAAM,EAAE,QAAQ,UAAU;AAC1B,WAAO;AAAA,MACL,SAAS,OAAO,KAAK,MAAM,SAAS,OAAO,KAAK;AAAA,IAClD;AAAA,EACF;AACF;AAEO,MAAM,WAAW;AAAA,EACtB,MAAM,CAAC,GAAG,WAAW;AACnB,UAAM,EAAE,UAAU;AAClB,UAAM,OAAO,cAAc,MAAM,MAAM,MAAM;AAC7C,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,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;",
4
+ "sourcesContent": ["import { ScaleVariantExtras, SizeTokens, buttonScaling, getSizeScaledToFont } from '@tamagui/core'\n\nimport { getElevation } from './Stacks'\n\nexport function getCircleSize(size: SizeTokens, extras: ScaleVariantExtras) {\n const sizeVal = size ?? '$4'\n const scale = getSizeScaledToFont(sizeVal, buttonScaling, extras)\n return scale.minHeight\n}\n\nexport const elevate = {\n true: (_, extras) => {\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.hoverable && {\n hoverStyle: {\n borderColor: '$borderColorHover',\n },\n }),\n\n ...(props.pressable && {\n pressStyle: {\n borderColor: '$borderColorPress',\n },\n }),\n\n ...(props.focusable && {\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.size[props.size] || tokens.size['$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: (_, extras) => {\n const { props } = extras\n const size = getCircleSize(props.size, extras)\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 hoverable = {\n true: {\n hoverStyle: {\n backgroundColor: '$backgroundHover',\n borderColor: '$borderColorHover',\n },\n },\n false: {\n hoverStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n\nexport const pressable = {\n true: {\n pressStyle: {\n backgroundColor: '$backgroundPress',\n borderColor: '$borderColorPress',\n },\n },\n false: {\n pressStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n\nexport const focusable = {\n true: {\n focusStyle: {\n backgroundColor: '$backgroundFocus',\n borderColor: '$borderColorFocus',\n },\n },\n false: {\n focusStyle: {\n backgroundColor: '$background',\n borderColor: '$borderColor',\n },\n },\n}\n"],
5
+ "mappings": ";;AAAA;AAEA;AAEO,uBAAuB,MAAkB,QAA4B;AAC1E,QAAM,UAAU,sBAAQ;AACxB,QAAM,QAAQ,oBAAoB,SAAS,eAAe,MAAM;AAChE,SAAO,MAAM;AACf;AAJgB;AAMT,MAAM,UAAU;AAAA,EACrB,MAAM,CAAC,GAAG,WAAW;AACnB,WAAO,aAAa,OAAO,MAAM,SAAS,MAAM;AAAA,EAClD;AACF;AAEO,MAAM,WAAW,wBAAC,KAAuB,EAAE,YAAY;AAC5D,SAAO;AAAA,IAEL,aAAa,OAAO,QAAQ,WAAW,MAAM;AAAA,IAC7C,aAAa;AAAA,OAET,MAAM,aAAa;AAAA,MACrB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,OAEI,MAAM,aAAa;AAAA,MACrB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,OAEI,MAAM,aAAa;AAAA,MACrB,YAAY;AAAA,QACV,aAAa;AAAA,MACf;AAAA,IACF;AAAA,EACF;AACF,GAxBwB;AA0BjB,MAAM,SAAS;AAAA,EACpB,MAAM,CAAC,GAAG,WAAW;AACnB,UAAM,EAAE,QAAQ,UAAU;AAC1B,WAAO;AAAA,MACL,SAAS,OAAO,KAAK,MAAM,SAAS,OAAO,KAAK;AAAA,IAClD;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,WAAW;AACnB,UAAM,EAAE,UAAU;AAClB,UAAM,OAAO,cAAc,MAAM,MAAM,MAAM;AAC7C,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,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;AAEO,MAAM,YAAY;AAAA,EACvB,MAAM;AAAA,IACJ,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AAAA,EACA,OAAO;AAAA,IACL,YAAY;AAAA,MACV,iBAAiB;AAAA,MACjB,aAAa;AAAA,IACf;AAAA,EACF;AACF;",
6
6
  "names": []
7
7
  }
package/dist/jsx/Stacks.js CHANGED
@@ -19,29 +19,23 @@ const fullscreenStyle = {
19
19
  right: 0,
20
20
  bottom: 0
21
21
  };
22
+ const variants = {
23
+ fullscreen: {
24
+ true: fullscreenStyle
25
+ },
26
+ elevation: {
27
+ "...size": getElevation
28
+ }
29
+ };
22
30
  const YStack = styled(Stack, {
23
31
  flexDirection: "column",
24
32
  name: "YStack",
25
- variants: {
26
- fullscreen: {
27
- true: fullscreenStyle
28
- },
29
- elevation: {
30
- "...size": getElevation
31
- }
32
- }
33
+ variants
33
34
  });
34
35
  const XStack = styled(Stack, {
35
36
  flexDirection: "row",
36
37
  name: "XStack",
37
- variants: {
38
- fullscreen: {
39
- true: fullscreenStyle
40
- },
41
- elevation: {
42
- "...size": getElevation
43
- }
44
- }
38
+ variants
45
39
  });
46
40
  const ZStack = styled(YStack, {
47
41
  name: "ZStack",
package/dist/jsx/ThemeableStack.js CHANGED
@@ -1,18 +1,30 @@
1
1
  import { styled } from "@tamagui/core";
2
2
  import { YStack } from "./Stacks";
3
- import { bordered, circular, elevate, focusable, hoverable, pad, pressable } from "./variants";
3
+ import {
4
+ bordered,
5
+ circular,
6
+ elevate,
7
+ focusable,
8
+ hoverable,
9
+ padded,
10
+ pressable,
11
+ radiused
12
+ } from "./variants";
4
13
  const ThemeableStack = styled(YStack, {
5
14
  name: "SizableStack",
6
- backgroundColor: "$background",
7
- flexDirection: "row",
8
- flexShrink: 1,
9
15
  variants: {
10
16
  fontFamily: () => ({}),
17
+ backgrounded: {
18
+ true: {
19
+ backgroundColor: "$background"
20
+ }
21
+ },
22
+ radiused,
11
23
  hoverable,
12
24
  pressable,
13
25
  focusable,
14
26
  circular,
15
- pad,
27
+ padded,
16
28
  elevate,
17
29
  bordered,
18
30
  transparent: {
package/dist/jsx/variants.js CHANGED
@@ -34,7 +34,7 @@ const bordered = /* @__PURE__ */ __name((val, { props }) => {
34
34
  }
35
35
  };
36
36
  }, "bordered");
37
- const pad = {
37
+ const padded = {
38
38
  true: (_, extras) => {
39
39
  const { tokens, props } = extras;
40
40
  return {
@@ -42,6 +42,14 @@ const pad = {
42
42
  };
43
43
  }
44
44
  };
45
+ const radiused = {
46
+ true: (_, extras) => {
47
+ const { tokens, props } = extras;
48
+ return {
49
+ borderRadius: tokens.radius[props.size] || tokens.radius["$4"]
50
+ };
51
+ }
52
+ };
45
53
  const circular = {
46
54
  true: (_, extras) => {
47
55
  const { props } = extras;
@@ -108,6 +116,7 @@ export {
108
116
  focusable,
109
117
  getCircleSize,
110
118
  hoverable,
111
- pad,
112
- pressable
119
+ padded,
120
+ pressable,
121
+ radiused
113
122
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/stacks",
3
- "version": "1.0.1-beta.41",
3
+ "version": "1.0.1-beta.44",
4
4
  "sideEffects": false,
5
5
  "source": "src/index.ts",
6
6
  "types": "./types/index.d.ts",
@@ -16,14 +16,14 @@
16
16
  "watch": "tamagui-build --watch"
17
17
  },
18
18
  "dependencies": {
19
- "@tamagui/core": "^1.0.1-beta.41"
19
+ "@tamagui/core": "^1.0.1-beta.44"
20
20
  },
21
21
  "peerDependencies": {
22
22
  "react": "*",
23
23
  "react-dom": "*"
24
24
  },
25
25
  "devDependencies": {
26
- "@tamagui/build": "^1.0.1-beta.41",
26
+ "@tamagui/build": "^1.0.1-beta.44",
27
27
  "react": "*",
28
28
  "react-dom": "*"
29
29
  },
package/types/SizableStack.d.ts CHANGED
@@ -1,7 +1,7 @@
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;
3
+ readonly fullscreen?: boolean | undefined;
4
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
5
5
  }, "focusable" | "fontFamily" | "size" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered"> & {
6
6
  fontFamily?: unknown;
7
7
  hoverable?: boolean | undefined;
@@ -12,8 +12,8 @@ export declare const SizableStack: import("@tamagui/core").TamaguiComponent<Omit
12
12
  bordered?: number | boolean | undefined;
13
13
  size?: import("@tamagui/core").SizeTokens | undefined;
14
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<{
15
- fullscreen?: boolean | undefined;
16
- elevation?: import("@tamagui/core").SizeTokens | undefined;
15
+ readonly fullscreen?: boolean | undefined;
16
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
17
17
  }, "focusable" | "fontFamily" | "size" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered"> & {
18
18
  fontFamily?: unknown;
19
19
  hoverable?: boolean | undefined;
@@ -24,8 +24,8 @@ export declare const SizableStack: import("@tamagui/core").TamaguiComponent<Omit
24
24
  bordered?: number | boolean | undefined;
25
25
  size?: import("@tamagui/core").SizeTokens | undefined;
26
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<{
27
- fullscreen?: boolean | undefined;
28
- elevation?: import("@tamagui/core").SizeTokens | undefined;
27
+ readonly fullscreen?: boolean | undefined;
28
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
29
29
  }, "focusable" | "fontFamily" | "size" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered"> & {
30
30
  fontFamily?: unknown;
31
31
  hoverable?: boolean | undefined;
@@ -36,8 +36,8 @@ export declare const SizableStack: import("@tamagui/core").TamaguiComponent<Omit
36
36
  bordered?: number | boolean | undefined;
37
37
  size?: import("@tamagui/core").SizeTokens | undefined;
38
38
  }>>, any, import("@tamagui/core").StackPropsBase, {
39
- fullscreen?: boolean | undefined;
40
- elevation?: import("@tamagui/core").SizeTokens | undefined;
39
+ readonly fullscreen?: boolean | undefined;
40
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
41
41
  } & {
42
42
  fontFamily?: unknown;
43
43
  hoverable?: boolean | undefined;
package/types/Stacks.d.ts CHANGED
@@ -1,61 +1,61 @@
1
1
  import { GetProps, SizeTokens, SizeVariantSpreadFunction, StackProps, VariantSpreadExtras } from '@tamagui/core';
2
2
  export declare type YStackProps = GetProps<typeof YStack>;
3
- export declare type XStackProps = GetProps<typeof YStack>;
4
- export declare type ZStackProps = GetProps<typeof ZStack>;
3
+ export declare type XStackProps = YStackProps;
4
+ export declare type ZStackProps = YStackProps;
5
5
  export declare const getElevation: SizeVariantSpreadFunction<StackProps>;
6
6
  export declare const YStack: 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<{}, "elevation" | "fullscreen"> & {
7
- fullscreen?: boolean | undefined;
8
- elevation?: SizeTokens | undefined;
7
+ readonly fullscreen?: boolean | undefined;
8
+ readonly elevation?: SizeTokens | undefined;
9
9
  } & 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<{}, "elevation" | "fullscreen"> & {
10
- fullscreen?: boolean | undefined;
11
- elevation?: SizeTokens | undefined;
10
+ readonly fullscreen?: boolean | undefined;
11
+ readonly elevation?: SizeTokens | undefined;
12
12
  }>> & 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<{}, "elevation" | "fullscreen"> & {
13
- fullscreen?: boolean | undefined;
14
- elevation?: SizeTokens | undefined;
13
+ readonly fullscreen?: boolean | undefined;
14
+ readonly elevation?: SizeTokens | undefined;
15
15
  }>>, any, import("@tamagui/core").StackPropsBase, {
16
- fullscreen?: boolean | undefined;
17
- elevation?: SizeTokens | undefined;
16
+ readonly fullscreen?: boolean | undefined;
17
+ readonly elevation?: SizeTokens | undefined;
18
18
  }>;
19
19
  export declare const XStack: 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<{}, "elevation" | "fullscreen"> & {
20
- fullscreen?: boolean | undefined;
21
- elevation?: SizeTokens | undefined;
20
+ readonly fullscreen?: boolean | undefined;
21
+ readonly elevation?: SizeTokens | undefined;
22
22
  } & 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<{}, "elevation" | "fullscreen"> & {
23
- fullscreen?: boolean | undefined;
24
- elevation?: SizeTokens | undefined;
23
+ readonly fullscreen?: boolean | undefined;
24
+ readonly elevation?: SizeTokens | undefined;
25
25
  }>> & 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<{}, "elevation" | "fullscreen"> & {
26
- fullscreen?: boolean | undefined;
27
- elevation?: SizeTokens | undefined;
26
+ readonly fullscreen?: boolean | undefined;
27
+ readonly elevation?: SizeTokens | undefined;
28
28
  }>>, any, import("@tamagui/core").StackPropsBase, {
29
- fullscreen?: boolean | undefined;
30
- elevation?: SizeTokens | undefined;
29
+ readonly fullscreen?: boolean | undefined;
30
+ readonly elevation?: SizeTokens | undefined;
31
31
  }>;
32
32
  export declare const ZStack: 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<{}, "elevation" | "fullscreen"> & {
33
- fullscreen?: boolean | undefined;
34
- elevation?: SizeTokens | undefined;
33
+ readonly fullscreen?: boolean | undefined;
34
+ readonly elevation?: SizeTokens | undefined;
35
35
  } & 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<{}, "elevation" | "fullscreen"> & {
36
- fullscreen?: boolean | undefined;
37
- elevation?: SizeTokens | undefined;
36
+ readonly fullscreen?: boolean | undefined;
37
+ readonly elevation?: SizeTokens | undefined;
38
38
  }>> & 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<{}, "elevation" | "fullscreen"> & {
39
- fullscreen?: boolean | undefined;
40
- elevation?: SizeTokens | undefined;
39
+ readonly fullscreen?: boolean | undefined;
40
+ readonly elevation?: SizeTokens | undefined;
41
41
  }>>) | (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<{
42
- fullscreen?: boolean | undefined;
43
- elevation?: SizeTokens | undefined;
42
+ readonly fullscreen?: boolean | undefined;
43
+ readonly elevation?: SizeTokens | undefined;
44
44
  }, string | number> & {
45
45
  [x: string]: undefined;
46
46
  } & 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<{
47
- fullscreen?: boolean | undefined;
48
- elevation?: SizeTokens | undefined;
47
+ readonly fullscreen?: boolean | undefined;
48
+ readonly elevation?: SizeTokens | undefined;
49
49
  }, string | number> & {
50
50
  [x: string]: undefined;
51
51
  }>> & 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<{
52
- fullscreen?: boolean | undefined;
53
- elevation?: SizeTokens | undefined;
52
+ readonly fullscreen?: boolean | undefined;
53
+ readonly elevation?: SizeTokens | undefined;
54
54
  }, string | number> & {
55
55
  [x: string]: undefined;
56
56
  }>>), any, import("@tamagui/core").StackPropsBase, {
57
- fullscreen?: boolean | undefined;
58
- elevation?: SizeTokens | undefined;
57
+ readonly fullscreen?: boolean | undefined;
58
+ readonly elevation?: SizeTokens | undefined;
59
59
  } & ({} | {
60
60
  [x: string]: undefined;
61
61
  })>;
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,EACL,QAAQ,EACR,UAAU,EACV,yBAAyB,EAEzB,UAAU,EACV,mBAAmB,EAIpB,MAAM,eAAe,CAAA;AAEtB,oBAAY,WAAW,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAA;AACjD,oBAAY,WAAW,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAA;AACjD,oBAAY,WAAW,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAA;AAEjD,eAAO,MAAM,YAAY,EAAE,yBAAyB,CAAC,UAAU,CAM9D,CAAA;AAUD,eAAO,MAAM,MAAM;;;;;;;;;;;;EAWjB,CAAA;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;EAWjB,CAAA;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAUlB,CAAA;AAED,eAAO,MAAM,iBAAiB,QACvB,UAAU,GAAG,MAAM,GAAG,OAAO,qBACf,oBAAoB,GAAG,CAAC;;;;;;;CAsB5C,CAAA"}
1
+ {"version":3,"file":"Stacks.d.ts","sourceRoot":"","sources":["../src/Stacks.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,QAAQ,EACR,UAAU,EACV,yBAAyB,EAEzB,UAAU,EACV,mBAAmB,EAIpB,MAAM,eAAe,CAAA;AAEtB,oBAAY,WAAW,GAAG,QAAQ,CAAC,OAAO,MAAM,CAAC,CAAA;AACjD,oBAAY,WAAW,GAAG,WAAW,CAAA;AACrC,oBAAY,WAAW,GAAG,WAAW,CAAA;AAErC,eAAO,MAAM,YAAY,EAAE,yBAAyB,CAAC,UAAU,CAM9D,CAAA;AAmBD,eAAO,MAAM,MAAM;;;;;;;;;;;;EAIjB,CAAA;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;EAIjB,CAAA;AAEF,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAUlB,CAAA;AAED,eAAO,MAAM,iBAAiB,QACvB,UAAU,GAAG,MAAM,GAAG,OAAO,qBACf,oBAAoB,GAAG,CAAC;;;;;;;CAsB5C,CAAA"}
package/types/ThemeableStack.d.ts CHANGED
@@ -1,56 +1,64 @@
1
1
  import { GetProps } from '@tamagui/core';
2
2
  export declare const ThemeableStack: 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" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered" | "transparent" | "pad" | "chromeless"> & {
3
+ readonly fullscreen?: boolean | undefined;
4
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
5
+ }, "focusable" | "fontFamily" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered" | "transparent" | "backgrounded" | "radiused" | "padded" | "chromeless"> & {
6
6
  fontFamily?: unknown;
7
+ backgrounded?: boolean | undefined;
8
+ radiused?: boolean | undefined;
7
9
  hoverable?: boolean | undefined;
8
10
  pressable?: boolean | undefined;
9
11
  focusable?: boolean | undefined;
10
12
  circular?: boolean | undefined;
11
- pad?: boolean | undefined;
13
+ padded?: boolean | undefined;
12
14
  elevate?: boolean | undefined;
13
15
  bordered?: number | boolean | undefined;
14
16
  transparent?: boolean | undefined;
15
17
  chromeless?: boolean | undefined;
16
18
  } & 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<{
17
- fullscreen?: boolean | undefined;
18
- elevation?: import("@tamagui/core").SizeTokens | undefined;
19
- }, "focusable" | "fontFamily" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered" | "transparent" | "pad" | "chromeless"> & {
19
+ readonly fullscreen?: boolean | undefined;
20
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
21
+ }, "focusable" | "fontFamily" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered" | "transparent" | "backgrounded" | "radiused" | "padded" | "chromeless"> & {
20
22
  fontFamily?: unknown;
23
+ backgrounded?: boolean | undefined;
24
+ radiused?: boolean | undefined;
21
25
  hoverable?: boolean | undefined;
22
26
  pressable?: boolean | undefined;
23
27
  focusable?: boolean | undefined;
24
28
  circular?: boolean | undefined;
25
- pad?: boolean | undefined;
29
+ padded?: boolean | undefined;
26
30
  elevate?: boolean | undefined;
27
31
  bordered?: number | boolean | undefined;
28
32
  transparent?: boolean | undefined;
29
33
  chromeless?: boolean | undefined;
30
34
  }>> & 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<{
31
- fullscreen?: boolean | undefined;
32
- elevation?: import("@tamagui/core").SizeTokens | undefined;
33
- }, "focusable" | "fontFamily" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered" | "transparent" | "pad" | "chromeless"> & {
35
+ readonly fullscreen?: boolean | undefined;
36
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
37
+ }, "focusable" | "fontFamily" | "hoverable" | "pressable" | "circular" | "elevate" | "bordered" | "transparent" | "backgrounded" | "radiused" | "padded" | "chromeless"> & {
34
38
  fontFamily?: unknown;
39
+ backgrounded?: boolean | undefined;
40
+ radiused?: boolean | undefined;
35
41
  hoverable?: boolean | undefined;
36
42
  pressable?: boolean | undefined;
37
43
  focusable?: boolean | undefined;
38
44
  circular?: boolean | undefined;
39
- pad?: boolean | undefined;
45
+ padded?: boolean | undefined;
40
46
  elevate?: boolean | undefined;
41
47
  bordered?: number | boolean | undefined;
42
48
  transparent?: boolean | undefined;
43
49
  chromeless?: boolean | undefined;
44
50
  }>>, any, import("@tamagui/core").StackPropsBase, {
45
- fullscreen?: boolean | undefined;
46
- elevation?: import("@tamagui/core").SizeTokens | undefined;
51
+ readonly fullscreen?: boolean | undefined;
52
+ readonly elevation?: import("@tamagui/core").SizeTokens | undefined;
47
53
  } & {
48
54
  fontFamily?: unknown;
55
+ backgrounded?: boolean | undefined;
56
+ radiused?: boolean | undefined;
49
57
  hoverable?: boolean | undefined;
50
58
  pressable?: boolean | undefined;
51
59
  focusable?: boolean | undefined;
52
60
  circular?: boolean | undefined;
53
- pad?: boolean | undefined;
61
+ padded?: boolean | undefined;
54
62
  elevate?: boolean | undefined;
55
63
  bordered?: number | boolean | undefined;
56
64
  transparent?: boolean | undefined;
package/types/ThemeableStack.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ThemeableStack.d.ts","sourceRoot":"","sources":["../src/ThemeableStack.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAU,MAAM,eAAe,CAAA;AAKhD,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAgCzB,CAAA;AAEF,oBAAY,mBAAmB,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,CAAA"}
1
+ {"version":3,"file":"ThemeableStack.d.ts","sourceRoot":"","sources":["../src/ThemeableStack.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,QAAQ,EAAU,MAAM,eAAe,CAAA;AAchD,eAAO,MAAM,cAAc;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAoCzB,CAAA;AAEF,oBAAY,mBAAmB,GAAG,QAAQ,CAAC,OAAO,cAAc,CAAC,CAAA"}
package/types/variants.d.ts CHANGED
@@ -81,7 +81,8 @@ export declare const elevate: {
81
81
  onSelectionChangeShouldSetResponderCapture?: unknown;
82
82
  asChild?: boolean | import("@tamagui/core").Variable | undefined;
83
83
  space?: import("@tamagui/core").Variable | import("@tamagui/core").SpaceTokens | undefined;
84
- spaceDirection?: import("@tamagui/core").Variable | import("@tamagui/core").SpaceDirection;
84
+ spaceDirection?: import("@tamagui/core").Variable | import("@tamagui/core").SpaceFlexDirection;
85
+ separator?: import("react").ReactNode | import("@tamagui/core").Variable;
85
86
  dangerouslySetInnerHTML?: import("@tamagui/core").Variable | {
86
87
  __html: string;
87
88
  } | undefined;
@@ -212,11 +213,16 @@ export declare const elevate: {
212
213
  export declare const bordered: (val: boolean | number, { props }: {
213
214
  props: any;
214
215
  }) => any;
215
- export declare const pad: {
216
+ export declare const padded: {
216
217
  true: (_: any, extras: any) => {
217
218
  padding: any;
218
219
  };
219
220
  };
221
+ export declare const radiused: {
222
+ true: (_: any, extras: any) => {
223
+ borderRadius: any;
224
+ };
225
+ };
220
226
  export declare const circular: {
221
227
  true: (_: any, extras: any) => {
222
228
  width: number;
package/types/variants.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../src/variants.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAsC,MAAM,eAAe,CAAA;AAIlG,wBAAgB,aAAa,CAAC,IAAI,EAAE,UAAU,EAAE,MAAM,EAAE,kBAAkB,UAIzE;AAED,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAInB,CAAA;AAED,eAAO,MAAM,QAAQ,QAAS,OAAO,GAAG,MAAM;;SAwB7C,CAAA;AAED,eAAO,MAAM,GAAG;;;;CAOf,CAAA;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;CAgBpB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAA"}
1
+ {"version":3,"file":"variants.d.ts","sourceRoot":"","sources":["../src/variants.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,kBAAkB,EAAE,UAAU,EAAsC,MAAM,eAAe,CAAA;AAIlG,wBAAgB,aAAa,CAAC,IAAI,EAAE,UAAU,EAAE,MAAM,EAAE,kBAAkB,UAIzE;AAED,eAAO,MAAM,OAAO;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAInB,CAAA;AAED,eAAO,MAAM,QAAQ,QAAS,OAAO,GAAG,MAAM;;SAwB7C,CAAA;AAED,eAAO,MAAM,MAAM;;;;CAOlB,CAAA;AAED,eAAO,MAAM,QAAQ;;;;CAOpB,CAAA;AAED,eAAO,MAAM,QAAQ;;;;;;;;;;;;CAgBpB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAA;AAED,eAAO,MAAM,SAAS;;;;;;;;;;;;;CAarB,CAAA"}