@multiplatform.one/forms 7.65.2 → 7.67.0

package/dist/cjs/FloatingPanel/RegularPanel.cjs

@@ -0,0 +1,164 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var RegularPanel_exports = {};
+__export(RegularPanel_exports, {
+  RegularPanel: () => RegularPanel
+});
+module.exports = __toCommonJS(RegularPanel_exports);
+var import_theme = require("@multiplatform.one/theme");
+var import_react = require("react");
+var import_react_native = require("react-native-web");
+var import_tamagui = require("tamagui");
+var import_t = require("../shared/t.cjs");
+var import_regularPlacement = require("./regularPlacement.cjs");
+var import_jsx_runtime = require("react/jsx-runtime");
+function RegularPanel({
+  anchor,
+  bounds,
+  widthMode,
+  echo,
+  echoLabel,
+  header,
+  scrollable,
+  fill,
+  scrollViewProps,
+  framePadding,
+  frameGap,
+  onBackdropPress,
+  onClose,
+  children
+}) {
+  const {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)({
+    painted: false
+  });
+  const [size, setSize] = (0, import_react.useState)(null);
+  const room = Math.max(0, bounds.bottom - bounds.top);
+  const fillHeight = fill ? Math.min(import_regularPlacement.regularFillHeight, room) : void 0;
+  const placement = anchor && size ? (0, import_regularPlacement.placeRegularPanel)({
+    trigger: anchor,
+    width: size.width,
+    height: fillHeight ?? size.height,
+    bounds,
+    widthMode,
+    rtl: import_react_native.I18nManager.isRTL
+  }) : null;
+  const widthStyle = widthMode === "match-trigger" ? {
+    width: anchor?.width
+  } : widthMode === "at-least-trigger" ? {
+    minWidth: anchor?.width ?? 0
+  } : void 0;
+  const echoRow = echo != null && anchor && anchor.height > 0 ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Pressable, {
+    testID: "floating-panel-regular-echo",
+    onPress: onClose,
+    accessibilityRole: "button",
+    ...(echoLabel ? {
+      accessibilityLabel: echoLabel
+    } : void 0),
+    "aria-expanded": true,
+    style: {
+      height: anchor.height,
+      justifyContent: "center"
+    },
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.View, {
+      pointerEvents: "none",
+      children: echo
+    })
+  }) : null;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_react_native.View, {
+    style: import_react_native.StyleSheet.absoluteFill,
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Pressable, {
+      style: import_react_native.StyleSheet.absoluteFill,
+      onPress: onBackdropPress,
+      accessibilityRole: "button",
+      accessibilityLabel: (0, import_t.t)("Close")
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.View, {
+      testID: "floating-panel-regular",
+      onLayout: e => {
+        if (size) return;
+        const {
+          width,
+          height
+        } = e.nativeEvent.layout;
+        if (width > 0 && height > 0) setSize({
+          width,
+          height
+        });
+      },
+      style: {
+        position: "absolute",
+        left: placement?.left ?? bounds.left,
+        top: placement?.top ?? bounds.top,
+        ...widthStyle,
+        maxWidth: bounds.right - bounds.left,
+        maxHeight: placement?.maxHeight ?? room,
+        ...(fillHeight ? {
+          height: Math.min(fillHeight, placement?.maxHeight ?? room)
+        } : null),
+        opacity: placement ? 1 : 0
+      },
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+        testID: "floating-panel-regular-surface",
+        ...knobProps.elevatedSurface,
+        flexShrink: 1,
+        minHeight: 0,
+        ...(fill ? {
+          flex: 1
+        } : void 0),
+        onAccessibilityEscape: onClose,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+          testID: "floating-panel-regular-clip",
+          borderRadius: knobProps.elevatedSurface.borderRadius,
+          overflow: "hidden",
+          flexShrink: 1,
+          minHeight: 0,
+          ...(fill ? {
+            flex: 1
+          } : void 0),
+          children: [echoRow, /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+            padding: framePadding,
+            gap: frameGap,
+            flexShrink: 1,
+            minHeight: 0,
+            ...(fill ? {
+              flex: 1
+            } : void 0),
+            children: [header, scrollable ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.ScrollView, {
+              testID: "floating-panel-regular-scroll",
+              style: fill ? {
+                flex: 1
+              } : {
+                flexGrow: 0,
+                flexShrink: 1
+              },
+              keyboardShouldPersistTaps: "handled",
+              ...scrollViewProps,
+              children
+            }) : children]
+          })]
+        })
+      })
+    })]
+  });
+}

