Merge branch 'primefaces:master' into new-feature-primefaces#4134

userkks · Jun 11, 2023 · eec800f · eec800f
2 parents afb1efa + beb97df
commit eec800f
Show file tree

Hide file tree

Showing 196 changed files with 4,675 additions and 667 deletions.
diff --git a/.github/workflows/comment_by_label.yml b/.github/workflows/comment_by_label.yml
@@ -16,7 +16,7 @@ jobs:
       pull-requests: write
     steps:
       - name: Add comment
-        uses: peter-evans/create-or-update-comment@ca08ebd5dc95aa0cd97021e9708fcd6b87138c9b
+        uses: peter-evans/create-or-update-comment@c6c9a1a66007646a28c153e2a8580a5bad27bcfa
         with:
           issue-number: ${{ github.event.issue.number }}
           body: |

diff --git a/components/doc/cascadeselect/pt/ptdoc.js b/components/doc/cascadeselect/pt/ptdoc.js
@@ -89,7 +89,6 @@ export function PTDoc(props) {
     optionLabel="cname"
     optionGroupLabel="name"
     optionGroupChildren={['states', 'cities']}
-    className="w-full md:w-14rem"
     breakpoint="767px"
     placeholder="Select a City"
     pt={{
@@ -189,7 +188,6 @@ export default function PTDemo() {
                 optionLabel="cname"
                 optionGroupLabel="name"
                 optionGroupChildren={['states', 'cities']}
-                className="w-full md:w-14rem"
                 breakpoint="767px"
                 placeholder="Select a City"
                 pt={{
@@ -332,7 +330,6 @@ export default function PTDemo() {
                     optionLabel="cname"
                     optionGroupLabel="name"
                     optionGroupChildren={['states', 'cities']}
-                    className="w-full md:w-14rem"
                     breakpoint="767px"
                     placeholder="Select a City"
                     pt={{

diff --git a/components/doc/common/apidoc/index.json b/components/doc/common/apidoc/index.json
diff --git a/components/doc/common/doccomponent.js b/components/doc/common/doccomponent.js
@@ -53,9 +53,9 @@ export function DocComponent(props) {
                 {tab === 0 ? (
                     <div className="doc-tabpanel">
                         <div className="doc-main">
-                            <div className="doc-intro">
+                            <div className="doc-intro doc-section-description">
                                 <h1>{props.header}</h1>
-                                <p>{props.description}</p>
+                                <p dangerouslySetInnerHTML={{ __html: props.description }}></p>
                             </div>
                             <DocSections docs={props.componentDocs} />
                         </div>

diff --git a/components/doc/customicons/fontawesomedoc.js b/components/doc/customicons/fontawesomedoc.js
@@ -4,7 +4,11 @@ import { DocSectionText } from '../common/docsectiontext';
 export function FontAwesomeDoc(props) {
     const code = {
         basic: `
-<Dropdown dropdownIcon={<i class="fa-light fa-chevron-down"></i>} />
+// use the CSS style directly
+<Dropdown dropdownIcon="fa-light fa-chevron-down" />
+
+// use the pre-built icons
+<Dropdown dropdownIcon={(options) => <FontAwesomeIcon icon={["fal", "chevron-down"]}  {...options.iconProps} /> } />
         `
     };
 

diff --git a/components/doc/customicons/imagedoc.js b/components/doc/customicons/imagedoc.js
@@ -4,7 +4,7 @@ import { DocSectionText } from '../common/docsectiontext';
 export function ImageDoc(props) {
     const code = {
         basic: `
-<Dropdown dropdownIcon={<img alt="dropdown icon" src="/icons/arrow_down.png" />} />
+<Dropdown dropdownIcon={(options) => <img alt="dropdown icon" src="/icons/arrow_down.png" {...options.iconProps} />} />
         `
     };
 

diff --git a/components/doc/customicons/materialdoc.js b/components/doc/customicons/materialdoc.js
@@ -4,7 +4,7 @@ import { DocSectionText } from '../common/docsectiontext';
 export function MaterialDoc(props) {
     const code = {
         basic: `
-<Dropdown dropdownIcon={<img alt="dropdown icon" src="/icons/arrow_down.png" />} />
+<Dropdown dropdownIcon={(options) => <img alt="dropdown icon" src="/icons/arrow_down.png" {...options.iconProps} />} />
         `
     };
 

diff --git a/components/doc/customicons/svgdoc.js b/components/doc/customicons/svgdoc.js
@@ -4,8 +4,8 @@ import { DocSectionText } from '../common/docsectiontext';
 export function SVGDoc(props) {
     const code = {
         basic: `
-<Dropdown dropdownIcon={
-    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24">
+<Dropdown dropdownIcon={(options) => 
+    <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" {...options.iconProps}>
         <g id="chevron-down">
             <path d="M12,15.25a.74.74,0,0,1-.53-.22l-5-5A.75.75,0,0,1,7.53,9L12,13.44,16.47,9A.75.75,0,0,1,17.53,10l-5,5A.74.74,0,0,1,12,15.25Z"/>
         </g>
@@ -16,7 +16,7 @@ export function SVGDoc(props) {
     return (
         <>
             <DocSectionText {...props}>
-                <p>Inline SVGs are embedded inside the dom.</p>
+                <p>Inline SVGs are embedded inside the DOM.</p>
             </DocSectionText>
             <DocSectionCode code={code} hideToggleCode import hideCodeSandbox hideStackBlitz />
         </>

diff --git a/components/doc/dock/advanceddoc.js b/components/doc/dock/advanceddoc.js
@@ -1,7 +1,7 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useContext, useEffect, useRef, useState } from 'react';
 import { NodeService } from '../../../service/NodeService';
 import { PhotoService } from '../../../service/PhotoService';
-import PrimeReact from '../../lib/api/Api';
+import { PrimeReactContext } from '../../lib/api/context';
 import { Dialog } from '../../lib/dialog/Dialog';
 import { Dock } from '../../lib/dock/Dock';
 import { Galleria } from '../../lib/galleria/Galleria';
@@ -22,6 +22,7 @@ export function AdvancedDoc(props) {
     const toast = useRef(null);
     const toast2 = useRef(null);
     const galleria = useRef(null);
+    const { setAppendTo } = useContext(PrimeReactContext);
 
     const dockItems = [
         {
@@ -254,15 +255,15 @@ export function AdvancedDoc(props) {
         PhotoService.getImages().then((data) => setImages(data));
         NodeService.getTreeNodes().then((data) => setNodes(data));
 
-        PrimeReact.appendTo = 'self';
+        setAppendTo('self');
 
         return () => {
             TerminalService.off('command', commandHandler);
 
             // reset
-            PrimeReact.appendTo = null;
+            setAppendTo(null);
         };
-    }, []);
+    }, []); // eslint-disable-line react-hooks/exhaustive-deps
 
     const start = <i className="pi pi-apple"></i>;
     const end = (
@@ -548,13 +549,13 @@ export default function AdvanceDemo() {
         PhotoService.getImages().then((data) => setImages(data));
         NodeService.getTreeNodes().then((data) => setNodes(data));
 
-        PrimeReact.appendTo = 'self';
+        setAppendTo('self');
 
         return () => {
             TerminalService.off('command', commandHandler);
 
             // reset
-            PrimeReact.appendTo = null;
+            setAppendTo(null);
         };
     }, []);
 
@@ -847,13 +848,13 @@ export default function AdvanceDemo() {
         PhotoService.getImages().then((data) => setImages(data));
         NodeService.getTreeNodes().then((data) => setNodes(data));
 
-        PrimeReact.appendTo = 'self';
+        setAppendTo('self');
 
         return () => {
             TerminalService.off('command', commandHandler);
 
             // reset
-            PrimeReact.appendTo = null;
+            setAppendTo(null);
         };
     }, []);
 

diff --git a/components/doc/editor/pt/ptdoc.js b/components/doc/editor/pt/ptdoc.js
@@ -11,7 +11,6 @@ export function PTDoc(props) {
 <Editor
     value={text}
     onTextChange={(e) => setText(e.htmlValue)}
-    style={{ height: '320px' }}
     pt={{
         content: { style: { height: '320px' } },
         toolbar: { className: 'surface-ground' }
@@ -30,7 +29,6 @@ export default function PTDemo() {
             <Editor
                 value={text}
                 onTextChange={(e) => setText(e.htmlValue)}
-                style={{ height: '320px' }}
                 pt={{
                     content: { style: { height: '320px' } },
                     toolbar: { className: 'surface-ground' }
@@ -52,7 +50,6 @@ export default function PTDemo() {
             <Editor
                 value={text}
                 onTextChange={(e) => setText(e.htmlValue)}
-                style={{ height: '320px' }}
                 pt={{
                     content: { style: { height: '320px' } },
                     toolbar: { className: 'surface-ground' }
@@ -71,7 +68,6 @@ export default function PTDemo() {
                 <Editor
                     value={text}
                     onTextChange={(e) => setText(e.htmlValue)}
-                    style={{ height: '320px' }}
                     pt={{
                         content: { style: { height: '320px' } },
                         toolbar: { className: 'surface-ground' }

diff --git a/components/doc/inputtextarea/form/formikdoc.js b/components/doc/inputtextarea/form/formikdoc.js
@@ -43,7 +43,7 @@ export function FormikDoc(props) {
         basic: `
 Toast ref={toast} />
 <InputTextarea
-    inputId="description"
+    inputid="description"
     name="description"
     rows={4}
     cols={30}
@@ -102,7 +102,7 @@ export default function FormikDoc() {
                 <label htmlFor="description">Description</label>
                 <Toast ref={toast} />
                 <InputTextarea
-                    inputId="description"
+                    inputid="description"
                     name="description"
                     rows={4}
                     cols={30}
@@ -165,7 +165,7 @@ export default function FormikDoc() {
                 <label htmlFor="description">Description</label>
                 <Toast ref={toast} />
                 <InputTextarea
-                    inputId="description"
+                    inputid="description"
                     name="description"
                     rows={4}
                     cols={30}
@@ -196,7 +196,7 @@ export default function FormikDoc() {
                     <label htmlFor="description">Description</label>
                     <Toast ref={toast} />
                     <InputTextarea
-                        inputId="description"
+                        inputid="description"
                         name="description"
                         rows={4}
                         cols={30}

diff --git a/components/doc/inputtextarea/pt/ptdoc.js b/components/doc/inputtextarea/pt/ptdoc.js
@@ -52,15 +52,15 @@ export default function PTDemo() {
     return (
         <div className="card flex justify-content-center">
             <InputTextarea
-            value={value}
-            onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) => setValue(e.target.value)}
-            pt={{
-                root: {
-                    rows: 5,
-                    cols: 30
-                }
-            }}
-        />
+                value={value}
+                onChange={(e: React.ChangeEvent<HTMLTextAreaElement>) => setValue(e.target.value)}
+                pt={{
+                    root: {
+                        rows: 5,
+                        cols: 30
+                    }
+                }}
+            />
         </div>
     )
 }