@tamagui/core 1.89.0 → 1.89.1

package/dist/esm/createOptimizedView.mjs

@@ -0,0 +1,2 @@
+function createOptimizedView(children, viewProps, baseViews) {}
+export { createOptimizedView };

package/dist/esm/getBaseViews.mjs

@@ -0,0 +1,4 @@
+function getBaseViews() {
+  return null;
+}
+export { getBaseViews };

package/dist/esm/helpers/getBoundingClientRect.mjs

@@ -0,0 +1,4 @@
+const getBoundingClientRect = node => {
+  if (!(!node || node.nodeType !== 1)) return node.getBoundingClientRect?.();
+};
+export { getBoundingClientRect };

package/dist/esm/helpers/getRect.mjs

@@ -0,0 +1,20 @@
+import { getBoundingClientRect } from "./getBoundingClientRect.mjs";
+const getRect = node => {
+  const rect = getBoundingClientRect(node);
+  if (!rect) return;
+  const {
+    x,
+    y,
+    top,
+    left
+  } = rect;
+  return {
+    x,
+    y,
+    width: node.offsetWidth,
+    height: node.offsetHeight,
+    top,
+    left
+  };
+};
+export { getRect };

package/dist/esm/hooks/useElementLayout.mjs

@@ -0,0 +1,87 @@
+import { useIsomorphicLayoutEffect } from "@tamagui/constants";
+import { getBoundingClientRect } from "../helpers/getBoundingClientRect.mjs";
+const LayoutHandlers = /* @__PURE__ */new WeakMap();
+let resizeObserver = null;
+typeof window < "u" && "ResizeObserver" in window && (resizeObserver = new ResizeObserver(entries => {
+  for (const {
+    target
+  } of entries) {
+    const onLayout = LayoutHandlers.get(target);
+    if (typeof onLayout != "function") return;
+    measureLayout(target, null, (x, y, width, height, left, top) => {
+      onLayout({
+        nativeEvent: {
+          layout: {
+            x,
+            y,
+            width,
+            height,
+            left,
+            top
+          },
+          target
+        },
+        timeStamp: Date.now()
+      });
+    });
+  }
+}));
+const cache = /* @__PURE__ */new WeakMap(),
+  measureLayout = (node, relativeTo, callback) => {
+    const relativeNode = relativeTo || node?.parentNode;
+    if (relativeNode instanceof HTMLElement) {
+      const now = Date.now();
+      cache.set(node, now), Promise.all([getBoundingClientRectAsync(node), getBoundingClientRectAsync(relativeNode)]).then(([nodeDim, relativeNodeDim]) => {
+        if (relativeNodeDim && nodeDim && cache.get(node) === now) {
+          const {
+            x,
+            y,
+            width,
+            height,
+            left,
+            top
+          } = getRelativeDimensions(nodeDim, relativeNodeDim);
+          callback(x, y, width, height, left, top);
+        }
+      });
+    }
+  },
+  getRelativeDimensions = (a, b) => {
+    const {
+        height,
+        left,
+        top,
+        width
+      } = a,
+      x = left - b.left,
+      y = top - b.top;
+    return {
+      x,
+      y,
+      width,
+      height,
+      left,
+      top
+    };
+  },
+  getBoundingClientRectAsync = element => new Promise(resolve => {
+    function fallbackToSync() {
+      resolve(getBoundingClientRect(element));
+    }
+    const tm = setTimeout(fallbackToSync, 10);
+    new IntersectionObserver((entries, ob) => {
+      clearTimeout(tm), ob.disconnect(), resolve(entries[0]?.boundingClientRect);
+    }, {
+      threshold: 1e-4
+    }).observe(element);
+  });
+function useElementLayout(ref, onLayout) {
+  useIsomorphicLayoutEffect(() => {
+    if (!resizeObserver || !onLayout) return;
+    const node = ref.current;
+    if (node) return LayoutHandlers.set(node, onLayout), resizeObserver.observe(node), () => {
+      resizeObserver?.unobserve(node);
+    };
+  }, [ref, onLayout]);
+}
+export { measureLayout, useElementLayout };

package/dist/esm/hooks/usePlatformMethods.mjs

@@ -0,0 +1,20 @@
+import { useIsomorphicLayoutEffect } from "@tamagui/constants";
+import { getRect } from "../helpers/getRect.mjs";
+import { measureLayout } from "./useElementLayout.mjs";
+function usePlatformMethods(hostRef) {
+  useIsomorphicLayoutEffect(() => {
+    const node = hostRef.current;
+    node && (node.measure ||= callback => measureLayout(node, null, callback), node.measureLayout ||= (relativeToNode, success) => measureLayout(node, relativeToNode, success), node.measureInWindow ||= callback => {
+      node && setTimeout(() => {
+        const {
+          height,
+          left,
+          top,
+          width
+        } = getRect(node);
+        callback(left, top, width, height);
+      }, 0);
+    });
+  }, [hostRef]);
+}
+export { usePlatformMethods };

package/dist/esm/index.mjs

