roamjs-components 0.53.2 → 0.53.5

package/components/CursorMenu.d.ts

@@ -1,21 +1,21 @@
-import React from "react";
-export declare const getCoordsFromTextarea: (t: HTMLTextAreaElement) => {
-    top: number;
-    left: number;
-};
-declare type Props<T> = {
-    textarea: HTMLTextAreaElement;
-    onItemSelect: (item: {
-        text: string;
-        id: string;
-    } & T) => void;
-    initialItems: ({
-        text: string;
-        id: string;
-    } & T)[];
-};
-declare const CursorMenu: <T extends Record<string, string>>({ textarea, onClose, onItemSelect, initialItems, }: {
-    onClose: () => void;
-} & Props<T>) => React.ReactElement;
-export declare const render: <T extends Record<string, string>>(props: Props<T>) => void;
-export default CursorMenu;
+import React from "react";
+export declare const getCoordsFromTextarea: (t: HTMLTextAreaElement) => {
+    top: number;
+    left: number;
+};
+declare type Props<T> = {
+    textarea: HTMLTextAreaElement;
+    onItemSelect: (item: {
+        text: string;
+        id: string;
+    } & T) => void;
+    initialItems: ({
+        text: string;
+        id: string;
+    } & T)[];
+};
+declare const CursorMenu: <T extends Record<string, string>>({ textarea, onClose, onItemSelect, initialItems, }: {
+    onClose: () => void;
+} & Props<T>) => React.ReactElement;
+export declare const render: <T extends Record<string, string>>(props: Props<T>) => void;
+export default CursorMenu;

package/components/CursorMenu.js

