getMenuOptions
Description
Returns an array of default context menu options available for requested menu typeThe helper function takes the context menu type as an input and returns default context menu options available for this type
Usage
getMenuOptions: (mode: string) => [];
Parameters
mode
- (required) the type of the context menu that can be one of the following:file
- the context menu type for a file (if specified, the function will return menu options available for the file type)folder
- the context menu type for a folderadd
- if specified, the function will return context menu options available when clicking the Add new buttonbody
- if specified, the function will return context menu options that open on clicking an empty area in the cards or table view modemultiselect
- if specified, the function will return context menu options available for multiple selected files or folders
Returns
The function returns an array of context menu options that depend on the context menu type.
Default context menu options
The default array of menu options for each menu type includes objects with the following parameters for each:
icon
(string) - (optional) the name of an icontext
(string) - (optional) the text for an optionsubtext
(string) - (optional) a hotkey assigned to an optionid
(string) - (optional) the id of an option
Default context menu options are the following:
"body":
[
{
icon: "wxi-content-paste",
text: "Paste",
hotkey: "Ctrl+V",
id: "paste",
},
];
"add":
[
{
icon: "mdi mdi-folder-plus-outline",
text: "Add new file",
id: "add-file",
},
{
icon: "mdi mdi-file-plus-outline",
text: "Add new folder",
id: "add-folder",
},
{
icon: "mdi mdi-file-upload-outline",
text: "Upload file",
id: "upload",
type: "upload",
},
];
"multiselect":
[
{
icon: "wxi-content-copy",
text: "Copy",
hotkey: "Ctrl+C",
id: "copy",
},
{
icon: "wxi-content-cut",
text: "Cut",
hotkey: "Ctrl+X",
id: "move",
},
{
type: "separator",
},
{
icon: "wxi-close",
text: "Delete",
hotkey: "Delete",
id: "delete",
},
];
"file":
[
{
icon: "wxi-download",
text: "Download",
hotkey: "Ctrl+D",
id: "download",
},
{
icon: "wxi-content-copy",
text: "Copy",
hotkey: "Ctrl+C",
id: "copy",
},
{
icon: "wxi-content-cut",
text: "Cut",
hotkey: "Ctrl+X",
id: "move",
},
{
icon: "wxi-content-paste",
text: "Paste",
hotkey: "Ctrl+V",
id: "paste",
},
{
type: "separator",
},
{
icon: "wxi-edit",
text: "Rename",
hotkey: "Ctrl+R",
id: "rename",
},
{
icon: "wxi-close",
text: "Delete",
hotkey: "Delete",
id: "delete",
},
];
"folder":
[
{
icon: "wxi-content-copy",
text: "Copy",
hotkey: "Ctrl+C",
id: "copy",
},
{
icon: "wxi-content-cut",
text: "Cut",
hotkey: "Ctrl+X",
id: "move",
},
{
icon: "wxi-content-paste",
text: "Paste",
hotkey: "Ctrl+V",
id: "paste",
},
{
type: "separator",
},
{
icon: "wxi-edit",
text: "Rename",
hotkey: "Ctrl+R",
id: "rename",
},
{
icon: "wxi-close",
text: "Delete",
hotkey: "Delete",
id: "delete",
},
];
Example
In the example below we import the getMenuOptions
function to get the ready-made list of menu options, and then apply the menuOptions
function to keep only the Delete option for the "/Pictures" folder:
<script>
import { getData, getDrive } from "./common/data";
import { Filemanager, getMenuOptions } from "wx-svelte-filemanager";
function menuOptions(mode, item) {
switch (mode) {
case "folder":
if (item.id === "/Pictures")
return [
{
icon: "wxi-close",
text: "Delete",
hotkey: "Delete",
id: "delete",
},
];
default:
return getMenuOptions(mode);
}
}
</script>
<Filemanager data={getData()} drive={getDrive()} {menuOptions} />