In addition to the props above, InputButton accepts all the props the Input component does. #### A input with a button should be used in scenarios where the field needs its own button. Newsletter sign up, postal code input and promo code application are some common use case examples. ### 👍 Dos - Use it when more fields will be loaded below after submission, or when what was typed will be applied. - Use it when you have an input and a button in-line and the button is directly related to the input. - Use it in its large size when it's you might need to call attention to the input's existence or it carries importance in the context. ### 👎 Don'ts - Don't use it exclusively for validating information that has been typed, prefer to do that automatically. - Don't use it in situations where the input might be read-only or when there's more than one button directly related to the input. - Don't use it in cramped spaces where the user might not be able to comfortably type the expected response, prefer to use the default input with a button below. ### Related components - Consider using a default input with a suffix if you need to display information (e.g. tooltip) that doesn't qualify as a action. - Use a InputSearch for search purposes or a InputPassword for password purposes. With submit button ```js ;
``` Loading state ```js initialState = { isLoading: false };
{ e.preventDefault setState({ isLoading: true }) setTimeout(() => { setState({ isLoading: false }) }, 1200) } }>
``` Disabled ```js ;
```