botframework-webchat-api 4.13.0 → 4.15.0

package/src/providers/ActivityKeyer/ActivityKeyerComposer.tsx

@@ -0,0 +1,151 @@
+import PropTypes from 'prop-types';
+import React, { useCallback, useMemo, useRef } from 'react';
+
+import type { DirectLineActivity } from 'botframework-webchat-core';
+import type { FC } from 'react';
+
+import ActivityKeyerContext, { ActivityKeyerContextType } from './private/Context';
+import getActivityId from './private/getActivityId';
+import getClientActivityId from './private/getClientActivityId';
+import uniqueId from './private/uniqueId';
+import useActivities from '../../hooks/useActivities';
+import useActivityKeyerContext from './private/useContext';
+
+type ActivityIdToKeyMap = Map<string, string>;
+type ActivityToKeyMap = Map<DirectLineActivity, string>;
+type ClientActivityIdToKeyMap = Map<string, string>;
+type KeyToActivityMap = Map<string, DirectLineActivity>;
+
+/**
+ * React context composer component to assign a perma-key to every activity.
+ * This will support both `useGetActivityByKey` and `useGetKeyByActivity` custom hooks.
+ *
+ * Today, `activity.id` is only guaranteed for activity from others.
+ * Not all activities sent by the local user has `activity.id`.
+ *
+ * To track outgoing activities, we added `activity.channelData.clientActivityId`.
+ *
+ * This component will create a local key, which can be used to track both
+ * incoming and outgoing activities in a consistent way.
+ *
+ * Local key are only persisted in memory. On refresh, they will be a new random key.
+ */
+const ActivityKeyerComposer: FC<{}> = ({ children }) => {
+  const existingContext = useActivityKeyerContext(false);
+
+  if (existingContext) {
+    throw new Error('botframework-webchat internal: <ActivityKeyerComposer> should not be nested.');
+  }
+
+  const [activities] = useActivities();
+  const activityIdToKeyMapRef = useRef<Readonly<ActivityIdToKeyMap>>(Object.freeze(new Map()));
+  const activityToKeyMapRef = useRef<Readonly<ActivityToKeyMap>>(Object.freeze(new Map()));
+  const clientActivityIdToKeyMapRef = useRef<Readonly<ClientActivityIdToKeyMap>>(Object.freeze(new Map()));
+  const keyToActivityMapRef = useRef<Readonly<KeyToActivityMap>>(Object.freeze(new Map()));
+
+  // TODO: [P1] `useMemoWithPrevious` to check and cache the resulting array if it hasn't changed.
+  const activityKeysState = useMemo<readonly [readonly string[]]>(() => {
+    const { current: activityIdToKeyMap } = activityIdToKeyMapRef;
+    const { current: activityToKeyMap } = activityToKeyMapRef;
+    const { current: clientActivityIdToKeyMap } = clientActivityIdToKeyMapRef;
+    const nextActivityIdToKeyMap: ActivityIdToKeyMap = new Map();
+    const nextActivityKeys: string[] = [];
+    const nextActivityToKeyMap: ActivityToKeyMap = new Map();
+    const nextClientActivityIdToKeyMap: ClientActivityIdToKeyMap = new Map();
+    const nextKeyToActivityMap: KeyToActivityMap = new Map();
+
+    activities.forEach(activity => {
+      const activityId = getActivityId(activity);
+      const clientActivityId = getClientActivityId(activity);
+
+      const key =
+        (clientActivityId && clientActivityIdToKeyMap.get(clientActivityId)) ||
+        (activityId && activityIdToKeyMap.get(activityId)) ||
+        activityToKeyMap.get(activity) ||
+        uniqueId();
+
+      activityId && nextActivityIdToKeyMap.set(activityId, key);
+      clientActivityId && nextClientActivityIdToKeyMap.set(clientActivityId, key);
+      nextActivityToKeyMap.set(activity, key);
+      nextKeyToActivityMap.set(key, activity);
+      nextActivityKeys.push(key);
+    });
+
+    activityIdToKeyMapRef.current = Object.freeze(nextActivityIdToKeyMap);
+    activityToKeyMapRef.current = Object.freeze(nextActivityToKeyMap);
+    clientActivityIdToKeyMapRef.current = Object.freeze(nextClientActivityIdToKeyMap);
+    keyToActivityMapRef.current = Object.freeze(nextKeyToActivityMap);
+
+    // `nextActivityKeys` could potentially same as `prevActivityKeys` despite reference differences, we should memoize it.
+    return Object.freeze([Object.freeze(nextActivityKeys)]) as readonly [readonly string[]];
+  }, [activities, activityIdToKeyMapRef, activityToKeyMapRef, clientActivityIdToKeyMapRef, keyToActivityMapRef]);
+
+  const getActivityByKey: (key?: string) => DirectLineActivity | undefined = useCallback(
+    (key?: string): DirectLineActivity | undefined => key && keyToActivityMapRef.current.get(key),
+    [keyToActivityMapRef]
+  );
+
+  const getKeyByActivity: (activity?: DirectLineActivity) => string | undefined = useCallback(
+    (activity?: DirectLineActivity) => activity && activityToKeyMapRef.current.get(activity),
+    [activityToKeyMapRef]
+  );
+
+  const getKeyByActivityId: (activityId?: string) => string | undefined = useCallback(
+    (activityId?: string) => activityId && activityIdToKeyMapRef.current.get(activityId),
+    [activityIdToKeyMapRef]
+  );
+
+  const contextValue = useMemo<ActivityKeyerContextType>(
+    () => ({
+      activityKeysState,
+      getActivityByKey,
+      getKeyByActivity,
+      getKeyByActivityId
+    }),
+    [activityKeysState, getActivityByKey, getKeyByActivity, getKeyByActivityId]
+  );
+
+  const { length: numActivities } = activities;
+
+  if (activityIdToKeyMapRef.current.size > numActivities) {
+    console.warn(
+      'botframework-webchat internal assertion: "activityIdToKeyMap.size" should be equal or less than "activities.length".'
+    );
+  }
+
+  if (activityToKeyMapRef.current.size !== numActivities) {
+    console.warn(
+      'botframework-webchat internal assertion: "activityToKeyMap.size" should be same as "activities.length".'
+    );
+  }
+
+  if (clientActivityIdToKeyMapRef.current.size > numActivities) {
+    console.warn(
+      'botframework-webchat internal assertion: "clientActivityIdToKeyMap.size" should be equal or less than "activities.length".'
+    );
+  }
+
+  if (keyToActivityMapRef.current.size !== numActivities) {
+    console.warn(
+      'botframework-webchat internal assertion: "keyToActivityMap.size" should be same as "activities.length".'
+    );
+  }
+
+  if (activityKeysState[0].length !== numActivities) {
+    console.warn(
+      'botframework-webchat internal assertion: "activityKeys.length" should be same as "activities.length".'
+    );
+  }
+
+  return <ActivityKeyerContext.Provider value={contextValue}>{children}</ActivityKeyerContext.Provider>;
+};
+
+ActivityKeyerComposer.defaultProps = {
+  children: undefined
+};
+
+ActivityKeyerComposer.propTypes = {
+  children: PropTypes.any
+};
+
+export default ActivityKeyerComposer;

