@finsemble/finsemble-ui 10.0.0-beta.3 → 10.0.0-iocd.2

package/react/hooks/useDashbar.js

@@ -0,0 +1,113 @@
+import { useDeepEffect } from "./useDeepEffect";
+import { useSelector, useDispatch } from "../components/FinsembleProvider";
+import { ToolbarActions } from "../actions/toolbarActions";
+import { FEAGlobals } from "../../common/Globals";
+let storageIsInitialized = false;
+let DashbarStore;
+const setDashbarItem = (itemName, availableDashbarItems, newDashbarItems) => {
+    if (availableDashbarItems.hasOwnProperty(itemName)) {
+        const newItem = availableDashbarItems[itemName];
+        newItem.id = itemName;
+        newDashbarItems.push(newItem);
+    }
+};
+const initializeDistributedStore = async () => {
+    const storeParams = {
+        store: "Finsemble-Dashbar-Store",
+        global: true,
+        persist: true,
+    };
+    const { err, data: store } = await FEAGlobals.FSBL.Clients.DistributedStoreClient.createStore(storeParams);
+    if (err || !store) {
+        const error = `Error initializing dashbar: unable to retrieve stored items, falling back to config: ${err}`;
+        FEAGlobals.FSBL.Clients.Logger.system.error(error);
+        return;
+    }
+    DashbarStore = store;
+};
+/**
+ * Fetches an initial list of dashbar items from the persistent distributed store,
+ * and if that doesn't exist, from spawnData
+ */
+const initializeDashbarItems = async () => {
+    var _a;
+    let dashbarItemList;
+    if (DashbarStore && Object.keys(DashbarStore.values).length > 0) {
+        dashbarItemList = DashbarStore.values.dashbaritems;
+    }
+    if (!dashbarItemList) {
+        const spawnData = FEAGlobals.FSBL.Clients.WindowClient.getSpawnData();
+        if (Array.isArray((_a = spawnData === null || spawnData === void 0 ? void 0 : spawnData.dashbar) === null || _a === void 0 ? void 0 : _a.items)) {
+            dashbarItemList = spawnData.dashbar.items;
+        }
+    }
+    if (!dashbarItemList)
+        dashbarItemList = [];
+    const newDashbarItems = [];
+    if (dashbarItemList.length > 0) {
+        const { data: availableDashbarItems } = await FEAGlobals.FSBL.Clients.ConfigClient.get([
+            "finsemble",
+            "availableDashbarItems",
+        ]);
+        dashbarItemList.forEach((itemName) => setDashbarItem(itemName, availableDashbarItems, newDashbarItems));
+    }
+    if (!DashbarStore.values.dashbaritems) {
+        await DashbarStore.set(["dashbaritems"], dashbarItemList);
+        return null;
+    }
+    else {
+        return newDashbarItems;
+    }
+};
+export const useDashbar = () => {
+    const dispatch = useDispatch();
+    const setDashbarItems = async (err, data) => {
+        if (!err && data) {
+            const { data: availableDashbarItems } = await FEAGlobals.FSBL.Clients.ConfigClient.get([
+                "finsemble",
+                "availableDashbarItems",
+            ]);
+            const newDashbarItems = [];
+            // Add the widget name as an id to help identify
+            // keys -> widgets when reordering items
+            data.value.forEach((item) => setDashbarItem(item, availableDashbarItems, newDashbarItems));
+            dispatch(ToolbarActions.SET_DASHBAR_ITEMS(newDashbarItems));
+        }
+    };
+    /**
+     * This effect initializes the dashbar items in the redux store. The store must only be initialized once. We use the module level variable
+     * `storageIsInitialized` as a simple flag to prevent initialization from occuring more than once.
+     */
+    useDeepEffect(() => {
+        const init = async () => {
+            if (!storageIsInitialized) {
+                storageIsInitialized = true;
+                await initializeDistributedStore();
+                const newDashbarItems = await initializeDashbarItems();
+                if (newDashbarItems)
+                    dispatch(ToolbarActions.SET_DASHBAR_ITEMS(newDashbarItems));
+                DashbarStore.addListener({ field: "dashbaritems" }, setDashbarItems);
+            }
+        };
+        init();
+        return function cleanup() {
+            DashbarStore.removeListener({ field: "dashbaritems" }, setDashbarItems);
+        };
+    }, [dispatch]);
+    const { dashbarItems } = useSelector((state) => state.toolbar);
+    const reorderDashbarItems = async ({ oldIndex, newIndex }) => {
+        const dashbarItemsNewOrder = [...dashbarItems];
+        const dashbarItemToMove = dashbarItemsNewOrder[oldIndex];
+        dashbarItemsNewOrder.splice(oldIndex, 1);
+        dashbarItemsNewOrder.splice(newIndex, 0, dashbarItemToMove);
+        const newOrderList = dashbarItemsNewOrder.map((dashbarItem) => dashbarItem.id);
+        DashbarStore.set(["dashbaritems"], newOrderList, () => {
+            dispatch(ToolbarActions.REORDER_DASHBAR_ITEMS({ oldIndex, newIndex }));
+        });
+    };
+    return {
+        dashbarItems,
+        reorderDashbarItems,
+    };
+};
+//# sourceMappingURL=useDashbar.js.map

package/react/hooks/useDashbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDashbar.js","sourceRoot":"","sources":["../../../../src/ui/hooks/useDashbar.ts"],"names":[],"mappings":"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"}

package/react/hooks/useDeepEffect.d.ts

@@ -1 +1,6 @@
+/**
+ * Use this just like useEffect() except that this will compare objects and arrays using lodash's isEqual() method.
+ * Always pass an array of dependencies as the second parameter!!!
+ */
 export declare function useDeepEffect(callback: any, dependencies: Array<any>): void;
+//# sourceMappingURL=useDeepEffect.d.ts.map

package/react/hooks/useDeepEffect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDeepEffect.d.ts","sourceRoot":"","sources":["../../../../src/ui/hooks/useDeepEffect.ts"],"names":[],"mappings":"AAaA;;;GAGG;AACH,wBAAgB,aAAa,CAAC,QAAQ,EAAE,GAAG,EAAE,YAAY,EAAE,KAAK,CAAC,GAAG,CAAC,QAEpE"}

package/react/hooks/useDeepEffect.js

@@ -7,7 +7,28 @@ function useDeepCompareMemoize(value) {
     }
     return ref.current;
 }
