@finsemble/finsemble-ui 1.0.0-beta-1

package/react/components/toolbar/appLauncher/stores/appLauncherStore.js

@@ -0,0 +1,262 @@
+/*!
+ * Copyright 2017 by ChartIQ, Inc.
+ * All rights reserved.
+ */
+import async from "async";
+let appLauncherStore;
+let COMPONENT_UPDATE_CHANNEL;
+const Actions = {
+    componentList: {},
+    initialize: function (cb) {
+        async.parallel([
+            Actions.initializeComponentList,
+            Actions.getUserDefinedComponentList,
+            // eslint-disable-next-line @typescript-eslint/no-use-before-define
+            setupHotkeys,
+        ], (err) => {
+            if (err) {
+                console.error(err);
+            }
+            FSBL.Clients.Logger.system.debug("Actions.initialize done");
+            cb();
+        });
+    },
+    getComponentList(cb) {
+        FSBL.Clients.LauncherClient.getComponentList((err, response) => {
+            if (typeof err === "string") {
+                throw new Error(err);
+            }
+            // Each AppLauncher
+            FSBL.Clients.Logger.system.debug("getComponentList from LauncherClient", response);
+            Actions.filterComponents(response);
+            if (cb) {
+                cb();
+            }
+        });
+    },
+    initializeComponentList(cb) {
+        const self = Actions;
+        let firstTime = true;
+        // When an app launcher button is clicked, it sends over the types of components that the app launcher can spawn. We assign that data to an object in the windowClient, and then use that to render the app launcher.
+        FSBL.Clients.RouterClient.subscribe(COMPONENT_UPDATE_CHANNEL, (_err, response) => {
+            if (!FSBL.Clients.WindowClient.options.customData.spawnData) {
+                FSBL.Clients.WindowClient.options.customData.spawnData = {};
+            }
+            Object.assign(FSBL.Clients.WindowClient.options.customData.spawnData, response.data);
+            if (firstTime) {
+                // only update component list the first time to eliminate re-rendering the menu
+                Actions.getComponentList(cb);
+                firstTime = false;
+            }
+        });
+        // Whenever we add or remove a component, this event is fired. We get a list of all components, then filter it out to include only the ones that this particular launcher is capable of spawning.
+        FSBL.Clients.RouterClient.subscribe("Launcher.update", (err, response) => {
+            FSBL.Clients.Logger.system.debug("list updated", err, response);
+            if (err) {
+                return console.error(err);
+            }
+            self.filterComponents(response.data.componentList);
+        });
+    },
+    // get quick components that the user created from storage.
+    getUserDefinedComponentList(cb) {
+        return cb();
+    },
+    // saves quick components
+    saveCustomComponents() {
+        const UDCs = {};
+        const components = Object.keys(Actions.componentList);
+        for (let i = 0; i < components.length; i++) {
+            const config = Actions.componentList[components[i]];
+            if (config.component && config.component.isUserDefined) {
+                UDCs[config.component.type] = config;
+            }
+        }
+        FSBL.Clients.StorageClient.save({
+            topic: "finsemble",
+            key: "userDefinedComponents",
+            value: UDCs,
+        });
+    },
+    /**
+     * Produce a filtered component list based on the settings for this menu (either "mode" or "list").
+     *
+     * Components will only be added to the returned list if they match the specified mode or
+     * are found in the specified list
+     */
+    processSettings(settings, components) {
+        let componentList = {};
+        const keys = Object.keys(components);
+        if (settings.mode) {
+            const settingsMode = Array.isArray(settings.mode) ? settings.mode : [settings.mode];
+            keys.forEach((componentType) => {
+                var _a;
+                const config = components[componentType];
+                const mode = ((_a = config === null || config === void 0 ? void 0 : config.component) === null || _a === void 0 ? void 0 : _a.mode) || [""];
+                const coponentMode = Array.isArray(mode) ? mode : [mode];
+                const commonModes = coponentMode.filter((n) => settingsMode.indexOf(n) !== -1);
+                // If the current mode isn't in the list of modes for the component then don't include it in our list
+                if (commonModes.length) {
+                    componentList[componentType] = components[componentType];
+                }
+            });
+        }
+        if (settings.list) {
+            const commonItems = settings.list.filter((n) => keys.indexOf(n) !== -1);
+            for (let i = 0; i < commonItems.length; i++) {
+                componentList[commonItems[i]] = components[commonItems[i]];
+            }
+        }
+        return componentList;
+    },
+    // This filters components based on the mode and list settings in customData
+    // Available settings are list - where you list specific individual component Types, mode - which piggybacks on config.mode and lists all components where the mode matches
+    // If neither mode not list are set, all components are shown
+    // Custom Components are always shown
+    filterComponents(components = {}) {
+        var _a;
+        const settings = (_a = FSBL.Clients.WindowClient.getSpawnData()) !== null && _a !== void 0 ? _a : {};
+        this.componentList = settings.mode || settings.list ? this.processSettings(settings, components) : components;
+        FSBL.Clients.Logger.system.debug("appLauncher filterComponents", this.componentList, "settings", settings, "customData", FSBL.Clients.WindowClient.options.customData);
+        appLauncherStore === null || appLauncherStore === void 0 ? void 0 : appLauncherStore.setValue({
+            field: "componentList",
+            value: this.componentList,
+        });
+        this.saveCustomComponents();
+    },
+    // Handler for when the user wants to remove a quick component.
+    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+    handleRemoveCustomComponent(componentName, cb = (wasDeconsted) => { }) {
+        const self = this;
+        FSBL.Clients.DialogManager.open("yesNo", {
+            title: "Delete this App?",
+            question: `Are you sure you would like to delete "${componentName}"?`,
+            affirmativeResponseLabel: "Delete",
+            showNegativeButton: false,
+        }, (err, response) => {
+            // If the user chooses "affirmative" then delete the component.
+            // We should never get an error, but if we do then go ahead and delete the component too.
+            if (err || response.choice === "affirmative") {
+                cb(true);
+                self.removeCustomComponent(componentName);
+            }
+            else {
+                cb(false);
+            }
+        });
+    },
+    // Remove the component, notify others.
+    removeCustomComponent(componentName) {
+        FSBL.Clients.LauncherClient.removeUserDefinedComponent({
+            name: componentName,
+        }, (err) => {
+            if (err) {
+                return console.error(err);
+            }
+            Actions.getComponentList();
+        });
+    },
+    // Hide the window.
+    hideWindow() {
+        finsembleWindow.hide();
+    },
+    // Spawn a component.
+    launchComponent(config, params, cb) {
+        // Actions.hideWindow();
+        const defaultParams = {
+            addToWorkspace: true,
+            monitor: "mine",
+            options: { customData: {} },
+        };
+        params = Object.assign(defaultParams, params);
+        if (!params.options.customData) {
+            params.options.customData = {};
+        }
+        if (!params.options.customData.component) {
+            params.options.customData.component = {};
+        }
+        if (config.component.windowGroup) {
+            params.groupName = config.component.windowGroup;
+        }
+        FSBL.Clients.LauncherClient.spawn(config.component.type, params, (_err, windowInfo) => {
+            if (cb) {
+                cb(windowInfo === null || windowInfo === void 0 ? void 0 : windowInfo.windowIdentifier);
+            }
+        });
+    },
+};
+function createLocalStore(done) {
+    const defaultData = {
+        componentList: {},
+        monitorDimensions: {},
+    };
+    FSBL.Clients.DistributedStoreClient.createStore({ store: "Finsemble-AppLauncher-Local-Store", values: defaultData }, (_err, store) => {
+        appLauncherStore = store;
+        done();
+    });
+}
+function getWindowGroupStore(done) {
+    FSBL.Clients.DistributedStoreClient.createStore({ global: true, store: "Finsemble-WindowGroups" }, () => {
+        done();
+    });
+}
+function initialize(cb) {
+    COMPONENT_UPDATE_CHANNEL = `${finsembleWindow.name}.ComponentsToRender`;
+    FSBL.Clients.RouterClient.addPubSubResponder(COMPONENT_UPDATE_CHANNEL, {});
+    async.parallel([createLocalStore, getWindowGroupStore, Actions.initialize], (err) => {
+        if (err) {
+            console.error(err);
+        }
+        FSBL.Clients.Logger.system.debug("appLauncherstore init done");
+        cb(appLauncherStore);
+    });
+}
+const keys = {};
+function setupHotkeys(cb) {
+    FSBL.Clients.RouterClient.subscribe("humanInterface.keydown", (_err, response) => {
+        if (!keys[response.data.key]) {
+            keys[response.data.key] = {};
+        }
+        keys[response.data.key] = true;
+        if (keys[160] && keys[162] && keys[68] && Actions.componentList["Advanced Chart"]) {
+            FSBL.Clients.LauncherClient.spawn("Advanced Chart", { addToWorkspace: true, monitor: "mine" });
+        }
+    });
+    FSBL.Clients.RouterClient.subscribe("humanInterface.keyup", (_err, response) => {
+        if (!keys[response.data.key]) {
+            keys[response.data.key] = {};
+        }
+        keys[response.data.key] = false;
+    });
+    return cb();
+}
+const getStore = () => appLauncherStore;
+class StoreManager {
+    constructor() {
+        this.initialized = false;
+        this.initializing = false;
+        this.callbacks = [];
+        this.store = null;
+    }
+    initialize() {
+        if (this.initializing)
+            return;
+        this.initializing = true;
+        initialize((store) => {
+            this.initialized = true;
+            this.store = store;
+            this.callbacks.forEach((cb) => cb(store));
+        });
+    }
+    addInitializedListener(cb) {
+        if (this.initialized && this.store)
+            return cb(this.store);
+        this.callbacks.push(cb);
+    }
+    removeInitializedListener(cb) {
+        this.callbacks = this.callbacks.filter((entry) => entry !== cb);
+    }
+}
+const storeManager = new StoreManager();
+export { storeManager, initialize, appLauncherStore as Store, Actions, getStore };
+//# sourceMappingURL=appLauncherStore.js.map