package/src/providers/ActivityKeyer/private/Context.ts

@@ -0,0 +1,14 @@
+import { createContext } from 'react';
+
+import type { DirectLineActivity } from 'botframework-webchat-core';
+
+type ActivityKeyerContextType = {
+  activityKeysState: readonly [readonly string[]];
+  getActivityByKey: (key?: string) => DirectLineActivity | undefined;
+  getKeyByActivity: (activity?: DirectLineActivity) => string | undefined;
+  getKeyByActivityId: (activityKey?: string) => string | undefined;
+};
+
+export default createContext<ActivityKeyerContextType>(undefined);
+
+export type { ActivityKeyerContextType };

package/src/providers/ActivityKeyer/private/getActivityId.ts

@@ -0,0 +1,5 @@
+import type { DirectLineActivity } from 'botframework-webchat-core';
+
+export default function getActivityId(activity: DirectLineActivity): string {
+  return activity.id;
+}

package/src/providers/ActivityKeyer/private/getClientActivityId.ts

@@ -0,0 +1,5 @@
+import type { DirectLineActivity } from 'botframework-webchat-core';
+
+export default function getClientActivityId(activity: DirectLineActivity): string {
+  return activity.channelData?.clientActivityID;
+}

package/src/providers/ActivityKeyer/private/uniqueId.ts

@@ -0,0 +1,8 @@
+import random from 'math-random';
+
+// This format ID must be compatible with HTML "className" and "id" attribute.
+// It will be suffixed as "webchat__activity--{id}".
+export default function uniqueId(): string {
+  // eslint-disable-next-line no-magic-numbers
+  return random().toString(36).substring(2, 7);
+}

