@tamagui/core 1.0.0-beta.5 → 1.0.0-beta.8

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 (67) hide show
  1. package/dist/cjs/createComponent.js +13 -5
  2. package/dist/cjs/createComponent.js.map +2 -2
  3. package/dist/cjs/helpers/createPropMapper.js +2 -1
  4. package/dist/cjs/helpers/createPropMapper.js.map +2 -2
  5. package/dist/cjs/helpers/fixNativeShadow.native.js +3 -0
  6. package/dist/cjs/helpers/fixNativeShadow.native.js.map +2 -2
  7. package/dist/cjs/helpers/getButtonSize.js +45 -0
  8. package/dist/cjs/helpers/getButtonSize.js.map +7 -0
  9. package/dist/cjs/helpers/getTextSize.js +56 -0
  10. package/dist/cjs/helpers/getTextSize.js.map +7 -0
  11. package/dist/cjs/helpers/insertStyleRule.js +1 -0
  12. package/dist/cjs/helpers/insertStyleRule.js.map +2 -2
  13. package/dist/cjs/hooks/useId.js +59 -0
  14. package/dist/cjs/hooks/useId.js.map +7 -0
  15. package/dist/cjs/index.js +9 -6
  16. package/dist/cjs/index.js.map +2 -2
  17. package/dist/cjs/styled.js +5 -1
  18. package/dist/cjs/styled.js.map +2 -2
  19. package/dist/cjs/types.js.map +1 -1
  20. package/dist/cjs/views/Slot.js +115 -0
  21. package/dist/cjs/views/Slot.js.map +7 -0
  22. package/dist/esm/createComponent.js +12 -5
  23. package/dist/esm/createComponent.js.map +2 -2
  24. package/dist/esm/helpers/createPropMapper.js +2 -1
  25. package/dist/esm/helpers/createPropMapper.js.map +2 -2
  26. package/dist/esm/helpers/fixNativeShadow.native.js +3 -0
  27. package/dist/esm/helpers/fixNativeShadow.native.js.map +2 -2
  28. package/dist/esm/helpers/getButtonSize.js +24 -0
  29. package/dist/esm/helpers/getButtonSize.js.map +7 -0
  30. package/dist/esm/helpers/getTextSize.js +34 -0
  31. package/dist/esm/helpers/getTextSize.js.map +7 -0
  32. package/dist/esm/helpers/insertStyleRule.js +1 -0
  33. package/dist/esm/helpers/insertStyleRule.js.map +2 -2
  34. package/dist/esm/hooks/useId.js +35 -0
  35. package/dist/esm/hooks/useId.js.map +7 -0
  36. package/dist/esm/index.js +9 -6
  37. package/dist/esm/index.js.map +2 -2
  38. package/dist/esm/styled.js +5 -1
  39. package/dist/esm/styled.js.map +2 -2
  40. package/dist/esm/views/Slot.js +63 -0
  41. package/dist/esm/views/Slot.js.map +7 -0
  42. package/dist/jsx/createComponent.js +12 -5
  43. package/dist/jsx/helpers/createPropMapper.js +2 -1
  44. package/dist/jsx/helpers/fixNativeShadow.native.js +3 -0
  45. package/dist/jsx/helpers/getButtonSize.js +23 -0
  46. package/dist/jsx/helpers/getTextSize.js +33 -0
  47. package/dist/jsx/helpers/insertStyleRule.js +1 -0
  48. package/dist/jsx/hooks/useId.js +34 -0
  49. package/dist/jsx/index.js +9 -6
  50. package/dist/jsx/styled.js +5 -1
  51. package/dist/jsx/views/Slot.js +56 -0
  52. package/package.json +5 -5
  53. package/types/createComponent.d.ts.map +1 -1
  54. package/types/helpers/getButtonSize.d.ts +8 -0
  55. package/types/helpers/getButtonSize.d.ts.map +1 -0
  56. package/types/helpers/getTextSize.d.ts +3 -0
  57. package/types/helpers/getTextSize.d.ts.map +1 -0
  58. package/types/helpers/insertStyleRule.d.ts.map +1 -1
  59. package/types/hooks/useId.d.ts +9 -0
  60. package/types/hooks/useId.d.ts.map +1 -0
  61. package/types/index.d.ts +9 -6
  62. package/types/index.d.ts.map +1 -1
  63. package/types/styled.d.ts.map +1 -1
  64. package/types/types.d.ts +20 -5
  65. package/types/types.d.ts.map +1 -1
  66. package/types/views/Slot.d.ts +9 -0
  67. package/types/views/Slot.d.ts.map +1 -0
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "version": 3,
3
3
  "sources": ["../../src/styled.tsx"],
