diff --git a/README.md b/README.md index fd7766b..a643e68 100644 --- a/README.md +++ b/README.md @@ -49,20 +49,21 @@ yarn add svelte-file-dropzone ### Props -| Prop Name | Description | Default Value | -| --------------------- | ---------------------------------------------------------------------------------------- | ------------- | -| accept | Set accepted file types. See https://github.com/okonet/attr-accept for more information. | undefined | -| disabled | | false | -| maxSize | | Infinity | -| minSize | | 0 | -| multiple | if true, multiple files can be selected at once | true | -| preventDropOnDocument | 1231 | true | -| noClick | disable click events | false | -| noKeyboard | disable keyboard events | false | -| noDrag | disable drag events | false | -| containerClasses | custom container classes | "" | -| containerStyles | custom inline container styles | "" | -| disableDefaultStyles | don't apply default styles to container | false | +| Prop Name | Description | Default Value | +| --------------------- | ---------------------------------------------------------------------------------------- | --------------------------------------------------------- | +| accept | Set accepted file types. See https://github.com/okonet/attr-accept for more information. | undefined | +| disabled | | false | +| maxSize | | Infinity | +| minSize | | 0 | +| multiple | if true, multiple files can be selected at once | true | +| preventDropOnDocument | 1231 | true | +| noClick | disable click events | false | +| noKeyboard | disable keyboard events | false | +| noDrag | disable drag events | false | +| containerClasses | custom container classes | "" | +| containerStyles | custom inline container styles | "" | +| containerText | customize the default text in the container | "Drag 'n' drop some files here, or click to select files" | +| disableDefaultStyles | don't apply default styles to container | false | ### Events diff --git a/src/components/Dropzone.svelte b/src/components/Dropzone.svelte index c639307..363b68a 100644 --- a/src/components/Dropzone.svelte +++ b/src/components/Dropzone.svelte @@ -31,6 +31,7 @@ export let noDragEventsBubbling = false; export let containerClasses = ""; export let containerStyles = ""; + export let containerText = "Drag 'n' drop some files here, or click to select files"; export let disableDefaultStyles = false; export let name = ""; const dispatch = createEventDispatcher(); @@ -352,6 +353,6 @@ bind:this={inputRef} style="display: none;" /> -

Drag 'n' drop some files here, or click to select files

+

{containerText}