package/src/providers/ActivityKeyer/private/useContext.ts

@@ -0,0 +1,15 @@
+import { useContext } from 'react';
+
+import ActivityKeyerContext from './Context';
+
+import type { ActivityKeyerContextType } from './Context';
+
+export default function useActivityKeyerContext(thrownOnUndefined = true): ActivityKeyerContextType {
+  const contextValue = useContext(ActivityKeyerContext);
+
+  if (thrownOnUndefined && !contextValue) {
+    throw new Error('botframework-webchat internal: This hook can only be used under <ActivityKeyerComposer>.');
+  }
+
+  return contextValue;
+}

package/src/providers/ActivityKeyer/useActivityKeys.ts

@@ -0,0 +1,5 @@
+import useActivityKeyerContext from './private/useContext';
+
+export default function useActivityKeys(): readonly [readonly string[]] {
+  return useActivityKeyerContext().activityKeysState;
+}

package/src/providers/ActivityKeyer/useGetActivityByKey.ts

@@ -0,0 +1,7 @@
+import type { DirectLineActivity } from 'botframework-webchat-core';
+
+import useActivityKeyerContext from './private/useContext';
+
+export default function useGetActivityByKey(): (key?: string) => DirectLineActivity | undefined {
+  return useActivityKeyerContext().getActivityByKey;
+}

package/src/providers/ActivityKeyer/useGetKeyByActivity.ts

@@ -0,0 +1,7 @@
+import type { DirectLineActivity } from 'botframework-webchat-core';
+
+import useActivityKeyerContext from './private/useContext';
+
+export default function useGetKeyByActivity(): (activity?: DirectLineActivity) => string | undefined {
+  return useActivityKeyerContext().getKeyByActivity;
+}

package/src/providers/ActivityKeyer/useGetKeyByActivityId.ts

@@ -0,0 +1,5 @@
+import useActivityKeyerContext from './private/useContext';
+
+export default function useGetKeyByActivityId(): (activityId?: string) => string | undefined {
+  return useActivityKeyerContext().getKeyByActivityId;
+}

package/src/tsconfig.json

@@ -4,12 +4,14 @@
     "declaration": true,
     "declarationDir": "../lib",
     "declarationMap": true,
+    "downlevelIteration": true,
     "emitDeclarationOnly": true,
     "jsx": "react",
     "preserveWatchOutput": true,
     "pretty": true,
+    "resolveJsonModule": true, // Required for localization files
     "skipLibCheck": true,
     "sourceMap": true
   },
-  "files": ["index.tsx"]
+  "files": ["index.ts"]
 }

package/src/types/ActivityMiddleware.ts

@@ -0,0 +1,38 @@
+import { DirectLineActivity } from 'botframework-webchat-core';
+import { ReactNode } from 'react';
+
+import { AvatarComponentFactory } from './AvatarMiddleware';
+import { RenderAttachment } from './AttachmentMiddleware';
+
+type ActivityProps = {
+  hideTimestamp: boolean;
+  renderActivityStatus: ({ hideTimestamp: boolean }) => ReactNode;
+  renderAvatar: AvatarComponentFactory;
+  showCallout: boolean;
+};
+
+type ActivityComponent = (props: ActivityProps) => Exclude<ReactNode, boolean>;
+
+type ActivityComponentFactoryOptions = {
+  activity: DirectLineActivity;
+  nextVisibleActivity: DirectLineActivity;
+};
+
+type ActivityComponentFactory = (options: ActivityComponentFactoryOptions) => ActivityComponent | false;
+
+// TODO: [P2] This is inherited from our older signature (pre-hook) which requires passing "renderAttachment" argument.
+//       With hooks, the middleware should not need "renderAttachment", they can grab it from "useCreateAttachmentRenderer" hook.
+type LegacyRenderActivity = (
+  renderAttachment: RenderAttachment,
+  { hideTimestamp, renderActivityStatus, renderAvatar, showCallout }: ActivityProps
+) => Exclude<ReactNode, boolean>;
+
+type LegacyActivityRenderer = (options: ActivityComponentFactoryOptions) => LegacyRenderActivity | false;
+
+// The middleware created by the web developer, are using the legacy signature (with "renderAttachment" argument).
+type ActivityEnhancer = (next: LegacyActivityRenderer) => LegacyActivityRenderer;
+type ActivityMiddleware = () => ActivityEnhancer;
+
+export default ActivityMiddleware;
+
+export type { ActivityComponentFactory, LegacyActivityRenderer };

