Add onRightIconClick to InputSearch

Author: Kubit

src/components/inputSearch/__tests__/inputSearch.test.tsx

@@ -35,6 +35,7 @@ const mockProps = {
   handleOpenOptions: jest.fn(),
   handleValueSelected: jest.fn(),
   handleClickInputSearch: jest.fn(),
+  handleIconClick: jest.fn(),
   onClick: jest.fn(),
   onIconClick: jest.fn(),
   onInputPopoverIconClick: jest.fn(),
@@ -133,14 +134,13 @@ describe('New Input Search Component', () => {
     expect(inputSearch).toHaveFocus();
   });
 
-  it('Should click input icon', async () => {
-    const onFocus = jest.fn();
-    renderProvider(<InputSearch {...mockProps} onFocus={onFocus} />);
+  it('Should click on input icon', () => {
+    renderProvider(<InputSearch {...mockProps} />);
+
+    const inputIcon = screen.getByLabelText('Open Info');
+    fireEvent.click(inputIcon);
 
-    const triggerButton = screen.getByRole('button', { name: 'Open Info' });
-    fireEvent.click(triggerButton);
-    fireEvent.click(triggerButton);
-    expect(mockProps.rightIcon.onClick).toHaveBeenCalledTimes(2);
+    expect(mockProps.rightIcon.onClick).toHaveBeenCalled();
   });
 
   it('Should render loading and valueSelected', async () => {

src/components/inputSearch/inputSearch.tsx

@@ -61,6 +61,7 @@ const InputSearchComponent = React.forwardRef(
       handleChangeInputSearch,
       handleClickInputSearch,
       handleIconClick,
+      handleRightIconClick,
       handleInputPopoverIconClick,
       handleOpenOptions,
       handleValueSelected,
@@ -84,6 +85,7 @@ const InputSearchComponent = React.forwardRef(
       regex,
       onClick,
       onIconClick: props.icon?.onClick,
+      onRightIconClick: props.rightIcon?.onClick,
       executeInternalOpenOptions,
       onInputPopoverIconClick,
       elementsToShow,
@@ -126,6 +128,7 @@ const InputSearchComponent = React.forwardRef(
         open={openOptions}
         optionList={optionsFiltered}
         regex={regex}
+        rightIcon={{ ...props.rightIcon, onClick: handleRightIconClick }}
         searchText={searchText}
         state={state}
         styles={styles}

src/components/inputSearch/stories/inputSearch.stories.tsx

@@ -42,7 +42,7 @@ const commonArgs: IInputSearch = {
   secondaryLabel: labelSecondary(themeSelected),
   additionalInfo: additionalInfoAction(themeSelected),
   label: { content: 'label', requiredSymbol: '*' },
-  icon: { icon: ICONS.ICON_PLACEHOLDER, altText: 'alternative' },
+  rightIcon: { icon: ICONS.ICON_PLACEHOLDER, altText: 'alternative' },
   placeholder: 'Select an option',
   closeIcon: { icon: ICONS.ICON_CLOSE },
   value: 'option5',

src/components/inputSearch/types/inputSearch.ts

@@ -132,7 +132,6 @@ type propsToOmitInputStandalone =
   | 'variant'
   | 'styles'
   | 'inputId'
-  | 'icon'
   | 'error'
   | 'disabled'
   | 'textCounter'
@@ -174,7 +173,6 @@ export interface IInputSearchStandAlone extends Omit<IInputStandAlone, propsToOm
   // actionBottomSheet
   sublabel?: OptionSublabelType;
   closeIcon?: IElementOrIcon;
-  icon?: IElementOrIcon;
   // input popover
   /**
    * @deprecated `inputPopoverIcon` will be removed. Use `popoverRightIcon` instead