flowbite-react/dist/esm/components/FileInput/FileInput.mjs.map

Official React components built for Flowbite and Tailwind CSS

{"version":3,"file":"FileInput.mjs","sources":["../../../../src/components/FileInput/FileInput.tsx"],"sourcesContent":["import type { ComponentProps, ReactNode } from \"react\";\nimport { forwardRef } from \"react\";\nimport { twMerge } from \"tailwind-merge\";\nimport { mergeDeep } from \"../../helpers/merge-deep\";\nimport { getTheme } from \"../../theme-store\";\nimport type { DeepPartial } from \"../../types\";\nimport { HelperText } from \"../HelperText\";\nimport type { FlowbiteTextInputColors, FlowbiteTextInputSizes } from \"../TextInput\";\n\nexport interface FlowbiteFileInputTheme {\n  root: FlowbiteFileInputRootTheme;\n  field: FlowbiteFileInputFieldTheme;\n}\n\nexport interface FlowbiteFileInputRootTheme {\n  base: string;\n}\n\nexport interface FlowbiteFileInputFieldTheme {\n  base: string;\n  input: FlowbiteFileInputFieldInputTheme;\n}\n\nexport interface FlowbiteFileInputFieldInputTheme {\n  base: string;\n  colors: FlowbiteTextInputColors;\n  sizes: FlowbiteTextInputSizes;\n}\n\nexport interface FileInputProps extends Omit<ComponentProps<\"input\">, \"type\" | \"ref\" | \"color\"> {\n  color?: keyof FlowbiteTextInputColors;\n  helperText?: ReactNode;\n  sizing?: keyof FlowbiteTextInputSizes;\n  theme?: DeepPartial<FlowbiteFileInputTheme>;\n}\n\nexport const FileInput = forwardRef<HTMLInputElement, FileInputProps>(\n  ({ className, color = \"gray\", helperText, sizing = \"md\", theme: customTheme = {}, ...props }, ref) => {\n    const theme = mergeDeep(getTheme().fileInput, customTheme);\n\n    return (\n      <>\n        <div className={twMerge(theme.root.base, className)}>\n          <div className={theme.field.base}>\n            <input\n              className={twMerge(\n                theme.field.input.base,\n                theme.field.input.colors[color],\n                theme.field.input.sizes[sizing],\n              )}\n              {...props}\n              type=\"file\"\n              ref={ref}\n            />\n          </div>\n        </div>\n        {helperText && <HelperText color={color}>{helperText}</HelperText>}\n      </>\n    );\n  },\n);\n\nFileInput.displayName = \"FileInput\";\n"],"names":[],"mappings":";;;;;;;AAOY,MAAC,SAAS,GAAG,UAAU;AACnC,EAAE,CAAC,EAAE,SAAS,EAAE,KAAK,GAAG,MAAM,EAAE,UAAU,EAAE,MAAM,GAAG,IAAI,EAAE,KAAK,EAAE,WAAW,GAAG,EAAE,EAAE,GAAG,KAAK,EAAE,EAAE,GAAG,KAAK;AACxG,IAAI,MAAM,KAAK,GAAG,SAAS,CAAC,QAAQ,EAAE,CAAC,SAAS,EAAE,WAAW,CAAC,CAAC;AAC/D,IAAI,uBAAuB,IAAI,CAAC,QAAQ,EAAE,EAAE,QAAQ,EAAE;AACtD,sBAAsB,GAAG,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,OAAO,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,EAAE,SAAS,CAAC,EAAE,QAAQ,kBAAkB,GAAG,CAAC,KAAK,EAAE,EAAE,SAAS,EAAE,KAAK,CAAC,KAAK,CAAC,IAAI,EAAE,QAAQ,kBAAkB,GAAG;AACpL,QAAQ,OAAO;AACf,QAAQ;AACR,UAAU,SAAS,EAAE,OAAO;AAC5B,YAAY,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI;AAClC,YAAY,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AAC3C,YAAY,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,CAAC,MAAM,CAAC;AAC3C,WAAW;AACX,UAAU,GAAG,KAAK;AAClB,UAAU,IAAI,EAAE,MAAM;AACtB,UAAU,GAAG;AACb,SAAS;AACT,OAAO,EAAE,CAAC,EAAE,CAAC;AACb,MAAM,UAAU,oBAAoB,GAAG,CAAC,UAAU,EAAE,EAAE,KAAK,EAAE,QAAQ,EAAE,UAAU,EAAE,CAAC;AACpF,KAAK,EAAE,CAAC,CAAC;AACT,GAAG;AACH,EAAE;AACF,SAAS,CAAC,WAAW,GAAG,WAAW;;;;"}