Fix primefaces#4348: Dropdown optionGroupChildren fix

melloware · May 8, 2023 · deef231 · deef231
1 parent 6f0dd86
commit deef231
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 9 deletions.
diff --git a/components/lib/dropdown/Dropdown.js b/components/lib/dropdown/Dropdown.js
@@ -1,13 +1,13 @@
 import * as React from 'react';
 import PrimeReact, { FilterService } from '../api/Api';
 import { useMountEffect, useOverlayListener, useUnmountEffect, useUpdateEffect } from '../hooks/Hooks';
+import { ChevronDownIcon } from '../icons/chevrondown';
+import { TimesIcon } from '../icons/times';
 import { OverlayService } from '../overlayservice/OverlayService';
 import { Tooltip } from '../tooltip/Tooltip';
-import { classNames, DomHandler, IconUtils, ObjectUtils, ZIndexUtils } from '../utils/Utils';
+import { DomHandler, IconUtils, ObjectUtils, ZIndexUtils, classNames } from '../utils/Utils';
 import { DropdownBase } from './DropdownBase';
 import { DropdownPanel } from './DropdownPanel';
-import { ChevronDownIcon } from '../icons/chevrondown';
-import { TimesIcon } from '../icons/times';
 
 export const Dropdown = React.memo(
     React.forwardRef((inProps, ref) => {
@@ -50,7 +50,7 @@ export const Dropdown = React.memo(
                         let filteredSubOptions = FilterService.filter(getOptionGroupChildren(optgroup), searchFields, filterValue, props.filterMatchMode, props.filterLocale);
 
                         if (filteredSubOptions && filteredSubOptions.length) {
-                            filteredGroups.push({ ...optgroup, ...{ items: filteredSubOptions } });
+                            filteredGroups.push({ ...optgroup, ...{ [`${props.optionGroupChildren}`]: filteredSubOptions } });
                         }
                     }
 

diff --git a/components/lib/dropdown/DropdownBase.js b/components/lib/dropdown/DropdownBase.js
@@ -40,7 +40,7 @@ export const DropdownBase = {
         onMouseDown: null,
         onShow: null,
         optionDisabled: null,
-        optionGroupChildren: null,
+        optionGroupChildren: 'items',
         optionGroupLabel: null,
         optionGroupTemplate: null,
         optionLabel: null,

diff --git a/components/lib/dropdown/dropdown.d.ts b/components/lib/dropdown/dropdown.d.ts
@@ -190,6 +190,7 @@ export interface DropdownProps extends Omit<React.DetailedHTMLProps<React.InputH
     optionDisabled?: string | ((option: any) => boolean) | undefined;
     /**
      * Property name or getter function that refers to the children options of option group.
+     * @defaultValue items
      */
     optionGroupChildren?: string | undefined;
     /**

diff --git a/components/lib/scrolltop/ScrollTop.js b/components/lib/scrolltop/ScrollTop.js
@@ -93,20 +93,20 @@ export const ScrollTop = React.memo(
                 className: iconClassName
             },
             ptm('icon')
-        )
+        );
         const icon = props.icon || <ChevronUpIcon {...iconProps} />;
         const scrollIcon = IconUtils.getJSXIcon(icon, { ...iconProps }, { props });
         const rootProps = mergeProps(
             {
                 ref: scrollElementRef,
-                type: "button",
+                type: 'button',
                 className,
                 style: props.style,
                 onClick
             },
             ScrollTopBase.getOtherProps(props),
             ptm('root')
-        )
+        );
 
         return (
             <>

diff --git a/components/lib/splitter/__snapshots__/Splitter.spec.js.snap b/components/lib/splitter/__snapshots__/Splitter.spec.js.snap
@@ -8,6 +8,7 @@ exports[`Splitter Nested 1`] = `
   >
     <div
       class="p-splitter-panel flex align-items-center justify-content-center"
+      role="presentation"
       style="flex-basis: calc(20% - 4px);"
     >
       Panel 1
@@ -22,13 +23,15 @@ exports[`Splitter Nested 1`] = `
     </div>
     <div
       class="p-splitter-panel p-splitter-panel-nested"
+      role="presentation"
       style="flex-basis: calc(80% - 4px);"
     >
       <div
         class="p-splitter p-component p-splitter-vertical"
       >
         <div
           class="p-splitter-panel flex align-items-center justify-content-center"
+          role="presentation"
           style="flex-basis: calc(15% - 4px);"
         >
           Panel 2
@@ -43,13 +46,15 @@ exports[`Splitter Nested 1`] = `
         </div>
         <div
           class="p-splitter-panel p-splitter-panel-nested"
+          role="presentation"
           style="flex-basis: calc(85% - 4px);"
         >
           <div
             class="p-splitter p-component p-splitter-horizontal"
           >
             <div
               class="p-splitter-panel flex align-items-center justify-content-center"
+              role="presentation"
               style="flex-basis: calc(20% - 4px);"
             >
               Panel 3
@@ -64,6 +69,7 @@ exports[`Splitter Nested 1`] = `
             </div>
             <div
               class="p-splitter-panel flex align-items-center justify-content-center"
+              role="presentation"
               style="flex-basis: calc(80% - 4px);"
             >
               Panel 4
@@ -84,6 +90,7 @@ exports[`Splitter Single Panel with size 1`] = `
   >
     <div
       class="p-splitter-panel"
+      role="presentation"
       style="flex-basis: calc(5% - 0px);"
     >
       Panel 1
@@ -108,6 +115,7 @@ exports[`Splitter Single Panel without size 1`] = `
   >
     <div
       class="p-splitter-panel"
+      role="presentation"
       style="flex-basis: calc(100% - 0px);"
     >
       Panel 1
@@ -132,6 +140,7 @@ exports[`Splitter Splitter requires two SplitterPanel components to wrap. 1`] =
   >
     <div
       class="p-splitter-panel flex align-items-center justify-content-center"
+      role="presentation"
       style="flex-basis: calc(50% - 4px);"
     >
       Panel 1
@@ -146,6 +155,7 @@ exports[`Splitter Splitter requires two SplitterPanel components to wrap. 1`] =
     </div>
     <div
       class="p-splitter-panel flex align-items-center justify-content-center"
+      role="presentation"
       style="flex-basis: calc(50% - 4px);"
     >
       Panel 2
@@ -162,6 +172,7 @@ exports[`Splitter Vertical layout 1`] = `
   >
     <div
       class="p-splitter-panel"
+      role="presentation"
       style="flex-basis: calc(50% - 4px);"
     >
       Panel 1
@@ -176,6 +187,7 @@ exports[`Splitter Vertical layout 1`] = `
     </div>
     <div
       class="p-splitter-panel"
+      role="presentation"
       style="flex-basis: calc(50% - 4px);"
     >
       Panel 2

diff --git a/pages/scrolltop/index.js b/pages/scrolltop/index.js
@@ -56,7 +56,16 @@ const ScrollTopDemo = () => {
         }
     ];
 
-    return <DocComponent title="React ScrollTop Component" header="ScrollTop" description="ScrollTop gets displayed when it gets into viewport and used to navigate back to the top of the page." componentDocs={docs} apiDocs={['ScrollTop']} ptDocs={ptDocs} />;
+    return (
+        <DocComponent
+            title="React ScrollTop Component"
+            header="ScrollTop"
+            description="ScrollTop gets displayed when it gets into viewport and used to navigate back to the top of the page."
+            componentDocs={docs}
+            apiDocs={['ScrollTop']}
+            ptDocs={ptDocs}
+        />
+    );
 };
 
 export default ScrollTopDemo;