Modal, how to get access to onBlur method?

[raptoria]

I'm using the modal in a slightly different way, controlling it's opening/closing using an event dispatcher. I'd like to use the native React event handler onBlur so that I can do so:
<Modal open={true} dimmer={false} onBlur={this.handleClose} ... >

private handleClose = () => ModalWindowService.closeModal();

Of course, since I'm using TypeScript and I'm a n00b at it, I get this error:

ERROR in ./src/components/Modal/AssignBasketModal/AssignBasketModal.tsx
(34,55): error TS2339: Property 'onBlur' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<ModalProps, ComponentState>> & { childre...'.

I've realized that setting closeOnDocumentClick to true would do the same thing, however, I noticed this functionality doesn't work if the Modal open={true}

[levithomason]

You may need to update to 0.66.0. Could you confirm the version you are? @layershifter recently finished updating all props and typings to allow for this.

I've realized that setting closeOnDocumentClick to true would do the same thing, however, I noticed this functionality doesn't work if the Modal open={true}

Indeed, closeOnDocumentClick can only control the state for you if you are not setting it yourself. Setting open will cause the component to delegate control to you, so that your prop value is not overridden.

[raptoria]

I just got 0.66.0 and you're right, the error is gone now for closeOnDocumentClick.
I have another problem after upgrading, however, with the Dropdown inside of a Menu..

   <Menu inverted className={styles.root} attached='top'>
        <Dropdown className="item" text='File'>
          <Dropdown.Menu className={styles.dropdownMenu} >
            <Dropdown.Item icon='file' text='New Order Entry' />
            <Dropdown.Item icon='shopping basket' text='New Basket' />
            <Dropdown.Item icon='download' text='Load Portfolio' />
            <Dropdown.Item icon='file excel outline' text='Export to Excel' />
            <Dropdown.Item icon='sign out' text='Quit  Application' />
           </Dropdown.Menu>
          </Dropdown>
   </Menu>

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onBlur' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onChange' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onClick' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onClose' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onFocus' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onLabelClick' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onMouseDown' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onOpen' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(17,9): error TS2324: Property 'onSearchChange' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownProps, ComponentState>> & { chil...'.

ERROR in ./src/components/TopMenu/TopMenu.tsx
(19,13): error TS2324: Property 'onClick' is missing in type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<DropdownItemProps, ComponentState>> & { ...'.`

[levithomason]

Hm, I'm not sure on this one (not a ts user). All those props are listed in the component and the typings. @layershifter sure knows the answer here.

---

Side note, you should now use <Dropdown item text='File'> rather than className.

[layershifter]

Oh, my miss 😢 PR is comming...

[raptoria]

i tried <Dropdown item text='File'> but it said the 'item' property was missing too.

[layershifter]

@raptoria Let's check again when version with #1401 will be released

[levithomason]

In about 10 minutes 😄

[levithomason]

Or an hour... Released in [email protected].

[raptoria]

everything working perfectly in 0.67! 👍 you guys are awesome