@seeqdev/qomponents 0.0.155-react-19-v7 → 0.0.155-react-19-v9

package/dist/index.esm.js

@@ -1,6 +1,6 @@
 import * as React from 'react';
-import React__default, { useLayoutEffect, useState, useRef, useEffect, useCallback, forwardRef, useContext, useMemo, createContext, Component, Fragment as Fragment$1, useId as useId$1, useInsertionEffect as useInsertionEffect$1, Children, isValidElement, createElement } from 'react';
-import { jsx as jsx$1, Fragment, jsxs } from 'react/jsx-runtime';
+import React__default, { useLayoutEffect, useState, useRef, useEffect, useCallback, forwardRef, useContext, useMemo, createContext, Component, Fragment, useId as useId$1, useInsertionEffect as useInsertionEffect$2, Children, isValidElement, createElement } from 'react';
+import { jsx as jsx$1, jsxs, Fragment as Fragment$1 } from 'react/jsx-runtime';
 import * as ReactDOM from 'react-dom';
 import ReactDOM__default, { createPortal } from 'react-dom';
 
@@ -191,7 +191,7 @@ function composeEventHandlers(originalEventHandler, ourEventHandler, { checkForD
   };
 }
 
-// packages/react/compose-refs/src/composeRefs.tsx
+// packages/react/compose-refs/src/compose-refs.tsx
 function setRef(ref, value) {
   if (typeof ref === "function") {
     return ref(value);
@@ -227,7 +227,7 @@ function useComposedRefs(...refs) {
   return React.useCallback(composeRefs(...refs), refs);
 }
 
-// packages/react/context/src/createContext.tsx
+// packages/react/context/src/create-context.tsx
 function createContext2(rootComponentName, defaultContext) {
   const Context = React.createContext(defaultContext);
   const Provider = (props) => {
@@ -302,44 +302,51 @@ function composeContextScopes(...scopes) {
   return createScope;
 }
 
-// packages/react/slot/src/slot.tsx
-var Slot = React.forwardRef((props, forwardedRef) => {
-  const { children, ...slotProps } = props;
-  const childrenArray = React.Children.toArray(children);
-  const slottable = childrenArray.find(isSlottable);
-  if (slottable) {
-    const newElement = slottable.props.children;
-    const newChildren = childrenArray.map((child) => {
-      if (child === slottable) {
-        if (React.Children.count(newElement) > 1) return React.Children.only(null);
-        return React.isValidElement(newElement) ? newElement.props.children : null;
-      } else {
-        return child;
+// src/slot.tsx
+// @__NO_SIDE_EFFECTS__
+function createSlot(ownerName) {
+  const SlotClone = /* @__PURE__ */ createSlotClone(ownerName);
+  const Slot2 = React.forwardRef((props, forwardedRef) => {
+    const { children, ...slotProps } = props;
+    const childrenArray = React.Children.toArray(children);
+    const slottable = childrenArray.find(isSlottable);
+    if (slottable) {
+      const newElement = slottable.props.children;
+      const newChildren = childrenArray.map((child) => {
+        if (child === slottable) {
+          if (React.Children.count(newElement) > 1) return React.Children.only(null);
+          return React.isValidElement(newElement) ? newElement.props.children : null;
+        } else {
+          return child;
+        }
+      });
+      return /* @__PURE__ */ jsx$1(SlotClone, { ...slotProps, ref: forwardedRef, children: React.isValidElement(newElement) ? React.cloneElement(newElement, void 0, newChildren) : null });
+    }
+    return /* @__PURE__ */ jsx$1(SlotClone, { ...slotProps, ref: forwardedRef, children });
+  });
+  Slot2.displayName = `${ownerName}.Slot`;
+  return Slot2;
+}
+// @__NO_SIDE_EFFECTS__
+function createSlotClone(ownerName) {
+  const SlotClone = React.forwardRef((props, forwardedRef) => {
+    const { children, ...slotProps } = props;
+    if (React.isValidElement(children)) {
+      const childrenRef = getElementRef$1(children);
+      const props2 = mergeProps(slotProps, children.props);
+      if (children.type !== React.Fragment) {
+        props2.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;
       }
-    });
-    return /* @__PURE__ */ jsx$1(SlotClone, { ...slotProps, ref: forwardedRef, children: React.isValidElement(newElement) ? React.cloneElement(newElement, void 0, newChildren) : null });
-  }
-  return /* @__PURE__ */ jsx$1(SlotClone, { ...slotProps, ref: forwardedRef, children });
-});
-Slot.displayName = "Slot";
-var SlotClone = React.forwardRef((props, forwardedRef) => {
-  const { children, ...slotProps } = props;
-  if (React.isValidElement(children)) {
-    const childrenRef = getElementRef$1(children);
-    const props2 = mergeProps(slotProps, children.props);
-    if (children.type !== React.Fragment) {
-      props2.ref = forwardedRef ? composeRefs(forwardedRef, childrenRef) : childrenRef;
-    }
-    return React.cloneElement(children, props2);
-  }
-  return React.Children.count(children) > 1 ? React.Children.only(null) : null;
-});
-SlotClone.displayName = "SlotClone";
-var Slottable = ({ children }) => {
-  return /* @__PURE__ */ jsx$1(Fragment, { children });
-};
+      return React.cloneElement(children, props2);
+    }
+    return React.Children.count(children) > 1 ? React.Children.only(null) : null;
+  });
+  SlotClone.displayName = `${ownerName}.SlotClone`;
+  return SlotClone;
+}
+var SLOTTABLE_IDENTIFIER = Symbol("radix.slottable");
 function isSlottable(child) {
-  return React.isValidElement(child) && child.type === Slottable;
+  return React.isValidElement(child) && typeof child.type === "function" && "__radixId" in child.type && child.type.__radixId === SLOTTABLE_IDENTIFIER;
 }
 function mergeProps(slotProps, childProps) {
   const overrideProps = { ...childProps };
@@ -350,8 +357,9 @@ function mergeProps(slotProps, childProps) {
     if (isHandler) {
       if (slotPropValue && childPropValue) {
         overrideProps[propName] = (...args) => {
-          childPropValue(...args);
+          const result = childPropValue(...args);
           slotPropValue(...args);
+          return result;
         };
       } else if (slotPropValue) {
         overrideProps[propName] = slotPropValue;
@@ -378,7 +386,7 @@ function getElementRef$1(element) {
   return element.props.ref || element.ref;
 }
 
-// packages/react/primitive/src/primitive.tsx
+// src/primitive.tsx
 var NODES = [
   "a",
   "button",
@@ -393,11 +401,13 @@ var NODES = [
   "nav",
   "ol",
   "p",
+  "select",
   "span",
   "svg",
   "ul"
 ];
 var Primitive = NODES.reduce((primitive, node) => {
+  const Slot = createSlot(`Primitive.${node}`);
   const Node = React.forwardRef((props, forwardedRef) => {
     const { asChild, ...primitiveProps } = props;
     const Comp = asChild ? Slot : node;
@@ -413,7 +423,7 @@ function dispatchDiscreteCustomEvent(target, event) {
   if (target) ReactDOM.flushSync(() => target.dispatchEvent(event));
 }
 
-// packages/react/use-callback-ref/src/useCallbackRef.tsx
+// packages/react/use-callback-ref/src/use-callback-ref.tsx
 function useCallbackRef$1(callback) {
   const callbackRef = React.useRef(callback);
   React.useEffect(() => {
@@ -422,7 +432,7 @@ function useCallbackRef$1(callback) {
   return React.useMemo(() => (...args) => callbackRef.current?.(...args), []);
 }
 
-// packages/react/use-escape-keydown/src/useEscapeKeydown.tsx
+// packages/react/use-escape-keydown/src/use-escape-keydown.tsx
 function useEscapeKeydown(onEscapeKeyDownProp, ownerDocument = globalThis?.document) {
   const onEscapeKeyDown = useCallbackRef$1(onEscapeKeyDownProp);
   React.useEffect(() => {
@@ -864,12 +874,12 @@ function removeLinks(items) {
   return items.filter((item) => item.tagName !== "A");
 }
 
-// packages/react/use-layout-effect/src/useLayoutEffect.tsx
-var useLayoutEffect2 = Boolean(globalThis?.document) ? React.useLayoutEffect : () => {
+// packages/react/use-layout-effect/src/use-layout-effect.tsx
+var useLayoutEffect2 = globalThis?.document ? React.useLayoutEffect : () => {
 };
 
 // packages/react/id/src/id.tsx
-var useReactId = React["useId".toString()] || (() => void 0);
+var useReactId = React[" useId ".trim().toString()] || (() => void 0);
 var count = 0;
 function useId(deterministicId) {
   const [id, setId] = React.useState(useReactId());
@@ -2857,7 +2867,7 @@ const arrow = (options, deps) => ({
   options: [options, deps]
 });
 
-// packages/react/arrow/src/arrow.tsx
+// src/arrow.tsx
 var NAME = "Arrow";
 var Arrow$1 = React.forwardRef((props, forwardedRef) => {
   const { children, width = 10, height = 5, ...arrowProps } = props;
@@ -2877,7 +2887,7 @@ var Arrow$1 = React.forwardRef((props, forwardedRef) => {
 Arrow$1.displayName = NAME;
 var Root$5 = Arrow$1;
 
-// packages/react/use-size/src/useSize.tsx
+// packages/react/use-size/src/use-size.tsx
 function useSize(element) {
   const [size, setSize] = React.useState(void 0);
   useLayoutEffect2(() => {
@@ -3195,7 +3205,7 @@ function useStateMachine(initialState, machine) {
   }, initialState);
 }
 
-// packages/react/presence/src/Presence.tsx
+// src/presence.tsx
 var Presence = (props) => {
   const { present, children } = props;
   const presence = usePresence$1(present);
@@ -3207,7 +3217,7 @@ var Presence = (props) => {
 Presence.displayName = "Presence";
 function usePresence$1(present) {
   const [node, setNode] = React.useState();
-  const stylesRef = React.useRef({});
+  const stylesRef = React.useRef(null);
   const prevPresentRef = React.useRef(present);
   const prevAnimationNameRef = React.useRef("none");
   const initialState = present ? "mounted" : "unmounted";
@@ -3291,7 +3301,7 @@ function usePresence$1(present) {
   return {
     isPresent: ["mounted", "unmountSuspended"].includes(state),
     ref: React.useCallback((node2) => {
-      if (node2) stylesRef.current = getComputedStyle(node2);
+      stylesRef.current = node2 ? getComputedStyle(node2) : null;
       setNode(node2);
     }, [])
   };
@@ -3313,28 +3323,47 @@ function getElementRef(element) {
   return element.props.ref || element.ref;
 }
 
-// packages/react/use-controllable-state/src/useControllableState.tsx
+// src/use-controllable-state.tsx
+var useInsertionEffect$1 = React[" useInsertionEffect ".trim().toString()] || useLayoutEffect2;
 function useControllableState({
   prop,
   defaultProp,
   onChange = () => {
-  }
+  },
+  caller
 }) {
-  const [uncontrolledProp, setUncontrolledProp] = useUncontrolledState({ defaultProp, onChange });
+  const [uncontrolledProp, setUncontrolledProp, onChangeRef] = useUncontrolledState({
+    defaultProp,
+    onChange
+  });
   const isControlled = prop !== void 0;
   const value = isControlled ? prop : uncontrolledProp;
-  const handleChange = useCallbackRef$1(onChange);
+  {
+    const isControlledRef = React.useRef(prop !== void 0);
+    React.useEffect(() => {
+      const wasControlled = isControlledRef.current;
+      if (wasControlled !== isControlled) {
+        const from = wasControlled ? "controlled" : "uncontrolled";
+        const to = isControlled ? "controlled" : "uncontrolled";
+        console.warn(
+          `${caller} is changing from ${from} to ${to}. Components should not switch from controlled to uncontrolled (or vice versa). Decide between using a controlled or uncontrolled value for the lifetime of the component.`
+        );
+      }
+      isControlledRef.current = isControlled;
+    }, [isControlled, caller]);
+  }
   const setValue = React.useCallback(
     (nextValue) => {
       if (isControlled) {
-        const setter = nextValue;
-        const value2 = typeof nextValue === "function" ? setter(prop) : nextValue;
-        if (value2 !== prop) handleChange(value2);
+        const value2 = isFunction(nextValue) ? nextValue(prop) : nextValue;
+        if (value2 !== prop) {
+          onChangeRef.current?.(value2);
+        }
       } else {
         setUncontrolledProp(nextValue);
       }
     },
-    [isControlled, prop, setUncontrolledProp, handleChange]
+    [isControlled, prop, setUncontrolledProp, onChangeRef]
   );
   return [value, setValue];
 }
@@ -3342,17 +3371,22 @@ function useUncontrolledState({
   defaultProp,
   onChange
 }) {
-  const uncontrolledState = React.useState(defaultProp);
-  const [value] = uncontrolledState;
+  const [value, setValue] = React.useState(defaultProp);
   const prevValueRef = React.useRef(value);
-  const handleChange = useCallbackRef$1(onChange);
+  const onChangeRef = React.useRef(onChange);
+  useInsertionEffect$1(() => {
+    onChangeRef.current = onChange;
+  }, [onChange]);
   React.useEffect(() => {
     if (prevValueRef.current !== value) {
-      handleChange(value);
+      onChangeRef.current?.(value);
       prevValueRef.current = value;
     }
-  }, [value, prevValueRef, handleChange]);
-  return uncontrolledState;
+  }, [value, prevValueRef]);
+  return [value, setValue, onChangeRef];
+}
+function isFunction(value) {
+  return typeof value === "function";
 }
 
 var getDefaultParent = function (originalTarget) {
@@ -4256,10 +4290,11 @@ var Popover = (props) => {
   const popperScope = usePopperScope$1(__scopePopover);
   const triggerRef = React.useRef(null);
   const [hasCustomAnchor, setHasCustomAnchor] = React.useState(false);
-  const [open = false, setOpen] = useControllableState({
+  const [open, setOpen] = useControllableState({
     prop: openProp,
-    defaultProp: defaultOpen,
-    onChange: onOpenChange
+    defaultProp: defaultOpen ?? false,
+    onChange: onOpenChange,
+    caller: POPOVER_NAME
   });
   return /* @__PURE__ */ jsx$1(Root2$4, { ...popperScope, children: /* @__PURE__ */ jsx$1(
     PopoverProvider,
@@ -4338,6 +4373,7 @@ var PopoverContent$1 = React.forwardRef(
   }
 );
 PopoverContent$1.displayName = CONTENT_NAME$6;
+var Slot$2 = createSlot("PopoverContent.RemoveScroll");
 var PopoverContentModal = React.forwardRef(
   (props, forwardedRef) => {
     const context = usePopoverContext(CONTENT_NAME$6, props.__scopePopover);
@@ -4348,7 +4384,7 @@ var PopoverContentModal = React.forwardRef(
       const content = contentRef.current;
       if (content) return hideOthers(content);
     }, []);
-    return /* @__PURE__ */ jsx$1(RemoveScroll, { as: Slot, allowPinchZoom: true, children: /* @__PURE__ */ jsx$1(
+    return /* @__PURE__ */ jsx$1(RemoveScroll, { as: Slot$2, allowPinchZoom: true, children: /* @__PURE__ */ jsx$1(
       PopoverContentImpl,
       {
         ...props,
@@ -4646,6 +4682,13 @@ const TextField = React__default.forwardRef((props, ref) => {
             ref.current = receivedRef;
         internalRef.current = receivedRef;
     };
+    useEffect(() => {
+        if (autoFocus) {
+            setTimeout(() => {
+                internalRef.current?.focus();
+            }, 0);
+        }
+    }, []);
     useEffect(() => {
         const input = internalRef.current;
         if (input && type !== 'number' && type !== 'email')
@@ -4685,7 +4728,7 @@ const TextField = React__default.forwardRef((props, ref) => {
     if (minLength)
         inputLenghtProp.minLength = minLength;
     return (React__default.createElement(React__default.Fragment, null,
-        React__default.createElement("input", { ref: setAllRefs, "data-testid": testId, name: name, id: id, type: type, value: value, className: appliedClasses, placeholder: placeholder, disabled: disabled, readOnly: readonly, autoComplete: autoComplete, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, step: step, required: required, autoFocus: autoFocus, min: min, max: max, ...inputLenghtProp, ...inputProp, ...tooltipData }),
+        React__default.createElement("input", { ref: setAllRefs, "data-testid": testId, name: name, id: id, type: type, value: value, className: appliedClasses, placeholder: placeholder, disabled: disabled, readOnly: readonly, autoComplete: autoComplete, onChange: handleChange, onFocus: onFocus, onBlur: onBlur, onKeyDown: onKeyDown, onKeyUp: onKeyUp, step: step, required: required, min: min, max: max, ...inputLenghtProp, ...inputProp, ...tooltipData }),
         errorText && showError && React__default.createElement("div", { className: "tw-text-sq-danger-color tw-text-xs tw-mt-1" }, errorText)));
 });
 
@@ -11224,7 +11267,7 @@ var LiveRegion = function LiveRegion(props) {
     }
     return guidanceMsg;
   }, [ariaLabel, focusedOption, focusedValue, isMulti, isOptionDisabled, isSearchable, menuIsOpen, messages, selectValue, tabSelectsValue, isInitialFocus]);
-  var ScreenReaderText = jsx(Fragment$1, null, jsx("span", {
+  var ScreenReaderText = jsx(Fragment, null, jsx("span", {
     id: "aria-selection"
   }, ariaSelected), jsx("span", {
     id: "aria-focused"
@@ -11233,7 +11276,7 @@ var LiveRegion = function LiveRegion(props) {
   }, ariaResults), jsx("span", {
     id: "aria-guidance"
   }, ariaGuidance));
-  return jsx(Fragment$1, null, jsx(A11yText$1, {
+  return jsx(Fragment, null, jsx(A11yText$1, {
     id: id
   }, isInitialFocus && ScreenReaderText), jsx(A11yText$1, {
     "aria-live": ariaLive,
@@ -11845,7 +11888,7 @@ function ScrollManager(_ref) {
     setScrollCaptureTarget(element);
     setScrollLockTarget(element);
   };
-  return jsx(Fragment$1, null, lockEnabled && jsx("div", {
+  return jsx(Fragment, null, lockEnabled && jsx("div", {
     onClick: blurSelectInput,
     css: _ref2$1
   }), children(targetRef));
@@ -13946,10 +13989,11 @@ var Dialog$1 = (props) => {
   } = props;
   const triggerRef = React.useRef(null);
   const contentRef = React.useRef(null);
-  const [open = false, setOpen] = useControllableState({
+  const [open, setOpen] = useControllableState({
     prop: openProp,
-    defaultProp: defaultOpen,
-    onChange: onOpenChange
+    defaultProp: defaultOpen ?? false,
+    onChange: onOpenChange,
+    caller: DIALOG_NAME
   });
   return /* @__PURE__ */ jsx$1(
     DialogProvider,
@@ -14011,6 +14055,7 @@ var DialogOverlay = React.forwardRef(
   }
 );
 DialogOverlay.displayName = OVERLAY_NAME;
+var Slot$1 = createSlot("DialogOverlay.RemoveScroll");
 var DialogOverlayImpl = React.forwardRef(
   (props, forwardedRef) => {
     const { __scopeDialog, ...overlayProps } = props;
@@ -14018,7 +14063,7 @@ var DialogOverlayImpl = React.forwardRef(
     return (
       // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`
       // ie. when `Overlay` and `Content` are siblings
-      /* @__PURE__ */ jsx$1(RemoveScroll, { as: Slot, allowPinchZoom: true, shards: [context.contentRef], children: /* @__PURE__ */ jsx$1(
+      /* @__PURE__ */ jsx$1(RemoveScroll, { as: Slot$1, allowPinchZoom: true, shards: [context.contentRef], children: /* @__PURE__ */ jsx$1(
         Primitive.div,
         {
           "data-state": getState$2(context.open),
@@ -14121,7 +14166,7 @@ var DialogContentImpl = React.forwardRef(
     const contentRef = React.useRef(null);
     const composedRefs = useComposedRefs(forwardedRef, contentRef);
     useFocusGuards();
-    return /* @__PURE__ */ jsxs(Fragment, { children: [
+    return /* @__PURE__ */ jsxs(Fragment$1, { children: [
       /* @__PURE__ */ jsx$1(
         FocusScope,
         {
@@ -14145,7 +14190,7 @@ var DialogContentImpl = React.forwardRef(
           )
         }
       ),
-      /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsxs(Fragment$1, { children: [
         /* @__PURE__ */ jsx$1(TitleWarning, { titleId: context.titleId }),
         /* @__PURE__ */ jsx$1(DescriptionWarning, { contentRef, descriptionId: context.descriptionId })
       ] })
@@ -14405,17 +14450,19 @@ function createCollection(name) {
   };
   CollectionProvider.displayName = PROVIDER_NAME;
   const COLLECTION_SLOT_NAME = name + "CollectionSlot";
+  const CollectionSlotImpl = createSlot(COLLECTION_SLOT_NAME);
   const CollectionSlot = React__default.forwardRef(
     (props, forwardedRef) => {
       const { scope, children } = props;
       const context = useCollectionContext(COLLECTION_SLOT_NAME, scope);
       const composedRefs = useComposedRefs(forwardedRef, context.collectionRef);
-      return /* @__PURE__ */ jsx$1(Slot, { ref: composedRefs, children });
+      return /* @__PURE__ */ jsx$1(CollectionSlotImpl, { ref: composedRefs, children });
     }
   );
   CollectionSlot.displayName = COLLECTION_SLOT_NAME;
   const ITEM_SLOT_NAME = name + "CollectionItemSlot";
   const ITEM_DATA_ATTR = "data-radix-collection-item";
+  const CollectionItemSlotImpl = createSlot(ITEM_SLOT_NAME);
   const CollectionItemSlot = React__default.forwardRef(
     (props, forwardedRef) => {
       const { scope, children, ...itemData } = props;
@@ -14426,7 +14473,7 @@ function createCollection(name) {
         context.itemMap.set(ref, { ref, ...itemData });
         return () => void context.itemMap.delete(ref);
       });
-      return /* @__PURE__ */ jsx$1(Slot, { ...{ [ITEM_DATA_ATTR]: "" }, ref: composedRefs, children });
+      return /* @__PURE__ */ jsx$1(CollectionItemSlotImpl, { ...{ [ITEM_DATA_ATTR]: "" }, ref: composedRefs, children });
     }
   );
   CollectionItemSlot.displayName = ITEM_SLOT_NAME;
@@ -14451,7 +14498,7 @@ function createCollection(name) {
   ];
 }
 
-// packages/react/direction/src/Direction.tsx
+// packages/react/direction/src/direction.tsx
 var DirectionContext = React.createContext(void 0);
 function useDirection(localDir) {
   const globalDir = React.useContext(DirectionContext);
@@ -14489,10 +14536,11 @@ var RovingFocusGroupImpl = React.forwardRef((props, forwardedRef) => {
   const ref = React.useRef(null);
   const composedRefs = useComposedRefs(forwardedRef, ref);
   const direction = useDirection(dir);
-  const [currentTabStopId = null, setCurrentTabStopId] = useControllableState({
+  const [currentTabStopId, setCurrentTabStopId] = useControllableState({
     prop: currentTabStopIdProp,
-    defaultProp: defaultCurrentTabStopId,
-    onChange: onCurrentTabStopIdChange
+    defaultProp: defaultCurrentTabStopId ?? null,
+    onChange: onCurrentTabStopIdChange,
+    caller: GROUP_NAME$2
   });
   const [isTabbingBackOut, setIsTabbingBackOut] = React.useState(false);
   const handleEntryFocus = useCallbackRef$1(onEntryFocus);
@@ -14570,6 +14618,7 @@ var RovingFocusGroupItem = React.forwardRef(
       focusable = true,
       active = false,
       tabStopId,
+      children,
       ...itemProps
     } = props;
     const autoId = useId();
@@ -14577,7 +14626,7 @@ var RovingFocusGroupItem = React.forwardRef(
     const context = useRovingFocusContext(ITEM_NAME$3, __scopeRovingFocusGroup);
     const isCurrentTabStop = context.currentTabStopId === id;
     const getItems = useCollection$3(__scopeRovingFocusGroup);
-    const { onFocusableItemAdd, onFocusableItemRemove } = context;
+    const { onFocusableItemAdd, onFocusableItemRemove, currentTabStopId } = context;
     React.useEffect(() => {
       if (focusable) {
         onFocusableItemAdd();
@@ -14623,7 +14672,8 @@ var RovingFocusGroupItem = React.forwardRef(
                 }
                 setTimeout(() => focusFirst$1(candidateNodes));
               }
-            })
+            }),
+            children: typeof children === "function" ? children({ isCurrentTabStop, hasTabStop: currentTabStopId != null }) : children
           }
         )
       }
@@ -14687,7 +14737,8 @@ var Tabs$1 = React.forwardRef(
     const [value, setValue] = useControllableState({
       prop: valueProp,
       onChange: onValueChange,
-      defaultProp: defaultValue
+      defaultProp: defaultValue ?? "",
+      caller: TABS_NAME
     });
     return /* @__PURE__ */ jsx$1(
       TabsProvider,
@@ -14870,10 +14921,11 @@ var Collapsible = React.forwardRef(
       onOpenChange,
       ...collapsibleProps
     } = props;
-    const [open = false, setOpen] = useControllableState({
+    const [open, setOpen] = useControllableState({
       prop: openProp,
-      defaultProp: defaultOpen,
-      onChange: onOpenChange
+      defaultProp: defaultOpen ?? false,
+      onChange: onOpenChange,
+      caller: COLLAPSIBLE_NAME
     });
     return /* @__PURE__ */ jsx$1(
       CollapsibleProvider,
@@ -15023,14 +15075,15 @@ var AccordionImplSingle = React__default.forwardRef(
     } = props;
     const [value, setValue] = useControllableState({
       prop: valueProp,
-      defaultProp: defaultValue,
-      onChange: onValueChange
+      defaultProp: defaultValue ?? "",
+      onChange: onValueChange,
+      caller: ACCORDION_NAME
     });
     return /* @__PURE__ */ jsx$1(
       AccordionValueProvider,
       {
         scope: props.__scopeAccordion,
-        value: value ? [value] : [],
+        value: React__default.useMemo(() => value ? [value] : [], [value]),
         onItemOpen: setValue,
         onItemClose: React__default.useCallback(() => collapsible && setValue(""), [collapsible, setValue]),
         children: /* @__PURE__ */ jsx$1(AccordionCollapsibleProvider, { scope: props.__scopeAccordion, collapsible, children: /* @__PURE__ */ jsx$1(AccordionImpl, { ...accordionSingleProps, ref: forwardedRef }) })
@@ -15046,10 +15099,11 @@ var AccordionImplMultiple = React__default.forwardRef((props, forwardedRef) => {
     },
     ...accordionMultipleProps
   } = props;
-  const [value = [], setValue] = useControllableState({
+  const [value, setValue] = useControllableState({
     prop: valueProp,
-    defaultProp: defaultValue,
-    onChange: onValueChange
+    defaultProp: defaultValue ?? [],
+    onChange: onValueChange,
+    caller: ACCORDION_NAME
   });
   const handleItemOpen = React__default.useCallback(
     (itemValue) => setValue((prevValue = []) => [...prevValue, itemValue]),
@@ -15479,6 +15533,7 @@ var MenuRootContentNonModal = React.forwardRef((props, forwardedRef) => {
     }
   );
 });
+var Slot = createSlot("MenuContent.ScrollLock");
 var MenuContentImpl = React.forwardRef(
   (props, forwardedRef) => {
     const {
@@ -16116,10 +16171,12 @@ function isPointInPolygon(point, polygon) {
   const { x, y } = point;
   let inside = false;
   for (let i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
-    const xi = polygon[i].x;
-    const yi = polygon[i].y;
-    const xj = polygon[j].x;
-    const yj = polygon[j].y;
+    const ii = polygon[i];
+    const jj = polygon[j];
+    const xi = ii.x;
+    const yi = ii.y;
+    const xj = jj.x;
+    const yj = jj.y;
     const intersect = yi > y !== yj > y && x < (xj - xi) * (y - yi) / (yj - yi) + xi;
     if (intersect) inside = !inside;
   }
@@ -16169,10 +16226,11 @@ var DropdownMenu = (props) => {
   } = props;
   const menuScope = useMenuScope(__scopeDropdownMenu);
   const triggerRef = React.useRef(null);
-  const [open = false, setOpen] = useControllableState({
+  const [open, setOpen] = useControllableState({
     prop: openProp,
-    defaultProp: defaultOpen,
-    onChange: onOpenChange
+    defaultProp: defaultOpen ?? false,
+    onChange: onOpenChange,
+    caller: DROPDOWN_MENU_NAME
   });
   return /* @__PURE__ */ jsx$1(
     DropdownMenuProvider,
@@ -16349,10 +16407,11 @@ DropdownMenuArrow.displayName = ARROW_NAME;
 var DropdownMenuSub = (props) => {
   const { __scopeDropdownMenu, children, open: openProp, onOpenChange, defaultOpen } = props;
   const menuScope = useMenuScope(__scopeDropdownMenu);
-  const [open = false, setOpen] = useControllableState({
+  const [open, setOpen] = useControllableState({
     prop: openProp,
-    defaultProp: defaultOpen,
-    onChange: onOpenChange
+    defaultProp: defaultOpen ?? false,
+    onChange: onOpenChange,
+    caller: "DropdownMenuSub"
   });
   return /* @__PURE__ */ jsx$1(Sub, { ...menuScope, open, onOpenChange: setOpen, children });
 };
@@ -20427,7 +20486,7 @@ function PopChild({ children, isPresent, anchorX }) {
      * styles directly on the DOM node, we might be overwriting
      * styles set via the style prop.
      */
-    useInsertionEffect$1(() => {
+    useInsertionEffect$2(() => {
         const { width, height, top, left, right } = size.current;
         if (isPresent || !ref.current || !width || !height)
             return;
@@ -20687,7 +20746,7 @@ const AnimatePresence = ({ children, custom, initial = true, onExitComplete, pre
      * all components have finished animating out.
      */
     const { forceRender } = useContext(LayoutGroupContext);
-    return (jsx$1(Fragment, { children: renderedChildren.map((child) => {
+    return (jsx$1(Fragment$1, { children: renderedChildren.map((child) => {
             const key = getChildKey(child);
             const isPresent = propagate && !isParentPresent
                 ? false
@@ -21048,7 +21107,7 @@ function useVisualElement(Component, visualState, props, createVisualElement, Pr
         createProjectionNode$1(visualElementRef.current, props, ProjectionNodeConstructor, initialLayoutGroupConfig);
     }
     const isMounted = useRef(false);
-    useInsertionEffect$1(() => {
+    useInsertionEffect$2(() => {
         /**
          * Check the component has already mounted before calling
          * `update` unnecessarily. This ensures we skip the initial update.
@@ -21579,7 +21638,7 @@ function createUseRender(forwardMotionProps = false) {
             : useHTMLProps;
         const visualProps = useVisualProps(props, latestValues, isStatic, Component);
         const filteredProps = filterProps(props, typeof Component === "string", forwardMotionProps);
-        const elementProps = Component !== Fragment$1
+        const elementProps = Component !== Fragment
             ? { ...filteredProps, ...visualProps, ref }
             : {};
         /**
@@ -26745,7 +26804,7 @@ const createDomVisualElement = (Component, options) => {
     return isSVGComponent(Component)
         ? new SVGVisualElement(options)
         : new HTMLVisualElement(options, {
-            allowProjection: Component !== Fragment$1,
+            allowProjection: Component !== Fragment,
         });
 };
 
@@ -26775,7 +26834,7 @@ function clamp(value, [min, max]) {
   return Math.min(max, Math.max(min, value));
 }
 
-// packages/react/use-previous/src/usePrevious.tsx
+// packages/react/use-previous/src/use-previous.tsx
 function usePrevious(value) {
   const ref = React.useRef({ value, previous: value });
   return React.useMemo(() => {
@@ -27221,7 +27280,7 @@ var SliderThumbImpl = React.forwardRef(
             }
           ) }),
           isFormControl && /* @__PURE__ */ jsx$1(
-            BubbleInput,
+            SliderBubbleInput,
             {
               name: name ?? (context.name ? context.name + (context.values.length > 1 ? "[]" : "") : void 0),
               form: context.form,
@@ -27235,23 +27294,36 @@ var SliderThumbImpl = React.forwardRef(
   }
 );
 SliderThumb.displayName = THUMB_NAME;
-var BubbleInput = (props) => {
-  const { value, ...inputProps } = props;
-  const ref = React.useRef(null);
-  const prevValue = usePrevious(value);
-  React.useEffect(() => {
-    const input = ref.current;
-    const inputProto = window.HTMLInputElement.prototype;
-    const descriptor = Object.getOwnPropertyDescriptor(inputProto, "value");
-    const setValue = descriptor.set;
-    if (prevValue !== value && setValue) {
-      const event = new Event("input", { bubbles: true });
-      setValue.call(input, value);
-      input.dispatchEvent(event);
-    }
-  }, [prevValue, value]);
-  return /* @__PURE__ */ jsx$1("input", { style: { display: "none" }, ...inputProps, ref, defaultValue: value });
-};
+var BUBBLE_INPUT_NAME = "RadioBubbleInput";
+var SliderBubbleInput = React.forwardRef(
+  ({ __scopeSlider, value, ...props }, forwardedRef) => {
+    const ref = React.useRef(null);
+    const composedRefs = useComposedRefs(ref, forwardedRef);
+    const prevValue = usePrevious(value);
+    React.useEffect(() => {
+      const input = ref.current;
+      if (!input) return;
+      const inputProto = window.HTMLInputElement.prototype;
+      const descriptor = Object.getOwnPropertyDescriptor(inputProto, "value");
+      const setValue = descriptor.set;
+      if (prevValue !== value && setValue) {
+        const event = new Event("input", { bubbles: true });
+        setValue.call(input, value);
+        input.dispatchEvent(event);
+      }
+    }, [prevValue, value]);
+    return /* @__PURE__ */ jsx$1(
+      Primitive.input,
+      {
+        style: { display: "none" },
+        ...props,
+        ref: composedRefs,
+        defaultValue: value
+      }
+    );
+  }
+);
+SliderBubbleInput.displayName = BUBBLE_INPUT_NAME;
 function getNextSortedValues(prevValues = [], nextValue, atIndex) {
   const nextValues = [...prevValues];
   nextValues[atIndex] = nextValue;