Refactor #3244 (#3311)

components/lib/autocomplete/AutoComplete.js

@@ -657,65 +657,65 @@ AutoComplete.displayName = 'AutoComplete';
 AutoComplete.defaultProps = {
     __TYPE: 'AutoComplete',
     id: null,
-    inputRef: null,
-    value: null,
-    name: null,
-    type: 'text',
-    suggestions: null,
-    field: null,
-    optionGroupLabel: null,
-    optionGroupChildren: null,
-    optionGroupTemplate: null,
-    forceSelection: false,
+    'aria-label': null,
+    'aria-labelledby': null,
+    appendTo: null,
+    autoFocus: false,
     autoHighlight: false,
-    virtualScrollerOptions: null,
-    scrollHeight: '200px',
+    className: null,
+    completeMethod: null,
+    delay: 300,
+    disabled: false,
     dropdown: false,
-    dropdownMode: 'blank',
     dropdownAutoFocus: true,
-    multiple: false,
-    minLength: 1,
-    delay: 300,
-    style: null,
-    className: null,
+    dropdownIcon: 'pi pi-chevron-down',
+    dropdownMode: 'blank',
+    emptyMessage: null,
+    field: null,
+    forceSelection: false,
+    inputClassName: null,
     inputId: null,
+    inputRef: null,
     inputStyle: null,
-    inputClassName: null,
+    itemTemplate: null,
+    maxLength: null,
+    minLength: 1,
+    multiple: false,
+    name: null,
+    onBlur: null,
+    onChange: null,
+    onClear: null,
+    onClick: null,
+    onContextMenu: null,
+    onDblClick: null,
+    onDropdownClick: null,
+    onFocus: null,
+    onHide: null,
+    onKeyPress: null,
+    onKeyUp: null,
+    onMouseDown: null,
+    onSelect: null,
+    onShow: null,
+    onUnselect: null,
+    optionGroupChildren: null,
+    optionGroupLabel: null,
+    optionGroupTemplate: null,
     panelClassName: null,
     panelStyle: null,
     placeholder: null,
     readOnly: false,
-    disabled: false,
-    maxLength: null,
-    size: null,
-    appendTo: null,
+    removeIcon: 'pi pi-times-circle',
+    scrollHeight: '200px',
+    selectedItemTemplate: null,
     showEmptyMessage: false,
-    emptyMessage: null,
+    size: null,
+    style: null,
+    suggestions: null,
     tabIndex: null,
-    autoFocus: false,
     tooltip: null,
     tooltipOptions: null,
-    completeMethod: null,
-    itemTemplate: null,
-    selectedItemTemplate: null,
     transitionOptions: null,
-    dropdownIcon: 'pi pi-chevron-down',
-    removeIcon: 'pi pi-times-circle',
-    'aria-label': null,
-    'aria-labelledby': null,
-    onChange: null,
-    onFocus: null,
-    onBlur: null,
-    onSelect: null,
-    onUnselect: null,
-    onDropdownClick: null,
-    onClick: null,
-    onDblClick: null,
-    onMouseDown: null,
-    onKeyUp: null,
-    onKeyPress: null,
-    onContextMenu: null,
-    onClear: null,
-    onShow: null,
-    onHide: null
+    type: 'text',
+    value: null,
+    virtualScrollerOptions: null
 };

components/lib/autocomplete/AutoCompletePanel.js

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import  { localeOption } from '../api/Api';
+import { localeOption } from '../api/Api';
 import { CSSTransition } from '../csstransition/CSSTransition';
 import { Portal } from '../portal/Portal';
 import { Ripple } from '../ripple/Ripple';
