@tamagui/core 1.65.4 → 1.67.0

package/dist/native.js

@@ -1154,6 +1154,7 @@ var require_config_native = __commonJS({
     }, __toCommonJS2 = (mod) => __copyProps2(__defProp2({}, "__esModule", { value: !0 }), mod), config_exports = {};
     __export2(config_exports, {
       configListeners: () => configListeners,
+      devConfig: () => devConfig,
       getConfig: () => getConfig2,
       getFont: () => getFont,
       getThemes: () => getThemes2,
@@ -1165,6 +1166,7 @@ var require_config_native = __commonJS({
       setConfig: () => setConfig,
       setConfigFont: () => setConfigFont,
       setTokens: () => setTokens,
+      setupDev: () => setupDev2,
       updateConfig: () => updateConfig2,
       useTokens: () => useTokens
     });
@@ -1211,7 +1213,10 @@ var require_config_native = __commonJS({
           return ((_b = (_a2 = conf2.fontsParsed[k]) == null ? void 0 : _a2.family) == null ? void 0 : _b.val) === name;
         }
       )) == null ? void 0 : _a[1]);
-    };
+    }, devConfig;
+    function setupDev2(conf2) {
+      process.env.NODE_ENV === "development" && (devConfig = conf2);
+    }
   }
 });
 
