{"id":19908677,"url":"https://github.com/svar-widgets/filemanager","last_synced_at":"2025-04-05T18:05:06.642Z","repository":{"id":257820482,"uuid":"869549723","full_name":"svar-widgets/filemanager","owner":"svar-widgets","description":"Easy-to-use Svelte file manager (file explorer) component","archived":false,"fork":false,"pushed_at":"2025-02-19T18:19:20.000Z","size":303,"stargazers_count":73,"open_issues_count":0,"forks_count":1,"subscribers_count":3,"default_branch":"main","last_synced_at":"2025-03-29T17:02:14.140Z","etag":null,"topics":["file-browser","file-browser-integration","file-explorer","file-manager","javascript","javascript-library","svelte","svelte-component","sveltejs","ui-components"],"latest_commit_sha":null,"homepage":"https://svar.dev/svelte/filemanager/","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/svar-widgets.png","metadata":{"files":{"readme":"readme.md","changelog":null,"contributing":null,"funding":null,"license":"license.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2024-10-08T13:37:11.000Z","updated_at":"2025-03-27T08:05:22.000Z","dependencies_parsed_at":"2024-10-10T12:39:51.601Z","dependency_job_id":"a9af14bf-bc56-460e-b3bd-9685fb8465f2","html_url":"https://github.com/svar-widgets/filemanager","commit_stats":null,"previous_names":["svar-widgets/filemanager"],"tags_count":3,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Ffilemanager","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Ffilemanager/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Ffilemanager/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/svar-widgets%2Ffilemanager/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/svar-widgets","download_url":"https://codeload.github.com/svar-widgets/filemanager/tar.gz/refs/heads/main","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247378135,"owners_count":20929296,"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":["file-browser","file-browser-integration","file-explorer","file-manager","javascript","javascript-library","svelte","svelte-component","sveltejs","ui-components"],"created_at":"2024-11-12T21:12:55.382Z","updated_at":"2025-04-05T18:05:06.623Z","avatar_url":"https://github.com/svar-widgets.png","language":"JavaScript","funding_links":[],"categories":["Svelte"],"sub_categories":[],"readme":"\u003cdiv align=\"center\"\u003e\n\t\n# SVAR Svelte File Manager | File Explorer\n\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n:globe_with_meridians: [Website](https://svar.dev/svelte/filemanager/) • :bulb: [Getting Started](https://docs.svar.dev/svelte/filemanager/getting_started/) • :eyes: [Demos](https://docs.svar.dev/svelte/filemanager/samples/#/base/willow)\n\n\u003c/div\u003e\n\n\u003cdiv align=\"center\"\u003e\n\n[![npm](https://img.shields.io/npm/v/wx-svelte-filemanager.svg)](https://www.npmjs.com/package/wx-svelte-filemanager)\n[![License](https://img.shields.io/github/license/svar-widgets/filemanager)](https://github.com/svar-widgets/filemanager/blob/main/license.txt)\n[![npm downloads](https://img.shields.io/npm/dm/wx-svelte-filemanager.svg)](https://www.npmjs.com/package/wx-svelte-filemanager)\n\n\u003c/div\u003e\n\nSVAR File Manager is a flexible file explorer component for Svelte apps. It offers a familiar interface for browsing, organizing, and previewing files. Integrate it with any backend, whether you're using local storage, databases, or cloud services.\n\n\u003cdiv align=\"center\"\u003e\n  \u003cimg src=\"https://cdn.svar.dev/public/file-manager-1400.png\" alt=\"SVAR File Manager for Svelte - UI\" width=\"700\"\u003e\n\u003c/div\u003e\n\n### Svelte 4 and Svelte 5 versions\n\nThere are two versions of the library: the 1.x version, designed to work with Svelte 4, and the 2.x version, created for Svelte 5. Please note that the 2.x version is in beta and may contain some instabilities.\n\nTo use the SVAR FileManager beta for Svelte 5, install it as follows:\n\n```\nnpm install wx-svelte-filemanager\n```\n\nTo use the SVAR FileManager for Svelte 4:\n\n```\nnpm install wx-svelte-filemanager@1.3.1\n```\n\n### :sparkles: Key features:\n\n-   Basic file operations: create, delete, copy, rename, cut, paste\n-   Download and upload files\n-   Files tree view\n-   List and tiles views\n-   File preview pane with file information (file size, type, modified date, etc)\n-   Split view to manage files between different locations\n-   Built-in search box\n-   Context menu and toolbar\n-   Keyboard navigation\n-   Used storage info\n\n### :hammer_and_pick: How to Use\n\nTo use the widget, simply import the package and include the component in your Svelte file:\n\n```svelte\n\u003cscript\u003e\n\timport { Filemanager } from \"wx-svelte-filemanager\";\n\n\tconst data = [\n\t\t{\n\t\t\tid: \"/Code\",\n\t\t\tdate: new Date(2023, 11, 2, 17, 25),\n\t\t\ttype: \"folder\",\n\t\t},\n\t];\n\tconst drive = {\n\t\tused: 15200000000,\n\t\ttotal: 50000000000,\n\t};\n\u003c/script\u003e\n\n\u003cFilemanager {data} {drive} /\u003e\n```\n\n### :computer: How to Modify\n\nTypically, you don't need to modify the code. However, if you wish to do so, follow these steps:\n\n1. Run `yarn` to install dependencies. Note that this project is a monorepo using `yarn` workspaces, so npm will not work\n2. Start the project in development mode with `yarn start`\n\n### :white_check_mark: Run Tests\n\nTo run the test:\n\n1. Start the test examples with:\n    ```sh\n    yarn start:tests\n    ```\n2. In a separate console, run the end-to-end tests with:\n    ```sh\n    yarn test:cypress\n    ```\n\n### :speech_balloon: Need Help?\n\n[Post an Issue](https://github.com/svar-widgets/filemanager/issues/) or use our [community forum](https://forum.svar.dev).\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvar-widgets%2Ffilemanager","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fsvar-widgets%2Ffilemanager","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fsvar-widgets%2Ffilemanager/lists"}