Refactor #4602 - Add parentMetadata to related components

primefaces · Sep 12, 2023 · adef94d · adef94d
1 parent fcbeb00
commit adef94d
Show file tree

Hide file tree

Showing 48 changed files with 267 additions and 101 deletions.
diff --git a/components/lib/autocomplete/AutoComplete.js b/components/lib/autocomplete/AutoComplete.js
@@ -21,15 +21,18 @@ export const AutoComplete = React.memo(
         const [searchingState, setSearchingState] = React.useState(false);
         const [focusedState, setFocusedState] = React.useState(false);
         const [overlayVisibleState, setOverlayVisibleState] = React.useState(false);
-        const { ptm, cx, sx, isUnstyled } = AutoCompleteBase.setMetaData({
+
+        const metaData = {
             props,
             state: {
                 id: idState,
                 searching: searchingState,
                 focused: focusedState,
                 overlayVisible: overlayVisibleState
             }
-        });
+        };
+
+        const { ptm, cx, sx, isUnstyled } = AutoCompleteBase.setMetaData(metaData);
 
         useHandleStyle(AutoCompleteBase.css.styles, isUnstyled, { name: 'autocomplete' });
         const elementRef = React.useRef(null);
@@ -551,6 +554,7 @@ export const AutoComplete = React.memo(
                     onDoubleClick={props.onDblClick}
                     pt={ptm('input')}
                     {...ariaProps}
+                    __parentMetadata={{ parent: metaData }}
                 />
             );
         };