package/dist/cjs/FloatingPanel/RegularPanel.native.js

@@ -0,0 +1,169 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var RegularPanel_exports = {};
+__export(RegularPanel_exports, {
+  RegularPanel: () => RegularPanel
+});
+module.exports = __toCommonJS(RegularPanel_exports);
+var import_jsx_runtime = require("react/jsx-runtime");
+var import_theme = require("@multiplatform.one/theme");
+var import_react = require("react");
+var import_react_native = require("react-native");
+var import_tamagui = require("tamagui");
+var import_t = require("../shared/t.native.js");
+var import_regularPlacement = require("./regularPlacement.native.js");
+function RegularPanel(param) {
+  var {
+    anchor,
+    bounds,
+    widthMode,
+    echo,
+    echoLabel,
+    header,
+    scrollable,
+    fill,
+    scrollViewProps,
+    framePadding,
+    frameGap,
+    onBackdropPress,
+    onClose,
+    children
+  } = param;
+  var _ref, _ref1, _ref2, _ref3, _ref4;
+  var {
+    knobProps
+  } = (0, import_theme.useResolvedKnobs)({
+    painted: false
+  });
+  var [size, setSize] = (0, import_react.useState)(null);
+  var room = Math.max(0, bounds.bottom - bounds.top);
+  var fillHeight = fill ? Math.min(import_regularPlacement.regularFillHeight, room) : void 0;
+  var placement = anchor && size ? (0, import_regularPlacement.placeRegularPanel)({
+    trigger: anchor,
+    width: size.width,
+    height: fillHeight !== null && fillHeight !== void 0 ? fillHeight : size.height,
+    bounds,
+    widthMode,
+    rtl: import_react_native.I18nManager.isRTL
+  }) : null;
+  var widthStyle = widthMode === "match-trigger" ? {
+    width: anchor === null || anchor === void 0 ? void 0 : anchor.width
+  } : widthMode === "at-least-trigger" ? {
+    minWidth: (_ref = anchor === null || anchor === void 0 ? void 0 : anchor.width) !== null && _ref !== void 0 ? _ref : 0
+  } : void 0;
+  var echoRow = echo != null && anchor && anchor.height > 0 ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Pressable, {
+    testID: "floating-panel-regular-echo",
+    onPress: onClose,
+    accessibilityRole: "button",
+    ...(echoLabel ? {
+      accessibilityLabel: echoLabel
+    } : void 0),
+    "aria-expanded": true,
+    style: {
+      height: anchor.height,
+      justifyContent: "center"
+    },
+    children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.View, {
+      pointerEvents: "none",
+      children: echo
+    })
+  }) : null;
+  return /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_react_native.View, {
+    style: import_react_native.StyleSheet.absoluteFill,
+    children: [/* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.Pressable, {
+      style: import_react_native.StyleSheet.absoluteFill,
+      onPress: onBackdropPress,
+      accessibilityRole: "button",
+      accessibilityLabel: (0, import_t.t)("Close")
+    }), /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.View, {
+      testID: "floating-panel-regular",
+      onLayout: function onLayout(e) {
+        if (size) return;
+        var {
+          width,
+          height
+        } = e.nativeEvent.layout;
+        if (width > 0 && height > 0) setSize({
+          width,
+          height
+        });
+      },
+      style: {
+        position: "absolute",
+        left: (_ref1 = placement === null || placement === void 0 ? void 0 : placement.left) !== null && _ref1 !== void 0 ? _ref1 : bounds.left,
+        top: (_ref2 = placement === null || placement === void 0 ? void 0 : placement.top) !== null && _ref2 !== void 0 ? _ref2 : bounds.top,
+        ...widthStyle,
+        maxWidth: bounds.right - bounds.left,
+        maxHeight: (_ref3 = placement === null || placement === void 0 ? void 0 : placement.maxHeight) !== null && _ref3 !== void 0 ? _ref3 : room,
+        ...(fillHeight ? {
+          height: Math.min(fillHeight, (_ref4 = placement === null || placement === void 0 ? void 0 : placement.maxHeight) !== null && _ref4 !== void 0 ? _ref4 : room)
+        } : null),
+        opacity: placement ? 1 : 0
+      },
+      children: /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_tamagui.YStack, {
+        testID: "floating-panel-regular-surface",
+        ...knobProps.elevatedSurface,
+        flexShrink: 1,
+        minHeight: 0,
+        ...(fill ? {
+          flex: 1
+        } : void 0),
+        onAccessibilityEscape: onClose,
+        children: /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+          testID: "floating-panel-regular-clip",
+          borderRadius: knobProps.elevatedSurface.borderRadius,
+          overflow: "hidden",
+          flexShrink: 1,
+          minHeight: 0,
+          ...(fill ? {
+            flex: 1
+          } : void 0),
+          children: [echoRow, /* @__PURE__ */(0, import_jsx_runtime.jsxs)(import_tamagui.YStack, {
+            padding: framePadding,
+            gap: frameGap,
+            flexShrink: 1,
+            minHeight: 0,
+            ...(fill ? {
+              flex: 1
+            } : void 0),
+            children: [header, scrollable ? /* @__PURE__ */(0, import_jsx_runtime.jsx)(import_react_native.ScrollView, {
+              testID: "floating-panel-regular-scroll",
+              style: fill ? {
+                flex: 1
+              } : {
+                flexGrow: 0,
+                flexShrink: 1
+              },
+              keyboardShouldPersistTaps: "handled",
+              ...scrollViewProps,
+              children
+            }) : children]
+          })]
+        })
+      })
+    })]
+  });
+}
+//# sourceMappingURL=RegularPanel.native.js.map

