botframework-webchat-fluent-theme 4.18.1-main.20250505.5e12798 → 4.18.1-main.20250515.4c7400a

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "botframework-webchat-fluent-theme",
-  "version": "4.18.1-main.20250505.5e12798",
+  "version": "4.18.1-main.20250515.4c7400a",
   "description": "Fluent theme for Bot Framework Web Chat",
   "main": "./dist/botframework-webchat-fluent-theme.js",
   "types": "./dist/botframework-webchat-fluent-theme.d.ts",
@@ -61,10 +61,6 @@
     "@types/react": [
       "16",
       "react@16.8.6 is our baseline"
-    ],
-    "valibot": [
-      "0",
-      "valibot@0 until they finalize @1"
     ]
   },
   "devDependencies": {
@@ -72,20 +68,20 @@
     "@types/math-random": "^1.0.2",
     "@types/node": "^22.13.4",
     "@types/react": "^16.14.62",
-    "botframework-webchat-base": "4.18.1-main.20250505.5e12798",
-    "botframework-webchat-styles": "4.18.1-main.20250505.5e12798",
+    "botframework-webchat-base": "4.18.1-main.20250515.4c7400a",
+    "botframework-webchat-styles": "4.18.1-main.20250515.4c7400a",
     "tsup": "^8.3.6",
     "typescript": "^5.7.3"
   },
   "dependencies": {
-    "botframework-webchat-api": "4.18.1-main.20250505.5e12798",
-    "botframework-webchat-component": "4.18.1-main.20250505.5e12798",
-    "botframework-webchat-core": "4.18.1-main.20250505.5e12798",
+    "botframework-webchat-api": "4.18.1-main.20250515.4c7400a",
+    "botframework-webchat-component": "4.18.1-main.20250515.4c7400a",
+    "botframework-webchat-core": "4.18.1-main.20250515.4c7400a",
     "classnames": "2.5.1",
     "inject-meta-tag": "0.0.1",
     "math-random": "2.0.1",
     "use-ref-from": "0.1.0",
-    "valibot": "0.42.1"
+    "valibot": "1.1.0"
   },
   "peerDependencies": {
     "react": ">= 16.8.6"

package/src/private/FluentThemeProvider.tsx

@@ -1,5 +1,10 @@
 import { type ActivityMiddleware, type StyleOptions, type TypingIndicatorMiddleware } from 'botframework-webchat-api';
-import { DecoratorComposer, DecoratorMiddleware } from 'botframework-webchat-api/decorator';
+import {
+  DecoratorComposer,
+  DecoratorMiddleware,
+  type DecoratorMiddlewareInit,
+  type DecoratorMiddlewareTypes
+} from 'botframework-webchat-api/decorator';
 import { Components } from 'botframework-webchat-component';
 import { WebChatDecorator } from 'botframework-webchat-component/decorator';
 import React, { memo, type ReactNode } from 'react';
@@ -18,7 +23,10 @@ import VariantComposer, { VariantList } from './VariantComposer';
 
 const { ThemeProvider } = Components;
 
-type Props = Readonly<{ children?: ReactNode | undefined; variant?: VariantList | undefined }>;
+type FluentThemeProviderProps = Readonly<{
+  children?: ReactNode | undefined;
+  variant?: VariantList | undefined;
+}>;
 
 const activityMiddleware: readonly ActivityMiddleware[] = Object.freeze([
   () =>
@@ -45,11 +53,14 @@ const activityMiddleware: readonly ActivityMiddleware[] = Object.freeze([
 
 const sendBoxMiddleware = [() => () => () => PrimarySendBox];
 
-const decoratorMiddleware: DecoratorMiddleware[] = [
-  init =>
+const decoratorMiddleware: readonly DecoratorMiddleware[] = Object.freeze([
+  (init: DecoratorMiddlewareInit) =>
     init === 'activity border' &&
-    (next => request => (request.livestreamingState === 'preparing' ? ActivityLoader : next(request)))
-];
+    ((next => request =>
+      request.livestreamingState === 'preparing'
+        ? ActivityLoader
+        : next(request)) satisfies DecoratorMiddlewareTypes['activity border'])
+]);
 
 const styles = createStyles();
 
@@ -64,26 +75,29 @@ const typingIndicatorMiddleware = Object.freeze([
       args[0].visible ? <SlidingDotsTypingIndicator /> : next(...args)
 ] satisfies TypingIndicatorMiddleware[]);
 
-const FluentThemeProvider = ({ children, variant = 'fluent' }: Props) => (
-  <VariantComposer variant={variant}>
-    <WebChatTheme>
-      <TelephoneKeypadProvider>
-        <ThemeProvider
-          activityMiddleware={activityMiddleware}
-          sendBoxMiddleware={sendBoxMiddleware}
-          styleOptions={fluentStyleOptions}
-          styles={styles}
-          typingIndicatorMiddleware={typingIndicatorMiddleware}
-        >
-          <AssetComposer>
-            <WebChatDecorator>
-              <DecoratorComposer middleware={decoratorMiddleware}>{children}</DecoratorComposer>
-            </WebChatDecorator>
-          </AssetComposer>
-        </ThemeProvider>
-      </TelephoneKeypadProvider>
-    </WebChatTheme>
-  </VariantComposer>
-);
+function FluentThemeProvider({ children, variant = 'fluent' }: FluentThemeProviderProps) {
+  return (
+    <VariantComposer variant={variant}>
+      <WebChatTheme>
+        <TelephoneKeypadProvider>
+          <ThemeProvider
+            activityMiddleware={activityMiddleware}
+            sendBoxMiddleware={sendBoxMiddleware}
+            styleOptions={fluentStyleOptions}
+            styles={styles}
+            typingIndicatorMiddleware={typingIndicatorMiddleware}
+          >
+            <AssetComposer>
+              <WebChatDecorator>
+                <DecoratorComposer middleware={decoratorMiddleware}>{children}</DecoratorComposer>
+              </WebChatDecorator>
+            </AssetComposer>
+          </ThemeProvider>
+        </TelephoneKeypadProvider>
+      </WebChatTheme>
+    </VariantComposer>
+  );
+}
 
 export default memo(FluentThemeProvider);
+export { type FluentThemeProviderProps };