@azure/communication-react 1.14.1-alpha-202403280012 → 1.14.1-alpha-202403290012

package/dist/communication-react.d.ts

@@ -248,6 +248,27 @@ export declare type AreParamEqual<A extends (props: any) => JSX.Element | undefi
  */
 export declare type AreTypeEqual<A, B> = A extends B ? (B extends A ? true : false) : false;
 
+/**
+ * @beta
+ *
+ * Attachment download options defines the list of actions that can be performed on an attachment.
+ */
+export declare interface AttachmentDownloadOptions {
+    actionsForAttachment: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[];
+}
+
+/**
+ * @beta
+ *
+ * Attachment menu action defines buttons that can be shown on the attachment card.
+ * If there's one action, it will be shown as a button, if there are multiple actions, it will be shown as a dropdown.
+ */
+export declare interface AttachmentMenuAction {
+    name: string;
+    icon: JSX.Element;
+    onClick: (attachment: AttachmentMetadata) => Promise<void>;
+}
+
 /**
  * Metadata containing basic information about the uploaded attachment.
  *
@@ -259,7 +280,7 @@ export declare interface AttachmentMetadata {
      * An unknown or empty extension will be rendered as a generic icon.
      * Example: `pdf`
      */
-    extension: string;
+    extension?: string;
     /**
      * Unique ID of the attachment.
      */
@@ -271,8 +292,101 @@ export declare interface AttachmentMetadata {
     /**
      * Download URL for the attachment.
      */
-    url: string;
-    payload?: Record<string, string>;
+    url?: string;
+    /**
+     * A number between 0 and 1 indicating the progress of the upload.
+     */
+    progress?: number;
+    /**
+     * A object contains status message would be shown to the user.
+     */
+    uploadStatus?: AttachmentUploadStatus;
+}
+
+/**
+ * @beta
+ *
+ * Attachment Options that defines behaviour for uploading and downloading attachments.
+ */
+export declare interface AttachmentOptions {
+    uploadOptions?: AttachmentUploadOptions;
+    downloadOptions?: AttachmentDownloadOptions;
+}
+
+/**
+ * @beta
+ * A callback function for handling file uploads.
+ *
+ * @param AttachmentUploads - The list of uploaded files. Each file is represented by an {@link AttachmentUpload} object.
+ */
+export declare type AttachmentUploadHandler = (attachmentUploads: AttachmentUploadManager[]) => void;
+
+/**
+ * A wrapper object for a file that is being uploaded.
+ * Allows managing file uploads by providing common functions for updating the
+ * upload progress, canceling an upload, completing an upload etc.
+ * @beta
+ */
+export declare interface AttachmentUploadManager {
+    /**
+     * Unique identifier for the file upload.
+     */
+    id: string;
+    /**
+     * HTML {@link File} object for the uploaded file.
+     */
+    file?: File;
+    /**
+     * Update the progress of the upload.
+     * @param value - number between 0 and 1
+     */
+    notifyUploadProgressChanged: (value: number) => void;
+    /**
+     * Mark the upload as complete.
+     * Requires the `metadata` param containing uploaded file information.
+     * @param metadata - {@link AttachmentMetadata}
+     */
+    notifyUploadCompleted: (metadata: AttachmentMetadata) => void;
+    /**
+     * Mark the upload as failed.
+     * @param message - An error message that can be displayed to the user.
+     */
+    notifyUploadFailed: (message: string) => void;
+}
+
+/**
+ * @beta
+ */
+export declare interface AttachmentUploadOptions {
+    /**
+     * A string containing the comma separated list of accepted file types.
+     * Similar to the `accept` attribute of the `<input type="file" />` element.
+     * Accepts any type of file if not specified.
+     * @beta
+     */
+    supportedMediaTypes?: string[];
+    /**
+     * Allows multiple files to be selected if set to `true`.
+     * Similar to the `multiple` attribute of the `<input type="file" />` element.
+     * @defaultValue false
+     * @beta
+     */
+    disableMultipleUploads?: boolean;
+    /**
+     * A function of type {@link AttachmentUploadHandler} for handling file uploads.
+     * @beta
+     */
+    handler: AttachmentUploadHandler;
+}
+
+/**
+ * @beta
+ * A attachment upload status object that contains message to be shown to
+ * the user and a timestamp.
+ */
+export declare interface AttachmentUploadStatus {
+    message: string;
+    timestamp: number;
 }
 
 /**
@@ -6226,8 +6340,9 @@ export declare const DEFAULT_COMPONENT_ICONS: {
     RaiseHandContextualMenuItem: React_2.JSX.Element;
     LowerHandContextualMenuItem: React_2.JSX.Element;
     ReactionButtonIcon: React_2.JSX.Element;
-    CancelFileUpload: React_2.JSX.Element;
-    DownloadFile: React_2.JSX.Element;
+    CancelAttachmentUpload: React_2.JSX.Element;
+    DownloadAttachment: React_2.JSX.Element;
+    OpenAttachment: React_2.JSX.Element;
     DataLossPreventionProhibited: React_2.JSX.Element;
     EditBoxCancel: React_2.JSX.Element;
     EditBoxSubmit: React_2.JSX.Element;
@@ -6423,8 +6538,9 @@ export declare const DEFAULT_COMPOSITE_ICONS: {
     MoreDrawerSpeakers?: JSX.Element | undefined;
     ChatMessageOptions: React_2.JSX.Element;
     ControlButtonParticipantsContextualMenuItem: React_2.JSX.Element;
-    CancelFileUpload: React_2.JSX.Element;
-    DownloadFile: React_2.JSX.Element;
+    CancelAttachmentUpload: React_2.JSX.Element;
+    DownloadAttachment: React_2.JSX.Element;
+    OpenAttachment: React_2.JSX.Element;
     DataLossPreventionProhibited: React_2.JSX.Element;
     ErrorBarCallVideoRecoveredBySystem: React_2.JSX.Element;
     ErrorBarCallVideoStoppedBySystem: React_2.JSX.Element;
@@ -7101,48 +7217,6 @@ export declare interface ErrorBarStrings {
  */
 export declare type ErrorType = keyof ErrorBarStrings;
 