package/dist/cjs/FloatingPanel/RegularPanel.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","RegularPanel_exports","__export","RegularPanel","module","exports","import_jsx_runtime","require","import_theme","import_react","import_react_native","import_tamagui","import_t","import_regularPlacement","param","anchor","bounds","widthMode","echo","echoLabel","header","scrollable","fill","scrollViewProps","framePadding","frameGap","onBackdropPress","onClose","children","_ref","_ref1","_ref2","_ref3","_ref4","knobProps","useResolvedKnobs","painted","size","setSize","useState","room","Math","max","bottom","top","fillHeight","min","regularFillHeight","placement","placeRegularPanel","trigger","width","height","rtl","I18nManager","isRTL","widthStyle","minWidth","echoRow","jsx","Pressable","testID","onPress","accessibilityRole","accessibilityLabel","style","justifyContent","View","pointerEvents","jsxs","StyleSheet","absoluteFill","t","onLayout","e","nativeEvent","layout","position","left","maxWidth","right","maxHeight","opacity","YStack","elevatedSurface","flexShrink","minHeight","flex","onAccessibilityEscape","borderRadius","overflow","padding","gap","ScrollView","flexGrow","keyboardShouldPersistTaps"],"sources":["../../../src/FloatingPanel/RegularPanel.tsx"],"sourcesContent":[null],"mappings":"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","ignoreList":[]}

package/dist/cjs/FloatingPanel/compactFace.cjs

@@ -22,7 +22,9 @@ var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
 }), mod);
 var compactFace_exports = {};
 __export(compactFace_exports, {
+  MENU_MIN_WIDTH: () => MENU_MIN_WIDTH,
   SHORT_LIST_MAX: () => SHORT_LIST_MAX,
+  menuMinWidth: () => menuMinWidth,
   pickerCompactFace: () => pickerCompactFace,
   resolveCompactFace: () => resolveCompactFace
 });
