@opengeni/react 2.5.0-canary.1 → 3.0.0-canary.0

package/dist/{chunk-KSDXER4X.js → chunk-RGALCTWO.js}

@@ -1,7 +1,7 @@
 import {
   shouldSteerOnKey,
   shouldSubmitOnKey
-} from "./chunk-T7VAYG2I.js";
+} from "./chunk-MZ2G2XBA.js";
 import {
   groupPickerRowsByBillingClass
 } from "./chunk-X4A66EWZ.js";
@@ -9,8 +9,9 @@ import {
   Tooltip,
   TooltipContent,
   TooltipProvider,
-  TooltipTrigger
-} from "./chunk-FK6VG4LL.js";
+  TooltipTrigger,
+  useLightboxOptional
+} from "./chunk-YFKJ7VZH.js";
 import {
   ComposerResponsiveContext
 } from "./chunk-VZTQ73XT.js";
@@ -2883,6 +2884,7 @@ import {
   useContext,
   useEffect as useEffect3,
   useId as useId2,
+  useLayoutEffect,
   useMemo as useMemo4,
   useRef as useRef4,
   useState as useState4
@@ -2935,6 +2937,10 @@ var defaultChatComposerMessages = {
   removeRestoredResource: (index) => `Remove restored resource ${index + 1}`,
   uploading: "Uploading",
   uploadFailed: "Upload failed",
+  previewAttachment: (name) => `Preview ${name}`,
+  attachmentPreviewLabel: "Attachment preview",
+  downloadAttachment: (name) => `Download ${name}`,
+  closeAttachmentPreview: "Close",
   retryAttachment: (name) => `Retry ${name}`,
   retryUpload: "Retry upload",
   removeAttachment: (name) => `Remove ${name}`,
@@ -3046,21 +3052,31 @@ function useChatComposerController({
   const [submitting, setSubmitting] = useState4(false);
   const submittingRef = useRef4(false);
   const controlOperationRef = useRef4(false);
+  const deliveryValue = delivery.value;
+  const setDeliveryValue = delivery.setValue;
   const mountedRef = useRef4(true);
-  const deliveredValueRef = useRef4(delivery.value);
-  const liveValueRef = useRef4(delivery.value);
-  if (delivery.value !== deliveredValueRef.current) {
-    deliveredValueRef.current = delivery.value;
-    liveValueRef.current = delivery.value;
+  const deliveredValueRef = useRef4(deliveryValue);
+  const liveValueRef = useRef4(deliveryValue);
+  const [renderedValue, setRenderedValue] = useState4(deliveryValue);
+  const deliveryChanged = deliveryValue !== deliveredValueRef.current;
+  if (deliveryChanged) {
+    deliveredValueRef.current = deliveryValue;
+    liveValueRef.current = deliveryValue;
   }
   const setComposerValue = useCallback4(
     (next) => {
       liveValueRef.current = next;
-      delivery.setValue(next);
+      setRenderedValue(next);
+      setDeliveryValue(next);
     },
-    [delivery.setValue]
+    [setDeliveryValue]
   );
-  const visibleValue = liveValueRef.current;
+  const visibleValue = deliveryChanged ? deliveryValue : renderedValue;
+  useLayoutEffect(() => {
+    if (renderedValue !== liveValueRef.current) {
+      setRenderedValue(liveValueRef.current);
+    }
+  }, [deliveryValue, renderedValue]);
   useEffect3(() => {
     mountedRef.current = true;
     return () => {
@@ -3489,7 +3505,8 @@ function Attachments() {
       attachments: controller.attachments.attachments,
       messages: controller.messages,
       onRemove: controller.attachments.remove,
-      onRetry: controller.attachments.retry
+      onRetry: controller.attachments.retry,
+      onRetainPreview: controller.attachments.retainPreview
     }
   );
 }
@@ -4007,8 +4024,10 @@ function AttachmentChips({
   attachments,
   messages,
   onRemove,
-  onRetry
+  onRetry,
+  onRetainPreview
 }) {
+  const lightbox = useLightboxOptional();
   return /* @__PURE__ */ jsx3("div", { className: "flex flex-wrap gap-2 px-3 py-2", children: attachments.map((attachment) => {
     const failed = attachment.status === "failed";
     const statusText = attachment.status === "uploading" ? messages.uploading : failed ? attachment.error || messages.uploadFailed : messages.formatBytes(attachment.sizeBytes);
@@ -4020,7 +4039,37 @@ function AttachmentChips({
           failed ? "border-og-status-failed/40 bg-og-status-failed/10" : "border-og-border bg-og-surface-2"
         ),
         children: [
-          attachment.previewUrl ? /* @__PURE__ */ jsx3(
+          attachment.previewUrl && lightbox ? /* @__PURE__ */ jsx3(
+            "button",
+            {
+              type: "button",
+              className: "size-8 shrink-0 overflow-hidden rounded outline-hidden focus-visible:ring-2 focus-visible:ring-og-accent",
+              "aria-label": messages.previewAttachment(attachment.name),
+              onClick: (event) => {
+                const releasePreview = onRetainPreview(attachment.id);
+                lightbox.open(
+                  attachment.previewUrl,
+                  attachment.name,
+                  event.currentTarget,
+                  messages.attachmentPreviewLabel,
+                  attachment.name,
+                  {
+                    download: messages.downloadAttachment(attachment.name),
+                    close: messages.closeAttachmentPreview
+                  },
+                  releasePreview
+                );
+              },
+              children: /* @__PURE__ */ jsx3(
+                "img",
+                {
+                  src: attachment.previewUrl,
+                  alt: "",
+                  className: "h-full w-full object-cover transition-opacity hover:opacity-80"
+                }
+              )
+            }
+          ) : attachment.previewUrl ? /* @__PURE__ */ jsx3(
             "img",
             {
               src: attachment.previewUrl,
@@ -4545,4 +4594,4 @@ export {
   Status,
   ComposerTranscriptionControl
 };
-//# sourceMappingURL=chunk-KSDXER4X.js.map
+//# sourceMappingURL=chunk-RGALCTWO.js.map