@tamagui/core 1.0.1-beta.226 → 1.0.1-beta.228

package/dist/cjs/views/ThemeInverse.js

@@ -18,46 +18,39 @@ var __copyProps = (to, from, except, desc) => {
 var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
 var ThemeInverse_exports = {};
 __export(ThemeInverse_exports, {
-  ThemeInverse: () => ThemeInverse,
-  useThemeInverse: () => useThemeInverse
+  ThemeInverse: () => ThemeInverse
 });
 module.exports = __toCommonJS(ThemeInverse_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_constants = require("@tamagui/constants");
 var import_react = require("react");
+var import_platform = require("../constants/platform");
 var import_useTheme = require("../hooks/useTheme");
 var import_Theme = require("./Theme");
-const toggleTheme = (themeName) => {
-  return themeName.startsWith("light") ? "dark" : "light";
-};
-const useThemeInverse = (props = {}) => {
-  const themeName = (0, import_useTheme.useThemeName)();
-  const defaultTheme = (0, import_useTheme.useDefaultThemeName)();
-  const [name, setName] = (0, import_react.useState)(null);
-  const curName = themeName || defaultTheme || "";
-  if (import_constants.isWeb) {
-    (0, import_constants.useIsomorphicLayoutEffect)(() => {
-      setName(toggleTheme(curName));
-    }, [defaultTheme, themeName]);
-    return props.disable ? null : name;
-  }
-  return props.disable ? null : toggleTheme(curName);
-};
 const ThemeInverse = ({
   children,
   disable
 }) => {
-  const inverseTheme = useThemeInverse({
-    disable
-  });
+  const themeName = (0, import_useTheme.useThemeName)();
+  const defaultTheme = (0, import_useTheme.useDefaultThemeName)();
+  const [name, setName] = (0, import_react.useState)(null);
+  (0, import_platform.useIsomorphicLayoutEffect)(() => {
+    if (themeName.startsWith("dark")) {
+      setName("light");
+    }
+    if (themeName.startsWith("light")) {
+      setName("dark");
+    }
+  }, [defaultTheme, themeName]);
+  if (disable) {
+    return children;
+  }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.Theme, {
-    name: inverseTheme,
+    name,
     children
   });
 };
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
-  ThemeInverse,
-  useThemeInverse
+  ThemeInverse
 });
 //# sourceMappingURL=ThemeInverse.js.map