@@ -35,4 +37,8 @@ function resolveCompactFace(face, insideOverlay) {
 const SHORT_LIST_MAX = 7;
 function pickerCompactFace(optionCount, searchable = false) {
   return !searchable && optionCount <= SHORT_LIST_MAX ? "menu" : "auto";
+}
+const MENU_MIN_WIDTH = 250;
+function menuMinWidth(triggerWidth, availableWidth) {
+  return Math.max(0, Math.min(Math.max(triggerWidth, MENU_MIN_WIDTH), availableWidth));
 }

package/dist/cjs/FloatingPanel/compactFace.native.js

@@ -24,7 +24,9 @@ var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
 }), mod);
 var compactFace_exports = {};
 __export(compactFace_exports, {
+  MENU_MIN_WIDTH: () => MENU_MIN_WIDTH,
   SHORT_LIST_MAX: () => SHORT_LIST_MAX,
+  menuMinWidth: () => menuMinWidth,
   pickerCompactFace: () => pickerCompactFace,
   resolveCompactFace: () => resolveCompactFace
 });
@@ -39,4 +41,8 @@ function pickerCompactFace(optionCount) {
   var searchable = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : false;
   return !searchable && optionCount <= SHORT_LIST_MAX ? "menu" : "auto";
 }
+var MENU_MIN_WIDTH = 250;
+function menuMinWidth(triggerWidth, availableWidth) {
+  return Math.max(0, Math.min(Math.max(triggerWidth, MENU_MIN_WIDTH), availableWidth));
+}
 //# sourceMappingURL=compactFace.native.js.map

package/dist/cjs/FloatingPanel/compactFace.native.js.map

@@ -1 +1 @@
-{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","compactFace_exports","__export","SHORT_LIST_MAX","pickerCompactFace","resolveCompactFace","module","exports","face","insideOverlay","optionCount","searchable","arguments","length"],"sources":["../../../src/FloatingPanel/compactFace.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,mBAAA;AAAAC,QAAA,CAAAD,mBAAA;EAAAE,cAAA,EAAAA,CAAA,KAAAA,cAAA;EAAAC,iBAAA,EAAAA,CAAA,KAAAA,iBAAA;EAAAC,kBAAA,EAAAA,CAAA,KAAAA;AAAA;AAWOC,MAAA,CAAAC,OAAS,GAAAX,YACd,CAAAK,mBAEkB;AAClB,SAAII,kBAAiBA,CAAAG,IAAO,EAAAC,aAAA;EAC5B,IAAID,IAAA,KAAS,QAAQ,OAAO;EAC5B,IAAAA,IAAO,oBAAAC,aAAA;EACT;AAGO;AAQA,IAAAN,cAAS;AACd,SAAOC,iBAAeA,CAAAM,WAAA,EAAe;EACvC,IAAAC,UAAA,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,iBAAAA,SAAA","ignoreList":[]}
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","compactFace_exports","__export","MENU_MIN_WIDTH","SHORT_LIST_MAX","menuMinWidth","pickerCompactFace","resolveCompactFace","module","exports","face","insideOverlay","optionCount","searchable","arguments","length","triggerWidth","availableWidth"],"sources":["../../../src/FloatingPanel/compactFace.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,mBAAA;AAAAC,QAAA,CAAAD,mBAAA;EAAAE,cAAA,EAAAA,CAAA,KAAAA,cAAA;EAAAC,cAAA,EAAAA,CAAA,KAAAA,cAAA;EAAAC,YAAA,EAAAA,CAAA,KAAAA,YAAA;EAAAC,iBAAA,EAAAA,CAAA,KAAAA,iBAAA;EAAAC,kBAAA,EAAAA,CAAA,KAAAA;AAAA;AAWOC,MAAA,CAAAC,OAAS,GAAAb,YACd,CAAAK,mBAEkB;AAClB,SAAIM,kBAAiBA,CAAAG,IAAO,EAAAC,aAAA;EAC5B,IAAID,IAAA,KAAS,QAAQ,OAAO;EAC5B,IAAAA,IAAO,oBAAAC,aAAA;EACT;AAGO;AAQA,IAAAP,cAAS;AACd,SAAOE,iBAAeA,CAAAM,WAAA,EAAe;EACvC,IAAAC,UAAA,GAAAC,SAAA,CAAAC,MAAA,QAAAD,SAAA,iBAAAA,SAAA;EAQO,OAAM,CAAAD,UAAA,IAAiBD,WAAA,IAAAR,cAAA;AAMvB;AACL,IAAAD,cAAgB,GAAG;AACrB,SAAAE,aAAAW,YAAA,EAAAC,cAAA","ignoreList":[]}

package/dist/cjs/FloatingPanel/containingBlock.cjs

@@ -0,0 +1,46 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var containingBlock_exports = {};
+__export(containingBlock_exports, {
+  fixedContainingBlockOrigin: () => fixedContainingBlockOrigin
+});
+module.exports = __toCommonJS(containingBlock_exports);
+function fixedContainingBlockOrigin(element) {
+  for (let node = element.parentElement; node; node = node.parentElement) {
+    const cs = getComputedStyle(node);
+    if (cs.display === "contents") continue;
+    const set = (value, initial) => !!value && value !== initial;
+    const captures = set(cs.transform, "none") || set(cs.perspective, "none") || set(cs.filter, "none") || set(cs.backdropFilter, "none") || set(cs.containerType, "normal") || /transform|perspective|filter/.test(cs.willChange) || /paint|layout|strict|content/.test(cs.contain);
+    if (captures) {
+      const rect = node.getBoundingClientRect();
+      return {
+        top: rect.top + node.clientTop - node.scrollTop,
+        left: rect.left + node.clientLeft - node.scrollLeft
+      };
+    }
+  }
+  return {
+    top: 0,
+    left: 0
+  };
+}

package/dist/cjs/FloatingPanel/containingBlock.native.js

@@ -0,0 +1,51 @@
+"use strict";
+
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all) __defProp(target, name, {
+    get: all[name],
+    enumerable: true
+  });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from)) if (!__hasOwnProp.call(to, key) && key !== except) __defProp(to, key, {
+      get: () => from[key],
+      enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable
+    });
+  }
+  return to;
+};
+var __toCommonJS = mod => __copyProps(__defProp({}, "__esModule", {
+  value: true
+}), mod);
+var containingBlock_exports = {};
+__export(containingBlock_exports, {
+  fixedContainingBlockOrigin: () => fixedContainingBlockOrigin
+});
+module.exports = __toCommonJS(containingBlock_exports);
+function fixedContainingBlockOrigin(element) {
+  for (var node = element.parentElement; node; node = node.parentElement) {
+    var cs = getComputedStyle(node);
+    if (cs.display === "contents") continue;
+    var set = function set2(value, initial) {
+      return !!value && value !== initial;
+    };
+    var captures = set(cs.transform, "none") || set(cs.perspective, "none") || set(cs.filter, "none") || set(cs.backdropFilter, "none") || set(cs.containerType, "normal") || /transform|perspective|filter/.test(cs.willChange) || /paint|layout|strict|content/.test(cs.contain);
+    if (captures) {
+      var rect = node.getBoundingClientRect();
+      return {
+        top: rect.top + node.clientTop - node.scrollTop,
+        left: rect.left + node.clientLeft - node.scrollLeft
+      };
+    }
+  }
+  return {
+    top: 0,
+    left: 0
+  };
+}
+//# sourceMappingURL=containingBlock.native.js.map

