The exposed inputRef and dropzoneRef have inconsistent access patterns. inputRef is a getter returning a DOM element directly, while dropzoneRef remains a ref requiring .value access. This breaks backward compatibility and creates an inconsistent API.
Analysis
FileUpload component has inconsistent ref exposure patterns breaking API consistency
What fails: FileUpload.vue defineExpose exposes inputRef as getter returning DOM element directly, while dropzoneRef remains a ref, creating inconsistent access patterns that break established component API conventions.
How to reproduce:
<script setup> const fileUpload = ref() // These access patterns are inconsistent: fileUpload.value.inputRef.focus() // Works (direct DOM access) fileUpload.value.dropzoneRef.value.focus() // Works (ref access) </script> <template> <UFileUpload ref="fileUpload" /> </template>
Expected behavior: Both refs should be exposed consistently. Example usage in InputKbdExample.vue shows expected pattern: input.value?.inputRef?.focus() which works with Input component but would break with FileUpload's inconsistent exposure.
Result: FileUpload breaks the established pattern used by Input, Textarea, and Select components which all expose refs directly via defineExpose({ inputRef }), while FileUpload uses a getter that bypasses the ref wrapper.