@@ -667,7 +671,18 @@ export const AutoComplete = React.memo(
             if (props.dropdown) {
                 const ariaLabel = props.dropdownAriaLabel || props.placeholder || localeOption('choose');
 
-                return <Button type="button" icon={props.dropdownIcon || <ChevronDownIcon />} className={cx('dropdownButton')} disabled={props.disabled} onClick={onDropdownClick} aria-label={ariaLabel} pt={ptm('dropdownButton')} />;
+                return (
+                    <Button
+                        type="button"
+                        icon={props.dropdownIcon || <ChevronDownIcon />}
+                        className={cx('dropdownButton')}
+                        disabled={props.disabled}
+                        onClick={onDropdownClick}
+                        aria-label={ariaLabel}
+                        pt={ptm('dropdownButton')}
+                        __parentMetadata={{ parent: metaData }}
+                    />
+                );
             }
 
             return null;

diff --git a/components/lib/badge/Badge.js b/components/lib/badge/Badge.js
@@ -10,7 +10,8 @@ export const Badge = React.memo(
         const props = BadgeBase.getProps(inProps, context);
 
         const { ptm, cx, isUnstyled } = BadgeBase.setMetaData({
-            props
+            props,
+            ...props.__parentMetadata
         });
 
         useHandleStyle(BadgeBase.css.styles, isUnstyled, { name: 'badge' });

diff --git a/components/lib/badge/BadgeBase.js b/components/lib/badge/BadgeBase.js
@@ -50,6 +50,7 @@ const styles = `
 export const BadgeBase = ComponentBase.extend({
     defaultProps: {
         __TYPE: 'Badge',
+        __parentMetadata: null,
         value: null,
         severity: null,
         size: null,

diff --git a/components/lib/button/Button.js b/components/lib/button/Button.js
@@ -14,13 +14,15 @@ export const Button = React.memo(
         const props = ButtonBase.getProps(inProps, context);
         const disabled = props.disabled || props.loading;
 
-        const { ptm, cx, isUnstyled } = ButtonBase.setMetaData({
+        const metaData = {
             props,
-            ...inProps.__parentMetadata,
+            ...props.__parentMetadata,
             context: {
                 disabled
             }
-        });
+        };
+
+        const { ptm, cx, isUnstyled } = ButtonBase.setMetaData(metaData);
 
         useHandleStyle(ButtonBase.css.styles, isUnstyled, { name: 'button', styled: true });
 
@@ -83,7 +85,8 @@ export const Button = React.memo(
                     {
                         className: classNames(props.badgeClassName),
                         value: props.badge,
-                        unstyled: props.unstyled
+                        unstyled: props.unstyled,
+                        __parentMetadata: { parent: metaData }
                     },
                     ptm('badge')
                 );

diff --git a/components/lib/calendar/Calendar.js b/components/lib/calendar/Calendar.js
@@ -22,14 +22,15 @@ export const Calendar = React.memo(
         const [focusedState, setFocusedState] = React.useState(false);
         const [overlayVisibleState, setOverlayVisibleState] = React.useState(false);
         const [viewDateState, setViewDateState] = React.useState(null);
-        const { ptm, cx, isUnstyled } = CalendarBase.setMetaData({
+        const metaData = {
             props,
             state: {
                 focused: focusedState,
                 overlayVisible: overlayVisibleState,
                 viewDate: viewDateState
             }
-        });
+        };
+        const { ptm, cx, isUnstyled } = CalendarBase.setMetaData(metaData);
 
         useHandleStyle(CalendarBase.css.styles, isUnstyled, { name: 'calendar' });
         const elementRef = React.useRef(null);
@@ -3539,6 +3540,7 @@ export const Calendar = React.memo(
                         tooltip={props.tooltip}
                         tooltipOptions={props.tooltipOptions}
                         pt={ptm('input')}
+                        __parentMetadata={{ parent: metaData }}
                     />
                 );
             }
@@ -3548,7 +3550,7 @@ export const Calendar = React.memo(
 
         const createButton = () => {
             if (props.showIcon) {
-                return <Button type="button" icon={props.icon || <CalendarIcon />} onClick={onButtonClick} tabIndex="-1" disabled={props.disabled} className={cx('dropdownButton')} pt={ptm('dropdownButton')} />;
+                return <Button type="button" icon={props.icon || <CalendarIcon />} onClick={onButtonClick} tabIndex="-1" disabled={props.disabled} className={cx('dropdownButton')} pt={ptm('dropdownButton')} __parentMetadata={{ parent: metaData }} />;
             }
 
             return null;

diff --git a/components/lib/componentbase/ComponentBase.js b/components/lib/componentbase/ComponentBase.js
@@ -1,9 +1,9 @@
 import { useEffect } from 'react';
 import PrimeReact from '../api/Api';
 import { useStyle } from '../hooks/Hooks';
-import { ObjectUtils } from '../utils/Utils';
 import { Tailwind } from '../passthrough/tailwind';
 import { mergeProps } from '../utils/MergeProps';
+import { ObjectUtils } from '../utils/Utils';
 
 const buttonStyles = `
 .p-button {

diff --git a/components/lib/confirmdialog/ConfirmDialog.js b/components/lib/confirmdialog/ConfirmDialog.js
@@ -40,12 +40,13 @@ export const ConfirmDialog = React.memo(
         const acceptLabel = getPropValue('acceptLabel') || localeOption('accept');
         const rejectLabel = getPropValue('rejectLabel') || localeOption('reject');
 
-        const { ptm, cx } = ConfirmDialogBase.setMetaData({
+        const metaData = {
             props,
             state: {
                 visible: visibleState
             }
-        });
+        };
+        const { ptm, cx } = ConfirmDialogBase.setMetaData(metaData);
 
         const accept = () => {
             if (!isCallbackExecuting.current) {
@@ -140,7 +141,10 @@ export const ConfirmDialog = React.memo(
                 className: classNames(getPropValue('rejectClassName'), cx('rejectButton', { getPropValue })),
                 onClick: reject,
                 pt: ptm('rejectButton'),
-                unstyled: props.unstyled
+                unstyled: props.unstyled,
+                __parentMetadata: {
+                    parent: metaData
+                }
             };
 
             const acceptButtonProps = mergeProps(
@@ -149,7 +153,10 @@ export const ConfirmDialog = React.memo(
                     icon: getPropValue('acceptIcon'),
                     className: classNames(getPropValue('acceptClassName'), cx('acceptButton')),
                     onClick: accept,
-                    unstyled: props.unstyled
+                    unstyled: props.unstyled,
+                    __parentMetadata: {
+                        parent: metaData
+                    }
                 },
                 ptm('acceptButton')
             );
@@ -209,7 +216,10 @@ export const ConfirmDialog = React.memo(
                     breakpoints: getPropValue('breakpoints'),
                     pt: currentProps.pt,
                     unstyled: props.unstyled,
-                    appendTo: getPropValue('appendTo')
+                    appendTo: getPropValue('appendTo'),
+                    __parentMetadata: {
+                        parent: metaData
+                    }
                 },
                 ConfirmDialogBase.getOtherProps(currentProps)
             );

diff --git a/components/lib/confirmpopup/ConfirmPopup.js b/components/lib/confirmpopup/ConfirmPopup.js
@@ -1,13 +1,13 @@
 import * as React from 'react';
 import PrimeReact, { PrimeReactContext, localeOption } from '../api/Api';
 import { Button } from '../button/Button';
+import { useHandleStyle } from '../componentbase/ComponentBase';
 import { CSSTransition } from '../csstransition/CSSTransition';
 import { useOverlayListener, useUnmountEffect, useUpdateEffect } from '../hooks/Hooks';
 import { OverlayService } from '../overlayservice/OverlayService';
 import { Portal } from '../portal/Portal';
 import { DomHandler, IconUtils, ObjectUtils, ZIndexUtils, classNames, mergeProps } from '../utils/Utils';
 import { ConfirmPopupBase } from './ConfirmPopupBase';
-import { useHandleStyle } from '../componentbase/ComponentBase';
 
 export const confirmPopup = (props = {}) => {
     props = { ...props, ...{ visible: props.visible === undefined ? true : props.visible } };
@@ -31,13 +31,14 @@ export const ConfirmPopup = React.memo(
 
         const [visibleState, setVisibleState] = React.useState(props.visible);
         const [reshowState, setReshowState] = React.useState(false);
-        const { ptm, cx, isUnstyled } = ConfirmPopupBase.setMetaData({
+        const metaData = {
             props,
             state: {
                 visible: visibleState,
                 reshow: reshowState
             }
-        });
+        };
+        const { ptm, cx, isUnstyled } = ConfirmPopupBase.setMetaData(metaData);
 
         useHandleStyle(ConfirmPopupBase.css.styles, isUnstyled, { name: 'confirmpopup' });
 
@@ -279,7 +280,10 @@ export const ConfirmPopup = React.memo(
                 className: cx('rejectButton', { getPropValue }),
                 onClick: reject,
                 pt: ptm('rejectButton'),
-                unstyled: props.unstyled
+                unstyled: props.unstyled,
+                __parentMetadata: {
+                    parent: metaData
+                }
             });
 
             const acceptButtonProps = mergeProps({
@@ -289,7 +293,10 @@ export const ConfirmPopup = React.memo(
                 className: cx('acceptButton', { getPropValue }),
                 onClick: accept,
                 pt: ptm('acceptButton'),
-                unstyled: props.unstyled
+                unstyled: props.unstyled,
+                __parentMetadata: {
+                    parent: metaData
+                }
             });
 
             const content = (

diff --git a/components/lib/datatable/ColumnFilter.js b/components/lib/datatable/ColumnFilter.js
@@ -493,6 +493,7 @@ export const ColumnFilter = React.memo((props) => {
                 maxLength={getColumnProp('filterMaxLength')}
                 aria-label={getColumnProp('filterPlaceholder')}
                 unstyled={props.unstyled}
+                __parentMetadata={{ parent: props.metaData }}
             />
         );
     };
@@ -669,7 +670,15 @@ export const ColumnFilter = React.memo((props) => {
 
             return (
                 <div {...filterOperatorProps}>
-                    <Dropdown options={options} value={value} onChange={onOperatorChange} className="p-column-filter-operator-dropdown" pt={getColumnPTOptions('filterOperatorDropdown')} unstyled={props.unstyled} />
+                    <Dropdown
+                        options={options}
+                        value={value}
+                        onChange={onOperatorChange}
+                        className="p-column-filter-operator-dropdown"
+                        pt={getColumnPTOptions('filterOperatorDropdown')}
+                        unstyled={props.unstyled}
+                        __parentMetadata={{ parent: props.metaData }}
+                    />
                 </div>
             );
         }
@@ -709,6 +718,7 @@ export const ColumnFilter = React.memo((props) => {
                     label={removeRuleLabel}
                     pt={getColumnPTOptions('filterRemoveButton')}
                     unstyled={props.unstyled}
+                    __parentMetadata={{ parent: props.metaData }}
                 />
             );
         }

diff --git a/components/lib/dataview/DataView.js b/components/lib/dataview/DataView.js
@@ -80,13 +80,14 @@ export const DataView = React.memo(
         const props = DataViewBase.getProps(inProps, context);
         const [firstState, setFirstState] = React.useState(props.first);
         const [rowsState, setRowsState] = React.useState(props.rows);
-        const { ptm, cx, isUnstyled } = DataViewBase.setMetaData({
+        const metaData = {
             props,
             state: {
                 first: firstState,
                 rows: rowsState
             }
-        });
+        };
+        const { ptm, cx, isUnstyled } = DataViewBase.setMetaData(metaData);
 
         useHandleStyle(DataViewBase.css.styles, isUnstyled, { name: 'dataview' });
 
@@ -123,6 +124,7 @@ export const DataView = React.memo(
                     dropdownAppendTo={props.paginatorDropdownAppendTo}
                     ptm={ptm('paginator')}
                     unstyled={props.unstyled}
+                    __parentMetadata={{ parent: metaData }}
                 />
             );
         };

diff --git a/components/lib/dialog/Dialog.js b/components/lib/dialog/Dialog.js
@@ -39,6 +39,7 @@ export const Dialog = React.forwardRef((inProps, ref) => {
 
     const { ptm, cx, sx, isUnstyled } = DialogBase.setMetaData({
         props,
+        ...props.__parentMetadata,
         state: {
             id: idState,
             maximized: maximized,

diff --git a/components/lib/dialog/DialogBase.js b/components/lib/dialog/DialogBase.js
@@ -244,6 +244,7 @@ const inlineStyles = {
 export const DialogBase = ComponentBase.extend({
     defaultProps: {
         __TYPE: 'Dialog',
+        __parentMetadata: null,
         appendTo: null,
         ariaCloseIconLabel: null,
         baseZIndex: 0,

diff --git a/components/lib/dropdown/Dropdown.js b/components/lib/dropdown/Dropdown.js
@@ -30,6 +30,7 @@ export const Dropdown = React.memo(
         const appendTo = props.appendTo || (context && context.appendTo) || PrimeReact.appendTo;
         const { ptm, cx, sx, isUnstyled } = DropdownBase.setMetaData({
             props,
+            ...props.__parentMetadata,
             state: {
                 filter: filterState,
                 focused: focusedState,

diff --git a/components/lib/dropdown/DropdownBase.js b/components/lib/dropdown/DropdownBase.js
@@ -148,6 +148,7 @@ const inlineStyles = {
 export const DropdownBase = ComponentBase.extend({
     defaultProps: {
         __TYPE: 'Dropdown',
+        __parentMetadata: null,
         appendTo: null,
         ariaLabel: null,
         ariaLabelledBy: null,