@bigtablet/design-system 3.19.2 → 3.19.4

package/dist/index.js

@@ -333,11 +333,14 @@ function useAnchoredPosition({
     maxWidth: 0,
     maxHeight: 0,
     ready: false,
-    anchorWidth: 0
+    anchorWidth: 0,
+    anchorHidden: false
   });
   useSafeLayoutEffect(() => {
     if (!open) {
-      setState((prev) => prev.ready ? { ...prev, ready: false } : prev);
+      setState(
+        (prev) => prev.ready || prev.anchorHidden ? { ...prev, ready: false, anchorHidden: false } : prev
+      );
       return;
     }
     const anchor = anchorRef.current;
@@ -352,10 +355,12 @@ function useAnchoredPosition({
         { width: window.innerWidth, height: window.innerHeight },
         { placement, align, gap, padding }
       );
+      const anchorHidden = a.width > 0 && a.height > 0 && (a.bottom <= 0 || a.top >= window.innerHeight || a.right <= 0 || a.left >= window.innerWidth);
       setState({
         ...result,
         ready: true,
-        anchorWidth: Math.min(a.width, result.maxWidth)
+        anchorWidth: Math.min(a.width, result.maxWidth),
+        anchorHidden
       });
     };
     let frame = 0;
@@ -685,6 +690,12 @@ function useListboxPopup({
     gap: LIST_GAP,
     padding: LIST_PADDING
   });
+  useEffect(() => {
+    if (!isOpen || !anchored.ready || !anchored.anchorHidden) return;
+    const focusInPanel = !!panelRef.current?.contains(document.activeElement);
+    setIsOpen(false);
+    if (focusInPanel && returnFocusOnClose) triggerRef.current?.focus({ preventScroll: true });
+  }, [isOpen, anchored.ready, anchored.anchorHidden, returnFocusOnClose]);
   return {
     isOpen,
     setIsOpen,
@@ -1280,6 +1291,14 @@ var Menu = ({ items, trigger, align = "start" }) => {
     gap: MENU_GAP,
     padding: 8
   });
+  React11.useEffect(() => {
+    if (!open || !pos.ready || !pos.anchorHidden) return;
+    const focusInMenu = !!menuRef.current?.contains(document.activeElement);
+    setOpen(false);
+    if (focusInMenu) {
+      wrapperRef.current?.querySelector("[aria-haspopup]")?.focus({ preventScroll: true });
+    }
+  }, [open, pos.ready, pos.anchorHidden]);
   const style = useSpringPresence({
     visible: open,
     from: pos.placement === "top" ? `translateY(${MENU_GAP}px)` : `translateY(-${MENU_GAP}px)`
@@ -2101,6 +2120,9 @@ var Tooltip = ({
     gap: TOOLTIP_GAP,
     padding: 8
   });
+  React11.useEffect(() => {
+    if (open && pos.ready && pos.anchorHidden) hideNow();
+  }, [open, pos.ready, pos.anchorHidden, hideNow]);
   const fromTransform = (() => {
     switch (pos.placement) {
       case "top":
@@ -2883,6 +2905,7 @@ var FieldContext = createContext(void 0);
 function useFieldControl() {
   return useContext(FieldContext);
 }
+var FieldControlBoundary = ({ children }) => /* @__PURE__ */ jsx(FieldContext.Provider, { value: void 0, children });
 var Field = ({
   name,
   label,
@@ -4812,7 +4835,7 @@ var DatePicker = ({
   return /* @__PURE__ */ jsxs("div", { className: rootClassName, style: containerStyle, children: [
     label && /* @__PURE__ */ jsx("span", { className: "date_picker_label", id: groupId, children: label }),
     constraintDesc && /* @__PURE__ */ jsx("span", { id: constraintId, className: "date_picker_sr_only", children: constraintDesc }),
-    /* @__PURE__ */ jsxs(
+    /* @__PURE__ */ jsx(
       "div",
       {
         className: "date_picker_fields",
@@ -4820,7 +4843,7 @@ var DatePicker = ({
         "aria-labelledby": field?.labelId ?? (label ? groupId : void 0),
         "aria-describedby": [field?.describedBy, constraintDesc ? constraintId : void 0].filter(Boolean).join(" ") || void 0,
         "aria-invalid": field?.invalid || void 0,
-        children: [
+        children: /* @__PURE__ */ jsxs(FieldControlBoundary, { children: [
           /* @__PURE__ */ jsx(
             Dropdown,
             {
@@ -4860,7 +4883,7 @@ var DatePicker = ({
               disabled: disabled || !month
             }
           )
-        ]
+        ] })
       }
     )
   ] });
@@ -4897,7 +4920,7 @@ var DateRangePicker = ({
         date_range_picker_full_width: fullWidth,
         date_range_picker_disabled: disabled
       }),
-      children: /* @__PURE__ */ jsxs(
+      children: /* @__PURE__ */ jsx(
         "div",
         {
           className: "date_range_picker_fields",
@@ -4905,7 +4928,7 @@ var DateRangePicker = ({
           "aria-labelledby": field?.labelId,
           "aria-describedby": field?.describedBy,
           "aria-invalid": field?.invalid || void 0,
-          children: [
+          children: /* @__PURE__ */ jsxs(FieldControlBoundary, { children: [
             /* @__PURE__ */ jsx(
               DatePicker,
               {
@@ -4934,7 +4957,7 @@ var DateRangePicker = ({
                 fullWidth: true
               }
             )
-          ]
+          ] })
         }
       )
     }
@@ -6006,7 +6029,7 @@ var TimePicker = ({
       children: [
         label && /* @__PURE__ */ jsx("span", { className: "time_picker_label", id: groupId, children: label }),
         constraint && /* @__PURE__ */ jsx("span", { id: constraintId, className: "time_picker_sr_only", children: constraint }),
-        /* @__PURE__ */ jsxs(
+        /* @__PURE__ */ jsx(
           "div",
           {
             className: "time_picker_fields",
@@ -6014,7 +6037,7 @@ var TimePicker = ({
             "aria-labelledby": field?.labelId ?? (label ? groupId : void 0),
             "aria-describedby": [field?.describedBy, constraint ? constraintId : void 0].filter(Boolean).join(" ") || void 0,
             "aria-invalid": field?.invalid || void 0,
-            children: [
+            children: /* @__PURE__ */ jsxs(FieldControlBoundary, { children: [
               /* @__PURE__ */ jsx(
                 Dropdown,
                 {
@@ -6041,7 +6064,7 @@ var TimePicker = ({
                   disabled: disabled || hour === null
                 }
               )
-            ]
+            ] })
           }
         )
       ]

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@bigtablet/design-system",
-	"version": "3.19.2",
+	"version": "3.19.4",
 	"description": "Bigtablet Design System UI Components",
 	"type": "module",
 	"types": "dist/index.d.ts",
@@ -125,17 +125,18 @@
 	"size-limit": [
 		{
 			"path": "dist/index.js",
-			"limit": "60 kB",
-			"message": "Raised 50 kB -> 60 kB on 2026-08-05: baseline was 49.34 kB, leaving 0.66 kB (1.3%) under the old 50 kB limit. The current limit leaves 10.66 kB. Re-measure before raising again."
+			"limit": "70 kB",
+			"message": "Raised 60 kB -> 70 kB on 2026-09-10: baseline was 59.82 kB on develop (59.91 kB with PR #625), leaving 0.09-0.18 kB (0.3%) under the old 60 kB limit. Of that baseline, 18.48 kB is @react-spring/web (a runtime dependency, so size-limit bundles it) and 40.55 kB is this package - measure `dist/index.js` alone before blaming the dependency. The current limit leaves 10.09 kB. Re-measure before raising again."
 		},
 		{
 			"path": "dist/vanilla/bigtablet.min.js",
-			"limit": "7 kB",
-			"message": "Raised 5 kB -> 7 kB on 2026-08-06: Dropdown multiple/searchable pushed the baseline from 4.13 kB to 5.6 kB, 0.6 kB over the old limit. The current limit leaves 1.4 kB. Re-measure before raising again."
+			"limit": "8 kB",
+			"message": "Raised 7 kB -> 8 kB on 2026-09-10: baseline was 6.83 kB, leaving 0.17 kB (2.4%) under the old 7 kB limit. The current limit leaves 1.17 kB. Re-measure before raising again."
 		},
 		{
 			"path": "dist/index.css",
-			"limit": "130 kB"
+			"limit": "18 kB",
+			"message": "Lowered 130 kB -> 18 kB on 2026-09-10: baseline is 14.56 kB brotlied, so the old limit sat 9x above reality and could never fire. The current limit leaves 3.44 kB. Raise it with a measurement, not to make a build pass."
 		}
 	],
 	"dependencies": {