Files
kycnotme/web/src/components/InputFile.astro
2025-05-19 10:23:36 +00:00

39 lines
999 B
Plaintext

---
import { cn } from '../lib/cn'
import { baseInputClassNames } from '../lib/formInputs'
import InputWrapper from './InputWrapper.astro'
import type { ComponentProps } from 'astro/types'
type Props = Omit<ComponentProps<typeof InputWrapper>, 'children' | 'inputId'> & {
accept?: string
disabled?: boolean
multiple?: boolean
}
const { accept, disabled, multiple, ...wrapperProps } = Astro.props
const inputId = Astro.locals.makeId(`input-${wrapperProps.name}`)
const hasError = !!wrapperProps.error && wrapperProps.error.length > 0
---
<InputWrapper inputId={inputId} {...wrapperProps}>
<input
transition:persist
type="file"
id={inputId}
class={cn(
baseInputClassNames.input,
baseInputClassNames.file,
hasError && baseInputClassNames.error,
disabled && baseInputClassNames.disabled
)}
required={wrapperProps.required}
disabled={disabled}
name={wrapperProps.name}
accept={accept}
multiple={multiple}
/>
</InputWrapper>