roamjs-components 0.53.2 → 0.53.5

package/components/ExternalLogin.js

@@ -1,132 +1,132 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const core_1 = require("@blueprintjs/core");
-const react_1 = (0, tslib_1.__importStar)(require("react"));
-const createBlock_1 = (0, tslib_1.__importDefault)(require("../writes/createBlock"));
-const getBasicTreeByParentUid_1 = (0, tslib_1.__importDefault)(require("../queries/getBasicTreeByParentUid"));
-const idToTitle_1 = (0, tslib_1.__importDefault)(require("../util/idToTitle"));
-const randomstring_1 = (0, tslib_1.__importDefault)(require("randomstring"));
-const axios_1 = (0, tslib_1.__importDefault)(require("axios"));
-const aes_1 = (0, tslib_1.__importDefault)(require("crypto-js/aes"));
-const enc_utf8_1 = (0, tslib_1.__importDefault)(require("crypto-js/enc-utf8"));
-const localStorageGet_1 = (0, tslib_1.__importDefault)(require("../util/localStorageGet"));
-const localStorageSet_1 = (0, tslib_1.__importDefault)(require("../util/localStorageSet"));
-const targetOrigin = process.env.CUSTOM_ROAMJS_ORIGIN || "https://roamjs.com";
-const ExternalLogin = ({ onSuccess, useLocal, parentUid, service, getPopoutUrl, getAuthData, ServiceIcon, loggedIn = false, }) => {
-    const [loading, setLoading] = (0, react_1.useState)(false);
-    const [error, setError] = (0, react_1.useState)("");
-    const onClick = (0, react_1.useCallback)(() => {
-        const otp = randomstring_1.default.generate(8);
-        const key = randomstring_1.default.generate(16);
-        const state = `${service}_${otp}_${key}`;
-        setLoading(true);
-        getPopoutUrl(state)
-            .then((url) => {
-            const width = 600;
-            const height = 525;
-            const left = window.screenX + (window.innerWidth - width) / 2;
-            const top = window.screenY + (window.innerHeight - height) / 2;
-            const loginWindow = window.open(`${url}&state=${state}`, `roamjs:${service}:login`, `left=${left},top=${top},width=${width},height=${height},status=1`);
-            let intervalListener = 0;
-            const processAuthData = (data) => {
-                var _a;
-                (_a = loginWindow === null || loginWindow === void 0 ? void 0 : loginWindow.close) === null || _a === void 0 ? void 0 : _a.call(loginWindow);
-                getAuthData(data)
-                    .then((rr) => (0, tslib_1.__awaiter)(void 0, void 0, void 0, function* () {
-                    var _b;
-                    const labelUid = window.roamAlphaAPI.util.generateUID();
-                    const { label = "Default Account" } = rr, rawData = (0, tslib_1.__rest)(rr, ["label"]);
-                    const oauthData = JSON.stringify(rawData);
-                    const account = {
-                        text: label,
-                        uid: labelUid,
-                        data: oauthData,
-                        time: new Date().valueOf(),
-                    };
-                    const existingTree = (0, getBasicTreeByParentUid_1.default)(parentUid).find((t) => /oauth/i.test(t.text));
-                    const blockUid = (existingTree === null || existingTree === void 0 ? void 0 : existingTree.uid) ||
-                        (yield (0, createBlock_1.default)({ node: { text: "oauth" }, parentUid }));
-                    if (useLocal) {
-                        const key = `oauth-${service}`;
-                        const accounts = JSON.parse((0, localStorageGet_1.default)(key));
-                        (0, localStorageSet_1.default)(key, JSON.stringify([...accounts, account]));
-                    }
-                    else {
-                        window.roamAlphaAPI.createBlock({
-                            block: { string: label, uid: labelUid },
-                            location: {
-                                "parent-uid": blockUid,
-                                order: ((_b = existingTree === null || existingTree === void 0 ? void 0 : existingTree.children) === null || _b === void 0 ? void 0 : _b.length) || 0,
-                            },
-                        });
-                        const valueUid = window.roamAlphaAPI.util.generateUID();
-                        const block = {
-                            string: oauthData,
-                            uid: valueUid,
-                        };
-                        window.roamAlphaAPI.createBlock({
-                            location: { "parent-uid": labelUid, order: 0 },
-                            block,
-                        });
-                        window.roamAlphaAPI.updateBlock({
-                            block: { open: false, string: "oauth", uid: blockUid },
-                        });
-                    }
-                    onSuccess(account);
-                }))
-                    .finally(() => {
-                    window.removeEventListener("message", messageEventListener);
-                    window.clearTimeout(intervalListener);
-                    setLoading(false);
-                });
-            };
-            const messageEventListener = (e) => {
-                if (e.origin === targetOrigin && loginWindow) {
-                    processAuthData(e.data);
-                }
-            };
-            const authInterval = () => {
-                axios_1.default
-                    .post(`https://lambda.roamjs.com/auth`, {
-                    service,
-                    otp,
-                })
-                    .then((r) => {
-                    if (r.data.auth) {
-                        const auth = aes_1.default.decrypt(r.data.auth, key).toString(enc_utf8_1.default);
-                        processAuthData(auth);
-                    }
-                    else {
-                        intervalListener = window.setTimeout(authInterval, 1000);
-                    }
-                })
-                    .catch((e) => {
-                    var _a;
-                    if (((_a = e.response) === null || _a === void 0 ? void 0 : _a.status) !== 400) {
-                        intervalListener = window.setTimeout(authInterval, 1000);
-                    }
-                });
-            };
-            authInterval();
-            window.addEventListener("message", messageEventListener);
-        })
-            .catch((e) => {
-            setError(e.message);
-            setLoading(false);
-        });
-    }, [onSuccess, parentUid, setLoading, setError]);
-    return (react_1.default.createElement("div", { style: { display: "flex" } },
-        react_1.default.createElement(core_1.Button, { icon: react_1.default.createElement(core_1.Icon, { icon: react_1.default.createElement(ServiceIcon, { style: {
-                        width: 15,
-                        height: 15,
-                        marginLeft: 4,
-                        cursor: "pointer",
-                    } }) }), onClick: onClick, disabled: loading, className: "roamjs-external-login" }, loggedIn
-            ? `Add Another ${(0, idToTitle_1.default)(service)} Account`
-            : `Login With ${(0, idToTitle_1.default)(service)}`),
-        loading && react_1.default.createElement(core_1.Spinner, { size: core_1.Spinner.SIZE_SMALL }),
-        error && (react_1.default.createElement("div", { style: { color: "red", whiteSpace: "pre-line" } }, error))));
-};
-exports.default = ExternalLogin;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const core_1 = require("@blueprintjs/core");
+const react_1 = (0, tslib_1.__importStar)(require("react"));
+const createBlock_1 = (0, tslib_1.__importDefault)(require("../writes/createBlock"));
+const getBasicTreeByParentUid_1 = (0, tslib_1.__importDefault)(require("../queries/getBasicTreeByParentUid"));
+const idToTitle_1 = (0, tslib_1.__importDefault)(require("../util/idToTitle"));
+const randomstring_1 = (0, tslib_1.__importDefault)(require("randomstring"));
+const axios_1 = (0, tslib_1.__importDefault)(require("axios"));
+const aes_1 = (0, tslib_1.__importDefault)(require("crypto-js/aes"));
+const enc_utf8_1 = (0, tslib_1.__importDefault)(require("crypto-js/enc-utf8"));
+const localStorageGet_1 = (0, tslib_1.__importDefault)(require("../util/localStorageGet"));
+const localStorageSet_1 = (0, tslib_1.__importDefault)(require("../util/localStorageSet"));
+const targetOrigin = process.env.CUSTOM_ROAMJS_ORIGIN || "https://roamjs.com";
+const ExternalLogin = ({ onSuccess, useLocal, parentUid, service, getPopoutUrl, getAuthData, ServiceIcon, loggedIn = false, }) => {
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)("");
+    const onClick = (0, react_1.useCallback)(() => {
+        const otp = randomstring_1.default.generate(8);
+        const key = randomstring_1.default.generate(16);
+        const state = `${service}_${otp}_${key}`;
+        setLoading(true);
+        getPopoutUrl(state)
+            .then((url) => {
+            const width = 600;
+            const height = 525;
+            const left = window.screenX + (window.innerWidth - width) / 2;
+            const top = window.screenY + (window.innerHeight - height) / 2;
+            const loginWindow = window.open(`${url}&state=${state}`, `roamjs:${service}:login`, `left=${left},top=${top},width=${width},height=${height},status=1`);
+            let intervalListener = 0;
+            const processAuthData = (data) => {
+                var _a;
+                (_a = loginWindow === null || loginWindow === void 0 ? void 0 : loginWindow.close) === null || _a === void 0 ? void 0 : _a.call(loginWindow);
+                getAuthData(data)
+                    .then((rr) => (0, tslib_1.__awaiter)(void 0, void 0, void 0, function* () {
+                    var _b;
+                    const labelUid = window.roamAlphaAPI.util.generateUID();
+                    const { label = "Default Account" } = rr, rawData = (0, tslib_1.__rest)(rr, ["label"]);
+                    const oauthData = JSON.stringify(rawData);
+                    const account = {
+                        text: label,
+                        uid: labelUid,
+                        data: oauthData,
+                        time: new Date().valueOf(),
+                    };
+                    const existingTree = (0, getBasicTreeByParentUid_1.default)(parentUid).find((t) => /oauth/i.test(t.text));
+                    const blockUid = (existingTree === null || existingTree === void 0 ? void 0 : existingTree.uid) ||
+                        (yield (0, createBlock_1.default)({ node: { text: "oauth" }, parentUid }));
+                    if (useLocal) {
+                        const key = `oauth-${service}`;
+                        const accounts = JSON.parse((0, localStorageGet_1.default)(key));
+                        (0, localStorageSet_1.default)(key, JSON.stringify([...accounts, account]));
+                    }
+                    else {
+                        window.roamAlphaAPI.createBlock({
+                            block: { string: label, uid: labelUid },
+                            location: {
+                                "parent-uid": blockUid,
+                                order: ((_b = existingTree === null || existingTree === void 0 ? void 0 : existingTree.children) === null || _b === void 0 ? void 0 : _b.length) || 0,
+                            },
+                        });
+                        const valueUid = window.roamAlphaAPI.util.generateUID();
+                        const block = {
+                            string: oauthData,
+                            uid: valueUid,
+                        };
+                        window.roamAlphaAPI.createBlock({
+                            location: { "parent-uid": labelUid, order: 0 },
+                            block,
+                        });
+                        window.roamAlphaAPI.updateBlock({
+                            block: { open: false, string: "oauth", uid: blockUid },
+                        });
+                    }
+                    onSuccess(account);
+                }))
+                    .finally(() => {
+                    window.removeEventListener("message", messageEventListener);
+                    window.clearTimeout(intervalListener);
+                    setLoading(false);
+                });
+            };
+            const messageEventListener = (e) => {
+                if (e.origin === targetOrigin && loginWindow) {
+                    processAuthData(e.data);
+                }
+            };
+            const authInterval = () => {
+                axios_1.default
+                    .post(`https://lambda.roamjs.com/auth`, {
+                    service,
+                    otp,
+                })
+                    .then((r) => {
+                    if (r.data.auth) {
+                        const auth = aes_1.default.decrypt(r.data.auth, key).toString(enc_utf8_1.default);
+                        processAuthData(auth);
+                    }
+                    else {
+                        intervalListener = window.setTimeout(authInterval, 1000);
+                    }
+                })
+                    .catch((e) => {
+                    var _a;
+                    if (((_a = e.response) === null || _a === void 0 ? void 0 : _a.status) !== 400) {
+                        intervalListener = window.setTimeout(authInterval, 1000);
+                    }
+                });
+            };
+            authInterval();
+            window.addEventListener("message", messageEventListener);
+        })
+            .catch((e) => {
+            setError(e.message);
+            setLoading(false);
+        });
+    }, [onSuccess, parentUid, setLoading, setError]);
+    return (react_1.default.createElement("div", { style: { display: "flex" } },
+        react_1.default.createElement(core_1.Button, { icon: react_1.default.createElement(core_1.Icon, { icon: react_1.default.createElement(ServiceIcon, { style: {
+                        width: 15,
+                        height: 15,
+                        marginLeft: 4,
+                        cursor: "pointer",
+                    } }) }), onClick: onClick, disabled: loading, className: "roamjs-external-login" }, loggedIn
+            ? `Add Another ${(0, idToTitle_1.default)(service)} Account`
+            : `Login With ${(0, idToTitle_1.default)(service)}`),
+        loading && react_1.default.createElement(core_1.Spinner, { size: core_1.Spinner.SIZE_SMALL }),
+        error && (react_1.default.createElement("div", { style: { color: "red", whiteSpace: "pre-line" } }, error))));
+};
+exports.default = ExternalLogin;
 //# sourceMappingURL=ExternalLogin.js.map

