getState

returns the reactive state object of File Manager

object getState();

object

state object

// returns the current state of File manager
const state = $$("fm").getState();
 
// switches the widget to the "cards" view 
state.mode = "cards";

Details

The returned state object contains the following properties and methods:

{
  clipboard: null,
  mode: "grid",
  path: "/",
  search: "",
  filter: {// filter config},
  selectedItem: []
}

mode (string) - set the currently/initially visible tab. Possible values are "list" (default), "cards" and "double"
path (string) - sets the currently/initially opened folder
selectedItem (array) - stores array of selected items (objects)
search (string) - stores text from the search input
filter (object) - stores the filtering config
clipboard (object) - stores clipboard data: file object (array) and the mode for pasting ("cut" or "copy"), e.g. { files:[{id: "/hello.txt", size: 0, type: "code", value: "hello.txt"}], mode:"copy" }.

$observe (function) - a handler to listen to changes in the current state of File Manager. It takes 2 parameters:
- prop (string) - a reactive property to listen changes of
- handler (function) - a function to execute when changes are made.
$batch (function)- allows to set several properties at once. Takes the only parameter:
- props (object) - an object containing the pairs of the property name and the value to set.

For example, you can listen to the selection changes as:

state.$observe("selectedItem", v =>
   $$("files").setValue(v.map(a => a.id).join(", "))
);

Or set several properties in a batch:

// switches to the "cards" view and clears the search field
state.$batch({
   mode:"cards", search:""
});