-/**
- * @beta
- * A attachment download error returned via a {@link FileDownloadHandler}.
- * This error message is used to render an error message in the UI.
- */
-export declare interface FileDownloadError {
-    /** The error message to display in the UI */
-    errorMessage: string;
-}
-
-/**
- * @beta
- *
- * A callback function for handling attachment downloads.
- * The function needs to return a promise that resolves to a attachment download URL.
- * If the promise is rejected, the {@link Error.message} will be used to display an error message to the user.
- *
- * @example
- * ```ts
- * const attachmentDownloadHandler: FileDownloadHandler = async (userId, attachmentData) => {
- *   if (isUnauthorizedUser(userId)) {
- *     return { errorMessage: 'You don’t have permission to download this attachment.' };
- *   } else {
- *     return new URL(attachmentData.url);
- *   }
- * }
- *
- * const App = () => (
- *   <ChatComposite
- *     ...
- *     fileSharing={{
- *       fileDownloadHandler: fileDownloadHandler
- *     }}
- *   />
- * )
- *
- * ```
- * @param userId - The user ID of the user downloading the attachment.
- * @param fileMetadata - The {@link AttachmentMetadata} containing file `url`, `extension` and `name`.
- */
-export declare type FileDownloadHandler = (userId: string, fileMetadata: AttachmentMetadata) => Promise<URL | FileDownloadError>;
-
 /**
  * Properties for configuring the File Sharing feature.
  * @beta
@@ -7168,11 +7242,9 @@ export declare interface FileSharingOptions {
      */
     uploadHandler: FileUploadHandler;
     /**
-     * A function of type {@link FileDownloadHandler} for handling file downloads.
-     * If the function is not specified, the file's `url` will be opened in a new tab to
-     * initiate the download.
+     * A temp function until this interface is deprecated
      */
-    downloadHandler?: FileDownloadHandler;
+    actionsForAttachment?: (attachment: AttachmentMetadata, message?: ChatMessage) => AttachmentMenuAction[];
 }
 
 /**
@@ -8307,10 +8379,10 @@ export declare type MessageThreadProps = {
      */
     onRenderMessage?: (messageProps: MessageProps, messageRenderer?: MessageRenderer) => JSX.Element;
     /**
-     * Optional callback to render attached files in the message component.
+     * Optional callback to render attachments in the message component.
      * @beta
      */
-    onRenderFileDownloads?: (userId: string, message: ChatMessage) => JSX.Element;
+    onRenderAttachmentDownloads?: (userId: string, message: ChatMessage) => JSX.Element;
     /**
      * Optional callback to edit a message.
      *
@@ -8354,11 +8426,10 @@ export declare type MessageThreadProps = {
     strings?: Partial<MessageThreadStrings>;
     /**
      * @beta
-     * Optional function called when someone clicks on the file download icon.
-     * If file attachments are defined in the `message.metadata` property using the `fileSharingMetadata` key,
-     * this function will be called with the data inside `fileSharingMetadata` key.
+     * Optional attachment options, which defines behvaiour for uploading and downloading attachments.
+     * As this moment, the uploadOptions would be ignored and this option is intended for download only.
      */
-    fileDownloadHandler?: FileDownloadHandler;
+    attachmentOptions?: AttachmentOptions;
     /**
      * Optional function to provide customized date format.
      * @beta
@@ -8447,13 +8518,15 @@ export declare interface MessageThreadStrings {
     actionMenuMoreOptions?: string;
     /** Aria label to announce when a message is deleted */
     messageDeletedAnnouncementAriaLabel: string;
-    /** String for download file button in attachment card */
+    /** String for download attachment button in attachment card */
     downloadAttachment: string;
+    /** String for open attachment button in attachment card */
+    openAttachment: string;
     /** String for policy violation message removal */
     blockedWarningText: string;
     /** String for policy violation message removal details link */
     blockedWarningLinkText: string;
