npm - @hexdspace/react - Versions diffs - 0.1.40 → 0.1.42 - Mend

@hexdspace/react 0.1.40 → 0.1.42

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3) hide show

package/dist/index.d.ts CHANGED Viewed

@@ -474,6 +474,7 @@ interface DialogOptions {
     modal: boolean;
     dismissible: boolean;
     zIndex: number;
+    resolveOnEnter?: boolean;
 }
 interface DialogInstance {
     id: string;
@@ -713,6 +714,15 @@ interface ShortcutBinding {
     group?: string;
 }
+interface ListedShortcut {
+    registrationId: string;
+    scopeId: string;
+    combos: string[];
+    description: string;
+    group?: string;
+}
+type GroupedShortcuts = Record<string, ListedShortcut[]>;
 interface ShortcutRegistration {
     id: string;
     scopeId: string;
@@ -747,15 +757,6 @@ interface DisableScope {
     disableScope(id: string): void;
 }
-interface ListedShortcut {
-    registrationId: string;
-    scopeId: string;
-    combos: string[];
-    description: string;
-    group?: string;
-}
-type GroupedShortcuts = Record<string, ListedShortcut[]>;
 interface ListShortcuts {
     listShortcutsByScope(): GroupedShortcuts;
 }
@@ -841,6 +842,7 @@ declare class KeyboardController {
     handleUnregisterShortcut(id: string): void;
     handleListShortcutsByScope(): GroupedShortcuts;
 }
+declare const keyboardController: KeyboardController;
 declare const KeyboardProvider: React__default.FC<{
     children: React__default.ReactNode;
@@ -976,12 +978,13 @@ interface DialogProps<TPayload = unknown> extends Omit<React.HTMLAttributes<HTML
     onDismiss?: () => void;
     onResolve?: (result?: unknown) => void;
     onOpenChange?: (open: boolean) => void;
+    resolveOnEnter?: boolean;
     showClose?: boolean;
     closeLabel?: string;
     open?: boolean;
     defaultOpen?: boolean;
 }
-declare function Dialog<TPayload>({ id, template, payload, trigger, modal, dismissible, zIndex, maxWidthPx, onDismiss, onResolve, onOpenChange, showClose, closeLabel, open, defaultOpen, chrome, className, style, ...props }: DialogProps<TPayload>): react_jsx_runtime.JSX.Element;
+declare function Dialog<TPayload>({ id, template, payload, trigger, modal, dismissible, zIndex, maxWidthPx, onDismiss, onResolve, onOpenChange, resolveOnEnter, showClose, closeLabel, open, defaultOpen, chrome, className, style, onKeyDown, ...props }: DialogProps<TPayload>): react_jsx_runtime.JSX.Element;
 type ControlLikeProps = {
     id?: string;
@@ -1089,6 +1092,7 @@ type DropdownMenuContentProps = Omit<React.ComponentPropsWithoutRef<typeof Dropd
     className?: string;
     style?: React.CSSProperties;
     ref?: React.Ref<HTMLDivElement>;
+    onEntryFocus?: (event: Event) => void;
 };
 declare const dropdownMenuItemVariants: (props?: ({
     inset?: boolean | null | undefined;
@@ -1100,7 +1104,6 @@ interface DropdownMenuProps extends VariantProps<typeof dropdownMenuContentVaria
     children: React.ReactNode;
     open?: boolean;
     defaultOpen?: boolean;
-    keepMounted?: boolean;
     onOpenChange?: (open: boolean) => void;
     hoverOpen?: boolean;
     hoverCloseDelayMs?: number;
@@ -1117,7 +1120,7 @@ interface DropdownMenuProps extends VariantProps<typeof dropdownMenuContentVaria
     style?: React.CSSProperties;
     contentProps?: DropdownMenuContentProps;
 }
-declare function DropdownMenu({ trigger, children, open, defaultOpen, keepMounted, onOpenChange, hoverOpen, hoverCloseDelayMs, modal, side, align, sideOffset, alignOffset, collisionPadding, portalContainer, ariaLabel, ariaLabelledBy, chrome, orientation, className, style, contentProps, }: DropdownMenuProps): react_jsx_runtime.JSX.Element;
+declare function DropdownMenu({ trigger, children, open, defaultOpen, onOpenChange, hoverOpen, hoverCloseDelayMs, modal, side, align, sideOffset, alignOffset, collisionPadding, portalContainer, ariaLabel, ariaLabelledBy, chrome, orientation, className, style, contentProps, }: DropdownMenuProps): react_jsx_runtime.JSX.Element;
 interface DropdownMenuItemProps extends React.ComponentPropsWithoutRef<typeof DropdownMenu$1.Item>, Omit<VariantProps<typeof dropdownMenuItemVariants>, 'orientation'> {
 }
 declare const DropdownMenuItem: React.ForwardRefExoticComponent<DropdownMenuItemProps & React.RefAttributes<HTMLDivElement>>;
@@ -1130,4 +1133,4 @@ interface KbdProps extends React.HTMLAttributes<HTMLSpanElement>, VariantProps<t
 }
 declare const Kbd: React.ForwardRefExoticComponent<KbdProps & React.RefAttributes<HTMLSpanElement>>;
-export { AuthController, AuthControllerCtx, type AuthControllerDeps, AuthControllerProvider, AuthDispatchCtx, AuthProvider, type AuthState, AuthStateCtx, Button, type ButtonProps, type CacheInstruction, type ClearSelectionArgs, type ClearTarget, type CombineMode, ConfirmDialog, type ConfirmDialogProps, type ConfirmPayload, type CursorFallback, CustomDialog, type CustomDialogPayload, type CustomDialogProps, type CustomInstruction, DEFAULT_NOTIFICATION_CHANNEL, type DefaultDialogPayloads, type DefaultDialogTemplateKey, DefaultDialogTemplateKeys, Dialog, DialogContent, DialogController, DialogHost, type DialogInstance, type DialogOptions, type DialogProps, type DialogTemplate, type DisableScope, DisableScopeUseCase, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, DropdownMenuSeparator, type EnableScope, EnableScopeUseCase, type ErrorResponse, Field, type FieldProps, type GenericResponse, type HandleSelection, type HttpClient, HttpError, type HttpMethod, type HttpResponse, InMemorySelectionStore, InfoDialog, type InfoDialogProps, type InfoPayload, Input, type InputProps, type Instruction, type InstructionContext, type ItemId, Kbd, type KbdProps, KeyboardProvider, type ListShortcuts, ListShortcutsUseCase, MockAuthHttpClient, MockHttpClient, type Mode, type MutationFn, type Notification, type NotificationAction, NotificationHost, type NotificationInstruction, type NotificationVariant, NotifierController, type OnSuccessFn, type OptimisticSnapshot, type OptimisticUpdateFn, Popover, type PopoverProps, type QuerySelection, RedirectIfAuthed, type RedirectIfAuthedProps, type RegionId, type RegionKey, type RegionSelection, type RegisterRegionArgs, type RegisterShortcut, RegisterShortcutUseCase, type RequestConfig, RequireAuth, type RequireAuthProps, type ResolvedToastTheme, type ResponsiveMutation, type ScopeId, ScopeManager, type ScopeState, SelectionController, type SelectionControllerDeps, SelectionControllerProvider, type SelectionState, type SelectionStore, type ShortcutBinding, type ShortcutHandler, type ShortcutRegistration, type ShortcutScope, Skeleton, type SkeletonProps, Textarea, type TextareaProps, type ToastActionTheme, type ToastTheme, type ToastTransition, type ToastifyCSSVars, Tooltip, type UIFail, type UIOk, type UIResult, type UnregisterShortcut, UnregisterShortcutUseCase, type UseVimRegionArgs, type UseVimRegionResult, type User, VimController, type VimControllerDeps, VimControllerProvider, type VimDirection, type VimInterDirection, type VimKeyState, type VimPending, type VimRegionMeta, VimRegionRegistry, authController, controllerFactory, createAuthController, createSelectionController, createVimController, dialogController, httpClient as fetchHttpClient, getDialogTemplate, notifierController, registerDefaultDialogs, registerDialogTemplate, resolveToastTheme, ui, unregisterDialogTemplate, useAuth, useAuthActions, useAuthController, useAuthDispatch, useAuthedUser, useDialog, useKeyboardController, useResponsiveMutation, useSelectionController, useShortcut, useShortcutScope, useVimBindings, useVimController, useVimRegion };
+export { AuthController, AuthControllerCtx, type AuthControllerDeps, AuthControllerProvider, AuthDispatchCtx, AuthProvider, type AuthState, AuthStateCtx, Button, type ButtonProps, type CacheInstruction, type ClearSelectionArgs, type ClearTarget, type CombineMode, ConfirmDialog, type ConfirmDialogProps, type ConfirmPayload, type CursorFallback, CustomDialog, type CustomDialogPayload, type CustomDialogProps, type CustomInstruction, DEFAULT_NOTIFICATION_CHANNEL, type DefaultDialogPayloads, type DefaultDialogTemplateKey, DefaultDialogTemplateKeys, Dialog, DialogContent, DialogController, DialogHost, type DialogInstance, type DialogOptions, type DialogProps, type DialogTemplate, type DisableScope, DisableScopeUseCase, DropdownMenu, DropdownMenuItem, type DropdownMenuItemProps, type DropdownMenuProps, DropdownMenuSeparator, type EnableScope, EnableScopeUseCase, type ErrorResponse, Field, type FieldProps, type GenericResponse, type GroupedShortcuts, type HandleSelection, type HttpClient, HttpError, type HttpMethod, type HttpResponse, InMemorySelectionStore, InfoDialog, type InfoDialogProps, type InfoPayload, Input, type InputProps, type Instruction, type InstructionContext, type ItemId, Kbd, type KbdProps, KeyboardController, KeyboardProvider, type ListShortcuts, ListShortcutsUseCase, type ListedShortcut, MockAuthHttpClient, MockHttpClient, type Mode, type MutationFn, type Notification, type NotificationAction, NotificationHost, type NotificationInstruction, type NotificationVariant, NotifierController, type OnSuccessFn, type OptimisticSnapshot, type OptimisticUpdateFn, Popover, type PopoverProps, type QuerySelection, RedirectIfAuthed, type RedirectIfAuthedProps, type RegionId, type RegionKey, type RegionSelection, type RegisterRegionArgs, type RegisterShortcut, RegisterShortcutUseCase, type RequestConfig, RequireAuth, type RequireAuthProps, type ResolvedToastTheme, type ResponsiveMutation, type ScopeId, ScopeManager, type ScopeState, SelectionController, type SelectionControllerDeps, SelectionControllerProvider, type SelectionState, type SelectionStore, type ShortcutBinding, type ShortcutHandler, type ShortcutRegistration, type ShortcutScope, Skeleton, type SkeletonProps, Textarea, type TextareaProps, type ToastActionTheme, type ToastTheme, type ToastTransition, type ToastifyCSSVars, Tooltip, type UIFail, type UIOk, type UIResult, type UnregisterShortcut, UnregisterShortcutUseCase, type UseVimRegionArgs, type UseVimRegionResult, type User, VimController, type VimControllerDeps, VimControllerProvider, type VimDirection, type VimInterDirection, type VimKeyState, type VimPending, type VimRegionMeta, VimRegionRegistry, authController, controllerFactory, createAuthController, createSelectionController, createVimController, dialogController, httpClient as fetchHttpClient, getDialogTemplate, keyboardController, notifierController, registerDefaultDialogs, registerDialogTemplate, resolveToastTheme, ui, unregisterDialogTemplate, useAuth, useAuthActions, useAuthController, useAuthDispatch, useAuthedUser, useDialog, useKeyboardController, useResponsiveMutation, useSelectionController, useShortcut, useShortcutScope, useVimBindings, useVimController, useVimRegion };

package/dist/index.js CHANGED Viewed

@@ -1686,6 +1686,7 @@ function Dialog({
   onDismiss,
   onResolve,
   onOpenChange,
+  resolveOnEnter = true,
   showClose = true,
   closeLabel = "Close dialog",
   open: open2,
@@ -1693,6 +1694,7 @@ function Dialog({
   chrome,
   className,
   style,
+  onKeyDown,
   ...props
 }) {
   const fallbackId = React3.useId();
@@ -1734,6 +1736,39 @@ function Dialog({
   const overlayClassName = cn(dialogOverlayClass);
   const surfaceClassName = cn(dialogSurfaceVariants({ chrome }));
   const panelRef = React3.useRef(null);
+  const handleKeyDown = React3.useCallback(
+    (event) => {
+      onKeyDown?.(event);
+      if (event.defaultPrevented || !resolveOnEnter) return;
+      const isComposing = "isComposing" in event.nativeEvent ? event.nativeEvent.isComposing : false;
+      if (event.key !== "Enter" || isComposing || event.altKey || event.ctrlKey || event.metaKey) return;
+      if (event.shiftKey) return;
+      const target = event.target;
+      if (target) {
+        if (target.isContentEditable) return;
+        const tagName = target.tagName;
+        if (tagName === "TEXTAREA" || tagName === "SELECT") return;
+        if (target instanceof HTMLInputElement) {
+          const inputType = target.type;
+          if (!["button", "submit", "reset", "checkbox", "radio"].includes(inputType)) return;
+        }
+      }
+      const defaultAction = panelRef.current?.querySelector("[data-dialog-default]");
+      if (defaultAction) {
+        const isDisabled = defaultAction instanceof HTMLButtonElement && defaultAction.disabled || defaultAction.getAttribute("aria-disabled") === "true";
+        if (!isDisabled) {
+          event.preventDefault();
+          defaultAction.click();
+        }
+        return;
+      }
+      if (onResolve) {
+        event.preventDefault();
+        handleResolve(payload);
+      }
+    },
+    [handleResolve, onKeyDown, onResolve, payload, resolveOnEnter]
+  );
   return /* @__PURE__ */ jsxs3(DialogPrimitive.Root, { open: open2, defaultOpen, onOpenChange: handleOpenChange, modal, children: [
     trigger ? /* @__PURE__ */ jsx7(DialogPrimitive.Trigger, { asChild: true, children: trigger }) : null,
     /* @__PURE__ */ jsx7(DialogPrimitive.Portal, { forceMount: true, children: /* @__PURE__ */ jsx7(AnimatePresence, { children: isOpen ? /* @__PURE__ */ jsxs3(Fragment2, { children: [
@@ -1776,6 +1811,7 @@ function Dialog({
               panelRef.current?.focus();
             });
           },
+          onKeyDown: handleKeyDown,
           ...props,
           children: /* @__PURE__ */ jsx7(
             motion.div,
@@ -1864,7 +1900,15 @@ var ConfirmDialog = (props) => {
     p.message ? /* @__PURE__ */ jsx8(DialogPrimitive2.Description, { className: "mt-2 text-sm opacity-80", children: p.message }) : null,
     /* @__PURE__ */ jsxs4("div", { className: "mt-5 flex items-center justify-end gap-4", children: [
       /* @__PURE__ */ jsx8(DialogPrimitive2.Close, { asChild: true, children: /* @__PURE__ */ jsx8(Button, { variant: "secondary", children: p.cancelText ?? "Cancel" }) }),
-      /* @__PURE__ */ jsx8(DialogPrimitive2.Close, { asChild: true, children: /* @__PURE__ */ jsx8(Button, { variant: confirmVariant, onClick: () => props.onResolve?.({ confirmed: true }), children: p.confirmText ?? "Confirm" }) })
+      /* @__PURE__ */ jsx8(DialogPrimitive2.Close, { asChild: true, children: /* @__PURE__ */ jsx8(
+        Button,
+        {
+          variant: confirmVariant,
+          "data-dialog-default": true,
+          onClick: () => props.onResolve?.({ confirmed: true }),
+          children: p.confirmText ?? "Confirm"
+        }
+      ) })
     ] })
   ] });
 };
@@ -1948,7 +1992,7 @@ var OpenDialogUseCase = class {
   }
   async execute(cmd) {
     const id = uuid();
-    const options = cmd.options ?? getDefaultOptions();
+    const options = { ...getDefaultOptions(), ...cmd.options };
     if (!options.zIndex) {
       options.zIndex = 2e3;
     }
@@ -1967,7 +2011,8 @@ function getDefaultOptions() {
   return {
     modal: true,
     dismissible: true,
-    zIndex: 2500
+    zIndex: 2500,
+    resolveOnEnter: true
   };
 }
@@ -2120,6 +2165,7 @@ var DialogHost = () => {
         payload: dialog.payload,
         modal: dialog.options.modal,
         dismissible: dialog.options.dismissible,
+        resolveOnEnter: dialog.options.resolveOnEnter,
         zIndex: dialog.options.zIndex + index,
         open: !isClosing,
         onResolve: (result) => scheduleClose(dialog.id, "resolve", result),
@@ -4531,7 +4577,6 @@ function DropdownMenu({
   children,
   open: open2,
   defaultOpen,
-  keepMounted = false,
   onOpenChange,
   hoverOpen = false,
   hoverCloseDelayMs = 50,
@@ -4637,15 +4682,7 @@ function DropdownMenu({
   );
   const onPointerDownOutside = (event) => {
     restContentProps.onPointerDownOutside?.(event);
-    if (keepMounted) {
-      const target = event.target;
-      const isTriggerEvent = target instanceof Node && triggerRef.current?.contains(target);
-      if (!resolvedOpen || isTriggerEvent) {
-        event.preventDefault();
-      }
-    }
   };
-  const keepMountedClassName = keepMounted && !resolvedOpen ? "pointer-events-none" : void 0;
   const initialMotionState = {
     opacity: 0,
     scale: 0.98,
@@ -4658,22 +4695,12 @@ function DropdownMenu({
     x: 0,
     y: 0
   };
-  const closedMotionState = {
-    opacity: 0,
-    scale: 0.98,
-    x: "var(--menu-x)",
-    y: "var(--menu-y)"
-  };
-  const motionEase = keepMounted ? resolvedOpen ? "easeOut" : "easeIn" : "easeOut";
   const onInteractOutside = (event) => {
     restContentProps.onInteractOutside?.(event);
-    if (keepMounted) {
-      const target = event.target;
-      const isTriggerEvent = target instanceof Node && triggerRef.current?.contains(target);
-      if (!resolvedOpen || isTriggerEvent) {
-        event.preventDefault();
-      }
-    }
+  };
+  const onEntryFocus = (event) => {
+    restContentProps.onEntryFocus?.(event);
+    event.preventDefault();
   };
   const resolvedContentProps = hoverOpen ? {
     ...restContentProps,
@@ -4692,11 +4719,14 @@ function DropdownMenu({
       closeTimer.clear();
     },
     onPointerDownOutside,
+    onEntryFocus,
     onInteractOutside
   } : {
     ...restContentProps,
     onKeyDown: handleContentKeyDown,
-    ...keepMounted ? { onPointerDownOutside, onInteractOutside } : void 0
+    onEntryFocus,
+    onPointerDownOutside,
+    onInteractOutside
   };
   const contentNode = /* @__PURE__ */ jsx22(
     DropdownMenuPrimitive.Content,
@@ -4714,17 +4744,15 @@ function DropdownMenu({
       children: /* @__PURE__ */ jsx22(
         motion4.div,
         {
-          "aria-hidden": keepMounted ? !resolvedOpen : void 0,
           className: cn(
             dropdownMenuContentVariants({ chrome, orientation }),
-            keepMountedClassName,
             className,
             contentClassName
           ),
           ref: composedContentRef,
           initial: initialMotionState,
-          animate: keepMounted ? resolvedOpen ? openMotionState : closedMotionState : openMotionState,
-          exit: keepMounted ? void 0 : {
+          animate: openMotionState,
+          exit: {
             opacity: 0,
             scale: 0.98,
             x: "var(--menu-x)",
@@ -4733,7 +4761,7 @@ function DropdownMenu({
           },
           transition: {
             duration: motionDuration,
-            ease: motionEase
+            ease: "easeOut"
           },
           style: { ...style, ...contentStyle },
           children
@@ -4743,7 +4771,7 @@ function DropdownMenu({
   );
   return /* @__PURE__ */ jsx22(DropdownMenuOrientationContext.Provider, { value: resolvedItemsOrientation, children: /* @__PURE__ */ jsxs11(DropdownMenuPrimitive.Root, { open: resolvedOpen, onOpenChange: handleOpenChange, modal, children: [
     /* @__PURE__ */ jsx22(DropdownMenuPrimitive.Trigger, { asChild: true, children: resolvedTrigger }),
-    /* @__PURE__ */ jsx22(DropdownMenuPrimitive.Portal, { forceMount: true, container: portalContainer, children: keepMounted ? contentNode : /* @__PURE__ */ jsx22(AnimatePresence4, { children: resolvedOpen ? contentNode : null }) })
+    /* @__PURE__ */ jsx22(DropdownMenuPrimitive.Portal, { forceMount: true, container: portalContainer, children: /* @__PURE__ */ jsx22(AnimatePresence4, { children: resolvedOpen ? contentNode : null }) })
   ] }) });
 }
 var DropdownMenuItem = React13.forwardRef(
@@ -4821,6 +4849,7 @@ export {
   InfoDialog,
   Input,
   Kbd,
+  KeyboardController,
   KeyboardProvider,
   ListShortcutsUseCase,
   MockAuthHttpClient,
@@ -4849,6 +4878,7 @@ export {
   dialogController,
   httpClient as fetchHttpClient,
   getDialogTemplate,
+  keyboardController,
   notifierController,
   registerDefaultDialogs,
   registerDialogTemplate,

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@hexdspace/react",
-  "version": "0.1.40",
+  "version": "0.1.42",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",