package/react/components/toolbar/appLauncher/stores/appLauncherStore.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"appLauncherStore.js","sourceRoot":"","sources":["../../../../../src/components/toolbar/appLauncher/stores/appLauncherStore.ts"],"names":[],"mappings":"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","sourcesContent":["/*!\n * Copyright 2017 by ChartIQ, Inc.\n * All rights reserved.\n */\n\nimport StoreModel from \"@finsemble/finsemble-api/types/clients/StoreModel\";\nimport { SpawnResponse } from \"@finsemble/finsemble-api/types/clients/launcherClient\";\nimport { StandardError } from \"@finsemble/finsemble-api/types/types\";\nimport async from \"async\";\nimport { WindowIdentifier } from \"@finsemble/finsemble-api\";\nlet appLauncherStore: StoreModel | undefined;\nlet COMPONENT_UPDATE_CHANNEL: string;\ntype VoidCallback = () => void;\ntype ComponentDescriptor = Record<string, any>;\ntype ComponentList = Record<string, ComponentDescriptor>;\n\nconst Actions = {\n\tcomponentList: {} as ComponentList,\n\tinitialize: function (cb: VoidCallback) {\n\t\tasync.parallel(\n\t\t\t[\n\t\t\t\tActions.initializeComponentList,\n\t\t\t\tActions.getUserDefinedComponentList,\n\t\t\t\t// eslint-disable-next-line @typescript-eslint/no-use-before-define\n\t\t\t\tsetupHotkeys,\n\t\t\t],\n\t\t\t(err) => {\n\t\t\t\tif (err) {\n\t\t\t\t\tconsole.error(err);\n\t\t\t\t}\n\t\t\t\tFSBL.Clients.Logger.system.debug(\"Actions.initialize done\");\n\t\t\t\tcb();\n\t\t\t}\n\t\t);\n\t},\n\tgetComponentList(cb?: VoidCallback) {\n\t\tFSBL.Clients.LauncherClient.getComponentList((err: StandardError, response) => {\n\t\t\tif (typeof err === \"string\") {\n\t\t\t\tthrow new Error(err);\n\t\t\t}\n\t\t\t// Each AppLauncher\n\t\t\tFSBL.Clients.Logger.system.debug(\"getComponentList from LauncherClient\", response);\n\t\t\tActions.filterComponents(response);\n\t\t\tif (cb) {\n\t\t\t\tcb();\n\t\t\t}\n\t\t});\n\t},\n\tinitializeComponentList(cb: VoidCallback) {\n\t\tconst self = Actions;\n\t\tlet firstTime = true;\n\n\t\t// When an app launcher button is clicked, it sends over the types of components that the app launcher can spawn. We assign that data to an object in the windowClient, and then use that to render the app launcher.\n\t\tFSBL.Clients.RouterClient.subscribe(COMPONENT_UPDATE_CHANNEL, (_err, response) => {\n\t\t\tif (!FSBL.Clients.WindowClient.options.customData.spawnData) {\n\t\t\t\tFSBL.Clients.WindowClient.options.customData.spawnData = {};\n\t\t\t}\n\t\t\tObject.assign(FSBL.Clients.WindowClient.options.customData.spawnData, response.data);\n\t\t\tif (firstTime) {\n\t\t\t\t// only update component list the first time to eliminate re-rendering the menu\n\t\t\t\tActions.getComponentList(cb);\n\t\t\t\tfirstTime = false;\n\t\t\t}\n\t\t});\n\n\t\t// Whenever we add or remove a component, this event is fired. We get a list of all components, then filter it out to include only the ones that this particular launcher is capable of spawning.\n\t\tFSBL.Clients.RouterClient.subscribe(\"Launcher.update\", (err, response) => {\n\t\t\tFSBL.Clients.Logger.system.debug(\"list updated\", err, response);\n\t\t\tif (err) {\n\t\t\t\treturn console.error(err);\n\t\t\t}\n\t\t\tself.filterComponents(response.data.componentList);\n\t\t});\n\t},\n\t// get quick components that the user created from storage.\n\tgetUserDefinedComponentList(cb: VoidCallback) {\n\t\treturn cb();\n\t},\n\t// saves quick components\n\tsaveCustomComponents() {\n\t\tconst UDCs: { [key: string]: any } = {};\n\t\tconst components = Object.keys(Actions.componentList);\n\t\tfor (let i = 0; i < components.length; i++) {\n\t\t\tconst config = Actions.componentList[components[i]];\n\t\t\tif (config.component && config.component.isUserDefined) {\n\t\t\t\tUDCs[config.component.type] = config;\n\t\t\t}\n\t\t}\n\t\tFSBL.Clients.StorageClient.save({\n\t\t\ttopic: \"finsemble\",\n\t\t\tkey: \"userDefinedComponents\",\n\t\t\tvalue: UDCs,\n\t\t});\n\t},\n\t/**\n\t * Produce a filtered component list based on the settings for this menu (either \"mode\" or \"list\").\n\t *\n\t * Components will only be added to the returned list if they match the specified mode or\n\t * are found in the specified list\n\t */\n\tprocessSettings(settings: any, components: ComponentList): ComponentList {\n\t\tlet componentList: ComponentList = {};\n\t\tconst keys = Object.keys(components);\n\t\tif (settings.mode) {\n\t\t\tconst settingsMode = Array.isArray(settings.mode) ? settings.mode : [settings.mode];\n\n\t\t\tkeys.forEach((componentType) => {\n\t\t\t\tconst config = components[componentType];\n\t\t\t\tconst mode = config?.component?.mode || [\"\"];\n\t\t\t\tconst coponentMode = Array.isArray(mode) ? mode : [mode];\n\n\t\t\t\tconst commonModes = coponentMode.filter((n: ComponentDescriptor) => settingsMode.indexOf(n) !== -1);\n\n\t\t\t\t// If the current mode isn't in the list of modes for the component then don't include it in our list\n\t\t\t\tif (commonModes.length) {\n\t\t\t\t\tcomponentList[componentType] = components[componentType];\n\t\t\t\t}\n\t\t\t});\n\t\t}\n\t\tif (settings.list) {\n\t\t\tconst commonItems = settings.list.filter((n: any) => keys.indexOf(n) !== -1);\n\n\t\t\tfor (let i = 0; i < commonItems.length; i++) {\n\t\t\t\tcomponentList[commonItems[i]] = components[commonItems[i]];\n\t\t\t}\n\t\t}\n\t\treturn componentList;\n\t},\n\t// This filters components based on the mode and list settings in customData\n\t// Available settings are list - where you list specific individual component Types, mode - which piggybacks on config.mode and lists all components where the mode matches\n\t// If neither mode not list are set, all components are shown\n\t// Custom Components are always shown\n\tfilterComponents(components: ComponentList = {}) {\n\t\tconst settings = FSBL.Clients.WindowClient.getSpawnData() ?? {};\n\t\tthis.componentList = settings.mode || settings.list ? this.processSettings(settings, components) : components;\n\n\t\tFSBL.Clients.Logger.system.debug(\n\t\t\t\"appLauncher filterComponents\",\n\t\t\tthis.componentList,\n\t\t\t\"settings\",\n\t\t\tsettings,\n\t\t\t\"customData\",\n\t\t\tFSBL.Clients.WindowClient.options.customData\n\t\t);\n\t\tappLauncherStore?.setValue({\n\t\t\tfield: \"componentList\",\n\t\t\tvalue: this.componentList,\n\t\t});\n\t\tthis.saveCustomComponents();\n\t},\n\t// Handler for when the user wants to remove a quick component.\n\t// eslint-disable-next-line @typescript-eslint/no-unused-vars\n\thandleRemoveCustomComponent(componentName: string, cb = (wasDeconsted: boolean) => {}) {\n\t\tconst self = this;\n\t\tFSBL.Clients.DialogManager.open(\n\t\t\t\"yesNo\",\n\t\t\t{\n\t\t\t\ttitle: \"Delete this App?\",\n\t\t\t\tquestion: `Are you sure you would like to delete \"${componentName}\"?`,\n\t\t\t\taffirmativeResponseLabel: \"Delete\",\n\t\t\t\tshowNegativeButton: false,\n\t\t\t},\n\t\t\t(err, response) => {\n\t\t\t\t// If the user chooses \"affirmative\" then delete the component.\n\t\t\t\t// We should never get an error, but if we do then go ahead and delete the component too.\n\t\t\t\tif (err || response.choice === \"affirmative\") {\n\t\t\t\t\tcb(true);\n\t\t\t\t\tself.removeCustomComponent(componentName);\n\t\t\t\t} else {\n\t\t\t\t\tcb(false);\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t},\n\t// Remove the component, notify others.\n\tremoveCustomComponent(componentName: string) {\n\t\tFSBL.Clients.LauncherClient.removeUserDefinedComponent(\n\t\t\t{\n\t\t\t\tname: componentName,\n\t\t\t},\n\t\t\t(err) => {\n\t\t\t\tif (err) {\n\t\t\t\t\treturn console.error(err);\n\t\t\t\t}\n\t\t\t\tActions.getComponentList();\n\t\t\t}\n\t\t);\n\t},\n\t// Hide the window.\n\thideWindow() {\n\t\tfinsembleWindow.hide();\n\t},\n\t// Spawn a component.\n\tlaunchComponent(config: any, params: any, cb?: (win?: WindowIdentifier) => void) {\n\t\t// Actions.hideWindow();\n\t\tconst defaultParams = {\n\t\t\taddToWorkspace: true,\n\t\t\tmonitor: \"mine\",\n\t\t\toptions: { customData: {} },\n\t\t};\n\t\tparams = Object.assign(defaultParams, params);\n\t\tif (!params.options.customData) {\n\t\t\tparams.options.customData = {};\n\t\t}\n\t\tif (!params.options.customData.component) {\n\t\t\tparams.options.customData.component = {};\n\t\t}\n\t\tif (config.component.windowGroup) {\n\t\t\tparams.groupName = config.component.windowGroup;\n\t\t}\n\t\tFSBL.Clients.LauncherClient.spawn(\n\t\t\tconfig.component.type,\n\t\t\tparams,\n\t\t\t(_err: StandardError, windowInfo?: SpawnResponse) => {\n\t\t\t\tif (cb) {\n\t\t\t\t\tcb(windowInfo?.windowIdentifier);\n\t\t\t\t}\n\t\t\t}\n\t\t);\n\t},\n};\n\nfunction createLocalStore(done: VoidCallback) {\n\tconst defaultData = {\n\t\tcomponentList: {},\n\t\tmonitorDimensions: {},\n\t};\n\n\tFSBL.Clients.DistributedStoreClient.createStore(\n\t\t{ store: \"Finsemble-AppLauncher-Local-Store\", values: defaultData },\n\t\t(_err, store) => {\n\t\t\tappLauncherStore = store;\n\t\t\tdone();\n\t\t}\n\t);\n}\n\nfunction getWindowGroupStore(done: VoidCallback) {\n\tFSBL.Clients.DistributedStoreClient.createStore({ global: true, store: \"Finsemble-WindowGroups\" }, () => {\n\t\tdone();\n\t});\n}\n\nfunction initialize(cb: (store?: StoreModel) => void) {\n\tCOMPONENT_UPDATE_CHANNEL = `${finsembleWindow.name}.ComponentsToRender`;\n\tFSBL.Clients.RouterClient.addPubSubResponder(COMPONENT_UPDATE_CHANNEL, {});\n\tasync.parallel([createLocalStore, getWindowGroupStore, Actions.initialize], (err) => {\n\t\tif (err) {\n\t\t\tconsole.error(err);\n\t\t}\n\t\tFSBL.Clients.Logger.system.debug(\"appLauncherstore init done\");\n\t\tcb(appLauncherStore);\n\t});\n}\n\nconst keys: { [key: string]: any } = {};\nfunction setupHotkeys(cb: VoidCallback) {\n\tFSBL.Clients.RouterClient.subscribe(\"humanInterface.keydown\", (_err, response) => {\n\t\tif (!keys[response.data.key]) {\n\t\t\tkeys[response.data.key] = {};\n\t\t}\n\t\tkeys[response.data.key] = true;\n\t\tif (keys[160] && keys[162] && keys[68] && Actions.componentList[\"Advanced Chart\"]) {\n\t\t\tFSBL.Clients.LauncherClient.spawn(\"Advanced Chart\", { addToWorkspace: true, monitor: \"mine\" });\n\t\t}\n\t});\n\tFSBL.Clients.RouterClient.subscribe(\"humanInterface.keyup\", (_err, response) => {\n\t\tif (!keys[response.data.key]) {\n\t\t\tkeys[response.data.key] = {};\n\t\t}\n\t\tkeys[response.data.key] = false;\n\t});\n\n\treturn cb();\n}\n\nconst getStore = () => appLauncherStore;\n\nclass StoreManager {\n\tinitialized: boolean;\n\n\tinitializing: boolean;\n\n\tcallbacks: Function[];\n\n\tstore: StoreModel | undefined | null;\n\n\tconstructor() {\n\t\tthis.initialized = false;\n\t\tthis.initializing = false;\n\t\tthis.callbacks = [];\n\t\tthis.store = null;\n\t}\n\n\tinitialize() {\n\t\tif (this.initializing) return;\n\t\tthis.initializing = true;\n\t\tinitialize((store?: StoreModel) => {\n\t\t\tthis.initialized = true;\n\t\t\tthis.store = store;\n\t\t\tthis.callbacks.forEach((cb) => cb(store));\n\t\t});\n\t}\n\n\taddInitializedListener(cb: (store: StoreModel) => void) {\n\t\tif (this.initialized && this.store) return cb(this.store);\n\t\tthis.callbacks.push(cb);\n\t}\n\n\tremoveInitializedListener(cb: Function) {\n\t\tthis.callbacks = this.callbacks.filter((entry) => entry !== cb);\n\t}\n}\nconst storeManager = new StoreManager();\n\nexport { storeManager, initialize, appLauncherStore as Store, Actions, getStore };\n"]}