package/components/Filter.d.ts

@@ -1,14 +1,14 @@
-import React from "react";
-declare type Filters = {
-    includes: Record<string, Set<string>>;
-    excludes: Record<string, Set<string>>;
-};
-declare const Filter: ({ data, initialValue, onChange, renderButtonText, includeHelpMessage, excludeHelpMessage, }: {
-    initialValue?: Filters | undefined;
-    data: Record<string, string[]>;
-    onChange: (filters: Filters) => void;
-    renderButtonText?: ((s: string, key: string) => React.ReactNode) | undefined;
-    includeHelpMessage?: string | undefined;
-    excludeHelpMessage?: string | undefined;
-}) => JSX.Element;
-export default Filter;
+import React from "react";
+declare type Filters = {
+    includes: Record<string, Set<string>>;
+    excludes: Record<string, Set<string>>;
+};
+declare const Filter: ({ data, initialValue, onChange, renderButtonText, includeHelpMessage, excludeHelpMessage, }: {
+    initialValue?: Filters | undefined;
+    data: Record<string, string[]>;
+    onChange: (filters: Filters) => void;
+    renderButtonText?: ((s: string, key: string) => React.ReactNode) | undefined;
+    includeHelpMessage?: string | undefined;
+    excludeHelpMessage?: string | undefined;
+}) => JSX.Element;
+export default Filter;

