roamjs-components 0.85.3 → 0.85.4

package/components/FormDialog.d.ts

@@ -1,55 +1,55 @@
-import React from "react";
-import type { RoamOverlayProps } from "../util/renderOverlay";
-import { InputTextNode } from "../types";
-declare type Props<T> = {
-    title?: React.ReactNode;
-    content?: React.ReactNode;
-    onSubmit?: (data: T) => Promise<unknown> | unknown;
-    submitButtonText?: string;
-    cancelButtonText?: string;
-    enforceFocus?: boolean;
-    className?: string;
-    style?: React.CSSProperties;
-    fields?: Record<string, ({
-        defaultValue?: string;
-        type: "text";
-    } | {
-        defaultValue?: string;
-        type: "info";
-    } | {
-        defaultValue?: number;
-        type: "number";
-    } | {
-        defaultValue?: string;
-        type: "select";
-        options?: string[];
-    } | {
-        defaultValue?: string;
-        type: "page";
-    } | {
-        defaultValue?: string;
-        type: "block";
-    } | {
-        defaultValue?: string;
-        type: "autocomplete";
-        options?: string[];
-    } | {
-        defaultValue?: boolean;
-        type: "flag";
-    } | {
-        defaultValue?: InputTextNode[];
-        type: "embed";
-    }) & {
-        label?: string;
-        conditional?: string;
-        conditionalValues?: string[];
-    }>;
-};
-declare const FormDialog: <T extends Record<string, unknown>>({ title, content, isOpen, onClose, onSubmit, fields, submitButtonText, cancelButtonText, enforceFocus, className, style, }: RoamOverlayProps<Props<T>>) => JSX.Element;
-export declare const render: (props: Props<Record<string, unknown>>) => (() => void) | undefined;
-export declare const prompt: ({ defaultAnswer, question, title, }: {
-    title: string;
-    question: string;
-    defaultAnswer: string;
-}) => Promise<string>;
-export default FormDialog;
+import React from "react";
+import type { RoamOverlayProps } from "../util/renderOverlay";
+import { InputTextNode } from "../types";
+declare type Props<T> = {
+    title?: React.ReactNode;
+    content?: React.ReactNode;
+    onSubmit?: (data: T) => Promise<unknown> | unknown;
+    submitButtonText?: string;
+    cancelButtonText?: string;
+    enforceFocus?: boolean;
+    className?: string;
+    style?: React.CSSProperties;
+    fields?: Record<string, ({
+        defaultValue?: string;
+        type: "text";
+    } | {
+        defaultValue?: string;
+        type: "info";
+    } | {
+        defaultValue?: number;
+        type: "number";
+    } | {
+        defaultValue?: string;
+        type: "select";
+        options?: string[];
+    } | {
+        defaultValue?: string;
+        type: "page";
+    } | {
+        defaultValue?: string;
+        type: "block";
+    } | {
+        defaultValue?: string;
+        type: "autocomplete";
+        options?: string[];
+    } | {
+        defaultValue?: boolean;
+        type: "flag";
+    } | {
+        defaultValue?: InputTextNode[];
+        type: "embed";
+    }) & {
+        label?: string;
+        conditional?: string;
+        conditionalValues?: string[];
+    }>;
+};
+declare const FormDialog: <T extends Record<string, unknown>>({ title, content, isOpen, onClose, onSubmit, fields, submitButtonText, cancelButtonText, enforceFocus, className, style, }: RoamOverlayProps<Props<T>>) => JSX.Element;
+export declare const render: (props: Props<Record<string, unknown>>) => (() => void) | undefined;
+export declare const prompt: ({ defaultAnswer, question, title, }: {
+    title: string;
+    question: string;
+    defaultAnswer: string;
+}) => Promise<string>;
+export default FormDialog;

package/components/FormDialog.js