@@ -1,182 +1,182 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.render = exports.getCoordsFromTextarea = void 0;
-const tslib_1 = require("tslib");
-const core_1 = require("@blueprintjs/core");
-const react_1 = (0, tslib_1.__importStar)(require("react"));
-const react_dom_1 = (0, tslib_1.__importDefault)(require("react-dom"));
-const fuzzy_1 = (0, tslib_1.__importDefault)(require("fuzzy"));
-const dom_1 = require("../dom");
-const writes_1 = require("../writes");
-// inspired by https://github.com/zurb/tribute/blob/master/src/TributeRange.js#L446-L556
-const getCoordsFromTextarea = (t) => {
-    const properties = [
-        "direction",
-        "boxSizing",
-        "width",
-        "height",
-        "overflowX",
-        "overflowY",
-        "borderTopWidth",
-        "borderRightWidth",
-        "borderBottomWidth",
-        "borderLeftWidth",
-        "paddingTop",
-        "paddingRight",
-        "paddingBottom",
-        "paddingLeft",
-        "fontStyle",
-        "fontVariant",
-        "fontWeight",
-        "fontStretch",
-        "fontSize",
-        "fontSizeAdjust",
-        "lineHeight",
-        "fontFamily",
-        "textAlign",
-        "textTransform",
-        "textIndent",
-        "textDecoration",
-        "letterSpacing",
-        "wordSpacing",
-    ];
-    const div = document.createElement("div");
-    div.id = "input-textarea-caret-position-mirror-div";
-    document.body.appendChild(div);
-    const style = div.style;
-    const computed = getComputedStyle(t);
-    style.whiteSpace = "pre-wrap";
-    style.wordWrap = "break-word";
-    // position off-screen
-    style.position = "absolute";
-    style.visibility = "hidden";
-    style.overflow = "hidden";
-    // transfer the element's properties to the div
-    properties.forEach((prop) => {
-        style[prop] = computed[prop];
-    });
-    div.textContent = t.value.substring(0, t.selectionStart);
-    const span = document.createElement("span");
-    span.textContent = t.value.substring(t.selectionStart) || ".";
-    div.appendChild(span);
-    const doc = document.documentElement;
-    const windowLeft = (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);
-    const windowTop = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
-    const coordinates = {
-        top: windowTop +
-            span.offsetTop +
-            parseInt(computed.borderTopWidth) +
-            parseInt(computed.fontSize) -
-            t.scrollTop -
-            9,
-        left: windowLeft + span.offsetLeft + parseInt(computed.borderLeftWidth) - 1,
-    };
-    document.body.removeChild(div);
-    return coordinates;
-};
-exports.getCoordsFromTextarea = getCoordsFromTextarea;
-const VALID_FILTER = /^[\w\d\s_-]$/;
-const CursorMenu = ({ textarea, onClose, onItemSelect, initialItems, }) => {
-    const itemsById = (0, react_1.useMemo)(() => Object.fromEntries(initialItems.map((item) => [item.id, item])), [initialItems]);
-    const menuRef = (0, react_1.useRef)(null);
-    const [activeIndex, setActiveIndex] = (0, react_1.useState)(0);
-    const [filter, setFilter] = (0, react_1.useState)("");
-    const onPopoverClose = (0, react_1.useCallback)(() => {
-        if (menuRef.current) {
-            const value = menuRef.current.getAttribute("data-filter");
-            const text = `${textarea.value.substring(0, textarea.selectionStart)}${value}${textarea.value.substring(textarea.selectionStart)}`;
-            (0, writes_1.updateBlock)({ uid: (0, dom_1.getUids)(textarea).blockUid, text });
-            setTimeout(() => {
-                textarea.setSelectionRange(textarea.selectionStart + text.length, textarea.selectionEnd + text.length);
-                onClose();
-            }, 1);
-        }
-    }, [onClose, textarea, menuRef]);
-    const items = (0, react_1.useMemo)(() => (filter
-        ? fuzzy_1.default
-            .filter(filter, initialItems, {
-            extract: (s) => s.text,
-            pre: "<b>",
-            post: "</b>",
-        })
-            .map((r) => (Object.assign(Object.assign({}, r.original), { displayName: r.string })))
-        : initialItems.map((r) => (Object.assign(Object.assign({}, r), { displayName: r.text })))).slice(0, 10), [filter, initialItems]);
-    const onSelect = (0, react_1.useCallback)((item) => {
-        if (menuRef.current) {
-            onItemSelect(item);
-            onClose();
-        }
-    }, [menuRef, onClose, textarea, onItemSelect]);
-    const keydownListener = (0, react_1.useCallback)((e) => {
-        var _a;
-        if (menuRef.current &&
-            (e.key === "ArrowRight" || e.key === "ArrowDown")) {
-            const index = Number(menuRef.current.getAttribute("data-active-index"));
-            const count = menuRef.current.childElementCount;
-            setActiveIndex((index + 1) % count);
-        }
-        else if (menuRef.current &&
-            (e.key === "ArrowLeft" || e.key === "ArrowUp")) {
-            const index = Number(menuRef.current.getAttribute("data-active-index"));
-            const count = menuRef.current.childElementCount;
-            setActiveIndex((index - 1 + count) % count);
-        }
-        else if (menuRef.current && e.key === "Enter") {
-            const index = Number(menuRef.current.getAttribute("data-active-index"));
-            const id = ((_a = menuRef.current.children[index]
-                .querySelector(".bp3-menu-item")) === null || _a === void 0 ? void 0 : _a.getAttribute("data-id")) || "";
-            onSelect(itemsById[id]);
-        }
-        else if (menuRef.current && VALID_FILTER.test(e.key)) {
-            const value = menuRef.current.getAttribute("data-filter");
-            setFilter(`${value}${e.key}`);
-        }
-        else if (menuRef.current && e.key === "Backspace") {
-            const value = menuRef.current.getAttribute("data-filter");
-            if (value) {
-                setFilter(value.slice(0, -1));
-            }
-            else {
-                onClose();
-                return;
-            }
-        }
-        else if (e.key !== "Shift") {
-            onPopoverClose();
-            return;
-        }
-        e.stopPropagation();
-        e.preventDefault();
-    }, [menuRef, setActiveIndex, onClose, onPopoverClose]);
-    (0, react_1.useEffect)(() => {
-        textarea.addEventListener("keydown", keydownListener);
-        return () => {
-            textarea.removeEventListener("keydown", keydownListener);
-        };
-    }, [keydownListener]);
-    return (react_1.default.createElement(core_1.Popover, { onClose: onPopoverClose, isOpen: true, canEscapeKeyClose: true, minimal: true, target: react_1.default.createElement("span", null), position: core_1.Position.BOTTOM_LEFT, modifiers: {
-            flip: { enabled: false },
-            preventOverflow: { enabled: false },
-        }, autoFocus: false, content: react_1.default.createElement(core_1.Menu, { ulRef: menuRef, "data-active-index": activeIndex, "data-filter": filter, style: { width: 300 } }, items.length ? (items.map(({ id, displayName }, i) => {
-            return (react_1.default.createElement(core_1.MenuItem, { key: id, "data-id": id, text: displayName
-                    .split(/<b>(.*?)<\/b>/)
-                    .map((part, i) => i % 2 === 1 ? (react_1.default.createElement("b", { key: i }, part)) : (react_1.default.createElement("span", { key: i }, part))), active: i === activeIndex, onMouseEnter: () => setActiveIndex(i), onClick: () => onSelect(itemsById[id]) }));
-        })) : (react_1.default.createElement(core_1.MenuItem, { text: react_1.default.createElement("span", { style: { opacity: 0.75 } },
-                react_1.default.createElement("i", null, "None")), active: false, disabled: true }))) }));
-};
-const render = (props) => {
-    var _a;
-    const parent = document.createElement("span");
-    const coords = (0, exports.getCoordsFromTextarea)(props.textarea);
-    parent.style.position = "absolute";
-    parent.style.left = `${coords.left}px`;
-    parent.style.top = `${coords.top}px`;
-    (_a = props.textarea.parentElement) === null || _a === void 0 ? void 0 : _a.insertBefore(parent, props.textarea);
-    react_dom_1.default.render(react_1.default.createElement(CursorMenu, Object.assign({}, props, { onClose: () => {
-            react_dom_1.default.unmountComponentAtNode(parent);
-            parent.remove();
-        } })), parent);
-};
-exports.render = render;
-exports.default = CursorMenu;
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.render = exports.getCoordsFromTextarea = void 0;
+const tslib_1 = require("tslib");
+const core_1 = require("@blueprintjs/core");
+const react_1 = (0, tslib_1.__importStar)(require("react"));
+const react_dom_1 = (0, tslib_1.__importDefault)(require("react-dom"));
+const fuzzy_1 = (0, tslib_1.__importDefault)(require("fuzzy"));
+const dom_1 = require("../dom");
+const writes_1 = require("../writes");
+// inspired by https://github.com/zurb/tribute/blob/master/src/TributeRange.js#L446-L556
+const getCoordsFromTextarea = (t) => {
+    const properties = [
+        "direction",
+        "boxSizing",
+        "width",
+        "height",
+        "overflowX",
+        "overflowY",
+        "borderTopWidth",
+        "borderRightWidth",
+        "borderBottomWidth",
+        "borderLeftWidth",
+        "paddingTop",
+        "paddingRight",
+        "paddingBottom",
+        "paddingLeft",
+        "fontStyle",
+        "fontVariant",
+        "fontWeight",
+        "fontStretch",
+        "fontSize",
+        "fontSizeAdjust",
+        "lineHeight",
+        "fontFamily",
+        "textAlign",
+        "textTransform",
+        "textIndent",
+        "textDecoration",
+        "letterSpacing",
+        "wordSpacing",
+    ];
+    const div = document.createElement("div");
+    div.id = "input-textarea-caret-position-mirror-div";
+    document.body.appendChild(div);
+    const style = div.style;
+    const computed = getComputedStyle(t);
+    style.whiteSpace = "pre-wrap";
+    style.wordWrap = "break-word";
+    // position off-screen
+    style.position = "absolute";
+    style.visibility = "hidden";
+    style.overflow = "hidden";
+    // transfer the element's properties to the div
+    properties.forEach((prop) => {
+        style[prop] = computed[prop];
+    });
+    div.textContent = t.value.substring(0, t.selectionStart);
+    const span = document.createElement("span");
+    span.textContent = t.value.substring(t.selectionStart) || ".";
+    div.appendChild(span);
+    const doc = document.documentElement;
+    const windowLeft = (window.pageXOffset || doc.scrollLeft) - (doc.clientLeft || 0);
+    const windowTop = (window.pageYOffset || doc.scrollTop) - (doc.clientTop || 0);
+    const coordinates = {
+        top: windowTop +
+            span.offsetTop +
+            parseInt(computed.borderTopWidth) +
+            parseInt(computed.fontSize) -
+            t.scrollTop -
+            9,
+        left: windowLeft + span.offsetLeft + parseInt(computed.borderLeftWidth) - 1,
+    };
+    document.body.removeChild(div);
+    return coordinates;
+};
+exports.getCoordsFromTextarea = getCoordsFromTextarea;
+const VALID_FILTER = /^[\w\d\s_-]$/;
+const CursorMenu = ({ textarea, onClose, onItemSelect, initialItems, }) => {
+    const itemsById = (0, react_1.useMemo)(() => Object.fromEntries(initialItems.map((item) => [item.id, item])), [initialItems]);
+    const menuRef = (0, react_1.useRef)(null);
+    const [activeIndex, setActiveIndex] = (0, react_1.useState)(0);
+    const [filter, setFilter] = (0, react_1.useState)("");
+    const onPopoverClose = (0, react_1.useCallback)(() => {
+        if (menuRef.current) {
+            const value = menuRef.current.getAttribute("data-filter");
+            const text = `${textarea.value.substring(0, textarea.selectionStart)}${value}${textarea.value.substring(textarea.selectionStart)}`;
+            (0, writes_1.updateBlock)({ uid: (0, dom_1.getUids)(textarea).blockUid, text });
+            setTimeout(() => {
+                textarea.setSelectionRange(textarea.selectionStart + text.length, textarea.selectionEnd + text.length);
+                onClose();
+            }, 1);
+        }
+    }, [onClose, textarea, menuRef]);
+    const items = (0, react_1.useMemo)(() => (filter
+        ? fuzzy_1.default
+            .filter(filter, initialItems, {
+            extract: (s) => s.text,
+            pre: "<b>",
+            post: "</b>",
+        })
+            .map((r) => (Object.assign(Object.assign({}, r.original), { displayName: r.string })))
+        : initialItems.map((r) => (Object.assign(Object.assign({}, r), { displayName: r.text })))).slice(0, 10), [filter, initialItems]);
+    const onSelect = (0, react_1.useCallback)((item) => {
+        if (menuRef.current) {
+            onItemSelect(item);
+            onClose();
+        }
+    }, [menuRef, onClose, textarea, onItemSelect]);
+    const keydownListener = (0, react_1.useCallback)((e) => {
+        var _a;
+        if (menuRef.current &&
+            (e.key === "ArrowRight" || e.key === "ArrowDown")) {
+            const index = Number(menuRef.current.getAttribute("data-active-index"));
+            const count = menuRef.current.childElementCount;
+            setActiveIndex((index + 1) % count);
+        }
+        else if (menuRef.current &&
+            (e.key === "ArrowLeft" || e.key === "ArrowUp")) {
+            const index = Number(menuRef.current.getAttribute("data-active-index"));
+            const count = menuRef.current.childElementCount;
+            setActiveIndex((index - 1 + count) % count);
+        }
+        else if (menuRef.current && e.key === "Enter") {
+            const index = Number(menuRef.current.getAttribute("data-active-index"));
+            const id = ((_a = menuRef.current.children[index]
+                .querySelector(".bp3-menu-item")) === null || _a === void 0 ? void 0 : _a.getAttribute("data-id")) || "";
+            onSelect(itemsById[id]);
+        }
+        else if (menuRef.current && VALID_FILTER.test(e.key)) {
+            const value = menuRef.current.getAttribute("data-filter");
+            setFilter(`${value}${e.key}`);
+        }
+        else if (menuRef.current && e.key === "Backspace") {
+            const value = menuRef.current.getAttribute("data-filter");
+            if (value) {
+                setFilter(value.slice(0, -1));
+            }
+            else {
+                onClose();
+                return;
+            }
+        }
+        else if (e.key !== "Shift") {
+            onPopoverClose();
+            return;
+        }
+        e.stopPropagation();
+        e.preventDefault();
+    }, [menuRef, setActiveIndex, onClose, onPopoverClose]);
+    (0, react_1.useEffect)(() => {
+        textarea.addEventListener("keydown", keydownListener);
+        return () => {
+            textarea.removeEventListener("keydown", keydownListener);
+        };
+    }, [keydownListener]);
+    return (react_1.default.createElement(core_1.Popover, { onClose: onPopoverClose, isOpen: true, canEscapeKeyClose: true, minimal: true, target: react_1.default.createElement("span", null), position: core_1.Position.BOTTOM_LEFT, modifiers: {
+            flip: { enabled: false },
+            preventOverflow: { enabled: false },
+        }, autoFocus: false, content: react_1.default.createElement(core_1.Menu, { ulRef: menuRef, "data-active-index": activeIndex, "data-filter": filter, style: { width: 300 } }, items.length ? (items.map(({ id, displayName }, i) => {
+            return (react_1.default.createElement(core_1.MenuItem, { key: id, "data-id": id, text: displayName
+                    .split(/<b>(.*?)<\/b>/)
+                    .map((part, i) => i % 2 === 1 ? (react_1.default.createElement("b", { key: i }, part)) : (react_1.default.createElement("span", { key: i }, part))), active: i === activeIndex, onMouseEnter: () => setActiveIndex(i), onClick: () => onSelect(itemsById[id]) }));
+        })) : (react_1.default.createElement(core_1.MenuItem, { text: react_1.default.createElement("span", { style: { opacity: 0.75 } },
+                react_1.default.createElement("i", null, "None")), active: false, disabled: true }))) }));
+};
+const render = (props) => {
+    var _a;
+    const parent = document.createElement("span");
+    const coords = (0, exports.getCoordsFromTextarea)(props.textarea);
+    parent.style.position = "absolute";
+    parent.style.left = `${coords.left}px`;
+    parent.style.top = `${coords.top}px`;
+    (_a = props.textarea.parentElement) === null || _a === void 0 ? void 0 : _a.insertBefore(parent, props.textarea);
+    react_dom_1.default.render(react_1.default.createElement(CursorMenu, Object.assign({}, props, { onClose: () => {
+            react_dom_1.default.unmountComponentAtNode(parent);
+            parent.remove();
+        } })), parent);
+};
+exports.render = render;
+exports.default = CursorMenu;
 //# sourceMappingURL=CursorMenu.js.map