4
- "sourcesContent": ["import { Image, Text, TextInput } from 'react-native'\n\nimport { createComponent } from './createComponent'\nimport { RNComponents } from './helpers/RNComponents'\nimport {\n GetProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n VariantDefinitions,\n VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> = GetProps<ParentComponent> & {\n name?: string\n variants?: VariantDefinitions<ParentComponent> | undefined\n defaultVariants?: { [key: string]: any }\n}\n\nexport function styled<\n ParentComponent extends StylableComponent,\n Variants extends VariantDefinitions<ParentComponent> | symbol =\n | VariantDefinitions<ParentComponent>\n | symbol\n>(\n Component: ParentComponent,\n // this should be Partial<GetProps<ParentComponent>> but causes excessively deep type issues\n options?: GetProps<ParentComponent> & {\n name?: string\n variants?: Variants | undefined\n // thought i had this typed, but can't get it linked\n defaultVariants?: { [key: string]: any }\n },\n staticExtractionOptions?: Partial<StaticConfig>\n) {\n const staticConfigProps = (() => {\n if (options) {\n const { variants, name, defaultVariants, ...defaultProps } = options\n if (defaultVariants) {\n Object.assign(defaultProps, defaultVariants)\n }\n const isReactNativeWeb =\n 'staticConfig' in Component\n ? Component.staticConfig.isReactNativeWeb\n : RNComponents.has(Component)\n const isTamagui = !isReactNativeWeb && 'staticConfig' in Component\n const Comp = Component as any\n const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false))\n const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false))\n const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false))\n const conf: Partial<StaticConfig> = {\n ...staticExtractionOptions,\n ...(!isTamagui && {\n Component: Comp,\n }),\n isTamagui,\n // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above\n // take away the Partial<> and it's fine\n variants,\n defaultProps,\n defaultVariants,\n componentName: name,\n isReactNativeWeb,\n isInput,\n isText,\n isImage,\n }\n return conf\n }\n return {}\n })()\n\n const component = createComponent(staticConfigProps, Component)\n\n // get parent props without pseudos and medias so we can rebuild both with new variants\n type ParentPropsBase = ParentComponent extends TamaguiComponent<any, any, infer P>\n ? P\n : GetProps<ParentComponent>\n type ParentVariants = ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}\n\n type OurVariants = Variants extends symbol\n ? {}\n : {\n [Key in keyof Variants]?: Variants[Key] extends VariantSpreadFunction<any, infer Val>\n ? Val\n : GetVariantValues<keyof Variants[Key]>\n }\n\n type VariantProps = Omit<ParentVariants, keyof OurVariants> & OurVariants\n type OurPropsBase = ParentPropsBase & VariantProps\n\n type Props = Variants extends void | symbol\n ? GetProps<ParentComponent>\n : // start with base props\n OurPropsBase &\n // add in media (+ pseudos nested)\n MediaProps<Partial<OurPropsBase>> &\n // add in pseudos\n PseudoProps<Partial<OurPropsBase>>\n\n return component as TamaguiComponent<\n Props,\n // TODO infer ref\n any,\n ParentPropsBase,\n ParentVariants & OurVariants\n >\n}\n\n// test types:\n// // variants\n// export const XStack = styled(Stack, {\n// flexDirection: 'row',\n// name: 'XStack',\n// variants: {\n// fullscreen: {\n// true: {},\n// },\n// elevation: {\n// '...size': (val) => ({}),\n// },\n// },\n// })\n// const InBetween = styled(XStack, {})\n// type INBVariants = typeof InBetween extends TamaguiComponent<any, any, any, infer Variants> ? Variants: never\n// const SwitchFrame = styled(InBetween, {\n// name: 'Switch',\n// tag: 'button',\n// borderRadius: 100,\n// borderWidth: 0,\n// variants: {\n// name: {\n// true: {\n// backgroundColor: 'aliceblue'\n// },\n// // 1: {\n\n// // },\n// // ':number': (val) => {\n// // return {}\n// // },\n// // \"...fontSize\": (val) => {\n// // return {}\n// // },\n// // \"...color\": (val) => {\n// // return {}\n// // }\n// }\n// },\n// defaultVariants: {\n// size: '$4',\n// },\n// })\n// const x = <XStack fullscreen />\n// const y = <XStack fullscreen />\n// const z = <SwitchFrame fullscreen name />\n\n// depth:\n// export const SizableText = styled(Stack, {\n// name: 'SizableText',\n// backgroundColor: 'red',\n// variants: {\n// size: {\n// '...fontSize': (val, { props }) => {\n// return {\n// backgroundColor: '',\n// }\n// },\n// },\n// },\n// })\n// export const Heading = styled(SizableText, {\n// tag: 'span',\n// name: 'Heading',\n// accessibilityRole: 'header',\n// size: '$8',\n// margin: 0,\n// })\n// export const Paragraph = styled(SizableText, {\n// tag: 'p',\n// margin: 10,\n// variants: {\n// another: {\n// true: {},\n// },\n// },\n// })\n// export const Paragraph2 = styled(Paragraph, {\n// tag: 'p',\n// variants: {\n// another: {\n// '...color': (val) => ({\n// backgroundColor: 'red',\n// }),\n// },\n// },\n// })\n// const a = <SizableText size=\"$10\" />\n// const b = <Paragraph size=\"$10\" another />\n// const c = <Paragraph2 size=\"$10\" another=\"aliceblue\" />\n// export const SizableText2 = styled(SizableText, {\n// })\n// const xx = <SizableText2 abc />\n// export const Paragraph = styled(SizableText, {\n// name: 'Paragraph',\n// })\n// export const Heading = styled(Paragraph, {\n// tag: 'span',\n// margin: 0,\n// })\n// export const H2 = styled(Heading, {\n// name: 'H2',\n// })\n// const x = <H2 color=\"red\" />\n"],
5
- "mappings": ";;AAAA;AAEA;AACA;AAoBO,gBAML,WAEA,SAMA,yBACA;AACA,QAAM,oBAAqB,OAAM;AAC/B,QAAI,SAAS;AACX,YAAM,EAAE,UAAU,MAAM,oBAAoB,iBAAiB;AAC7D,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,mBACJ,kBAAkB,YACd,UAAU,aAAa,mBACvB,aAAa,IAAI,SAAS;AAChC,YAAM,YAAY,CAAC,oBAAoB,kBAAkB;AACzD,YAAM,OAAO;AACb,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,QAAQ;AAC1E,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,YAAY;AAC9E,YAAM,SAAS,CAAC,CAAE,cAAa,UAAW,EAAC,YAAY,WAAW,SAAS,OAAO;AAClF,YAAM,OAA8B;AAAA,WAC/B;AAAA,WACC,CAAC,aAAa;AAAA,UAChB,WAAW;AAAA,QACb;AAAA,QACA;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AACA,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AA4B9D,SAAO;AAOT;AAxFgB;",
4
+ "sourcesContent": ["import { Image, Text, TextInput } from 'react-native'\n\nimport { createComponent } from './createComponent'\nimport { RNComponents } from './helpers/RNComponents'\nimport {\n GetProps,\n GetVariantValues,\n MediaProps,\n PseudoProps,\n StaticConfig,\n StylableComponent,\n TamaguiComponent,\n VariantDefinitions,\n VariantSpreadFunction,\n} from './types'\n\n// TODO may be able to use this in the options?: arg below directly\nexport type StyledOptions<ParentComponent extends StylableComponent> = GetProps<ParentComponent> & {\n name?: string\n variants?: VariantDefinitions<ParentComponent> | undefined\n defaultVariants?: { [key: string]: any }\n}\n\nexport function styled<\n ParentComponent extends StylableComponent,\n Variants extends VariantDefinitions<ParentComponent> | symbol =\n | VariantDefinitions<ParentComponent>\n | symbol\n>(\n Component: ParentComponent,\n // this should be Partial<GetProps<ParentComponent>> but causes excessively deep type issues\n options?: GetProps<ParentComponent> & {\n name?: string\n variants?: Variants | undefined\n // thought i had this typed, but can't get it linked\n defaultVariants?: { [key: string]: any }\n },\n staticExtractionOptions?: Partial<StaticConfig>\n) {\n const staticConfigProps = (() => {\n if (options) {\n const { variants, name, defaultVariants, ...defaultProps } = options\n if (defaultVariants) {\n Object.assign(defaultProps, defaultVariants)\n }\n const isReactNativeWeb =\n 'staticConfig' in Component\n ? Component.staticConfig.isReactNativeWeb\n : RNComponents.has(Component)\n const reactNativeWebComponent = isReactNativeWeb\n ? Component['staticConfig']?.reactNativeWebComponent || Component\n : null\n const isTamagui = !isReactNativeWeb && 'staticConfig' in Component\n const Comp = reactNativeWebComponent || (Component as any)\n const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false))\n const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false))\n const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false))\n const conf: Partial<StaticConfig> = {\n ...staticExtractionOptions,\n ...(!isTamagui && {\n Component: Comp,\n }),\n isTamagui,\n // this type gets messed up by options?: Partial<GetProps<ParentComponent>> above\n // take away the Partial<> and it's fine\n variants,\n defaultProps,\n defaultVariants,\n componentName: name,\n isReactNativeWeb,\n // for nesting multiple levels of rnw styled() need keep use the OG component\n reactNativeWebComponent,\n isInput,\n isText,\n isImage,\n }\n\n console.log('makeme', name, Comp, conf)\n\n return conf\n }\n return {}\n })()\n\n const component = createComponent(staticConfigProps, Component)\n\n // get parent props without pseudos and medias so we can rebuild both with new variants\n type ParentPropsBase = ParentComponent extends TamaguiComponent<any, any, infer P>\n ? P\n : GetProps<ParentComponent>\n type ParentVariants = ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}\n\n type OurVariants = Variants extends symbol\n ? {}\n : {\n [Key in keyof Variants]?: Variants[Key] extends VariantSpreadFunction<any, infer Val>\n ? Val\n : GetVariantValues<keyof Variants[Key]>\n }\n\n type VariantProps = Omit<ParentVariants, keyof OurVariants> & OurVariants\n type OurPropsBase = ParentPropsBase & VariantProps\n\n type Props = Variants extends void | symbol\n ? GetProps<ParentComponent>\n : // start with base props\n OurPropsBase &\n // add in media (+ pseudos nested)\n MediaProps<Partial<OurPropsBase>> &\n // add in pseudos\n PseudoProps<Partial<OurPropsBase>>\n\n return component as TamaguiComponent<\n Props,\n // TODO infer ref\n any,\n ParentPropsBase,\n ParentVariants & OurVariants\n >\n}\n\n// test types:\n// // variants\n// export const XStack = styled(Stack, {\n// flexDirection: 'row',\n// name: 'XStack',\n// variants: {\n// fullscreen: {\n// true: {},\n// },\n// elevation: {\n// '...size': (val) => ({}),\n// },\n// },\n// })\n// const InBetween = styled(XStack, {})\n// type INBVariants = typeof InBetween extends TamaguiComponent<any, any, any, infer Variants> ? Variants: never\n// const SwitchFrame = styled(InBetween, {\n// name: 'Switch',\n// tag: 'button',\n// borderRadius: 100,\n// borderWidth: 0,\n// variants: {\n// name: {\n// true: {\n// backgroundColor: 'aliceblue'\n// },\n// // 1: {\n\n// // },\n// // ':number': (val) => {\n// // return {}\n// // },\n// // \"...fontSize\": (val) => {\n// // return {}\n// // },\n// // \"...color\": (val) => {\n// // return {}\n// // }\n// }\n// },\n// defaultVariants: {\n// size: '$4',\n// },\n// })\n// const x = <XStack fullscreen />\n// const y = <XStack fullscreen />\n// const z = <SwitchFrame fullscreen name />\n\n// depth:\n// export const SizableText = styled(Stack, {\n// name: 'SizableText',\n// backgroundColor: 'red',\n// variants: {\n// size: {\n// '...fontSize': (val, { props }) => {\n// return {\n// backgroundColor: '',\n// }\n// },\n// },\n// },\n// })\n// export const Heading = styled(SizableText, {\n// tag: 'span',\n// name: 'Heading',\n// accessibilityRole: 'header',\n// size: '$8',\n// margin: 0,\n// })\n// export const Paragraph = styled(SizableText, {\n// tag: 'p',\n// margin: 10,\n// variants: {\n// another: {\n// true: {},\n// },\n// },\n// })\n// export const Paragraph2 = styled(Paragraph, {\n// tag: 'p',\n// variants: {\n// another: {\n// '...color': (val) => ({\n// backgroundColor: 'red',\n// }),\n// },\n// },\n// })\n// const a = <SizableText size=\"$10\" />\n// const b = <Paragraph size=\"$10\" another />\n// const c = <Paragraph2 size=\"$10\" another=\"aliceblue\" />\n// export const SizableText2 = styled(SizableText, {\n// })\n// const xx = <SizableText2 abc />\n// export const Paragraph = styled(SizableText, {\n// name: 'Paragraph',\n// })\n// export const Heading = styled(Paragraph, {\n// tag: 'span',\n// margin: 0,\n// })\n// export const H2 = styled(Heading, {\n// name: 'H2',\n// })\n// const x = <H2 color=\"red\" />\n"],
5
+ "mappings": ";;AAAA;AAEA;AACA;AAoBO,gBAML,WAEA,SAMA,yBACA;AACA,QAAM,oBAAqB,OAAM;AAvCnC;AAwCI,QAAI,SAAS;AACX,YAAM,EAAE,UAAU,MAAM,oBAAoB,iBAAiB;AAC7D,UAAI,iBAAiB;AACnB,eAAO,OAAO,cAAc,eAAe;AAAA,MAC7C;AACA,YAAM,mBACJ,kBAAkB,YACd,UAAU,aAAa,mBACvB,aAAa,IAAI,SAAS;AAChC,YAAM,0BAA0B,mBAC5B,iBAAU,oBAAV,mBAA2B,4BAA2B,YACtD;AACJ,YAAM,YAAY,CAAC,oBAAoB,kBAAkB;AACzD,YAAM,OAAO,2BAA4B;AACzC,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,QAAQ;AAC1E,YAAM,UAAU,CAAC,CAAE,cAAa,WAAY,EAAC,YAAY,SAAS,YAAY;AAC9E,YAAM,SAAS,CAAC,CAAE,cAAa,UAAW,EAAC,YAAY,WAAW,SAAS,OAAO;AAClF,YAAM,OAA8B;AAAA,WAC/B;AAAA,WACC,CAAC,aAAa;AAAA,UAChB,WAAW;AAAA,QACb;AAAA,QACA;AAAA,QAGA;AAAA,QACA;AAAA,QACA;AAAA,QACA,eAAe;AAAA,QACf;AAAA,QAEA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MACF;AAEA,cAAQ,IAAI,UAAU,MAAM,MAAM,IAAI;AAEtC,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AA4B9D,SAAO;AAOT;AAhGgB;",
6
6
  "names": []