@@ -1,224 +1,224 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.prompt = exports.render = void 0;
-const tslib_1 = require("tslib");
-const core_1 = require("@blueprintjs/core");
-const react_1 = tslib_1.__importStar(require("react"));
-const getTextByBlockUid_1 = tslib_1.__importDefault(require("../queries/getTextByBlockUid"));
-const createOverlayRender_1 = tslib_1.__importDefault(require("../util/createOverlayRender"));
-const BlockInput_1 = tslib_1.__importDefault(require("./BlockInput"));
-const MenuItemSelect_1 = tslib_1.__importDefault(require("./MenuItemSelect"));
-const PageInput_1 = tslib_1.__importDefault(require("./PageInput"));
-const nanoid_1 = tslib_1.__importDefault(require("nanoid"));
-const dom_1 = require("../dom");
-const getFullTreeByParentUid_1 = tslib_1.__importDefault(require("../queries/getFullTreeByParentUid"));
-const createPage_1 = tslib_1.__importDefault(require("../writes/createPage"));
-const writes_1 = require("../writes");
-const AutocompleteInput_1 = tslib_1.__importDefault(require("./AutocompleteInput"));
-const EmbedInput = ({ defaultValue, onChange, autoFocus, }) => {
-    const defaultEmbed = (0, react_1.useMemo)(() => defaultValue || [], [defaultValue]);
-    const elRef = (0, react_1.useRef)(null);
-    const parentUid = (0, react_1.useMemo)(window.roamAlphaAPI.util.generateUID, []);
-    const realFocus = (0, react_1.useCallback)(() => {
-        if (!elRef.current)
-            return;
-        if (elRef.current.contains(document.activeElement) &&
-            elRef.current !== document.activeElement)
-            return;
-        const block = elRef.current.querySelector(`div[id*="block-input"],textarea[id*="block-input"]`);
-        if ((block === null || block === void 0 ? void 0 : block.id) === "block-input-ghost")
-            (0, writes_1.createBlock)({ parentUid, node: { text: "" } }).then(() => setTimeout(realFocus, 500));
-        const { windowId, blockUid } = (0, dom_1.getUids)(block);
-        if (blockUid)
-            window.roamAlphaAPI.ui.setBlockFocusAndSelection({
-                location: {
-                    "block-uid": blockUid,
-                    "window-id": windowId,
-                },
-            });
-    }, [elRef]);
-    (0, react_1.useEffect)(() => {
-        const el = elRef.current;
-        if (el) {
-            (0, createPage_1.default)({
-                uid: parentUid,
-                title: (0, nanoid_1.default)(),
-                tree: defaultEmbed,
-            }).then(() => {
-                window.roamAlphaAPI.ui.components.renderPage({
-                    uid: parentUid,
-                    el,
-                    hideMentions: true,
-                });
-                if (autoFocus)
-                    realFocus();
-            });
-            // In the future, we can return the whole tree of data from `parentUid`
-            onChange(() => (0, getFullTreeByParentUid_1.default)(parentUid).children);
-            return () => {
-                window.roamAlphaAPI.deletePage({ page: { uid: parentUid } });
-            };
-        }
-        // eslint-disable-next-line @typescript-eslint/no-empty-function
-        return () => { };
-    }, [
-        elRef,
-        defaultEmbed,
-        autoFocus,
-        realFocus,
-        parentUid,
-        // Triggering infinite rerender
-        // onChange
-    ]);
-    return (react_1.default.createElement(react_1.default.Fragment, null,
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.prompt = exports.render = void 0;
+const tslib_1 = require("tslib");
+const core_1 = require("@blueprintjs/core");
+const react_1 = tslib_1.__importStar(require("react"));
+const getTextByBlockUid_1 = tslib_1.__importDefault(require("../queries/getTextByBlockUid"));
+const createOverlayRender_1 = tslib_1.__importDefault(require("../util/createOverlayRender"));
+const BlockInput_1 = tslib_1.__importDefault(require("./BlockInput"));
+const MenuItemSelect_1 = tslib_1.__importDefault(require("./MenuItemSelect"));
+const PageInput_1 = tslib_1.__importDefault(require("./PageInput"));
+const nanoid_1 = tslib_1.__importDefault(require("nanoid"));
+const dom_1 = require("../dom");
+const getFullTreeByParentUid_1 = tslib_1.__importDefault(require("../queries/getFullTreeByParentUid"));
+const createPage_1 = tslib_1.__importDefault(require("../writes/createPage"));
+const writes_1 = require("../writes");
+const AutocompleteInput_1 = tslib_1.__importDefault(require("./AutocompleteInput"));
+const EmbedInput = ({ defaultValue, onChange, autoFocus, }) => {
+    const defaultEmbed = (0, react_1.useMemo)(() => defaultValue || [], [defaultValue]);
+    const elRef = (0, react_1.useRef)(null);
+    const parentUid = (0, react_1.useMemo)(window.roamAlphaAPI.util.generateUID, []);
+    const realFocus = (0, react_1.useCallback)(() => {
+        if (!elRef.current)
+            return;
+        if (elRef.current.contains(document.activeElement) &&
+            elRef.current !== document.activeElement)
+            return;
+        const block = elRef.current.querySelector(`div[id*="block-input"],textarea[id*="block-input"]`);
+        if ((block === null || block === void 0 ? void 0 : block.id) === "block-input-ghost")
+            (0, writes_1.createBlock)({ parentUid, node: { text: "" } }).then(() => setTimeout(realFocus, 500));
+        const { windowId, blockUid } = (0, dom_1.getUids)(block);
+        if (blockUid)
+            window.roamAlphaAPI.ui.setBlockFocusAndSelection({
+                location: {
+                    "block-uid": blockUid,
+                    "window-id": windowId,
+                },
+            });
+    }, [elRef]);
+    (0, react_1.useEffect)(() => {
+        const el = elRef.current;
+        if (el) {
+            (0, createPage_1.default)({
+                uid: parentUid,
+                title: (0, nanoid_1.default)(),
+                tree: defaultEmbed,
+            }).then(() => {
+                window.roamAlphaAPI.ui.components.renderPage({
+                    uid: parentUid,
+                    el,
+                    "hide-mentions?": true,
+                });
+                if (autoFocus)
+                    realFocus();
+            });
+            // In the future, we can return the whole tree of data from `parentUid`
+            onChange(() => (0, getFullTreeByParentUid_1.default)(parentUid).children);
+            return () => {
+                window.roamAlphaAPI.deletePage({ page: { uid: parentUid } });
+            };
+        }
+        // eslint-disable-next-line @typescript-eslint/no-empty-function
+        return () => { };
+    }, [
+        elRef,
+        defaultEmbed,
+        autoFocus,
+        realFocus,
+        parentUid,
+        // Triggering infinite rerender
+        // onChange
+    ]);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
         react_1.default.createElement("style", null, `div.rm-autocomplete__results {
   z-index: 1000;
 }
 .roamjs-form-embed div div:has(> h1.rm-title-display),
 .roamjs-form-embed .rm-api-render--page > div:has(.rm-reference-main) {
   display: none;
-}`),
-        react_1.default.createElement("div", { ref: elRef, className: "rounded-md bg-white font-normal mt-1 bp3-input h-32 overflow-scroll roamjs-form-embed py-2 px-4", tabIndex: 0, onFocus: realFocus, onKeyDown: (e) => {
-                var _a, _b, _c, _d;
-                if (e.key !== "Tab")
-                    return;
-                const { blockUid } = (0, dom_1.getUids)(e.target);
-                if (!blockUid)
-                    return;
-                const { [":block/order"]: order, [":block/parents"]: parents } = window.roamAlphaAPI.pull("[:block/order {:block/parents [:block/uid]}]", [":block/uid", blockUid]);
-                if (!(order === 0 &&
-                    (parents === null || parents === void 0 ? void 0 : parents.length) === 1 &&
-                    parents[0][":block/uid"] === parentUid))
-                    return;
-                e.stopPropagation();
-                e.preventDefault();
-                const label = (_a = elRef.current) === null || _a === void 0 ? void 0 : _a.parentElement;
-                if (!label)
-                    return;
-                const nextElToFocus = e.shiftKey
-                    ? label.previousElementSibling ||
-                        ((_b = label
-                            .closest(".bp3-dialog")) === null || _b === void 0 ? void 0 : _b.querySelector(".bp3-dialog-footer .bp3-button.roamjs-cancel"))
-                    : label.nextElementSibling ||
-                        ((_c = label
-                            .closest(".bp3-dialog")) === null || _c === void 0 ? void 0 : _c.querySelector(".bp3-dialog-footer .bp3-button.bp3-intent-primary"));
-                if (!nextElToFocus)
-                    return;
-                const focusQuery = "input,button,div.roamjs-form-embed";
-                if (nextElToFocus.matches(focusQuery))
-                    nextElToFocus.focus();
-                else
-                    (_d = nextElToFocus.querySelector(focusQuery)) === null || _d === void 0 ? void 0 : _d.focus();
-            } })));
-};
-const FormDialog = ({ title, content, isOpen, onClose, onSubmit = () => Promise.resolve(), fields = {}, submitButtonText = "Submit", cancelButtonText = "Cancel", enforceFocus, className, style, }) => {
-    const [loading, setLoading] = (0, react_1.useState)(false);
-    const [error, setError] = (0, react_1.useState)("");
-    const [data, setData] = (0, react_1.useState)(() => Object.fromEntries(Object.entries(fields)
-        .filter(([, meta]) => typeof meta.defaultValue !== "undefined")
-        .map(([key, meta]) => [key, meta.defaultValue])));
-    const onClick = (0, react_1.useCallback)(() => Promise.resolve(onSubmit(Object.fromEntries(Object.entries(data)
-        .filter(([key]) => {
-        const { conditional } = fields[key];
-        return !conditional || !!data[conditional];
-    })
-        .map(([key, value]) => [key, typeof value === "function" ? value() : value]))))
-        .then(onClose)
-        .catch((e) => {
-        setError(e.message);
-        setLoading(false);
-    }), [data, onClose, setError, setLoading]);
-    const getFieldAttributes = (name, meta) => {
-        const attributes = {
-            "data-field-name": name,
-            "data-field-type": meta.type,
-        };
-        if (meta.label)
-            attributes["data-field-label"] = meta.label;
-        return attributes;
-    };
-    return (react_1.default.createElement(core_1.Dialog, { isOpen: isOpen, onClose: onClose, title: title, enforceFocus: !title || enforceFocus, autoFocus: !title, className: className, style: style },
-        react_1.default.createElement("div", { className: core_1.Classes.DIALOG_BODY },
-            content,
-            Object.entries(fields).map(([name, meta], index) => {
-                const fieldClassName = `roamjs-form-field`;
-                const setValue = (0, react_1.useCallback)((value) => setData((d) => (Object.assign(Object.assign({}, d), { [name]: value }))), [setData, name]);
-                if (meta.conditional && !data[meta.conditional]) {
-                    return react_1.default.createElement("div", { key: name });
-                }
-                else if (meta.conditional &&
-                    meta.conditionalValues &&
-                    typeof data[meta.conditional] === "string" &&
-                    !meta.conditionalValues.includes(data[meta.conditional])) {
-                    return react_1.default.createElement("div", { key: name });
-                }
-                if (meta.type === "text") {
-                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
-                        meta.label,
-                        react_1.default.createElement(core_1.InputGroup, { value: data[name], onChange: (e) => setValue(e.target.value), autoFocus: index === 0 })));
-                }
-                else if (meta.type === "number") {
-                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
-                        meta.label,
-                        react_1.default.createElement(core_1.NumericInput, { value: data[name], onValueChange: (v) => setValue(v), autoFocus: index === 0 })));
-                }
-                else if (meta.type === "info") {
-                    return (react_1.default.createElement("div", Object.assign({ key: name, className: `${fieldClassName} mb-4` }, getFieldAttributes(name, meta)), meta.label));
-                }
-                else if (meta.type === "flag") {
-                    return (react_1.default.createElement(core_1.Checkbox, Object.assign({ label: meta.label, value: data[name], onChange: (e) => setValue(e.target.checked), key: name, autoFocus: index === 0, className: fieldClassName }, getFieldAttributes(name, meta))));
-                }
-                else if (meta.type === "select") {
-                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
-                        meta.label,
-                        react_1.default.createElement(MenuItemSelect_1.default, { activeItem: data[name], onItemSelect: setValue, items: meta.options || [], ButtonProps: {
-                                autoFocus: index === 0,
-                            } })));
-                }
-                else if (meta.type === "page") {
-                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
-                        meta.label,
-                        react_1.default.createElement(PageInput_1.default, { key: name, value: data[name], setValue: setValue, autoFocus: index === 0 })));
-                }
-                else if (meta.type === "block") {
-                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
-                        meta.label,
-                        react_1.default.createElement(BlockInput_1.default, { value: (0, getTextByBlockUid_1.default)(data[name]) ||
-                                data[name], setValue: (text, uid) => setValue(window.roamAlphaAPI.pull("[:db/id]", [
-                                ":block/uid",
-                                uid || "",
-                            ])
-                                ? uid
-                                : text), autoFocus: index === 0 })));
-                }
-                else if (meta.type === "autocomplete") {
-                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
-                        meta.label,
-                        react_1.default.createElement(AutocompleteInput_1.default, { value: data[name], options: meta.options, setValue: setValue, autoFocus: index === 0 })));
-                }
-                else if (meta.type === "embed") {
-                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
-                        meta.label,
-                        react_1.default.createElement(EmbedInput, { defaultValue: meta.defaultValue, onChange: setValue, autoFocus: index === 0 })));
-                }
-                else {
-                    return react_1.default.createElement("div", { key: name });
-                }
-            })),
-        react_1.default.createElement("div", { className: core_1.Classes.DIALOG_FOOTER },
-            react_1.default.createElement("div", { className: `${core_1.Classes.DIALOG_FOOTER_ACTIONS} items-center flex-row-reverse` },
-                react_1.default.createElement(core_1.Button, { text: submitButtonText, intent: core_1.Intent.PRIMARY, onClick: onClick, disabled: loading, className: "flex-shrink-0" }),
-                react_1.default.createElement(core_1.Button, { text: cancelButtonText, onClick: onClose, disabled: loading, className: "flex-shrink-0 roamjs-cancel" }),
-                react_1.default.createElement("span", { className: "text-red-700 flex-grow" }, error),
-                loading && react_1.default.createElement(core_1.Spinner, { size: core_1.SpinnerSize.SMALL })))));
-};
-exports.render = (0, createOverlayRender_1.default)("form-dialog", FormDialog);
-const prompt = ({ defaultAnswer, question, title, }) => new Promise((resolve) => (0, exports.render)({
-    onSubmit: (data) => resolve(data.value),
-    fields: { value: { type: "text", defaultValue: defaultAnswer } },
-    title,
-    content: (react_1.default.createElement("div", { className: "whitespace-pre-wrap font-semibold text-lg mb-4" }, question)),
-}));
-exports.prompt = prompt;
-exports.default = FormDialog;
+}`),
+        react_1.default.createElement("div", { ref: elRef, className: "rounded-md bg-white font-normal mt-1 bp3-input h-32 overflow-scroll roamjs-form-embed py-2 px-4", tabIndex: 0, onFocus: realFocus, onKeyDown: (e) => {
+                var _a, _b, _c, _d;
+                if (e.key !== "Tab")
+                    return;
+                const { blockUid } = (0, dom_1.getUids)(e.target);
+                if (!blockUid)
+                    return;
+                const { [":block/order"]: order, [":block/parents"]: parents } = window.roamAlphaAPI.pull("[:block/order {:block/parents [:block/uid]}]", [":block/uid", blockUid]);
+                if (!(order === 0 &&
+                    (parents === null || parents === void 0 ? void 0 : parents.length) === 1 &&
+                    parents[0][":block/uid"] === parentUid))
+                    return;
+                e.stopPropagation();
+                e.preventDefault();
+                const label = (_a = elRef.current) === null || _a === void 0 ? void 0 : _a.parentElement;
+                if (!label)
+                    return;
+                const nextElToFocus = e.shiftKey
+                    ? label.previousElementSibling ||
+                        ((_b = label
+                            .closest(".bp3-dialog")) === null || _b === void 0 ? void 0 : _b.querySelector(".bp3-dialog-footer .bp3-button.roamjs-cancel"))
+                    : label.nextElementSibling ||
+                        ((_c = label
+                            .closest(".bp3-dialog")) === null || _c === void 0 ? void 0 : _c.querySelector(".bp3-dialog-footer .bp3-button.bp3-intent-primary"));
+                if (!nextElToFocus)
+                    return;
+                const focusQuery = "input,button,div.roamjs-form-embed";
+                if (nextElToFocus.matches(focusQuery))
+                    nextElToFocus.focus();
+                else
+                    (_d = nextElToFocus.querySelector(focusQuery)) === null || _d === void 0 ? void 0 : _d.focus();
+            } })));
+};
+const FormDialog = ({ title, content, isOpen, onClose, onSubmit = () => Promise.resolve(), fields = {}, submitButtonText = "Submit", cancelButtonText = "Cancel", enforceFocus, className, style, }) => {
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)("");
+    const [data, setData] = (0, react_1.useState)(() => Object.fromEntries(Object.entries(fields)
+        .filter(([, meta]) => typeof meta.defaultValue !== "undefined")
+        .map(([key, meta]) => [key, meta.defaultValue])));
+    const onClick = (0, react_1.useCallback)(() => Promise.resolve(onSubmit(Object.fromEntries(Object.entries(data)
+        .filter(([key]) => {
+        const { conditional } = fields[key];
+        return !conditional || !!data[conditional];
+    })
+        .map(([key, value]) => [key, typeof value === "function" ? value() : value]))))
+        .then(onClose)
+        .catch((e) => {
+        setError(e.message);
+        setLoading(false);
+    }), [data, onClose, setError, setLoading]);
+    const getFieldAttributes = (name, meta) => {
+        const attributes = {
+            "data-field-name": name,
+            "data-field-type": meta.type,
+        };
+        if (meta.label)
+            attributes["data-field-label"] = meta.label;
+        return attributes;
+    };
+    return (react_1.default.createElement(core_1.Dialog, { isOpen: isOpen, onClose: onClose, title: title, enforceFocus: !title || enforceFocus, autoFocus: !title, className: className, style: style },
+        react_1.default.createElement("div", { className: core_1.Classes.DIALOG_BODY },
+            content,
+            Object.entries(fields).map(([name, meta], index) => {
+                const fieldClassName = `roamjs-form-field`;
+                const setValue = (0, react_1.useCallback)((value) => setData((d) => (Object.assign(Object.assign({}, d), { [name]: value }))), [setData, name]);
+                if (meta.conditional && !data[meta.conditional]) {
+                    return react_1.default.createElement("div", { key: name });
+                }
+                else if (meta.conditional &&
+                    meta.conditionalValues &&
+                    typeof data[meta.conditional] === "string" &&
+                    !meta.conditionalValues.includes(data[meta.conditional])) {
+                    return react_1.default.createElement("div", { key: name });
+                }
+                if (meta.type === "text") {
+                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
+                        meta.label,
+                        react_1.default.createElement(core_1.InputGroup, { value: data[name], onChange: (e) => setValue(e.target.value), autoFocus: index === 0 })));
+                }
+                else if (meta.type === "number") {
+                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
+                        meta.label,
+                        react_1.default.createElement(core_1.NumericInput, { value: data[name], onValueChange: (v) => setValue(v), autoFocus: index === 0 })));
+                }
+                else if (meta.type === "info") {
+                    return (react_1.default.createElement("div", Object.assign({ key: name, className: `${fieldClassName} mb-4` }, getFieldAttributes(name, meta)), meta.label));
+                }
+                else if (meta.type === "flag") {
+                    return (react_1.default.createElement(core_1.Checkbox, Object.assign({ label: meta.label, value: data[name], onChange: (e) => setValue(e.target.checked), key: name, autoFocus: index === 0, className: fieldClassName }, getFieldAttributes(name, meta))));
+                }
+                else if (meta.type === "select") {
+                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
+                        meta.label,
+                        react_1.default.createElement(MenuItemSelect_1.default, { activeItem: data[name], onItemSelect: setValue, items: meta.options || [], ButtonProps: {
+                                autoFocus: index === 0,
+                            } })));
+                }
+                else if (meta.type === "page") {
+                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
+                        meta.label,
+                        react_1.default.createElement(PageInput_1.default, { key: name, value: data[name], setValue: setValue, autoFocus: index === 0 })));
+                }
+                else if (meta.type === "block") {
+                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
+                        meta.label,
+                        react_1.default.createElement(BlockInput_1.default, { value: (0, getTextByBlockUid_1.default)(data[name]) ||
+                                data[name], setValue: (text, uid) => setValue(window.roamAlphaAPI.pull("[:db/id]", [
+                                ":block/uid",
+                                uid || "",
+                            ])
+                                ? uid
+                                : text), autoFocus: index === 0 })));
+                }
+                else if (meta.type === "autocomplete") {
+                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
+                        meta.label,
+                        react_1.default.createElement(AutocompleteInput_1.default, { value: data[name], options: meta.options, setValue: setValue, autoFocus: index === 0 })));
+                }
+                else if (meta.type === "embed") {
+                    return (react_1.default.createElement(core_1.Label, Object.assign({ key: name, className: fieldClassName }, getFieldAttributes(name, meta)),
+                        meta.label,
+                        react_1.default.createElement(EmbedInput, { defaultValue: meta.defaultValue, onChange: setValue, autoFocus: index === 0 })));
+                }
+                else {
+                    return react_1.default.createElement("div", { key: name });
+                }
+            })),
+        react_1.default.createElement("div", { className: core_1.Classes.DIALOG_FOOTER },
+            react_1.default.createElement("div", { className: `${core_1.Classes.DIALOG_FOOTER_ACTIONS} items-center flex-row-reverse` },
+                react_1.default.createElement(core_1.Button, { text: submitButtonText, intent: core_1.Intent.PRIMARY, onClick: onClick, disabled: loading, className: "flex-shrink-0" }),
+                react_1.default.createElement(core_1.Button, { text: cancelButtonText, onClick: onClose, disabled: loading, className: "flex-shrink-0 roamjs-cancel" }),
+                react_1.default.createElement("span", { className: "text-red-700 flex-grow" }, error),
+                loading && react_1.default.createElement(core_1.Spinner, { size: core_1.SpinnerSize.SMALL })))));
+};
+exports.render = (0, createOverlayRender_1.default)("form-dialog", FormDialog);
+const prompt = ({ defaultAnswer, question, title, }) => new Promise((resolve) => (0, exports.render)({
+    onSubmit: (data) => resolve(data.value),
+    fields: { value: { type: "text", defaultValue: defaultAnswer } },
+    title,
+    content: (react_1.default.createElement("div", { className: "whitespace-pre-wrap font-semibold text-lg mb-4" }, question)),
+}));
+exports.prompt = prompt;
+exports.default = FormDialog;
 //# sourceMappingURL=FormDialog.js.map