@@ -0,0 +1,90 @@
+import { useResponderEvents } from "@tamagui/react-native-use-responder-events";
+import { Stack as WebStack, Text as WebText, View as WebView, setupHooks } from "@tamagui/web";
+import { useMemo } from "react";
+import "./createOptimizedView.mjs";
+import { getBaseViews } from "./getBaseViews.mjs";
+import { useElementLayout } from "./hooks/useElementLayout.mjs";
+import { usePlatformMethods } from "./hooks/usePlatformMethods.mjs";
+import "./vendor/Pressability.mjs";
+export * from "@tamagui/web";
+export * from "./reactNativeTypes.mjs";
+const baseViews = getBaseViews();
+setupHooks({
+  getBaseViews,
+  usePropsTransform(elementType, propsIn, stateRef, willHydrate) {
+    {
+      const isDOM = typeof elementType == "string",
+        {
+          // event props
+          onMoveShouldSetResponder,
+          onMoveShouldSetResponderCapture,
+          onResponderEnd,
+          onResponderGrant,
+          onResponderMove,
+          onResponderReject,
+          onResponderRelease,
+          onResponderStart,
+          onResponderTerminate,
+          onResponderTerminationRequest,
+          onScrollShouldSetResponder,
+          onScrollShouldSetResponderCapture,
+          onSelectionChangeShouldSetResponder,
+          onSelectionChangeShouldSetResponderCapture,
+          onStartShouldSetResponder,
+          onStartShouldSetResponderCapture,
+          // android
+          collapsable,
+          focusable,
+          // deprecated,
+          accessible,
+          accessibilityDisabled,
+          onLayout,
+          hrefAttrs,
+          ...plainDOMProps
+        } = propsIn;
+      if (willHydrate || isDOM) {
+        const hostRef = useMemo(() => ({
+          get current() {
+            return stateRef.current.host;
+          }
+        }), [stateRef]);
+        usePlatformMethods(hostRef), useElementLayout(hostRef, isDOM ? onLayout : void 0), useResponderEvents(hostRef, isDOM ? {
+          onMoveShouldSetResponder,
+          onMoveShouldSetResponderCapture,
+          onResponderEnd,
+          onResponderGrant,
+          onResponderMove,
+          onResponderReject,
+          onResponderRelease,
+          onResponderStart,
+          onResponderTerminate,
+          onResponderTerminationRequest,
+          onScrollShouldSetResponder,
+          onScrollShouldSetResponderCapture,
+          onSelectionChangeShouldSetResponder,
+          onSelectionChangeShouldSetResponderCapture,
+          onStartShouldSetResponder,
+          onStartShouldSetResponderCapture
+        } : void 0);
+      }
+      if (isDOM) {
+        if (plainDOMProps.href && hrefAttrs) {
+          const {
+            download,
+            rel,
+            target
+          } = hrefAttrs;
+          download != null && (plainDOMProps.download = download), rel && (plainDOMProps.rel = rel), typeof target == "string" && (plainDOMProps.target = target.charAt(0) !== "_" ? `_${target}` : target);
+        }
+        return plainDOMProps;
+      }
+    }
+  },
+  useEvents(viewProps, events, {
+    pseudos
+  }, setStateShallow, staticConfig) {}
+});
+const View = WebView,
+  Stack = WebStack,
+  Text = WebText;
+export { Stack, Text, View };

package/dist/esm/inject-styles.mjs

@@ -0,0 +1,13 @@
+const stylesheets = {},
+  injectStyles = ({
+    filePath,
+    css
+  }) => {
+    let stylesheet = stylesheets[filePath];
+    if (!stylesheet) {
+      const styleEl = document.createElement("style");
+      styleEl.setAttribute("data-file", filePath), styleEl.setAttribute("type", "text/css"), stylesheet = stylesheets[filePath] = styleEl, document.head.appendChild(styleEl);
+    }
+    stylesheet.innerHTML = css;
+  };
+export { injectStyles };

package/dist/esm/vendor/Pressability.mjs

@@ -0,0 +1,3 @@
+const Pressability = {},
+  usePressability = e => ({});
+export { Pressability, usePressability };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tamagui/core",
-  "version": "1.89.0",
+  "version": "1.89.1",
   "source": "src/index.tsx",
   "main": "dist/cjs",
   "module": "dist/esm",
@@ -35,16 +35,16 @@
     "native-test.d.ts"
   ],
   "dependencies": {
-    "@tamagui/react-native-use-pressable": "1.89.0",
-    "@tamagui/react-native-use-responder-events": "1.89.0",
-    "@tamagui/use-event": "1.89.0",
-    "@tamagui/web": "1.89.0"
+    "@tamagui/react-native-use-pressable": "1.89.1",
+    "@tamagui/react-native-use-responder-events": "1.89.1",
+    "@tamagui/use-event": "1.89.1",
+    "@tamagui/web": "1.89.1"
   },
   "peerDependencies": {
     "react": "*"
   },
   "devDependencies": {
-    "@tamagui/build": "1.89.0",
+    "@tamagui/build": "1.89.1",
     "@testing-library/react": "^14.0.0",
     "csstype": "^3.0.10",
     "react": "^18.2.0",