7
7
  }
@@ -0,0 +1,63 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
+ import { composeRefs } from "@tamagui/compose-refs";
4
+ import * as React from "react";
5
+ const Slot = React.forwardRef((props, forwardedRef) => {
6
+ const { children, ...slotProps } = props;
7
+ if (React.Children.toArray(children).some(isSlottable)) {
8
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, React.Children.map(children, (child) => {
9
+ return isSlottable(child) ? /* @__PURE__ */ React.createElement(SlotClone, {
10
+ ...slotProps,
11
+ ref: forwardedRef
12
+ }, child.props.children) : child;
13
+ }));
14
+ }
15
+ return /* @__PURE__ */ React.createElement(SlotClone, {
16
+ ...slotProps,
17
+ ref: forwardedRef
18
+ }, children);
19
+ });
20
+ Slot.displayName = "Slot";
21
+ const SlotClone = React.forwardRef((props, forwardedRef) => {
22
+ const { children, ...slotProps } = props;
23
+ if (React.isValidElement(children)) {
24
+ return React.cloneElement(children, {
25
+ ...mergeProps(slotProps, children.props),
26
+ ref: composeRefs(forwardedRef, children.ref)
27
+ });
28
+ }
29
+ return React.Children.count(children) > 1 ? React.Children.only(null) : null;
30
+ });
31
+ SlotClone.displayName = "SlotClone";
32
+ const Slottable = /* @__PURE__ */ __name(({ children }) => {
33
+ return /* @__PURE__ */ React.createElement(React.Fragment, null, children);
34
+ }, "Slottable");
35
+ function isSlottable(child) {
36
+ return React.isValidElement(child);
37
+ }
38
+ __name(isSlottable, "isSlottable");
39
+ function mergeProps(slotProps, childProps) {
40
+ const overrideProps = { ...childProps };
41
+ for (const propName in childProps) {
42
+ const slotPropValue = slotProps[propName];
43
+ const childPropValue = childProps[propName];
44
+ const isHandler = /^on[A-Z]/.test(propName);
45
+ if (isHandler) {
46
+ overrideProps[propName] = (...args) => {
47
+ childPropValue == null ? void 0 : childPropValue(...args);
48
+ slotPropValue == null ? void 0 : slotPropValue(...args);
49
+ };
50
+ } else if (propName === "style") {
51
+ overrideProps[propName] = { ...slotPropValue, ...childPropValue };
52
+ } else if (propName === "className") {
53
+ overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(" ");
54
+ }
55
+ }
56
+ return { ...slotProps, ...overrideProps };
57
+ }
58
+ __name(mergeProps, "mergeProps");
59
+ export {
60
+ Slot,
61
+ Slottable
62
+ };
63
+ //# sourceMappingURL=Slot.js.map
@@ -0,0 +1,7 @@
1
+ {
2
+ "version": 3,
3
+ "sources": ["../../../src/views/Slot.tsx"],
4
+ "sourcesContent": ["// via radix\n\nimport { composeRefs } from '@tamagui/compose-refs'\nimport * as React from 'react'\n\n/* -------------------------------------------------------------------------------------------------\n * Slot\n * -----------------------------------------------------------------------------------------------*/\n\nexport type SlotProps = {\n children?: React.ReactNode\n}\n\nexport const Slot = React.forwardRef<HTMLElement, SlotProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props\n\n if (React.Children.toArray(children).some(isSlottable)) {\n return (\n <>\n {React.Children.map(children, (child) => {\n return isSlottable(child) ? (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {child.props.children}\n </SlotClone>\n ) : (\n child\n )\n })}\n </>\n )\n }\n\n return (\n <SlotClone {...slotProps} ref={forwardedRef}>\n {children}\n </SlotClone>\n )\n})\n\nSlot.displayName = 'Slot'\n\n/* -------------------------------------------------------------------------------------------------\n * SlotClone\n * -----------------------------------------------------------------------------------------------*/\n\ninterface SlotCloneProps {\n children: React.ReactNode\n}\n\nconst SlotClone = React.forwardRef<any, SlotCloneProps>((props, forwardedRef) => {\n const { children, ...slotProps } = props\n\n if (React.isValidElement(children)) {\n return React.cloneElement(children, {\n ...mergeProps(slotProps, children.props),\n ref: composeRefs(forwardedRef, (children as any).ref),\n })\n }\n\n return React.Children.count(children) > 1 ? React.Children.only(null) : null\n})\n\nSlotClone.displayName = 'SlotClone'\n\n/* -------------------------------------------------------------------------------------------------\n * Slottable\n * -----------------------------------------------------------------------------------------------*/\n\nexport const Slottable = ({ children }: { children: React.ReactNode }) => {\n return <>{children}</>\n}\n\n/* ---------------------------------------------------------------------------------------------- */\n\ntype AnyProps = Record<string, any>\n\nfunction isSlottable(child: React.ReactNode): child is React.ReactElement {\n return React.isValidElement(child)\n}\n\nfunction mergeProps(slotProps: AnyProps, childProps: AnyProps) {\n // all child props should override\n const overrideProps = { ...childProps }\n\n for (const propName in childProps) {\n const slotPropValue = slotProps[propName]\n const childPropValue = childProps[propName]\n\n const isHandler = /^on[A-Z]/.test(propName)\n // if it's a handler, modify the override by composing the base handler\n if (isHandler) {\n overrideProps[propName] = (...args: unknown[]) => {\n childPropValue?.(...args)\n slotPropValue?.(...args)\n }\n }\n // if it's `style`, we merge them\n else if (propName === 'style') {\n overrideProps[propName] = { ...slotPropValue, ...childPropValue }\n } else if (propName === 'className') {\n overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(' ')\n }\n }\n\n return { ...slotProps, ...overrideProps }\n}\n"],
5
+ "mappings": ";;AAEA;AACA;AAUO,MAAM,OAAO,MAAM,WAAmC,CAAC,OAAO,iBAAiB;AACpF,QAAM,EAAE,aAAa,cAAc;AAEnC,MAAI,MAAM,SAAS,QAAQ,QAAQ,EAAE,KAAK,WAAW,GAAG;AACtD,WACE,0DACG,MAAM,SAAS,IAAI,UAAU,CAAC,UAAU;AACvC,aAAO,YAAY,KAAK,IACtB,oCAAC;AAAA,WAAc;AAAA,QAAW,KAAK;AAAA,SAC5B,MAAM,MAAM,QACf,IAEA;AAAA,IAEJ,CAAC,CACH;AAAA,EAEJ;AAEA,SACE,oCAAC;AAAA,OAAc;AAAA,IAAW,KAAK;AAAA,KAC5B,QACH;AAEJ,CAAC;AAED,KAAK,cAAc;AAUnB,MAAM,YAAY,MAAM,WAAgC,CAAC,OAAO,iBAAiB;AAC/E,QAAM,EAAE,aAAa,cAAc;AAEnC,MAAI,MAAM,eAAe,QAAQ,GAAG;AAClC,WAAO,MAAM,aAAa,UAAU;AAAA,SAC/B,WAAW,WAAW,SAAS,KAAK;AAAA,MACvC,KAAK,YAAY,cAAe,SAAiB,GAAG;AAAA,IACtD,CAAC;AAAA,EACH;AAEA,SAAO,MAAM,SAAS,MAAM,QAAQ,IAAI,IAAI,MAAM,SAAS,KAAK,IAAI,IAAI;AAC1E,CAAC;AAED,UAAU,cAAc;AAMjB,MAAM,YAAY,wBAAC,EAAE,eAA8C;AACxE,SAAO,0DAAG,QAAS;AACrB,GAFyB;AAQzB,qBAAqB,OAAqD;AACxE,SAAO,MAAM,eAAe,KAAK;AACnC;AAFS;AAIT,oBAAoB,WAAqB,YAAsB;AAE7D,QAAM,gBAAgB,KAAK,WAAW;AAEtC,aAAW,YAAY,YAAY;AACjC,UAAM,gBAAgB,UAAU;AAChC,UAAM,iBAAiB,WAAW;AAElC,UAAM,YAAY,WAAW,KAAK,QAAQ;AAE1C,QAAI,WAAW;AACb,oBAAc,YAAY,IAAI,SAAoB;AAChD,yDAAiB,GAAG;AACpB,uDAAgB,GAAG;AAAA,MACrB;AAAA,IACF,WAES,aAAa,SAAS;AAC7B,oBAAc,YAAY,KAAK,kBAAkB,eAAe;AAAA,IAClE,WAAW,aAAa,aAAa;AACnC,oBAAc,YAAY,CAAC,eAAe,cAAc,EAAE,OAAO,OAAO,EAAE,KAAK,GAAG;AAAA,IACpF;AAAA,EACF;AAEA,SAAO,KAAK,cAAc,cAAc;AAC1C;AAzBS;",
6
+ "names": []
7
+ }
@@ -29,6 +29,7 @@ import { useFeatures } from "./hooks/useFeatures";
29
29
  import { useIsTouchDevice } from "./hooks/useIsTouchDevice";
