@tamagui/web 3.0.0-beta.765.1 → 3.0.0-beta.804.1

package/dist/esm/hooks/useProps.mjs

@@ -3,9 +3,9 @@ import React from "react";
 import { getConfig } from "../config.mjs";
 import { ComponentContext } from "../contexts/ComponentContext.mjs";
 import { GroupContext } from "../contexts/GroupContext.mjs";
-import { useSplitStyles } from "../helpers/getSplitStyles.mjs";
+import { useSplitStyles } from "./useSplitStyles.mjs";
 import { subscribeToSafeArea } from "../helpers/resolveSafeAreaVariable.mjs";
-import { subscribeToContextGroup } from "../helpers/subscribeToContextGroup.mjs";
+import { subscribeToContextGroup, useGroupSetRevision } from "../helpers/subscribeToContextGroup.mjs";
 import { View } from "../views/View.mjs";
 import { useComponentState } from "./useComponentState.mjs";
 import { mediaState } from "../helpers/mediaState.mjs";
@@ -37,7 +37,8 @@ function usePropsAndStyle(props, opts) {
 	});
 	const componentContext = React.useContext(ComponentContext);
 	const groupContext = React.useContext(GroupContext);
-	const { props: statefulProps, state, disabled, setState, setStateShallow } = useComponentState(props, componentContext.animationDriver, staticConfig, getConfig());
+	const componentState = useComponentState(props, componentContext.animationDriver, staticConfig, getConfig());
+	const { props: statefulProps, state, disabled, setState, setStateShallow } = componentState;
 	const mediaStateNow = opts?.noMedia ? mediaState : useMedia();
 	const splitStyles = useSplitStyles(statefulProps, staticConfig, theme, themeState?.name || "", state, {
 		isAnimated: false,
@@ -48,7 +49,9 @@ function usePropsAndStyle(props, opts) {
 		resolveValues: "auto",
 		...opts
 	}, null, componentContext, groupContext);
+	componentState.finalizeStyleFlags(!!splitStyles?.hasEnterStyle, !!splitStyles?.platformPseudo);
 	const { mediaGroups, pseudoGroups } = splitStyles || {};
+	const groupSetRevision = useGroupSetRevision(pseudoGroups, mediaGroups);
 	useIsomorphicLayoutEffect(() => {
 		let disposeSafeArea;
 		if (splitStyles?.usesSafeArea) {
@@ -83,8 +86,7 @@ function usePropsAndStyle(props, opts) {
 		disabled,
 		groupContext,
 		splitStyles?.usesSafeArea,
-		pseudoGroups ? Object.keys([...pseudoGroups]).join("") : 0,
-		mediaGroups ? Object.keys([...mediaGroups]).join("") : 0
+		groupSetRevision
 	]);
 	return [
 		splitStyles?.viewProps || {},

package/dist/esm/hooks/useProps.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"useProps.js","names":[],"sources":["esm/hooks/useProps.js"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@tamagui/constants\";\nimport React from \"react\";\nimport { getConfig } from \"../config\";\nimport { ComponentContext } from \"../contexts/ComponentContext\";\nimport { GroupContext } from \"../contexts/GroupContext\";\nimport { useSplitStyles } from \"../helpers/getSplitStyles\";\nimport { subscribeToSafeArea } from \"../helpers/resolveSafeAreaVariable\";\nimport { subscribeToContextGroup } from \"../helpers/subscribeToContextGroup\";\nimport { View } from \"../views/View\";\nimport { useComponentState } from \"./useComponentState\";\nimport { mediaState } from \"../helpers/mediaState\";\nimport { useMedia } from \"./useMedia\";\nimport { useThemeWithState } from \"./useTheme\";\nfunction useProps(props, opts) {\n  const [propsOut, styleOut] = usePropsAndStyle(props, {\n    ...opts,\n    noExpand: true,\n    noNormalize: true,\n    resolveValues: \"none\"\n  });\n  return {\n    ...propsOut,\n    ...styleOut\n  };\n}\nfunction useStyle(props, opts) {\n  return usePropsAndStyle(props, opts)[1] || {};\n}\nfunction usePropsAndStyle(props, opts) {\n  const staticConfig = opts?.forComponent?.staticConfig ?? View.staticConfig;\n  const [theme, themeState] = useThemeWithState({\n    name: \"theme\" in props ? props.theme : void 0,\n    needsUpdate() {\n      return true;\n    }\n  });\n  const componentContext = React.useContext(ComponentContext);\n  const groupContext = React.useContext(GroupContext);\n  const {\n    props: statefulProps,\n    state,\n    disabled,\n    setState,\n    setStateShallow\n  } = useComponentState(\n    props,\n    componentContext.animationDriver,\n    staticConfig,\n    getConfig()\n  );\n  const mediaStateNow = opts?.noMedia ? (\n    // not safe to use mediaState but really marginal to hit this\n    mediaState\n  ) : useMedia();\n  const splitStyles = useSplitStyles(\n    statefulProps,\n    staticConfig,\n    theme,\n    themeState?.name || \"\",\n    state,\n    {\n      isAnimated: false,\n      mediaState: mediaStateNow,\n      noSkip: true,\n      noMergeStyle: true,\n      noClass: true,\n      resolveValues: \"auto\",\n      ...opts\n    },\n    null,\n    componentContext,\n    groupContext\n  );\n  const { mediaGroups, pseudoGroups } = splitStyles || {};\n  useIsomorphicLayoutEffect(() => {\n    let disposeSafeArea;\n    if (splitStyles?.usesSafeArea) {\n      const updateSafeArea = () => {\n        setState((previous) => ({ ...previous }));\n      };\n      disposeSafeArea = subscribeToSafeArea(updateSafeArea);\n      updateSafeArea();\n    }\n    if (disabled) {\n      return disposeSafeArea;\n    }\n    if (state.unmounted) {\n      setStateShallow({ unmounted: false });\n      return disposeSafeArea;\n    }\n    if (groupContext) {\n      const disposeGroup = subscribeToContextGroup({\n        groupContext,\n        setStateShallow,\n        mediaGroups,\n        pseudoGroups\n      });\n      if (!disposeSafeArea) return disposeGroup;\n      return () => {\n        disposeSafeArea();\n        disposeGroup?.();\n      };\n    }\n    return disposeSafeArea;\n  }, [\n    disabled,\n    groupContext,\n    splitStyles?.usesSafeArea,\n    pseudoGroups ? Object.keys([...pseudoGroups]).join(\"\") : 0,\n    mediaGroups ? Object.keys([...mediaGroups]).join(\"\") : 0\n  ]);\n  return [\n    splitStyles?.viewProps || {},\n    splitStyles?.style || {},\n    theme,\n    mediaState\n  ];\n}\nexport {\n  useProps,\n  usePropsAndStyle,\n  useStyle\n};\n//# sourceMappingURL=useProps.js.map\n"],"mappings":";;;;;;;;;;;;;;;AAaA,SAAS,SAAS,OAAO,MAAM;CAC7B,MAAM,CAAC,UAAU,YAAY,iBAAiB,OAAO;EACnD,GAAG;EACH,UAAU;EACV,aAAa;EACb,eAAe;CACjB,CAAC;CACD,OAAO;EACL,GAAG;EACH,GAAG;CACL;AACF;AACA,SAAS,SAAS,OAAO,MAAM;CAC7B,OAAO,iBAAiB,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC;AAC9C;AACA,SAAS,iBAAiB,OAAO,MAAM;CACrC,MAAM,eAAe,MAAM,cAAc,gBAAgB,KAAK;CAC9D,MAAM,CAAC,OAAO,cAAc,kBAAkB;EAC5C,MAAM,WAAW,QAAQ,MAAM,QAAQ,KAAK;EAC5C,cAAc;GACZ,OAAO;EACT;CACF,CAAC;CACD,MAAM,mBAAmB,MAAM,WAAW,gBAAgB;CAC1D,MAAM,eAAe,MAAM,WAAW,YAAY;CAClD,MAAM,EACJ,OAAO,eACP,OACA,UACA,UACA,oBACE,kBACF,OACA,iBAAiB,iBACjB,cACA,UAAU,CACZ;CACA,MAAM,gBAAgB,MAAM,UAE1B,aACE,SAAS;CACb,MAAM,cAAc,eAClB,eACA,cACA,OACA,YAAY,QAAQ,IACpB,OACA;EACE,YAAY;EACZ,YAAY;EACZ,QAAQ;EACR,cAAc;EACd,SAAS;EACT,eAAe;EACf,GAAG;CACL,GACA,MACA,kBACA,YACF;CACA,MAAM,EAAE,aAAa,iBAAiB,eAAe,CAAC;CACtD,gCAAgC;EAC9B,IAAI;EACJ,IAAI,aAAa,cAAc;GAC7B,MAAM,uBAAuB;IAC3B,UAAU,cAAc,EAAE,GAAG,SAAS,EAAE;GAC1C;GACA,kBAAkB,oBAAoB,cAAc;GACpD,eAAe;EACjB;EACA,IAAI,UAAU;GACZ,OAAO;EACT;EACA,IAAI,MAAM,WAAW;GACnB,gBAAgB,EAAE,WAAW,MAAM,CAAC;GACpC,OAAO;EACT;EACA,IAAI,cAAc;GAChB,MAAM,eAAe,wBAAwB;IAC3C;IACA;IACA;IACA;GACF,CAAC;GACD,IAAI,CAAC,iBAAiB,OAAO;GAC7B,aAAa;IACX,gBAAgB;IAChB,eAAe;GACjB;EACF;EACA,OAAO;CACT,GAAG;EACD;EACA;EACA,aAAa;EACb,eAAe,OAAO,KAAK,CAAC,GAAG,YAAY,CAAC,CAAC,CAAC,KAAK,EAAE,IAAI;EACzD,cAAc,OAAO,KAAK,CAAC,GAAG,WAAW,CAAC,CAAC,CAAC,KAAK,EAAE,IAAI;CACzD,CAAC;CACD,OAAO;EACL,aAAa,aAAa,CAAC;EAC3B,aAAa,SAAS,CAAC;EACvB;EACA;CACF;AACF"}
+{"version":3,"file":"useProps.js","names":[],"sources":["esm/hooks/useProps.js"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@tamagui/constants\";\nimport React from \"react\";\nimport { getConfig } from \"../config\";\nimport { ComponentContext } from \"../contexts/ComponentContext\";\nimport { GroupContext } from \"../contexts/GroupContext\";\nimport { useSplitStyles } from \"./useSplitStyles\";\nimport { subscribeToSafeArea } from \"../helpers/resolveSafeAreaVariable\";\nimport {\n  subscribeToContextGroup,\n  useGroupSetRevision\n} from \"../helpers/subscribeToContextGroup\";\nimport { View } from \"../views/View\";\nimport { useComponentState } from \"./useComponentState\";\nimport { mediaState } from \"../helpers/mediaState\";\nimport { useMedia } from \"./useMedia\";\nimport { useThemeWithState } from \"./useTheme\";\nfunction useProps(props, opts) {\n  const [propsOut, styleOut] = usePropsAndStyle(props, {\n    ...opts,\n    noExpand: true,\n    noNormalize: true,\n    resolveValues: \"none\"\n  });\n  return {\n    ...propsOut,\n    ...styleOut\n  };\n}\nfunction useStyle(props, opts) {\n  return usePropsAndStyle(props, opts)[1] || {};\n}\nfunction usePropsAndStyle(props, opts) {\n  const staticConfig = opts?.forComponent?.staticConfig ?? View.staticConfig;\n  const [theme, themeState] = useThemeWithState({\n    name: \"theme\" in props ? props.theme : void 0,\n    needsUpdate() {\n      return true;\n    }\n  });\n  const componentContext = React.useContext(ComponentContext);\n  const groupContext = React.useContext(GroupContext);\n  const componentState = useComponentState(\n    props,\n    componentContext.animationDriver,\n    staticConfig,\n    getConfig()\n  );\n  const {\n    props: statefulProps,\n    state,\n    disabled,\n    setState,\n    setStateShallow\n  } = componentState;\n  const mediaStateNow = opts?.noMedia ? (\n    // not safe to use mediaState but really marginal to hit this\n    mediaState\n  ) : useMedia();\n  const splitStyles = useSplitStyles(\n    statefulProps,\n    staticConfig,\n    theme,\n    themeState?.name || \"\",\n    state,\n    {\n      isAnimated: false,\n      mediaState: mediaStateNow,\n      noSkip: true,\n      noMergeStyle: true,\n      noClass: true,\n      resolveValues: \"auto\",\n      ...opts\n    },\n    null,\n    componentContext,\n    groupContext\n  );\n  componentState.finalizeStyleFlags(\n    !!splitStyles?.hasEnterStyle,\n    !!splitStyles?.platformPseudo\n  );\n  const { mediaGroups, pseudoGroups } = splitStyles || {};\n  const groupSetRevision = useGroupSetRevision(pseudoGroups, mediaGroups);\n  useIsomorphicLayoutEffect(() => {\n    let disposeSafeArea;\n    if (splitStyles?.usesSafeArea) {\n      const updateSafeArea = () => {\n        setState((previous) => ({ ...previous }));\n      };\n      disposeSafeArea = subscribeToSafeArea(updateSafeArea);\n      updateSafeArea();\n    }\n    if (disabled) {\n      return disposeSafeArea;\n    }\n    if (state.unmounted) {\n      setStateShallow({ unmounted: false });\n      return disposeSafeArea;\n    }\n    if (groupContext) {\n      const disposeGroup = subscribeToContextGroup({\n        groupContext,\n        setStateShallow,\n        mediaGroups,\n        pseudoGroups\n      });\n      if (!disposeSafeArea) return disposeGroup;\n      return () => {\n        disposeSafeArea();\n        disposeGroup?.();\n      };\n    }\n    return disposeSafeArea;\n  }, [disabled, groupContext, splitStyles?.usesSafeArea, groupSetRevision]);\n  return [\n    splitStyles?.viewProps || {},\n    splitStyles?.style || {},\n    theme,\n    mediaState\n  ];\n}\nexport {\n  useProps,\n  usePropsAndStyle,\n  useStyle\n};\n//# sourceMappingURL=useProps.js.map\n"],"mappings":";;;;;;;;;;;;;;;AAgBA,SAAS,SAAS,OAAO,MAAM;CAC7B,MAAM,CAAC,UAAU,YAAY,iBAAiB,OAAO;EACnD,GAAG;EACH,UAAU;EACV,aAAa;EACb,eAAe;CACjB,CAAC;CACD,OAAO;EACL,GAAG;EACH,GAAG;CACL;AACF;AACA,SAAS,SAAS,OAAO,MAAM;CAC7B,OAAO,iBAAiB,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC;AAC9C;AACA,SAAS,iBAAiB,OAAO,MAAM;CACrC,MAAM,eAAe,MAAM,cAAc,gBAAgB,KAAK;CAC9D,MAAM,CAAC,OAAO,cAAc,kBAAkB;EAC5C,MAAM,WAAW,QAAQ,MAAM,QAAQ,KAAK;EAC5C,cAAc;GACZ,OAAO;EACT;CACF,CAAC;CACD,MAAM,mBAAmB,MAAM,WAAW,gBAAgB;CAC1D,MAAM,eAAe,MAAM,WAAW,YAAY;CAClD,MAAM,iBAAiB,kBACrB,OACA,iBAAiB,iBACjB,cACA,UAAU,CACZ;CACA,MAAM,EACJ,OAAO,eACP,OACA,UACA,UACA,oBACE;CACJ,MAAM,gBAAgB,MAAM,UAE1B,aACE,SAAS;CACb,MAAM,cAAc,eAClB,eACA,cACA,OACA,YAAY,QAAQ,IACpB,OACA;EACE,YAAY;EACZ,YAAY;EACZ,QAAQ;EACR,cAAc;EACd,SAAS;EACT,eAAe;EACf,GAAG;CACL,GACA,MACA,kBACA,YACF;CACA,eAAe,mBACb,CAAC,CAAC,aAAa,eACf,CAAC,CAAC,aAAa,cACjB;CACA,MAAM,EAAE,aAAa,iBAAiB,eAAe,CAAC;CACtD,MAAM,mBAAmB,oBAAoB,cAAc,WAAW;CACtE,gCAAgC;EAC9B,IAAI;EACJ,IAAI,aAAa,cAAc;GAC7B,MAAM,uBAAuB;IAC3B,UAAU,cAAc,EAAE,GAAG,SAAS,EAAE;GAC1C;GACA,kBAAkB,oBAAoB,cAAc;GACpD,eAAe;EACjB;EACA,IAAI,UAAU;GACZ,OAAO;EACT;EACA,IAAI,MAAM,WAAW;GACnB,gBAAgB,EAAE,WAAW,MAAM,CAAC;GACpC,OAAO;EACT;EACA,IAAI,cAAc;GAChB,MAAM,eAAe,wBAAwB;IAC3C;IACA;IACA;IACA;GACF,CAAC;GACD,IAAI,CAAC,iBAAiB,OAAO;GAC7B,aAAa;IACX,gBAAgB;IAChB,eAAe;GACjB;EACF;EACA,OAAO;CACT,GAAG;EAAC;EAAU;EAAc,aAAa;EAAc;CAAgB,CAAC;CACxE,OAAO;EACL,aAAa,aAAa,CAAC;EAC3B,aAAa,SAAS,CAAC;EACvB;EACA;CACF;AACF"}

package/dist/esm/hooks/useProps.native.js

@@ -3,9 +3,9 @@ import React from "react";
 import { getConfig } from "../config.native.js";
 import { ComponentContext } from "../contexts/ComponentContext.native.js";
 import { GroupContext } from "../contexts/GroupContext.native.js";
-import { useSplitStyles } from "../helpers/getSplitStyles.native.js";
+import { useSplitStyles } from "./useSplitStyles.native.js";
 import { subscribeToSafeArea } from "../helpers/resolveSafeAreaVariable.native.js";
-import { subscribeToContextGroup } from "../helpers/subscribeToContextGroup.native.js";
+import { subscribeToContextGroup, useGroupSetRevision } from "../helpers/subscribeToContextGroup.native.js";
 import { View } from "../views/View.native.js";
 import { useComponentState } from "./useComponentState.native.js";
 import { mediaState } from "../helpers/mediaState.native.js";
@@ -39,7 +39,8 @@ function usePropsAndStyle(props, opts) {
 	});
 	var componentContext = React.useContext(ComponentContext);
 	var groupContext = React.useContext(GroupContext);
-	var { props: statefulProps, state, disabled, setState, setStateShallow } = useComponentState(props, componentContext.animationDriver, staticConfig, getConfig());
+	var componentState = useComponentState(props, componentContext.animationDriver, staticConfig, getConfig());
+	var { props: statefulProps, state, disabled, setState, setStateShallow } = componentState;
 	var mediaStateNow = (opts === null || opts === void 0 ? void 0 : opts.noMedia) ? mediaState : useMedia();
 	var splitStyles = useSplitStyles(statefulProps, staticConfig, theme, (themeState === null || themeState === void 0 ? void 0 : themeState.name) || "", state, {
 		isAnimated: false,
@@ -50,7 +51,9 @@ function usePropsAndStyle(props, opts) {
 		resolveValues: "auto",
 		...opts
 	}, null, componentContext, groupContext);
+	componentState.finalizeStyleFlags(!!(splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.hasEnterStyle), !!(splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.platformPseudo));
 	var { mediaGroups, pseudoGroups } = splitStyles || {};
+	var groupSetRevision = useGroupSetRevision(pseudoGroups, mediaGroups);
 	useIsomorphicLayoutEffect(function() {
 		var disposeSafeArea;
 		if (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.usesSafeArea) {
@@ -87,8 +90,7 @@ function usePropsAndStyle(props, opts) {
 		disabled,
 		groupContext,
 		splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.usesSafeArea,
-		pseudoGroups ? Object.keys([...pseudoGroups]).join("") : 0,
-		mediaGroups ? Object.keys([...mediaGroups]).join("") : 0
+		groupSetRevision
 	]);
 	return [
 		(splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.viewProps) || {},

package/dist/esm/hooks/useProps.native.js.map

@@ -1 +1 @@
-{"version":3,"file":"useProps.native.js","names":[],"sources":["esm/hooks/useProps.native.js"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@tamagui/constants\";\nimport React from \"react\";\nimport { getConfig } from \"../config\";\nimport { ComponentContext } from \"../contexts/ComponentContext\";\nimport { GroupContext } from \"../contexts/GroupContext\";\nimport { useSplitStyles } from \"../helpers/getSplitStyles\";\nimport { subscribeToSafeArea } from \"../helpers/resolveSafeAreaVariable\";\nimport { subscribeToContextGroup } from \"../helpers/subscribeToContextGroup\";\nimport { View } from \"../views/View\";\nimport { useComponentState } from \"./useComponentState\";\nimport { mediaState } from \"../helpers/mediaState\";\nimport { useMedia } from \"./useMedia\";\nimport { useThemeWithState } from \"./useTheme\";\nfunction useProps(props, opts) {\n  var [propsOut, styleOut] = usePropsAndStyle(props, {\n    ...opts,\n    noExpand: true,\n    noNormalize: true,\n    resolveValues: \"none\"\n  });\n  return {\n    ...propsOut,\n    ...styleOut\n  };\n}\nfunction useStyle(props, opts) {\n  return usePropsAndStyle(props, opts)[1] || {};\n}\nfunction usePropsAndStyle(props, opts) {\n  var _opts_forComponent;\n  var _opts_forComponent_staticConfig;\n  var staticConfig = (_opts_forComponent_staticConfig = opts === null || opts === void 0 ? void 0 : (_opts_forComponent = opts.forComponent) === null || _opts_forComponent === void 0 ? void 0 : _opts_forComponent.staticConfig) !== null && _opts_forComponent_staticConfig !== void 0 ? _opts_forComponent_staticConfig : View.staticConfig;\n  var [theme, themeState] = useThemeWithState({\n    name: \"theme\" in props ? props.theme : void 0,\n    needsUpdate() {\n      return true;\n    }\n  });\n  var componentContext = React.useContext(ComponentContext);\n  var groupContext = React.useContext(GroupContext);\n  var { props: statefulProps, state, disabled, setState, setStateShallow } = useComponentState(props, componentContext.animationDriver, staticConfig, getConfig());\n  var mediaStateNow = (opts === null || opts === void 0 ? void 0 : opts.noMedia) ? (\n    // not safe to use mediaState but really marginal to hit this\n    mediaState\n  ) : useMedia();\n  var splitStyles = useSplitStyles(statefulProps, staticConfig, theme, (themeState === null || themeState === void 0 ? void 0 : themeState.name) || \"\", state, {\n    isAnimated: false,\n    mediaState: mediaStateNow,\n    noSkip: true,\n    noMergeStyle: true,\n    noClass: true,\n    resolveValues: \"auto\",\n    ...opts\n  }, null, componentContext, groupContext);\n  var { mediaGroups, pseudoGroups } = splitStyles || {};\n  useIsomorphicLayoutEffect(function() {\n    var disposeSafeArea;\n    if (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.usesSafeArea) {\n      var updateSafeArea = function() {\n        setState(function(previous) {\n          return {\n            ...previous\n          };\n        });\n      };\n      disposeSafeArea = subscribeToSafeArea(updateSafeArea);\n      updateSafeArea();\n    }\n    if (disabled) {\n      return disposeSafeArea;\n    }\n    if (state.unmounted) {\n      setStateShallow({\n        unmounted: false\n      });\n      return disposeSafeArea;\n    }\n    if (groupContext) {\n      var disposeGroup = subscribeToContextGroup({\n        groupContext,\n        setStateShallow,\n        mediaGroups,\n        pseudoGroups\n      });\n      if (!disposeSafeArea) return disposeGroup;\n      return function() {\n        disposeSafeArea();\n        disposeGroup === null || disposeGroup === void 0 ? void 0 : disposeGroup();\n      };\n    }\n    return disposeSafeArea;\n  }, [\n    disabled,\n    groupContext,\n    splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.usesSafeArea,\n    pseudoGroups ? Object.keys([\n      ...pseudoGroups\n    ]).join(\"\") : 0,\n    mediaGroups ? Object.keys([\n      ...mediaGroups\n    ]).join(\"\") : 0\n  ]);\n  return [\n    (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.viewProps) || {},\n    (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.style) || {},\n    theme,\n    mediaState\n  ];\n}\nexport {\n  useProps,\n  usePropsAndStyle,\n  useStyle\n};\n//# sourceMappingURL=useProps.js.map\n"],"mappings":";;;;;;;;;;;;;;;AAaA,SAAS,SAAS,OAAO,MAAM;CAC7B,IAAI,CAAC,UAAU,YAAY,iBAAiB,OAAO;EACjD,GAAG;EACH,UAAU;EACV,aAAa;EACb,eAAe;CACjB,CAAC;CACD,OAAO;EACL,GAAG;EACH,GAAG;CACL;AACF;AACA,SAAS,SAAS,OAAO,MAAM;CAC7B,OAAO,iBAAiB,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC;AAC9C;AACA,SAAS,iBAAiB,OAAO,MAAM;CACrC,IAAI;CACJ,IAAI;CACJ,IAAI,gBAAgB,kCAAkC,SAAS,QAAQ,SAAS,KAAK,IAAI,KAAK,KAAK,qBAAqB,KAAK,kBAAkB,QAAQ,uBAAuB,KAAK,IAAI,KAAK,IAAI,mBAAmB,kBAAkB,QAAQ,oCAAoC,KAAK,IAAI,kCAAkC,KAAK;CACjU,IAAI,CAAC,OAAO,cAAc,kBAAkB;EAC1C,MAAM,WAAW,QAAQ,MAAM,QAAQ,KAAK;EAC5C,cAAc;GACZ,OAAO;EACT;CACF,CAAC;CACD,IAAI,mBAAmB,MAAM,WAAW,gBAAgB;CACxD,IAAI,eAAe,MAAM,WAAW,YAAY;CAChD,IAAI,EAAE,OAAO,eAAe,OAAO,UAAU,UAAU,oBAAoB,kBAAkB,OAAO,iBAAiB,iBAAiB,cAAc,UAAU,CAAC;CAC/J,IAAI,iBAAiB,SAAS,QAAQ,SAAS,KAAK,IAAI,KAAK,IAAI,KAAK,WAEpE,aACE,SAAS;CACb,IAAI,cAAc,eAAe,eAAe,cAAc,QAAQ,eAAe,QAAQ,eAAe,KAAK,IAAI,KAAK,IAAI,WAAW,SAAS,IAAI,OAAO;EAC3J,YAAY;EACZ,YAAY;EACZ,QAAQ;EACR,cAAc;EACd,SAAS;EACT,eAAe;EACf,GAAG;CACL,GAAG,MAAM,kBAAkB,YAAY;CACvC,IAAI,EAAE,aAAa,iBAAiB,eAAe,CAAC;CACpD,0BAA0B,WAAW;EACnC,IAAI;EACJ,IAAI,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY,cAAc;GACtF,IAAI,iBAAiB,WAAW;IAC9B,SAAS,SAAS,UAAU;KAC1B,OAAO,EACL,GAAG,SACL;IACF,CAAC;GACH;GACA,kBAAkB,oBAAoB,cAAc;GACpD,eAAe;EACjB;EACA,IAAI,UAAU;GACZ,OAAO;EACT;EACA,IAAI,MAAM,WAAW;GACnB,gBAAgB,EACd,WAAW,MACb,CAAC;GACD,OAAO;EACT;EACA,IAAI,cAAc;GAChB,IAAI,eAAe,wBAAwB;IACzC;IACA;IACA;IACA;GACF,CAAC;GACD,IAAI,CAAC,iBAAiB,OAAO;GAC7B,OAAO,WAAW;IAChB,gBAAgB;IAChB,iBAAiB,QAAQ,iBAAiB,KAAK,IAAI,KAAK,IAAI,aAAa;GAC3E;EACF;EACA,OAAO;CACT,GAAG;EACD;EACA;EACA,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY;EACtE,eAAe,OAAO,KAAK,CACzB,GAAG,YACL,CAAC,CAAC,CAAC,KAAK,EAAE,IAAI;EACd,cAAc,OAAO,KAAK,CACxB,GAAG,WACL,CAAC,CAAC,CAAC,KAAK,EAAE,IAAI;CAChB,CAAC;CACD,OAAO;GACJ,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY,cAAc,CAAC;GACrF,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY,UAAU,CAAC;EAClF;EACA;CACF;AACF"}
+{"version":3,"file":"useProps.native.js","names":[],"sources":["esm/hooks/useProps.native.js"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@tamagui/constants\";\nimport React from \"react\";\nimport { getConfig } from \"../config\";\nimport { ComponentContext } from \"../contexts/ComponentContext\";\nimport { GroupContext } from \"../contexts/GroupContext\";\nimport { useSplitStyles } from \"./useSplitStyles\";\nimport { subscribeToSafeArea } from \"../helpers/resolveSafeAreaVariable\";\nimport { subscribeToContextGroup, useGroupSetRevision } from \"../helpers/subscribeToContextGroup\";\nimport { View } from \"../views/View\";\nimport { useComponentState } from \"./useComponentState\";\nimport { mediaState } from \"../helpers/mediaState\";\nimport { useMedia } from \"./useMedia\";\nimport { useThemeWithState } from \"./useTheme\";\nfunction useProps(props, opts) {\n  var [propsOut, styleOut] = usePropsAndStyle(props, {\n    ...opts,\n    noExpand: true,\n    noNormalize: true,\n    resolveValues: \"none\"\n  });\n  return {\n    ...propsOut,\n    ...styleOut\n  };\n}\nfunction useStyle(props, opts) {\n  return usePropsAndStyle(props, opts)[1] || {};\n}\nfunction usePropsAndStyle(props, opts) {\n  var _opts_forComponent;\n  var _opts_forComponent_staticConfig;\n  var staticConfig = (_opts_forComponent_staticConfig = opts === null || opts === void 0 ? void 0 : (_opts_forComponent = opts.forComponent) === null || _opts_forComponent === void 0 ? void 0 : _opts_forComponent.staticConfig) !== null && _opts_forComponent_staticConfig !== void 0 ? _opts_forComponent_staticConfig : View.staticConfig;\n  var [theme, themeState] = useThemeWithState({\n    name: \"theme\" in props ? props.theme : void 0,\n    needsUpdate() {\n      return true;\n    }\n  });\n  var componentContext = React.useContext(ComponentContext);\n  var groupContext = React.useContext(GroupContext);\n  var componentState = useComponentState(props, componentContext.animationDriver, staticConfig, getConfig());\n  var { props: statefulProps, state, disabled, setState, setStateShallow } = componentState;\n  var mediaStateNow = (opts === null || opts === void 0 ? void 0 : opts.noMedia) ? (\n    // not safe to use mediaState but really marginal to hit this\n    mediaState\n  ) : useMedia();\n  var splitStyles = useSplitStyles(statefulProps, staticConfig, theme, (themeState === null || themeState === void 0 ? void 0 : themeState.name) || \"\", state, {\n    isAnimated: false,\n    mediaState: mediaStateNow,\n    noSkip: true,\n    noMergeStyle: true,\n    noClass: true,\n    resolveValues: \"auto\",\n    ...opts\n  }, null, componentContext, groupContext);\n  componentState.finalizeStyleFlags(!!(splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.hasEnterStyle), !!(splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.platformPseudo));\n  var { mediaGroups, pseudoGroups } = splitStyles || {};\n  var groupSetRevision = useGroupSetRevision(pseudoGroups, mediaGroups);\n  useIsomorphicLayoutEffect(function() {\n    var disposeSafeArea;\n    if (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.usesSafeArea) {\n      var updateSafeArea = function() {\n        setState(function(previous) {\n          return {\n            ...previous\n          };\n        });\n      };\n      disposeSafeArea = subscribeToSafeArea(updateSafeArea);\n      updateSafeArea();\n    }\n    if (disabled) {\n      return disposeSafeArea;\n    }\n    if (state.unmounted) {\n      setStateShallow({\n        unmounted: false\n      });\n      return disposeSafeArea;\n    }\n    if (groupContext) {\n      var disposeGroup = subscribeToContextGroup({\n        groupContext,\n        setStateShallow,\n        mediaGroups,\n        pseudoGroups\n      });\n      if (!disposeSafeArea) return disposeGroup;\n      return function() {\n        disposeSafeArea();\n        disposeGroup === null || disposeGroup === void 0 ? void 0 : disposeGroup();\n      };\n    }\n    return disposeSafeArea;\n  }, [\n    disabled,\n    groupContext,\n    splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.usesSafeArea,\n    groupSetRevision\n  ]);\n  return [\n    (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.viewProps) || {},\n    (splitStyles === null || splitStyles === void 0 ? void 0 : splitStyles.style) || {},\n    theme,\n    mediaState\n  ];\n}\nexport {\n  useProps,\n  usePropsAndStyle,\n  useStyle\n};\n//# sourceMappingURL=useProps.js.map\n"],"mappings":";;;;;;;;;;;;;;;AAaA,SAAS,SAAS,OAAO,MAAM;CAC7B,IAAI,CAAC,UAAU,YAAY,iBAAiB,OAAO;EACjD,GAAG;EACH,UAAU;EACV,aAAa;EACb,eAAe;CACjB,CAAC;CACD,OAAO;EACL,GAAG;EACH,GAAG;CACL;AACF;AACA,SAAS,SAAS,OAAO,MAAM;CAC7B,OAAO,iBAAiB,OAAO,IAAI,CAAC,CAAC,MAAM,CAAC;AAC9C;AACA,SAAS,iBAAiB,OAAO,MAAM;CACrC,IAAI;CACJ,IAAI;CACJ,IAAI,gBAAgB,kCAAkC,SAAS,QAAQ,SAAS,KAAK,IAAI,KAAK,KAAK,qBAAqB,KAAK,kBAAkB,QAAQ,uBAAuB,KAAK,IAAI,KAAK,IAAI,mBAAmB,kBAAkB,QAAQ,oCAAoC,KAAK,IAAI,kCAAkC,KAAK;CACjU,IAAI,CAAC,OAAO,cAAc,kBAAkB;EAC1C,MAAM,WAAW,QAAQ,MAAM,QAAQ,KAAK;EAC5C,cAAc;GACZ,OAAO;EACT;CACF,CAAC;CACD,IAAI,mBAAmB,MAAM,WAAW,gBAAgB;CACxD,IAAI,eAAe,MAAM,WAAW,YAAY;CAChD,IAAI,iBAAiB,kBAAkB,OAAO,iBAAiB,iBAAiB,cAAc,UAAU,CAAC;CACzG,IAAI,EAAE,OAAO,eAAe,OAAO,UAAU,UAAU,oBAAoB;CAC3E,IAAI,iBAAiB,SAAS,QAAQ,SAAS,KAAK,IAAI,KAAK,IAAI,KAAK,WAEpE,aACE,SAAS;CACb,IAAI,cAAc,eAAe,eAAe,cAAc,QAAQ,eAAe,QAAQ,eAAe,KAAK,IAAI,KAAK,IAAI,WAAW,SAAS,IAAI,OAAO;EAC3J,YAAY;EACZ,YAAY;EACZ,QAAQ;EACR,cAAc;EACd,SAAS;EACT,eAAe;EACf,GAAG;CACL,GAAG,MAAM,kBAAkB,YAAY;CACvC,eAAe,mBAAmB,CAAC,EAAE,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY,gBAAgB,CAAC,EAAE,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY,eAAe;CACnN,IAAI,EAAE,aAAa,iBAAiB,eAAe,CAAC;CACpD,IAAI,mBAAmB,oBAAoB,cAAc,WAAW;CACpE,0BAA0B,WAAW;EACnC,IAAI;EACJ,IAAI,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY,cAAc;GACtF,IAAI,iBAAiB,WAAW;IAC9B,SAAS,SAAS,UAAU;KAC1B,OAAO,EACL,GAAG,SACL;IACF,CAAC;GACH;GACA,kBAAkB,oBAAoB,cAAc;GACpD,eAAe;EACjB;EACA,IAAI,UAAU;GACZ,OAAO;EACT;EACA,IAAI,MAAM,WAAW;GACnB,gBAAgB,EACd,WAAW,MACb,CAAC;GACD,OAAO;EACT;EACA,IAAI,cAAc;GAChB,IAAI,eAAe,wBAAwB;IACzC;IACA;IACA;IACA;GACF,CAAC;GACD,IAAI,CAAC,iBAAiB,OAAO;GAC7B,OAAO,WAAW;IAChB,gBAAgB;IAChB,iBAAiB,QAAQ,iBAAiB,KAAK,IAAI,KAAK,IAAI,aAAa;GAC3E;EACF;EACA,OAAO;CACT,GAAG;EACD;EACA;EACA,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY;EACtE;CACF,CAAC;CACD,OAAO;GACJ,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY,cAAc,CAAC;GACrF,gBAAgB,QAAQ,gBAAgB,KAAK,IAAI,KAAK,IAAI,YAAY,UAAU,CAAC;EAClF;EACA;CACF;AACF"}

package/dist/esm/hooks/useSplitStyles.mjs

@@ -0,0 +1,17 @@
+import { isWeb, useIsomorphicLayoutEffect } from "@tamagui/constants";
+import React from "react";
+import { getSplitStyles } from "../helpers/getSplitStyles.mjs";
+import { insertStyleRules } from "../helpers/insertStyleRule.mjs";
+
+const useInsertEffectCompat = isWeb ? React.useInsertionEffect || useIsomorphicLayoutEffect : () => {};
+const useSplitStyles = (a, b, c, d, e, f, g, h, i, j, k, l, m) => {
+	"use no memo";
+	const res = getSplitStyles(a, b, c, d, e, f, g, h, i, j, k, l, m);
+	if (!process.env.TAMAGUI_DID_OUTPUT_CSS && true) useInsertEffectCompat(() => {
+		if (res) insertStyleRules(res.rulesToInsert);
+	}, [res?.rulesToInsert]);
+	return res;
+};
+
+export { useSplitStyles };
+//# sourceMappingURL=useSplitStyles.mjs.map

package/dist/esm/hooks/useSplitStyles.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSplitStyles.js","names":[],"sources":["esm/hooks/useSplitStyles.js"],"sourcesContent":["import { isWeb, useIsomorphicLayoutEffect } from \"@tamagui/constants\";\nimport React from \"react\";\nimport { getSplitStyles } from \"../helpers/getSplitStyles\";\nimport { insertStyleRules } from \"../helpers/insertStyleRule\";\n\nconst useInsertEffectCompat = isWeb ? React.useInsertionEffect || useIsomorphicLayoutEffect : () => {};\nconst useSplitStyles = (a, b, c, d, e, f, g, h, i, j, k, l, m) => {\n\t\"use no memo\";\n\tconst res = getSplitStyles(a, b, c, d, e, f, g, h, i, j, k, l, m);\n\tif (!process.env.TAMAGUI_DID_OUTPUT_CSS && true) useInsertEffectCompat(() => {\n\t\tif (res) insertStyleRules(res.rulesToInsert);\n\t}, [res?.rulesToInsert]);\n\treturn res;\n};\n\nexport { useSplitStyles };"],"mappings":";;;;;;AAKA,MAAM,wBAAwB,QAAQ,MAAM,sBAAsB,kCAAkC,CAAC;AACrG,MAAM,kBAAkB,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,MAAM;CACjE;CACA,MAAM,MAAM,eAAe,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;CAChE,IAAI,CAAC,QAAQ,IAAI,0BAA0B,MAAM,4BAA4B;EAC5E,IAAI,KAAK,iBAAiB,IAAI,aAAa;CAC5C,GAAG,CAAC,KAAK,aAAa,CAAC;CACvB,OAAO;AACR"}

package/dist/esm/hooks/useSplitStyles.native.js

@@ -0,0 +1,14 @@
+import { isWeb } from "@tamagui/constants";
+import React from "react";
+import { getSplitStyles } from "../helpers/getSplitStyles.native.js";
+
+isWeb && React.useInsertionEffect;
+var useSplitStyles = function(a, b, c, d, e, f, g, h, i, j, k, l, m) {
+	"use no memo";
+	var res = getSplitStyles(a, b, c, d, e, f, g, h, i, j, k, l, m);
+	if (!process.env.TAMAGUI_DID_OUTPUT_CSS && false);
+	return res;
+};
+
+export { useSplitStyles };
+//# sourceMappingURL=useSplitStyles.native.js.map

package/dist/esm/hooks/useSplitStyles.native.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useSplitStyles.native.js","names":[],"sources":["esm/hooks/useSplitStyles.native.js"],"sourcesContent":["import { isWeb } from \"@tamagui/constants\";\nimport React from \"react\";\nimport { getSplitStyles } from \"../helpers/getSplitStyles\";\n\nisWeb && React.useInsertionEffect;\nvar useSplitStyles = function(a, b, c, d, e, f, g, h, i, j, k, l, m) {\n\t\"use no memo\";\n\tvar res = getSplitStyles(a, b, c, d, e, f, g, h, i, j, k, l, m);\n\tif (!process.env.TAMAGUI_DID_OUTPUT_CSS && false);\n\treturn res;\n};\n\nexport { useSplitStyles };"],"mappings":";;;;;AAIA,SAAS,MAAM;AACf,IAAI,iBAAiB,SAAS,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG;CACpE;CACA,IAAI,MAAM,eAAe,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,GAAG,CAAC;CAC9D,IAAI,CAAC,QAAQ,IAAI,0BAA0B;CAC3C,OAAO;AACR"}

package/dist/esm/index.js

@@ -1,145 +1,65 @@
+import { ComponentContext, useConfiguration } from "./contexts/ComponentContext.mjs";
+import { GroupContext } from "./contexts/GroupContext.mjs";
+import { isEqualShallow, mergeIfNotShallowEqual, useCreateShallowSetState } from "@tamagui/is-equal-shallow";
+import { _withStableStyle } from "./_withStableStyle.mjs";
+import { _withNativeStyle } from "./_withNativeStyle.mjs";
+import { createComponent } from "./createComponent.mjs";
+import { createStyledContext } from "./helpers/createStyledContext.mjs";
+import { getDefaultProps } from "./helpers/getDefaultProps.mjs";
+import { getCSSStylesAtomic } from "./helpers/getCSSStylesAtomic.mjs";
+import { getExpandedShorthand } from "./helpers/getExpandedShorthands.mjs";
+import { formatDiagnostic } from "./helpers/formatDiagnostic.mjs";
+import { getSplitStyles, isValidStyleKey, prepareStyleStaticConfig } from "./helpers/getSplitStyles.mjs";
 import { getNativeStyleEngine, removeNativeStyleScope, setNativeStyleEngine, setNativeStyleEngineFlushListener, updateNativeStyleScope } from "./helpers/nativeStyleEngine.mjs";
 import { autoVariables, getAutoVariableCSS, getMutatedAutoVariableCSS, mutatedAutoVariables } from "./helpers/registerCSSVariable.mjs";
 import { insertStyleRules, setNonce } from "./helpers/insertStyleRule.mjs";
-import { createRefComponent } from "@tamagui/compose-refs";
+import { isTamaguiComponent } from "./helpers/isTamaguiComponent.mjs";
+import { isTamaguiElement } from "./helpers/isTamaguiElement.mjs";
+import { matchMedia, setupMatchMedia } from "./helpers/matchMedia.mjs";
+import { mergeProps } from "./helpers/mergeProps.mjs";
+import { mergeSlotStyleProps } from "./helpers/mergeSlotStyleProps.mjs";
+import { normalizeColor } from "./helpers/normalizeColor.mjs";
+import { normalizeStyle } from "./helpers/normalizeStyle.mjs";
+import { containsThemeRef, themeRefKey } from "./helpers/themeRef.mjs";
+import { themeable } from "./helpers/themeable.mjs";
+import { getStyleTags } from "./helpers/wrapStyleTags.mjs";
+import { createFont } from "./createFont.mjs";
+import { createChangeEventDetails } from "./eventDetails.mjs";
+import { createStyledHOC } from "./createStyledHOC.mjs";
+import { createShorthands } from "./createShorthands.mjs";
+import { createTamagui, installTamaguiConfig } from "./createTamagui.mjs";
+import { createTokens } from "./createTokens.mjs";
+import { createCSSVariable, createVariable, getVariable, getVariableName, getVariableValue, getVariableVariable, isVariable, px, variableToString } from "./createVariable.mjs";
+import { insertFont, updateFont } from "./insertFont.mjs";
+import { styled } from "./styled.mjs";
+import { Tamagui } from "./Tamagui.mjs";
+import { createVariantResolver } from "./types.mjs";
+import { composeRefs, createRefComponent, setRef, useComposedRefs } from "@tamagui/compose-refs";
 import { getConfig, getSetting, getStyleCompat, getThemes, getToken, getTokenValue, getTokens, loadAnimationDriver, setConfig, setupDev, updateConfig } from "./config.mjs";
+import { useIsTouchDevice } from "./hooks/useIsTouchDevice.mjs";
 import { _disableMediaTouch, _mediaListenerStats, configureMedia, mediaKeyMatch, updateMediaListeners, useMedia } from "./hooks/useMedia.mjs";
 import { mediaObjectToString } from "./helpers/mediaObjectToString.mjs";
 import { getMedia, mediaQueryConfig, mediaState, setMediaState } from "./helpers/mediaState.mjs";
+import { useAnimatedNumber, useAnimatedNumberReaction, useAnimatedNumberStyle, useAnimatedNumbersStyle, useAnimationDriver } from "./hooks/useAnimationDriver.mjs";
+import { useProps, usePropsAndStyle, useStyle } from "./hooks/useProps.mjs";
+import { useTheme } from "./hooks/useTheme.mjs";
+import { usePortalThemeState } from "./hooks/usePortalThemeState.mjs";
+import { useThemeName } from "./hooks/useThemeName.mjs";
 import { forceUpdateThemes, getThemeProviderChainSizes, resolveThemeName } from "./hooks/useThemeState.mjs";
-
-export * from "./contexts/ComponentContext.mjs"
-
-export * from "./contexts/GroupContext.mjs"
-
-export * from "@tamagui/is-equal-shallow"
-
-export * from "./_withStableStyle.mjs"
-
-export * from "./_withNativeStyle.mjs"
-
-export * from "./createComponent.mjs"
-
-export * from "./helpers/createStyledContext.mjs"
-
-export * from "./helpers/getDefaultProps.mjs"
-
-export * from "./helpers/expandStyles.mjs"
-
-export * from "./helpers/getCSSStylesAtomic.mjs"
-
-export * from "./helpers/getExpandedShorthands.mjs"
-
-export * from "./helpers/formatDiagnostic.mjs"
-
-export * from "./helpers/getShorthandValue.mjs"
-
-export * from "./helpers/getSplitStyles.mjs"
-
-export * from "./helpers/getThemeCSSRules.mjs"
-
-export * from "./helpers/getVariantExtras.mjs"
-
-export * from "./helpers/isTamaguiComponent.mjs"
-
-export * from "./helpers/isTamaguiElement.mjs"
-
-export * from "./helpers/matchMedia.mjs"
-
-export * from "./helpers/mergeProps.mjs"
-
-export * from "./helpers/mergeSlotStyleProps.mjs"
-
-export * from "./helpers/normalizeColor.mjs"
-
-export * from "./helpers/normalizeStyle.mjs"
-
-export * from "./helpers/normalizeValueWithProperty.mjs"
-
-export * from "./helpers/propMapper.mjs"
-
-export * from "./helpers/proxyThemeToParents.mjs"
-
-export * from "./helpers/themeRef.mjs"
-
-export * from "./helpers/themeable.mjs"
-
-export * from "./helpers/themes.mjs"
-
-export * from "./helpers/transformsToString.mjs"
-
-export * from "./helpers/wrapStyleTags.mjs"
-
-export * from "./createFont.mjs"
-
-export * from "./eventDetails.mjs"
-
-export * from "./createStyledHOC.mjs"
-
-export * from "./createShorthands.mjs"
-
-export * from "./createTamagui.mjs"
-
-export * from "./createTokens.mjs"
-
-export * from "./createVariable.mjs"
-
-export * from "./createVariables.mjs"
-
-export * from "./insertFont.mjs"
-
-export * from "./setupReactNative.mjs"
-
-export * from "./styled.mjs"
-
-export * from "./Tamagui.mjs"
-
-export * from "./interfaces/GetRef.mjs"
-
-export * from "@tamagui/compose-refs"
-
-export * from "./constants/constants.mjs"
-
-export * from "./hooks/useIsTouchDevice.mjs"
-
-export * from "./hooks/useAnimationDriver.mjs"
-
-export * from "./hooks/useProps.mjs"
-
-export * from "./hooks/useTheme.mjs"
-
-export * from "./hooks/usePortalThemeState.mjs"
-
-export * from "./hooks/useThemeName.mjs"
-
-export * from "./dom/html.mjs"
-
-export * from "./views/Configuration.mjs"
-
-export * from "./views/TamaguiRoot.mjs"
-
-export * from "./views/FontLanguage.mjs"
-
-export * from "./views/Slot.mjs"
-
-export * from "./views/TamaguiProvider.mjs"
-
-export * from "./views/Text.mjs"
-
-export * from "./views/Theme.mjs"
-
-export * from "./views/ThemeProvider.mjs"
-
-export * from "./views/View.mjs"
-
-export * from "@tamagui/constants"
-
-export * from "@tamagui/helpers"
-
-export * from "@tamagui/use-did-finish-ssr"
-
-export * from "@tamagui/use-event"
-
-export * from "./setupHooks.mjs"
-
-export { _disableMediaTouch, _mediaListenerStats, autoVariables, configureMedia, createRefComponent, forceUpdateThemes, getAutoVariableCSS, getConfig, getMedia, getMutatedAutoVariableCSS, getNativeStyleEngine, getSetting, getStyleCompat, getThemeProviderChainSizes, getThemes, getToken, getTokenValue, getTokens, insertStyleRules, loadAnimationDriver, mediaKeyMatch, mediaObjectToString, mediaQueryConfig, mediaState, mutatedAutoVariables, removeNativeStyleScope, resolveThemeName, setConfig, setMediaState, setNativeStyleEngine, setNativeStyleEngineFlushListener, setNonce, setupDev, updateConfig, updateMediaListeners, updateNativeStyleScope, useMedia };
+import { html } from "./dom/html.mjs";
+import { Configuration } from "./views/Configuration.mjs";
+import { TamaguiRoot } from "./views/TamaguiRoot.mjs";
+import { FontLanguage } from "./views/FontLanguage.mjs";
+import { Slot, Slottable } from "./views/Slot.mjs";
+import { TamaguiProvider } from "./views/TamaguiProvider.mjs";
+import { Text, textStaticConfig } from "./views/Text.mjs";
+import { Theme } from "./views/Theme.mjs";
+import { ThemeProvider } from "./views/ThemeProvider.mjs";
+import { View, viewStaticConfig } from "./views/View.mjs";
+import { currentPlatform, getPlatformDriver, isAndroid, isBrowser, isChrome, isClient, isIos, isNativeDesktop, isServer, isTV, isTouchable, isWeb, isWebTouchable, setupPlatformDriver, supportsDynamicColorIOS, useIsomorphicLayoutEffect } from "@tamagui/constants";
+import { StyleObjectIdentifier, StyleObjectProperty, StyleObjectPseudo, StyleObjectRules, StyleObjectValue, clamp, composeEventHandlers, cssShorthandLonghands, getThemeClassNames, nonAnimatableStyleProps, nonAnimatableWebTextProps, nonAnimatableWebViewProps, reservedThemeProps, shouldRenderNativePlatform, simpleHash, stylePropsAll, stylePropsText, stylePropsTextOnly, stylePropsTransform, stylePropsUnitless, stylePropsView, tokenCategories, validStyles, webOnlyStylePropsText, webOnlyStylePropsView, withStaticProperties } from "@tamagui/helpers";
+import { ClientOnly, ClientOnlyContext, useClientValue, useDidFinishSSR, useIsClientOnly } from "@tamagui/use-did-finish-ssr";
+import { useEvent, useGet } from "@tamagui/use-event";
+import { hooks, setupHooks } from "./setupHooks.mjs";
+
+export { ClientOnly, ClientOnlyContext, ComponentContext, Configuration, FontLanguage, GroupContext, Slot, Slottable, StyleObjectIdentifier, StyleObjectProperty, StyleObjectPseudo, StyleObjectRules, StyleObjectValue, Tamagui, TamaguiProvider, TamaguiRoot, Text, Theme, ThemeProvider, View, _disableMediaTouch, _mediaListenerStats, _withNativeStyle, _withStableStyle, autoVariables, clamp, composeEventHandlers, composeRefs, configureMedia, containsThemeRef, createCSSVariable, createChangeEventDetails, createComponent, createFont, createRefComponent, createShorthands, createStyledContext, createStyledHOC, createTamagui, createTokens, createVariable, createVariantResolver, cssShorthandLonghands, currentPlatform, forceUpdateThemes, formatDiagnostic, getAutoVariableCSS, getCSSStylesAtomic, getConfig, getDefaultProps, getExpandedShorthand, getMedia, getMutatedAutoVariableCSS, getNativeStyleEngine, getPlatformDriver, getSetting, getSplitStyles, getStyleCompat, getStyleTags, getThemeClassNames, getThemeProviderChainSizes, getThemes, getToken, getTokenValue, getTokens, getVariable, getVariableName, getVariableValue, getVariableVariable, hooks, html, insertFont, insertStyleRules, installTamaguiConfig, isAndroid, isBrowser, isChrome, isClient, isEqualShallow, isIos, isNativeDesktop, isServer, isTV, isTamaguiComponent, isTamaguiElement, isTouchable, isValidStyleKey, isVariable, isWeb, isWebTouchable, loadAnimationDriver, matchMedia, mediaKeyMatch, mediaObjectToString, mediaQueryConfig, mediaState, mergeIfNotShallowEqual, mergeProps, mergeSlotStyleProps, mutatedAutoVariables, nonAnimatableStyleProps, nonAnimatableWebTextProps, nonAnimatableWebViewProps, normalizeColor, normalizeStyle, prepareStyleStaticConfig, px, removeNativeStyleScope, reservedThemeProps, resolveThemeName, setConfig, setMediaState, setNativeStyleEngine, setNativeStyleEngineFlushListener, setNonce, setRef, setupDev, setupHooks, setupMatchMedia, setupPlatformDriver, shouldRenderNativePlatform, simpleHash, stylePropsAll, stylePropsText, stylePropsTextOnly, stylePropsTransform, stylePropsUnitless, stylePropsView, styled, supportsDynamicColorIOS, textStaticConfig, themeRefKey, themeable, tokenCategories, updateConfig, updateFont, updateMediaListeners, updateNativeStyleScope, useAnimatedNumber, useAnimatedNumberReaction, useAnimatedNumberStyle, useAnimatedNumbersStyle, useAnimationDriver, useClientValue, useComposedRefs, useConfiguration, useCreateShallowSetState, useDidFinishSSR, useEvent, useGet, useIsClientOnly, useIsTouchDevice, useIsomorphicLayoutEffect, useMedia, usePortalThemeState, useProps, usePropsAndStyle, useStyle, useTheme, useThemeName, validStyles, variableToString, viewStaticConfig, webOnlyStylePropsText, webOnlyStylePropsView, withStaticProperties };

package/dist/esm/index.mjs

@@ -1,145 +1,65 @@
+import { ComponentContext, useConfiguration } from "./contexts/ComponentContext.mjs";
+import { GroupContext } from "./contexts/GroupContext.mjs";
+import { isEqualShallow, mergeIfNotShallowEqual, useCreateShallowSetState } from "@tamagui/is-equal-shallow";
+import { _withStableStyle } from "./_withStableStyle.mjs";
+import { _withNativeStyle } from "./_withNativeStyle.mjs";
+import { createComponent } from "./createComponent.mjs";
+import { createStyledContext } from "./helpers/createStyledContext.mjs";
+import { getDefaultProps } from "./helpers/getDefaultProps.mjs";
+import { getCSSStylesAtomic } from "./helpers/getCSSStylesAtomic.mjs";
+import { getExpandedShorthand } from "./helpers/getExpandedShorthands.mjs";
+import { formatDiagnostic } from "./helpers/formatDiagnostic.mjs";
+import { getSplitStyles, isValidStyleKey, prepareStyleStaticConfig } from "./helpers/getSplitStyles.mjs";
 import { getNativeStyleEngine, removeNativeStyleScope, setNativeStyleEngine, setNativeStyleEngineFlushListener, updateNativeStyleScope } from "./helpers/nativeStyleEngine.mjs";
 import { autoVariables, getAutoVariableCSS, getMutatedAutoVariableCSS, mutatedAutoVariables } from "./helpers/registerCSSVariable.mjs";
 import { insertStyleRules, setNonce } from "./helpers/insertStyleRule.mjs";
-import { createRefComponent } from "@tamagui/compose-refs";
+import { isTamaguiComponent } from "./helpers/isTamaguiComponent.mjs";
+import { isTamaguiElement } from "./helpers/isTamaguiElement.mjs";
+import { matchMedia, setupMatchMedia } from "./helpers/matchMedia.mjs";
+import { mergeProps } from "./helpers/mergeProps.mjs";
+import { mergeSlotStyleProps } from "./helpers/mergeSlotStyleProps.mjs";
+import { normalizeColor } from "./helpers/normalizeColor.mjs";
+import { normalizeStyle } from "./helpers/normalizeStyle.mjs";
+import { containsThemeRef, themeRefKey } from "./helpers/themeRef.mjs";
+import { themeable } from "./helpers/themeable.mjs";
+import { getStyleTags } from "./helpers/wrapStyleTags.mjs";
+import { createFont } from "./createFont.mjs";
+import { createChangeEventDetails } from "./eventDetails.mjs";
+import { createStyledHOC } from "./createStyledHOC.mjs";
+import { createShorthands } from "./createShorthands.mjs";
+import { createTamagui, installTamaguiConfig } from "./createTamagui.mjs";
+import { createTokens } from "./createTokens.mjs";
+import { createCSSVariable, createVariable, getVariable, getVariableName, getVariableValue, getVariableVariable, isVariable, px, variableToString } from "./createVariable.mjs";
+import { insertFont, updateFont } from "./insertFont.mjs";
+import { styled } from "./styled.mjs";
+import { Tamagui } from "./Tamagui.mjs";
+import { createVariantResolver } from "./types.mjs";
+import { composeRefs, createRefComponent, setRef, useComposedRefs } from "@tamagui/compose-refs";
 import { getConfig, getSetting, getStyleCompat, getThemes, getToken, getTokenValue, getTokens, loadAnimationDriver, setConfig, setupDev, updateConfig } from "./config.mjs";
+import { useIsTouchDevice } from "./hooks/useIsTouchDevice.mjs";
 import { _disableMediaTouch, _mediaListenerStats, configureMedia, mediaKeyMatch, updateMediaListeners, useMedia } from "./hooks/useMedia.mjs";
 import { mediaObjectToString } from "./helpers/mediaObjectToString.mjs";
 import { getMedia, mediaQueryConfig, mediaState, setMediaState } from "./helpers/mediaState.mjs";
+import { useAnimatedNumber, useAnimatedNumberReaction, useAnimatedNumberStyle, useAnimatedNumbersStyle, useAnimationDriver } from "./hooks/useAnimationDriver.mjs";
+import { useProps, usePropsAndStyle, useStyle } from "./hooks/useProps.mjs";
+import { useTheme } from "./hooks/useTheme.mjs";
+import { usePortalThemeState } from "./hooks/usePortalThemeState.mjs";
+import { useThemeName } from "./hooks/useThemeName.mjs";
 import { forceUpdateThemes, getThemeProviderChainSizes, resolveThemeName } from "./hooks/useThemeState.mjs";
-
-export * from "./contexts/ComponentContext.mjs"
-
-export * from "./contexts/GroupContext.mjs"
-
-export * from "@tamagui/is-equal-shallow"
-
-export * from "./_withStableStyle.mjs"
-
-export * from "./_withNativeStyle.mjs"
-
-export * from "./createComponent.mjs"
-
-export * from "./helpers/createStyledContext.mjs"
-
-export * from "./helpers/getDefaultProps.mjs"
-
-export * from "./helpers/expandStyles.mjs"
-
-export * from "./helpers/getCSSStylesAtomic.mjs"
-
-export * from "./helpers/getExpandedShorthands.mjs"
-
-export * from "./helpers/formatDiagnostic.mjs"
-
-export * from "./helpers/getShorthandValue.mjs"
-
-export * from "./helpers/getSplitStyles.mjs"
-
-export * from "./helpers/getThemeCSSRules.mjs"
-
-export * from "./helpers/getVariantExtras.mjs"
-
-export * from "./helpers/isTamaguiComponent.mjs"
-
-export * from "./helpers/isTamaguiElement.mjs"
-
-export * from "./helpers/matchMedia.mjs"
-
-export * from "./helpers/mergeProps.mjs"
-
-export * from "./helpers/mergeSlotStyleProps.mjs"
-
-export * from "./helpers/normalizeColor.mjs"
-
-export * from "./helpers/normalizeStyle.mjs"
-
-export * from "./helpers/normalizeValueWithProperty.mjs"
-
-export * from "./helpers/propMapper.mjs"
-
-export * from "./helpers/proxyThemeToParents.mjs"
-
-export * from "./helpers/themeRef.mjs"
-
-export * from "./helpers/themeable.mjs"
-
-export * from "./helpers/themes.mjs"
-
-export * from "./helpers/transformsToString.mjs"
-
-export * from "./helpers/wrapStyleTags.mjs"
-
-export * from "./createFont.mjs"
-
-export * from "./eventDetails.mjs"
-
-export * from "./createStyledHOC.mjs"
-
-export * from "./createShorthands.mjs"
-
-export * from "./createTamagui.mjs"
-
-export * from "./createTokens.mjs"
-
-export * from "./createVariable.mjs"
-
-export * from "./createVariables.mjs"
-
-export * from "./insertFont.mjs"
-
-export * from "./setupReactNative.mjs"
-
-export * from "./styled.mjs"
-
-export * from "./Tamagui.mjs"
-
-export * from "./interfaces/GetRef.mjs"
-
-export * from "@tamagui/compose-refs"
-
-export * from "./constants/constants.mjs"
-
-export * from "./hooks/useIsTouchDevice.mjs"
-
-export * from "./hooks/useAnimationDriver.mjs"
-
-export * from "./hooks/useProps.mjs"
-
-export * from "./hooks/useTheme.mjs"
-
-export * from "./hooks/usePortalThemeState.mjs"
-
-export * from "./hooks/useThemeName.mjs"
-
-export * from "./dom/html.mjs"
-
-export * from "./views/Configuration.mjs"
-
-export * from "./views/TamaguiRoot.mjs"
-
-export * from "./views/FontLanguage.mjs"
-
-export * from "./views/Slot.mjs"
-
-export * from "./views/TamaguiProvider.mjs"
-
-export * from "./views/Text.mjs"
-
-export * from "./views/Theme.mjs"
-
-export * from "./views/ThemeProvider.mjs"
-
-export * from "./views/View.mjs"
-
-export * from "@tamagui/constants"
-
-export * from "@tamagui/helpers"
-
-export * from "@tamagui/use-did-finish-ssr"
-
-export * from "@tamagui/use-event"
-
-export * from "./setupHooks.mjs"
-
-export { _disableMediaTouch, _mediaListenerStats, autoVariables, configureMedia, createRefComponent, forceUpdateThemes, getAutoVariableCSS, getConfig, getMedia, getMutatedAutoVariableCSS, getNativeStyleEngine, getSetting, getStyleCompat, getThemeProviderChainSizes, getThemes, getToken, getTokenValue, getTokens, insertStyleRules, loadAnimationDriver, mediaKeyMatch, mediaObjectToString, mediaQueryConfig, mediaState, mutatedAutoVariables, removeNativeStyleScope, resolveThemeName, setConfig, setMediaState, setNativeStyleEngine, setNativeStyleEngineFlushListener, setNonce, setupDev, updateConfig, updateMediaListeners, updateNativeStyleScope, useMedia };
+import { html } from "./dom/html.mjs";
+import { Configuration } from "./views/Configuration.mjs";
+import { TamaguiRoot } from "./views/TamaguiRoot.mjs";
+import { FontLanguage } from "./views/FontLanguage.mjs";
+import { Slot, Slottable } from "./views/Slot.mjs";
+import { TamaguiProvider } from "./views/TamaguiProvider.mjs";
+import { Text, textStaticConfig } from "./views/Text.mjs";
+import { Theme } from "./views/Theme.mjs";
+import { ThemeProvider } from "./views/ThemeProvider.mjs";
+import { View, viewStaticConfig } from "./views/View.mjs";
+import { currentPlatform, getPlatformDriver, isAndroid, isBrowser, isChrome, isClient, isIos, isNativeDesktop, isServer, isTV, isTouchable, isWeb, isWebTouchable, setupPlatformDriver, supportsDynamicColorIOS, useIsomorphicLayoutEffect } from "@tamagui/constants";
+import { StyleObjectIdentifier, StyleObjectProperty, StyleObjectPseudo, StyleObjectRules, StyleObjectValue, clamp, composeEventHandlers, cssShorthandLonghands, getThemeClassNames, nonAnimatableStyleProps, nonAnimatableWebTextProps, nonAnimatableWebViewProps, reservedThemeProps, shouldRenderNativePlatform, simpleHash, stylePropsAll, stylePropsText, stylePropsTextOnly, stylePropsTransform, stylePropsUnitless, stylePropsView, tokenCategories, validStyles, webOnlyStylePropsText, webOnlyStylePropsView, withStaticProperties } from "@tamagui/helpers";
+import { ClientOnly, ClientOnlyContext, useClientValue, useDidFinishSSR, useIsClientOnly } from "@tamagui/use-did-finish-ssr";
+import { useEvent, useGet } from "@tamagui/use-event";
+import { hooks, setupHooks } from "./setupHooks.mjs";
+
+export { ClientOnly, ClientOnlyContext, ComponentContext, Configuration, FontLanguage, GroupContext, Slot, Slottable, StyleObjectIdentifier, StyleObjectProperty, StyleObjectPseudo, StyleObjectRules, StyleObjectValue, Tamagui, TamaguiProvider, TamaguiRoot, Text, Theme, ThemeProvider, View, _disableMediaTouch, _mediaListenerStats, _withNativeStyle, _withStableStyle, autoVariables, clamp, composeEventHandlers, composeRefs, configureMedia, containsThemeRef, createCSSVariable, createChangeEventDetails, createComponent, createFont, createRefComponent, createShorthands, createStyledContext, createStyledHOC, createTamagui, createTokens, createVariable, createVariantResolver, cssShorthandLonghands, currentPlatform, forceUpdateThemes, formatDiagnostic, getAutoVariableCSS, getCSSStylesAtomic, getConfig, getDefaultProps, getExpandedShorthand, getMedia, getMutatedAutoVariableCSS, getNativeStyleEngine, getPlatformDriver, getSetting, getSplitStyles, getStyleCompat, getStyleTags, getThemeClassNames, getThemeProviderChainSizes, getThemes, getToken, getTokenValue, getTokens, getVariable, getVariableName, getVariableValue, getVariableVariable, hooks, html, insertFont, insertStyleRules, installTamaguiConfig, isAndroid, isBrowser, isChrome, isClient, isEqualShallow, isIos, isNativeDesktop, isServer, isTV, isTamaguiComponent, isTamaguiElement, isTouchable, isValidStyleKey, isVariable, isWeb, isWebTouchable, loadAnimationDriver, matchMedia, mediaKeyMatch, mediaObjectToString, mediaQueryConfig, mediaState, mergeIfNotShallowEqual, mergeProps, mergeSlotStyleProps, mutatedAutoVariables, nonAnimatableStyleProps, nonAnimatableWebTextProps, nonAnimatableWebViewProps, normalizeColor, normalizeStyle, prepareStyleStaticConfig, px, removeNativeStyleScope, reservedThemeProps, resolveThemeName, setConfig, setMediaState, setNativeStyleEngine, setNativeStyleEngineFlushListener, setNonce, setRef, setupDev, setupHooks, setupMatchMedia, setupPlatformDriver, shouldRenderNativePlatform, simpleHash, stylePropsAll, stylePropsText, stylePropsTextOnly, stylePropsTransform, stylePropsUnitless, stylePropsView, styled, supportsDynamicColorIOS, textStaticConfig, themeRefKey, themeable, tokenCategories, updateConfig, updateFont, updateMediaListeners, updateNativeStyleScope, useAnimatedNumber, useAnimatedNumberReaction, useAnimatedNumberStyle, useAnimatedNumbersStyle, useAnimationDriver, useClientValue, useComposedRefs, useConfiguration, useCreateShallowSetState, useDidFinishSSR, useEvent, useGet, useIsClientOnly, useIsTouchDevice, useIsomorphicLayoutEffect, useMedia, usePortalThemeState, useProps, usePropsAndStyle, useStyle, useTheme, useThemeName, validStyles, variableToString, viewStaticConfig, webOnlyStylePropsText, webOnlyStylePropsView, withStaticProperties };