Unclear Input action API

Steps

• browse to the docs site
• select Input
• read the action api docs

Expected Result

• knowledge on how to use an action and/or <Icon /> whilst attaching addition attrs/props to it (e.g. onClick, className, etc)

Actual Result

• docs on how to use an <Icon /> without attaching any other attrs

Version

0.71.3

Testcase

https://codepen.io/cdaringe/pen/YxZyPR

mentioned in chat, sans any real discussion: https://gitter.im/Semantic-Org/Semantic-UI-React?at=5988b080bc464729746030e4

[layershifter]

@cdaringe Semantic UI accepts only button as action, that’s why your first Input looks ugly.

The action prop on Input implements a shorthand for Button, so code below is equal:

<Input action={<Button icon='delete' onClick={onIconClick} />} />
<Input action={{ icon: 'delete', onClick: onIconClick }} />

Shorthands should be better documented and issue already exists #561.

[layershifter]

Please use StackOverflow to usage questions.