@sesionario/blocks 1.41.0-rc.4 → 1.41.0-rc.6

package/dist/index.cjs

@@ -5247,6 +5247,24 @@ function Command({
     }
   );
 }
+function useCommandDialogScrollLock(open) {
+  React2__namespace.useEffect(() => {
+    if (!open) return;
+    const onTouchMove = (event) => {
+      const target = event.target;
+      if (!(target instanceof Element)) {
+        event.preventDefault();
+        return;
+      }
+      if (target.closest('[data-slot="command-list"]')) return;
+      event.preventDefault();
+    };
+    document.addEventListener("touchmove", onTouchMove, { passive: false });
+    return () => {
+      document.removeEventListener("touchmove", onTouchMove);
+    };
+  }, [open]);
+}
 function CommandDialog({
   title = "Command Palette",
   description = "Search for a command to run...",
@@ -5256,8 +5274,9 @@ function CommandDialog({
   commandProps,
   ...props
 }) {
-  const { height: viewportHeight, keyboardInset } = useVisualViewportMetrics();
-  const mobileMaxHeight = viewportHeight > 0 ? Math.max(240, viewportHeight - Math.max(keyboardInset, 16) - 16) : void 0;
+  const { height: viewportHeight } = useVisualViewportMetrics();
+  useCommandDialogScrollLock(props.open);
+  const mobileMaxHeight = viewportHeight > 0 ? Math.max(280, viewportHeight - 16) : void 0;
   return /* @__PURE__ */ jsxRuntime.jsxs(Dialog, { ...props, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(DialogHeader, { className: "sr-only", children: [
       /* @__PURE__ */ jsxRuntime.jsx(DialogTitle, { children: title }),
@@ -5267,10 +5286,11 @@ function CommandDialog({
       DialogContent,
       {
         className: cn(
-          "overflow-hidden p-0",
-          // iOS: keep the palette in the visual viewport above the keyboard
-          // instead of vertically centering into the obscured half.
-          "max-sm:top-[max(0.75rem,env(safe-area-inset-top))] max-sm:translate-y-0 max-sm:max-h-[var(--command-dialog-max-height,calc(100dvh-1.5rem))]",
+          "flex flex-col gap-0 overflow-hidden p-0",
+          // iOS: top-pin in the visual viewport, near full-bleed width,
+          // fill available height so the list (not the page) scrolls.
+          "max-sm:top-[max(0.5rem,env(safe-area-inset-top))] max-sm:right-2 max-sm:left-2 max-sm:w-auto max-sm:max-w-none max-sm:translate-x-0 max-sm:translate-y-0",
+          "max-sm:h-[var(--command-dialog-max-height,calc(100dvh-1rem))] max-sm:max-h-[var(--command-dialog-max-height,calc(100dvh-1rem))]",
           className
         ),
         style: mobileMaxHeight ? {
@@ -5280,7 +5300,7 @@ function CommandDialog({
         children: /* @__PURE__ */ jsxRuntime.jsx(
           Command,
           {
-            className: "max-sm:max-h-full **:data-[slot=command-input-wrapper]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5",
+            className: "flex h-full min-h-0 flex-col **:data-[slot=command-input-wrapper]:h-12 **:data-[slot=command-list]:max-sm:max-h-none **:data-[slot=command-list]:max-sm:min-h-0 **:data-[slot=command-list]:max-sm:flex-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5",
             ...commandProps,
             children
           }
@@ -5297,7 +5317,7 @@ function CommandInput({
     "div",
     {
       "data-slot": "command-input-wrapper",
-      className: "flex h-9 items-center gap-2 border-b px-3",
+      className: "flex h-9 shrink-0 items-center gap-2 border-b px-3",
       children: [
         /* @__PURE__ */ jsxRuntime.jsx(lucideReact.SearchIcon, { className: "size-4 shrink-0 opacity-50" }),
         /* @__PURE__ */ jsxRuntime.jsx(
@@ -5325,7 +5345,7 @@ function CommandList({
     {
       "data-slot": "command-list",
       className: cn(
-        "max-h-[min(300px,calc(100dvh-12rem))] scroll-py-1 overflow-x-hidden overflow-y-auto max-sm:max-h-[min(50dvh,calc(var(--command-dialog-max-height,100dvh)-6rem))]",
+        "max-h-[min(300px,calc(100dvh-12rem))] scroll-py-1 overflow-x-hidden overflow-y-auto overscroll-contain touch-pan-y",
         className
       ),
       ...props
@@ -7378,6 +7398,9 @@ var MessageComposer = React2__namespace.forwardRef(function MessageComposer2({
       event.preventDefault();
       if (!canSubmit) return;
       onSubmit(event);
+      requestAnimationFrame(() => {
+        fieldRef.current?.focus({ preventScroll: true });
+      });
     },
     [canSubmit, onSubmit]
   );
@@ -7452,6 +7475,10 @@ var MessageComposer = React2__namespace.forwardRef(function MessageComposer2({
               size: sendButtonSize,
               disabled: !canSubmit,
               className: sendButtonClassName,
+              onPointerDown: (event) => {
+                if (event.button !== 0) return;
+                event.preventDefault();
+              },
               children: sendLabel
             }
           )
@@ -7709,7 +7736,7 @@ function ThreadPanel({
             sendLabel: labels.send,
             placeholder: labels.placeholder,
             "aria-label": labels.placeholder,
-            disabled: loading || sending,
+            disabled: loading,
             sendDisabled: loading || sending,
             maxLength: 2e3,
             rows: 2