package/react/components/toolbar/dashbar/Dashbar.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+import { Dashbar as DashbarType } from "../../../types/dashbarTypes";
+import "../../../assets/css/dashbar.css";
+export declare const Dashbar: ({ className, children, widgetTitleGenerator }: DashbarType) => JSX.Element | null;

package/react/components/toolbar/dashbar/Dashbar.js

@@ -0,0 +1,366 @@
+import React, { useEffect, useState } from "react";
+import { DashbarItem } from "./DashbarItem";
+import { useDashbar } from "../../../hooks/useDashbar";
+import { useToolbar } from "../../../hooks/useToolbar";
+import { FinsembleDnDContext, AllowableDnDAxis } from "../../legacyControls/FinsembleDnDContext";
+import clone from "lodash/cloneDeep";
+import "../../../assets/css/dashbar.css";
+let cachedWidgetTop;
+let cachedWidgetHeight;
+export const Dashbar = ({ className, children, widgetTitleGenerator }) => {
+    const { dashbarItems, reorderDashbarItems } = useDashbar();
+    const { launchPreferences } = useToolbar();
+    const [widgets, setWidgets] = useState({});
+    const [horizontalBounds, setHorizontalBounds] = useState(0);
+    const [wasReorganized, setReorganized] = useState(false);
+    const [totalWidgetsWidth, setTotalWidgetsWidth] = useState(0);
+    const [isUpdatingState, setIsUpdatingState] = useState(false);
+    const [secondUpdateRequired, setSecondUpdateRequired] = useState(false);
+    let movingIndex = null; // The dashbarItem index being dragged, null if none
+    let titleGrabPosition = null; // The mouse of event when a widget title is dragged
+    let offsetX = null; // The original grab location of a given view titlebar
+    const WIDGET_COUNT = Object.keys(widgets).length;
+    const SCROLL_BUTTON_DEFAULT_WIDTH = 30;
+    const defaultWidgetTitleGenerator = (widget, titleRef) => {
+        const handleWidgetTitleClick = () => {
+            if (widget.raiseIntentOptions) {
+                fdc3.raiseIntent(widget.raiseIntentOptions.intent, widget.raiseIntentOptions.context, widget.raiseIntentOptions.targetApp);
+            }
+        };
+        return (React.createElement("div", { ref: titleRef, onClick: () => handleWidgetTitleClick() },
+            React.createElement("span", { dangerouslySetInnerHTML: { __html: widget.title } })));
+    };
+    const titleGenerator = widgetTitleGenerator !== null && widgetTitleGenerator !== void 0 ? widgetTitleGenerator : defaultWidgetTitleGenerator;
+    /**
+     *
+     * @param {object} params
+     * @param {number} oldIndex The index of the item being moved
+     * @param {number} newIndex The index to move the item to
+     */
+    const reorderItems = ({ oldIndex, newIndex }) => {
+        movingIndex = null;
+        titleGrabPosition = null;
+        offsetX = null;
+        setReorganized(true);
+        // Update the redux store
+        reorderDashbarItems({ oldIndex, newIndex });
+    };
+    const launchDashbar = () => {
+        launchPreferences("Dashbar");
+    };
+    const { dashbar } = FSBL.Clients.WindowClient.getSpawnData();
+    // Dashbar is disabled (no config in toolbar) or dashbar height is not specified
+    if (!dashbar || !dashbar.height) {
+        return null;
+    }
+    const toolbarHeight = finsembleWindow.windowOptions.height;
+    const dashbarHeight = `${dashbar.height}px`;
+    const verticalBounds = toolbarHeight - dashbar.height;
+    const widgetDividerWidth = dashbar.widgetDividerWidth || 0;
+    const wrapperClasses = `finsemble-dashbar ${className || ""}`.trim();
+    const getTotalWidth = () => {
+        let totalWidth = 0;
+        dashbarItems.forEach((item) => {
+            totalWidth = totalWidth + item.width;
+        });
+        return totalWidth;
+    };
+    const [leftButtonTooltip, setLeftButtonTooltip] = useState("");
+    const [rightButtonTooltip, setRightButtonTooltip] = useState("");
+    // For calculation widgets position that function uses the HTML elements.
+    // If something will be changed in HTML hierarchy for widgets, that function should be refactored.
+    const setWidgetsPositions = async () => {
+        var _a;
+        const { data: bounds } = await finsembleWindow.getBounds();
+        const scrollButtonsEnabled = document.querySelectorAll("#dashbar-container > .chevron-container").length > 0;
+        const elements = document.getElementsByClassName("finsemble-dashbar-item");
+        let toolbarWidth = (_a = bounds === null || bounds === void 0 ? void 0 : bounds.width) !== null && _a !== void 0 ? _a : 0;
+        let SCROLL_BUTTON_WIDTH = SCROLL_BUTTON_DEFAULT_WIDTH;
+        if (scrollButtonsEnabled) {
+            // Get actual width in case of client styling
+            SCROLL_BUTTON_WIDTH = document.querySelectorAll("#dashbar-container > .chevron-container")[0]
+                .offsetWidth;
+            toolbarWidth = toolbarWidth - 2 * SCROLL_BUTTON_WIDTH;
+        }
+        let tempLeft = 0;
+        let leftButtonSize = 0;
+        if (scrollButtonsEnabled) {
+            tempLeft = SCROLL_BUTTON_WIDTH;
+            leftButtonSize = SCROLL_BUTTON_WIDTH;
+        }
+        let leftItemsCount = 0;
+        let rightItemsCount = 0;
+        for (const dashbarItem of elements) {
+            // rect.width already contains the divider width
+            const rect = dashbarItem.getBoundingClientRect();
+            const dashbarItemFrame = dashbarItem.firstChild;
+            const widgetId = dashbarItemFrame.id;
+            const widget = widgets[widgetId];
+            // Happens when widgets were removed, but dom-elements still exists. So just ignore.
+            if (!widget)
+                continue;
+            if (rect.left < SCROLL_BUTTON_WIDTH && scrollButtonsEnabled) {
+                widget.bounds.width = 0;
+                widget.bounds.left = tempLeft;
+                leftItemsCount++;
+            }
+            else {
+                widget.bounds.width = rect.width - widgetDividerWidth;
+                widget.bounds.left = tempLeft;
+                tempLeft = tempLeft + rect.width;
+            }
+            let offsetRight = rect.left + rect.width - widgetDividerWidth - leftButtonSize - toolbarWidth;
+            if (offsetRight > 0) {
+                // hide title for invisible items
+                dashbarItemFrame.firstChild.style.visibility = "hidden";
+                widget.bounds.width = 0;
+                rightItemsCount++;
+            }
+            else {
+                dashbarItemFrame.firstChild.style.visibility = "visible";
+            }
+            widget.view.setBounds(widget.bounds);
+        }
+        setLeftButtonTooltip(`${leftItemsCount} more`);
+        setRightButtonTooltip(`${rightItemsCount} more`);
+    };
+    const addWidgets = async () => {
+        const _widgets = clone(widgets);
+        let tempHorizontalBounds = horizontalBounds;
+        for (const item of dashbarItems) {
+            const widgetBounds = {
+                top: verticalBounds,
+                left: tempHorizontalBounds,
+                width: item.width - widgetDividerWidth,
+                height: item.height || dashbar.height,
+            };
+            if (!_widgets.hasOwnProperty(item.id)) {
+                const webContentsName = `(Dashbar) ${item.id}`;
+                const res = await finsembleWindow.addBrowserView({
+                    url: item.url,
+                    webContentsName,
+                    bounds: widgetBounds,
+                    allowAutoResize: false,
+                });
+                _widgets[item.id] = {
+                    url: item.url,
+                    title: item.title,
+                    bounds: widgetBounds,
+                    view: res,
+                    width: item.width,
+                    raiseIntentOptions: item.raiseIntentOptions,
+                };
+                tempHorizontalBounds = tempHorizontalBounds + item.width;
+            }
+        }
+        setWidgets(_widgets);
+        setHorizontalBounds(tempHorizontalBounds);
+    };
+    const removeWidgets = async () => {
+        const _widgets = clone(widgets);
+        // Widgets is an object, with each key being a reference to an item in dashbarItems
+        // but dashbarItems is an array of objects. Its necessary to loop through them to determine
+        // the differences to figure out which items were removed.
+        const toRemove = [];
+        Object.keys(_widgets).forEach((widgetId) => {
+            let found = false;
+            for (let i = 0; i < dashbarItems.length; i++) {
+                const dashItem = dashbarItems[i];
+                if (dashItem.id === widgetId) {
+                    found = true;
+                    break;
+                }
+            }
+            if (!found) {
+                toRemove.push(widgetId);
+            }
+        });
+        let tempNewHorizontalBounds = 0;
+        // toRemove is an array of widgetIds which were no longer found in dashbarItems
+        // As items are removed, the remaining items have to be shuffled to fill the space
+        for (const id of toRemove) {
+            if (_widgets.hasOwnProperty(id)) {
+                await _widgets[id].view.remove(() => {
+                    delete _widgets[id];
+                    // Shuffle remaining views to fill any gaps that were left
+                    Object.values(_widgets).forEach((widget) => {
+                        widget.bounds = {
+                            width: widget.bounds.width,
+                            height: widget.bounds.height,
+                            left: tempNewHorizontalBounds,
+                            top: widget.bounds.top,
+                        };
+                        widget.view.setBounds(widget.bounds);
+                        tempNewHorizontalBounds = tempNewHorizontalBounds + widget.bounds.width;
+                    });
+                });
+            }
+            else {
+                FSBL.Clients.Logger.system.error(`Error removing widget: ${id} from dashbar`);
+            }
+        }
+        setWidgets(_widgets);
+        setHorizontalBounds(tempNewHorizontalBounds);
+    };
+    const reorganizeWidgets = () => {
+        const _widgets = clone(widgets);
+        // Each view needs to be resituated to fill any holes
+        // left by views that have been removed. Use a tempBounds
+        // int to keep track of new widths and set the overall width
+        // once everything is re-seated
+        let tempBounds = 0;
+        dashbarItems.forEach((item) => {
+            const widget = _widgets[item.id];
+            widget.bounds = {
+                height: cachedWidgetHeight || widget.bounds.height,
+                width: widget.bounds.width,
+                top: cachedWidgetTop || verticalBounds,
+                left: tempBounds,
+            };
+            widget.view.setBounds(widget.bounds);
+            delete _widgets[item.id];
+            _widgets[item.id] = widget;
+            tempBounds = tempBounds + item.width;
+        });
+        setReorganized(false);
+        setWidgets(_widgets);
+        setHorizontalBounds(tempBounds);
+    };
+    const updateItems = () => {
+        const doUpdate = async () => {
+            if (dashbarItems.length > WIDGET_COUNT) {
+                //Items have been added
+                await addWidgets();
+                setTotalWidgetsWidth(getTotalWidth());
+            }
+            else if (dashbarItems.length < WIDGET_COUNT) {
+                //Items have been removed
+                await removeWidgets();
+                setTotalWidgetsWidth(getTotalWidth());
+            }
+            else if (wasReorganized) {
+                if (movingIndex)
+                    return;
+                // Length is the same, order has changed
+                reorganizeWidgets();
+            }
+            await setWidgetsPositions();
+            setIsUpdatingState(false);
+        };
+        if (isUpdatingState === false) {
+            setIsUpdatingState(true);
+            doUpdate();
+        }
+        else if (!secondUpdateRequired) {
+            setSecondUpdateRequired(true);
+        }
+    };
+    /**
+     * When the distributed store's 'dashbaritems' is updated it will cause this hook to
+     * execute. The local representation of widgets will be mutated, then a call to
+     * setWidgets will re-render the component
+     */
+    useEffect(() => {
+        updateItems();
+    }, [dashbarItems]);
+    /**
+     * DashbarItems can be changed very quickly before all widgets will be initialized.
+     * Double-calling updateItems() fixes a bug.
+     */
+    useEffect(() => {
+        if (secondUpdateRequired && !isUpdatingState) {
+            updateItems();
+            setSecondUpdateRequired(false);
+        }
+    }, [isUpdatingState, secondUpdateRequired]);
+    /**
+     * Sets the title height as determined by the DashbarItem
+     * component, since the CSS can be changed by the user
+     * the component will render the title and pass back
+     * computed height of that title, then the Dashbar will
+     * make room for item
+     *
+     * @param {number} titleHeight The height of the span containing the title
+     * @param {string} id The key'ed id of the view
+     */
+    const setTitleHeight = (titleHeight, id) => {
+        const _widgets = widgets;
+        const widget = _widgets[id];
+        if (cachedWidgetTop) {
+            titleHeight = 0;
+        }
+        const newBounds = {
+            top: cachedWidgetTop || widget.bounds.top + titleHeight,
+            left: widget.bounds.left,
+            height: cachedWidgetHeight || widget.bounds.height - titleHeight,
+            width: widget.bounds.width,
+        };
+        cachedWidgetTop = newBounds.top;
+        cachedWidgetHeight = newBounds.height;
+        widget.view.setBounds(newBounds);
+        widget.bounds = newBounds;
+    };
+    /**
+     * When a view starts moving, bring it to the front
+     *
+     * @param {MouseEvent} event The event passed by react-sortable-hoc
+     */
+    const startMove = (node, event) => {
+        movingIndex = node.index;
+        if (offsetX === null && titleGrabPosition !== null) {
+            offsetX = event.clientX - titleGrabPosition;
+        }
+        const widget = Object.values(widgets)[node.index];
+        widget.view.bringToFront();
+    };
+    /**
+     * Event triggered by view movement
+     *
+     * @param {MouseEvent} event
+     */
+    const moveItem = (event) => {
+        if (movingIndex !== null) {
+            const movingWidget = Object.values(widgets)[movingIndex];
+            movingWidget.view.setBounds({
+                top: movingWidget.bounds.top,
+                height: movingWidget.bounds.height,
+                width: movingWidget.bounds.width,
+                left: event.clientX - (offsetX || 0),
+            });
+            // Some completely not react very hacky stuff to make browserviews move in conjunction with the titles
+            const elements = document.getElementsByClassName("dashbar-item-frame");
+            for (const element of elements) {
+                const rect = element.getBoundingClientRect();
+                const widget = widgets[element.id];
+                if (widget !== movingWidget && widget.bounds.left !== rect.left) {
+                    widget.bounds.left = rect.left;
+                    widget.view.setBounds(widget.bounds);
+                }
+            }
+        }
+    };
+    const setGrabLocation = (location) => {
+        titleGrabPosition = location;
+    };
+    /**
+     * Every time a widget is added or removed, modify the key on the FinsembleDnDContext element forcing a rerender.
+     *
+     * This is a workaround for certain cases where removing a dashbar item would align the panels incorrectly in
+     * FinsembleDnDContext. The scrolling works by the FinsembleDnDContext setting scrollLeft value. All calculations
+     * in FinsembleDnDContext are correct but due to a browser bug, when removing component under certain conditions,
+     * it somehow sets false maximum value for this scrollLeft value. Any value higher than the maximum is capped
+     * causing it to half scroll an element.
+     *
+     */
+    const elementKey = Object.entries(widgets)
+        .map((entry) => entry[0])
+        .sort()
+        .join("-");
+    return (React.createElement("div", { className: wrapperClasses, style: { height: dashbarHeight } },
+        WIDGET_COUNT > 0 && (React.createElement(FinsembleDnDContext, { key: elementKey, onDragEnd: reorderItems, onDragStart: startMove, onDragMove: moveItem, onLayoutUpdate: setWidgetsPositions, className: "finsemble-dashbar-section rearrange-region", id: "dashbar-container", axis: AllowableDnDAxis.x, lockAxis: AllowableDnDAxis.x, allowHorizontalScroll: true, showScrollButtonsTooltip: true, leftButtonTooltip: leftButtonTooltip, rightButtonTooltip: rightButtonTooltip, metadata: { dashbar } }, Object.values(widgets).map((widget, i) => (React.createElement(DashbarItem, { key: i, id: Object.keys(widgets)[i], index: i, widgetTitleGenerator: titleGenerator, widget: widget, dashbarHeight: dashbar.height, widgetDividerWidth: widgetDividerWidth, setTitleHeight: setTitleHeight, setGrabLocation: setGrabLocation }))))),
+        WIDGET_COUNT === 0 && (React.createElement("div", { className: "add-dashbar-item-button", onClick: launchDashbar },
+            React.createElement("span", null,
+                React.createElement("i", { className: "ff-plus" })))),
+        children));
+};
+//# sourceMappingURL=Dashbar.js.map