[mui#1033] Properly handle disabled prop

mnajdova · May 8, 2019 · dfa6041 · dfa6041
1 parent 7fee39a
commit dfa6041
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/lib/src/_shared/KeyboardDateInput.tsx b/lib/src/_shared/KeyboardDateInput.tsx
@@ -55,6 +55,7 @@ const KeyboardDateInput: React.FunctionComponent<KeyboardDateInputProps> = ({
   mask,
   maskChar = '_',
   format,
+  disabled,
   ...other
 }) => {
   const inputMask = mask || makeMaskFromFormat(format, maskChar);
@@ -71,6 +72,7 @@ const KeyboardDateInput: React.FunctionComponent<KeyboardDateInputProps> = ({
     <Rifm value={inputValue} onChange={onChange} refuse={refuse} format={formatter}>
       {({ onChange, value }) => (
         <TextField
+          disabled={disabled}
           error={Boolean(validationError)}
           helperText={validationError}
           {...other}
@@ -80,7 +82,7 @@ const KeyboardDateInput: React.FunctionComponent<KeyboardDateInputProps> = ({
           InputProps={{
             [`${position}Adornment`]: (
               <InputAdornment position={position} {...InputAdornmentProps}>
-                <IconButton {...KeyboardButtonProps} onClick={onClick}>
+                <IconButton disabled={disabled} {...KeyboardButtonProps} onClick={onClick}>
                   <KeyboardIcon />
                 </IconButton>
               </InputAdornment>

diff --git a/lib/src/_shared/hooks/usePickerState.ts b/lib/src/_shared/hooks/usePickerState.ts
@@ -79,7 +79,7 @@ export function usePickerState(props: BasePickerProps, options: HookOptions) {
   const inputProps = useMemo(
     () => ({
       validationError,
-      onClick: () => setIsOpen(true),
+      onClick: () => !props.disabled && setIsOpen(true),
       inputValue: getDisplayDate(date, format, utils, props.value === null, props),
     }),
     [date, format, props, setIsOpen, utils, validationError]

diff --git a/lib/src/typings/BasePicker.tsx b/lib/src/typings/BasePicker.tsx
@@ -13,6 +13,8 @@ export interface BasePickerProps {
   autoOk?: boolean;
   /** Format string */
   format?: string;
+  /** Disable datepicker and text field */
+  disabled?: boolean;
   /** Dynamic formatter of text field label */
   labelFunc?: (date: MaterialUiPickersDate, invalidLabel: string) => string;
   /** Date that will be initially highlighted */