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

package/dist/esm/styled.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/styled.tsx"],
-  "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\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      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"],
-  "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;AAElF,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,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AA4B9D,SAAO;AAOT;AA/FgB;",
+  "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'\nimport { Stack } from './views/Stack'\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> | void = VariantDefinitions<ParentComponent> | void\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\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      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 void\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\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// breaking...\n// TODO see core/types.ts bug\n\n// export const XStack = styled(Stack, {\n//   variants: {\n//     horizontal: {\n//       true: {\n//         // flexDirection: 'row',\n//         width: 0,\n//       },\n//     },\n//   },\n// })\n\n// const Separator = styled(Stack, {\n//   variants: {\n//     vertical: {\n//       true: {\n//         flexDirection: 'row',\n//       },\n//     },\n//   },\n//            <--- have to add as const to get working???\n// })\n\n// type props = GetProps<typeof XStack>\n// type variants = typeof XStack extends TamaguiComponent<any, infer Variants> ? Variants : never\n// type variants2 = typeof Separator extends TamaguiComponent<any, infer Variants> ? Variants : never\n\n// const x = <XStack horizontal />\n// const x2 = <Separator vertical />\n"],
+  "mappings": ";;AAAA;AAEA;AACA;AAqBO,gBAIL,WAEA,SAMA,yBACA;AACA,QAAM,oBAAqB,OAAM;AAtCnC;AAuCI,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;AAElF,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,aAAO;AAAA,IACT;AACA,WAAO,CAAC;AAAA,EACV,GAAG;AAEH,QAAM,YAAY,gBAAgB,mBAAmB,SAAS;AA4B9D,SAAO;AAOT;AA7FgB;",
   "names": []
 }

package/dist/esm/views/Slot.js

@@ -4,14 +4,6 @@ import { composeRefs } from "@tamagui/compose-refs";
 import * as React from "react";
 const Slot = React.forwardRef((props, forwardedRef) => {
   const { children, ...slotProps } = props;
-  if (React.Children.toArray(children).some(isSlottable)) {
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, React.Children.map(children, (child) => {
-      return isSlottable(child) ? /* @__PURE__ */ React.createElement(SlotClone, {
-        ...slotProps,
-        ref: forwardedRef
-      }, child.props.children) : child;
-    }));
-  }
   return /* @__PURE__ */ React.createElement(SlotClone, {
     ...slotProps,
     ref: forwardedRef
@@ -21,10 +13,11 @@ Slot.displayName = "Slot";
 const SlotClone = React.forwardRef((props, forwardedRef) => {
   const { children, ...slotProps } = props;
   if (React.isValidElement(children)) {
-    return React.cloneElement(children, {
+    const childProps = {
       ...mergeProps(children, slotProps),
       ref: composeRefs(forwardedRef, children.ref)
-    });
+    };
+    return React.cloneElement(children, childProps);
   }
   return React.Children.count(children) > 1 ? React.Children.only(null) : null;
 });

package/dist/esm/views/Slot.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/views/Slot.tsx"],
-  "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(children, slotProps),\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\nconst pressMap = {\n  onPress: 'onClick',\n  onPressOut: 'onMouseOut',\n  onPressIn: 'onMouseIn',\n}\n\nfunction mergeProps(child: any, slotProps: AnyProps) {\n  const childProps = child.props\n\n  // all child props should override\n  const overrideProps = { ...childProps }\n\n  const isHTMLChild = typeof child.type === 'string'\n\n  if (isHTMLChild) {\n    for (const key in pressMap) {\n      if (key in slotProps) {\n        slotProps[pressMap[key]] = slotProps[key]\n        delete slotProps[key]\n      }\n    }\n  }\n\n  for (let propName in childProps) {\n    const slotPropValue = slotProps[propName]\n    const childPropValue = childProps[propName]\n\n    if (isHTMLChild && pressMap[propName]) {\n      propName = pressMap[propName]\n      delete overrideProps[propName]\n    }\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"],
-  "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,UAAU,SAAS;AAAA,MACjC,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,MAAM,WAAW;AAAA,EACf,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,WAAW;AACb;AAEA,oBAAoB,OAAY,WAAqB;AACnD,QAAM,aAAa,MAAM;AAGzB,QAAM,gBAAgB,KAAK,WAAW;AAEtC,QAAM,cAAc,OAAO,MAAM,SAAS;AAE1C,MAAI,aAAa;AACf,eAAW,OAAO,UAAU;AAC1B,UAAI,OAAO,WAAW;AACpB,kBAAU,SAAS,QAAQ,UAAU;AACrC,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAAA,EACF;AAEA,WAAS,YAAY,YAAY;AAC/B,UAAM,gBAAgB,UAAU;AAChC,UAAM,iBAAiB,WAAW;AAElC,QAAI,eAAe,SAAS,WAAW;AACrC,iBAAW,SAAS;AACpB,aAAO,cAAc;AAAA,IACvB;AAEA,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;AA3CS;",
+  "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  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    const childProps = {\n      ...mergeProps(children, slotProps),\n      ref: composeRefs(forwardedRef, (children as any).ref),\n    }\n    return React.cloneElement(children, childProps)\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\nconst pressMap = {\n  onPress: 'onClick',\n  onPressOut: 'onMouseOut',\n  onPressIn: 'onMouseIn',\n}\n\nfunction mergeProps(child: any, slotProps: AnyProps) {\n  const childProps = child.props\n\n  // all child props should override\n  const overrideProps = { ...childProps }\n\n  const isHTMLChild = typeof child.type === 'string'\n\n  if (isHTMLChild) {\n    for (const key in pressMap) {\n      if (key in slotProps) {\n        slotProps[pressMap[key]] = slotProps[key]\n        delete slotProps[key]\n      }\n    }\n  }\n\n  for (let propName in childProps) {\n    const slotPropValue = slotProps[propName]\n    const childPropValue = childProps[propName]\n\n    if (isHTMLChild && pressMap[propName]) {\n      propName = pressMap[propName]\n      delete overrideProps[propName]\n    }\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"],
+  "mappings": ";;AAEA;AACA;AAUO,MAAM,OAAO,MAAM,WAAmC,CAAC,OAAO,iBAAiB;AACpF,QAAM,EAAE,aAAa,cAAc;AACnC,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,UAAM,aAAa;AAAA,SACd,WAAW,UAAU,SAAS;AAAA,MACjC,KAAK,YAAY,cAAe,SAAiB,GAAG;AAAA,IACtD;AACA,WAAO,MAAM,aAAa,UAAU,UAAU;AAAA,EAChD;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,MAAM,WAAW;AAAA,EACf,SAAS;AAAA,EACT,YAAY;AAAA,EACZ,WAAW;AACb;AAEA,oBAAoB,OAAY,WAAqB;AACnD,QAAM,aAAa,MAAM;AAGzB,QAAM,gBAAgB,KAAK,WAAW;AAEtC,QAAM,cAAc,OAAO,MAAM,SAAS;AAE1C,MAAI,aAAa;AACf,eAAW,OAAO,UAAU;AAC1B,UAAI,OAAO,WAAW;AACpB,kBAAU,SAAS,QAAQ,UAAU;AACrC,eAAO,UAAU;AAAA,MACnB;AAAA,IACF;AAAA,EACF;AAEA,WAAS,YAAY,YAAY;AAC/B,UAAM,gBAAgB,UAAU;AAChC,UAAM,iBAAiB,WAAW;AAElC,QAAI,eAAe,SAAS,WAAW;AACrC,iBAAW,SAAS;AACpB,aAAO,cAAc;AAAA,IACvB;AAEA,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;AA3CS;",
   "names": []
 }