package/src/types/ActivityStatusMiddleware.ts

@@ -0,0 +1,28 @@
+import { DirectLineActivity } from 'botframework-webchat-core';
+import { ReactNode } from 'react';
+
+import SendState from './SendState';
+
+// TODO: Migrate this legacy middleware signature.
+type RenderActivityStatusOptions = {
+  activity: DirectLineActivity;
+  hideTimestamp: boolean;
+  sendState: SendState;
+
+  // "nextVisibleActivity" is for backward compatibility, please remove this line on or after 2022-07-22.
+  /** @deprecated */
+  nextVisibleActivity: DirectLineActivity;
+
+  // "sameTimestampGroup" is for backward compatibility, please remove this line on or after 2022-07-22.
+  /** @deprecated */
+  sameTimestampGroup: boolean;
+};
+
+type RenderActivityStatus = (options: RenderActivityStatusOptions) => ReactNode;
+
+type ActivityStatusEnhancer = (next: RenderActivityStatus) => RenderActivityStatus;
+type ActivityStatusMiddleware = () => ActivityStatusEnhancer;
+
+export default ActivityStatusMiddleware;
+
+export type { RenderActivityStatus };

package/src/types/AttachmentForScreenReaderMiddleware.ts

@@ -0,0 +1,24 @@
+import { DirectLineActivity, DirectLineAttachment } from 'botframework-webchat-core';
+
+// TODO: We should consider using a prop for "attachmentMiddleware" to render for screen reader, instead of having another middleware.
+
+import ComponentMiddleware, { ComponentFactory } from './ComponentMiddleware';
+
+type AttachmentForScreenReaderComponentFactoryOptions = [
+  {
+    activity: DirectLineActivity;
+    attachment: DirectLineAttachment;
+  }
+];
+
+type AttachmentForScreenReaderComponentFactory = ComponentFactory<AttachmentForScreenReaderComponentFactoryOptions, {}>;
+
+type AttachmentForScreenReaderMiddleware = ComponentMiddleware<
+  [],
+  AttachmentForScreenReaderComponentFactoryOptions,
+  {}
+>;
+
+export default AttachmentForScreenReaderMiddleware;
+
+export type { AttachmentForScreenReaderComponentFactory };

package/src/types/AttachmentMiddleware.ts

@@ -0,0 +1,16 @@
+import { DirectLineActivity, DirectLineAttachment } from 'botframework-webchat-core';
+import { ReactNode } from 'react';
+
+type AttachmentProps = {
+  activity: DirectLineActivity;
+  attachment: DirectLineAttachment;
+};
+
+type RenderAttachment = (props?: AttachmentProps) => ReactNode;
+
+type AttachmentEnhancer = (next: RenderAttachment) => RenderAttachment;
+type AttachmentMiddleware = () => AttachmentEnhancer;
+
+export default AttachmentMiddleware;
+
+export type { RenderAttachment };

package/src/types/AvatarMiddleware.ts

@@ -0,0 +1,20 @@
+import { DirectLineActivity } from 'botframework-webchat-core';
+
+import { StrictStyleOptions } from '../StyleOptions';
+import ComponentMiddleware, { ComponentFactory } from './ComponentMiddleware';
+
+type AvatarComponentFactoryArguments = [
+  {
+    activity: DirectLineActivity;
+    fromUser: boolean;
+    styleOptions: StrictStyleOptions;
+  }
+];
+
+type AvatarComponentFactory = ComponentFactory<AvatarComponentFactoryArguments, {}>;
+
+type AvatarMiddleware = ComponentMiddleware<[], AvatarComponentFactoryArguments, {}>;
+
+export default AvatarMiddleware;
+
+export type { AvatarComponentFactory };

package/src/types/CardActionMiddleware.ts

@@ -0,0 +1,21 @@
+import { DirectLineCardAction } from 'botframework-webchat-core';
+
+import FunctionMiddleware from './FunctionMiddleware';
+
+type PerformCardAction = (cardAction: DirectLineCardAction, { target: EventTarget }?) => void;
+
+type CardActionMiddleware = FunctionMiddleware<
+  [{ dispatch: (action: any) => void }],
+  [
+    {
+      cardAction: DirectLineCardAction;
+      getSignInUrl?: () => string;
+      target: any;
+    }
+  ],
+  {}
+>;
+
+export default CardActionMiddleware;
+
+export { PerformCardAction };

package/src/types/ComponentMiddleware.ts

