Skip to content

[Bug] Container is not scrollable on mobile devices #249

Open
@hugocostaiz

Description

@hugocostaiz

Is there an existing issue for this?

  • I have searched the existing issues

Have you updated React FilePond, FilePond, and all plugins?

  • I have updated FilePond and its plugins

Describe the bug

On desktop the container can be scollable using the wheel mouse, but on mobile its impossible to scroll throw images.

Reproduction

        <DrawerContent>
          <DrawerHeader className="flex flex-col gap-1 ">Galeria</DrawerHeader>
          <DrawerBody>
            <FilePond
              files={images}
              onupdatefiles={handleUpdateGallery}
              onreorderfiles={(fileItems) => {
                const reordered = fileItems.map((fileItem) => fileItem.file);
                setImages(reordered as File[]);
              }}
              allowMultiple
              maxFiles={6}
              allowImagePreview
              name="gallery"
              allowReorder
              labelIdle={`<span style="font-size: 0.92rem;">Arraste ou <span class="filepond--label-action">clique aqui</span> para adicionar imagem</span>`}
              maxFileSize="4MB"
              acceptedFileTypes={[
                "image/jpeg",
                "image/jpg",
                "image/png",
                "image/webp",
              ]}
              imageTransformOutputMimeType="image/jpeg"
            />
          </DrawerBody>
          <DrawerFooter>
            <Button
              color="danger"
              variant="light"
              onPress={() => onOpenChange()}
            >
              Fechar
            </Button>
            <Button
              color="primary"
              isLoading={loading}
              onPress={() => handleSave()}
            >
              Guardar
            </Button>
          </DrawerFooter>
        </DrawerContent>
      </Drawer>

Environment

- Device: iPhone 16 Pro 
- OS: 18.5
- Broser: Safari
- React version: 18

Metadata

Metadata

Assignees

No one assigned

    Labels

    bugSomething isn't working

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions