{"id":23442242,"url":"https://github.com/teamwertarbyte/material-ui-file-dropzone","last_synced_at":"2025-04-13T11:11:04.042Z","repository":{"id":57292119,"uuid":"185047069","full_name":"TeamWertarbyte/material-ui-file-dropzone","owner":"TeamWertarbyte","description":"File selection components with drag'n'drop support for Material-UI.","archived":false,"fork":false,"pushed_at":"2024-04-23T01:52:05.000Z","size":1130,"stargazers_count":11,"open_issues_count":1,"forks_count":1,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-04-11T23:38:37.331Z","etag":null,"topics":["drag-and-drop","file-select","file-upload","material-ui","react"],"latest_commit_sha":null,"homepage":"https://teamwertarbyte.github.io/material-ui-file-dropzone/","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/TeamWertarbyte.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":".github/FUNDING.yml","license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null},"funding":{"github":["leMaik","saschb2b"]}},"created_at":"2019-05-05T15:11:15.000Z","updated_at":"2022-11-23T07:15:06.000Z","dependencies_parsed_at":"2022-08-27T12:20:47.038Z","dependency_job_id":null,"html_url":"https://github.com/TeamWertarbyte/material-ui-file-dropzone","commit_stats":null,"previous_names":[],"tags_count":4,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TeamWertarbyte%2Fmaterial-ui-file-dropzone","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TeamWertarbyte%2Fmaterial-ui-file-dropzone/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TeamWertarbyte%2Fmaterial-ui-file-dropzone/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/TeamWertarbyte%2Fmaterial-ui-file-dropzone/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/TeamWertarbyte","download_url":"https://codeload.github.com/TeamWertarbyte/material-ui-file-dropzone/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":248703198,"owners_count":21148118,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["drag-and-drop","file-select","file-upload","material-ui","react"],"created_at":"2024-12-23T17:29:01.858Z","updated_at":"2025-04-13T11:11:04.022Z","avatar_url":"https://github.com/TeamWertarbyte.png","language":"JavaScript","funding_links":["https://github.com/sponsors/leMaik","https://github.com/sponsors/saschb2b"],"categories":[],"sub_categories":[],"readme":"# Material-UI File Dropzone\nThis project provides drag and drop file selector components for [Material-UI][mui]. Take a look at [the demos][storybook].\n\nAt the moment, this project is at an early stage. We want to explore possible use cases and explore what the API should look like. Please open an issue if there's something missing or if you encounter a bug.\n\n[mui]: https://material-ui.com\n[storybook]: https://teamwertarbyte.github.io/material-ui-file-dropzone/\n\n## Installation\n```\nnpm i --save material-ui-file-dropzone\n```\n\n## Usage\n### DropAreaBase\nBasic component to implement a container that files can be dropped on. This is the foundation of the other components and can be used to create custom upload controls.\n\n|Name|Type|Default|Description|\n|---|---|---|---|\n|accept|`string`||The accepted file types as a comma-separated list of MIME types or file extensions. If not set, any file type will be accepted.|\n|children|`node`||Used to render content in the drop area.|\n|clickable|`bool`||If `true`, the drop area can be clicked to open a file selection dialog.|\n|component|`elementType`|`'div'`|The component used for the root node.|\n|disabled|`bool`||If `true`, the drop area will be disabled.|\n|multiple|`bool`||If `true`, the drop area will accept multiple files.|\n|onAcceptedDragEnter|`func`||Callback fired when a user drags one or more accepted files over the drop area.|\n|onClick|`func`||Callback fired when the user clicks on the drop area.|\n|onSelectFiles*|`func`||Callback fired when the user selects or drops one or more accepted files.|\n\nAll other properties are passed through to the root element.\n\n### FileSelectArea\nThis is a very basic file selector that supports drag and drop as well as clicking to open a file selection dialog.\n\n|Name|Type|Default|Description|\n|---|---|---|---|\n|children|`node`||Used to render content in the drop area.|\n|classes|`object`||Override or extend the styles applied to the component.|\n|clickable|`bool`|`true`||If `true`, the drop area can be clicked to open a file selection dialog.|\n|onSelectFiles*|`func`||Callback fired when the user selects or drops one or more accepted files.|\n\nAll other properties are passed through to the underlying `DropAreaBase`. \n\n### InvisibleDropArea\nThe invisible drop area can be used for views where no drop area is shown but the user can drop files anywhere to trigger an action (e.g. upload it).\n\n|Name|Type|Default|Description|\n|---|---|---|---|\n|activeIcon|`node`||Icon to display when an accepted file is dragged over the area.|\n|activeText|`string`||Text to display when an accepted file is dragged over the area.|\n|children|`node`||Used to render content in the drop area.|\n|classes|`object`||Override or extend the styles applied to the component.|\n|onSelectFiles*|`func`||Callback fired when the user selects or drops one or more accepted files.|\n\nAll other properties are passed through to the underlying `DropAreaBase`.\n\n\\* required property\n\n## License\nThe files included in this repository are licensed under the MIT license.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fteamwertarbyte%2Fmaterial-ui-file-dropzone","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fteamwertarbyte%2Fmaterial-ui-file-dropzone","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fteamwertarbyte%2Fmaterial-ui-file-dropzone/lists"}