@@ -0,0 +1,42 @@
+import { ReactNode } from 'react';
+
+type OnScreenReactNode = Exclude<ReactNode, boolean | null | undefined>;
+
+/**
+ * Renders a UI component by returning a React component, or `false`, if nothing should be rendered.
+ *
+ * @returns {(React.FC|false)} Returns a React component to render, or `false`, if nothing should be rendered.
+ */
+type ComponentFactory<TComponentFactoryArguments extends any[], TProps> = (
+  ...args: TComponentFactoryArguments
+) => ((props?: TProps) => OnScreenReactNode) | false;
+
+/**
+ * Enhances a UI component through decoration, replacement, or removal.
+ */
+type ComponentEnhancer<TComponentFactoryArguments extends any[], TProps> = (
+  next: ComponentFactory<TComponentFactoryArguments, TProps>
+) => ComponentFactory<TComponentFactoryArguments, TProps>;
+
+/**
+ * Middleware for rendering a UI component.
+ *
+ * The middleware is a series of enhancers that are chained through functional composition. Each enhancer can:
+ *
+ * - Decorate: call the next enhancer to get its React component, then decorate it through UI composition
+ * - Replace: return a React component without calling the next enhancer
+ * - Remove: return `false` without calling the next enhancer
+ *
+ * The signature of the middleware is:
+ *
+ * ```
+ * (...args: SetupArguments) => (next: Enhancer) => (...args: ComponentFactoryArguments) => false | React.FC<Props>
+ * ```
+ */
+type ComponentMiddleware<TSetupArguments extends any[], TComponentFactoryArguments extends any[], TProps> = (
+  ...args: TSetupArguments
+) => ComponentEnhancer<TComponentFactoryArguments, TProps>;
+
+export default ComponentMiddleware;
+
+export { ComponentEnhancer, ComponentFactory };

package/src/types/FunctionMiddleware.ts

@@ -0,0 +1,13 @@
+type CallFunction<TArguments extends any[], TResult> = (...args: TArguments) => TResult;
+
+type FunctionEnhancer<TCallArguments extends any[], TResult> = (
+  next: CallFunction<TCallArguments, TResult>
+) => CallFunction<TCallArguments, TResult>;
+
+type FunctionMiddleware<TSetupArguments extends any[], TCallArguments extends any[], TResult> = (
+  ...args: TSetupArguments
+) => FunctionEnhancer<TCallArguments, TResult>;
+
+export default FunctionMiddleware;
+
+export type { CallFunction, FunctionEnhancer };

package/src/types/GroupActivitiesMiddleware.ts

@@ -0,0 +1,24 @@
+import { DirectLineActivity } from 'botframework-webchat-core';
+
+import FunctionMiddleware, { CallFunction } from './FunctionMiddleware';
+
+type GroupActivities = CallFunction<
+  [{ activities: DirectLineActivity[] }],
+  {
+    sender: DirectLineActivity[][];
+    status: DirectLineActivity[][];
+  }
+>;
+
+type GroupActivitiesMiddleware = FunctionMiddleware<
+  [],
+  [{ activities: DirectLineActivity[] }],
+  {
+    sender: DirectLineActivity[][];
+    status: DirectLineActivity[][];
+  }
+>;
+
+export default GroupActivitiesMiddleware;
+
+export { GroupActivities };

package/src/types/LocalizedStrings.ts

@@ -0,0 +1,5 @@
+// boolean is for flags (e.g. support of speech-to-text or text-to-speech).
+// Look at "overrides.json" for details.
+type LocalizedStrings = { [stringId: string]: boolean | string };
+
+export default LocalizedStrings;

package/src/types/Notification.ts

@@ -0,0 +1,10 @@
+type Notification = {
+  alt: string;
+  data?: any;
+  id: string;
+  level: string;
+  message?: string;
+  timestamp?: number;
+};
+
+export default Notification;

package/src/types/PrecompiledGlobalize.ts

@@ -0,0 +1,9 @@
+type PrecompiledGlobalize = {
+  dateFormatter: ({ skeleton }: { skeleton: 'MMMMdhm' }) => string;
+  relativeTimeFormatter: (format: 'hour' | 'minute') => string;
+  unitFormatter:
+    | ((unit: 'byte', options: { form: 'long' }) => string)
+    | ((unit: 'kilobyte' | 'megabyte' | 'gigabyte', options: { form: 'short' }) => string);
+};
+
+export default PrecompiledGlobalize;

package/src/types/ScrollToEndButtonMiddleware.ts