package/components/Description.d.ts

@@ -1,5 +1,5 @@
-import React from "react";
-declare const Description: ({ description, }: {
-    description: string;
-}) => React.ReactElement;
-export default Description;
+import React from "react";
+declare const Description: ({ description, }: {
+    description: string;
+}) => React.ReactElement;
+export default Description;

package/components/Description.js

@@ -1,17 +1,17 @@
-"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.__importDefault)(require("react"));
-const Description = ({ description, }) => {
-    return (react_1.default.createElement("span", { style: {
-            marginLeft: 12,
-            display: "inline-block",
-            opacity: 0.8,
-            verticalAlign: "text-bottom",
-        } },
-        react_1.default.createElement(core_1.Tooltip, { content: react_1.default.createElement("span", { style: { maxWidth: 400, display: "inline-block" } }, description) },
-            react_1.default.createElement(core_1.Icon, { icon: "info-sign", iconSize: 12 }))));
-};
-exports.default = Description;
+"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.__importDefault)(require("react"));
+const Description = ({ description, }) => {
+    return (react_1.default.createElement("span", { style: {
+            marginLeft: 12,
+            display: "inline-block",
+            opacity: 0.8,
+            verticalAlign: "text-bottom",
+        } },
+        react_1.default.createElement(core_1.Tooltip, { content: react_1.default.createElement("span", { style: { maxWidth: 400, display: "inline-block" } }, description) },
+            react_1.default.createElement(core_1.Icon, { icon: "info-sign", iconSize: 12 }))));
+};
+exports.default = Description;
 //# sourceMappingURL=Description.js.map

