#4602: Add NONCE to inline style

primefaces · Jul 13, 2023 · 88fe7bd · 88fe7bd
1 parent 2f479cd
commit 88fe7bd
Showing 1 changed file with 3 additions and 6 deletions.
diff --git a/components/lib/hooks/useStyle.js b/components/lib/hooks/useStyle.js
@@ -1,4 +1,4 @@
-import { useEffect, useRef, useState } from 'react';
+import { useContext, useEffect, useRef, useState } from 'react';
 import PrimeReact, { PrimeReactContext } from '../api/Api';
 import { DomHandler } from '../utils/Utils';
 
@@ -7,7 +7,7 @@ let _id = 0;
 export const useStyle = (css, options = {}) => {
     const [isLoaded, setIsLoaded] = useState(false);
     const styleRef = useRef(null);
-    const context = React.useContext(PrimeReactContext);
+    const context = useContext(PrimeReactContext);
 
     const defaultDocument = DomHandler.isClient() ? window.document : undefined;
     const { document = defaultDocument, immediate = true, manual = false, name = `style_${++_id}`, id = undefined, media = undefined } = options;
@@ -19,15 +19,12 @@ export const useStyle = (css, options = {}) => {
     const load = () => {
         if (!document) return;
 
-        styleRef.current = document.querySelector(`style[data-primereact-style-id="${name}"]`) || document.getElementById(id) || document.createElement('style');
+        styleRef.current = document.querySelector(`style[data-primereact-style-id="${name}"]`) || document.getElementById(id) || DomHandler.createInlineStyle((context && context.nonce) || PrimeReact.nonce);
 
         if (!styleRef.current.isConnected) {
             styleRef.current.type = 'text/css';
             id && (styleRef.current.id = id);
             media && (styleRef.current.media = media);
-
-            DomHandler.addNonce(styleRef.current, (context && context.nonce) || PrimeReact.nonce);
-            document.head.appendChild(styleRef.current);
             name && styleRef.current.setAttribute('data-primereact-style-id', name);
         }