@fluentui/react-provider 9.22.13 → 9.22.14

package/CHANGELOG.md

@@ -1,12 +1,22 @@
 # Change Log - @fluentui/react-provider
 
-This log was last generated on Thu, 22 Jan 2026 17:01:21 GMT and should not be manually modified.
+This log was last generated on Thu, 12 Feb 2026 10:42:44 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [9.22.14](https://github.com/microsoft/fluentui/tree/@fluentui/react-provider_v9.22.14)
+
+Thu, 12 Feb 2026 10:42:44 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-provider_v9.22.13..@fluentui/react-provider_v9.22.14)
+
+### Patches
+
+- fix: prevent XSS theme vulnerability during SSR ([PR #35717](https://github.com/microsoft/fluentui/pull/35717) by martinhochel@microsoft.com)
+- Bump @fluentui/react-jsx-runtime to v9.4.0 ([PR #35743](https://github.com/microsoft/fluentui/pull/35743) by beachball)
+
 ## [9.22.13](https://github.com/microsoft/fluentui/tree/@fluentui/react-provider_v9.22.13)
 
-Thu, 22 Jan 2026 17:01:21 GMT 
+Thu, 22 Jan 2026 17:06:37 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-provider_v9.22.12..@fluentui/react-provider_v9.22.13)
 
 ### Patches

package/lib/components/FluentProvider/createCSSRuleFromTheme.js

@@ -1,3 +1,17 @@
+const CSS_ESCAPE_MAP = {
+    '<': '\\3C ',
+    '>': '\\3E '
+};
+/**
+ * Escapes characters that could break out of a <style> tag during SSR.
+ *
+ * IMPORTANT: Do not strip quotes. Theme values legitimately include quoted font families and other CSS.
+ * We only need to ensure the generated text cannot terminate the style tag and inject HTML.
+ */ function escapeForStyleTag(value) {
+    // Escape as CSS code points so the resulting CSS still represents the same characters.
+    // Using CSS escapes prevents the HTML parser from seeing a literal '<' / '>' and closing <style>.
+    return value.replace(/[<>]/g, (match)=>CSS_ESCAPE_MAP[match]);
+}
 /**
  * Creates a CSS rule from a theme object.
  *
@@ -7,7 +21,7 @@
         const cssVarsAsString = Object.keys(theme).reduce((cssVarRule, cssVar)=>{
             return `${cssVarRule}--${cssVar}: ${theme[cssVar]}; `;
         }, '');
-        return `${selector} { ${cssVarsAsString} }`;
+        return `${selector} { ${escapeForStyleTag(cssVarsAsString)} }`;
     }
     return `${selector} {}`;
 }

package/lib/components/FluentProvider/createCSSRuleFromTheme.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/FluentProvider/createCSSRuleFromTheme.ts"],"sourcesContent":["import type { PartialTheme } from '@fluentui/react-theme';\n\n/**\n * Creates a CSS rule from a theme object.\n *\n * Useful for scenarios when you want to apply theming statically to a top level elements like `body`.\n */\nexport function createCSSRuleFromTheme(selector: string, theme: PartialTheme | undefined): string {\n  if (theme) {\n    const cssVarsAsString = (Object.keys(theme) as (keyof typeof theme)[]).reduce((cssVarRule, cssVar) => {\n      return `${cssVarRule}--${cssVar}: ${theme[cssVar]}; `;\n    }, '');\n\n    return `${selector} { ${cssVarsAsString} }`;\n  }\n\n  return `${selector} {}`;\n}\n"],"names":["createCSSRuleFromTheme","selector","theme","cssVarsAsString","Object","keys","reduce","cssVarRule","cssVar"],"mappings":"AAEA;;;;CAIC,GACD,OAAO,SAASA,uBAAuBC,QAAgB,EAAEC,KAA+B;IACtF,IAAIA,OAAO;QACT,MAAMC,kBAAkB,AAACC,OAAOC,IAAI,CAACH,OAAkCI,MAAM,CAAC,CAACC,YAAYC;YACzF,OAAO,GAAGD,WAAW,EAAE,EAAEC,OAAO,EAAE,EAAEN,KAAK,CAACM,OAAO,CAAC,EAAE,CAAC;QACvD,GAAG;QAEH,OAAO,GAAGP,SAAS,GAAG,EAAEE,gBAAgB,EAAE,CAAC;IAC7C;IAEA,OAAO,GAAGF,SAAS,GAAG,CAAC;AACzB"}
+{"version":3,"sources":["../src/components/FluentProvider/createCSSRuleFromTheme.ts"],"sourcesContent":["import type { PartialTheme } from '@fluentui/react-theme';\n\nconst CSS_ESCAPE_MAP = {\n  '<': '\\\\3C ',\n  '>': '\\\\3E ',\n};\n/**\n * Escapes characters that could break out of a <style> tag during SSR.\n *\n * IMPORTANT: Do not strip quotes. Theme values legitimately include quoted font families and other CSS.\n * We only need to ensure the generated text cannot terminate the style tag and inject HTML.\n */\nfunction escapeForStyleTag(value: string): string {\n  // Escape as CSS code points so the resulting CSS still represents the same characters.\n  // Using CSS escapes prevents the HTML parser from seeing a literal '<' / '>' and closing <style>.\n  return value.replace(/[<>]/g, match => CSS_ESCAPE_MAP[match as keyof typeof CSS_ESCAPE_MAP]);\n}\n\n/**\n * Creates a CSS rule from a theme object.\n *\n * Useful for scenarios when you want to apply theming statically to a top level elements like `body`.\n */\nexport function createCSSRuleFromTheme(selector: string, theme: PartialTheme | undefined): string {\n  if (theme) {\n    const cssVarsAsString = (Object.keys(theme) as (keyof typeof theme)[]).reduce((cssVarRule, cssVar) => {\n      return `${cssVarRule}--${cssVar}: ${theme[cssVar]}; `;\n    }, '');\n\n    return `${selector} { ${escapeForStyleTag(cssVarsAsString)} }`;\n  }\n\n  return `${selector} {}`;\n}\n"],"names":["CSS_ESCAPE_MAP","escapeForStyleTag","value","replace","match","createCSSRuleFromTheme","selector","theme","cssVarsAsString","Object","keys","reduce","cssVarRule","cssVar"],"mappings":"AAEA,MAAMA,iBAAiB;IACrB,KAAK;IACL,KAAK;AACP;AACA;;;;;CAKC,GACD,SAASC,kBAAkBC,KAAa;IACtC,uFAAuF;IACvF,kGAAkG;IAClG,OAAOA,MAAMC,OAAO,CAAC,SAASC,CAAAA,QAASJ,cAAc,CAACI,MAAqC;AAC7F;AAEA;;;;CAIC,GACD,OAAO,SAASC,uBAAuBC,QAAgB,EAAEC,KAA+B;IACtF,IAAIA,OAAO;QACT,MAAMC,kBAAkB,AAACC,OAAOC,IAAI,CAACH,OAAkCI,MAAM,CAAC,CAACC,YAAYC;YACzF,OAAO,GAAGD,WAAW,EAAE,EAAEC,OAAO,EAAE,EAAEN,KAAK,CAACM,OAAO,CAAC,EAAE,CAAC;QACvD,GAAG;QAEH,OAAO,GAAGP,SAAS,GAAG,EAAEL,kBAAkBO,iBAAiB,EAAE,CAAC;IAChE;IAEA,OAAO,GAAGF,SAAS,GAAG,CAAC;AACzB"}

package/lib-commonjs/components/FluentProvider/createCSSRuleFromTheme.js

@@ -1,8 +1,4 @@
-/**
- * Creates a CSS rule from a theme object.
- *
- * Useful for scenarios when you want to apply theming statically to a top level elements like `body`.
- */ "use strict";
+"use strict";
 Object.defineProperty(exports, "__esModule", {
     value: true
 });
@@ -12,12 +8,26 @@ Object.defineProperty(exports, "createCSSRuleFromTheme", {
         return createCSSRuleFromTheme;
     }
 });
+const CSS_ESCAPE_MAP = {
+    '<': '\\3C ',
+    '>': '\\3E '
+};
+/**
+ * Escapes characters that could break out of a <style> tag during SSR.
+ *
+ * IMPORTANT: Do not strip quotes. Theme values legitimately include quoted font families and other CSS.
+ * We only need to ensure the generated text cannot terminate the style tag and inject HTML.
+ */ function escapeForStyleTag(value) {
+    // Escape as CSS code points so the resulting CSS still represents the same characters.
+    // Using CSS escapes prevents the HTML parser from seeing a literal '<' / '>' and closing <style>.
+    return value.replace(/[<>]/g, (match)=>CSS_ESCAPE_MAP[match]);
+}
 function createCSSRuleFromTheme(selector, theme) {
     if (theme) {
         const cssVarsAsString = Object.keys(theme).reduce((cssVarRule, cssVar)=>{
             return `${cssVarRule}--${cssVar}: ${theme[cssVar]}; `;
         }, '');
-        return `${selector} { ${cssVarsAsString} }`;
+        return `${selector} { ${escapeForStyleTag(cssVarsAsString)} }`;
     }
     return `${selector} {}`;
 }

package/lib-commonjs/components/FluentProvider/createCSSRuleFromTheme.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/FluentProvider/createCSSRuleFromTheme.ts"],"sourcesContent":["import type { PartialTheme } from '@fluentui/react-theme';\n\n/**\n * Creates a CSS rule from a theme object.\n *\n * Useful for scenarios when you want to apply theming statically to a top level elements like `body`.\n */\nexport function createCSSRuleFromTheme(selector: string, theme: PartialTheme | undefined): string {\n  if (theme) {\n    const cssVarsAsString = (Object.keys(theme) as (keyof typeof theme)[]).reduce((cssVarRule, cssVar) => {\n      return `${cssVarRule}--${cssVar}: ${theme[cssVar]}; `;\n    }, '');\n\n    return `${selector} { ${cssVarsAsString} }`;\n  }\n\n  return `${selector} {}`;\n}\n"],"names":["createCSSRuleFromTheme","selector","theme","cssVarsAsString","Object","keys","reduce","cssVarRule","cssVar"],"mappings":"AAEA;;;;CAIC,GACD;;;;;;;;;;AAAO,SAASA,uBAAuBC,QAAgB,EAAEC,KAA+B;IACtF,IAAIA,OAAO;QACT,MAAMC,kBAAmBC,OAAOC,IAAI,CAACH,OAAkCI,MAAM,CAAC,CAACC,YAAYC;YACzF,OAAO,GAAGD,WAAW,EAAE,EAAEC,OAAO,EAAE,EAAEN,KAAK,CAACM,OAAO,CAAC,EAAE,CAAC;QACvD,GAAG;QAEH,OAAO,GAAGP,SAAS,GAAG,EAAEE,gBAAgB,EAAE,CAAC;IAC7C;IAEA,OAAO,GAAGF,SAAS,GAAG,CAAC;AACzB"}
+{"version":3,"sources":["../src/components/FluentProvider/createCSSRuleFromTheme.ts"],"sourcesContent":["import type { PartialTheme } from '@fluentui/react-theme';\n\nconst CSS_ESCAPE_MAP = {\n  '<': '\\\\3C ',\n  '>': '\\\\3E ',\n};\n/**\n * Escapes characters that could break out of a <style> tag during SSR.\n *\n * IMPORTANT: Do not strip quotes. Theme values legitimately include quoted font families and other CSS.\n * We only need to ensure the generated text cannot terminate the style tag and inject HTML.\n */\nfunction escapeForStyleTag(value: string): string {\n  // Escape as CSS code points so the resulting CSS still represents the same characters.\n  // Using CSS escapes prevents the HTML parser from seeing a literal '<' / '>' and closing <style>.\n  return value.replace(/[<>]/g, match => CSS_ESCAPE_MAP[match as keyof typeof CSS_ESCAPE_MAP]);\n}\n\n/**\n * Creates a CSS rule from a theme object.\n *\n * Useful for scenarios when you want to apply theming statically to a top level elements like `body`.\n */\nexport function createCSSRuleFromTheme(selector: string, theme: PartialTheme | undefined): string {\n  if (theme) {\n    const cssVarsAsString = (Object.keys(theme) as (keyof typeof theme)[]).reduce((cssVarRule, cssVar) => {\n      return `${cssVarRule}--${cssVar}: ${theme[cssVar]}; `;\n    }, '');\n\n    return `${selector} { ${escapeForStyleTag(cssVarsAsString)} }`;\n  }\n\n  return `${selector} {}`;\n}\n"],"names":["CSS_ESCAPE_MAP","escapeForStyleTag","value","replace","match","createCSSRuleFromTheme","selector","theme","cssVarsAsString","Object","keys","reduce","cssVarRule","cssVar"],"mappings":";;;;+BAuBgBK;;;;;;AArBhB,MAAML,iBAAiB;IACrB,KAAK;IACL,KAAK;AACP;AACA;;;;;CAKC,GACD,SAASC,kBAAkBC,KAAa;IACtC,uFAAuF;IACvF,kGAAkG;IAClG,OAAOA,MAAMC,OAAO,CAAC,SAASC,CAAAA,QAASJ,cAAc,CAACI,MAAqC;AAC7F;AAOO,gCAAgCE,QAAgB,EAAEC,KAA+B;IACtF,IAAIA,OAAO;QACT,MAAMC,kBAAmBC,OAAOC,IAAI,CAACH,OAAkCI,MAAM,CAAC,CAACC,YAAYC;YACzF,OAAO,GAAGD,WAAW,EAAE,EAAEC,OAAO,EAAE,EAAEN,KAAK,CAACM,OAAO,CAAC,EAAE,CAAC;QACvD,GAAG;QAEH,OAAO,GAAGP,SAAS,GAAG,EAAEL,kBAAkBO,iBAAiB,EAAE,CAAC;IAChE;IAEA,OAAO,GAAGF,SAAS,GAAG,CAAC;AACzB"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-provider",
-  "version": "9.22.13",
+  "version": "9.22.14",
   "description": "Fluent UI React provider component",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -17,7 +17,7 @@
     "@fluentui/react-tabster": "^9.26.12",
     "@fluentui/react-theme": "^9.2.1",
     "@fluentui/react-utilities": "^9.26.1",
-    "@fluentui/react-jsx-runtime": "^9.3.5",
+    "@fluentui/react-jsx-runtime": "^9.4.0",
     "@griffel/core": "^1.16.0",
     "@griffel/react": "^1.5.32",
     "@swc/helpers": "^0.5.1"