@@ -47,6 +47,7 @@ export const AutoCompletePanel = React.memo(
                 );
             } else {
                 const content = props.itemTemplate ? ObjectUtils.getJSXElement(props.itemTemplate, suggestion, index) : props.field ? ObjectUtils.resolveFieldData(suggestion, props.field) : suggestion;
+
                 return (
                     <li key={index} role="option" aria-selected={props.selectedItem === suggestion} className="p-autocomplete-item" style={style} onClick={(e) => props.onItemClick(e, suggestion)}>
                         {content}
@@ -62,13 +63,15 @@ export const AutoCompletePanel = React.memo(
 
         const createContent = () => {
             if (props.showEmptyMessage && ObjectUtils.isEmpty(props.suggestions)) {
-                const emptyMessage = props.emptyMessage || localeOptions('emptyMessage');
+                const emptyMessage = props.emptyMessage || localeOption('emptyMessage');
+
                 return (
                     <ul className="p-autocomplete-items">
                         <li className="p-autocomplete-item">{emptyMessage}</li>
                     </ul>
                 );
             }
+
             if (props.virtualScrollerOptions) {
                 const virtualScrollerProps = {
                     ...props.virtualScrollerOptions,
@@ -92,6 +95,7 @@ export const AutoCompletePanel = React.memo(
                 return <VirtualScroller ref={props.virtualScrollerRef} {...virtualScrollerProps} />;
             } else {
                 const items = createItems();
+
                 return (
                     <ul className="p-autocomplete-items" role="listbox" id={props.listId}>
                         {items}

components/lib/autocomplete/autocomplete.d.ts

@@ -1,8 +1,8 @@
 import * as React from 'react';
-import TooltipOptions from '../tooltip/tooltipoptions';
-import { VirtualScrollerProps, VirtualScroller } from '../virtualscroller';
 import { CSSTransitionProps } from '../csstransition';
+import TooltipOptions from '../tooltip/tooltipoptions';
 import { IconType } from '../utils';
+import { VirtualScroller, VirtualScrollerProps } from '../virtualscroller';
 
 type AutoCompleteOptionGroupTemplateType = React.ReactNode | ((suggestion: any, index: number) => React.ReactNode);
 
@@ -47,66 +47,66 @@ interface AutoCompleteCompleteMethodParams {
 
 export interface AutoCompleteProps extends Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, 'onChange' | 'onSelect' | 'ref'> {
     id?: string;
-    inputRef?: React.Ref<HTMLInputElement>;
-    value?: any;
-    name?: string;
-    type?: string;
-    suggestions?: any[];
-    field?: string;
-    optionGroupLabel?: string;
-    optionGroupChildren?: string;
-    optionGroupTemplate?: AutoCompleteOptionGroupTemplateType;
-    forceSelection?: boolean;
+    appendTo?: AutoCompleteAppendToType;
+    autoFocus?: boolean;
     autoHighlight?: boolean;
-    virtualScrollerOptions?: VirtualScrollerProps;
-    scrollHeight?: string;
+    children?: React.ReactNode;
+    className?: string;
+    delay?: number;
+    disabled?: boolean;
     dropdown?: boolean;
-    dropdownMode?: string;
     dropdownAutoFocus?: boolean;
-    multiple?: boolean;
-    minLength?: number;
-    delay?: number;
-    style?: object;
-    className?: string;
+    dropdownIcon?: IconType<AutoCompleteProps>;
+    dropdownMode?: string;
+    emptyMessage?: string;
+    field?: string;
+    forceSelection?: boolean;
+    inputClassName?: string;
     inputId?: string;
+    inputRef?: React.Ref<HTMLInputElement>;
     inputStyle?: object;
-    inputClassName?: string;
+    itemTemplate?: AutoCompleteItemTemplateType;
+    maxLength?: number;
+    minLength?: number;
+    multiple?: boolean;
+    name?: string;
+    optionGroupChildren?: string;
+    optionGroupLabel?: string;
+    optionGroupTemplate?: AutoCompleteOptionGroupTemplateType;
     panelClassName?: string;
     panelStyle?: object;
     placeholder?: string;
     readOnly?: boolean;
-    disabled?: boolean;
+    removeIcon?: IconType<AutoCompleteProps>;
+    scrollHeight?: string;
+    selectedItemTemplate?: AutoCompleteSelectedItemTemplateType;
     showEmptyMessage?: boolean;
-    emptyMessage?: string;
-    maxLength?: number;
     size?: number;
-    appendTo?: AutoCompleteAppendToType;
+    style?: object;
+    suggestions?: any[];
     tabIndex?: number;
-    autoFocus?: boolean;
     tooltip?: string;
     tooltipOptions?: TooltipOptions;
-    completeMethod?(e: AutoCompleteCompleteMethodParams): void;
-    itemTemplate?: AutoCompleteItemTemplateType;
-    selectedItemTemplate?: AutoCompleteSelectedItemTemplateType;
     transitionOptions?: CSSTransitionProps;
-    dropdownIcon?: IconType<AutoCompleteProps>;
-    removeIcon?: IconType<AutoCompleteProps>;
-    onChange?(e: AutoCompleteChangeParams): void;
-    onFocus?(event: React.FocusEvent<HTMLInputElement>): void;
+    type?: string;
+    value?: any;
+    virtualScrollerOptions?: VirtualScrollerProps;
+    completeMethod?(e: AutoCompleteCompleteMethodParams): void;
     onBlur?(event: React.FocusEvent<HTMLInputElement>): void;
-    onSelect?(e: AutoCompleteSelectParams): void;
-    onUnselect?(e: AutoCompleteUnselectParams): void;
-    onDropdownClick?(e: AutoCompleteDropdownClickParams): void;
+    onChange?(e: AutoCompleteChangeParams): void;
+    onClear?(event: React.SyntheticEvent): void;
     onClick?(event: React.MouseEvent<HTMLElement>): void;
+    onContextMenu?(event: React.MouseEvent<HTMLElement>): void;
     onDblClick?(event: React.MouseEvent<HTMLElement>): void;
-    onMouseDown?(event: React.MouseEvent<HTMLElement>): void;
-    onKeyUp?(event: React.KeyboardEvent<HTMLInputElement>): void;
+    onDropdownClick?(e: AutoCompleteDropdownClickParams): void;
+    onFocus?(event: React.FocusEvent<HTMLInputElement>): void;
+    onHide?(): void;
     onKeyPress?(event: React.KeyboardEvent<HTMLInputElement>): void;
-    onContextMenu?(event: React.MouseEvent<HTMLElement>): void;
-    onClear?(event: React.SyntheticEvent): void;
+    onKeyUp?(event: React.KeyboardEvent<HTMLInputElement>): void;
+    onMouseDown?(event: React.MouseEvent<HTMLElement>): void;
+    onSelect?(e: AutoCompleteSelectParams): void;
     onShow?(): void;
-    onHide?(): void;
-    children?: React.ReactNode;
+    onUnselect?(e: AutoCompleteUnselectParams): void;
 }
 
 export declare class AutoComplete extends React.Component<AutoCompleteProps, any> {