@strapi/ui-primitives 2.0.0-beta.3 → 2.0.0-beta.5

package/dist/index.mjs

@@ -3,8 +3,7 @@ import * as React from "react";
 import { useComposedRefs } from "@radix-ui/react-compose-refs";
 import { createContextScope, createContext } from "@radix-ui/react-context";
 import { Slot } from "@radix-ui/react-slot";
-import { composeEventHandlers } from "@radix-ui/primitive";
-import { composeEventHandlers as composeEventHandlers2 } from "@radix-ui/primitive";
+import { composeEventHandlers as composeEventHandlers$1 } from "@radix-ui/primitive";
 import { DismissableLayer } from "@radix-ui/react-dismissable-layer";
 import { useFocusGuards } from "@radix-ui/react-focus-guards";
 import { FocusScope } from "@radix-ui/react-focus-scope";
@@ -23,8 +22,6 @@ import { createCollection as createCollection$1 } from "@radix-ui/react-collecti
 import { useDirection } from "@radix-ui/react-direction";
 import { usePrevious } from "@radix-ui/react-use-previous";
 import { VisuallyHidden } from "@radix-ui/react-visually-hidden";
-import { useCallbackRef } from "@radix-ui/react-use-callback-ref";
-import { useCallbackRef as useCallbackRef2 } from "@radix-ui/react-use-callback-ref";
 function createCollection(name) {
   const PROVIDER_NAME = `${name}CollectionProvider`;
   const [createCollectionContext, createCollectionScope2] = createContextScope(PROVIDER_NAME);
@@ -319,10 +316,10 @@ const ComboboxTrigger = React.forwardRef((props, forwardedRef) => {
           ref: forwardedRef,
           "data-disabled": context.disabled ? "" : void 0,
           ...triggerProps,
-          onClick: composeEventHandlers(triggerProps.onClick, () => {
+          onClick: composeEventHandlers$1(triggerProps.onClick, () => {
             context.trigger?.focus();
           }),
-          onPointerDown: composeEventHandlers(triggerProps.onPointerDown, (event) => {
+          onPointerDown: composeEventHandlers$1(triggerProps.onPointerDown, (event) => {
             const target = event.target;
             if (target.hasPointerCapture(event.pointerId)) {
               target.releasePointerCapture(event.pointerId);
@@ -388,7 +385,7 @@ const ComboxboxTextInput = React.forwardRef((props, forwardedRef) => {
       value: context.textValue ?? "",
       ...props,
       ref: composedRefs,
-      onKeyDown: composeEventHandlers(props.onKeyDown, (event) => {
+      onKeyDown: composeEventHandlers$1(props.onKeyDown, (event) => {
         if (["ArrowUp", "ArrowDown", "Home", "End"].includes(event.key)) {
           if (!context.open) {
             handleOpen();
@@ -459,13 +456,13 @@ const ComboxboxTextInput = React.forwardRef((props, forwardedRef) => {
           context.onVisuallyFocussedItemChange(null);
         }
       }),
-      onChange: composeEventHandlers(props.onChange, (event) => {
+      onChange: composeEventHandlers$1(props.onChange, (event) => {
         context.onTextValueChange(event.currentTarget.value);
         if (context.autocomplete.type === "both") {
           context.onFilterValueChange(event.currentTarget.value);
         }
       }),
-      onKeyUp: composeEventHandlers(props.onKeyUp, (event) => {
+      onKeyUp: composeEventHandlers$1(props.onKeyUp, (event) => {
         if (!context.open && (context.isPrintableCharacter(event.key) || ["Backspace"].includes(event.key))) {
           handleOpen();
         }
@@ -487,7 +484,7 @@ const ComboxboxTextInput = React.forwardRef((props, forwardedRef) => {
           }
         }
       }),
-      onBlur: composeEventHandlers(props.onBlur, () => {
+      onBlur: composeEventHandlers$1(props.onBlur, () => {
         if (context.open) {
           return;
         }
@@ -547,16 +544,16 @@ const ComboboxIcon = React.forwardRef((props, forwardedRef) => {
       ...iconProps,
       tabIndex: -1,
       ref: forwardedRef,
-      onClick: composeEventHandlers(iconProps.onClick, () => {
+      onClick: composeEventHandlers$1(iconProps.onClick, () => {
         context.trigger?.focus();
       }),
-      onPointerDown: composeEventHandlers(iconProps.onPointerDown, (event) => {
+      onPointerDown: composeEventHandlers$1(iconProps.onPointerDown, (event) => {
         if (event.button === 0 && event.ctrlKey === false) {
           handleOpen();
           event.preventDefault();
         }
       }),
-      onKeyDown: composeEventHandlers(iconProps.onKeyDown, (event) => {
+      onKeyDown: composeEventHandlers$1(iconProps.onKeyDown, (event) => {
         if (OPEN_KEYS$1.includes(event.key)) {
           handleOpen();
           event.preventDefault();
@@ -825,7 +822,7 @@ const ComboboxItemImpl = React.forwardRef((props, forwardedRef) => {
       ...restProps,
       id,
       ref: composedRefs,
-      onPointerUp: composeEventHandlers(restProps.onPointerUp, handleSelect)
+      onPointerUp: composeEventHandlers$1(restProps.onPointerUp, handleSelect)
     }
   );
 });
@@ -932,7 +929,7 @@ const ComboboxCreateItem = React.forwardRef((props, ref) => {
           ...restProps,
           id,
           ref: composedRefs,
-          onPointerUp: composeEventHandlers(restProps.onPointerUp, handleSelect)
+          onPointerUp: composeEventHandlers$1(restProps.onPointerUp, handleSelect)
         }
       )
     }
@@ -976,6 +973,13 @@ const Combobox$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.definePr
   Trigger: Trigger$1,
   Viewport: Viewport$1
 }, Symbol.toStringTag, { value: "Module" }));
+function useCallbackRef(callback) {
+  const callbackRef = React.useRef(callback);
+  React.useEffect(() => {
+    callbackRef.current = callback;
+  });
+  return React.useMemo(() => (...args) => callbackRef.current?.(...args), []);
+}
 const OPEN_KEYS = [" ", "Enter", "ArrowUp", "ArrowDown"];
 const SELECTION_KEYS = [" ", "Enter"];
 const SELECT_NAME = "Select";
@@ -1109,10 +1113,10 @@ const SelectTrigger = React.forwardRef(
         tabIndex: isDisabled ? void 0 : 0,
         ...triggerProps,
         ref: composedRefs,
-        onClick: composeEventHandlers(triggerProps.onClick, (event) => {
+        onClick: composeEventHandlers$1(triggerProps.onClick, (event) => {
           event.currentTarget.focus();
         }),
-        onPointerDown: composeEventHandlers(triggerProps.onPointerDown, (event) => {
+        onPointerDown: composeEventHandlers$1(triggerProps.onPointerDown, (event) => {
           const target = event.target;
           if (target.hasPointerCapture(event.pointerId)) {
             target.releasePointerCapture(event.pointerId);
@@ -1130,7 +1134,7 @@ const SelectTrigger = React.forwardRef(
             event.preventDefault();
           }
         }),
-        onKeyDown: composeEventHandlers(triggerProps.onKeyDown, (event) => {
+        onKeyDown: composeEventHandlers$1(triggerProps.onKeyDown, (event) => {
           const isTypingAhead = searchRef.current !== "";
           const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
           const target = event.target;
@@ -1408,7 +1412,7 @@ const SelectContentImpl = React.forwardRef(
             onMountAutoFocus: (event) => {
               event.preventDefault();
             },
-            onUnmountAutoFocus: composeEventHandlers(onCloseAutoFocus, (event) => {
+            onUnmountAutoFocus: composeEventHandlers$1(onCloseAutoFocus, (event) => {
               context.trigger?.focus({ preventScroll: true });
               document.getSelection()?.empty();
               event.preventDefault();
@@ -1443,7 +1447,7 @@ const SelectContentImpl = React.forwardRef(
                       outline: "none",
                       ...contentProps.style
                     },
-                    onKeyDown: composeEventHandlers(contentProps.onKeyDown, (event) => {
+                    onKeyDown: composeEventHandlers$1(contentProps.onKeyDown, (event) => {
                       const isModifierKey = event.ctrlKey || event.altKey || event.metaKey;
                       if (event.key === "Tab")
                         event.preventDefault();
@@ -1699,7 +1703,7 @@ const SelectViewport = React.forwardRef(
             overflow: "auto",
             ...viewportProps.style
           },
-          onScroll: composeEventHandlers(viewportProps.onScroll, (event) => {
+          onScroll: composeEventHandlers$1(viewportProps.onScroll, (event) => {
             const viewport = event.currentTarget;
             const { contentWrapper, shouldExpandOnScrollRef } = viewportContext;
             if (shouldExpandOnScrollRef?.current && contentWrapper) {
@@ -1807,22 +1811,22 @@ const SelectItem = React.forwardRef(
             tabIndex: disabled ? void 0 : -1,
             ...itemProps,
             ref: composedRefs,
-            onFocus: composeEventHandlers(itemProps.onFocus, () => setIsFocused(true)),
-            onBlur: composeEventHandlers(itemProps.onBlur, () => setIsFocused(false)),
-            onPointerUp: composeEventHandlers(itemProps.onPointerUp, handleSelect),
-            onPointerMove: composeEventHandlers(itemProps.onPointerMove, (event) => {
+            onFocus: composeEventHandlers$1(itemProps.onFocus, () => setIsFocused(true)),
+            onBlur: composeEventHandlers$1(itemProps.onBlur, () => setIsFocused(false)),
+            onPointerUp: composeEventHandlers$1(itemProps.onPointerUp, handleSelect),
+            onPointerMove: composeEventHandlers$1(itemProps.onPointerMove, (event) => {
               if (disabled) {
                 contentContext.onItemLeave?.();
               } else {
                 event.currentTarget.focus({ preventScroll: true });
               }
             }),
-            onPointerLeave: composeEventHandlers(itemProps.onPointerLeave, (event) => {
+            onPointerLeave: composeEventHandlers$1(itemProps.onPointerLeave, (event) => {
               if (event.currentTarget === document.activeElement) {
                 contentContext.onItemLeave?.();
               }
             }),
-            onKeyDown: composeEventHandlers(itemProps.onKeyDown, (event) => {
+            onKeyDown: composeEventHandlers$1(itemProps.onKeyDown, (event) => {
               const isTypingAhead = contentContext.searchRef?.current !== "";
               if (isTypingAhead && event.key === " ")
                 return;
@@ -1990,13 +1994,13 @@ const SelectScrollButtonImpl = React.forwardRef(
         ...scrollIndicatorProps,
         ref: forwardedRef,
         style: { flexShrink: 0, ...scrollIndicatorProps.style },
-        onPointerMove: composeEventHandlers(scrollIndicatorProps.onPointerMove, () => {
+        onPointerMove: composeEventHandlers$1(scrollIndicatorProps.onPointerMove, () => {
           contentContext.onItemLeave?.();
           if (autoScrollTimerRef.current === null) {
             autoScrollTimerRef.current = window.setInterval(onAutoScroll, 50);
           }
         }),
-        onPointerLeave: composeEventHandlers(scrollIndicatorProps.onPointerLeave, () => {
+        onPointerLeave: composeEventHandlers$1(scrollIndicatorProps.onPointerLeave, () => {
           clearAutoScrollTimer();
         })
       }
@@ -2160,13 +2164,22 @@ const Select$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProp
   Viewport,
   createSelectScope
 }, Symbol.toStringTag, { value: "Module" }));
+function composeEventHandlers(originalEventHandler, ourEventHandler, { checkForDefaultPrevented = true } = {}) {
+  return function handleEvent(event) {
+    originalEventHandler?.(event);
+    if (checkForDefaultPrevented === false || !event.defaultPrevented) {
+      return ourEventHandler?.(event);
+    }
+  };
+}
 export {
   Combobox$1 as Combobox,
   Select$1 as Select,
-  composeEventHandlers2 as composeEventHandlers,
+  composeEventHandlers,
   createCollection,
-  useCallbackRef2 as useCallbackRef,
+  useCallbackRef,
   useCollator,
-  useFilter
+  useFilter,
+  usePrev
 };
 //# sourceMappingURL=index.mjs.map