@@ -0,0 +1,34 @@
+import { StrictStyleOptions } from '../StyleOptions';
+import ComponentMiddleware, { ComponentFactory } from './ComponentMiddleware';
+
+/**
+ * @type {object}
+ * @property {boolean} atEnd - `true`, if the transcript scroll view is at the end, otherwise, `false`.
+ * @property {object} styleOptions - Normalized style options.
+ * @property {boolean} unread - `true`, if there are unread messages in the transcripts, otherwise, `false`.
+ */
+type ScrollToEndButtonComponentArguments = [
+  {
+    atEnd: boolean;
+    styleOptions: StrictStyleOptions;
+    unread: boolean;
+  }
+];
+
+/**
+ * @type {object}
+ * @property {function} onClick - The callback function to call when the user click on the button.
+ */
+type ScrollToEndButtonProps = {
+  onClick: () => any;
+};
+
+/**
+ * The middleware for rendering scroll to end button.
+ */
+type ScrollToEndButtonMiddleware = ComponentMiddleware<[], ScrollToEndButtonComponentArguments, ScrollToEndButtonProps>;
+type ScrollToEndButtonComponentFactory = ComponentFactory<ScrollToEndButtonComponentArguments, ScrollToEndButtonProps>;
+
+export default ScrollToEndButtonMiddleware;
+
+export { ScrollToEndButtonComponentFactory };

package/src/types/SendState.ts

@@ -0,0 +1,3 @@
+type SendState = 'sending' | 'send failed' | 'sent';
+
+export default SendState;

package/src/types/TelemetryMeasurementEvent.ts

@@ -0,0 +1,44 @@
+type BaseTelemetryMeasurementEvent = {
+  dimension?: any;
+};
+
+type TelemetryEventMeasurementEvent = BaseTelemetryMeasurementEvent & {
+  type: 'event';
+  name: string;
+  level: 'debug' | 'info' | 'warn' | 'error';
+  data?: number | string | { [key: string]: number | string };
+};
+
+type TelemetryExceptionMeasurementEvent = BaseTelemetryMeasurementEvent & {
+  type: 'exception';
+  error: Error;
+  fatal: boolean;
+};
+
+type TelemetryTimingStartMeasurementEvent = BaseTelemetryMeasurementEvent & {
+  type: 'timingstart';
+  name: string;
+  timingId: string;
+};
+
+type TelemetryTimingEndMeasurementEvent = BaseTelemetryMeasurementEvent & {
+  type: 'timingend';
+  name: string;
+  timingId: string;
+  duration: number;
+};
+
+type TelemetryMeasurementEvent =
+  | TelemetryEventMeasurementEvent
+  | TelemetryExceptionMeasurementEvent
+  | TelemetryTimingStartMeasurementEvent
+  | TelemetryTimingEndMeasurementEvent;
+
+export default TelemetryMeasurementEvent;
+
+export {
+  TelemetryEventMeasurementEvent,
+  TelemetryExceptionMeasurementEvent,
+  TelemetryTimingStartMeasurementEvent,
+  TelemetryTimingEndMeasurementEvent
+};

package/src/types/ToastMiddleware.ts

@@ -0,0 +1,16 @@
+import { ReactNode } from 'react';
+
+import Notification from './Notification';
+
+type ToastProps = {
+  notification: Notification;
+};
+
+type RenderToast = (props: ToastProps) => ReactNode;
+
+type ToastEnhancer = (next: RenderToast) => RenderToast;
+type ToastMiddleware = () => ToastEnhancer;
+
+export default ToastMiddleware;
+
+export type { RenderToast };

package/src/types/Typing.ts

@@ -0,0 +1,8 @@
+type Typing = {
+  at: number;
+  expireAt: number;
+  name: string;
+  role: 'bot' | 'user';
+};
+
+export default Typing;

package/src/types/TypingIndicatorMiddleware.ts

@@ -0,0 +1,18 @@
+import { ReactNode } from 'react';
+
+import Typing from './Typing';
+
+type TypingIndicatorProps = {
+  activeTyping: { [id: string]: Typing };
+  typing: { [id: string]: Typing };
+  visible: boolean;
+};
+
+type RenderTypingIndicator = (props: TypingIndicatorProps) => ReactNode;
+
+type TypingIndicatorEnhancer = (next: RenderTypingIndicator) => RenderTypingIndicator;
+type TypingIndicatorMiddleware = () => TypingIndicatorEnhancer;
+
+export default TypingIndicatorMiddleware;
+
+export type { RenderTypingIndicator };