fix: Error prop not overriding for date-picker (#402)

* fix: Error prop not overriding for date-picker

* fix: Error prop not overriding for date-picker

---------

Co-authored-by: Gaurav Singh <gaurav3017@gmail.com>

Author: singh-pk

packages/raystack/v1/components/calendar/date-picker.tsx

@@ -161,18 +161,18 @@ export function DatePicker({
 
   const defaultTrigger = (
     <InputField
-      ref={inputFieldRef}
       size="small"
       placeholder="Select date"
+      error={error}
+      className={styles.datePickerInput}
       trailingIcon={showCalendarIcon ? <CalendarIcon /> : undefined}
+      {...inputFieldProps}
+      ref={inputFieldRef}
       defaultValue={formattedDate}
       onChange={handleInputChange}
       onFocus={handleInputFocus}
       onBlur={handleInputBlur}
-      error={error}
       onKeyUp={handleKeyUp}
-      className={styles.datePickerInput}
-      {...inputFieldProps}
     />
   );
 

packages/raystack/v1/components/calendar/range-picker.tsx

@@ -59,14 +59,14 @@ export function RangePicker({
     ? dayjs(selectedRange.to).format(dateFormat)
     : "";
 
-  // Ensures two months are visible even when 
+  // Ensures two months are visible even when
   // current month is the last allowed month (endMonth).
   const computedDefaultMonth = useMemo(() => {
     let month = currentMonth;
     if (calendarProps?.endMonth) {
       const endMonth = dayjs(calendarProps.endMonth);
       const fromMonth = dayjs(currentMonth);
-      
+
       if (fromMonth.isSame(endMonth, 'month')) {
         month = endMonth.subtract(1, 'month').toDate();
       }
@@ -127,19 +127,19 @@ export function RangePicker({
         size='small'
         placeholder="Select start date"
         trailingIcon={showCalendarIcon ? <CalendarIcon /> : undefined}
+        className={styles.datePickerInput}
         {...(inputFieldsProps.startDate ?? {})}
         value={startDate}
-        className={styles.datePickerInput}
         readOnly
       />
 
       <InputField
         size='small'
         placeholder="Select end date"
         trailingIcon={showCalendarIcon ? <CalendarIcon /> : undefined}
+        className={styles.datePickerInput}
         {...(inputFieldsProps.endDate ?? {})}
         value={endDate}
-        className={styles.datePickerInput}
         readOnly
       />
     </Flex>