botframework-webchat-api 4.18.1-main.20260511.8fcd02a → 4.18.1

package/src/hooks/useCreateActivityStatusRenderer.tsx

@@ -1,29 +1,32 @@
 /* eslint react/prop-types: "off" */
 /* eslint react/require-default-props: "off" */
 
-import { type WebChatActivity } from 'botframework-webchat-core';
+import type { WebChatActivity } from 'botframework-webchat-core';
 import React, { memo, useMemo, type ReactNode } from 'react';
 
 import useGetKeyByActivity from '../hooks/useGetKeyByActivity';
 import useSendStatusByActivityKey from '../hooks/useSendStatusByActivityKey';
-import { type RenderActivityStatus } from '../types/ActivityStatusMiddleware';
-import { type SendStatus } from '../types/SendStatus';
+import type { RenderActivityStatus } from '../types/ActivityStatusMiddleware';
+import type { SendStatus } from '../types/SendStatus';
 import useWebChatAPIContext from './internal/useWebChatAPIContext';
 
 type ActivityStatusContainerCoreProps = Readonly<{
   activity: WebChatActivity;
   hideTimestamp: boolean;
+  nextVisibleActivity: WebChatActivity;
   sendStatus: SendStatus;
 }>;
 
 const ActivityStatusContainerCore = memo(
-  ({ activity, hideTimestamp, sendStatus }: ActivityStatusContainerCoreProps) => {
+  ({ activity, hideTimestamp, nextVisibleActivity, sendStatus }: ActivityStatusContainerCoreProps) => {
     const { activityStatusRenderer: createActivityStatusRenderer }: { activityStatusRenderer: RenderActivityStatus } =
       useWebChatAPIContext();
 
     return createActivityStatusRenderer({
       activity,
       hideTimestamp,
+      nextVisibleActivity, // "nextVisibleActivity" is for backward compatibility, please remove this line on or after 2022-07-22.
+      sameTimestampGroup: hideTimestamp, // "sameTimestampGroup" is for backward compatibility, please remove this line on or after 2022-07-22.
       sendState: sendStatus === 'send failed' || sendStatus === 'sent' ? sendStatus : 'sending'
     });
   }
@@ -32,28 +35,45 @@ const ActivityStatusContainerCore = memo(
 type ActivityStatusContainerProps = Readonly<{
   activity: WebChatActivity;
   hideTimestamp: boolean;
+  nextVisibleActivity: WebChatActivity;
 }>;
 
-const ActivityStatusContainer = memo(({ activity, hideTimestamp }: ActivityStatusContainerProps) => {
-  const [sendStatusByActivityKey] = useSendStatusByActivityKey();
-  const getKeyByActivity = useGetKeyByActivity();
+const ActivityStatusContainer = memo(
+  ({ activity, hideTimestamp, nextVisibleActivity }: ActivityStatusContainerProps) => {
+    const [sendStatusByActivityKey] = useSendStatusByActivityKey();
+    const getKeyByActivity = useGetKeyByActivity();
 
-  const key = getKeyByActivity(activity);
+    const key = getKeyByActivity(activity);
 
-  const sendStatus = (typeof key === 'string' && sendStatusByActivityKey.get(key)) || 'sent';
+    const sendStatus = (typeof key === 'string' && sendStatusByActivityKey.get(key)) || 'sent';
 
-  return <ActivityStatusContainerCore activity={activity} hideTimestamp={hideTimestamp} sendStatus={sendStatus} />;
-});
+    return (
+      <ActivityStatusContainerCore
+        activity={activity}
+        hideTimestamp={hideTimestamp}
+        nextVisibleActivity={nextVisibleActivity}
+        sendStatus={sendStatus}
+      />
+    );
+  }
+);
 
 export type ActivityStatusRenderer = (renderOptions: {
   activity: WebChatActivity;
+  nextVisibleActivity: WebChatActivity;
 }) => (props?: { hideTimestamp?: boolean }) => ReactNode;
 
 export default function useCreateActivityStatusRenderer(): ActivityStatusRenderer {
   return useMemo<ActivityStatusRenderer>(
     () =>
-      ({ activity }) =>
-      ({ hideTimestamp } = {}) => <ActivityStatusContainer activity={activity} hideTimestamp={hideTimestamp} />,
+      ({ activity, nextVisibleActivity }) =>
+      ({ hideTimestamp } = {}) => (
+        <ActivityStatusContainer
+          activity={activity}
+          hideTimestamp={hideTimestamp}
+          nextVisibleActivity={nextVisibleActivity}
+        />
+      ),
     []
   );
 }

package/src/hooks/useCreateAvatarRenderer.ts

@@ -1,26 +1,40 @@
+import { useMemo } from 'react';
+import useStyleOptions from './useStyleOptions';
+import useWebChatAPIContext from './internal/useWebChatAPIContext';
+
+import type { AvatarComponentFactory } from '../types/AvatarMiddleware';
+import type { ReactNode } from 'react';
 import type { WebChatActivity } from 'botframework-webchat-core';
-import { useCallback, type ReactNode } from 'react';
-import useBuildRenderAvatarCallback from '../middleware/useBuildRenderAvatarCallback';
 
-type CreateAvatarRendererCallback = (request: {
-  readonly activity: WebChatActivity;
-}) => false | (() => Exclude<ReactNode, boolean | null | undefined>);
+export default function useCreateAvatarRenderer(): ({
+  activity
+}: {
+  activity: WebChatActivity;
+}) => false | (() => Exclude<ReactNode, boolean | null | undefined>) {
+  const [styleOptions] = useStyleOptions();
+  const { avatarRenderer }: { avatarRenderer: AvatarComponentFactory } = useWebChatAPIContext();
+
+  return useMemo(
+    () =>
+      ({ activity }) => {
+        const { from: { role } = {} }: { from?: { role?: string } } = activity;
+
+        const result = avatarRenderer({
+          activity,
+          fromUser: role === 'user',
+          styleOptions
+        });
 
-/**
- * @deprecated Use `<AvatarPolymiddlewareProxy>` or `useBuildRenderAvatarCallback` instead. This hook will be removed on or after 2028-03-16.
- */
-export default function useCreateAvatarRenderer(): CreateAvatarRendererCallback {
-  const buildRenderAvatar = useBuildRenderAvatarCallback();
+        if (result !== false && typeof result !== 'function') {
+          console.warn(
+            'botframework-webchat: avatarMiddleware should return a function to render the avatar, or return false if avatar should be hidden. Please refer to HOOKS.md for details.'
+          );
 
-  // TODO: [P1] We should move this function into `api-middleware`.
-  //       However, it use `useStyleOptions` which is from `api` package.
-  //       In order to do that, we need to build a new `api-style-options` package first.
-  return useCallback<CreateAvatarRendererCallback>(
-    ({ activity }) => {
-      const renderer = buildRenderAvatar(Object.freeze({ activity }));
+          return () => result;
+        }
 
-      return renderer ? (): ReactNode => renderer({}) : false;
-    },
-    [buildRenderAvatar]
+        return result;
+      },
+    [avatarRenderer, styleOptions]
   );
 }

package/src/hooks/useDebouncedNotifications.spec.js

@@ -1,4 +1,3 @@
-/** @jest-environment @happy-dom/jest-environment */
 /* eslint no-magic-numbers: "off" */
 
 import { getEarliestUpdateNotBefore } from './useDebouncedNotifications';

package/src/hooks/useDisabled.ts

@@ -1,11 +1,5 @@
 import useWebChatAPIContext from './internal/useWebChatAPIContext';
 
-const TRUE_STATE = Object.freeze([true] as const);
-const FALSE_STATE = Object.freeze([false] as const);
-
-/**
- * @deprecated Please use `useUIState() === 'disabled'` instead. This hook will be removed on or after 2026-09-04.
- */
-export default function useDisabled(): readonly [boolean] {
-  return useWebChatAPIContext().uiState === 'disabled' ? TRUE_STATE : FALSE_STATE;
+export default function useDisabled(): [boolean] {
+  return [useWebChatAPIContext().disabled];
 }

package/src/hooks/useGroupActivities.ts

@@ -0,0 +1,10 @@
+import type { WebChatActivity } from 'botframework-webchat-core';
+
+import useWebChatAPIContext from './internal/useWebChatAPIContext';
+
+export default function useGroupActivities(): ({ activities }: { activities: WebChatActivity[] }) => {
+  sender: WebChatActivity[][];
+  status: WebChatActivity[][];
+} {
+  return useWebChatAPIContext().groupActivities;
+}

package/src/hooks/useLocalizer.ts

@@ -4,7 +4,7 @@ import { useCallback } from 'react';
 import getAllLocalizedStrings from '../localization/getAllLocalizedStrings';
 import useLocalizedGlobalize from './internal/useLocalizedGlobalize';
 import useLocalizedStrings from './internal/useLocalizedStrings';
-import { isPlainObject } from '@msinternal/botframework-webchat-base/utils';
+import isObject from '../utils/isObject';
 
 const DEFAULT_STRINGS = getAllLocalizedStrings()['en-US'];
 
@@ -28,8 +28,8 @@ export default function useLocalizer({ plural }: { plural?: boolean } = {}) {
       if (plural) {
         const pluralId = id as Plural;
 
-        if (!isPlainObject(pluralId)) {
-          throw new Error('useLocalizer: Plural string must pass "id" as a plain object instead of string.');
+        if (!isObject(pluralId)) {
+          throw new Error('useLocalizer: Plural string must pass "id" as a map instead of string.');
         } else if (typeof pluralId.other !== 'string') {
           throw new Error('useLocalizer: Plural string must have "id.other" of string.');
         } else if (typeof args[0] !== 'number') {

package/src/hooks/useRenderAttachment.ts

@@ -1,7 +1,7 @@
-import { type LegacyRenderAttachment } from '@msinternal/botframework-webchat-api-middleware/legacy';
+import { type RenderAttachment } from '../types/AttachmentMiddleware';
 import useWebChatAPIContext from './internal/useWebChatAPIContext';
 
-export default function useRenderAttachment(): LegacyRenderAttachment | undefined {
+export default function useRenderAttachment(): RenderAttachment | undefined {
   const { attachmentRenderer } = useWebChatAPIContext();
 
   return attachmentRenderer;

package/src/hooks/useSendBoxAttachments.ts

@@ -6,8 +6,6 @@ import useWebChatAPIContext from './internal/useWebChatAPIContext';
 
 export default function useSendBoxAttachments(): readonly [
   readonly SendBoxAttachment[],
-  // TODO: This should be Dispatch<SetStateAction<...>>, however Redux doesn't support this signature.
-  //       When we move out of Redux, we should change it.
   (attachments: readonly SendBoxAttachment[]) => void
 ] {
   // TODO: We should use the selector from "core" package.

package/src/hooks/useSendFiles.ts

@@ -1,6 +1,6 @@
 /* eslint no-magic-numbers: ["error", { "ignore": [0, 1024] }] */
 
-import { warnOnce } from '@msinternal/botframework-webchat-base/utils';
+import { warnOnce } from 'botframework-webchat-core';
 import { useCallback } from 'react';
 
 import useWebChatAPIContext from './internal/useWebChatAPIContext';

package/src/hooks/useSendTimeoutForActivity.ts

@@ -11,8 +11,6 @@ export default function useSendTimeoutForActivity(activity: WebChatActivity) {
       'botframework-webchat: "useSendTimeoutForActivity" is deprecated and will be removed on or after 2022-07-28. Please use "useGetSendTimeoutForActivity()" instead.'
     );
 
-    // This is intentionally run once.
-    // eslint-disable-next-line react-hooks/globals
     showDeprecationNotes = false;
   }
 

package/src/hooks/useStyleOptions.ts

@@ -1 +1,6 @@
-export { default } from '../providers/StyleOptions/useStyleOptions';
+import { type StrictStyleOptions } from '../StyleOptions';
+import useWebChatAPIContext from './internal/useWebChatAPIContext';
+
+export default function useStyleOptions(): [StrictStyleOptions] {
+  return [useWebChatAPIContext().styleOptions];
+}

package/src/hooks/useSuggestedActions.ts

@@ -1,10 +1,24 @@
-import { useSuggestedActionsHooks } from '@msinternal/botframework-webchat-redux-store';
-
-/**
- * @deprecated Use `useSuggestedActionsHooks().useSuggestedActions` instead. This hook will be removed on or after 2027-05-30.
- */
-export default function useSuggestedActions() {
-  // Provides a path for backward compatibility during deprecation.
-  // eslint-disable-next-line local-rules/forbid-use-hook-producer
-  return useSuggestedActionsHooks().useSuggestedActions();
+import { useCallback } from 'react';
+import type { DirectLineCardAction } from 'botframework-webchat-core';
+
+import { useSelector } from './internal/WebChatReduxContext';
+import useWebChatAPIContext from './internal/useWebChatAPIContext';
+
+export default function useSuggestedActions(): [DirectLineCardAction[], (suggestedActions: never[]) => void] {
+  const value = useSelector(({ suggestedActions }) => suggestedActions);
+  const { clearSuggestedActions } = useWebChatAPIContext();
+
+  return [
+    value,
+    useCallback(
+      value => {
+        if (value && value.length) {
+          throw new Error('SuggestedActions cannot be set to values other than empty.');
+        }
+
+        clearSuggestedActions();
+      },
+      [clearSuggestedActions]
+    )
+  ];
 }

package/src/hooks/useTrackEvent.ts

@@ -1,7 +1,7 @@
-import { isPlainObject } from '@msinternal/botframework-webchat-base/utils';
 import { useCallback, useMemo } from 'react';
 
 import createCustomEvent from '../utils/createCustomEvent';
+import isObject from '../utils/isObject';
 import useReadTelemetryDimensions from './internal/useReadTelemetryDimensions';
 import useWebChatAPIContext from './internal/useWebChatAPIContext';
 
@@ -28,10 +28,10 @@ export default function useTrackEvent(): TrackEventFunction {
       }
 
       if (typeof data !== 'undefined') {
-        if (isPlainObject(data)) {
+        if (isObject(data)) {
           if (!Object.values(data).every(value => isNonNegativeFiniteNumberOrString(value))) {
             return console.warn(
-              'botframework-webchat: Every value in "data" plain object passed to "useTrackEvent" hook must be a non-negative finite number or string.'
+              'botframework-webchat: Every value in "data" map passed to "useTrackEvent" hook must be a non-negative finite number or string.'
             );
           }
         } else if (!isNonNegativeFiniteNumberOrString(data)) {

package/src/index.ts

@@ -1,65 +1,107 @@
-export type {
-  /** @deprecated Use `polymiddleware` instead, this will be removed on or after 2027-08-16. */
-  LegacyActivityComponentFactory as ActivityComponentFactory,
-  /** @deprecated Use `polymiddleware` instead, this will be removed on or after 2027-08-16. */
-  LegacyActivityMiddleware as ActivityMiddleware,
-  /** @deprecated Use `polymiddleware` instead, this will be removed on or after 2027-08-16. */
-  LegacyAttachmentMiddleware as AttachmentMiddleware,
-  LegacyRenderAttachment as RenderAttachment
-} from '@msinternal/botframework-webchat-api-middleware/legacy';
-
-export * as hooks from './boot/hook';
-export { default as defaultStyleOptions } from './defaultStyleOptions';
-export { default as Composer, type ComposerProps } from './hooks/Composer';
-export { default as concatMiddleware } from './hooks/middleware/concatMiddleware';
-export { type ActivityStatusRenderer } from './hooks/useCreateActivityStatusRenderer'; // TODO: [P1] This line should export the one from the version from "middleware rework" workstream.
-export { type DebouncedNotification, type DebouncedNotifications } from './hooks/useDebouncedNotifications';
-export { type PostActivityFile } from './hooks/useSendFiles';
-export { localize } from './localization/Localize';
-export {
-  extractSendBoxMiddleware,
+import StyleOptions, { StrictStyleOptions } from './StyleOptions';
+import defaultStyleOptions from './defaultStyleOptions';
+import Composer, { ComposerProps } from './hooks/Composer';
+import * as hooks from './hooks/index';
+import {
   SendBoxMiddlewareProxy,
+  initSendBoxMiddleware,
   type SendBoxMiddleware,
   type SendBoxMiddlewareProps,
   type SendBoxMiddlewareRequest
-} from './middleware/SendBoxMiddleware';
-export {
-  extractSendBoxToolbarMiddleware,
+} from './hooks/internal/SendBoxMiddleware';
+import {
   SendBoxToolbarMiddlewareProxy,
+  initSendBoxToolbarMiddleware,
   type SendBoxToolbarMiddleware,
   type SendBoxToolbarMiddlewareProps,
   type SendBoxToolbarMiddlewareRequest
-} from './middleware/SendBoxToolbarMiddleware';
-export { default as normalizeStyleOptions } from './normalizeStyleOptions';
-export { type StrictStyleOptions, type StyleOptions } from './StyleOptions';
-export { type ActivityStatusMiddleware, type RenderActivityStatus } from './types/ActivityStatusMiddleware';
-export {
-  type AttachmentForScreenReaderComponentFactory,
-  type default as AttachmentForScreenReaderMiddleware
+} from './hooks/internal/SendBoxToolbarMiddleware';
+import concatMiddleware from './hooks/middleware/concatMiddleware';
+import { type ActivityStatusRenderer } from './hooks/useCreateActivityStatusRenderer'; // TODO: [P1] This line should export the one from the version from "middleware rework" workstream.
+import { type DebouncedNotification, type DebouncedNotifications } from './hooks/useDebouncedNotifications';
+import { type PostActivityFile } from './hooks/useSendFiles';
+import { localize } from './localization/Localize';
+import normalizeStyleOptions from './normalizeStyleOptions';
+import ActivityMiddleware, { type ActivityComponentFactory } from './types/ActivityMiddleware';
+import { type ActivityStatusMiddleware, type RenderActivityStatus } from './types/ActivityStatusMiddleware';
+import AttachmentForScreenReaderMiddleware, {
+  AttachmentForScreenReaderComponentFactory
 } from './types/AttachmentForScreenReaderMiddleware';
-export { type AvatarComponentFactory, type default as AvatarMiddleware } from './types/AvatarMiddleware';
-export { type default as CardActionMiddleware, type PerformCardAction } from './types/CardActionMiddleware';
-export { type ContextOf } from './types/ContextOf';
-export { type GroupActivities, type default as GroupActivitiesMiddleware } from './types/GroupActivitiesMiddleware';
-export { type Notification } from './types/Notification';
-export {
-  type ScrollToEndButtonComponentFactory,
-  type default as ScrollToEndButtonMiddleware
+import AttachmentMiddleware, { type RenderAttachment } from './types/AttachmentMiddleware';
+import AvatarMiddleware, { type AvatarComponentFactory } from './types/AvatarMiddleware';
+import CardActionMiddleware, { type PerformCardAction } from './types/CardActionMiddleware';
+import { type ContextOf } from './types/ContextOf';
+import GroupActivitiesMiddleware, { type GroupActivities } from './types/GroupActivitiesMiddleware';
+import { type Notification } from './types/Notification';
+import ScrollToEndButtonMiddleware, {
+  type ScrollToEndButtonComponentFactory
 } from './types/ScrollToEndButtonMiddleware';
-export { type SendStatus } from './types/SendStatus';
-export { type RenderToast, type default as ToastMiddleware } from './types/ToastMiddleware';
-export { type Typing } from './types/Typing';
-export {
-  type RenderTypingIndicator,
-  type default as TypingIndicatorMiddleware
-} from './types/TypingIndicatorMiddleware';
-export { type WebSpeechPonyfill } from './types/WebSpeechPonyfill';
-export { type WebSpeechPonyfillFactory } from './types/WebSpeechPonyfillFactory';
+import { type SendStatus } from './types/SendStatus';
+import ToastMiddleware, { type RenderToast } from './types/ToastMiddleware';
+import { type Typing } from './types/Typing';
+import TypingIndicatorMiddleware, { type RenderTypingIndicator } from './types/TypingIndicatorMiddleware';
+import { type WebSpeechPonyfill } from './types/WebSpeechPonyfill';
+import { type WebSpeechPonyfillFactory } from './types/WebSpeechPonyfillFactory';
+
+const buildTool = process.env.build_tool;
+const moduleFormat = process.env.module_format;
+const version = process.env.npm_package_version;
 
-// #region Build info
-import buildInfo from './buildInfo';
+const buildInfo = { buildTool, moduleFormat, version };
 
-const { object: buildInfoObject, version } = buildInfo;
+export {
+  Composer,
+  SendBoxMiddlewareProxy,
+  SendBoxToolbarMiddlewareProxy,
+  buildInfo,
+  concatMiddleware,
+  defaultStyleOptions,
+  hooks,
+  initSendBoxMiddleware,
+  initSendBoxToolbarMiddleware,
+  localize,
+  normalizeStyleOptions,
+  version
+};
 
-export { buildInfoObject as buildInfo, version };
-// #endregion
+export type {
+  ActivityComponentFactory,
+  ActivityMiddleware,
+  ActivityStatusMiddleware,
+  ActivityStatusRenderer,
+  AttachmentForScreenReaderComponentFactory,
+  AttachmentForScreenReaderMiddleware,
+  AttachmentMiddleware,
+  AvatarComponentFactory,
+  AvatarMiddleware,
+  CardActionMiddleware,
+  ComposerProps,
+  ContextOf,
+  DebouncedNotification,
+  DebouncedNotifications,
+  GroupActivities,
+  GroupActivitiesMiddleware,
+  Notification,
+  PerformCardAction,
+  PostActivityFile,
+  RenderActivityStatus,
+  RenderAttachment,
+  RenderToast,
+  RenderTypingIndicator,
+  ScrollToEndButtonComponentFactory,
+  ScrollToEndButtonMiddleware,
+  SendBoxMiddleware,
+  SendBoxMiddlewareProps,
+  SendBoxMiddlewareRequest,
+  SendBoxToolbarMiddleware,
+  SendBoxToolbarMiddlewareProps,
+  SendBoxToolbarMiddlewareRequest,
+  SendStatus,
+  StrictStyleOptions,
+  StyleOptions,
+  ToastMiddleware,
+  Typing,
+  TypingIndicatorMiddleware,
+  WebSpeechPonyfill,
+  WebSpeechPonyfillFactory
+};

package/src/internal.ts

@@ -0,0 +1,3 @@
+import useSetDictateState from './hooks/internal/useSetDictateState';
+
+export { useSetDictateState };