-    /** String for aria text in file attachment group*/
+    /** String for aria text in attachment card group*/
     attachmentCardGroupMessage: string;
 }
 

package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-D3ER8Kz9.js → RichTextSendBoxWrapper-CH6WvEGZ.js}

@@ -1,11 +1,9 @@
 'use strict';
 
 var React = require('react');
-var index = require('./index-BI61bnOi.js');
+var index = require('./index-qxnuqL7s.js');
 require('@fluentui/react');
 require('@fluentui/react-components');
-require('@fluentui/react-file-type-icons');
-require('@fluentui/react-icons');
 require('@fluentui-contrib/react-chat');
 require('@azure/communication-common');
 require('@fluentui/react-hooks');
@@ -17,8 +15,10 @@ require('memoize-one');
 require('@azure/logger');
 require('events');
 require('immer');
+require('@fluentui/react-icons');
 require('textarea-caret-ts');
 require('use-debounce');
+require('@fluentui/react-file-type-icons');
 require('@griffel/react');
 require('roosterjs-editor-plugins');
 require('roosterjs-editor-core');
@@ -51,4 +51,4 @@ const RichTextSendBoxWrapper = () => {
 };
 
 exports.RichTextSendBoxWrapper = RichTextSendBoxWrapper;
-//# sourceMappingURL=RichTextSendBoxWrapper-D3ER8Kz9.js.map
+//# sourceMappingURL=RichTextSendBoxWrapper-CH6WvEGZ.js.map

package/dist/dist-cjs/communication-react/{RichTextSendBoxWrapper-D3ER8Kz9.js.map → RichTextSendBoxWrapper-CH6WvEGZ.js.map}

@@ -1 +1 @@
-{"version":3,"file":"RichTextSendBoxWrapper-D3ER8Kz9.js","sources":["../../../../react-composites/src/composites/common/RichTextSendBoxWrapper.tsx"],"sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(rich-text-editor) */\nimport React from 'react';\n/* @conditional-compile-remove(rich-text-editor) */\nimport { usePropsFor } from '../ChatComposite/hooks/usePropsFor';\n/* @conditional-compile-remove(rich-text-editor) */\nimport { RichTextSendBox } from '@internal/react-components';\n\n/* @conditional-compile-remove(rich-text-editor) */\n/**\n * @private\n *\n * Wrapper for RichTextSendBox component to allow us to use usePropsFor with richTextSendBox\n * before lazyLoading is done\n */\nexport const RichTextSendBoxWrapper = (): JSX.Element => {\n  const richTextSendBoxProps = usePropsFor(RichTextSendBox);\n\n  return <RichTextSendBox {...richTextSendBoxProps} />;\n};\n"],"names":["usePropsFor","RichTextSendBox"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAEA;AAOA;AACA;;;;;AAKG;AACI,MAAM,sBAAsB,GAAG,MAAkB;AACtD,IAAA,MAAM,oBAAoB,GAAGA,iBAAW,CAACC,qBAAe,CAAC,CAAC;AAE1D,IAAA,OAAO,KAAC,CAAA,aAAA,CAAAA,qBAAe,EAAK,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,oBAAoB,EAAI,CAAC;AACvD;;;;"}
+{"version":3,"file":"RichTextSendBoxWrapper-CH6WvEGZ.js","sources":["../../../../react-composites/src/composites/common/RichTextSendBoxWrapper.tsx"],"sourcesContent":["// Copyright (c) Microsoft Corporation.\n// Licensed under the MIT License.\n\n/* @conditional-compile-remove(rich-text-editor) */\nimport React from 'react';\n/* @conditional-compile-remove(rich-text-editor) */\nimport { usePropsFor } from '../ChatComposite/hooks/usePropsFor';\n/* @conditional-compile-remove(rich-text-editor) */\nimport { RichTextSendBox } from '@internal/react-components';\n\n/* @conditional-compile-remove(rich-text-editor) */\n/**\n * @private\n *\n * Wrapper for RichTextSendBox component to allow us to use usePropsFor with richTextSendBox\n * before lazyLoading is done\n */\nexport const RichTextSendBoxWrapper = (): JSX.Element => {\n  const richTextSendBoxProps = usePropsFor(RichTextSendBox);\n\n  return <RichTextSendBox {...richTextSendBoxProps} />;\n};\n"],"names":["usePropsFor","RichTextSendBox"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AAEA;AAOA;AACA;;;;;AAKG;AACI,MAAM,sBAAsB,GAAG,MAAkB;AACtD,IAAA,MAAM,oBAAoB,GAAGA,iBAAW,CAACC,qBAAe,CAAC,CAAC;AAE1D,IAAA,OAAO,KAAC,CAAA,aAAA,CAAAA,qBAAe,EAAK,MAAA,CAAA,MAAA,CAAA,EAAA,EAAA,oBAAoB,EAAI,CAAC;AACvD;;;;"}