30
30
  import { usePressable } from "./hooks/usePressable";
31
31
  import { getThemeManagerIfChanged, useTheme } from "./hooks/useTheme";
32
+ import { Slot } from "./views/Slot";
32
33
  import { TextAncestorContext } from "./views/TextAncestorContext";
33
34
  React["keep"];
34
35
  const defaultComponentState = {
@@ -93,7 +94,7 @@ function createComponent(configIn, ParentComponent) {
93
94
  __name(addPseudoToStyles, "addPseudoToStyles");
94
95
  const component = forwardRef((props, forwardedRef) => {
95
96
  var _a, _b, _c, _d;
96
- props = tamaguiDefaultProps ? { ...tamaguiDefaultProps, ...props } : props;
97
+ props = tamaguiDefaultProps && !props.asChild ? { ...tamaguiDefaultProps, ...props } : props;
97
98
  const { Component, componentName, isText, isZStack } = staticConfig;
98
99
  if (process.env.NODE_ENV === "development") {
99
100
  if (props["debug"]) {
@@ -108,7 +109,7 @@ function createComponent(configIn, ParentComponent) {
108
109
  const [state, set_] = useState(defaultComponentState);
109
110
  const setStateShallow = createShallowUpdate(set_);
110
111
  const shouldAvoidClasses = !!(props.animation && avoidClasses);
111
- const splitStyles = useSplitStyles(props, staticConfig, theme, shouldAvoidClasses ? { ...state, noClassNames: true, resolveVariablesAs: "value" } : state, shouldAvoidClasses ? null : initialSplitStyles.classNames);
112
+ const splitStyles = useSplitStyles(props, staticConfig, theme, shouldAvoidClasses ? { ...state, noClassNames: true, resolveVariablesAs: "value" } : state, shouldAvoidClasses || props.asChild ? null : initialSplitStyles.classNames);
112
113
  const { viewProps: viewPropsIn, pseudos, medias, style, classNames } = splitStyles;
113
114
  const useAnimations = (_a = tamaguiConfig.animations) == null ? void 0 : _a.useAnimations;
114
115
  const isAnimated = !!(useAnimations && props.animation);
@@ -127,6 +128,7 @@ function createComponent(configIn, ParentComponent) {
127
128
  const {
128
129
  tag,
129
130
  hitSlop,
131
+ asChild,
130
132
  children,
131
133
  pointerEvents,
132
134
  onPress,
@@ -210,7 +212,7 @@ function createComponent(configIn, ParentComponent) {
210
212
  if (accessibilityRole)
211
213
  viewProps.accessibilityRole = accessibilityRole;
212
214
  }
213
- if (isWeb) {
215
+ if (isWeb && !asChild) {
214
216
  rnw.useResponderEvents(hostRef, {
215
217
  onMoveShouldSetResponder,
216
218
  onMoveShouldSetResponderCapture,
@@ -318,7 +320,7 @@ function createComponent(configIn, ParentComponent) {
318
320
  const isHoverable = isWeb && !isTouch;
319
321
  const attachHover = isHoverable && !!(pseudos && pseudos.hoverStyle || onHoverIn || onHoverOut || onMouseEnter || onMouseLeave);
320
322
  const pressEventKey = isStringElement ? "onClick" : "onPress";
321
- const shouldAttach = attachPress || attachHover || "pressStyle" in props || "onPress" in props || "onPressIn" in props || "onPressOut" in props || isWeb && ("hoverStyle" in props || "onHoverIn" in props || "onHoverOut" in props || "onMouseEnter" in props || "onMouseLeave" in props);
323
+ const shouldAttach = !asChild && (attachPress || attachHover || "pressStyle" in props || "onPress" in props || "onPressIn" in props || "onPressOut" in props || isWeb && ("hoverStyle" in props || "onHoverIn" in props || "onHoverOut" in props || "onMouseEnter" in props || "onMouseLeave" in props));
322
324
  const unPress = useCallback(() => {
323
325
  if (!internal.current.isMounted)
324
326
  return;
@@ -384,7 +386,7 @@ function createComponent(configIn, ParentComponent) {
384
386
  onPressOut == null ? void 0 : onPressOut(e);
385
387
  } : null
386
388
  } : null;
387
- let childEls = !children ? children : wrapThemeManagerContext(spacedChildren({
389
+ const childEls = !children || asChild ? children : wrapThemeManagerContext(spacedChildren({
388
390
  children,
389
391
  space,
390
392
  flexDirection: props.flexDirection || ((_b = staticConfig.defaultProps) == null ? void 0 : _b.flexDirection),
@@ -424,6 +426,11 @@ function createComponent(configIn, ParentComponent) {
424
426
  Object.assign(viewProps, events);
425
427
  }
426
428
  }
429
+ if (asChild) {
430
+ ViewComponent = Slot;
431
+ const onlyChild = React.Children.only(children);
432
+ Object.assign(viewProps, onlyChild.props);
433
+ }
427
434
  content = createElement(ViewComponent, viewProps, childEls);
428
435
  if (isWeb && events && attachHover) {
429
436
  content = <span className="tui_Hoverable" style={{
@@ -209,7 +209,8 @@ const expand = {
209
209
  paddingVertical: sidesY.map((x) => `padding${x}`),
210
210
  margin: sidesXY.map((x) => `margin${x}`),
211
211
  marginHorizontal: sidesX.map((x) => `margin${x}`),
212
- marginVertical: sidesY.map((x) => `margin${x}`)
212
+ marginVertical: sidesY.map((x) => `margin${x}`),
213
+ borderWidth: sidesXY.map((x) => `border${x}Width`)
213
214
  };
214
215
  function expansions(styleObj) {
215
216
  var _a, _b;
@@ -2,6 +2,9 @@ var __defProp = Object.defineProperty;
2
2
  var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
3
  const matchRgbaHsla = /(rgba|hsla)\(\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,}%?)\s*,\s*([\d\.]{1,})\s*\)$/;
4
4
  function fixNativeShadow(styles) {
5
+ if (!styles) {
6
+ return;
7
+ }
5
8
  const color = styles.find((x) => x[0] === "shadowColor");
6
9
  if (!color) {
7
10
  return;
@@ -0,0 +1,23 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
+ import { getVariableValue, isVariable } from "@tamagui/core";
4
+ const getButtonSize = /* @__PURE__ */ __name((sizeX = 0.9, sizeY = 0.333) => (val, { tokens, props, fonts }) => {
5
+ var _a, _b, _c, _d, _e, _f, _g;
6
+ const size = (_c = (_b = (_a = tokens.size[val]) != null ? _a : tokens.size["$4"]) != null ? _b : val) != null ? _c : 14;
7
+ const radius = (_e = (_d = tokens.radius[val]) != null ? _d : tokens.radius["$4"]) != null ? _e : size;
8
+ const px = Math.round(+(isVariable(size) ? size.val : size) * sizeX);
9
+ const py = Math.round(+(isVariable(size) ? size.val : size) * sizeY);
10
+ const font = fonts[props.fontFamily] || fonts["$body"];
11
+ const lineHeights = font.lineHeight;
12
+ const lineHeight = (_f = lineHeights[val]) != null ? _f : lineHeights["$4"];
13
+ const minHeight = Math.round(getVariableValue(lineHeight) + py * 2);
14
+ return {
15
+ minHeight,
16
+ paddingHorizontal: props.circular ? 0 : px,
17
+ paddingVertical: props.circular ? 0 : py,
18
+ borderRadius: props.circular ? 1e5 : (_g = props.borderRadius) != null ? _g : radius
19
+ };
20
+ }, "getButtonSize");
21
+ export {
22
+ getButtonSize
23
+ };
@@ -0,0 +1,33 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
+ import { getVariableValue } from "../createVariable";
4
+ const getTextSize = /* @__PURE__ */ __name((val = "$4", { fonts, theme, props }) => {
5
+ var _a, _b, _c;
6
+ const family = getVariableValue(props.fontFamily) || "$body";
7
+ const font = fonts[family] || fonts["$body"];
8
+ if (!font) {
9
+ console.warn("\u26A0\uFE0F no font found", { family, fontTokens: Object.keys(fonts), val });
10
+ return;
11
+ }
12
+ const fontFamily = font.family;
13
+ const fontSize = props.fontSize || font.size[val];
14
+ const lineHeight = props.lineHeight || font.lineHeight[val];
15
+ const fontWeight = props.fontWeight || font.weight[val];
16
+ const letterSpacing = props.letterSpacing || font.letterSpacing[val];
17
+ const fontStyle = props.fontStyle || ((_a = font.style) == null ? void 0 : _a[val]);
18
+ const textTransform = props.textTransform || ((_b = font.transform) == null ? void 0 : _b[val]);
19
+ const color = props.color || ((_c = font.color) == null ? void 0 : _c[val]) || theme.color;
20
+ return {
21
+ color,
22
+ fontStyle,
23
+ textTransform,
24
+ fontFamily,
25
+ fontWeight,
26
+ letterSpacing,
27
+ fontSize,
28
+ lineHeight
29
+ };
30
+ }, "getTextSize");
31
+ export {
32
+ getTextSize
33
+ };
@@ -79,6 +79,7 @@ function insertStyleRule(identifier, rule) {
79
79
  return;
80
80
  hasInsertedSinceUpdate = true;
81
81
  updateInsertedCache(identifier, rule);
82
+ allSelectors[identifier] = process.env.NODE_ENV === "development" ? rule : true;
82
83
  sheet == null ? void 0 : sheet.insertRule(rule, sheet.cssRules.length);
83
84
  }
84
85
  __name(insertStyleRule, "insertStyleRule");
@@ -0,0 +1,34 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
+ import * as React from "react";
4
+ import { useIsomorphicLayoutEffect } from "../constants/platform";
5
+ let serverHandoffComplete = false;
6
+ let id = 0;
7
+ function genId() {
8
+ return ++id;
9
+ }
10
+ __name(genId, "genId");
11
+ function useId(providedId) {
12
+ var _a;
13
+ if (typeof React.useId === "function") {
14
+ let id3 = React.useId(providedId);
15
+ return providedId != null ? providedId : id3;
16
+ }
17
+ let initialId = providedId != null ? providedId : serverHandoffComplete ? genId() : null;
18
+ let [id2, setId] = React.useState(initialId);
19
+ useIsomorphicLayoutEffect(() => {
20
+ if (id2 === null) {
21
+ setId(genId());
22
+ }
23
+ }, []);
24
+ React.useEffect(() => {
25
+ if (serverHandoffComplete === false) {
26
+ serverHandoffComplete = true;
27
+ }
28
+ }, []);
29
+ return (_a = providedId != null ? providedId : id2) != null ? _a : void 0;
30
+ }
31
+ __name(useId, "useId");
32
+ export {
33
+ useId
34
+ };
package/dist/jsx/index.js CHANGED
@@ -13,31 +13,34 @@ import { getHasConfigured, getConfig, getThemes, getTokens, onConfiguredOnce } f
13
13
  export * from "./constants/constants";
14
14
  export * from "./constants/platform";
15
15
  export * from "./constants/rnw";
16
+ export * from "./helpers/getButtonSize";
16
17
  export * from "./helpers/getExpandedShorthands";
17
18
  export * from "./helpers/getSize";
18
19
  export * from "./helpers/getSplitStyles";
19
20
  export * from "./helpers/getStylesAtomic";
21
+ export * from "./helpers/getTextSize";
20
22
  export * from "./helpers/isObj";
21
23
  export * from "./helpers/isTamaguiElement";
22
24
  export * from "./helpers/matchMedia";
23
25
  export * from "./helpers/themeable";
24
26
  export * from "./helpers/withStaticProperties";
25
27
  export * from "./contexts/ButtonInsideButtonContext";
26
- export * from "./hooks/useIsTouchDevice";
27
28
  export * from "./hooks/useConstant";
28
- export * from "./hooks/usePressable";
29
+ export * from "./hooks/useId";
30
+ export * from "./hooks/useIsMounted";
31
+ export * from "./hooks/useIsTouchDevice";
29
32
  export * from "./hooks/useMedia";
33
+ export * from "./hooks/usePressable";
30
34
  export * from "./hooks/useTheme";
31
- export * from "./hooks/useIsMounted";
32
35
  export * from "./hooks/useUnmountEffect";
33
- export * from "@tamagui/use-force-update";
34
36
  export * from "./views/Stack";
35
37
  export * from "./views/Text";
38
+ export * from "./views/TextAncestorContext";
36
39
  export * from "./views/Theme";
37
- export * from "./views/ThemeReset";
38
40
  export * from "./views/ThemeInverse";
39
41
  export * from "./views/ThemeProvider";
40
- export * from "./views/TextAncestorContext";
42
+ export * from "./views/ThemeReset";
43
+ export * from "@tamagui/use-force-update";
41
44
  export * from "@tamagui/helpers";
42
45
  export {
43
46
  RNWTextProps,
@@ -5,14 +5,16 @@ import { createComponent } from "./createComponent";
5
5
  import { RNComponents } from "./helpers/RNComponents";
6
6
  function styled(Component, options, staticExtractionOptions) {
7
7
  const staticConfigProps = (() => {
8
+ var _a;
8
9
  if (options) {
9
10
  const { variants, name, defaultVariants, ...defaultProps } = options;
10
11
  if (defaultVariants) {
11
12
  Object.assign(defaultProps, defaultVariants);
12
13
  }
13
14
  const isReactNativeWeb = "staticConfig" in Component ? Component.staticConfig.isReactNativeWeb : RNComponents.has(Component);
15
+ const reactNativeWebComponent = isReactNativeWeb ? ((_a = Component["staticConfig"]) == null ? void 0 : _a.reactNativeWebComponent) || Component : null;
14
16
  const isTamagui = !isReactNativeWeb && "staticConfig" in Component;
15
- const Comp = Component;
17
+ const Comp = reactNativeWebComponent || Component;
16
18
  const isImage = !!(defaultProps.isImage || (!isTamagui ? Comp === Image : false));
17
19
  const isInput = !!(defaultProps.isInput || (!isTamagui ? Comp === TextInput : false));
18
20
  const isText = !!(defaultProps.isText || (!isTamagui ? isInput || Comp === Text : false));
@@ -27,10 +29,12 @@ function styled(Component, options, staticExtractionOptions) {
27
29
  defaultVariants,
28
30
  componentName: name,
29
31
  isReactNativeWeb,
32
+ reactNativeWebComponent,
30
33
  isInput,
31
34
  isText,
32
35
  isImage
33
36
  };
37
+ console.log("makeme", name, Comp, conf);
34
38
  return conf;
35
39
  }
36
40
  return {};
@@ -0,0 +1,56 @@
1
+ var __defProp = Object.defineProperty;
2
+ var __name = (target, value) => __defProp(target, "name", { value, configurable: true });
3
+ import { composeRefs } from "@tamagui/compose-refs";
4
+ import * as React from "react";
5
+ const Slot = React.forwardRef((props, forwardedRef) => {
6
+ const { children, ...slotProps } = props;
7
+ if (React.Children.toArray(children).some(isSlottable)) {
8
+ return <>{React.Children.map(children, (child) => {
9
+ return isSlottable(child) ? <SlotClone {...slotProps} ref={forwardedRef}>{child.props.children}</SlotClone> : child;
10
+ })}</>;
11
+ }
12
+ return <SlotClone {...slotProps} ref={forwardedRef}>{children}</SlotClone>;
13
+ });
14
+ Slot.displayName = "Slot";
15
+ const SlotClone = React.forwardRef((props, forwardedRef) => {
16
+ const { children, ...slotProps } = props;
17
+ if (React.isValidElement(children)) {
18
+ return React.cloneElement(children, {
19
+ ...mergeProps(slotProps, children.props),
20
+ ref: composeRefs(forwardedRef, children.ref)
21
+ });
22
+ }
23
+ return React.Children.count(children) > 1 ? React.Children.only(null) : null;
24
+ });
25
+ SlotClone.displayName = "SlotClone";
26
+ const Slottable = /* @__PURE__ */ __name(({ children }) => {
27
+ return <>{children}</>;
28
+ }, "Slottable");
29
+ function isSlottable(child) {
30
+ return React.isValidElement(child);
31
+ }
32
+ __name(isSlottable, "isSlottable");
33
+ function mergeProps(slotProps, childProps) {
34
+ const overrideProps = { ...childProps };
35
+ for (const propName in childProps) {
36
+ const slotPropValue = slotProps[propName];
37
+ const childPropValue = childProps[propName];
38
+ const isHandler = /^on[A-Z]/.test(propName);
39
+ if (isHandler) {
40
+ overrideProps[propName] = (...args) => {
41
+ childPropValue == null ? void 0 : childPropValue(...args);
42
+ slotPropValue == null ? void 0 : slotPropValue(...args);
43
+ };
44
+ } else if (propName === "style") {
45
+ overrideProps[propName] = { ...slotPropValue, ...childPropValue };
46
+ } else if (propName === "className") {
47
+ overrideProps[propName] = [slotPropValue, childPropValue].filter(Boolean).join(" ");
48
+ }
49
+ }
50
+ return { ...slotProps, ...overrideProps };
51
+ }
52
+ __name(mergeProps, "mergeProps");
53
+ export {
54
+ Slot,
55
+ Slottable
56
+ };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tamagui/core",
3
- "version": "1.0.0-beta.5",
3
+ "version": "1.0.0-beta.8",
4
4
  "source": "src/index.ts",
5
5
  "main": "dist/cjs",
6
6
  "module": "dist/esm",
@@ -19,10 +19,10 @@
19
19
  "dist"
20
20
  ],
21
21
  "dependencies": {
22
- "@tamagui/helpers": "^1.0.0-beta.5",
22
+ "@tamagui/helpers": "^1.0.0-beta.8",
23
23
  "@tamagui/ow": "^0.28.1",
24
- "@tamagui/use-debounce": "^1.0.0-beta.5",
25
- "@tamagui/use-force-update": "^1.0.0-beta.5",
24
+ "@tamagui/use-debounce": "^1.0.0-beta.8",
25
+ "@tamagui/use-force-update": "^1.0.0-beta.8",
26
26
  "react": "*",
27
27
  "react-dom": "*"
28
28
  },
@@ -30,7 +30,7 @@
30
30
  "react-native-web": "*"
31
31
  },
32
32
  "devDependencies": {
33
- "@tamagui/build": "^1.0.0-beta.5",
33
+ "@tamagui/build": "^1.0.0-beta.8",
34
34
  "@types/react": "^17.0.35",
35
35
  "csstype": "^3.0.10",
36
36
  "esbuild": "^0.14.36",
@@ -1 +1 @@
1
- {"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAoB,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAiBhE,OAAO,EACL,WAAW,EACX,UAAU,EACV,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAKjB,MAAM,SAAS,CAAA;AAehB,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA0B3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,IAAI,EACV,SAAS,GAAG,KAAK,EACjB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,EAAE,eAAe,CAAC,EAAE,iBAAiB,4DA6nB1F;AAKD,eAAO,MAAM,MAAM;;;;mBA4CjB,CAAA;AAEF,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,aAAa,EACb,SAAS,GACV,EAAE;IACD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,GAAG,CAAA;IACb,KAAK,CAAC,EAAE,GAAG,CAAA;IACX,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,aAAa,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAA;CAC3C,SA2CA;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,GAAG,eAkBtC"}
1
+ {"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":";AAaA,OAAO,EAAoB,IAAI,EAAE,SAAS,EAAE,MAAM,cAAc,CAAA;AAiBhE,OAAO,EACL,WAAW,EACX,UAAU,EACV,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAKjB,MAAM,SAAS,CAAA;AAgBhB,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA0B3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,IAAI,EACV,SAAS,GAAG,KAAK,EACjB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,EAAE,eAAe,CAAC,EAAE,iBAAiB,4DAsoB1F;AAKD,eAAO,MAAM,MAAM;;;;mBA4CjB,CAAA;AAEF,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,aAAa,EACb,SAAS,GACV,EAAE;IACD,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,EAAE,GAAG,CAAA;IACb,KAAK,CAAC,EAAE,GAAG,CAAA;IACX,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,aAAa,CAAC,EAAE,SAAS,CAAC,eAAe,CAAC,CAAA;CAC3C,SA2CA;AAED,wBAAgB,YAAY,CAAC,KAAK,EAAE,GAAG,eAkBtC"}
@@ -0,0 +1,8 @@
1
+ import { VariantSpreadExtras } from '@tamagui/core';
2
+ export declare const getButtonSize: (sizeX?: number, sizeY?: number) => (val: any, { tokens, props, fonts }: VariantSpreadExtras<any>) => {
3
+ minHeight: number;
4
+ paddingHorizontal: number;
5
+ paddingVertical: number;
6
+ borderRadius: any;
7
+ };
8
+ //# sourceMappingURL=getButtonSize.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getButtonSize.d.ts","sourceRoot":"","sources":["../../src/helpers/getButtonSize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAgC,MAAM,eAAe,CAAA;AAIjF,eAAO,MAAM,aAAa,4CAElB,GAAG,4BAA4B,oBAAoB,GAAG,CAAC;;;;;CAgB5D,CAAA"}
@@ -0,0 +1,3 @@
1
+ import { FontSizeTokens, TextProps, VariantSpreadFunction } from '../types';
2
+ export declare const getTextSize: VariantSpreadFunction<TextProps, FontSizeTokens>;
3
+ //# sourceMappingURL=getTextSize.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"getTextSize.d.ts","sourceRoot":"","sources":["../../src/helpers/getTextSize.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,SAAS,EAAE,qBAAqB,EAAE,MAAM,UAAU,CAAA;AAE3E,eAAO,MAAM,WAAW,EAAE,qBAAqB,CAAC,SAAS,EAAE,cAAc,CA4BxE,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"insertStyleRule.d.ts","sourceRoot":"","sources":["../../src/helpers/insertStyleRule.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,kBAAkB,IAAK,CAAA;AAEpC,eAAO,MAAM,eAAe,UAAqB,CAAA;AACjD,eAAO,MAAM,gBAAgB,iBAAyC,CAAA;AACtE,eAAO,MAAM,gBAAgB,UAA2B,CAAA;AAgCxD,wBAAgB,cAAc,SA6B7B;AAMD,wBAAgB,mBAAmB,CAAC,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,QAMnE;AAED,wBAAgB,eAAe,CAAC,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,QAK/D"}
1
+ {"version":3,"file":"insertStyleRule.d.ts","sourceRoot":"","sources":["../../src/helpers/insertStyleRule.tsx"],"names":[],"mappings":"AAMA,eAAO,MAAM,kBAAkB,IAAK,CAAA;AAEpC,eAAO,MAAM,eAAe,UAAqB,CAAA;AACjD,eAAO,MAAM,gBAAgB,iBAAyC,CAAA;AACtE,eAAO,MAAM,gBAAgB,UAA2B,CAAA;AAgCxD,wBAAgB,cAAc,SA6B7B;AAMD,wBAAgB,mBAAmB,CAAC,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,QAMnE;AAED,wBAAgB,eAAe,CAAC,UAAU,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,QAM/D"}
@@ -0,0 +1,9 @@
1
+ declare function useId(idFromProps: string): string;
2
+ declare function useId(idFromProps: number): number;
3
+ declare function useId(idFromProps: string | number): string | number;
4
+ declare function useId(idFromProps: string | undefined | null): string | undefined;
5
+ declare function useId(idFromProps: number | undefined | null): number | undefined;
6
+ declare function useId(idFromProps: string | number | undefined | null): string | number | undefined;
7
+ declare function useId(): string | undefined;
8
+ export { useId };
9
+ //# sourceMappingURL=useId.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"useId.d.ts","sourceRoot":"","sources":["../../src/hooks/useId.tsx"],"names":[],"mappings":"AA+EA,iBAAS,KAAK,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,CAAA;AAC3C,iBAAS,KAAK,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,CAAA;AAC3C,iBAAS,KAAK,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,GAAG,MAAM,GAAG,MAAM,CAAA;AAC7D,iBAAS,KAAK,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,CAAA;AAC1E,iBAAS,KAAK,CAAC,WAAW,EAAE,MAAM,GAAG,SAAS,GAAG,IAAI,GAAG,MAAM,GAAG,SAAS,CAAA;AAC1E,iBAAS,KAAK,CAAC,WAAW,EAAE,MAAM,GAAG,MAAM,GAAG,SAAS,GAAG,IAAI,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;AAC5F,iBAAS,KAAK,IAAI,MAAM,GAAG,SAAS,CAAA;AAwCpC,OAAO,EAAE,KAAK,EAAE,CAAA"}
package/types/index.d.ts CHANGED
@@ -13,30 +13,33 @@ export { getHasConfigured, getConfig, getThemes, getTokens, onConfiguredOnce } f
13
13
  export * from './constants/constants';
14
14
  export * from './constants/platform';
15
15
  export * from './constants/rnw';
16
+ export * from './helpers/getButtonSize';
16
17
  export * from './helpers/getExpandedShorthands';
17
18
  export * from './helpers/getSize';
18
19
  export * from './helpers/getSplitStyles';
19
20
  export * from './helpers/getStylesAtomic';
21
+ export * from './helpers/getTextSize';
20
22
  export * from './helpers/isObj';
21
23
  export * from './helpers/isTamaguiElement';
22
24
  export * from './helpers/matchMedia';
23
25
  export * from './helpers/themeable';
24
26
  export * from './helpers/withStaticProperties';
25
27
  export * from './contexts/ButtonInsideButtonContext';
26
- export * from './hooks/useIsTouchDevice';
27
28
  export * from './hooks/useConstant';
28
- export * from './hooks/usePressable';
29
+ export * from './hooks/useId';
30
+ export * from './hooks/useIsMounted';
31
+ export * from './hooks/useIsTouchDevice';
29
32
  export * from './hooks/useMedia';
33
+ export * from './hooks/usePressable';
30
34
  export * from './hooks/useTheme';
31
- export * from './hooks/useIsMounted';
32
35
  export * from './hooks/useUnmountEffect';
33
- export * from '@tamagui/use-force-update';
34
36
  export * from './views/Stack';
35
37
  export * from './views/Text';
38
+ export * from './views/TextAncestorContext';
36
39
  export * from './views/Theme';
37
- export * from './views/ThemeReset';
38
40
  export * from './views/ThemeInverse';
39
41
  export * from './views/ThemeProvider';
40
- export * from './views/TextAncestorContext';
42
+ export * from './views/ThemeReset';
43
+ export * from '@tamagui/use-force-update';
41
44
  export * from '@tamagui/helpers';
42
45
  //# sourceMappingURL=index.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,mBAAmB,CAAA;AACjC,cAAc,oBAAoB,CAAA;AAClC,cAAc,eAAe,CAAA;AAC7B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,cAAc,kBAAkB,CAAA;AAChC,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AAEvB,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AACxD,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAA;AAE5F,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,iBAAiB,CAAA;AAE/B,cAAc,iCAAiC,CAAA;AAC/C,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,2BAA2B,CAAA;AACzC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,4BAA4B,CAAA;AAC1C,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,cAAc,gCAAgC,CAAA;AAE9C,cAAc,sCAAsC,CAAA;AAEpD,cAAc,0BAA0B,CAAA;AACxC,cAAc,qBAAqB,CAAA;AACnC,cAAc,sBAAsB,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,kBAAkB,CAAA;AAChC,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,2BAA2B,CAAA;AAEzC,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,eAAe,CAAA;AAC7B,cAAc,oBAAoB,CAAA;AAClC,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,6BAA6B,CAAA;AAE3C,cAAc,kBAAkB,CAAA"}
1
+ {"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,cAAc,WAAW,CAAA;AACzB,cAAc,mBAAmB,CAAA;AACjC,cAAc,oBAAoB,CAAA;AAClC,cAAc,eAAe,CAAA;AAC7B,cAAc,iBAAiB,CAAA;AAC/B,cAAc,cAAc,CAAA;AAC5B,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAA;AAC7C,cAAc,kBAAkB,CAAA;AAChC,cAAc,UAAU,CAAA;AACxB,cAAc,SAAS,CAAA;AAEvB,OAAO,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,aAAa,CAAA;AACxD,OAAO,EAAE,gBAAgB,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,gBAAgB,EAAE,MAAM,QAAQ,CAAA;AAE5F,cAAc,uBAAuB,CAAA;AACrC,cAAc,sBAAsB,CAAA;AACpC,cAAc,iBAAiB,CAAA;AAE/B,cAAc,yBAAyB,CAAA;AACvC,cAAc,iCAAiC,CAAA;AAC/C,cAAc,mBAAmB,CAAA;AACjC,cAAc,0BAA0B,CAAA;AACxC,cAAc,2BAA2B,CAAA;AACzC,cAAc,uBAAuB,CAAA;AACrC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,4BAA4B,CAAA;AAC1C,cAAc,sBAAsB,CAAA;AACpC,cAAc,qBAAqB,CAAA;AACnC,cAAc,gCAAgC,CAAA;AAE9C,cAAc,sCAAsC,CAAA;AAEpD,cAAc,qBAAqB,CAAA;AACnC,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA;AACpC,cAAc,0BAA0B,CAAA;AACxC,cAAc,kBAAkB,CAAA;AAChC,cAAc,sBAAsB,CAAA;AACpC,cAAc,kBAAkB,CAAA;AAChC,cAAc,0BAA0B,CAAA;AAExC,cAAc,eAAe,CAAA;AAC7B,cAAc,cAAc,CAAA;AAC5B,cAAc,6BAA6B,CAAA;AAC3C,cAAc,eAAe,CAAA;AAC7B,cAAc,sBAAsB,CAAA;AACpC,cAAc,uBAAuB,CAAA;AACrC,cAAc,oBAAoB,CAAA;AAElC,cAAc,2BAA2B,CAAA;AACzC,cAAc,kBAAkB,CAAA"}
@@ -1 +1 @@
1
- {"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../src/styled.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAGhB,oBAAY,aAAa,CAAC,eAAe,SAAS,iBAAiB,IAAI,QAAQ,CAAC,eAAe,CAAC,GAAG;IACjG,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,GAAG,SAAS,CAAA;IAC1D,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CACzC,CAAA;AAED,wBAAgB,MAAM,CACpB,eAAe,SAAS,iBAAiB,EACzC,QAAQ,SAAS,kBAAkB,CAAC,eAAe,CAAC,GAAG,MAAM,GACzD,kBAAkB,CAAC,eAAe,CAAC,GACnC,MAAM,EAEV,SAAS,EAAE,eAAe,EAE1B,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAE/B,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CACzC,EACD,uBAAuB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,qnEA0EhD"}
1
+ {"version":3,"file":"styled.d.ts","sourceRoot":"","sources":["../src/styled.tsx"],"names":[],"mappings":"AAIA,OAAO,EACL,QAAQ,EACR,gBAAgB,EAChB,UAAU,EACV,WAAW,EACX,YAAY,EACZ,iBAAiB,EACjB,gBAAgB,EAChB,kBAAkB,EAClB,qBAAqB,EACtB,MAAM,SAAS,CAAA;AAGhB,oBAAY,aAAa,CAAC,eAAe,SAAS,iBAAiB,IAAI,QAAQ,CAAC,eAAe,CAAC,GAAG;IACjG,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,kBAAkB,CAAC,eAAe,CAAC,GAAG,SAAS,CAAA;IAC1D,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CACzC,CAAA;AAED,wBAAgB,MAAM,CACpB,eAAe,SAAS,iBAAiB,EACzC,QAAQ,SAAS,kBAAkB,CAAC,eAAe,CAAC,GAAG,MAAM,GACzD,kBAAkB,CAAC,eAAe,CAAC,GACnC,MAAM,EAEV,SAAS,EAAE,eAAe,EAE1B,OAAO,CAAC,EAAE,QAAQ,CAAC,eAAe,CAAC,GAAG;IACpC,IAAI,CAAC,EAAE,MAAM,CAAA;IACb,QAAQ,CAAC,EAAE,QAAQ,GAAG,SAAS,CAAA;IAE/B,eAAe,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,GAAG,CAAA;KAAE,CAAA;CACzC,EACD,uBAAuB,CAAC,EAAE,OAAO,CAAC,YAAY,CAAC,qnEAkFhD"}