@rjsf/daisyui 6.0.0-beta.21 → 6.0.0-beta.23

package/src/templates/WrapIfAdditionalTemplate/WrapIfAdditionalTemplate.tsx

@@ -1,4 +1,3 @@
-import { useCallback } from 'react';
 import {
   WrapIfAdditionalTemplateProps,
   StrictRJSFSchema,
@@ -29,8 +28,9 @@ export default function WrapIfAdditionalTemplate<
     required,
     schema,
     uiSchema,
-    onKeyChange,
-    onDropPropertyClick,
+    onKeyRename,
+    onKeyRenameBlur,
+    onRemoveProperty,
     registry,
     ...rest
   } = props;
@@ -41,17 +41,6 @@ export default function WrapIfAdditionalTemplate<
   const { RemoveButton } = templates.ButtonTemplates;
   const keyLabel = translateString(TranslatableString.KeyLabel, [label]);
 
-  const handleBlur = useCallback(
-    (event: React.FocusEvent<HTMLInputElement>) => {
-      onKeyChange(event.target.value);
-    },
-    [onKeyChange],
-  );
-
-  const handleRemove = useCallback(() => {
-    onDropPropertyClick(label)();
-  }, [onDropPropertyClick, label]);
-
   if (!additional) {
     return <div className={classNames}>{children}</div>;
   }
@@ -67,7 +56,7 @@ export default function WrapIfAdditionalTemplate<
             type='text'
             className='input input-bordered'
             id={`${id}-key`}
-            onBlur={handleBlur}
+            onBlur={onKeyRenameBlur}
             defaultValue={label}
             disabled={disabled || readonly}
           />
@@ -78,7 +67,7 @@ export default function WrapIfAdditionalTemplate<
             id={buttonId(id, 'remove')}
             className='rjsf-object-property-remove'
             disabled={disabled || readonly}
-            onClick={handleRemove}
+            onClick={onRemoveProperty}
             uiSchema={uiSchema}
             registry={registry}
           />

package/src/widgets/AltDateWidget/AltDateWidget.tsx

@@ -1,187 +1,13 @@
-import { MouseEvent, useCallback, useEffect, useReducer, useState } from 'react';
 import {
-  ariaDescribedByIds,
+  DateElement,
   FormContextType,
   RJSFSchema,
   StrictRJSFSchema,
-  WidgetProps,
   TranslatableString,
-  parseDateString,
-  toDateString,
-  dateRangeOptions,
-  DateObject as RJSFDateObject,
-  Registry,
+  useAltDateWidgetProps,
+  WidgetProps,
 } from '@rjsf/utils';
 