package/dist/jsx/createComponent.js

@@ -97,7 +97,7 @@ function createComponent(configIn, ParentComponent) {
     props = tamaguiDefaultProps && !props.asChild ? { ...tamaguiDefaultProps, ...props } : props;
     const { Component, isText, isZStack } = staticConfig;
     const componentName = props.componentName || staticConfig.componentName;
-    const componentClassName = props.componentName ? `is_${props.componentName}` : defaultComponentClassName;
+    const componentClassName = props.asChild ? "" : props.componentName ? `is_${props.componentName}` : defaultComponentClassName;
     if (process.env.NODE_ENV === "development") {
       if (props["debug"]) {
         console.log("\u26A0\uFE0F", componentName || (Component == null ? void 0 : Component.displayName) || (Component == null ? void 0 : Component.name) || "[Unnamed Component]", "debug on");
@@ -149,6 +149,7 @@ function createComponent(configIn, ParentComponent) {
       onMouseEnter,
       onMouseLeave,
       hrefAttrs,
+      separator,
       onClick,
       theme: _themeProp,
       defaultVariants,
@@ -526,7 +527,14 @@ function createComponent(configIn, ParentComponent) {
       if (process.env.NODE_ENV === "development" && props["debug"]) {
         console.log("  \xBB className", { splitStyles, style: style2, isStringElement, pseudos, state, classNames, propsClassName: props.className, classList, className: className.trim().split(" "), themeClassName: theme.className, values: Object.fromEntries(Object.entries(classNames).map(([k, v]) => [v, getAllSelectors()[v]])) });
       }
-      viewProps.className = className;
+      if (staticConfig.isReactNativeWeb) {
+        viewProps.dataSet = {
+          ...viewProps.dataSet,
+          className
+        };
+      } else {
+        viewProps.className = className;
+      }
       viewProps.style = style2;
     } else {
       viewProps.style = styles;
@@ -603,25 +611,22 @@ function createComponent(configIn, ParentComponent) {
         onPress == null ? void 0 : onPress(e);
       } : null
     } : null;
-    const childEls = !children || asChild ? children : wrapThemeManagerContext(spacedChildren({
+    let childEls = !children || asChild ? children : wrapThemeManagerContext(spacedChildren({
+      separator,
       children,
       space,
       direction: props.spaceDirection || "both",
       isZStack
     }), getThemeManagerIfChanged(theme));
     let content;
-    if (isWeb) {
-      if (staticConfig.isReactNativeWeb) {
-        viewProps.dataSet = {
-          ...viewProps.dataSet,
-          className: viewProps.className
-        };
-      }
-    }
     if (asChild) {
       elementType = Slot;
-      const onlyChild = React.Children.only(children);
-      Object.assign(viewProps, onlyChild.props);
+      viewProps = {
+        ...viewProps,
+        onPress,
+        onPressIn,
+        onPressOut
+      };
     }
     if (isWeb) {
       const [pressableProps] = usePressable(events ? {
@@ -750,6 +755,10 @@ function createComponent(configIn, ParentComponent) {
   return res;
 }
 __name(createComponent, "createComponent");
+const Unspaced = /* @__PURE__ */ __name((props) => {
+  return props.children;
+}, "Unspaced");
+Unspaced["isUnspaced"] = true;
 const Spacer = createComponent({
   memo: true,
   componentName: "Spacer",
@@ -796,14 +805,16 @@ function spacedChildren({
   children,
   space,
   direction,
-  spaceFlex
+  spaceFlex,
+  separator
 }) {
-  if (!space && !spaceFlex) {
+  const hasSpace = !!(space || spaceFlex);
+  const hasSeparator = !(separator === void 0 || separator === null);
+  if (!hasSpace && !hasSeparator) {
     return children;
   }
-  const childrenList = Array.isArray(children) ? children : Children.toArray(children);
-  const len = childrenList.length;
-  if (len <= 1) {
+  const childrenList = Children.toArray(children);
+  if (childrenList.length <= 1) {
     return childrenList;
   }
   const final = [];
@@ -815,20 +826,49 @@ function spacedChildren({
       final.push(<Fragment key={index}>{isZStack ? <AbsoluteFill>{child}</AbsoluteFill> : child}</Fragment>);
     }
     const next = childrenList[index + 1];
-    if (next && !isVisuallyHidden(next)) {
-      final.push(<Spacer key={`_${index}_spacer`} direction={direction === "both" ? void 0 : direction === "row" || direction === "row-reverse" ? "horizontal" : "vertical"} size={space} {...spaceFlex && {
-        flex: spaceFlex
-      }} />);
+    if (next && !isUnspaced(next)) {
+      if (separator) {
+        if (hasSpace) {
+          final.push(createSpacer({
+            key: `_${index}_before_sep_spacer`,
+            direction,
+            space,
+            spaceFlex
+          }));
+        }
+        final.push(React.isValidElement(separator) ? React.cloneElement(separator, { key: `sep_${index}` }) : separator);
+        if (hasSpace) {
+          final.push(createSpacer({
+            key: `_${index}_after_sep_spacer`,
+            direction,
+            space,
+            spaceFlex
+          }));
+        }
+      } else {
+        final.push(createSpacer({
+          key: `_${index}_spacer`,
+          direction,
+          space,
+          spaceFlex
+        }));
+      }
     }
   }
   return final;
 }
 __name(spacedChildren, "spacedChildren");
-function isVisuallyHidden(child) {
-  var _a;
-  return (_a = child == null ? void 0 : child["type"]) == null ? void 0 : _a["isVisuallyHidden"];
+function createSpacer({ key, direction, space, spaceFlex }) {
+  return <Spacer key={key} direction={direction === "both" ? void 0 : direction === "row" || direction === "row-reverse" ? "horizontal" : "vertical"} size={space} {...spaceFlex && {
+    flex: spaceFlex
+  }} />;
+}
+__name(createSpacer, "createSpacer");
+function isUnspaced(child) {
+  var _a, _b;
+  return ((_a = child == null ? void 0 : child["type"]) == null ? void 0 : _a["isVisuallyHidden"]) || ((_b = child == null ? void 0 : child["type"]) == null ? void 0 : _b["isUnspaced"]);
 }
-__name(isVisuallyHidden, "isVisuallyHidden");
+__name(isUnspaced, "isUnspaced");
 function AbsoluteFill(props) {
   return isWeb ? <div style={{
     position: "absolute",
@@ -860,6 +900,7 @@ const accessibilityRoleToWebRole = {
 export {
   AbsoluteFill,
   Spacer,
+  Unspaced,
   createComponent,
   mouseUps,
   spacedChildren

package/dist/jsx/createTamagui.js

@@ -189,12 +189,14 @@ function ensureThemeVariable(theme, key) {
   const val = theme[key];
   if (!isVariable(val)) {
     theme[key] = createVariable({
+      key,
       name: key,
       val
     });
   } else {
     if (val.name !== key) {
       theme[key] = createVariable({
+        key,
         name: key,
         val: val.val
       });

package/dist/jsx/createTokens.js

@@ -17,7 +17,7 @@ const mapTokensToVariables = /* @__PURE__ */ __name((tokens, parentPath = "") =>
     if (val && typeof val === "object") {
       res[key] = mapTokensToVariables(tokens[key], name);
     } else {
-      res[key] = createVariable({ val, name });
+      res[key] = createVariable({ val, name, key });
     }
   }
   return res;

package/dist/jsx/createVariable.js

@@ -4,10 +4,11 @@ var _a;
 import { isWeb } from "./constants/platform";
 const IS_VARIABLE_SYMBOL = "__isVariable__";
 class Variable {
-  constructor({ val, name }) {
+  constructor({ val, name, key }) {
     this[_a] = true;
     this.val = isVariable(val) ? val.val : val;
     this.name = name;
+    this.key = key;
     this.variable = isWeb ? createCSSVariable(name) : this.val;
   }
   toString() {

package/dist/jsx/helpers/extendStaticConfig.js

@@ -35,10 +35,6 @@ function extendStaticConfig(config, parent) {
       ...parent.staticConfig.validStyles,
       ...config.validStyles
     } : parent.staticConfig.validStyles || stylePropsView,
-    defaultVariants: {
-      ...parent.staticConfig.defaultVariants,
-      ...config.defaultVariants
-    },
     defaultProps: {
       ...parent.staticConfig.defaultProps,
       ...parent.staticConfig.defaultVariants,

package/dist/jsx/helpers/getStackSize.js

@@ -33,7 +33,7 @@ const createGetStackSize = /* @__PURE__ */ __name((scale) => (val, extras) => {
     paddingVertical: props.circular ? 0 : py
   };
 }, "createGetStackSize");
-const buttonScaling = { sizeX: 0.9, sizeY: 0.333 };
+const buttonScaling = { sizeX: 0.75, sizeY: 0.333 };
 const getButtonSize = createGetStackSize(buttonScaling);
 export {
   buttonScaling,

package/dist/jsx/index.js

@@ -35,6 +35,7 @@ export * from "./hooks/useMedia";
 export * from "./hooks/usePressable";
 export * from "./hooks/useTheme";
 export * from "./hooks/useUnmountEffect";
+export * from "./views/Slot";
 export * from "./views/Stack";
 export * from "./views/Text";
 export * from "./views/TextAncestorContext";

package/dist/jsx/views/Slot.js

@@ -4,21 +4,17 @@ import { composeRefs } from "@tamagui/compose-refs";
 import * as React from "react";
 const Slot = React.forwardRef((props, forwardedRef) => {
   const { children, ...slotProps } = props;
-  if (React.Children.toArray(children).some(isSlottable)) {
-    return <>{React.Children.map(children, (child) => {
-      return isSlottable(child) ? <SlotClone {...slotProps} ref={forwardedRef}>{child.props.children}</SlotClone> : child;
-    })}</>;
-  }
   return <SlotClone {...slotProps} ref={forwardedRef}>{children}</SlotClone>;
 });
 Slot.displayName = "Slot";
 const SlotClone = React.forwardRef((props, forwardedRef) => {
   const { children, ...slotProps } = props;
   if (React.isValidElement(children)) {
-    return React.cloneElement(children, {
+    const childProps = {
       ...mergeProps(children, slotProps),
       ref: composeRefs(forwardedRef, children.ref)
-    });
+    };
+    return React.cloneElement(children, childProps);
   }
   return React.Children.count(children) > 1 ? React.Children.only(null) : null;
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/core",
-  "version": "1.0.1-beta.41",
+  "version": "1.0.1-beta.44",
   "source": "src/index.ts",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -21,10 +21,10 @@
   ],
   "dependencies": {
     "@expo/match-media": "^0.3.0",
-    "@tamagui/helpers": "^1.0.1-beta.41",
+    "@tamagui/helpers": "^1.0.1-beta.44",
     "@tamagui/ow": "^0.28.1",
-    "@tamagui/use-debounce": "^1.0.1-beta.41",
-    "@tamagui/use-force-update": "^1.0.1-beta.41",
+    "@tamagui/use-debounce": "^1.0.1-beta.44",
+    "@tamagui/use-force-update": "^1.0.1-beta.44",
     "expo-screen-orientation": "^4.2.0",
     "hyphenate-style-name": "^1.0.4",
     "inline-style-prefixer": "^6.0.0",
@@ -36,12 +36,12 @@
     "react-native-web": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "^1.0.1-beta.41",
+    "@tamagui/build": "^1.0.1-beta.44",
     "@types/react": "^17.0.35",
     "csstype": "^3.0.10",
     "esbuild": "^0.14.36",
     "react-native-web": "^0.17.5",
-    "typescript": "^4.5.2"
+    "typescript": "^4.7.2"
   },
   "publishConfig": {
     "access": "public"

package/types/createComponent.d.ts

@@ -1,19 +1,29 @@
-/// <reference types="react" />
-import { View } from 'react-native';
-import { SpaceDirection, SpaceTokens, StackProps, StaticConfig, StaticConfigParsed, StylableComponent, TamaguiComponent } from './types';
+import React from 'react';
+import { SpaceFlexDirection, SpaceTokens, StackProps, StaticConfig, StaticConfigParsed, StylableComponent, TamaguiComponent, TamaguiElement } from './types';
 export declare const mouseUps: Set<Function>;
-export declare function createComponent<ComponentPropTypes extends Object = {}, Ref = View, BaseProps = never>(configIn: Partial<StaticConfig> | StaticConfigParsed, ParentComponent?: StylableComponent): TamaguiComponent<ComponentPropTypes, Ref, BaseProps, {}>;
-export declare const Spacer: TamaguiComponent<Omit<StackProps, "flex" | "direction"> & {
-    size?: SpaceTokens | undefined;
-    flex?: number | boolean | undefined;
-    direction?: "horizontal" | "vertical" | undefined;
-}, View, never, {}>;
-export declare function spacedChildren({ isZStack, children, space, direction, spaceFlex, }: {
+export declare function createComponent<ComponentPropTypes extends Object = {}, Ref = TamaguiElement, BaseProps = never>(configIn: Partial<StaticConfig> | StaticConfigParsed, ParentComponent?: StylableComponent): TamaguiComponent<ComponentPropTypes, Ref, BaseProps, {}>;
+export declare const Unspaced: {
+    (props: {
+        children?: any;
+    }): any;
+    isUnspaced: boolean;
+};
+declare type SpaceDirection = 'vertical' | 'horizontal';
+export declare type SpacerProps = Omit<StackProps, 'flex' | 'direction'> & {
+    size?: number | SpaceTokens;
+    flex?: boolean | number;
+    direction?: SpaceDirection;
+};
+export declare const Spacer: TamaguiComponent<SpacerProps, TamaguiElement, never, {}>;
+export declare type SpacedChildrenProps = {
     isZStack?: boolean;
-    children: any;
+    children?: any;
     space?: any;
     spaceFlex?: boolean | number;
-    direction?: SpaceDirection;
-}): any;
+    direction?: SpaceFlexDirection;
+    separator?: React.ReactNode;
+};
+export declare function spacedChildren({ isZStack, children, space, direction, spaceFlex, separator, }: SpacedChildrenProps): any;
 export declare function AbsoluteFill(props: any): JSX.Element;
+export {};
 //# sourceMappingURL=createComponent.d.ts.map

package/types/createComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":";AAaA,OAAO,EAA+B,IAAI,EAAa,MAAM,cAAc,CAAA;AAiB3E,OAAO,EACL,cAAc,EACd,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,4DAk9B1F;AAKD,eAAO,MAAM,MAAM;;;;mBAgDjB,CAAA;AAEF,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,SAAS,EACT,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,SAAS,CAAC,EAAE,cAAc,CAAA;CAC3B,OAiDA;AAMD,wBAAgB,YAAY,CAAC,KAAK,EAAE,GAAG,eAkBtC"}
+{"version":3,"file":"createComponent.d.ts","sourceRoot":"","sources":["../src/createComponent.tsx"],"names":[],"mappings":"AAEA,OAAO,KAUN,MAAM,OAAO,CAAA;AAkBd,OAAO,EACL,kBAAkB,EAClB,WAAW,EACX,UAAU,EACV,YAAY,EACZ,kBAAkB,EAClB,iBAAiB,EACjB,gBAAgB,EAGhB,cAAc,EAGf,MAAM,SAAS,CAAA;AAgBhB,eAAO,MAAM,QAAQ,eAAsB,CAAA;AA0B3C,wBAAgB,eAAe,CAC7B,kBAAkB,SAAS,MAAM,GAAG,EAAE,EACtC,GAAG,GAAG,cAAc,EACpB,SAAS,GAAG,KAAK,EACjB,QAAQ,EAAE,OAAO,CAAC,YAAY,CAAC,GAAG,kBAAkB,EAAE,eAAe,CAAC,EAAE,iBAAiB,4DAq+B1F;AAGD,eAAO,MAAM,QAAQ;YAAW;QAAE,QAAQ,CAAC,EAAE,GAAG,CAAA;KAAE;;CAEjD,CAAA;AAMD,aAAK,cAAc,GAAG,UAAU,GAAG,YAAY,CAAA;AAE/C,oBAAY,WAAW,GAAG,IAAI,CAAC,UAAU,EAAE,MAAM,GAAG,WAAW,CAAC,GAAG;IACjE,IAAI,CAAC,EAAE,MAAM,GAAG,WAAW,CAAA;IAC3B,IAAI,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IACvB,SAAS,CAAC,EAAE,cAAc,CAAA;CAC3B,CAAA;AACD,eAAO,MAAM,MAAM,0DA0CjB,CAAA;AAEF,oBAAY,mBAAmB,GAAG;IAChC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,QAAQ,CAAC,EAAE,GAAG,CAAA;IACd,KAAK,CAAC,EAAE,GAAG,CAAA;IACX,SAAS,CAAC,EAAE,OAAO,GAAG,MAAM,CAAA;IAC5B,SAAS,CAAC,EAAE,kBAAkB,CAAA;IAC9B,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAA;CAC5B,CAAA;AAED,wBAAgB,cAAc,CAAC,EAC7B,QAAQ,EACR,QAAQ,EACR,KAAK,EACL,SAAS,EACT,SAAS,EACT,SAAS,GACV,EAAE,mBAAmB,OAsErB;AA2BD,wBAAgB,YAAY,CAAC,KAAK,EAAE,GAAG,eAkBtC"}

package/types/createVariable.d.ts

@@ -4,12 +4,14 @@ export declare class Variable {
     name: string;
     val: string | number;
     variable: string | number;
-    constructor({ val, name }: VariableIn);
+    key: string;
+    constructor({ val, name, key }: VariableIn);
     toString(): string;
 }
 declare type VariableIn = {
     val: string | number | Variable;
     name: string;
+    key: string;
 };
 export declare const createVariable: (props: VariableIn) => Variable;
 export declare function isVariable(v: Variable | any): v is Variable;

package/types/createVariable.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createVariable.d.ts","sourceRoot":"","sources":["../src/createVariable.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,mBAAmB,CAAA;AAElD,qBAAa,QAAQ;IAInB,CAAC,kBAAkB,CAAC,UAAO;IAE3B,IAAI,EAAE,MAAM,CAAA;IACZ,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;IACpB,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAA;gBAEb,EAAE,GAAG,EAAE,IAAI,EAAE,EAAE,UAAU;IAOrC,QAAQ;CAGT;AAED,aAAK,UAAU,GAAG;IAAE,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;IAAC,IAAI,EAAE,MAAM,CAAA;CAAE,CAAA;AAEnE,eAAO,MAAM,cAAc,UAAW,UAAU,aAAwB,CAAA;AAExE,wBAAgB,UAAU,CAAC,CAAC,EAAE,QAAQ,GAAG,GAAG,GAAG,CAAC,IAAI,QAAQ,CAE3D;AAED,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,QAAQ,GAAG,GAAG,OAGjD;AAED,wBAAgB,eAAe,CAAC,CAAC,EAAE,QAAQ,GAAG,GAAG,OAGhD;AAGD,eAAO,MAAM,iBAAiB,QAAS,MAAM,iCAG5C,CAAA"}
+{"version":3,"file":"createVariable.d.ts","sourceRoot":"","sources":["../src/createVariable.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,kBAAkB,mBAAmB,CAAA;AAElD,qBAAa,QAAQ;IAInB,CAAC,kBAAkB,CAAC,UAAO;IAE3B,IAAI,EAAE,MAAM,CAAA;IACZ,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;IACpB,QAAQ,EAAE,MAAM,GAAG,MAAM,CAAA;IACzB,GAAG,EAAE,MAAM,CAAA;gBAEC,EAAE,GAAG,EAAE,IAAI,EAAE,GAAG,EAAE,EAAE,UAAU;IAQ1C,QAAQ;CAGT;AAED,aAAK,UAAU,GAAG;IAAE,GAAG,EAAE,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;IAAC,IAAI,EAAE,MAAM,CAAC;IAAC,GAAG,EAAE,MAAM,CAAA;CAAE,CAAA;AAEhF,eAAO,MAAM,cAAc,UAAW,UAAU,aAAwB,CAAA;AAExE,wBAAgB,UAAU,CAAC,CAAC,EAAE,QAAQ,GAAG,GAAG,GAAG,CAAC,IAAI,QAAQ,CAE3D;AAED,wBAAgB,gBAAgB,CAAC,CAAC,EAAE,QAAQ,GAAG,GAAG,OAGjD;AAED,wBAAgB,eAAe,CAAC,CAAC,EAAE,QAAQ,GAAG,GAAG,OAGhD;AAGD,eAAO,MAAM,iBAAiB,QAAS,MAAM,iCAG5C,CAAA"}

package/types/helpers/extendStaticConfig.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"extendStaticConfig.d.ts","sourceRoot":"","sources":["../../src/helpers/extendStaticConfig.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAG9E,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,OAAO,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC,EAAE,iBAAiB,sBAiD3F;AAED,eAAO,MAAM,iBAAiB,WAAY,QAAQ,YAAY,CAAC,KAAG,kBAMjE,CAAA"}
+{"version":3,"file":"extendStaticConfig.d.ts","sourceRoot":"","sources":["../../src/helpers/extendStaticConfig.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,YAAY,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAA;AAG9E,wBAAgB,kBAAkB,CAAC,MAAM,EAAE,OAAO,CAAC,YAAY,CAAC,EAAE,MAAM,CAAC,EAAE,iBAAiB,sBA6C3F;AAED,eAAO,MAAM,iBAAiB,WAAY,QAAQ,YAAY,CAAC,KAAG,kBAMjE,CAAA"}

package/types/helpers/getSize.d.ts

@@ -1,3 +1,3 @@
 import { SizeTokens } from '../types';
-export declare const getSize: (size?: SizeTokens | undefined, sizeUpOrDownBy?: number) => SizeTokens;
+export declare const getSize: (size?: SizeTokens | undefined, sizeUpOrDownBy?: number) => import("..").Variable;
 //# sourceMappingURL=getSize.d.ts.map

package/types/helpers/getSize.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getSize.d.ts","sourceRoot":"","sources":["../../src/helpers/getSize.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAErC,eAAO,MAAM,OAAO,UAAW,UAAU,GAAG,SAAS,wCAKpD,CAAA"}
+{"version":3,"file":"getSize.d.ts","sourceRoot":"","sources":["../../src/helpers/getSize.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAErC,eAAO,MAAM,OAAO,UAAW,UAAU,GAAG,SAAS,mDAKpD,CAAA"}

package/types/helpers/getStackSize.d.ts

@@ -8,9 +8,9 @@ export declare type ScaleVariantExtras = Pick<VariantSpreadExtras<any>, 'tokens'
 export declare const getSizeScaledToFont: (val: string | number, { sizeX, sizeY }: ScaleProps, { tokens, props, fonts }: ScaleVariantExtras) => {
     px: number;
     py: number;
-    radius: import("@tamagui/core").VariableVal;
-    size: import("@tamagui/core").VariableVal;
-    lineHeight: number | import("@tamagui/core").Variable | undefined;
+    radius: any;
+    size: any;
+    lineHeight: any;
     minHeight: number;
 };
 export declare const createGetStackSize: (scale: ScaleProps) => (val: SizeTokens | number, extras: VariantSpreadExtras<any>) => {

package/types/helpers/getStackSize.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"getStackSize.d.ts","sourceRoot":"","sources":["../../src/helpers/getStackSize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAgC,MAAM,eAAe,CAAA;AAEjF,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAIrC,aAAK,UAAU,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AAElD,oBAAY,kBAAkB,GAAG,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC,CAAA;AAE7F,eAAO,MAAM,mBAAmB,QACzB,MAAM,GAAG,MAAM,oBACM,UAAU,4BACV,kBAAkB;;;;;;;CAqB7C,CAAA;AAED,eAAO,MAAM,kBAAkB,UACrB,UAAU,WAAW,UAAU,GAAG,MAAM,UAAU,oBAAoB,GAAG,CAAC;;;;;CASjF,CAAA;AAEH,eAAO,MAAM,aAAa;;;CAA+B,CAAA;AACzD,eAAO,MAAM,aAAa,QAZK,UAAU,GAAG,MAAM,UAAU,oBAAoB,GAAG,CAAC;;;;;CAYtB,CAAA"}
+{"version":3,"file":"getStackSize.d.ts","sourceRoot":"","sources":["../../src/helpers/getStackSize.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,mBAAmB,EAAgC,MAAM,eAAe,CAAA;AAEjF,OAAO,EAAE,UAAU,EAAE,MAAM,UAAU,CAAA;AAIrC,aAAK,UAAU,GAAG;IAAE,KAAK,EAAE,MAAM,CAAC;IAAC,KAAK,EAAE,MAAM,CAAA;CAAE,CAAA;AAElD,oBAAY,kBAAkB,GAAG,IAAI,CAAC,mBAAmB,CAAC,GAAG,CAAC,EAAE,QAAQ,GAAG,OAAO,GAAG,OAAO,CAAC,CAAA;AAE7F,eAAO,MAAM,mBAAmB,QACzB,MAAM,GAAG,MAAM,oBACM,UAAU,4BACV,kBAAkB;;;;;;;CAqB7C,CAAA;AAED,eAAO,MAAM,kBAAkB,UACrB,UAAU,WAAW,UAAU,GAAG,MAAM;;;;;CAS/C,CAAA;AAEH,eAAO,MAAM,aAAa;;;CAAgC,CAAA;AAC1D,eAAO,MAAM,aAAa,QAZK,UAAU,GAAG,MAAM;;;;;CAYY,CAAA"}

package/types/index.d.ts

@@ -35,6 +35,7 @@ export * from './hooks/useMedia';
 export * from './hooks/usePressable';
 export * from './hooks/useTheme';
 export * from './hooks/useUnmountEffect';
+export * from './views/Slot';
 export * from './views/Stack';
 export * from './views/Text';
 export * from './views/TextAncestorContext';

package/types/index.d.ts.map

@@ -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,+BAA+B,CAAA;AAC7C,cAAc,wBAAwB,CAAA;AACtC,cAAc,4BAA4B,CAAA;AAC1C,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"}
+{"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,+BAA+B,CAAA;AAC7C,cAAc,wBAAwB,CAAA;AACtC,cAAc,4BAA4B,CAAA;AAC1C,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,cAAc,CAAA;AAC5B,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"}

package/types/styled.d.ts

@@ -6,11 +6,11 @@ export declare type StyledOptions<ParentComponent extends StylableComponent> = G
         [key: string]: any;
     };
 };
-export declare function styled<ParentComponent extends StylableComponent, Variants extends VariantDefinitions<ParentComponent> | symbol = VariantDefinitions<ParentComponent> | symbol>(Component: ParentComponent, options?: GetProps<ParentComponent> & {
+export declare function styled<ParentComponent extends StylableComponent, Variants extends VariantDefinitions<ParentComponent> | void = VariantDefinitions<ParentComponent> | void>(Component: ParentComponent, options?: GetProps<ParentComponent> & {
     name?: string;
     variants?: Variants | undefined;
     defaultVariants?: {
         [key: string]: any;
     };
-}, staticExtractionOptions?: Partial<StaticConfig>): TamaguiComponent<Variants extends symbol | void ? GetProps<ParentComponent> : (ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends symbol ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends symbol ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; }) & MediaProps<Partial<(ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends symbol ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends symbol ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>> & PseudoProps<Partial<(ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends symbol ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends symbol ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>>, any, ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>, (ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}) & (Variants extends symbol ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>;
+}, staticExtractionOptions?: Partial<StaticConfig>): TamaguiComponent<Variants extends void ? GetProps<ParentComponent> : (ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; }) & MediaProps<Partial<(ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>> & PseudoProps<Partial<(ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>) & Omit<ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}, keyof (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })> & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>>, any, ParentComponent extends TamaguiComponent<any, any, infer P, {}> ? P : GetProps<ParentComponent>, (ParentComponent extends TamaguiComponent<any, any, any, infer V> ? V : {}) & (Variants extends void ? {} : { [Key in keyof Variants]?: (Variants[Key] extends VariantSpreadFunction<any, infer Val> ? Val : GetVariantValues<keyof Variants[Key]>) | undefined; })>;
 //# sourceMappingURL=styled.d.ts.map

package/types/styled.d.ts.map

@@ -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,qnEAiFhD"}
+{"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;AAIhB,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,IAAI,GAAG,kBAAkB,CAAC,eAAe,CAAC,GAAG,IAAI,EAExG,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,8lEAiFhD"}

package/types/types.d.ts

@@ -1,14 +1,17 @@
-import CSS from 'csstype';
+import { Properties } from 'csstype';
 import React from 'react';
 import { GestureResponderEvent, Image, TextProps as ReactTextProps, Text, TextInput, TextStyle, View, ViewProps, ViewStyle } from 'react-native';
 import { Variable } from './createVariable';
 import { ResolveVariableTypes } from './helpers/createPropMapper';
 import { RNWTextProps, RNWViewProps } from './types-rnw';
 import { ThemeProviderProps } from './views/ThemeProvider';
+export declare type SpaceFlexDirection = ViewStyle['flexDirection'] | 'both';
+export declare type TamaguiElement = HTMLElement | View;
 export declare type TamaguiComponentPropsBase = {
     asChild?: boolean;
     space?: SpaceTokens;
-    spaceDirection?: SpaceDirection;
+    spaceDirection?: SpaceFlexDirection;
+    separator?: React.ReactNode;
     dangerouslySetInnerHTML?: {
         __html: string;
     };
@@ -199,7 +202,6 @@ export declare type AnimationProp = AnimationKeys | {
         };
     }
 ];
-export declare type SpaceDirection = ViewStyle['flexDirection'] | 'both';
 declare type GetTokenFontKeysFor<A extends 'size' | 'weight' | 'letterSpacing' | 'family' | 'lineHeight' | 'transform' | 'style' | 'color'> = keyof TamaguiConfig['fonts']['body'][A];
 declare type GetTokenString<A> = A extends string | number ? `$${A}` : `$${string}`;
 export declare type SizeTokens = GetTokenString<keyof Tokens['size']> | number;
@@ -267,11 +269,11 @@ export declare type TextStylePropsBase = Omit<TextStyle, 'display' | 'backfaceVi
     ellipse?: boolean;
     selectable?: boolean;
     textDecorationDistance?: number;
-    userSelect?: CSS.Properties['userSelect'];
-    textOverflow?: CSS.Properties['textOverflow'];
-    whiteSpace?: CSS.Properties['whiteSpace'];
-    wordWrap?: CSS.Properties['wordWrap'];
-    cursor?: CSS.Properties['cursor'];
+    userSelect?: Properties['userSelect'];
+    textOverflow?: Properties['textOverflow'];
+    whiteSpace?: Properties['whiteSpace'];
+    wordWrap?: Properties['wordWrap'];
+    cursor?: Properties['cursor'];
 };
 export declare type TextPropsBaseShared = Omit<ReactTextProps, 'children'> & RNWTextProps & TamaguiComponentPropsBase;
 export declare type TextPropsBase = TextPropsBaseShared & WithThemeAndShorthands<TextStylePropsBase>;