adjust calendar open this icon (#193)

* adjust calendar open this icon * alter version
platformbuilders · Nov 26, 2024 · e0ae3f9 · e0ae3f9
1 parent b1df4a9
commit e0ae3f9
Show file tree

Hide file tree

Showing 3 changed files with 6 additions and 2 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@platformbuilders/fluid-react",
-  "version": "1.2.12",
+  "version": "1.2.13",
   "private": false,
   "description": "Builders React for Fluid Design System",
   "keywords": [

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}
           />
         );