package/components/Filter.js

@@ -1,148 +1,148 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-const tslib_1 = require("tslib");
-const core_1 = require("@blueprintjs/core");
-const react_1 = (0, tslib_1.__importStar)(require("react"));
-const fuzzy_1 = (0, tslib_1.__importDefault)(require("fuzzy"));
-const Filter = ({ data, initialValue, onChange, renderButtonText = (s) => s ? s.toString() : react_1.default.createElement("i", { style: { opacity: 0.5 } }, "(Empty)"), includeHelpMessage = "Only include these values", excludeHelpMessage = "Exclude these values", }) => {
-    const [isFilterOpen, setIsFilterOpen] = (0, react_1.useState)(false);
-    const openFilter = (0, react_1.useCallback)((e) => {
-        e.stopPropagation();
-        setIsFilterOpen(true);
-    }, [setIsFilterOpen]);
-    const closeFilter = (0, react_1.useCallback)(() => {
-        setIsFilterOpen(false);
-    }, [setIsFilterOpen]);
-    const filtersRef = (0, react_1.useRef)({
-        includes: Object.fromEntries(Object.keys(data).map((k) => [
-            k,
-            new Set(data[k].filter((d) => initialValue && initialValue.includes[k].has(d))),
-        ])),
-        excludes: Object.fromEntries(Object.keys(data).map((k) => [
-            k,
-            new Set(data[k].filter((d) => initialValue && initialValue.excludes[k].has(d))),
-        ])),
-    });
-    const [filters, setFilters] = (0, react_1.useState)(filtersRef.current);
-    const [filterSearch, setFilterSearch] = (0, react_1.useState)("");
-    return (react_1.default.createElement(core_1.Tooltip, { content: "Filters", position: core_1.Position.BOTTOM },
-        react_1.default.createElement(core_1.Popover, { target: react_1.default.createElement(core_1.Button, { icon: "filter", onClick: openFilter, className: "roamjs-filter", minimal: true, style: Object.keys(filters.includes).some((k) => filters.includes[k].size === 0) ||
-                    Object.keys(filters.excludes).some((k) => filters.includes[k].size === 0)
-                    ? { color: "#a82a2a" }
-                    : {} }), content: react_1.default.createElement("div", { style: { maxWidth: 600, maxHeight: 245, overflowY: "scroll" }, onClick: (e) => e.stopPropagation() },
-                react_1.default.createElement("div", { style: {
-                        display: "flex",
-                        flexDirection: "column",
-                        width: 500,
-                        maxWidth: "90vw",
-                        transition: "all 300ms ease-in 0s",
-                        padding: 8,
-                    } },
-                    react_1.default.createElement("div", { className: "flex-h-box" },
-                        react_1.default.createElement("div", { style: {
-                                flex: "1 1 100%",
-                                paddingTop: 4,
-                                paddingBottom: 4,
-                                paddingLeft: 4,
-                            } },
-                            react_1.default.createElement("div", null,
-                                react_1.default.createElement("strong", null, "Includes"),
-                                react_1.default.createElement("span", { style: { marginLeft: 4, fontSize: 12 } }, "Click to Add"),
-                                react_1.default.createElement("div", { style: {
-                                        padding: "8px 0px",
-                                        fontSize: "0.8em",
-                                        color: "rgb(167, 182, 194)",
-                                    } }, Object.keys(filters.includes).every((k) => filters.includes[k].size === 0)
-                                    ? includeHelpMessage
-                                    : Object.keys(data).flatMap((key) => data[key]
-                                        .filter((n) => filters.includes[key].has(n))
-                                        .map((n, i) => (react_1.default.createElement("div", { style: {
-                                            position: "relative",
-                                            display: "inline-block",
-                                        }, key: `${n.toString()}-${i}` },
-                                        react_1.default.createElement("div", null,
-                                            react_1.default.createElement("button", { className: "bp3-button", style: {
-                                                    margin: 4,
-                                                    paddingRight: 4,
-                                                    cursor: "pointer",
-                                                    borderBottomColor: "rgb(92, 112, 128)",
-                                                }, onClick: () => {
-                                                    filtersRef.current.includes[key].delete(n);
-                                                    const filters = Object.assign({}, filtersRef.current);
-                                                    setFilters(filters);
-                                                    onChange(filters);
-                                                } }, renderButtonText(n, key))))))))),
-                            react_1.default.createElement("div", { style: { paddingTop: 8 } })),
-                        react_1.default.createElement("div", { className: "rm-line", style: { marginTop: 8, marginBottom: 8 } }),
-                        react_1.default.createElement("div", { style: {
-                                flex: "1 1 100%",
-                                paddingTop: 4,
-                                paddingBottom: 4,
-                                paddingLeft: 8,
-                            } },
-                            react_1.default.createElement("div", null,
-                                react_1.default.createElement("strong", null, "Removes"),
-                                react_1.default.createElement("span", { style: { marginLeft: 4, fontSize: 12 } }, "Shift-Click to Add"),
-                                react_1.default.createElement("div", { style: {
-                                        padding: "8px 0px",
-                                        fontSize: "0.8em",
-                                        color: "rgb(167, 182, 194)",
-                                    } }, Object.keys(filters.excludes).every((k) => filters.excludes[k].size === 0)
-                                    ? excludeHelpMessage
-                                    : Object.keys(data).flatMap((key) => data[key]
-                                        .filter((n) => filters.excludes[key].has(n))
-                                        .map((n, i) => (react_1.default.createElement("div", { style: {
-                                            position: "relative",
-                                            display: "inline-block",
-                                        }, key: `${n.toString()}-${i}` },
-                                        react_1.default.createElement("div", null,
-                                            react_1.default.createElement("button", { className: "bp3-button", style: {
-                                                    margin: 4,
-                                                    paddingRight: 4,
-                                                    cursor: "pointer",
-                                                    borderBottomColor: "rgb(92, 112, 128)",
-                                                }, onClick: () => {
-                                                    filtersRef.current.excludes[key].delete(n);
-                                                    const filters = Object.assign({}, filtersRef.current);
-                                                    setFilters(filters);
-                                                    onChange(filters);
-                                                } }, renderButtonText(n, key))))))))),
-                            react_1.default.createElement("div", { style: { paddingTop: 8 } }))),
-                    react_1.default.createElement("div", { className: "rm-line", style: { marginTop: 4, borderColor: "rgb(41, 55, 66)" } }),
-                    react_1.default.createElement("input", { placeholder: "Search References", className: "bp3-input bp3-minimal search-input", style: { margin: 8 }, value: filterSearch, onChange: (e) => setFilterSearch(e.target.value) }),
-                    react_1.default.createElement("div", { className: "flex-h-box" }, Object.keys(data).map((k, i, all) => (react_1.default.createElement(react_1.default.Fragment, { key: k },
-                        react_1.default.createElement("div", { style: {
-                                flex: "1 1 100%",
-                                paddingTop: 4,
-                                paddingBottom: 4,
-                                paddingLeft: 4,
-                            } }, (filterSearch
-                            ? fuzzy_1.default
-                                .filter(filterSearch, data[k])
-                                .map((s) => s.string)
-                            : data[k])
-                            .filter((n) => !filters.includes[k].has(n) &&
-                            !filters.excludes[k].has(n))
-                            .map((n, i) => (react_1.default.createElement("div", { style: {
-                                position: "relative",
-                                display: "inline-block",
-                            }, key: `${n.toString()}-${i}` },
-                            react_1.default.createElement("div", null,
-                                react_1.default.createElement("button", { className: "bp3-button", style: {
-                                        margin: 4,
-                                        paddingRight: 4,
-                                        cursor: "pointer",
-                                        borderBottomColor: "rgb(92, 112, 128)",
-                                    }, onClick: (e) => {
-                                        if (e.shiftKey)
-                                            filtersRef.current.excludes[k].add(n);
-                                        else
-                                            filtersRef.current.includes[k].add(n);
-                                        const filters = Object.assign({}, filtersRef.current);
-                                        setFilters(filters);
-                                        onChange(filters);
-                                    } }, renderButtonText(n, k))))))),
-                        i < all.length - 1 && (react_1.default.createElement("div", { className: "rm-line", style: { marginTop: 8, marginBottom: 8 } })))))))), onClose: closeFilter, isOpen: isFilterOpen })));
-};
-exports.default = Filter;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const core_1 = require("@blueprintjs/core");
+const react_1 = (0, tslib_1.__importStar)(require("react"));
+const fuzzy_1 = (0, tslib_1.__importDefault)(require("fuzzy"));
+const Filter = ({ data, initialValue, onChange, renderButtonText = (s) => s ? s.toString() : react_1.default.createElement("i", { style: { opacity: 0.5 } }, "(Empty)"), includeHelpMessage = "Only include these values", excludeHelpMessage = "Exclude these values", }) => {
+    const [isFilterOpen, setIsFilterOpen] = (0, react_1.useState)(false);
+    const openFilter = (0, react_1.useCallback)((e) => {
+        e.stopPropagation();
+        setIsFilterOpen(true);
+    }, [setIsFilterOpen]);
+    const closeFilter = (0, react_1.useCallback)(() => {
+        setIsFilterOpen(false);
+    }, [setIsFilterOpen]);
+    const filtersRef = (0, react_1.useRef)({
+        includes: Object.fromEntries(Object.keys(data).map((k) => [
+            k,
+            new Set(data[k].filter((d) => initialValue && initialValue.includes[k].has(d))),
+        ])),
+        excludes: Object.fromEntries(Object.keys(data).map((k) => [
+            k,
+            new Set(data[k].filter((d) => initialValue && initialValue.excludes[k].has(d))),
+        ])),
+    });
+    const [filters, setFilters] = (0, react_1.useState)(filtersRef.current);
+    const [filterSearch, setFilterSearch] = (0, react_1.useState)("");
+    return (react_1.default.createElement(core_1.Tooltip, { content: "Filters", position: core_1.Position.BOTTOM },
+        react_1.default.createElement(core_1.Popover, { target: react_1.default.createElement(core_1.Button, { icon: "filter", onClick: openFilter, className: "roamjs-filter", minimal: true, style: Object.keys(filters.includes).some((k) => filters.includes[k].size === 0) ||
+                    Object.keys(filters.excludes).some((k) => filters.includes[k].size === 0)
+                    ? { color: "#a82a2a" }
+                    : {} }), content: react_1.default.createElement("div", { style: { maxWidth: 600, maxHeight: 245, overflowY: "scroll" }, onClick: (e) => e.stopPropagation() },
+                react_1.default.createElement("div", { style: {
+                        display: "flex",
+                        flexDirection: "column",
+                        width: 500,
+                        maxWidth: "90vw",
+                        transition: "all 300ms ease-in 0s",
+                        padding: 8,
+                    } },
+                    react_1.default.createElement("div", { className: "flex-h-box" },
+                        react_1.default.createElement("div", { style: {
+                                flex: "1 1 100%",
+                                paddingTop: 4,
+                                paddingBottom: 4,
+                                paddingLeft: 4,
+                            } },
+                            react_1.default.createElement("div", null,
+                                react_1.default.createElement("strong", null, "Includes"),
+                                react_1.default.createElement("span", { style: { marginLeft: 4, fontSize: 12 } }, "Click to Add"),
+                                react_1.default.createElement("div", { style: {
+                                        padding: "8px 0px",
+                                        fontSize: "0.8em",
+                                        color: "rgb(167, 182, 194)",
+                                    } }, Object.keys(filters.includes).every((k) => filters.includes[k].size === 0)
+                                    ? includeHelpMessage
+                                    : Object.keys(data).flatMap((key) => data[key]
+                                        .filter((n) => filters.includes[key].has(n))
+                                        .map((n, i) => (react_1.default.createElement("div", { style: {
+                                            position: "relative",
+                                            display: "inline-block",
+                                        }, key: `${n.toString()}-${i}` },
+                                        react_1.default.createElement("div", null,
+                                            react_1.default.createElement("button", { className: "bp3-button", style: {
+                                                    margin: 4,
+                                                    paddingRight: 4,
+                                                    cursor: "pointer",
+                                                    borderBottomColor: "rgb(92, 112, 128)",
+                                                }, onClick: () => {
+                                                    filtersRef.current.includes[key].delete(n);
+                                                    const filters = Object.assign({}, filtersRef.current);
+                                                    setFilters(filters);
+                                                    onChange(filters);
+                                                } }, renderButtonText(n, key))))))))),
+                            react_1.default.createElement("div", { style: { paddingTop: 8 } })),
+                        react_1.default.createElement("div", { className: "rm-line", style: { marginTop: 8, marginBottom: 8 } }),
+                        react_1.default.createElement("div", { style: {
+                                flex: "1 1 100%",
+                                paddingTop: 4,
+                                paddingBottom: 4,
+                                paddingLeft: 8,
+                            } },
+                            react_1.default.createElement("div", null,
+                                react_1.default.createElement("strong", null, "Removes"),
+                                react_1.default.createElement("span", { style: { marginLeft: 4, fontSize: 12 } }, "Shift-Click to Add"),
+                                react_1.default.createElement("div", { style: {
+                                        padding: "8px 0px",
+                                        fontSize: "0.8em",
+                                        color: "rgb(167, 182, 194)",
+                                    } }, Object.keys(filters.excludes).every((k) => filters.excludes[k].size === 0)
+                                    ? excludeHelpMessage
+                                    : Object.keys(data).flatMap((key) => data[key]
+                                        .filter((n) => filters.excludes[key].has(n))
+                                        .map((n, i) => (react_1.default.createElement("div", { style: {
+                                            position: "relative",
+                                            display: "inline-block",
+                                        }, key: `${n.toString()}-${i}` },
+                                        react_1.default.createElement("div", null,
+                                            react_1.default.createElement("button", { className: "bp3-button", style: {
+                                                    margin: 4,
+                                                    paddingRight: 4,
+                                                    cursor: "pointer",
+                                                    borderBottomColor: "rgb(92, 112, 128)",
+                                                }, onClick: () => {
+                                                    filtersRef.current.excludes[key].delete(n);
+                                                    const filters = Object.assign({}, filtersRef.current);
+                                                    setFilters(filters);
+                                                    onChange(filters);
+                                                } }, renderButtonText(n, key))))))))),
+                            react_1.default.createElement("div", { style: { paddingTop: 8 } }))),
+                    react_1.default.createElement("div", { className: "rm-line", style: { marginTop: 4, borderColor: "rgb(41, 55, 66)" } }),
+                    react_1.default.createElement("input", { placeholder: "Search References", className: "bp3-input bp3-minimal search-input", style: { margin: 8 }, value: filterSearch, onChange: (e) => setFilterSearch(e.target.value) }),
+                    react_1.default.createElement("div", { className: "flex-h-box" }, Object.keys(data).map((k, i, all) => (react_1.default.createElement(react_1.default.Fragment, { key: k },
+                        react_1.default.createElement("div", { style: {
+                                flex: "1 1 100%",
+                                paddingTop: 4,
+                                paddingBottom: 4,
+                                paddingLeft: 4,
+                            } }, (filterSearch
+                            ? fuzzy_1.default
+                                .filter(filterSearch, data[k])
+                                .map((s) => s.string)
+                            : data[k])
+                            .filter((n) => !filters.includes[k].has(n) &&
+                            !filters.excludes[k].has(n))
+                            .map((n, i) => (react_1.default.createElement("div", { style: {
+                                position: "relative",
+                                display: "inline-block",
+                            }, key: `${n.toString()}-${i}` },
+                            react_1.default.createElement("div", null,
+                                react_1.default.createElement("button", { className: "bp3-button", style: {
+                                        margin: 4,
+                                        paddingRight: 4,
+                                        cursor: "pointer",
+                                        borderBottomColor: "rgb(92, 112, 128)",
+                                    }, onClick: (e) => {
+                                        if (e.shiftKey)
+                                            filtersRef.current.excludes[k].add(n);
+                                        else
+                                            filtersRef.current.includes[k].add(n);
+                                        const filters = Object.assign({}, filtersRef.current);
+                                        setFilters(filters);
+                                        onChange(filters);
+                                    } }, renderButtonText(n, k))))))),
+                        i < all.length - 1 && (react_1.default.createElement("div", { className: "rm-line", style: { marginTop: 8, marginBottom: 8 } })))))))), onClose: closeFilter, isOpen: isFilterOpen })));
+};
+exports.default = Filter;
 //# sourceMappingURL=Filter.js.map

package/components/Loading.d.ts

@@ -1,4 +1,4 @@
-/// <reference types="react" />
-declare const Loading: () => JSX.Element;
-export declare const renderLoading: (targetUid: string) => () => void;
-export default Loading;
+/// <reference types="react" />
+declare const Loading: () => JSX.Element;
+export declare const renderLoading: (targetUid: string) => () => void;
+export default Loading;