+/**
+ * Use this just like useEffect() except that this will compare objects and arrays using lodash's isEqual() method.
+ * Always pass an array of dependencies as the second parameter!!!
+ */
 export function useDeepEffect(callback, dependencies) {
     useEffect(callback, useDeepCompareMemoize(dependencies));
 }
+/*
+// Previous implementation that had bugs. Keep around for a bit until we shake out the new version.
+export function useDeepEffect(effectFunc : Function, deps : Array<any>) {
+    const isFirst = useRef(true);
+    const prevDeps = useRef(deps);
+
+    useEffect(() => {
+        const isSame = prevDeps.current.every((obj: any, index: any) => isEqual(obj, deps[index]));
+        if (isFirst.current || !isSame) {
+            effectFunc();
+        }
+
+        isFirst.current = false;
+        prevDeps.current = deps;
+    }, deps);
+}
+*/
 //# sourceMappingURL=useDeepEffect.js.map

package/react/hooks/useDeepEffect.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDeepEffect.js","sourceRoot":"","sources":["../../src/hooks/useDeepEffect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,OAAO,MAAM,gBAAgB,CAAC;AAErC,SAAS,qBAAqB,CAAC,KAAU;IACxC,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IAErB,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,EAAE;QACjC,GAAG,CAAC,OAAO,GAAG,KAAK,CAAC;KACpB;IAED,OAAO,GAAG,CAAC,OAAO,CAAC;AACpB,CAAC;AAMD,MAAM,UAAU,aAAa,CAAC,QAAa,EAAE,YAAwB;IACpE,SAAS,CAAC,QAAQ,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAC,CAAC;AAC1D,CAAC","sourcesContent":["import { useEffect, useRef } from \"react\";\r\nimport isEqual from \"lodash/isEqual\";\r\n\r\nfunction useDeepCompareMemoize(value: any) {\r\n\tconst ref = useRef();\r\n\r\n\tif (!isEqual(value, ref.current)) {\r\n\t\tref.current = value;\r\n\t}\r\n\r\n\treturn ref.current;\r\n}\r\n\r\n/**\r\n * Use this just like useEffect() except that this will compare objects and arrays using lodash's isEqual() method.\r\n * Always pass an array of dependencies as the second parameter!!!\r\n */\r\nexport function useDeepEffect(callback: any, dependencies: Array<any>) {\r\n\tuseEffect(callback, useDeepCompareMemoize(dependencies));\r\n}\r\n\r\n/*\r\n// Previous implementation that had bugs. Keep around for a bit until we shake out the new version.\r\nexport function useDeepEffect(effectFunc : Function, deps : Array<any>) {\r\n\tconst isFirst = useRef(true);\r\n\tconst prevDeps = useRef(deps);\r\n\r\n\tuseEffect(() => {\r\n\t\tconst isSame = prevDeps.current.every((obj: any, index: any) => isEqual(obj, deps[index]));\r\n\t\tif (isFirst.current || !isSame) {\r\n\t\t\teffectFunc();\r\n\t\t}\r\n\r\n\t\tisFirst.current = false;\r\n\t\tprevDeps.current = deps;\r\n\t}, deps);\r\n}\r\n*/\r\n"]}
+{"version":3,"file":"useDeepEffect.js","sourceRoot":"","sources":["../../../../src/ui/hooks/useDeepEffect.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAC1C,OAAO,OAAO,MAAM,gBAAgB,CAAC;AAErC,SAAS,qBAAqB,CAAC,KAAU;IACxC,MAAM,GAAG,GAAG,MAAM,EAAE,CAAC;IAErB,IAAI,CAAC,OAAO,CAAC,KAAK,EAAE,GAAG,CAAC,OAAO,CAAC,EAAE;QACjC,GAAG,CAAC,OAAO,GAAG,KAAK,CAAC;KACpB;IAED,OAAO,GAAG,CAAC,OAAO,CAAC;AACpB,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,aAAa,CAAC,QAAa,EAAE,YAAwB;IACpE,SAAS,CAAC,QAAQ,EAAE,qBAAqB,CAAC,YAAY,CAAC,CAAC,CAAC;AAC1D,CAAC;AAED;;;;;;;;;;;;;;;;EAgBE"}

package/react/hooks/useDownloadItems.d.ts

@@ -0,0 +1,24 @@
+declare type DownloadItem = {
+    id: string;
+    displayInfo: {
+        filename: string;
+        url: string;
+        state: string;
+        receivedBytes?: number;
+        totalBytes: number;
+    };
+};
+declare type DownloadState = {
+    downloadItems: DownloadItem[];
+};
+/**
+ * A hook to handle state from the download Manager UI. The state is initialized and updated
+ * based on information from fea.
+ */
+export default function useDownloadItems(): {
+    downloadItems: any;
+    removeDownloadItem: (downloadItem: DownloadItem) => void;
+    initDownloadItems: (downloadItems: DownloadState) => void;
+};
+export {};
+//# sourceMappingURL=useDownloadItems.d.ts.map

package/react/hooks/useDownloadItems.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDownloadItems.d.ts","sourceRoot":"","sources":["../../../../src/ui/hooks/useDownloadItems.ts"],"names":[],"mappings":"AAGA,aAAK,YAAY,GAAG;IACnB,EAAE,EAAE,MAAM,CAAC;IACX,WAAW,EAAE;QACZ,QAAQ,EAAE,MAAM,CAAC;QACjB,GAAG,EAAE,MAAM,CAAC;QACZ,KAAK,EAAE,MAAM,CAAC;QACd,aAAa,CAAC,EAAE,MAAM,CAAC;QACvB,UAAU,EAAE,MAAM,CAAC;KACnB,CAAC;CACF,CAAC;AAEF,aAAK,aAAa,GAAG;IACpB,aAAa,EAAE,YAAY,EAAE,CAAC;CAC9B,CAAC;AA2CF;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,gBAAgB;;uCAKG,YAAY;uCAMZ,aAAa;EAiBvD"}

package/react/hooks/useDownloadItems.js

@@ -0,0 +1,68 @@
+import { useEffect, useReducer } from "react";
+import { FEAGlobals } from "../../common/Globals";
+const initialState = { downloadItems: [] };
+/*
+Action Types
+*/
+const UPDATE = "UPDATE";
+const REMOVED = "REMOVED";
+const INIT = "INIT";
+function reducer(state, action) {
+    var _a;
+    switch (action.type) {
+        case INIT:
+            // Initialize the state with the downloadItems saved in FEA. Values are only expected when the UI is reopened.
+            return {
+                downloadItems: [...state.downloadItems, ...(_a = action.payload) === null || _a === void 0 ? void 0 : _a.reverse()],
+            };
+        case UPDATE: {
+            // Adds or updates the downloadItem if it already exists
+            const downloadItemExistsInArray = state.downloadItems.find((downloadItem) => downloadItem.id === action.payload.id);
+            const downloadItems = downloadItemExistsInArray
+                ? state.downloadItems.map((downloadItem) => downloadItem.id === action.payload.id ? action.payload : downloadItem)
+                : [action.payload, ...state.downloadItems];
+            return { downloadItems };
+        }
+        case REMOVED: {
+            // Removes the downloadItem from the list of downloads
+            const downloadItems = state.downloadItems.filter((downloadItem) => downloadItem.id !== action.payload.id);
+            return {
+                downloadItems,
+            };
+        }
+        default:
+            throw new Error();
+    }
+}
+/**
+ * A hook to handle state from the download Manager UI. The state is initialized and updated
+ * based on information from fea.
+ */
+export default function useDownloadItems() {
+    const [state, dispatch] = useReducer(reducer, initialState);
+    /*
+        Action Creators
+    */
+    const removeDownloadItem = (downloadItem) => {
+        dispatch({ type: REMOVED, payload: downloadItem });
+    };
+    const updateDownloadItem = (downloadItem) => {
+        dispatch({ type: UPDATE, payload: downloadItem });
+    };
+    const initDownloadItems = (downloadItems) => {
+        dispatch({ type: INIT, payload: downloadItems });
+    };
+    // Listens for message from fea that a download was initiated/updated
+    useEffect(() => {
+        FEAGlobals.fin.desktop.System.addEventListener("download-update", updateDownloadItem);
+        return () => {
+            FEAGlobals.fin.desktop.System.removeEventListener("download-update", updateDownloadItem);
+        };
+    }, []);
+    return {
+        downloadItems: state.downloadItems,
+        removeDownloadItem,
+        initDownloadItems,
+    };
+}
+//# sourceMappingURL=useDownloadItems.js.map

package/react/hooks/useDownloadItems.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDownloadItems.js","sourceRoot":"","sources":["../../../../src/ui/hooks/useDownloadItems.ts"],"names":[],"mappings":"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"}

package/react/hooks/useDragRegion.d.ts

@@ -0,0 +1,27 @@
+/**
+ * A hook for building WindowTitleBars.
+ */
+/// <reference types="react" />
+/**
+ * Creates a drag region that interacts with Finsemble's useDOMBasedMovement for moving windows.
+ * Functions are returned which must be set on the drag region's React onMouseDown and onMouseUp event handlers.
+ *
+ * Note that this component doesn't need to worry about stopping the window movement because that is handled by FEA
+ * via its own mouseup and blur event handlers (see electron-adapter/src/render/Window.ts).
+ *
+ * A mouseDown followed by a mouseMove is required to start window movement. By waiting for mouseMove we avoid accidentally
+ * slipping into window movement mode due to a click or double click on the titlebar.
+ *
+ * Once in window movement mode, a requestAnimationFrame begins running in e2o.ts that tracks mouse movement and causes
+ * the window to follow that movement (by reporting the mouse position up to the window service, which then decides based
+ * on it's snapping algorithm whether to allow the window to move, or do other things like cause grouped windows to also move).
+ *
+ * We don't allow dragging a window when it is maximized. While operating systems do allow dragging a maximized window (on
+ * Mac the window moves at its full maximized state, on Windows it unmaximizes to normal state and then moves) we can't allow
+ * this because a maximized window may be part of a group, and if we were to move the window then the group would become indeterminate.
+ */
+export declare const useDragRegion: (maximized: boolean) => {
+    onMouseDown: import("react").MouseEventHandler<HTMLDivElement>;
+    onMouseMove: import("react").MouseEventHandler<HTMLDivElement>;
+};
+//# sourceMappingURL=useDragRegion.d.ts.map

package/react/hooks/useDragRegion.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDragRegion.d.ts","sourceRoot":"","sources":["../../../../src/ui/hooks/useDragRegion.ts"],"names":[],"mappings":"AAAA;;GAEG;;AAKH;;;;;;;;;;;;;;;;;GAiBG;AACH,eAAO,MAAM,aAAa,cAAe,OAAO;;;CAoD/C,CAAC"}

package/react/hooks/useDragRegion.js

@@ -0,0 +1,74 @@
+/**
+ * A hook for building WindowTitleBars.
+ */
+import { useState } from "react";
+import { FEAGlobals } from "../../common";
+/**
+ * Creates a drag region that interacts with Finsemble's useDOMBasedMovement for moving windows.
+ * Functions are returned which must be set on the drag region's React onMouseDown and onMouseUp event handlers.
+ *
+ * Note that this component doesn't need to worry about stopping the window movement because that is handled by FEA
+ * via its own mouseup and blur event handlers (see electron-adapter/src/render/Window.ts).
+ *
+ * A mouseDown followed by a mouseMove is required to start window movement. By waiting for mouseMove we avoid accidentally
+ * slipping into window movement mode due to a click or double click on the titlebar.
+ *
+ * Once in window movement mode, a requestAnimationFrame begins running in e2o.ts that tracks mouse movement and causes
+ * the window to follow that movement (by reporting the mouse position up to the window service, which then decides based
+ * on it's snapping algorithm whether to allow the window to move, or do other things like cause grouped windows to also move).
+ *
+ * We don't allow dragging a window when it is maximized. While operating systems do allow dragging a maximized window (on
+ * Mac the window moves at its full maximized state, on Windows it unmaximizes to normal state and then moves) we can't allow
+ * this because a maximized window may be part of a group, and if we were to move the window then the group would become indeterminate.
+ */
+export const useDragRegion = (maximized) => {
+    const [isMousePressed, setIsMousePressed] = useState(false);
+    const [hasStartedMoving, setHasStartedMoving] = useState(false);
+    // Create a reference to the isMousePressed value so that it can be accessed from within setTimeout
+    // https://medium.com/programming-essentials/how-to-access-the-state-in-settimeout-inside-a-react-function-component-39a9f031c76f
+    const onMouseMove = (event) => {
+        if (isMousePressed && !hasStartedMoving) {
+            setHasStartedMoving(true);
+            FEAGlobals.FSBL.Clients.WindowClient.startMovingWindow(event.nativeEvent);
+        }
+    };
+    const stopMovingWindow = () => {
+        FEAGlobals.FSBL.Clients.WindowClient.stopMovingWindow();
+        setIsMousePressed(false);
+        setHasStartedMoving(false);
+        document.removeEventListener("mouseup", stopMovingWindow);
+        document.removeEventListener("dragend", stopMovingWindow);
+        window.removeEventListener("blur", stopMovingWindow);
+    };
+    const onMouseDown = () => {
+        if (maximized)
+            return;
+        // Preemptively stop any previous moves, just in case a mouseup event was missed for instance
+        FEAGlobals.FSBL.Clients.WindowClient.stopMovingWindow();
+        setIsMousePressed(true);
+        /**
+         * Set listeners document wide to make sure that we catch all conditions where the mouse is lifted.
+         * See also electron-adapter src/renderer/Window.ts where mouse position polling is used to keep track
+         * of the mouse position.
+         */
+        document.addEventListener("mouseup", stopMovingWindow);
+        /**
+         * The 'dragend' event will fire if the text of the titlebar is selected, and then dragged. This
+         * can occur if someone selects the text of the page and pulls up above the window. Then, when the
+         * user clicks the titlebar, chrome will drag the element, and never fire mouseup.
+         */
+        document.addEventListener("dragend", stopMovingWindow);
+        /**
+         * The window can blur while the user is moving the window. If the user is moving the window
+         * and a native application or notification steals focus, the window would get "stuck" to the
+         * mouse, because mouseup wouldn't fire.
+         * An easy way to simulate this bad behavior is to remove this listener and start moving the window.
+         * Then hit alt+tab.
+         * Alternatively, you can press the windows key while moving a window (this will bring up the
+         * cortana search menu and focus it).
+         */
+        window.addEventListener("blur", stopMovingWindow);
+    };
+    return { onMouseDown, onMouseMove };
+};
+//# sourceMappingURL=useDragRegion.js.map

package/react/hooks/useDragRegion.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useDragRegion.js","sourceRoot":"","sources":["../../../../src/ui/hooks/useDragRegion.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AACjC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAE1C;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,CAAC,MAAM,aAAa,GAAG,CAAC,SAAkB,EAAE,EAAE;IACnD,MAAM,CAAC,cAAc,EAAE,iBAAiB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACrE,MAAM,CAAC,gBAAgB,EAAE,mBAAmB,CAAC,GAAG,QAAQ,CAAU,KAAK,CAAC,CAAC;IACzE,mGAAmG;IACnG,iIAAiI;IAEjI,MAAM,WAAW,GAA4C,CAAC,KAAK,EAAE,EAAE;QACtE,IAAI,cAAc,IAAI,CAAC,gBAAgB,EAAE;YACxC,mBAAmB,CAAC,IAAI,CAAC,CAAC;YAC1B,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,iBAAiB,CAAC,KAAK,CAAC,WAAW,CAAC,CAAC;SAC1E;IACF,CAAC,CAAC;IAEF,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC7B,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,gBAAgB,EAAE,CAAC;QACxD,iBAAiB,CAAC,KAAK,CAAC,CAAC;QACzB,mBAAmB,CAAC,KAAK,CAAC,CAAC;QAC3B,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAC;QAC1D,QAAQ,CAAC,mBAAmB,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAC;QAC1D,MAAM,CAAC,mBAAmB,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IACtD,CAAC,CAAC;IAEF,MAAM,WAAW,GAA4C,GAAG,EAAE;QACjE,IAAI,SAAS;YAAE,OAAO;QACtB,6FAA6F;QAC7F,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,YAAY,CAAC,gBAAgB,EAAE,CAAC;QACxD,iBAAiB,CAAC,IAAI,CAAC,CAAC;QACxB;;;;WAIG;QACH,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAC;QACvD;;;;WAIG;QACH,QAAQ,CAAC,gBAAgB,CAAC,SAAS,EAAE,gBAAgB,CAAC,CAAC;QACvD;;;;;;;;WAQG;QACH,MAAM,CAAC,gBAAgB,CAAC,MAAM,EAAE,gBAAgB,CAAC,CAAC;IACnD,CAAC,CAAC;IAEF,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,CAAC;AACrC,CAAC,CAAC"}

package/react/hooks/useFavorites.d.ts

@@ -1,9 +1,25 @@
 import { Favorite } from "../types/favoriteTypes";
 declare type FavoritesHook = {
+    /**
+     * The current favorites list from the store.
+     */
     favorites: Favorite[];
+    /**
+     * Adds a favorite to the favorites store.
+     */
     addFavorite: (favorite: Favorite) => void;
+    /**
+     * Removes the favorite for the given id from the favorites store.
+     */
     removeFavorite: (id: Favorite["id"]) => void;
+    /**
+     * Returns true if the current id has been favorited.
+     */
     isFavorited: (id: Favorite["id"]) => boolean;
 };
+/**
+ * The useFavorites() hook is used by FavoriteMaker to interact with the redux store.
+ */
 export declare const useFavorites: () => FavoritesHook;
 export {};
+//# sourceMappingURL=useFavorites.d.ts.map

package/react/hooks/useFavorites.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFavorites.d.ts","sourceRoot":"","sources":["../../../../src/ui/hooks/useFavorites.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAGlD,aAAK,aAAa,GAAG;IACpB;;OAEG;IACH,SAAS,EAAE,QAAQ,EAAE,CAAC;IAEtB;;OAEG;IACH,WAAW,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC;IAE1C;;OAEG;IACH,cAAc,EAAE,CAAC,EAAE,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC;IAE7C;;OAEG;IACH,WAAW,EAAE,CAAC,EAAE,EAAE,QAAQ,CAAC,IAAI,CAAC,KAAK,OAAO,CAAC;CAC7C,CAAC;AAEF;;GAEG;AACH,eAAO,MAAM,YAAY,QAAO,aAqB/B,CAAC"}

package/react/hooks/useFavorites.js

@@ -1,5 +1,8 @@
-import { useDispatch, useSelector } from "../store";
+import { useDispatch, useSelector } from "../components/FinsembleProvider";
 import { FavoriteActions } from "../actions/favoriteActions";
+/**
+ * The useFavorites() hook is used by FavoriteMaker to interact with the redux store.
+ */
 export const useFavorites = () => {
     const dispatch = useDispatch();
     const { favorites } = useSelector((state) => state.favorite);

package/react/hooks/useFavorites.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFavorites.js","sourceRoot":"","sources":["../../src/hooks/useFavorites.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAEpD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AA2B7D,MAAM,CAAC,MAAM,YAAY,GAAG,GAAkB,EAAE;IAC/C,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,EAAE,SAAS,EAAE,GAAG,WAAW,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAC7D,MAAM,YAAY,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;IAEpD,MAAM,WAAW,GAAG,CAAC,QAAkB,EAAE,EAAE;QAC1C,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC;IAClD,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,EAAkB,EAAE,EAAE;QAC7C,QAAQ,CAAC,eAAe,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC,CAAC;IAC/C,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,EAAkB,EAAE,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEtE,OAAO;QACN,SAAS;QACT,WAAW;QACX,cAAc;QACd,WAAW;KACX,CAAC;AACH,CAAC,CAAC","sourcesContent":["import { useDispatch, useSelector } from \"../store\";\r\nimport { Favorite } from \"../types/favoriteTypes\";\r\nimport { FavoriteActions } from \"../actions/favoriteActions\";\r\n\r\ntype FavoritesHook = {\r\n\t/**\r\n\t * The current favorites list from the store.\r\n\t */\r\n\tfavorites: Favorite[];\r\n\r\n\t/**\r\n\t * Adds a favorite to the favorites store.\r\n\t */\r\n\taddFavorite: (favorite: Favorite) => void;\r\n\r\n\t/**\r\n\t * Removes the favorite for the given id from the favorites store.\r\n\t */\r\n\tremoveFavorite: (id: Favorite[\"id\"]) => void;\r\n\r\n\t/**\r\n\t * Returns true if the current id has been favorited.\r\n\t */\r\n\tisFavorited: (id: Favorite[\"id\"]) => boolean;\r\n};\r\n\r\n/**\r\n * The useFavorites() hook is used by FavoriteMaker to interact with the redux store.\r\n */\r\nexport const useFavorites = (): FavoritesHook => {\r\n\tconst dispatch = useDispatch();\r\n\tconst { favorites } = useSelector((state) => state.favorite);\r\n\tconst favoritesIds = favorites.map((fav) => fav.id);\r\n\r\n\tconst addFavorite = (favorite: Favorite) => {\r\n\t\tdispatch(FavoriteActions.ADD_FAVORITE(favorite));\r\n\t};\r\n\r\n\tconst removeFavorite = (id: Favorite[\"id\"]) => {\r\n\t\tdispatch(FavoriteActions.REMOVE_FAVORITE(id));\r\n\t};\r\n\r\n\tconst isFavorited = (id: Favorite[\"id\"]) => favoritesIds.includes(id);\r\n\r\n\treturn {\r\n\t\tfavorites,\r\n\t\taddFavorite,\r\n\t\tremoveFavorite,\r\n\t\tisFavorited,\r\n\t};\r\n};\r\n"]}
+{"version":3,"file":"useFavorites.js","sourceRoot":"","sources":["../../../../src/ui/hooks/useFavorites.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE3E,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAwB7D;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,GAAkB,EAAE;IAC/C,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,EAAE,SAAS,EAAE,GAAG,WAAW,CAAC,CAAC,KAAU,EAAE,EAAE,CAAC,KAAK,CAAC,QAAQ,CAAC,CAAC;IAClE,MAAM,YAAY,GAAG,SAAS,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,CAAC;IAEpD,MAAM,WAAW,GAAG,CAAC,QAAkB,EAAE,EAAE;QAC1C,QAAQ,CAAC,eAAe,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC,CAAC;IAClD,CAAC,CAAC;IAEF,MAAM,cAAc,GAAG,CAAC,EAAkB,EAAE,EAAE;QAC7C,QAAQ,CAAC,eAAe,CAAC,eAAe,CAAC,EAAE,CAAC,CAAC,CAAC;IAC/C,CAAC,CAAC;IAEF,MAAM,WAAW,GAAG,CAAC,EAAkB,EAAE,EAAE,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE,CAAC,CAAC;IAEtE,OAAO;QACN,SAAS;QACT,WAAW;QACX,cAAc;QACd,WAAW;KACX,CAAC;AACH,CAAC,CAAC"}

package/react/hooks/useFavoritesShell.d.ts

@@ -1,4 +1,8 @@
 import { Favorite } from "../types/favoriteTypes";
+/**
+ * The useFavoritesShell() hook is used by FavoritesShell to interact with the redux store
+ * and storage.
+ */
 export declare const useFavoritesShell: () => {
     favorites: Favorite[];
     removeFavorite: (id: string) => void;
@@ -8,3 +12,4 @@ export declare const useFavoritesShell: () => {
         newIndex: number;
     }) => void;
 };
