[core] feat(NumericInput, FileInput): add "small" modifier prop

packages/core/src/components/forms/fileInput.tsx

@@ -67,6 +67,11 @@ export interface IFileInputProps extends React.LabelHTMLAttributes<HTMLLabelElem
      */
     onInputChange?: React.FormEventHandler<HTMLInputElement>;
 
+    /**
+     * Whether the file input should appear with small styling.
+     */
+    small?: boolean;
+
     /**
      * The text to display.
      *
@@ -108,6 +113,7 @@ export class FileInput extends AbstractPureComponent2<FileInputProps> {
             inputProps,
             large,
             onInputChange,
+            small,
             text,
             ...htmlProps
         } = this.props;
@@ -119,6 +125,7 @@ export class FileInput extends AbstractPureComponent2<FileInputProps> {
                 [Classes.DISABLED]: disabled,
                 [Classes.FILL]: fill,
                 [Classes.LARGE]: large,
+                [Classes.SMALL]: small,
             },
             className,
         );

packages/core/src/components/forms/numericInput.tsx

@@ -144,6 +144,15 @@ export interface INumericInputProps extends InputSharedProps {
      */
     selectAllOnIncrement?: boolean;
 
+    /**
+     * If set to `true`, the input will display with smaller styling.
+     * This is equivalent to setting `Classes.SMALL` via className on the
+     * parent control group and on the child input group.
+     *
+     * @default false
+     */
+    small?: boolean;
+
     /**
      * The increment between successive values when no modifier keys are held.
      *
@@ -218,6 +227,7 @@ export class NumericInput extends AbstractPureComponent2<HTMLInputProps & Numeri
         minorStepSize: 0.1,
         selectAllOnFocus: false,
         selectAllOnIncrement: false,
+        small: false,
         stepSize: 1,
     };
 
@@ -305,8 +315,12 @@ export class NumericInput extends AbstractPureComponent2<HTMLInputProps & Numeri
     private getCurrentValueAsNumber = () => Number(parseStringToStringNumber(this.state.value, this.props.locale));
 
     public render() {
-        const { buttonPosition, className, fill, large } = this.props;
-        const containerClasses = classNames(Classes.NUMERIC_INPUT, { [Classes.LARGE]: large }, className);
+        const { buttonPosition, className, fill, large, small } = this.props;
+        const containerClasses = classNames(
+            Classes.NUMERIC_INPUT,
+            { [Classes.LARGE]: large, [Classes.SMALL]: small },
+            className,
+        );
         const buttons = this.renderButtons();
         return (
             <ControlGroup className={containerClasses} fill={fill}>
@@ -452,6 +466,7 @@ export class NumericInput extends AbstractPureComponent2<HTMLInputProps & Numeri
                 onKeyPress={this.handleInputKeyPress}
                 onPaste={this.handleInputPaste}
                 rightElement={this.props.rightElement}
+                small={this.props.small}
                 value={this.state.value}
             />
         );