package/dist/cjs/FloatingPanel/containingBlock.native.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["__toCommonJS","mod","__copyProps","__defProp","value","containingBlock_exports","__export","fixedContainingBlockOrigin","module","exports","element","node","parentElement","cs","getComputedStyle","display","set","set2","initial","captures","transform","perspective","filter","backdropFilter","containerType","test","willChange","contain","rect","getBoundingClientRect","top","clientTop","scrollTop","left","clientLeft","scrollLeft"],"sources":["../../../src/FloatingPanel/containingBlock.ts"],"sourcesContent":[null],"mappings":";;;;;;;;;;;;;;;;;;;;;AAAA,IAAAA,YAAA,GAAAC,GAAA,IAAAC,WAAA,CAAAC,SAAA;EAAAC,KAAA;AAAA,IAAAH,GAAA;AAAA,IAAAI,uBAAA;AAAAC,QAAA,CAAAD,uBAAA;EAAAE,0BAAA,EAAAA,CAAA,KAAAA;AAAA;AASOC,MAAA,CAAAC,OAAS,GAAAT,YAAA,CAAAK,uBAAgF;AAC9F,SAAAE,0BAAwBA,CAAAG,OAAe;EACrC,SAAMC,IAAK,GAAAD,OAAA,CAAAE,aAAqB,EAAAD,IAAA,EAAAA,IAAA,GAAAA,IAAA,CAAAC,aAAA;IAChC,IAAIC,EAAA,GAAGC,gBAAY,CAAAH,IAAY;IAC/B,IAAAE,EAAM,CAAAE,OAAO,eAA2B;IACxC,IAAAC,GAAM,YACJC,IAAIA,CAAGb,KAAA,EAAAc,OAAW;MAOpB,OAAI,EAAAd,KAAU,IAAAA,KAAA,KAAAc,OAAA;IACZ;IACA,IAAAC,QAAO,GAAAH,GAAA,CAAAH,EAAA,CAAAO,SAAA,aAAAJ,GAAA,CAAAH,EAAA,CAAAQ,WAAA,aAAAL,GAAA,CAAAH,EAAA,CAAAS,MAAA,aAAAN,GAAA,CAAAH,EAAA,CAAAU,cAAA,aAAAP,GAAA,CAAAH,EAAA,CAAAW,aAAA,8CAAAC,IAAA,CAAAZ,EAAA,CAAAa,UAAA,mCAAAD,IAAA,CAAAZ,EAAA,CAAAc,OAAA;IAAA,IACLR,QAAK,EAAK;MAA4B,IACtCS,IAAM,GAAAjB,IAAK,CAAAkB,qBAAY,CAAa;MACtC;QACFC,GAAA,EAAAF,IAAA,CAAAE,GAAA,GAAAnB,IAAA,CAAAoB,SAAA,GAAApB,IAAA,CAAAqB,SAAA;QACFC,IAAA,EAAAL,IAAA,CAAAK,IAAA,GAAAtB,IAAA,CAAAuB,UAAA,GAAAvB,IAAA,CAAAwB;MACA;IACF","ignoreList":[]}