-/** Interface for date object with optional string fields for each date/time component */
-interface DateObject {
-  year?: string;
-  month?: string;
-  day?: string;
-  hour?: string;
-  minute?: string;
-  second?: string;
-}
-
-/** Determines if the date object has all required fields to form a valid date
- *
- * @param state - The date object to check
- * @param time - Whether to check time fields as well
- * @returns True if all required fields are present
- */
-function readyForChange(state: DateObject, time = false) {
-  return state.year && state.month && state.day && (!time || (state.hour && state.minute && state.second));
-}
-
-/** Supported date element display formats */
-type DateElementFormat = 'YMD' | 'MDY' | 'DMY';
-
-/** Gets configuration for date elements based on format and ranges
- *
- * @param state - The current date object state
- * @param time - Whether to include time elements
- * @param yearsRange - Optional range of years to display
- * @param format - Format for ordering date elements (year, month, day)
- * @returns Array of element properties for rendering
- */
-function getDateElementProps(
-  state: DateObject,
-  time: boolean,
-  yearsRange?: [number, number],
-  format: DateElementFormat = 'YMD',
-) {
-  const rangeOptions = yearsRange ?? [1900, new Date().getFullYear() + 2];
-  // Define the order based on the format
-  const formats: Record<DateElementFormat, Array<keyof DateObject>> = {
-    YMD: ['year', 'month', 'day'],
-    MDY: ['month', 'day', 'year'],
-    DMY: ['day', 'month', 'year'],
-  };
-
-  // Get the elements in the specified order
-  const dateElements = formats[format].map((key) => ({
-    type: key,
-    value: state[key],
-    range:
-      key === 'year'
-        ? (rangeOptions as [number, number])
-        : key === 'month'
-          ? ([1, 12] as [number, number])
-          : key === 'day'
-            ? ([1, 31] as [number, number])
-            : ([0, 59] as [number, number]),
-  }));
-
-  // Add time elements if needed
-  if (time) {
-    dateElements.push(
-      { type: 'hour', value: state.hour, range: [0, 23] as [number, number] },
-      { type: 'minute', value: state.minute, range: [0, 59] as [number, number] },
-      { type: 'second', value: state.second, range: [0, 59] as [number, number] },
-    );
-  }
-
-  return dateElements;
-}
-
-/** Props for the DateElement component */
-interface DateElementProps<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any> {
-  /** Type of date element (year, month, day, etc.) */
-  type: string;
-  /** Min/max range for the element values */
-  range: [number, number];
-  /** Current value */
-  value?: string;
-  /** Function to call when value is selected */
-  select: (property: keyof DateObject, value: any) => void;
-  /** Base ID for the form element */
-  rootId: string;
-  /** Name attribute for the form element */
-  name: string;
-  /** Whether the input is disabled */
-  disabled?: boolean;
-  /** Whether the input is readonly */
-  readonly?: boolean;
-  /** Whether the input should autofocus */
-  autofocus?: boolean;
-  /** Registry containing widgets and templates */
-  registry: Registry<T, S, F>;
-  /** Function called when input loses focus */
-  onBlur: (id: string, value: string) => void;
-  /** Function called when input gains focus */
-  onFocus: (id: string, value: string) => void;
-}
-
-/** Component for rendering individual date/time elements (year, month, day, etc.)
- *
- * Renders a select input for each date component with appropriate options.
- *
- * @param props - The props for the component
- */
-function DateElement<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>({
-  type,
-  range,
-  value,
-  select,
-  rootId,
-  name,
-  disabled,
-  readonly,
-  autofocus,
-  registry,
-  onBlur,
-  onFocus,
-}: DateElementProps<T, S, F>) {
-  const id = `${rootId}_${type}`;
-  const { SelectWidget } = registry.widgets as Registry<T, S, F>['widgets'];
-
-  // Memoize the onChange handler
-  const handleChange = useCallback(
-    (value: any) => {
-      select(type as keyof DateObject, value);
-    },
-    [select, type],
-  );
-
-  return (
-    <SelectWidget
-      schema={{ type: 'integer' } as S}
-      id={id}
-      name={name}
-      className='select select-bordered select-sm w-full'
-      options={{ enumOptions: dateRangeOptions<S>(range[0], range[1]) }}
-      placeholder={type}
-      value={value}
-      disabled={disabled}
-      readonly={readonly}
-      autofocus={autofocus}
-      onChange={handleChange}
-      onBlur={onBlur}
-      onFocus={onFocus}
-      registry={registry}
-      label=''
-      aria-describedby={ariaDescribedByIds(rootId)}
-      required={false}
-    />
-  );
-}
-
-/** Converts our DateObject to the expected format for toDateString
- *
- * @param dateObj - The internal DateObject
- * @returns A properly formatted object for the utils toDateString function
- */
-function convertToRJSFDateObject(dateObj: DateObject): RJSFDateObject {
-  return {
-    year: dateObj.year ? parseInt(dateObj.year) : 0,
-    month: dateObj.month ? parseInt(dateObj.month) : 0,
-    day: dateObj.day ? parseInt(dateObj.day) : 0,
-    hour: dateObj.hour ? parseInt(dateObj.hour) : 0,
-    minute: dateObj.minute ? parseInt(dateObj.minute) : 0,
-    second: dateObj.second ? parseInt(dateObj.second) : 0,
-  };
-}
-
 /** The `AltDateWidget` component provides an alternative date/time input
  * with individual fields for year, month, day, and optionally time components.
  *
@@ -199,87 +25,25 @@ export default function AltDateWidget<
   T = any,
   S extends StrictRJSFSchema = RJSFSchema,
   F extends FormContextType = any,
->({
-  time = false,
-  disabled = false,
-  readonly = false,
-  autofocus = false,
-  options = {},
-  id,
-  name,
-  registry,
-  onBlur,
-  onFocus,
-  onChange,
-  value,
-}: WidgetProps<T, S, F>) {
+>(props: WidgetProps<T, S, F>) {
+  const {
+    disabled = false,
+    readonly = false,
+    autofocus = false,
+    options = {},
+    id,
+    name,
+    registry,
+    onBlur,
+    onFocus,
+  } = props;
   const { translateString } = registry;
-  const [lastValue, setLastValue] = useState(value);
-
-  // Use a type-safe version of parseDateString result
-  const initialState = parseDateString(value, time) as unknown as DateObject;
-
-  // Create a reducer for date objects
-  const dateReducer = (state: DateObject, action: Partial<DateObject>): DateObject => {
-    return { ...state, ...action };
-  };
-
-  const [state, setState] = useReducer(dateReducer, initialState);
-
-  // Handle changes in props or state
-  useEffect(() => {
-    const rjsfDateObj = convertToRJSFDateObject(state);
-    const stateValue = toDateString(rjsfDateObj, time);
-    if (readyForChange(state, time) && stateValue !== value) {
-      // Valid date changed via the selects
-      onChange(stateValue);
-    } else if (lastValue !== value) {
-      // New value from props
-      setLastValue(value);
-      setState(parseDateString(value, time) as unknown as DateObject);
-    }
-  }, [time, value, onChange, state, lastValue]);
-
-  // Handle individual field changes
-  const handleChange = useCallback((property: keyof DateObject, value: string) => {
-    setState({ [property]: value });
-  }, []);
-
-  // Set current date
-  const handleSetNow = useCallback(
-    (event: MouseEvent<HTMLButtonElement>) => {
-      event.preventDefault();
-      if (disabled || readonly) {
-        return;
-      }
-      const nextState = parseDateString(new Date().toJSON(), time) as unknown as DateObject;
-      const rjsfDateObj = convertToRJSFDateObject(nextState);
-      onChange(toDateString(rjsfDateObj, time));
-    },
-    [disabled, readonly, time, onChange],
-  );
-
-  // Clear the date
-  const handleClear = useCallback(
-    (event: MouseEvent<HTMLButtonElement>) => {
-      event.preventDefault();
-      if (disabled || readonly) {
-        return;
-      }
-      onChange(undefined);
-    },
-    [disabled, readonly, onChange],
-  );
+  const { elements, handleChange, handleClear, handleSetNow } = useAltDateWidgetProps(props);
 
   return (
     <div className='space-y-3'>
       <div className='grid grid-cols-3 gap-2'>
-        {getDateElementProps(
-          state,
-          time,
-          options.yearsRange as [number, number] | undefined,
-          options.format as DateElementFormat | undefined,
-        ).map((elemProps, i) => (
+        {elements.map((elemProps, i) => (
           <div key={i} className='form-control'>
             <label className='label'>
               <span className='label-text capitalize'>{elemProps.type}</span>
@@ -287,6 +51,7 @@ export default function AltDateWidget<
             <DateElement
               rootId={id}
               name={name}
+              className='select select-bordered select-sm'
               select={handleChange}
               type={elemProps.type}
               range={elemProps.range}

package/src/widgets/CheckboxWidget/CheckboxWidget.tsx

@@ -19,6 +19,7 @@ export default function CheckboxWidget<
 >(props: WidgetProps<T, S, F>) {
   const {
     id,
+    htmlName,
     value,
     required,
     disabled,
@@ -71,6 +72,7 @@ export default function CheckboxWidget<
     <input
       type='checkbox'
       id={id}
+      name={htmlName || id}
       checked={value}
       required={required}
       disabled={disabled || readonly}

package/src/widgets/CheckboxesWidget/CheckboxesWidget.tsx

@@ -17,6 +17,7 @@ import { WidgetProps, StrictRJSFSchema, RJSFSchema, FormContextType } from '@rjs
  */
 export default function CheckboxesWidget<T, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>({
   id,
+  htmlName,
   disabled,
   options,
   value,
@@ -106,7 +107,7 @@ export default function CheckboxesWidget<T, S extends StrictRJSFSchema = RJSFSch
               type='checkbox'
               id={`${id}-${option.value}`}
               className='checkbox'
-              name={id}
+              name={htmlName || id}
               checked={isChecked(option)}
               required={required}
               disabled={disabled || readonly}

package/src/widgets/RadioWidget/RadioWidget.tsx

@@ -15,6 +15,7 @@ import { WidgetProps, StrictRJSFSchema, FormContextType, RJSFSchema } from '@rjs
  */
 export default function RadioWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>({
   id,
+  htmlName,
   options,
   value,
   required,
@@ -95,7 +96,7 @@ export default function RadioWidget<T = any, S extends StrictRJSFSchema = RJSFSc
               type='radio'
               id={`${id}-${option.value}`}
               className='radio'
-              name={id}
+              name={htmlName || id}
               value={getValue(option)}
               checked={isChecked(option)}
               required={required}

package/src/widgets/TextareaWidget/TextareaWidget.tsx

@@ -16,7 +16,7 @@ export default function TextareaWidget<
   S extends StrictRJSFSchema = RJSFSchema,
   F extends FormContextType = any,
 >(props: WidgetProps<T, S, F>) {
-  const { id, value, required, disabled, readonly, onChange, onFocus, onBlur, options } = props;
+  const { id, htmlName, value, required, disabled, readonly, onChange, onFocus, onBlur, options } = props;
 
   /** Handle focus events
    *
@@ -62,6 +62,7 @@ export default function TextareaWidget<
     <div className='form-control'>
       <textarea
         id={id}
+        name={htmlName || id}
         value={value || ''}
         required={required}
         disabled={disabled || readonly}

package/src/widgets/Widgets.tsx

@@ -6,7 +6,6 @@ import CheckboxWidget from './CheckboxWidget/CheckboxWidget';
 import CheckboxesWidget from './CheckboxesWidget/CheckboxesWidget';
 import DateTimeWidget from './DateTimeWidget/DateTimeWidget';
 import DateWidget from './DateWidget/DateWidget';
-import FileWidget from './FileWidget/FileWidget';
 import RadioWidget from './RadioWidget/RadioWidget';
 import RangeWidget from './RangeWidget/RangeWidget';
 import RatingWidget from './RatingWidget/RatingWidget';
@@ -22,7 +21,6 @@ export {
   CheckboxWidget,
   DateTimeWidget,
   DateWidget,
-  FileWidget,
   RadioWidget,
   RangeWidget,
   RatingWidget,
@@ -44,7 +42,6 @@ export function generateWidgets<
     CheckboxWidget,
     DateTimeWidget,
     DateWidget,
-    FileWidget,
     RadioWidget,
     RangeWidget,
     RatingWidget,

package/lib/widgets/FileWidget/FileWidget.d.ts

@@ -1,12 +0,0 @@
-import { FormContextType, RJSFSchema, StrictRJSFSchema, WidgetProps } from '@rjsf/utils';
-/** The `FileWidget` component provides a file input with DaisyUI styling
- *
- * Features:
- * - Handles both single and multiple file uploads
- * - Supports file type filtering via accept attribute
- * - Properly manages disabled and readonly states
- * - Handles focus and blur events
- *
- * @param props - The `WidgetProps` for this component
- */
-export default function FileWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(props: WidgetProps<T, S, F>): import("react/jsx-runtime").JSX.Element;

package/lib/widgets/FileWidget/FileWidget.js

@@ -1,57 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback } from 'react';
-/** The `FileWidget` component provides a file input with DaisyUI styling
- *
- * Features:
- * - Handles both single and multiple file uploads
- * - Supports file type filtering via accept attribute
- * - Properly manages disabled and readonly states
- * - Handles focus and blur events
- *
- * @param props - The `WidgetProps` for this component
- */
-export default function FileWidget(props) {
-    const { id, required, disabled, readonly, schema, onChange, onFocus, onBlur, options = {} } = props;
-    // Ensure isMulti is explicitly a boolean.
-    const isMulti = schema.type === 'array' || Boolean(options.multiple);
-    // Accept attribute for restricting file types (e.g., "image/*"), if defined in options.
-    const accept = typeof options.accept === 'string' ? options.accept : undefined;
-    /** Handle file selection changes
-     *
-     * @param event - The change event from the file input
-     */
-    const handleChange = useCallback((event) => {
-        if (!event.target.files) {
-            return;
-        }
-        // Convert FileList to array for multiple upload handling.
-        const fileList = Array.from(event.target.files);
-        if (isMulti) {
-            onChange(fileList);
-        }
-        else {
-            // For single file, send the first file (or null if none chosen)
-            onChange(fileList[0] || null);
-        }
-    }, [onChange, isMulti]);
-    /** Handle focus events
-     *
-     * @param event - The focus event
-     */
-    const handleFocus = useCallback((event) => {
-        if (onFocus) {
-            onFocus(id, event.target.files ? Array.from(event.target.files) : null);
-        }
-    }, [onFocus, id]);
-    /** Handle blur events
-     *
-     * @param event - The blur event
-     */
-    const handleBlur = useCallback((event) => {
-        if (onBlur) {
-            onBlur(id, event.target.files ? Array.from(event.target.files) : null);
-        }
-    }, [onBlur, id]);
-    return (_jsx("input", { id: id, type: 'file', className: 'file-input w-full', required: required, disabled: disabled || readonly, onChange: handleChange, onFocus: handleFocus, onBlur: handleBlur, multiple: isMulti, accept: accept }));
-}
-//# sourceMappingURL=FileWidget.js.map

package/lib/widgets/FileWidget/FileWidget.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"FileWidget.js","sourceRoot":"","sources":["../../../src/widgets/FileWidget/FileWidget.tsx"],"names":[],"mappings":";AAAA,OAAO,EAA2B,WAAW,EAAE,MAAM,OAAO,CAAC;AAG7D;;;;;;;;;GASG;AACH,MAAM,CAAC,OAAO,UAAU,UAAU,CAChC,KAA2B;IAE3B,MAAM,EAAE,EAAE,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,OAAO,GAAG,EAAE,EAAE,GAAG,KAAK,CAAC;IAEpG,0CAA0C;IAC1C,MAAM,OAAO,GAAY,MAAM,CAAC,IAAI,KAAK,OAAO,IAAI,OAAO,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC;IAE9E,wFAAwF;IACxF,MAAM,MAAM,GAAuB,OAAO,OAAO,CAAC,MAAM,KAAK,QAAQ,CAAC,CAAC,CAAC,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS,CAAC;IAEnG;;;OAGG;IACH,MAAM,YAAY,GAAG,WAAW,CAC9B,CAAC,KAAoC,EAAE,EAAE;QACvC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,EAAE,CAAC;YACxB,OAAO;QACT,CAAC;QACD,0DAA0D;QAC1D,MAAM,QAAQ,GAAG,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAChD,IAAI,OAAO,EAAE,CAAC;YACZ,QAAQ,CAAC,QAAQ,CAAC,CAAC;QACrB,CAAC;aAAM,CAAC;YACN,gEAAgE;YAChE,QAAQ,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC;QAChC,CAAC;IACH,CAAC,EACD,CAAC,QAAQ,EAAE,OAAO,CAAC,CACpB,CAAC;IAEF;;;OAGG;IACH,MAAM,WAAW,GAAG,WAAW,CAC7B,CAAC,KAAmC,EAAE,EAAE;QACtC,IAAI,OAAO,EAAE,CAAC;YACZ,OAAO,CAAC,EAAE,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;QAC1E,CAAC;IACH,CAAC,EACD,CAAC,OAAO,EAAE,EAAE,CAAC,CACd,CAAC;IAEF;;;OAGG;IACH,MAAM,UAAU,GAAG,WAAW,CAC5B,CAAC,KAAmC,EAAE,EAAE;QACtC,IAAI,MAAM,EAAE,CAAC;YACX,MAAM,CAAC,EAAE,EAAE,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC;QACzE,CAAC;IACH,CAAC,EACD,CAAC,MAAM,EAAE,EAAE,CAAC,CACb,CAAC;IAEF,OAAO,CACL,gBACE,EAAE,EAAE,EAAE,EACN,IAAI,EAAC,MAAM,EACX,SAAS,EAAC,mBAAmB,EAC7B,QAAQ,EAAE,QAAQ,EAClB,QAAQ,EAAE,QAAQ,IAAI,QAAQ,EAC9B,QAAQ,EAAE,YAAY,EACtB,OAAO,EAAE,WAAW,EACpB,MAAM,EAAE,UAAU,EAClB,QAAQ,EAAE,OAAO,EACjB,MAAM,EAAE,MAAM,GACd,CACH,CAAC;AACJ,CAAC"}

package/lib/widgets/FileWidget/index.d.ts

@@ -1,2 +0,0 @@
-export { default } from './FileWidget.js';
-export * from './FileWidget.js';

package/lib/widgets/FileWidget/index.js

@@ -1,3 +0,0 @@
-export { default } from './FileWidget.js';
-export * from './FileWidget.js';
-//# sourceMappingURL=index.js.map

package/lib/widgets/FileWidget/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/widgets/FileWidget/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,cAAc,cAAc,CAAC"}

package/src/widgets/FileWidget/FileWidget.tsx

@@ -1,86 +0,0 @@
-import { ChangeEvent, FocusEvent, useCallback } from 'react';
-import { FormContextType, RJSFSchema, StrictRJSFSchema, WidgetProps } from '@rjsf/utils';
-
-/** The `FileWidget` component provides a file input with DaisyUI styling
- *
- * Features:
- * - Handles both single and multiple file uploads
- * - Supports file type filtering via accept attribute
- * - Properly manages disabled and readonly states
- * - Handles focus and blur events
- *
- * @param props - The `WidgetProps` for this component
- */
-export default function FileWidget<T = any, S extends StrictRJSFSchema = RJSFSchema, F extends FormContextType = any>(
-  props: WidgetProps<T, S, F>,
-) {
-  const { id, required, disabled, readonly, schema, onChange, onFocus, onBlur, options = {} } = props;
-
-  // Ensure isMulti is explicitly a boolean.
-  const isMulti: boolean = schema.type === 'array' || Boolean(options.multiple);
-
-  // Accept attribute for restricting file types (e.g., "image/*"), if defined in options.
-  const accept: string | undefined = typeof options.accept === 'string' ? options.accept : undefined;
-
-  /** Handle file selection changes
-   *
-   * @param event - The change event from the file input
-   */
-  const handleChange = useCallback(
-    (event: ChangeEvent<HTMLInputElement>) => {
-      if (!event.target.files) {
-        return;
-      }
-      // Convert FileList to array for multiple upload handling.
-      const fileList = Array.from(event.target.files);
-      if (isMulti) {
-        onChange(fileList);
-      } else {
-        // For single file, send the first file (or null if none chosen)
-        onChange(fileList[0] || null);
-      }
-    },
-    [onChange, isMulti],
-  );
-
-  /** Handle focus events
-   *
-   * @param event - The focus event
-   */
-  const handleFocus = useCallback(
-    (event: FocusEvent<HTMLInputElement>) => {
-      if (onFocus) {
-        onFocus(id, event.target.files ? Array.from(event.target.files) : null);
-      }
-    },
-    [onFocus, id],
-  );
-
-  /** Handle blur events
-   *
-   * @param event - The blur event
-   */
-  const handleBlur = useCallback(
-    (event: FocusEvent<HTMLInputElement>) => {
-      if (onBlur) {
-        onBlur(id, event.target.files ? Array.from(event.target.files) : null);
-      }
-    },
-    [onBlur, id],
-  );
-
-  return (
-    <input
-      id={id}
-      type='file'
-      className='file-input w-full'
-      required={required}
-      disabled={disabled || readonly}
-      onChange={handleChange}
-      onFocus={handleFocus}
-      onBlur={handleBlur}
-      multiple={isMulti}
-      accept={accept}
-    />
-  );
-}

package/src/widgets/FileWidget/index.ts

@@ -1,2 +0,0 @@
-export { default } from './FileWidget';
-export * from './FileWidget';