adjust calendar open this icon

platformbuilders · Nov 25, 2024 · f0570f7 · f0570f7
1 parent b1df4a9
commit f0570f7
Show file tree

Hide file tree

Showing 2 changed files with 5 additions and 1 deletion.
diff --git a/src/components/DatePicker/DatePicker.stories.tsx b/src/components/DatePicker/DatePicker.stories.tsx
@@ -26,6 +26,7 @@ const meta: Meta<typeof DatePicker> = {
     minDate: { control: { type: 'boolean' } },
     maxDate: { control: { type: 'boolean' } },
     inputVariant: { type: 'string' },
+    disabledInput: { control: { type: 'boolean' } },
   },
   args: {
     onChange: onChange,

diff --git a/src/components/DatePicker/index.tsx b/src/components/DatePicker/index.tsx
@@ -16,6 +16,7 @@ interface Props extends DatePickerProps {
   workDays?: boolean;
   holidays?: string[];
   inputVariant?: 'default' | 'outlined';
+  disabledInput?: boolean;
 }
 
 const DatePickerComponent: React.FC<Props> = ({
@@ -30,6 +31,7 @@ const DatePickerComponent: React.FC<Props> = ({
   name,
   id,
   inputVariant = 'outlined',
+  disabledInput = false,
 }) => {
   const datePickerRef = useRef();
   return (
@@ -43,8 +45,9 @@ const DatePickerComponent: React.FC<Props> = ({
             id={id}
             value={value}
             onClick={openCalendar}
-            onChange={(e) => onChange(e)}
+            onChange={(e) => (disabledInput ? value : onChange(e))}
             iconRight="ChevronDownIcon"
+            onClickIconRight={openCalendar}
             variant={inputVariant}
           />
         );