package/dist/cjs/FloatingPanel/index.cjs

@@ -49,6 +49,7 @@ var import_overlayStack = require("../shared/overlayStack.cjs");
 var import_compactFace = require("./compactFace.cjs");
 var import_nestedAction = require("./nestedAction.cjs");
 var import_PanelPortal = require("./PanelPortal.cjs");
+var import_containingBlock = require("./containingBlock.cjs");
 var import_pointAnchor = require("./pointAnchor.cjs");
 var import_nestedAction2 = require("./nestedAction.cjs");
 var import_useFloatingPanel2 = require("./useFloatingPanel.cjs");
@@ -93,25 +94,6 @@ function useKeyboardFocusIntoPanel(open, frameRef, keyboardOpenRef) {
     };
   }, [open, frameRef, keyboardOpenRef]);
 }
-function fixedContainingBlockOrigin(element) {
-  for (let node = element.parentElement; node; node = node.parentElement) {
-    const cs = getComputedStyle(node);
-    if (cs.display === "contents") continue;
-    const set = (value, initial) => !!value && value !== initial;
-    const captures = set(cs.transform, "none") || set(cs.perspective, "none") || set(cs.filter, "none") || set(cs.backdropFilter, "none") || set(cs.containerType, "normal") || /transform|perspective|filter/.test(cs.willChange) || /paint|layout|strict|content/.test(cs.contain);
-    if (captures) {
-      const rect = node.getBoundingClientRect();
-      return {
-        top: rect.top + node.clientTop - node.scrollTop,
-        left: rect.left + node.clientLeft - node.scrollLeft
-      };
-    }
-  }
-  return {
-    top: 0,
-    left: 0
-  };
-}
 function isRtl(element) {
   if (!import_tamagui.isWeb || typeof document === "undefined") return false;
   const direction = element ? getComputedStyle(element).direction : "";
@@ -473,7 +455,7 @@ function FloatingPanelWeb({
     const scrollContentHeight = dropdownElement.scrollHeight;
     const totalContentHeight = scrollContentHeight + totalBorderWidth;
     const liveTransition = panel.panelTransition;
-    const containingBlock = fixedContainingBlockOrigin(dropdownElement);
+    const containingBlock = (0, import_containingBlock.fixedContainingBlockOrigin)(dropdownElement);
     if (cover && !point) {
       const rtl = isRtl(trig);
       const viewport = window.visualViewport;