package/components/ExternalLogin.d.ts

@@ -1,18 +1,18 @@
-import React from "react";
-export declare type ExternalLoginOptions = {
-    service: string;
-    getPopoutUrl: (state: string) => Promise<string>;
-    getAuthData: (d: string) => Promise<Record<string, string>>;
-    ServiceIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
-};
-declare const ExternalLogin: ({ onSuccess, useLocal, parentUid, service, getPopoutUrl, getAuthData, ServiceIcon, loggedIn, }: {
-    onSuccess: (block: {
-        text: string;
-        uid: string;
-        data: string;
-    }) => void;
-    parentUid: string;
-    useLocal?: boolean | undefined;
-    loggedIn?: boolean | undefined;
-} & ExternalLoginOptions) => React.ReactElement;
-export default ExternalLogin;
+import React from "react";
+export declare type ExternalLoginOptions = {
+    service: string;
+    getPopoutUrl: (state: string) => Promise<string>;
+    getAuthData: (d: string) => Promise<Record<string, string>>;
+    ServiceIcon: React.FunctionComponent<React.SVGAttributes<SVGElement>>;
+};
+declare const ExternalLogin: ({ onSuccess, useLocal, parentUid, service, getPopoutUrl, getAuthData, ServiceIcon, loggedIn, }: {
+    onSuccess: (block: {
+        text: string;
+        uid: string;
+        data: string;
+    }) => void;
+    parentUid: string;
+    useLocal?: boolean | undefined;
+    loggedIn?: boolean | undefined;
+} & ExternalLoginOptions) => React.ReactElement;
+export default ExternalLogin;