+//# sourceMappingURL=useFavoritesShell.d.ts.map

package/react/hooks/useFavoritesShell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFavoritesShell.d.ts","sourceRoot":"","sources":["../../../../src/ui/hooks/useFavoritesShell.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AASlD;;;GAGG;AACH,eAAO,MAAM,iBAAiB;;;0BAWM,QAAQ,CAAC,IAAI,CAAC,YAAY,QAAQ,CAAC,UAAU,CAAC;;kBA0BlB,MAAM;kBAAY,MAAM;;CAyCvF,CAAC"}

package/react/hooks/useFavoritesShell.js

@@ -1,22 +1,32 @@
-import { useDispatch } from "../store";
-import { useWorkspaces } from "../hooks/useWorkspace";
+import { useDispatch } from "../components/FinsembleProvider";
 import { FavoriteActions } from "../actions/favoriteActions";
 import { useFavorites } from "./useFavorites";
 import { useEffect } from "react";
+import { FEAGlobals } from "../../common/Globals";
 let storageIsInitialized = false;
+/**
+ * The useFavoritesShell() hook is used by FavoritesShell to interact with the redux store
+ * and storage.
+ */
 export const useFavoritesShell = () => {
     const dispatch = useDispatch();
-    const { activeWorkspace, promptOnSave } = useWorkspaces();
     const { favorites, removeFavorite } = useFavorites();
+    // Ideally in the future the following function will be decoupled from implementation, allowing Favorites to generically dispatch actions.
+    /**
+     * Given a favorite item, trigger the associated action on that item.
+     * I.e. If it's a finsemble component, a new window of that component is launched. If it's a workspace, the workspace would be switched to.
+     * @param id The favorite item's id
+     * @param category The to be triggered favorite item's category
+     */
     const triggerFavorite = async (id, category) => {
         if (category === "Application") {
-            FSBL.Clients.LauncherClient.spawn(id, {
+            FEAGlobals.FSBL.Clients.LauncherClient.spawn(id, {
                 addToWorkspace: true,
                 monitor: "mine",
             });
         }
         else if (category === "Workspace") {
-            FSBL.Clients.DistributedStoreClient.getStore({ store: "Finsemble-WorkspaceMenu-Global-Store", global: true }, (err, store) => {
+            FEAGlobals.FSBL.Clients.DistributedStoreClient.getStore({ store: "Finsemble-WorkspaceMenu-Global-Store", global: true }, (err, store) => {
                 store.Dispatcher.dispatch({
                     actionType: "switchToWorkspace",
                     data: {
@@ -26,25 +36,34 @@ export const useFavoritesShell = () => {
             });
         }
     };
+    /**
+     * We need to persist the right order in whent he user reorders favorites in the toolbar. This ensures
+     * that favorites will appear in the right order on future Toolbar launches.
+     * @param favElements The ordered collection of favorite elements
+     */
     const setFavoritesOrder = ({ oldIndex, newIndex }) => {
         dispatch(FavoriteActions.REORDER_FAVORITES({ oldIndex, newIndex }));
     };
+    /**
+     * This effect initializes the favorites redux store. The store must only be initialized once, even though useFavorites may be
+     * referenced by many different React components. We use the module level variable `storageIsInitialized` as a simple flag to
+     * prevent initialization from occuring more than once.
+     */
     useEffect(() => {
-        console.log("get maybe?");
         if (storageIsInitialized)
             return;
         storageIsInitialized = true;
-        console.log("getting");
-        FSBL.Clients.StorageClient.get({ topic: "favorites", key: "allCurrentFavorites" }, (err, data) => {
+        // Copy the persisted favorites from Storage to the redux store
+        FEAGlobals.FSBL.Clients.StorageClient.getStandardized({ topic: "favorites", key: "allCurrentFavorites" }, (err, data) => {
             if (err) {
-                return FSBL.Clients.Logger.error(`Favorite Hook -> Failed to retrieve favorites from StorageClient: ${err}`);
+                return FEAGlobals.FSBL.Clients.Logger.system.error(`Favorite Hook -> Failed to retrieve favorites from StorageClient: ${err}`);
             }
             dispatch(FavoriteActions.INITIALIZE_FAVORITES(data));
         });
     }, [dispatch]);
+    // When the list of favorite items change, we want to persist that data to the store.
     useEffect(() => {
-        console.log("saving");
-        FSBL.Clients.StorageClient.save({
+        FEAGlobals.FSBL.Clients.StorageClient.save({
             topic: "favorites",
             key: "allCurrentFavorites",
             value: favorites,

package/react/hooks/useFavoritesShell.js.map

@@ -1 +1 @@
-{"version":3,"file":"useFavoritesShell.js","sourceRoot":"","sources":["../../src/hooks/useFavoritesShell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AACvC,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AAEtD,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,IAAI,oBAAoB,GAAY,KAAK,CAAC;AAa1C,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACrC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,EAAE,eAAe,EAAE,YAAY,EAAE,GAAG,aAAa,EAAE,CAAC;IAC1D,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,GAAG,YAAY,EAAE,CAAC;IASrD,MAAM,eAAe,GAAG,KAAK,EAAE,EAAkB,EAAE,QAA8B,EAAE,EAAE;QACpF,IAAI,QAAQ,KAAK,aAAa,EAAE;YAC/B,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,EAAE;gBACrC,cAAc,EAAE,IAAI;gBACpB,OAAO,EAAE,MAAM;aACf,CAAC,CAAC;SACH;aAAM,IAAI,QAAQ,KAAK,WAAW,EAAE;YACpC,IAAI,CAAC,OAAO,CAAC,sBAAsB,CAAC,QAAQ,CAC3C,EAAE,KAAK,EAAE,sCAAsC,EAAE,MAAM,EAAE,IAAI,EAAE,EAC/D,CAAC,GAAW,EAAE,KAAU,EAAE,EAAE;gBAC3B,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC;oBACzB,UAAU,EAAE,mBAAmB;oBAC/B,IAAI,EAAE;wBACL,IAAI,EAAE,EAAE;qBACR;iBACD,CAAC,CAAC;YACJ,CAAC,CACD,CAAC;SACF;IACF,CAAC,CAAC;IAOF,MAAM,iBAAiB,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAA0C,EAAE,EAAE;QAC5F,QAAQ,CAAC,eAAe,CAAC,iBAAiB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC;IACrE,CAAC,CAAC;IAOF,SAAS,CAAC,GAAG,EAAE;QACd,OAAO,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC;QAC1B,IAAI,oBAAoB;YAAE,OAAO;QACjC,oBAAoB,GAAG,IAAI,CAAC;QAC5B,OAAO,CAAC,GAAG,CAAC,SAAS,CAAC,CAAC;QAEvB,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,qBAAqB,EAAE,EAAE,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE;YAChG,IAAI,GAAG,EAAE;gBACR,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,KAAK,CAAC,qEAAqE,GAAG,EAAE,CAAC,CAAC;aAC7G;YACD,QAAQ,CAAC,eAAe,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC;QACtD,CAAC,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAGf,SAAS,CAAC,GAAG,EAAE;QACd,OAAO,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;QACtB,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC;YAC/B,KAAK,EAAE,WAAW;YAClB,GAAG,EAAE,qBAAqB;YAC1B,KAAK,EAAE,SAAS;SAChB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO;QACN,SAAS;QACT,cAAc;QACd,eAAe;QACf,iBAAiB;KACjB,CAAC;AACH,CAAC,CAAC","sourcesContent":["import { useDispatch } from \"../store\";\r\nimport { useWorkspaces } from \"../hooks/useWorkspace\";\r\nimport { Favorite } from \"../types/favoriteTypes\";\r\nimport { FavoriteActions } from \"../actions/favoriteActions\";\r\nimport { useFavorites } from \"./useFavorites\";\r\nimport { useEffect } from \"react\";\r\n\r\nlet storageIsInitialized: boolean = false;\r\n\r\ntype YesNoDialogParams = {\r\n\ttitle: string;\r\n\tquestion: string;\r\n\taffirmativeResponseLabel: string;\r\n\tnegativeResponseLabel: string;\r\n};\r\n\r\n/**\r\n * The useFavoritesShell() hook is used by FavoritesShell to interact with the redux store\r\n * and storage.\r\n */\r\nexport const useFavoritesShell = () => {\r\n\tconst dispatch = useDispatch();\r\n\tconst { activeWorkspace, promptOnSave } = useWorkspaces();\r\n\tconst { favorites, removeFavorite } = useFavorites();\r\n\r\n\t// Ideally in the future the following function will be decoupled from implementation, allowing Favorites to generically dispatch actions.\r\n\t/**\r\n\t * Given a favorite item, trigger the associated action on that item.\r\n\t * I.e. If it's a finsemble component, a new window of that component is launched. If it's a workspace, the workspace would be switched to.\r\n\t * @param id The favorite item's id\r\n\t * @param category The to be triggered favorite item's category\r\n\t */\r\n\tconst triggerFavorite = async (id: Favorite[\"id\"], category: Favorite[\"category\"]) => {\r\n\t\tif (category === \"Application\") {\r\n\t\t\tFSBL.Clients.LauncherClient.spawn(id, {\r\n\t\t\t\taddToWorkspace: true,\r\n\t\t\t\tmonitor: \"mine\",\r\n\t\t\t});\r\n\t\t} else if (category === \"Workspace\") {\r\n\t\t\tFSBL.Clients.DistributedStoreClient.getStore(\r\n\t\t\t\t{ store: \"Finsemble-WorkspaceMenu-Global-Store\", global: true },\r\n\t\t\t\t(err: string, store: any) => {\r\n\t\t\t\t\tstore.Dispatcher.dispatch({\r\n\t\t\t\t\t\tactionType: \"switchToWorkspace\",\r\n\t\t\t\t\t\tdata: {\r\n\t\t\t\t\t\t\tname: id,\r\n\t\t\t\t\t\t},\r\n\t\t\t\t\t});\r\n\t\t\t\t}\r\n\t\t\t);\r\n\t\t}\r\n\t};\r\n\r\n\t/**\r\n\t * We need to persist the right order in whent he user reorders favorites in the toolbar. This ensures\r\n\t * that favorites will appear in the right order on future Toolbar launches.\r\n\t * @param favElements The ordered collection of favorite elements\r\n\t */\r\n\tconst setFavoritesOrder = ({ oldIndex, newIndex }: { oldIndex: number; newIndex: number }) => {\r\n\t\tdispatch(FavoriteActions.REORDER_FAVORITES({ oldIndex, newIndex }));\r\n\t};\r\n\r\n\t/**\r\n\t * This effect initializes the favorites redux store. The store must only be initialized once, even though useFavorites may be\r\n\t * referenced by many different React components. We use the module level variable `storageIsInitialized` as a simple flag to\r\n\t * prevent initialization from occuring more than once.\r\n\t */\r\n\tuseEffect(() => {\r\n\t\tconsole.log(\"get maybe?\");\r\n\t\tif (storageIsInitialized) return;\r\n\t\tstorageIsInitialized = true;\r\n\t\tconsole.log(\"getting\");\r\n\t\t// Copy the persisted favorites from Storage to the redux store\r\n\t\tFSBL.Clients.StorageClient.get({ topic: \"favorites\", key: \"allCurrentFavorites\" }, (err, data) => {\r\n\t\t\tif (err) {\r\n\t\t\t\treturn FSBL.Clients.Logger.error(`Favorite Hook -> Failed to retrieve favorites from StorageClient: ${err}`);\r\n\t\t\t}\r\n\t\t\tdispatch(FavoriteActions.INITIALIZE_FAVORITES(data));\r\n\t\t});\r\n\t}, [dispatch]);\r\n\r\n\t// When the list of favorite items change, we want to persist that data to the store.\r\n\tuseEffect(() => {\r\n\t\tconsole.log(\"saving\");\r\n\t\tFSBL.Clients.StorageClient.save({\r\n\t\t\ttopic: \"favorites\",\r\n\t\t\tkey: \"allCurrentFavorites\",\r\n\t\t\tvalue: favorites,\r\n\t\t});\r\n\t}, [favorites]);\r\n\r\n\treturn {\r\n\t\tfavorites,\r\n\t\tremoveFavorite,\r\n\t\ttriggerFavorite,\r\n\t\tsetFavoritesOrder,\r\n\t};\r\n};\r\n"]}
+{"version":3,"file":"useFavoritesShell.js","sourceRoot":"","sources":["../../../../src/ui/hooks/useFavoritesShell.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,iCAAiC,CAAC;AAE9D,OAAO,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAC7D,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC9C,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,EAAE,UAAU,EAAE,MAAM,sBAAsB,CAAC;AAElD,IAAI,oBAAoB,GAAY,KAAK,CAAC;AAE1C;;;GAGG;AACH,MAAM,CAAC,MAAM,iBAAiB,GAAG,GAAG,EAAE;IACrC,MAAM,QAAQ,GAAG,WAAW,EAAE,CAAC;IAC/B,MAAM,EAAE,SAAS,EAAE,cAAc,EAAE,GAAG,YAAY,EAAE,CAAC;IAErD,0IAA0I;IAC1I;;;;;OAKG;IACH,MAAM,eAAe,GAAG,KAAK,EAAE,EAAkB,EAAE,QAA8B,EAAE,EAAE;QACpF,IAAI,QAAQ,KAAK,aAAa,EAAE;YAC/B,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE,EAAE;gBAChD,cAAc,EAAE,IAAI;gBACpB,OAAO,EAAE,MAAM;aACf,CAAC,CAAC;SACH;aAAM,IAAI,QAAQ,KAAK,WAAW,EAAE;YACpC,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,sBAAsB,CAAC,QAAQ,CACtD,EAAE,KAAK,EAAE,sCAAsC,EAAE,MAAM,EAAE,IAAI,EAAE,EAC/D,CAAC,GAAkB,EAAE,KAAW,EAAE,EAAE;gBACnC,KAAK,CAAC,UAAU,CAAC,QAAQ,CAAC;oBACzB,UAAU,EAAE,mBAAmB;oBAC/B,IAAI,EAAE;wBACL,IAAI,EAAE,EAAE;qBACR;iBACD,CAAC,CAAC;YACJ,CAAC,CACD,CAAC;SACF;IACF,CAAC,CAAC;IAEF;;;;OAIG;IACH,MAAM,iBAAiB,GAAG,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAA0C,EAAE,EAAE;QAC5F,QAAQ,CAAC,eAAe,CAAC,iBAAiB,CAAC,EAAE,QAAQ,EAAE,QAAQ,EAAE,CAAC,CAAC,CAAC;IACrE,CAAC,CAAC;IAEF;;;;OAIG;IACH,SAAS,CAAC,GAAG,EAAE;QACd,IAAI,oBAAoB;YAAE,OAAO;QACjC,oBAAoB,GAAG,IAAI,CAAC;QAC5B,+DAA+D;QAC/D,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,eAAe,CACpD,EAAE,KAAK,EAAE,WAAW,EAAE,GAAG,EAAE,qBAAqB,EAAE,EAClD,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE;YACb,IAAI,GAAG,EAAE;gBACR,OAAO,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,CAAC,MAAM,CAAC,KAAK,CACjD,qEAAqE,GAAG,EAAE,CAC1E,CAAC;aACF;YACD,QAAQ,CAAC,eAAe,CAAC,oBAAoB,CAAC,IAAI,CAAC,CAAC,CAAC;QACtD,CAAC,CACD,CAAC;IACH,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,qFAAqF;IACrF,SAAS,CAAC,GAAG,EAAE;QACd,UAAU,CAAC,IAAI,CAAC,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC;YAC1C,KAAK,EAAE,WAAW;YAClB,GAAG,EAAE,qBAAqB;YAC1B,KAAK,EAAE,SAAS;SAChB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAC;IAEhB,OAAO;QACN,SAAS;QACT,cAAc;QACd,eAAe;QACf,iBAAiB;KACjB,CAAC;AACH,CAAC,CAAC"}

package/react/hooks/useFloatingFocus.d.ts

@@ -0,0 +1,16 @@
+/**
+ * Adds a floating focus indicator to the page. This improves accessibility by providing
+ * a visual indicator when using keyboard navigation. The indicator will briefly flash a
+ * contrasting gray on the page field that has focus. This indicator will only display during
+ * keyboard navigation, not mouse navigation.
+ *
+ * floatingFocus.lazy.css can be used to modify the appearance of the indicator.
+ *
+ * We must be careful not to inject styles until the DOM exists because this hook could be
+ * called in a preload (such as an injected windowTitlebar). For the same reason, we compile
+ * the styles using style-loader's lazy option and dynamically inject them rather than allowing
+ * them to be injected as import side effects. This use case relies on floating-focus-a11y's unstyled
+ * build: https://github.com/Q42/floating-focus-a11y#separate-stylesheet
+ */
+export declare const useFloatingFocus: () => void;
+//# sourceMappingURL=useFloatingFocus.d.ts.map

package/react/hooks/useFloatingFocus.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFloatingFocus.d.ts","sourceRoot":"","sources":["../../../../src/ui/hooks/useFloatingFocus.ts"],"names":[],"mappings":"AAWA;;;;;;;;;;;;;GAaG;AACH,eAAO,MAAM,gBAAgB,YAU5B,CAAC"}

package/react/hooks/useFloatingFocus.js

@@ -0,0 +1,36 @@
+import FocusA11Y from "@q42/floating-focus-a11y/dist/unstyled";
+import { useEffect } from "react";
+import floatingFocusCSS from "../assets/css/floatingFocus.lazy.css";
+const addFloatingFocus = () => {
+    // Load the styles into the document's <head>
+    floatingFocusCSS.use();
+    // Create the accessibility helper
+    new FocusA11Y();
+};
+/**
+ * Adds a floating focus indicator to the page. This improves accessibility by providing
+ * a visual indicator when using keyboard navigation. The indicator will briefly flash a
+ * contrasting gray on the page field that has focus. This indicator will only display during
+ * keyboard navigation, not mouse navigation.
+ *
+ * floatingFocus.lazy.css can be used to modify the appearance of the indicator.
+ *
+ * We must be careful not to inject styles until the DOM exists because this hook could be
+ * called in a preload (such as an injected windowTitlebar). For the same reason, we compile
+ * the styles using style-loader's lazy option and dynamically inject them rather than allowing
+ * them to be injected as import side effects. This use case relies on floating-focus-a11y's unstyled
+ * build: https://github.com/Q42/floating-focus-a11y#separate-stylesheet
+ */
+export const useFloatingFocus = () => {
+    useEffect(() => {
+        if (document.readyState === "loading") {
+            window.addEventListener("DOMContentLoaded", () => {
+                addFloatingFocus();
+            });
+        }
+        else {
+            addFloatingFocus();
+        }
+    }, []);
+};
+//# sourceMappingURL=useFloatingFocus.js.map

package/react/hooks/useFloatingFocus.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFloatingFocus.js","sourceRoot":"","sources":["../../../../src/ui/hooks/useFloatingFocus.ts"],"names":[],"mappings":"AAAA,OAAO,SAAS,MAAM,wCAAwC,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAClC,OAAO,gBAAgB,MAAM,sCAAsC,CAAC;AAEpE,MAAM,gBAAgB,GAAG,GAAG,EAAE;IAC7B,6CAA6C;IAC7C,gBAAgB,CAAC,GAAG,EAAE,CAAC;IACvB,kCAAkC;IAClC,IAAI,SAAS,EAAE,CAAC;AACjB,CAAC,CAAC;AAEF;;;;;;;;;;;;;GAaG;AACH,MAAM,CAAC,MAAM,gBAAgB,GAAG,GAAG,EAAE;IACpC,SAAS,CAAC,GAAG,EAAE;QACd,IAAI,QAAQ,CAAC,UAAU,KAAK,SAAS,EAAE;YACtC,MAAM,CAAC,gBAAgB,CAAC,kBAAkB,EAAE,GAAG,EAAE;gBAChD,gBAAgB,EAAE,CAAC;YACpB,CAAC,CAAC,CAAC;SACH;aAAM;YACN,gBAAgB,EAAE,CAAC;SACnB;IACF,CAAC,EAAE,EAAE,CAAC,CAAC;AACR,CAAC,CAAC"}