Add asterisk if input is required

4 files changed, 8 insertions, 1 deletions

diff --git a/packages/forms/src/input/index.tsx b/packages/forms/src/input/index.tsx
index ab1c33315..5178904d3 100644
--- a/packages/forms/src/input/index.tsx
+++ b/packages/forms/src/input/index.tsx
@@ -105,6 +105,7 @@ class InputComponent extends Component<IProps, IState> {
       min,
       max,
       step,
+      required,
     } = this.props;
 
     const {
@@ -123,6 +124,7 @@ class InputComponent extends Component<IProps, IState> {
           title={label}
           showLabel={showLabel}
           htmlFor={id}
+          isRequired={required}
         >
           <div
             className={classnames({
diff --git a/packages/forms/src/label/index.tsx b/packages/forms/src/label/index.tsx
index 590270a06..1b33ba22c 100644
--- a/packages/forms/src/label/index.tsx
+++ b/packages/forms/src/label/index.tsx
@@ -9,6 +9,7 @@ import styles from './styles';
 
 interface ILabel extends IFormField, React.LabelHTMLAttributes<HTMLLabelElement> {
   classes: Classes;
+  isRequired: boolean;
 }
 
 class LabelComponent extends Component<ILabel> {
@@ -24,6 +25,7 @@ class LabelComponent extends Component<ILabel> {
       className,
       children,
       htmlFor,
+      isRequired,
     } = this.props;
 
     if (!showLabel) return children;
@@ -36,7 +38,7 @@ class LabelComponent extends Component<ILabel> {
         htmlFor={htmlFor}
       >
         {showLabel && (
-          <span className={classes.label}>{title}</span>
+          <span className={classes.label}>{title}{isRequired && ' *'}</span>
         )}
         <div className={classes.content}>
           {children}
diff --git a/packages/forms/src/select/index.tsx b/packages/forms/src/select/index.tsx
index 4a9e3c56e..f419d0351 100644
--- a/packages/forms/src/select/index.tsx
+++ b/packages/forms/src/select/index.tsx
@@ -306,6 +306,7 @@ class SelectComponent extends Component<IProps> {
       showLabel,
       showSearch,
       onChange,
+      required,
     } = this.props;
 
     const {
@@ -334,6 +335,7 @@ class SelectComponent extends Component<IProps> {
           title={label}
           showLabel={showLabel}
           htmlFor={id}
+          isRequired={required}
         >
           <div
             className={classnames({
diff --git a/packages/forms/src/typings/generic.ts b/packages/forms/src/typings/generic.ts
index b7f2fc452..9688ce2c7 100644
--- a/packages/forms/src/typings/generic.ts
+++ b/packages/forms/src/typings/generic.ts
@@ -5,6 +5,7 @@ export interface IFormField {
   showLabel?: boolean;
   label?: string;
   error?: string;
+  required?: boolean;
 }
 
 export interface IWithStyle {