@@ -2400,7 +2405,7 @@ var require_getVariantExtras_native = __commonJS({
         tokens: conf.tokensParsed,
         theme,
         fontFamily,
-        font: fonts[fontFamily],
+        font: fonts[fontFamily] || fonts[styleState.conf.defaultFont],
         // TODO do this in splitstlye
         // we avoid passing in default props for media queries because that would confuse things like SizableText.size:
         props: (0, import_createProxy.createProxy)(curProps, {
@@ -2626,9 +2631,9 @@ var require_propMapper_native = __commonJS({
           case "lineHeight":
           case "letterSpacing":
           case "fontWeight": {
-            let fam = fontFamily || conf.defaultFont;
+            let defaultFont = conf.defaultFont || "$body", fam = fontFamily || defaultFont;
             if (fam) {
-              let font = (context != null && context.language ? (0, import_getVariantExtras.getFontsForLanguage)(conf.fontsParsed, context.language) : conf.fontsParsed)[fam];
+              let fontsParsed = context != null && context.language ? (0, import_getVariantExtras.getFontsForLanguage)(conf.fontsParsed, context.language) : conf.fontsParsed, font = fontsParsed[fam] || fontsParsed[defaultFont];
               valOrVar = ((_b = font == null ? void 0 : font[fontShorthand[key] || key]) == null ? void 0 : _b[value]) || value, hasSet = !0;
             }
             break;
@@ -3882,7 +3887,7 @@ var require_getSplitStyles_native = __commonJS({
         if (isStyleProp && props.asChild === "except-style")
           continue;
         let shouldPassProp = !isStyleProp || // is in parent variants
-        isHOC && (parentStaticConfig == null ? void 0 : parentStaticConfig.variants) && keyInit in parentStaticConfig.variants || (inlineProps == null ? void 0 : inlineProps.has(keyInit)), isHOCShouldPassThrough = !!(isHOC && (isShorthand || isValidStyleKeyInit || isMediaOrPseudo || (_a = parentStaticConfig == null ? void 0 : parentStaticConfig.variants) != null && _a[keyInit] || keyInit in skipProps)), shouldPassThrough = shouldPassProp || isHOCShouldPassThrough;
+        isHOC && (parentStaticConfig == null ? void 0 : parentStaticConfig.variants) && keyInit in parentStaticConfig.variants || (inlineProps == null ? void 0 : inlineProps.has(keyInit)), parentVariant = (_a = parentStaticConfig == null ? void 0 : parentStaticConfig.variants) == null ? void 0 : _a[keyInit], isHOCShouldPassThrough = !!(isHOC && (isShorthand || isValidStyleKeyInit || isMediaOrPseudo || parentVariant || keyInit in skipProps)), shouldPassThrough = shouldPassProp || isHOCShouldPassThrough;
         if (process.env.NODE_ENV === "development" && debug === "verbose" && (console.groupCollapsed(
           `\u{1F539}\u{1F539}\u{1F539}\u{1F539} ${keyOg}${keyInit !== keyOg ? ` (shorthand for ${keyInit})` : ""} ${shouldPassThrough ? "(pass)" : ""} \u{1F539}\u{1F539}\u{1F539}\u{1F539}`
         ), console.log({ isVariant, valInit, shouldPassProp }), import_constants2.isClient && console.log({
@@ -4597,12 +4602,30 @@ var require_createComponent_native = __commonJS({
       spacedChildren: () => spacedChildren
     });
     module2.exports = __toCommonJS2(createComponent_exports);
-    var import_compose_refs = require_index_native6(), import_constants2 = require_index_native2(), import_helpers = require_index_native4(), import_use_did_finish_ssr = require_index_native7(), import_react = __toESM2(require("react")), import_config = require_config_native(), import_constants22 = require_constants_native(), import_ComponentContext = require_ComponentContext_native(), import_createVariable = require_createVariable_native(), import_defaultComponentState = require_defaultComponentState_native(), import_createShallowSetState = require_createShallowSetState_native(), import_getSplitStyles = require_getSplitStyles_native(), import_mergeProps = require_mergeProps_native(), import_proxyThemeVariables = require_proxyThemeVariables_native(), import_themeable = require_themeable_native(), import_useMedia = require_useMedia_native(), import_useTheme = require_useTheme_native(), import_setupHooks = require_setupHooks_native(), import_Slot = require_Slot_native(), import_Theme = require_Theme_native(), import_ThemeDebug = require_ThemeDebug_native(), import_jsx_runtime = require("react/jsx-runtime"), tamaguiConfig, AnimatedText, AnimatedView, initialTheme, time, mouseUps = /* @__PURE__ */ new Set();
+    var import_compose_refs = require_index_native6(), import_constants2 = require_index_native2(), import_helpers = require_index_native4(), import_use_did_finish_ssr = require_index_native7(), import_react = __toESM2(require("react")), import_config = require_config_native(), import_constants22 = require_constants_native(), import_ComponentContext = require_ComponentContext_native(), import_createVariable = require_createVariable_native(), import_defaultComponentState = require_defaultComponentState_native(), import_createShallowSetState = require_createShallowSetState_native(), import_getSplitStyles = require_getSplitStyles_native(), import_mergeProps = require_mergeProps_native(), import_proxyThemeVariables = require_proxyThemeVariables_native(), import_themeable = require_themeable_native(), import_useMedia = require_useMedia_native(), import_useTheme = require_useTheme_native(), import_setupHooks = require_setupHooks_native(), import_Slot = require_Slot_native(), import_Theme = require_Theme_native(), import_ThemeDebug = require_ThemeDebug_native(), import_jsx_runtime = require("react/jsx-runtime"), tamaguiConfig, AnimatedText, AnimatedView, initialTheme, time, debugKeyListeners, startVisualizer, mouseUps = /* @__PURE__ */ new Set();
     if (typeof document < "u") {
       let cancelTouches = () => {
         mouseUps.forEach((x) => x()), mouseUps.clear();
       };
-      addEventListener("mouseup", cancelTouches), addEventListener("touchend", cancelTouches), addEventListener("touchcancel", cancelTouches);
+      addEventListener("mouseup", cancelTouches), addEventListener("touchend", cancelTouches), addEventListener("touchcancel", cancelTouches), process.env.NODE_ENV === "development" && (startVisualizer = () => {
+        var _a;
+        let devVisualizerConfig = (_a = import_config.devConfig) == null ? void 0 : _a.visualizer;
+        if (devVisualizerConfig) {
+          debugKeyListeners = /* @__PURE__ */ new Set();
+          let tm, isShowing = !1, options = {
+            key: "Alt",
+            delay: 800,
+            ...typeof devVisualizerConfig == "object" ? devVisualizerConfig : {}
+          };
+          document.addEventListener("keydown", ({ key, defaultPrevented }) => {
+            defaultPrevented || key === options.key && (clearTimeout(tm), tm = setTimeout(() => {
+              isShowing = !0, debugKeyListeners == null || debugKeyListeners.forEach((l) => l(!0));
+            }, options.delay));
+          }), document.addEventListener("keyup", ({ key, defaultPrevented }) => {
+            defaultPrevented || key === options.key && (clearTimeout(tm), isShowing && (debugKeyListeners == null || debugKeyListeners.forEach((l) => l(!1))));
+          });
+        }
+      });
     }
     var BaseText, BaseView, hasSetupBaseViews = !1;
     function createComponent(staticConfig) {
@@ -4629,7 +4652,7 @@ var require_createComponent_native = __commonJS({
       });
       let component = (0, import_react.forwardRef)((propsIn, forwardedRef) => {
         var _a2, _b, _c, _d, _g, _h, _i, _j, _k;
-        if (!hasSetupBaseViews) {
+        if (process.env.NODE_ENV === "development" && startVisualizer && (startVisualizer(), startVisualizer = void 0), !hasSetupBaseViews) {
           hasSetupBaseViews = !0;
           let baseViews = (_b = (_a2 = import_setupHooks.hooks).getBaseViews) == null ? void 0 : _b.call(_a2);
           baseViews && (BaseText = baseViews.Text, BaseView = baseViews.View);
@@ -4650,7 +4673,21 @@ var require_createComponent_native = __commonJS({
         let curDefaultProps = styledContextProps ? { ...defaultProps, ...styledContextProps } : defaultProps, props;
         curDefaultProps ? props = (0, import_mergeProps.mergeProps)(curDefaultProps, propsIn) : props = propsIn;
         let debugProp = props.debug, componentName = props.componentName || staticConfig.componentName;
-        process.env.NODE_ENV === "development" && time && time`start (ignore)`;
+        process.env.NODE_ENV === "development" && import_constants2.isClient && (0, import_react.useEffect)(() => {
+          let overlay = null, debugVisualizerHandler = (show = !1) => {
+            let node = hostRef.current;
+            if (node)
+              if (show) {
+                overlay = document.createElement("span"), overlay.style.inset = "0px", overlay.style.zIndex = "1000000", overlay.style.position = "absolute", overlay.style.borderColor = "red", overlay.style.borderWidth = "1px", overlay.style.borderStyle = "dotted";
+                let dataAt = node.getAttribute("data-at") || "", dataIn = node.getAttribute("data-in") || "", tooltip = document.createElement("span");
+                tooltip.style.position = "absolute", tooltip.style.top = "0px", tooltip.style.left = "0px", tooltip.style.padding = "3px", tooltip.style.background = "rgba(0,0,0,0.75)", tooltip.style.color = "rgba(255,255,255,1)", tooltip.style.fontSize = "12px", tooltip.style.lineHeight = "12px", tooltip.style.fontFamily = "monospace", tooltip.style.webkitFontSmoothing = "none", tooltip.innerText = `${componentName || ""} ${dataAt} ${dataIn}`.trim(), overlay.appendChild(tooltip), node.appendChild(overlay);
+              } else
+                overlay && node.removeChild(overlay);
+          };
+          return debugKeyListeners ||= /* @__PURE__ */ new Set(), debugKeyListeners.add(debugVisualizerHandler), () => {
+            debugKeyListeners == null || debugKeyListeners.delete(debugVisualizerHandler);
+          };
+        }, [componentName]), process.env.NODE_ENV === "development" && time && time`start (ignore)`;
         let isHydrated = config != null && config.disableSSR ? !0 : (0, import_use_did_finish_ssr.useDidFinishSSR)();
         process.env.NODE_ENV === "development" && time && time`did-finish-ssr`;
         let stateRef = (0, import_react.useRef)(
@@ -5025,7 +5062,8 @@ If you meant to do this, you can disable this warning - either change untilMeasu
           ...staticConfig,
           ...extended,
           neverFlatten: !0,
-          isHOC: !0
+          isHOC: !0,
+          isStyledHOC: !1
         };
       }
       function extractable(Component2, extended) {
@@ -5846,7 +5884,7 @@ var require_styled_native = __commonJS({
           }), parentStaticConfig && (parentStaticConfig.isHOC && !parentStaticConfig.isStyledHOC || (defaultProps = {
             ...parentStaticConfig.defaultProps,
             ...defaultProps
-          }), parentStaticConfig.variants && (variants = (0, import_mergeVariants.mergeVariants)(parentStaticConfig.variants, variants))), parentStaticConfig != null && parentStaticConfig.isHOC && name && (defaultProps.componentName = name);
+          }, parentStaticConfig.variants && (variants = (0, import_mergeVariants.mergeVariants)(parentStaticConfig.variants, variants)))), parentStaticConfig != null && parentStaticConfig.isHOC && name && (defaultProps.componentName = name);
           let isText = !!(staticExtractionOptions != null && staticExtractionOptions.isText || parentStaticConfig != null && parentStaticConfig.isText), acceptsClassName = acceptsClassNameProp ?? (isPlainStyledComponent || isReactNative || (parentStaticConfig == null ? void 0 : parentStaticConfig.isHOC) && (parentStaticConfig == null ? void 0 : parentStaticConfig.acceptsClassName)), conf = {
             ...parentStaticConfig,
             ...staticExtractionOptions,
@@ -6515,6 +6553,7 @@ var require_index_native9 = __commonJS({
       mediaObjectToString: () => import_useMedia.mediaObjectToString,
       mediaQueryConfig: () => import_useMedia.mediaQueryConfig,
       mediaState: () => import_useMedia.mediaState,
+      setupDev: () => import_config.setupDev,
       updateConfig: () => import_config.updateConfig,
       useMedia: () => import_useMedia.useMedia,
       useMediaPropsActive: () => import_useMedia.useMediaPropsActive