package/dist/cjs/views/ThemeInverse.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/views/ThemeInverse.tsx"],
-  "sourcesContent": ["import { isWeb, useIsomorphicLayoutEffect } from '@tamagui/constants'\nimport React, { useState } from 'react'\n\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\nexport type ThemeInverseProps = {\n  disable?: boolean\n}\n\nconst toggleTheme = (themeName: string) => {\n  return themeName.startsWith('light') ? 'dark' : 'light'\n}\n\nexport const useThemeInverse = (props: ThemeInverseProps = {}) => {\n  const themeName = useThemeName()\n  const defaultTheme = useDefaultThemeName()\n  const [name, setName] = useState<null | string>(null)\n  const curName = themeName || defaultTheme || ''\n\n  if (isWeb) {\n    // for SSR must be in effect\n    useIsomorphicLayoutEffect(() => {\n      setName(toggleTheme(curName))\n    }, [defaultTheme, themeName])\n\n    return props.disable ? null : name\n  }\n\n  return props.disable ? null : toggleTheme(curName)\n}\n\nexport const ThemeInverse = ({\n  children,\n  disable,\n}: ThemeInverseProps & {\n  children: React.ReactNode\n}) => {\n  const inverseTheme = useThemeInverse({\n    disable,\n  })\n  return <Theme name={inverseTheme}>{children}</Theme>\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAyCS;AAzCT,uBAAiD;AACjD,mBAAgC;AAEhC,sBAAkD;AAClD,mBAAsB;AAMtB,MAAM,cAAc,CAAC,cAAsB;AACzC,SAAO,UAAU,WAAW,OAAO,IAAI,SAAS;AAClD;AAEO,MAAM,kBAAkB,CAAC,QAA2B,CAAC,MAAM;AAChE,QAAM,gBAAY,8BAAa;AAC/B,QAAM,mBAAe,qCAAoB;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAwB,IAAI;AACpD,QAAM,UAAU,aAAa,gBAAgB;AAE7C,MAAI,wBAAO;AAET,oDAA0B,MAAM;AAC9B,cAAQ,YAAY,OAAO,CAAC;AAAA,IAC9B,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,WAAO,MAAM,UAAU,OAAO;AAAA,EAChC;AAEA,SAAO,MAAM,UAAU,OAAO,YAAY,OAAO;AACnD;AAEO,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AACF,MAEM;AACJ,QAAM,eAAe,gBAAgB;AAAA,IACnC;AAAA,EACF,CAAC;AACD,SAAO,4CAAC;AAAA,IAAM,MAAM;AAAA,IAAe;AAAA,GAAS;AAC9C;",
+  "sourcesContent": ["import React, { useState } from 'react'\n\nimport { useIsomorphicLayoutEffect } from '../constants/platform'\nimport { useDefaultThemeName, useThemeName } from '../hooks/useTheme'\nimport { Theme } from './Theme'\n\nexport const ThemeInverse = ({\n  children,\n  disable,\n}: {\n  children: React.ReactNode\n  disable?: boolean\n}) => {\n  const themeName = useThemeName()\n  const defaultTheme = useDefaultThemeName()\n  const [name, setName] = useState<null | string>(null)\n\n  // ssr\n  useIsomorphicLayoutEffect(() => {\n    if (themeName.startsWith('dark')) {\n      setName('light')\n    }\n    if (themeName.startsWith('light')) {\n      setName('dark')\n    }\n  }, [defaultTheme, themeName])\n\n  if (disable) {\n    return children as JSX.Element\n  }\n\n  return <Theme name={name}>{children}</Theme>\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AA+BS;AA/BT,mBAAgC;AAEhC,sBAA0C;AAC1C,sBAAkD;AAClD,mBAAsB;AAEf,MAAM,eAAe,CAAC;AAAA,EAC3B;AAAA,EACA;AACF,MAGM;AACJ,QAAM,gBAAY,8BAAa;AAC/B,QAAM,mBAAe,qCAAoB;AACzC,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAwB,IAAI;AAGpD,iDAA0B,MAAM;AAC9B,QAAI,UAAU,WAAW,MAAM,GAAG;AAChC,cAAQ,OAAO;AAAA,IACjB;AACA,QAAI,UAAU,WAAW,OAAO,GAAG;AACjC,cAAQ,MAAM;AAAA,IAChB;AAAA,EACF,GAAG,CAAC,cAAc,SAAS,CAAC;AAE5B,MAAI,SAAS;AACX,WAAO;AAAA,EACT;AAEA,SAAO,4CAAC;AAAA,IAAM;AAAA,IAAa;AAAA,GAAS;AACtC;",
   "names": []
 }

package/dist/cjs/views/ThemeReset.js

@@ -28,31 +28,31 @@ __export(ThemeReset_exports, {
 });
 module.exports = __toCommonJS(ThemeReset_exports);
 var import_jsx_runtime = require("react/jsx-runtime");
-var import_constants = require("@tamagui/constants");
 var import_react = __toESM(require("react"));
+var import_platform = require("../constants/platform");
 var import_ThemeManager = require("../helpers/ThemeManager");
 var import_Theme = require("./Theme");
 import_react.default["createElement"];
 const ThemeReset = (props) => {
-  const manager = (0, import_react.useContext)(import_ThemeManager.ThemeManagerContext);
+  const themeManager = (0, import_react.useContext)(import_ThemeManager.ThemeManagerContext);
   const [name, setName] = (0, import_react.useState)(null);
-  if (import_constants.isClient) {
+  if (!import_platform.isWeb || typeof document !== "undefined") {
     (0, import_react.useLayoutEffect)(() => {
-      if (!manager)
+      if (!themeManager)
         return;
-      if (name !== manager.parentName) {
-        setName(manager.parentName);
+      if (name !== themeManager.parentName) {
+        setName(themeManager.parentName);
       }
-    }, [name, manager, manager == null ? void 0 : manager.parentName]);
+    }, [themeManager == null ? void 0 : themeManager.parentName]);
     (0, import_react.useLayoutEffect)(() => {
-      if (!manager)
+      if (!themeManager)
         return;
-      return manager.onChangeTheme(() => {
-        setName(manager.parentName);
+      return themeManager.onChangeTheme(() => {
+        setName(themeManager.parentName);
       });
-    }, [manager]);
+    }, []);
   }
-  if (!manager || !props.children) {
+  if (!themeManager || !props.children) {
     return props.children || null;
   }
   return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_Theme.Theme, {

package/dist/cjs/views/ThemeReset.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/views/ThemeReset.tsx"],
-  "sourcesContent": ["import { isClient } from '@tamagui/constants'\nimport React, { useContext, useLayoutEffect, useState } from 'react'\n\nimport { ThemeManagerContext } from '../helpers/ThemeManager'\nimport { Theme } from './Theme'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\n// resets the theme to the parent theme\nexport const ThemeReset = (props: { children?: any }) => {\n  const manager = useContext(ThemeManagerContext)\n  const [name, setName] = useState<string | null>(null)\n\n  // this component doesn't work with SSR, so must run only client side\n  // we could at least prevent more flickering by having the ssr head script\n  // that changes to dark initially also go through and change all of these\n  if (isClient) {\n    useLayoutEffect(() => {\n      if (!manager) return\n      if (name !== manager.parentName) {\n        setName(manager.parentName)\n      }\n    }, [name, manager, manager?.parentName])\n\n    useLayoutEffect(() => {\n      if (!manager) return\n      return manager.onChangeTheme(() => {\n        setName(manager.parentName)\n      })\n    }, [manager])\n  }\n\n  if (!manager || !props.children) {\n    return props.children || null\n  }\n\n  return (\n    <Theme className=\"tui-theme-reset\" reset name={name}>\n      {props.children}\n    </Theme>\n  )\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsCI;AAtCJ,uBAAyB;AACzB,mBAA6D;AAE7D,0BAAoC;AACpC,mBAAsB;AAGtB,aAAAA,QAAM;AAGC,MAAM,aAAa,CAAC,UAA8B;AACvD,QAAM,cAAU,yBAAW,uCAAmB;AAC9C,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAwB,IAAI;AAKpD,MAAI,2BAAU;AACZ,sCAAgB,MAAM;AACpB,UAAI,CAAC;AAAS;AACd,UAAI,SAAS,QAAQ,YAAY;AAC/B,gBAAQ,QAAQ,UAAU;AAAA,MAC5B;AAAA,IACF,GAAG,CAAC,MAAM,SAAS,mCAAS,UAAU,CAAC;AAEvC,sCAAgB,MAAM;AACpB,UAAI,CAAC;AAAS;AACd,aAAO,QAAQ,cAAc,MAAM;AACjC,gBAAQ,QAAQ,UAAU;AAAA,MAC5B,CAAC;AAAA,IACH,GAAG,CAAC,OAAO,CAAC;AAAA,EACd;AAEA,MAAI,CAAC,WAAW,CAAC,MAAM,UAAU;AAC/B,WAAO,MAAM,YAAY;AAAA,EAC3B;AAEA,SACE,4CAAC;AAAA,IAAM,WAAU;AAAA,IAAkB,OAAK;AAAA,IAAC;AAAA,IACtC,gBAAM;AAAA,GACT;AAEJ;",
+  "sourcesContent": ["import React, { useContext, useLayoutEffect, useState } from 'react'\n\nimport { isWeb } from '../constants/platform'\nimport { ThemeManagerContext } from '../helpers/ThemeManager'\nimport { Theme } from './Theme'\n\n// bugfix esbuild strips react jsx: 'preserve'\nReact['createElement']\n\n// resets the theme to the parent theme\nexport const ThemeReset = (props: { children?: any }) => {\n  const themeManager = useContext(ThemeManagerContext)\n  const [name, setName] = useState<string | null>(null)\n\n  // this component doesn't work with SSR, so must run only client side\n  // we could at least prevent more flickering by having the ssr head script\n  // that changes to dark initially also go through and change all of these\n  if (!isWeb || typeof document !== 'undefined') {\n    useLayoutEffect(() => {\n      if (!themeManager) return\n      if (name !== themeManager.parentName) {\n        setName(themeManager.parentName)\n      }\n    }, [themeManager?.parentName])\n\n    useLayoutEffect(() => {\n      if (!themeManager) return\n      return themeManager.onChangeTheme(() => {\n        setName(themeManager.parentName)\n      })\n    }, [])\n  }\n\n  if (!themeManager || !props.children) {\n    return props.children || null\n  }\n\n  return (\n    <Theme className=\"tui-theme-reset\" reset name={name}>\n      {props.children}\n    </Theme>\n  )\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAsCI;AAtCJ,mBAA6D;AAE7D,sBAAsB;AACtB,0BAAoC;AACpC,mBAAsB;AAGtB,aAAAA,QAAM;AAGC,MAAM,aAAa,CAAC,UAA8B;AACvD,QAAM,mBAAe,yBAAW,uCAAmB;AACnD,QAAM,CAAC,MAAM,OAAO,QAAI,uBAAwB,IAAI;AAKpD,MAAI,CAAC,yBAAS,OAAO,aAAa,aAAa;AAC7C,sCAAgB,MAAM;AACpB,UAAI,CAAC;AAAc;AACnB,UAAI,SAAS,aAAa,YAAY;AACpC,gBAAQ,aAAa,UAAU;AAAA,MACjC;AAAA,IACF,GAAG,CAAC,6CAAc,UAAU,CAAC;AAE7B,sCAAgB,MAAM;AACpB,UAAI,CAAC;AAAc;AACnB,aAAO,aAAa,cAAc,MAAM;AACtC,gBAAQ,aAAa,UAAU;AAAA,MACjC,CAAC;AAAA,IACH,GAAG,CAAC,CAAC;AAAA,EACP;AAEA,MAAI,CAAC,gBAAgB,CAAC,MAAM,UAAU;AACpC,WAAO,MAAM,YAAY;AAAA,EAC3B;AAEA,SACE,4CAAC;AAAA,IAAM,WAAU;AAAA,IAAkB,OAAK;AAAA,IAAC;AAAA,IACtC,gBAAM;AAAA,GACT;AAEJ;",
   "names": ["React"]
 }

package/dist/esm/constants/platform.js

@@ -0,0 +1,30 @@
+var _a, _b;
+import { useEffect, useLayoutEffect } from "react";
+import { Platform } from "react-native";
+const isAndroid = ((_a = Platform) == null ? void 0 : _a.OS) === "android";
+const isIOS = ((_b = Platform) == null ? void 0 : _b.OS) === "ios";
+const isWeb = process.env.TAMAGUI_TARGET === "web";
+const isWindowDefined = typeof window !== "undefined";
+const isServer = isWeb && !isWindowDefined;
+const isClient = isWeb && isWindowDefined;
+const isRSC = process.env.ENABLE_RSC ? import.meta.env ? import.meta.env.SSR : false : false;
+const idFn = () => {
+};
+const useIsomorphicLayoutEffect = isRSC ? idFn : isServer ? useEffect : useLayoutEffect;
+const isChrome = typeof navigator !== "undefined" && /Chrome/.test(navigator.userAgent || "");
+const isWebTouchable = isClient && "ontouchstart" in window;
+const isTouchable = !isWeb || isWebTouchable;
+export {
+  isAndroid,
+  isChrome,
+  isClient,
+  isIOS,
+  isRSC,
+  isServer,
+  isTouchable,
+  isWeb,
+  isWebTouchable,
+  isWindowDefined,
+  useIsomorphicLayoutEffect
+};
+//# sourceMappingURL=platform.js.map

package/dist/esm/constants/platform.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/constants/platform.ts"],
+  "sourcesContent": ["import { useEffect, useLayoutEffect } from 'react'\nimport { Platform } from 'react-native'\n\nexport const isAndroid = Platform?.OS === 'android'\nexport const isIOS = Platform?.OS === 'ios'\nexport const isWeb = process.env.TAMAGUI_TARGET === 'web'\nexport const isWindowDefined = typeof window !== 'undefined'\nexport const isServer = isWeb && !isWindowDefined\nexport const isClient = isWeb && isWindowDefined\n\n// may want to move to VITE_RSC_BUILD\nexport const isRSC = process.env.ENABLE_RSC\n  ? // note this is statically analyzed so no funny business, just access it without optional chaining\n    // @ts-ignore\n    import.meta.env\n    ? // @ts-ignore\n      import.meta.env.SSR\n    : false\n  : false\n\nconst idFn = () => {}\nexport const useIsomorphicLayoutEffect = isRSC ? idFn : isServer ? useEffect : useLayoutEffect\nexport const isChrome = typeof navigator !== 'undefined' && /Chrome/.test(navigator.userAgent || '')\nexport const isWebTouchable = isClient && 'ontouchstart' in window\nexport const isTouchable = !isWeb || isWebTouchable\n"],
+  "mappings": "AAAA;AAAA,SAAS,WAAW,uBAAuB;AAC3C,SAAS,gBAAgB;AAElB,MAAM,cAAY,qCAAU,QAAO;AACnC,MAAM,UAAQ,qCAAU,QAAO;AAC/B,MAAM,QAAQ,QAAQ,IAAI,mBAAmB;AAC7C,MAAM,kBAAkB,OAAO,WAAW;AAC1C,MAAM,WAAW,SAAS,CAAC;AAC3B,MAAM,WAAW,SAAS;AAG1B,MAAM,QAAQ,QAAQ,IAAI,aAG7B,YAAY,MAEV,YAAY,IAAI,MAChB,QACF;AAEJ,MAAM,OAAO,MAAM;AAAC;AACb,MAAM,4BAA4B,QAAQ,OAAO,WAAW,YAAY;AACxE,MAAM,WAAW,OAAO,cAAc,eAAe,SAAS,KAAK,UAAU,aAAa,EAAE;AAC5F,MAAM,iBAAiB,YAAY,kBAAkB;AACrD,MAAM,cAAc,CAAC,SAAS;",
+  "names": []
+}

package/dist/esm/constants/platform.native.js

@@ -0,0 +1,28 @@
+var _a, _b;
+import { useLayoutEffect } from "react";
+import { Platform } from "react-native";
+const isAndroid = ((_a = Platform) == null ? void 0 : _a.OS) === "android";
+const isIOS = ((_b = Platform) == null ? void 0 : _b.OS) === "ios";
+const isWeb = false;
+const isWindowDefined = false;
+const isSSR = false;
+const isClient = false;
+const isRSC = false;
+const useIsomorphicLayoutEffect = useLayoutEffect;
+const isChrome = false;
+const isWebTouchable = false;
+const isTouchable = true;
+export {
+  isAndroid,
+  isChrome,
+  isClient,
+  isIOS,
+  isRSC,
+  isSSR,
+  isTouchable,
+  isWeb,
+  isWebTouchable,
+  isWindowDefined,
+  useIsomorphicLayoutEffect
+};
+//# sourceMappingURL=platform.native.js.map

package/dist/esm/constants/platform.native.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/constants/platform.native.ts"],
+  "sourcesContent": ["import { useLayoutEffect } from 'react'\nimport { Platform } from 'react-native'\n\nexport const isAndroid = Platform?.OS === 'android'\nexport const isIOS = Platform?.OS === 'ios'\nexport const isWeb = false\nexport const isWindowDefined = false\nexport const isSSR = false\nexport const isClient = false\nexport const isRSC = false\nexport const useIsomorphicLayoutEffect = useLayoutEffect\nexport const isChrome = false\nexport const isWebTouchable = false\nexport const isTouchable = true\n"],
+  "mappings": "AAAA;AAAA,SAAS,uBAAuB;AAChC,SAAS,gBAAgB;AAElB,MAAM,cAAY,qCAAU,QAAO;AACnC,MAAM,UAAQ,qCAAU,QAAO;AAC/B,MAAM,QAAQ;AACd,MAAM,kBAAkB;AACxB,MAAM,QAAQ;AACd,MAAM,WAAW;AACjB,MAAM,QAAQ;AACd,MAAM,4BAA4B;AAClC,MAAM,WAAW;AACjB,MAAM,iBAAiB;AACvB,MAAM,cAAc;",
+  "names": []
+}

package/dist/esm/createComponent.js

@@ -118,10 +118,12 @@ function createComponent(configIn, ParentComponent) {
     if (isAnimated && presence) {
       const presenceState = presence[2];
       if (presenceState) {
-        if (presenceState.enterVariant)
+        if (state.unmounted && presenceState.enterVariant) {
           props[presenceState.enterVariant] = true;
-        if (presenceState.exitVariant)
+        }
+        if (!presenceState.isPresent && presenceState.exitVariant) {
           props[presenceState.exitVariant] = true;
+        }
       }
     }
     const isReactNative = Boolean(
@@ -237,31 +239,24 @@ function createComponent(configIn, ParentComponent) {
       }
     }
     useIsomorphicLayoutEffect(() => {
-      if (!mediaKeys.length)
-        return;
-      const disposers = [];
-      for (const key of mediaKeys) {
-        disposers.push(
-          addMediaQueryListener(key, (next) => {
-            setState((prev) => {
-              if (prev.mediaState[key] !== next) {
-                return {
-                  ...prev,
-                  mediaState: getMediaStateObject({
-                    ...prev.mediaState,
-                    [key]: next
-                  })
-                };
-              }
-              return prev;
-            });
-          })
-        );
-      }
+      const disposers = mediaKeys.map((key) => {
+        return addMediaQueryListener(key, (next) => {
+          setState((prev) => {
+            if (prev.mediaState[key] !== next) {
+              return {
+                ...prev,
+                mediaState: getMediaStateObject({
+                  ...prev.mediaState,
+                  [key]: next
+                })
+              };
+            }
+            return prev;
+          });
+        });
+      });
       return () => {
-        for (const disposer of disposers) {
-          disposer();
-        }
+        disposers.forEach((d) => d());
       };
     }, [mediaKeys.join(",")]);
     const {
@@ -372,7 +367,7 @@ function createComponent(configIn, ParentComponent) {
       viewProps = nonTamaguiProps;
     }
     viewProps.ref = useComposedRefs(hostRef, forwardedRef, setMounted);
-    if (process.env.NODE_ENV === "development" && !isText && isWeb && !staticConfig.isHOC) {
+    if (process.env.NODE_ENV === "development" && !isText && isWeb) {
       Children.toArray(props.children).forEach((item) => {
         if (typeof item === "string") {
           console.error(`Unexpected text node: ${item}. A text node cannot be a child of a <View>.`);
@@ -728,7 +723,6 @@ function createComponent(configIn, ParentComponent) {
         Component,
         ...conf,
         neverFlatten: true,
-        isHOC: true,
         defaultProps: {
           ...Component.defaultProps,
           ...conf == null ? void 0 : conf.defaultProps
@@ -936,16 +930,6 @@ const dontComposePressabilityKeys = {
 function getMediaStateObject(obj) {
   return Object.fromEntries(Object.entries(obj).flatMap(([k, v]) => v ? [[`$${k}`, v]] : []));
 }
-const baseDefaults = {
-  opacity: 1
-};
-const transformDefaults = {
-  opacity: 1,
-  scale: 1,
-  rotate: "0deg",
-  rotateY: "0deg",
-  rotateX: "0deg"
-};
 export {
   Spacer,
   Unspaced,