roamjs-components 0.85.2 → 0.85.4

package/components/MenuItemSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItemSelect.js","sourceRoot":"","sources":["../../src/components/MenuItemSelect.tsx"],"names":[],"mappings":";;;AAAA,4CAAkE;AAClE,gDAA0E;AAC1E,0DAA0E;AAkB1E,MAAM,cAAc,GAAG,CACrB,KAA6B,EAChB,EAAE;IACf,MAAM,UAAU,GAAG,eAAM,CAAC,MAAM,EAAK,CAAC;IACtC,MAAM,aAAa,GAAG,CAAC,KAAa,EAAE,IAAO,EAAE,EAAE;QAC/C,MAAM,IAAI,GAAG,KAAK,CAAC,aAAa,CAAC,CAAC,CAAC,KAAK,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC;QACpE,OAAO,MAAM,CAAC,IAAI,CAAC,CAAC,WAAW,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC;IAClE,CAAC,CAAC;IACF,MAAM,EACJ,UAAU,EACV,UAAU,GAAG,KAAK,EAClB,QAAQ,EACR,aAAa,EACb,cAAc,KAEZ,KAAK,EADJ,WAAW,kBACZ,KAAK,EAPH,2EAOL,CAAQ,CAAC;IAEV,MAAM,aAAa,GAAG,CACpB,8BAAC,aAAM,kBACL,IAAI,EACF,UAAU,CAAC,CAAC,CAAC,CACX,aAAa,CAAC,CAAC,CAAC,CACd,aAAa,CAAC,UAAe,CAAC,CAC/B,CAAC,CAAC,CAAC,CACF,UAAU,CACX,CACF,CAAC,CAAC,CAAC,CACF,wCAAM,SAAS,EAAC,mBAAmB,IAChC,cAAc,IAAI,WAAW,CACzB,CACR,EAEH,SAAS,EAAC,uBAAuB,IAC7B,KAAK,CAAC,WAAW,EACrB,CACH,CAAC;IAEF,OAAO,CACL,8BAAC,UAAU,oBACL,WAAW,IACf,YAAY,EAAE,CAAC,IAAI,EAAE,EAAE,SAAS,EAAE,WAAW,EAAE,EAAE,EAAE,CAAC,CAClD,8BAAC,eAAQ,IACP,GAAG,EAAE,IAAI,EACT,IAAI,EAAE,aAAa,CAAC,CAAC,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,EAChD,MAAM,EAAE,SAAS,CAAC,MAAM,EACxB,OAAO,EAAE,WAAW,GACpB,CACH,EACD,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,UAAU,CAAC,CAAC,CAAC,aAAa,CAAC,CAAC,CAAC,SAAS,EACrD,YAAY,kBACV,OAAO,EAAE,IAAI,EACb,cAAc,EAAE,IAAI,IACjB,KAAK,CAAC,YAAY,MAGtB,QAAQ;QACP,CAAC,CAAC,QAAQ,CAAC;YACP,UAAU;YACV,cAAc;YACd,aAAa;SACd,CAAC;QACJ,CAAC,CAAC,aAAa,CACN,CACd,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,cAAc,CAAC","sourcesContent":["import { Button, ButtonProps, MenuItem } from \"@blueprintjs/core\";\nimport { SelectProps, Select, ICreateNewItem } from \"@blueprintjs/select\";\nimport React, { ReactText, ButtonHTMLAttributes, ReactNode } from \"react\";\n\ntype ActiveItem<T> = T | ICreateNewItem | null | undefined;\ntype TransformItem<T> = (s: T) => ReactNode;\ntype MenuItemSelectProps<T extends ReactText> = Omit<\n  SelectProps<T>,\n  \"itemRenderer\"\n> & {\n  ButtonProps?: ButtonProps & ButtonHTMLAttributes<HTMLButtonElement>;\n  emptyValueText?: string;\n  transformItem?: TransformItem<T>;\n  children?: (props: {\n    activeItem: ActiveItem<T>;\n    emptyValueText?: string;\n    transformItem?: TransformItem<T>;\n  }) => ReactNode;\n};\n\nconst MenuItemSelect = <T extends ReactText>(\n  props: MenuItemSelectProps<T>\n): JSX.Element => {\n  const TypeSelect = Select.ofType<T>();\n  const itemPredicate = (query: string, item: T) => {\n    const text = props.transformItem ? props.transformItem(item) : item;\n    return String(text).toLowerCase().includes(query.toLowerCase());\n  };\n  const {\n    activeItem,\n    filterable = false,\n    children,\n    transformItem,\n    emptyValueText,\n    ...selectProps\n  } = props;\n\n  const defaultButton = (\n    <Button\n      text={\n        activeItem ? (\n          transformItem ? (\n            transformItem(activeItem as T)\n          ) : (\n            activeItem\n          )\n        ) : (\n          <span className=\"opacity-50 italic\">\n            {emptyValueText || \"Choose...\"}\n          </span>\n        )\n      }\n      rightIcon=\"double-caret-vertical\"\n      {...props.ButtonProps}\n    />\n  );\n\n  return (\n    <TypeSelect\n      {...selectProps}\n      itemRenderer={(item, { modifiers, handleClick }) => (\n        <MenuItem\n          key={item}\n          text={transformItem ? transformItem(item) : item}\n          active={modifiers.active}\n          onClick={handleClick}\n        />\n      )}\n      filterable={filterable}\n      itemPredicate={filterable ? itemPredicate : undefined}\n      popoverProps={{\n        minimal: true,\n        captureDismiss: true,\n        ...props.popoverProps,\n      }}\n    >\n      {children\n        ? children({\n            activeItem,\n            emptyValueText,\n            transformItem,\n          })\n        : defaultButton}\n    </TypeSelect>\n  );\n};\n\nexport default MenuItemSelect;\n"]}

package/components/OauthPanel.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+import { ExternalLoginOptions } from "./ExternalLogin";
+declare const OauthPanel: {
+    (options: ExternalLoginOptions): JSX.Element;
+    type: string;
+};
+export default OauthPanel;

package/components/OauthPanel.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const core_1 = require("@blueprintjs/core");
+const react_1 = tslib_1.__importStar(require("react"));
+const localStorageGet_1 = tslib_1.__importDefault(require("../util/localStorageGet"));
+const localStorageSet_1 = require("../util/localStorageSet");
+const ExternalLogin_1 = tslib_1.__importDefault(require("./ExternalLogin"));
+const OauthPanel = (options) => {
+    const key = `oauth-${options.service}`;
+    const [accounts, setAccounts] = (0, react_1.useState)(() => JSON.parse((0, localStorageGet_1.default)(key) || "[]"));
+    return (react_1.default.createElement("div", { className: "flex flex-col gap-1", style: { minWidth: 300 } },
+        react_1.default.createElement(ExternalLogin_1.default, Object.assign({ useLocal: true, onSuccess: (acc) => setAccounts([...accounts, acc]), parentUid: "", loggedIn: !!accounts.length }, options)),
+        !!accounts.length && (react_1.default.createElement(react_1.default.Fragment, null,
+            react_1.default.createElement("h5", { className: "margin-0" }, "Accounts"),
+            react_1.default.createElement("ul", { className: "margin-0" }, accounts.map((act) => (react_1.default.createElement("li", { key: act.uid, style: {
+                    display: "flex",
+                    justifyContent: "space-between",
+                    alignItems: "center",
+                    marginTop: 8,
+                } },
+                react_1.default.createElement("span", { style: { minWidth: 192 } }, act.text),
+                react_1.default.createElement(core_1.Button, { text: "Log Out", onClick: () => {
+                        const accts = JSON.parse((0, localStorageGet_1.default)(key));
+                        (0, localStorageSet_1.localStorageSet)(key, JSON.stringify(accts.filter((a) => act.uid !== a.uid)));
+                        setAccounts(accounts.filter((a) => act.uid !== a.uid));
+                    } })))))))));
+};
+OauthPanel.type = "oauth";
+exports.default = OauthPanel;
+//# sourceMappingURL=OauthPanel.js.map

package/components/OauthPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OauthPanel.js","sourceRoot":"","sources":["../../src/components/OauthPanel.tsx"],"names":[],"mappings":";;;AAAA,4CAA2C;AAC3C,uDAAwC;AACxC,sFAAsD;AACtD,6DAA0D;AAC1D,4EAAsE;AAEtE,MAAM,UAAU,GAAG,CAAC,OAA6B,EAAE,EAAE;IACnD,MAAM,GAAG,GAAG,SAAS,OAAO,CAAC,OAAO,EAAE,CAAC;IACvC,MAAM,CAAC,QAAQ,EAAE,WAAW,CAAC,GAAG,IAAA,gBAAQ,EAEtC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAE,IAAA,yBAAe,EAAC,GAAG,CAAY,IAAI,IAAI,CAAC,CAAC,CAAC;IAC9D,OAAO,CACL,uCAAK,SAAS,EAAC,qBAAqB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE;QAC3D,8BAAC,uBAAa,kBACZ,QAAQ,QACR,SAAS,EAAE,CAAC,GAAG,EAAE,EAAE,CAAC,WAAW,CAAC,CAAC,GAAG,QAAQ,EAAE,GAAG,CAAC,CAAC,EACnD,SAAS,EAAE,EAAE,EACb,QAAQ,EAAE,CAAC,CAAC,QAAQ,CAAC,MAAM,IACvB,OAAO,EACX;QACD,CAAC,CAAC,QAAQ,CAAC,MAAM,IAAI,CACpB;YACE,sCAAI,SAAS,EAAC,UAAU,eAAc;YACtC,sCAAI,SAAS,EAAC,UAAU,IACrB,QAAQ,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC,CACrB,sCACE,GAAG,EAAE,GAAG,CAAC,GAAG,EACZ,KAAK,EAAE;oBACL,OAAO,EAAE,MAAM;oBACf,cAAc,EAAE,eAAe;oBAC/B,UAAU,EAAE,QAAQ;oBACpB,SAAS,EAAE,CAAC;iBACb;gBAED,wCAAM,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,IAAG,GAAG,CAAC,IAAI,CAAQ;gBACjD,8BAAC,aAAM,IACL,IAAI,EAAE,SAAS,EACf,OAAO,EAAE,GAAG,EAAE;wBACZ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CACtB,IAAA,yBAAe,EAAC,GAAG,CAAW,CAG7B,CAAC;wBACJ,IAAA,iCAAe,EACb,GAAG,EACH,IAAI,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CACvD,CAAC;wBACF,WAAW,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;oBACzD,CAAC,GACD,CACC,CACN,CAAC,CACC,CACJ,CACJ,CACG,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,UAAU,CAAC,IAAI,GAAG,OAAO,CAAC;AAE1B,kBAAe,UAAU,CAAC","sourcesContent":["import { Button } from \"@blueprintjs/core\";\nimport React, { useState } from \"react\";\nimport localStorageGet from \"../util/localStorageGet\";\nimport { localStorageSet } from \"../util/localStorageSet\";\nimport ExternalLogin, { ExternalLoginOptions } from \"./ExternalLogin\";\n\nconst OauthPanel = (options: ExternalLoginOptions) => {\n  const key = `oauth-${options.service}`;\n  const [accounts, setAccounts] = useState<\n    { text: string; uid: string; data: string }[]\n  >(() => JSON.parse((localStorageGet(key) as string) || \"[]\"));\n  return (\n    <div className=\"flex flex-col gap-1\" style={{ minWidth: 300 }}>\n      <ExternalLogin\n        useLocal\n        onSuccess={(acc) => setAccounts([...accounts, acc])}\n        parentUid={\"\"}\n        loggedIn={!!accounts.length}\n        {...options}\n      />\n      {!!accounts.length && (\n        <>\n          <h5 className=\"margin-0\">Accounts</h5>\n          <ul className=\"margin-0\">\n            {accounts.map((act) => (\n              <li\n                key={act.uid}\n                style={{\n                  display: \"flex\",\n                  justifyContent: \"space-between\",\n                  alignItems: \"center\",\n                  marginTop: 8,\n                }}\n              >\n                <span style={{ minWidth: 192 }}>{act.text}</span>\n                <Button\n                  text={\"Log Out\"}\n                  onClick={() => {\n                    const accts = JSON.parse(\n                      localStorageGet(key) as string\n                    ) as {\n                      uid: string;\n                    }[];\n                    localStorageSet(\n                      key,\n                      JSON.stringify(accts.filter((a) => act.uid !== a.uid))\n                    );\n                    setAccounts(accounts.filter((a) => act.uid !== a.uid));\n                  }}\n                />\n              </li>\n            ))}\n          </ul>\n        </>\n      )}\n    </div>\n  );\n};\n\nOauthPanel.type = \"oauth\";\n\nexport default OauthPanel;\n"]}

package/components/OauthSelect.d.ts

@@ -0,0 +1,5 @@
+import React from "react";
+export declare const useOauthAccounts: (id: string) => {
+    accountDropdown: React.ReactElement;
+    accountLabel: string;
+};

package/components/OauthSelect.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useOauthAccounts = void 0;
+const tslib_1 = require("tslib");
+const core_1 = require("@blueprintjs/core");
+const react_1 = tslib_1.__importStar(require("react"));
+const getPageUidByPageTitle_1 = tslib_1.__importDefault(require("../queries/getPageUidByPageTitle"));
+const getBasicTreeByParentUid_1 = tslib_1.__importDefault(require("../queries/getBasicTreeByParentUid"));
+const toFlexRegex_1 = tslib_1.__importDefault(require("../util/toFlexRegex"));
+const MenuItemSelect_1 = tslib_1.__importDefault(require("./MenuItemSelect"));
+const useOauthAccounts = (id) => {
+    var _a;
+    const accountLabels = (((_a = (0, getBasicTreeByParentUid_1.default)((0, getPageUidByPageTitle_1.default)(`roam/js/${id}`)).find((t) => (0, toFlexRegex_1.default)("oauth").test(t.text))) === null || _a === void 0 ? void 0 : _a.children) || [])
+        .map((t) => t.text)
+        .filter((t) => !t.startsWith("{") && !t.endsWith("}"));
+    const [accountLabel, setAccountLabel] = (0, react_1.useState)(accountLabels[0] || "");
+    const accountDropdown = (react_1.default.createElement(react_1.default.Fragment, null, accountLabels.length > 1 && (react_1.default.createElement(core_1.Label, null,
+        "Account:",
+        react_1.default.createElement(MenuItemSelect_1.default, { activeItem: accountLabel, onItemSelect: (i) => setAccountLabel(i), items: accountLabels })))));
+    return {
+        accountDropdown,
+        accountLabel,
+    };
+};
+exports.useOauthAccounts = useOauthAccounts;
+//# sourceMappingURL=OauthSelect.js.map

package/components/OauthSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OauthSelect.js","sourceRoot":"","sources":["../../src/components/OauthSelect.tsx"],"names":[],"mappings":";;;;AAAA,4CAA0C;AAC1C,uDAAwC;AACxC,qGAAqE;AACrE,yGAAyE;AACzE,8EAA8C;AAC9C,8EAA8C;AAEvC,MAAM,gBAAgB,GAAG,CAC9B,EAAU,EAIV,EAAE;;IACF,MAAM,aAAa,GAAG,CACpB,CAAA,MAAA,IAAA,iCAAuB,EAAC,IAAA,+BAAqB,EAAC,WAAW,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CACzE,IAAA,qBAAW,EAAC,OAAO,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,CAAC,CAClC,0CAAE,QAAQ,KAAI,EAAE,CAClB;SACE,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC;SAClB,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;IACzD,MAAM,CAAC,YAAY,EAAE,eAAe,CAAC,GAAG,IAAA,gBAAQ,EAAC,aAAa,CAAC,CAAC,CAAC,IAAI,EAAE,CAAC,CAAC;IACzE,MAAM,eAAe,GAAG,CACtB,8DACG,aAAa,CAAC,MAAM,GAAG,CAAC,IAAI,CAC3B,8BAAC,YAAK;;QAEJ,8BAAC,wBAAc,IACb,UAAU,EAAE,YAAY,EACxB,YAAY,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,eAAe,CAAC,CAAC,CAAC,EACvC,KAAK,EAAE,aAAa,GACpB,CACI,CACT,CACA,CACJ,CAAC;IACF,OAAO;QACL,eAAe;QACf,YAAY;KACb,CAAC;AACJ,CAAC,CAAC;AAhCW,QAAA,gBAAgB,oBAgC3B","sourcesContent":["import { Label } from \"@blueprintjs/core\";\nimport React, { useState } from \"react\";\nimport getPageUidByPageTitle from \"../queries/getPageUidByPageTitle\";\nimport getBasicTreeByParentUid from \"../queries/getBasicTreeByParentUid\";\nimport toFlexRegex from \"../util/toFlexRegex\";\nimport MenuItemSelect from \"./MenuItemSelect\";\n\nexport const useOauthAccounts = (\n  id: string\n): {\n  accountDropdown: React.ReactElement;\n  accountLabel: string;\n} => {\n  const accountLabels = (\n    getBasicTreeByParentUid(getPageUidByPageTitle(`roam/js/${id}`)).find((t) =>\n      toFlexRegex(\"oauth\").test(t.text)\n    )?.children || []\n  )\n    .map((t) => t.text)\n    .filter((t) => !t.startsWith(\"{\") && !t.endsWith(\"}\"));\n  const [accountLabel, setAccountLabel] = useState(accountLabels[0] || \"\");\n  const accountDropdown = (\n    <>\n      {accountLabels.length > 1 && (\n        <Label>\n          Account:\n          <MenuItemSelect\n            activeItem={accountLabel}\n            onItemSelect={(i) => setAccountLabel(i)}\n            items={accountLabels}\n          />\n        </Label>\n      )}\n    </>\n  );\n  return {\n    accountDropdown,\n    accountLabel,\n  };\n};\n"]}

package/components/PageInput.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+import { AutocompleteInputProps } from "./AutocompleteInput";
+declare const PageInput: ({ extra, ...rest }: {
+    extra?: string[] | undefined;
+} & Omit<AutocompleteInputProps<string>, "options">) => React.ReactElement;
+export default PageInput;

package/components/PageInput.js

@@ -0,0 +1,14 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const getAllPageNames_1 = tslib_1.__importDefault(require("../queries/getAllPageNames"));
+const AutocompleteInput_1 = tslib_1.__importDefault(require("./AutocompleteInput"));
+const DEFAULT_EXTRA = [];
+const PageInput = (_a) => {
+    var { extra = DEFAULT_EXTRA } = _a, rest = tslib_1.__rest(_a, ["extra"]);
+    const options = (0, react_1.useMemo)(() => [...(0, getAllPageNames_1.default)(), ...extra], [extra]);
+    return react_1.default.createElement(AutocompleteInput_1.default, Object.assign({}, rest, { options: options }));
+};
+exports.default = PageInput;
+//# sourceMappingURL=PageInput.js.map

package/components/PageInput.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageInput.js","sourceRoot":"","sources":["../../src/components/PageInput.tsx"],"names":[],"mappings":";;;AAAA,uDAAuC;AACvC,yFAAyD;AACzD,oFAAgF;AAEhF,MAAM,aAAa,GAAa,EAAE,CAAC;AAEnC,MAAM,SAAS,GAAG,CAAC,EAKwB,EAAsB,EAAE;QALhD,EACjB,KAAK,GAAG,aAAa,OAIoB,EAHtC,IAAI,sBAFU,SAGlB,CADQ;IAIP,MAAM,OAAO,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,CAAC,GAAG,IAAA,yBAAe,GAAE,EAAE,GAAG,KAAK,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IACzE,OAAO,8BAAC,2BAAiB,oBAAK,IAAI,IAAE,OAAO,EAAE,OAAO,IAAI,CAAC;AAC3D,CAAC,CAAC;AAEF,kBAAe,SAAS,CAAC","sourcesContent":["import React, { useMemo } from \"react\";\nimport getAllPageNames from \"../queries/getAllPageNames\";\nimport AutocompleteInput, { AutocompleteInputProps } from \"./AutocompleteInput\";\n\nconst DEFAULT_EXTRA: string[] = [];\n\nconst PageInput = ({\n  extra = DEFAULT_EXTRA,\n  ...rest\n}: {\n  extra?: string[];\n} & Omit<AutocompleteInputProps, \"options\">): React.ReactElement => {\n  const options = useMemo(() => [...getAllPageNames(), ...extra], [extra]);\n  return <AutocompleteInput {...rest} options={options} />;\n};\n\nexport default PageInput;\n"]}

package/components/PageLink.d.ts

@@ -0,0 +1,6 @@
+import React from "react";
+declare const PageLink: ({ uid, onCtrlClick, children, }: React.PropsWithChildren<{
+    uid: string;
+    onCtrlClick?: ((e: React.MouseEvent) => void) | undefined;
+}>) => JSX.Element;
+export default PageLink;

package/components/PageLink.js

@@ -0,0 +1,32 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const getRoamUrl_1 = tslib_1.__importDefault(require("../dom/getRoamUrl"));
+const getPageTitleByPageUid_1 = tslib_1.__importDefault(require("../queries/getPageTitleByPageUid"));
+const openBlockInSidebar_1 = tslib_1.__importDefault(require("../writes/openBlockInSidebar"));
+const PageLink = ({ uid, onCtrlClick, children, }) => {
+    const title = (0, react_1.useMemo)(() => children || (0, getPageTitleByPageUid_1.default)(uid), [children, uid]);
+    return (react_1.default.createElement("a", { className: "rm-page-ref", "data-link-title": title, href: (0, getRoamUrl_1.default)(uid), onMouseDown: (e) => {
+            if (e.shiftKey) {
+                (0, openBlockInSidebar_1.default)(uid);
+                e.preventDefault();
+                e.stopPropagation();
+            }
+            else if (e.ctrlKey) {
+                onCtrlClick === null || onCtrlClick === void 0 ? void 0 : onCtrlClick(e);
+            }
+        }, onClick: (e) => {
+            if (e.shiftKey || e.ctrlKey) {
+                e.preventDefault();
+                e.stopPropagation();
+            }
+        }, onContextMenu: (e) => {
+            if (e.ctrlKey) {
+                e.preventDefault();
+                e.stopPropagation();
+            }
+        } }, title));
+};
+exports.default = PageLink;
+//# sourceMappingURL=PageLink.js.map

package/components/PageLink.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"PageLink.js","sourceRoot":"","sources":["../../src/components/PageLink.tsx"],"names":[],"mappings":";;;AAAA,uDAAuC;AACvC,2EAA2C;AAC3C,qGAAqE;AACrE,8FAA8D;AAE9D,MAAM,QAAQ,GAAG,CAAC,EAChB,GAAG,EACH,WAAW,EACX,QAAQ,GAIR,EAAE,EAAE;IACJ,MAAM,KAAK,GAAG,IAAA,eAAO,EACnB,GAAG,EAAE,CAAC,QAAQ,IAAI,IAAA,+BAAqB,EAAC,GAAG,CAAC,EAC5C,CAAC,QAAQ,EAAE,GAAG,CAAC,CAChB,CAAC;IACF,OAAO,CACL,qCACE,SAAS,EAAE,aAAa,qBACP,KAAK,EACtB,IAAI,EAAE,IAAA,oBAAU,EAAC,GAAG,CAAC,EACrB,WAAW,EAAE,CAAC,CAAC,EAAE,EAAE;YACjB,IAAI,CAAC,CAAC,QAAQ,EAAE;gBACd,IAAA,4BAAkB,EAAC,GAAG,CAAC,CAAC;gBACxB,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;aACrB;iBAAM,IAAI,CAAC,CAAC,OAAO,EAAE;gBACpB,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAG,CAAC,CAAC,CAAC;aAClB;QACH,CAAC,EACD,OAAO,EAAE,CAAC,CAAC,EAAE,EAAE;YACb,IAAI,CAAC,CAAC,QAAQ,IAAI,CAAC,CAAC,OAAO,EAAE;gBAC3B,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;aACrB;QACH,CAAC,EACD,aAAa,EAAE,CAAC,CAAC,EAAE,EAAE;YACnB,IAAI,CAAC,CAAC,OAAO,EAAE;gBACb,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;aACrB;QACH,CAAC,IAEA,KAAK,CACJ,CACL,CAAC;AACJ,CAAC,CAAC;AAEF,kBAAe,QAAQ,CAAC","sourcesContent":["import React, { useMemo } from \"react\";\nimport getRoamUrl from \"../dom/getRoamUrl\";\nimport getPageTitleByPageUid from \"../queries/getPageTitleByPageUid\";\nimport openBlockInSidebar from \"../writes/openBlockInSidebar\";\n\nconst PageLink = ({\n  uid,\n  onCtrlClick,\n  children,\n}: React.PropsWithChildren<{\n  uid: string;\n  onCtrlClick?: (e: React.MouseEvent) => void;\n}>) => {\n  const title = useMemo(\n    () => children || getPageTitleByPageUid(uid),\n    [children, uid]\n  );\n  return (\n    <a\n      className={\"rm-page-ref\"}\n      data-link-title={title}\n      href={getRoamUrl(uid)}\n      onMouseDown={(e) => {\n        if (e.shiftKey) {\n          openBlockInSidebar(uid);\n          e.preventDefault();\n          e.stopPropagation();\n        } else if (e.ctrlKey) {\n          onCtrlClick?.(e);\n        }\n      }}\n      onClick={(e) => {\n        if (e.shiftKey || e.ctrlKey) {\n          e.preventDefault();\n          e.stopPropagation();\n        }\n      }}\n      onContextMenu={(e) => {\n        if (e.ctrlKey) {\n          e.preventDefault();\n          e.stopPropagation();\n        }\n      }}\n    >\n      {title}\n    </a>\n  );\n};\n\nexport default PageLink;\n"]}

package/components/ProgressDialog.d.ts

@@ -0,0 +1,11 @@
+/// <reference types="react" />
+declare type Props = {
+    id: string;
+    timeout: number;
+};
+export declare const ID = "roamjs-progress-dialog-root";
+declare const ProgressDialog: ({ onClose, ...props }: {
+    onClose: () => void;
+} & Props) => JSX.Element;
+export declare const render: (props: Props) => (() => void) | undefined;
+export default ProgressDialog;

package/components/ProgressDialog.js

@@ -0,0 +1,61 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.render = exports.ID = void 0;
+const tslib_1 = require("tslib");
+const core_1 = require("@blueprintjs/core");
+const react_1 = tslib_1.__importStar(require("react"));
+const createOverlayRender_1 = tslib_1.__importDefault(require("../util/createOverlayRender"));
+exports.ID = "roamjs-progress-dialog-root";
+const ProgressDialog = (_a) => {
+    var { onClose } = _a, props = tslib_1.__rest(_a, ["onClose"]);
+    const [maxTimeout, setMaxtimeout] = (0, react_1.useState)(props.timeout);
+    const [now, setNow] = (0, react_1.useState)(new Date());
+    const onId = (0, react_1.useCallback)((props) => {
+        window.roamjs.actions[props.id] = props.timeout;
+        setMaxtimeout(props.timeout);
+    }, [setMaxtimeout]);
+    (0, react_1.useEffect)(() => {
+        const element = document.getElementById(exports.ID);
+        if (element) {
+            element.addEventListener("log", ((e) => {
+                onId(e.detail);
+            }));
+            onId(props);
+        }
+        const interval = setInterval(() => setNow(new Date()), 1000);
+        return () => clearInterval(interval);
+    }, [onId, setTimeout, props]);
+    const numActions = Object.keys(window.roamjs.actions).length;
+    (0, react_1.useEffect)(() => {
+        if (numActions === 0)
+            onClose();
+    }, [numActions]);
+    return (react_1.default.createElement(react_1.default.Fragment, null,
+        react_1.default.createElement("style", null, `.roamjs-progress-dialog {
+  right: 8px;
+  margin: 0;
+  position: absolute;
+  bottom: 8px;
+}
+.roamjs-progress-dialog-portal .bp3-dialog-container,
+.roamjs-progress-dialog-portal .bp3-overlay {
+  pointer-events: none;
+}
+.roamjs-progress-dialog-portal .bp3-overlay-backdrop {
+  display: none;
+}`),
+        react_1.default.createElement(core_1.Dialog, { isOpen: true, onClose: onClose, portalClassName: "roamjs-progress-dialog-portal", className: "roamjs-progress-dialog", canOutsideClickClose: false, canEscapeKeyClose: false, hasBackdrop: false, enforceFocus: false },
+            react_1.default.createElement("div", { style: { padding: 16 } },
+                react_1.default.createElement("h4", null, "Performing Writes to Roam..."),
+                react_1.default.createElement("p", null,
+                    "Still have ",
+                    react_1.default.createElement("b", null, Object.keys(window.roamjs.actions).length),
+                    " ",
+                    "actions to write. Expected to finish the last one in",
+                    " ",
+                    Math.ceil((maxTimeout - now.valueOf()) / 1000),
+                    " seconds...")))));
+};
+exports.render = (0, createOverlayRender_1.default)("progress-dialog", ProgressDialog);
+exports.default = ProgressDialog;
+//# sourceMappingURL=ProgressDialog.js.map

package/components/ProgressDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ProgressDialog.js","sourceRoot":"","sources":["../../src/components/ProgressDialog.tsx"],"names":[],"mappings":";;;;AAAA,4CAA2C;AAC3C,uDAAgE;AAChE,8FAA8D;AAOjD,QAAA,EAAE,GAAG,6BAA6B,CAAC;AAEhD,MAAM,cAAc,GAAG,CAAC,EAKf,EAAE,EAAE;QALW,EACtB,OAAO,OAIA,EAHJ,KAAK,sBAFc,WAGvB,CADS;IAIR,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC5D,MAAM,CAAC,GAAG,EAAE,MAAM,CAAC,GAAG,IAAA,gBAAQ,EAAC,IAAI,IAAI,EAAE,CAAC,CAAC;IAC3C,MAAM,IAAI,GAAG,IAAA,mBAAW,EACtB,CAAC,KAAY,EAAE,EAAE;QACf,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,GAAG,KAAK,CAAC,OAAO,CAAC;QAChD,aAAa,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAC/B,CAAC,EACD,CAAC,aAAa,CAAC,CAChB,CAAC;IACF,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,OAAO,GAAG,QAAQ,CAAC,cAAc,CAAC,UAAE,CAAC,CAAC;QAC5C,IAAI,OAAO,EAAE;YACX,OAAO,CAAC,gBAAgB,CAAC,KAAK,EAAE,CAAC,CAAC,CAAc,EAAE,EAAE;gBAClD,IAAI,CAAC,CAAC,CAAC,MAAe,CAAC,CAAC;YAC1B,CAAC,CAAkB,CAAC,CAAC;YACrB,IAAI,CAAC,KAAK,CAAC,CAAC;SACb;QACD,MAAM,QAAQ,GAAG,WAAW,CAAC,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,IAAI,EAAE,CAAC,EAAE,IAAI,CAAC,CAAC;QAC7D,OAAO,GAAG,EAAE,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IACvC,CAAC,EAAE,CAAC,IAAI,EAAE,UAAU,EAAE,KAAK,CAAC,CAAC,CAAC;IAC9B,MAAM,UAAU,GAAG,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,MAAM,CAAC;IAC7D,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,UAAU,KAAK,CAAC;YAAE,OAAO,EAAE,CAAC;IAClC,CAAC,EAAE,CAAC,UAAU,CAAC,CAAC,CAAC;IACjB,OAAO,CACL;QACE,6CAAQ;;;;;;;;;;;;EAYZ,CAAS;QACL,8BAAC,aAAM,IACL,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,OAAO,EAChB,eAAe,EAAE,+BAA+B,EAChD,SAAS,EAAE,wBAAwB,EACnC,oBAAoB,EAAE,KAAK,EAC3B,iBAAiB,EAAE,KAAK,EACxB,WAAW,EAAE,KAAK,EAClB,YAAY,EAAE,KAAK;YAEnB,uCAAK,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE;gBACzB,yEAAqC;gBACrC;;oBACa,yCAAI,MAAM,CAAC,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,MAAM,CAAK;oBAAC,GAAG;;oBACZ,GAAG;oBACvD,IAAI,CAAC,IAAI,CAAC,CAAC,UAAU,GAAG,GAAG,CAAC,OAAO,EAAE,CAAC,GAAG,IAAI,CAAC;kCAC7C,CACA,CACC,CACR,CACJ,CAAC;AACJ,CAAC,CAAC;AAEW,QAAA,MAAM,GAAG,IAAA,6BAAmB,EACvC,iBAAiB,EACjB,cAAc,CACf,CAAC;AAEF,kBAAe,cAAc,CAAC","sourcesContent":["import { Dialog } from \"@blueprintjs/core\";\nimport React, { useState, useEffect, useCallback } from \"react\";\nimport createOverlayRender from \"../util/createOverlayRender\";\n\ntype Props = {\n  id: string;\n  timeout: number;\n};\n\nexport const ID = \"roamjs-progress-dialog-root\";\n\nconst ProgressDialog = ({\n  onClose,\n  ...props\n}: {\n  onClose: () => void;\n} & Props) => {\n  const [maxTimeout, setMaxtimeout] = useState(props.timeout);\n  const [now, setNow] = useState(new Date());\n  const onId = useCallback(\n    (props: Props) => {\n      window.roamjs.actions[props.id] = props.timeout;\n      setMaxtimeout(props.timeout);\n    },\n    [setMaxtimeout]\n  );\n  useEffect(() => {\n    const element = document.getElementById(ID);\n    if (element) {\n      element.addEventListener(\"log\", ((e: CustomEvent) => {\n        onId(e.detail as Props);\n      }) as EventListener);\n      onId(props);\n    }\n    const interval = setInterval(() => setNow(new Date()), 1000);\n    return () => clearInterval(interval);\n  }, [onId, setTimeout, props]);\n  const numActions = Object.keys(window.roamjs.actions).length;\n  useEffect(() => {\n    if (numActions === 0) onClose();\n  }, [numActions]);\n  return (\n    <>\n      <style>{`.roamjs-progress-dialog {\n  right: 8px;\n  margin: 0;\n  position: absolute;\n  bottom: 8px;\n}\n.roamjs-progress-dialog-portal .bp3-dialog-container,\n.roamjs-progress-dialog-portal .bp3-overlay {\n  pointer-events: none;\n}\n.roamjs-progress-dialog-portal .bp3-overlay-backdrop {\n  display: none;\n}`}</style>\n      <Dialog\n        isOpen={true}\n        onClose={onClose}\n        portalClassName={\"roamjs-progress-dialog-portal\"}\n        className={\"roamjs-progress-dialog\"}\n        canOutsideClickClose={false}\n        canEscapeKeyClose={false}\n        hasBackdrop={false}\n        enforceFocus={false}\n      >\n        <div style={{ padding: 16 }}>\n          <h4>Performing Writes to Roam...</h4>\n          <p>\n            Still have <b>{Object.keys(window.roamjs.actions).length}</b>{\" \"}\n            actions to write. Expected to finish the last one in{\" \"}\n            {Math.ceil((maxTimeout - now.valueOf()) / 1000)} seconds...\n          </p>\n        </div>\n      </Dialog>\n    </>\n  );\n};\n\nexport const render = createOverlayRender<Props>(\n  \"progress-dialog\",\n  ProgressDialog\n);\n\nexport default ProgressDialog;\n"]}

package/components/SimpleAlert.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import type Marked from "marked-react";
+declare type Props = {
+    content: string;
+    onConfirm?: () => void;
+    confirmText?: string;
+    onCancel?: (() => void) | true;
+    externalLink?: boolean;
+    dontShowAgain?: string;
+};
+declare const SimpleAlert: (Markdown: typeof Marked) => ({ onClose, content, onConfirm, onCancel, externalLink, confirmText, dontShowAgain, }: Props & {
+    onClose: () => void;
+}) => React.ReactElement;
+export declare const render: (props: Props) => Promise<(() => void) | undefined>;
+export default SimpleAlert;

package/components/SimpleAlert.js

@@ -0,0 +1,48 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.render = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importStar(require("react"));
+const core_1 = require("@blueprintjs/core");
+const createOverlayRender_1 = tslib_1.__importDefault(require("../util/createOverlayRender"));
+const createBlock_1 = tslib_1.__importDefault(require("../writes/createBlock"));
+const SimpleAlert = (Markdown) => ({ onClose, content, onConfirm, onCancel, externalLink, confirmText = "Ok", dontShowAgain, }) => {
+    const alertOnClose = (0, react_1.useCallback)((confirmed) => {
+        onClose();
+        if (!confirmed && typeof onCancel === "function")
+            onCancel();
+    }, [onCancel, onClose]);
+    const cancelProps = onCancel
+        ? {
+            cancelButtonText: "Cancel",
+            canOutsideClickCancel: true,
+            canEscapeKeyCancel: true,
+        }
+        : {};
+    const [checked, setChecked] = (0, react_1.useState)(false);
+    const alerOnConfirm = (0, react_1.useCallback)(() => {
+        (checked && dontShowAgain
+            ? (0, createBlock_1.default)({
+                parentUid: dontShowAgain,
+                node: { text: "Do not show again" },
+            })
+            : Promise.resolve()).then(onConfirm);
+    }, [onConfirm, checked, dontShowAgain]);
+    return (react_1.default.createElement(core_1.Alert, Object.assign({ isOpen: true, onClose: alertOnClose, onConfirm: alerOnConfirm, confirmButtonText: confirmText, 
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
+        autoFocus: false }, cancelProps),
+        react_1.default.createElement("div", { className: core_1.Classes.ALERT_CONTENTS, style: { whiteSpace: "pre-wrap" } },
+            react_1.default.createElement(Markdown, { renderer: externalLink
+                    ? {
+                        link: (href, text) => (react_1.default.createElement("a", { href: href, rel: "noreferrer", target: "_blank" }, text)),
+                    }
+                    : {} }, content),
+            dontShowAgain && (react_1.default.createElement(core_1.Checkbox, { checked: checked, label: "Don't show again", onChange: (e) => setChecked(e.target.checked) })))));
+};
+const render = (props) => (window.RoamLazy
+    ? window.RoamLazy.MarkedReact()
+    : Promise.resolve().then(() => tslib_1.__importStar(require("marked-react"))).then((r) => r.default)).then((Markdown) => (0, createOverlayRender_1.default)("simple-alert", SimpleAlert(Markdown))(props));
+exports.render = render;
+exports.default = SimpleAlert;
+//# sourceMappingURL=SimpleAlert.js.map

package/components/SimpleAlert.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"SimpleAlert.js","sourceRoot":"","sources":["../../src/components/SimpleAlert.tsx"],"names":[],"mappings":";;;;AAAA,uDAAqD;AACrD,4CAA6D;AAC7D,8FAA8D;AAE9D,gFAAgD;AAWhD,MAAM,WAAW,GACf,CAAC,QAAuB,EAAE,EAAE,CAC5B,CAAC,EACC,OAAO,EACP,OAAO,EACP,SAAS,EACT,QAAQ,EACR,YAAY,EACZ,WAAW,GAAG,IAAI,EAClB,aAAa,GACmB,EAAsB,EAAE;IACxD,MAAM,YAAY,GAAG,IAAA,mBAAW,EAC9B,CAAC,SAAkB,EAAE,EAAE;QACrB,OAAO,EAAE,CAAC;QACV,IAAI,CAAC,SAAS,IAAI,OAAO,QAAQ,KAAK,UAAU;YAAE,QAAQ,EAAE,CAAC;IAC/D,CAAC,EACD,CAAC,QAAQ,EAAE,OAAO,CAAC,CACpB,CAAC;IACF,MAAM,WAAW,GAAG,QAAQ;QAC1B,CAAC,CAAC;YACE,gBAAgB,EAAE,QAAQ;YAC1B,qBAAqB,EAAE,IAAI;YAC3B,kBAAkB,EAAE,IAAI;SACzB;QACH,CAAC,CAAC,EAAE,CAAC;IACP,MAAM,CAAC,OAAO,EAAE,UAAU,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC9C,MAAM,aAAa,GAAG,IAAA,mBAAW,EAAC,GAAG,EAAE;QACrC,CAAC,OAAO,IAAI,aAAa;YACvB,CAAC,CAAC,IAAA,qBAAW,EAAC;gBACV,SAAS,EAAE,aAAa;gBACxB,IAAI,EAAE,EAAE,IAAI,EAAE,mBAAmB,EAAE;aACpC,CAAC;YACJ,CAAC,CAAC,OAAO,CAAC,OAAO,EAAE,CACpB,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC;IACpB,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC;IACxC,OAAO,CACL,8BAAC,YAAK,kBACJ,MAAM,EAAE,IAAI,EACZ,OAAO,EAAE,YAAY,EACrB,SAAS,EAAE,aAAa,EACxB,iBAAiB,EAAE,WAAW;QAC9B,6DAA6D;QAC7D,aAAa;QACb,SAAS,EAAE,KAAK,IACZ,WAAW;QAEf,uCACE,SAAS,EAAE,cAAO,CAAC,cAAc,EACjC,KAAK,EAAE,EAAE,UAAU,EAAE,UAAU,EAAE;YAEjC,8BAAC,QAAQ,IACP,QAAQ,EACN,YAAY;oBACV,CAAC,CAAC;wBACE,IAAI,EAAE,CAAC,IAAI,EAAE,IAAI,EAAE,EAAE,CAAC,CACpB,qCAAG,IAAI,EAAE,IAAI,EAAE,GAAG,EAAE,YAAY,EAAE,MAAM,EAAE,QAAQ,IAC/C,IAAI,CACH,CACL;qBACF;oBACH,CAAC,CAAC,EAAE,IAGP,OAAO,CACC;YACV,aAAa,IAAI,CAChB,8BAAC,eAAQ,IACP,OAAO,EAAE,OAAO,EAChB,KAAK,EAAC,kBAAkB,EACxB,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CACd,UAAU,CAAE,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC,GAEpD,CACH,CACG,CACA,CACT,CAAC;AACJ,CAAC,CAAC;AAEG,MAAM,MAAM,GAAG,CAAC,KAAY,EAAE,EAAE,CACrC,CAAC,MAAM,CAAC,QAAQ;IACd,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE;IAC/B,CAAC,CAAC,0DAAO,cAAc,IAAE,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAChD,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE,CAClB,IAAA,6BAAmB,EAAQ,cAAc,EAAE,WAAW,CAAC,QAAQ,CAAC,CAAC,CAAC,KAAK,CAAC,CACzE,CAAC;AANS,QAAA,MAAM,UAMf;AAEJ,kBAAe,WAAW,CAAC","sourcesContent":["import React, { useCallback, useState } from \"react\";\nimport { Alert, Checkbox, Classes } from \"@blueprintjs/core\";\nimport createOverlayRender from \"../util/createOverlayRender\";\nimport type Marked from \"marked-react\";\nimport createBlock from \"../writes/createBlock\";\n\ntype Props = {\n  content: string;\n  onConfirm?: () => void;\n  confirmText?: string;\n  onCancel?: (() => void) | true;\n  externalLink?: boolean;\n  dontShowAgain?: string;\n};\n\nconst SimpleAlert =\n  (Markdown: typeof Marked) =>\n  ({\n    onClose,\n    content,\n    onConfirm,\n    onCancel,\n    externalLink,\n    confirmText = \"Ok\",\n    dontShowAgain,\n  }: Props & { onClose: () => void }): React.ReactElement => {\n    const alertOnClose = useCallback(\n      (confirmed: boolean) => {\n        onClose();\n        if (!confirmed && typeof onCancel === \"function\") onCancel();\n      },\n      [onCancel, onClose]\n    );\n    const cancelProps = onCancel\n      ? {\n          cancelButtonText: \"Cancel\",\n          canOutsideClickCancel: true,\n          canEscapeKeyCancel: true,\n        }\n      : {};\n    const [checked, setChecked] = useState(false);\n    const alerOnConfirm = useCallback(() => {\n      (checked && dontShowAgain\n        ? createBlock({\n            parentUid: dontShowAgain,\n            node: { text: \"Do not show again\" },\n          })\n        : Promise.resolve()\n      ).then(onConfirm);\n    }, [onConfirm, checked, dontShowAgain]);\n    return (\n      <Alert\n        isOpen={true}\n        onClose={alertOnClose}\n        onConfirm={alerOnConfirm}\n        confirmButtonText={confirmText}\n        // eslint-disable-next-line @typescript-eslint/ban-ts-comment\n        // @ts-ignore\n        autoFocus={false}\n        {...cancelProps}\n      >\n        <div\n          className={Classes.ALERT_CONTENTS}\n          style={{ whiteSpace: \"pre-wrap\" }}\n        >\n          <Markdown\n            renderer={\n              externalLink\n                ? {\n                    link: (href, text) => (\n                      <a href={href} rel={\"noreferrer\"} target={\"_blank\"}>\n                        {text}\n                      </a>\n                    ),\n                  }\n                : {}\n            }\n          >\n            {content}\n          </Markdown>\n          {dontShowAgain && (\n            <Checkbox\n              checked={checked}\n              label=\"Don't show again\"\n              onChange={(e) =>\n                setChecked((e.target as HTMLInputElement).checked)\n              }\n            />\n          )}\n        </div>\n      </Alert>\n    );\n  };\n\nexport const render = (props: Props) =>\n  (window.RoamLazy\n    ? window.RoamLazy.MarkedReact()\n    : import(\"marked-react\").then((r) => r.default)\n  ).then((Markdown) =>\n    createOverlayRender<Props>(\"simple-alert\", SimpleAlert(Markdown))(props)\n  );\n\nexport default SimpleAlert;\n"]}

package/components/Toast.d.ts

@@ -0,0 +1,15 @@
+import React from "react";
+import { Intent, IToastProps, ToasterPosition } from "@blueprintjs/core";
+declare type ToastBaseProps = {
+    content?: React.ReactNode;
+    timeout?: number;
+    intent?: Intent;
+    onDismiss?: IToastProps["onDismiss"];
+    action?: IToastProps["action"];
+};
+declare type ToastProps = {
+    id: string;
+    position?: ToasterPosition;
+} & ToastBaseProps;
+export declare const render: ({ position, ...props }: ToastProps) => (() => void);
+export default render;

package/components/Toast.js

@@ -0,0 +1,51 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.render = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const core_1 = require("@blueprintjs/core");
+const render = (_a) => {
+    var { position = "top" } = _a, props = tslib_1.__rest(_a, ["position"]);
+    const className = `roamjs-toast-${position}`;
+    const toasterRoot = document.querySelector(`.bp3-toast-container.${className}`);
+    if (toasterRoot) {
+        toasterRoot.dispatchEvent(new CustomEvent("roamjs-toast", { detail: props }));
+        return () => toasterRoot.remove();
+    }
+    else {
+        const toaster = core_1.Toaster.create({
+            position,
+            className,
+        });
+        // `import(marked-react)` is returning `window.RoamLazy.MarkedReact` instead of the module itself
+        (window.RoamLazy
+            ? window.RoamLazy.MarkedReact()
+            : Promise.resolve().then(() => tslib_1.__importStar(require("marked-react"))).then((r) => r.default)).then((Markdown) => {
+            const Toast = ({ content = "RoamJS Notification", intent = core_1.Intent.PRIMARY, timeout = 5000, onDismiss, action, }) => {
+                const isStringContent = typeof content === "string";
+                return {
+                    message: (react_1.default.createElement(react_1.default.Fragment, null,
+                        react_1.default.createElement("style", null, `.${className} p { margin-bottom: 0; }`),
+                        isStringContent ? react_1.default.createElement(Markdown, null, content) : content)),
+                    intent,
+                    timeout,
+                    onDismiss,
+                    action,
+                };
+            };
+            toaster.show(Toast(props), props.id);
+            setTimeout(() => {
+                const toasterRoot = document.querySelector(`.bp3-toast-container.${className}`);
+                if (toasterRoot)
+                    toasterRoot.addEventListener("roamjs-toast", ((e) => {
+                        const _a = e.detail, { id } = _a, props = tslib_1.__rest(_a, ["id"]);
+                        toaster.show(Toast(props), id);
+                    }));
+            }, 1);
+        });
+        return () => toaster.dismiss(props.id);
+    }
+};
+exports.render = render;
+exports.default = exports.render;
+//# sourceMappingURL=Toast.js.map

package/components/Toast.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Toast.js","sourceRoot":"","sources":["../../src/components/Toast.tsx"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAC1B,4CAK2B;AAepB,MAAM,MAAM,GAAG,CAAC,EAGV,EAAgB,EAAE;QAHR,EACrB,QAAQ,GAAG,KAAK,OAEL,EADR,KAAK,sBAFa,YAGtB,CADS;IAER,MAAM,SAAS,GAAG,gBAAgB,QAAQ,EAAE,CAAC;IAC7C,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CACxC,wBAAwB,SAAS,EAAE,CACpC,CAAC;IACF,IAAI,WAAW,EAAE;QACf,WAAW,CAAC,aAAa,CACvB,IAAI,WAAW,CAAC,cAAc,EAAE,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,CACnD,CAAC;QACF,OAAO,GAAG,EAAE,CAAC,WAAW,CAAC,MAAM,EAAE,CAAC;KACnC;SAAM;QACL,MAAM,OAAO,GAAG,cAAO,CAAC,MAAM,CAAC;YAC7B,QAAQ;YACR,SAAS;SACV,CAAC,CAAC;QAEH,iGAAiG;QACjG,CAAC,MAAM,CAAC,QAAQ;YACd,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,WAAW,EAAE;YAC/B,CAAC,CAAC,0DAAO,cAAc,IAAE,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,OAAO,CAAC,CAChD,CAAC,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE;YAClB,MAAM,KAAK,GAAG,CAAC,EACb,OAAO,GAAG,qBAAqB,EAC/B,MAAM,GAAG,aAAM,CAAC,OAAO,EACvB,OAAO,GAAG,IAAI,EACd,SAAS,EACT,MAAM,GACS,EAAE,EAAE;gBACnB,MAAM,eAAe,GAAG,OAAO,OAAO,KAAK,QAAQ,CAAC;gBACpD,OAAO;oBACL,OAAO,EAAE,CACP;wBACE,6CAAQ,IAAI,SAAS,0BAA0B,CAAS;wBACvD,eAAe,CAAC,CAAC,CAAC,8BAAC,QAAQ,QAAE,OAAO,CAAY,CAAC,CAAC,CAAC,OAAO,CAC1D,CACJ;oBACD,MAAM;oBACN,OAAO;oBACP,SAAS;oBACT,MAAM;iBACP,CAAC;YACJ,CAAC,CAAC;YACF,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC;YACrC,UAAU,CAAC,GAAG,EAAE;gBACd,MAAM,WAAW,GAAG,QAAQ,CAAC,aAAa,CACxC,wBAAwB,SAAS,EAAE,CACpC,CAAC;gBACF,IAAI,WAAW;oBACb,WAAW,CAAC,gBAAgB,CAAC,cAAc,EAAE,CAAC,CAAC,CAAc,EAAE,EAAE;wBAC/D,MACE,KACE,CAAC,OADqB,EAAxB,EAAU,EAAE,OAAY,EAAP,KAAK,sBAAd,MAAgB,CACrB,CAAC;wBACN,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC,CAAC;oBACjC,CAAC,CAAkB,CAAC,CAAC;YACzB,CAAC,EAAE,CAAC,CAAC,CAAC;QACR,CAAC,CAAC,CAAC;QACH,OAAO,GAAG,EAAE,CAAC,OAAO,CAAC,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;KACxC;AACH,CAAC,CAAC;AA7DW,QAAA,MAAM,UA6DjB;AAEF,kBAAe,cAAM,CAAC","sourcesContent":["import React from \"react\";\nimport {\n  Intent,\n  IToastProps,\n  Toaster,\n  ToasterPosition,\n} from \"@blueprintjs/core\";\n\ntype ToastBaseProps = {\n  content?: React.ReactNode;\n  timeout?: number;\n  intent?: Intent;\n  onDismiss?: IToastProps[\"onDismiss\"];\n  action?: IToastProps[\"action\"];\n};\n\ntype ToastProps = {\n  id: string;\n  position?: ToasterPosition;\n} & ToastBaseProps;\n\nexport const render = ({\n  position = \"top\",\n  ...props\n}: ToastProps): (() => void) => {\n  const className = `roamjs-toast-${position}`;\n  const toasterRoot = document.querySelector(\n    `.bp3-toast-container.${className}`\n  );\n  if (toasterRoot) {\n    toasterRoot.dispatchEvent(\n      new CustomEvent(\"roamjs-toast\", { detail: props })\n    );\n    return () => toasterRoot.remove();\n  } else {\n    const toaster = Toaster.create({\n      position,\n      className,\n    });\n\n    // `import(marked-react)` is returning `window.RoamLazy.MarkedReact` instead of the module itself\n    (window.RoamLazy\n      ? window.RoamLazy.MarkedReact()\n      : import(\"marked-react\").then((r) => r.default)\n    ).then((Markdown) => {\n      const Toast = ({\n        content = \"RoamJS Notification\",\n        intent = Intent.PRIMARY,\n        timeout = 5000,\n        onDismiss,\n        action,\n      }: ToastBaseProps) => {\n        const isStringContent = typeof content === \"string\";\n        return {\n          message: (\n            <>\n              <style>{`.${className} p { margin-bottom: 0; }`}</style>\n              {isStringContent ? <Markdown>{content}</Markdown> : content}\n            </>\n          ),\n          intent,\n          timeout,\n          onDismiss,\n          action,\n        };\n      };\n      toaster.show(Toast(props), props.id);\n      setTimeout(() => {\n        const toasterRoot = document.querySelector<HTMLDivElement>(\n          `.bp3-toast-container.${className}`\n        );\n        if (toasterRoot)\n          toasterRoot.addEventListener(\"roamjs-toast\", ((e: CustomEvent) => {\n            const {\n              detail: { id, ...props },\n            } = e;\n            toaster.show(Toast(props), id);\n          }) as EventListener);\n      }, 1);\n    });\n    return () => toaster.dismiss(props.id);\n  }\n};\n\nexport default render;\n"]}

package/components/index.js

@@ -0,0 +1,5 @@
+"use strict";
+throw new Error(`Do not import from roamjs-components/components directly. Instead import the *component* you need directly. For example: 
+  
+import AutocompleteInput from "roamjs-components/util/AutocompleteInput;"`);
+//# sourceMappingURL=index.js.map

package/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":";AAAA,MAAM,IAAI,KAAK,CACb;;0EAEwE,CACzE,CAAC","sourcesContent":["throw new Error(\n  `Do not import from roamjs-components/components directly. Instead import the *component* you need directly. For example: \n  \nimport AutocompleteInput from \"roamjs-components/util/AutocompleteInput;\"`\n);\n"]}

package/components.d.ts

@@ -0,0 +1,5 @@
+declare const _default: {
+    onload: (args: import("./types").OnloadArgs) => void;
+    onunload: () => void;
+};
+export default _default;

package/components.js

@@ -0,0 +1,171 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const tslib_1 = require("tslib");
+const react_dom_1 = tslib_1.__importDefault(require("react-dom"));
+const react_1 = tslib_1.__importStar(require("react"));
+const core_1 = require("@blueprintjs/core");
+const AutocompleteInput_1 = tslib_1.__importDefault(require("./components/AutocompleteInput"));
+const FormDialog_1 = tslib_1.__importDefault(require("./components/FormDialog"));
+const PageInput_1 = tslib_1.__importDefault(require("./components/PageInput"));
+const Toast_1 = tslib_1.__importDefault(require("./components/Toast"));
+const renderOverlay_1 = tslib_1.__importDefault(require("./util/renderOverlay"));
+const runExtension_1 = tslib_1.__importDefault(require("./util/runExtension"));
+const writes_1 = require("./writes");
+const MenuItemSelect_1 = tslib_1.__importDefault(require("./components/MenuItemSelect"));
+// const blockRender = (Component: React.FC) => {
+//   const block = window.roamAlphaAPI.ui.getFocusedBlock();
+//   const parent = document.getElementById(
+//     `block-input-${block?.["window-id"]}-${block?.["block-uid"]}`
+//   );
+//   ReactDOM.render(<Component />, parent);
+// };
+const unloads = new Set();
+const rootRender = (Component) => {
+    const root = document.querySelector(".roam-article");
+    const parent = document.createElement("div");
+    root === null || root === void 0 ? void 0 : root.insertBefore(parent, root.firstElementChild);
+    react_dom_1.default.render(react_1.default.createElement(Component, null), parent);
+    unloads.add(() => {
+        react_dom_1.default.unmountComponentAtNode(parent);
+        parent.remove();
+    });
+};
+const components = [
+    {
+        callback: () => rootRender(() => {
+            const [value, setValue] = (0, react_1.useState)("");
+            const [filterable, setFilterable] = (0, react_1.useState)(false);
+            const options = (0, react_1.useMemo)(() => ["apple", "banana", "orange"], []);
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement("div", null,
+                    "Chosen value: ",
+                    value),
+                react_1.default.createElement(core_1.Checkbox, { checked: filterable, onChange: (e) => setFilterable(e.target.checked), label: "Filterable" }),
+                react_1.default.createElement(MenuItemSelect_1.default, { activeItem: value, items: options, onItemSelect: (item) => setValue(item), filterable: filterable })));
+        }),
+        label: "MenuItemSelect",
+    },
+    {
+        callback: () => rootRender(() => {
+            const [value, setValue] = (0, react_1.useState)("");
+            const [numResults, setNumResults] = (0, react_1.useState)(100);
+            const [disabled, setDisabled] = (0, react_1.useState)(false);
+            const [maxItemsDisplayed, setMaxItemsDisplayed] = (0, react_1.useState)(0);
+            const options = (0, react_1.useMemo)(() => {
+                const items = [];
+                for (let i = 0; i < numResults; i++) {
+                    items.push(Math.random().toString(36).substring(7));
+                }
+                return items;
+            }, [numResults]);
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(core_1.Label, null,
+                    "Number of Results",
+                    react_1.default.createElement(core_1.NumericInput, { value: numResults, onValueChange: (e) => setNumResults(e), buttonPosition: "none" })),
+                react_1.default.createElement(core_1.Label, null,
+                    "Max Items Displayed (0 for all)",
+                    react_1.default.createElement(core_1.NumericInput, { value: maxItemsDisplayed, onValueChange: (e) => setMaxItemsDisplayed(e), buttonPosition: "none" })),
+                react_1.default.createElement(core_1.Label, null,
+                    "Chosen value: ",
+                    value),
+                react_1.default.createElement(core_1.Checkbox, { checked: disabled, onChange: (e) => setDisabled(e.target.checked), label: "Disabled" }),
+                react_1.default.createElement(core_1.Label, null,
+                    "Autocomplete",
+                    react_1.default.createElement(AutocompleteInput_1.default, { disabled: disabled, value: value, setValue: setValue, options: options, maxItemsDisplayed: maxItemsDisplayed === 0 ? undefined : maxItemsDisplayed }))));
+        }),
+        label: "AutocompleteInput",
+    },
+    {
+        callback: () => rootRender(() => {
+            const [isOpen, setIsOpen] = (0, react_1.useState)(false);
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(core_1.Button, { onClick: () => setIsOpen(true), text: "Open Form" }),
+                react_1.default.createElement(FormDialog_1.default, { isOpen: isOpen, onClose: () => setIsOpen(false), onSubmit: (data) => window.roamAlphaAPI.ui.mainWindow
+                        .getOpenPageOrBlockUid()
+                        .then((parentUid) => (0, writes_1.createBlock)({
+                        parentUid: parentUid ||
+                            window.roamAlphaAPI.util.dateToPageUid(new Date()),
+                        node: {
+                            text: "Response",
+                            children: Object.entries(data).map(([k, v]) => ({
+                                text: k,
+                                children: Array.isArray(v) ? v : [{ text: `${v}` }],
+                            })),
+                        },
+                    })), fields: {
+                        text: { type: "text", label: "Text Field" },
+                        number: { type: "number", label: "Number Field" },
+                        info: { type: "info", label: "Read Only Info Text" },
+                        flag: { type: "flag", label: "Flag Field" },
+                        conditionalText: {
+                            type: "text",
+                            label: "Conditional Text Field",
+                            conditional: "flag",
+                        },
+                        page: { type: "page", label: "Page Field" },
+                        block: { type: "block", label: "Block Field" },
+                        select: {
+                            type: "select",
+                            label: "Select Field",
+                            options: [
+                                "apple",
+                                "banana",
+                                "orange",
+                                "conditional select 1",
+                            ],
+                        },
+                        conditionalSelect: {
+                            type: "text",
+                            label: "Conditional Text Field",
+                            conditional: "select",
+                            conditionalValues: ["conditional select 1"],
+                        },
+                        autocomplete: {
+                            type: "autocomplete",
+                            label: "Autocomplete Field",
+                            options: ["apple", "banana", "orange"],
+                        },
+                        embed: {
+                            type: "embed",
+                            label: "Embed Field",
+                        },
+                    } })));
+        }),
+        label: "FormDialog",
+    },
+    {
+        callback: () => rootRender(() => {
+            const [value, setValue] = (0, react_1.useState)("");
+            const [multiline, setMultiline] = (0, react_1.useState)(false);
+            return (react_1.default.createElement(react_1.default.Fragment, null,
+                react_1.default.createElement(PageInput_1.default, { value: value, setValue: setValue, multiline: multiline }),
+                react_1.default.createElement("input", { className: "ml-8 inline-block", checked: multiline, onChange: (e) => setMultiline(e.target.checked), type: "checkbox" })));
+        }),
+        label: "PageInput",
+    },
+];
+exports.default = (0, runExtension_1.default)((args) => tslib_1.__awaiter(void 0, void 0, void 0, function* () {
+    components.forEach(({ callback, label }) => {
+        args.extensionAPI.ui.commandPalette.addCommand({
+            label: `Render RoamJS component ${label}`,
+            callback,
+        });
+    });
+    window.roamjs.extension.developer = {
+        components: {
+            AutocompleteInput: AutocompleteInput_1.default,
+            FormDialog: FormDialog_1.default,
+            PageInput: PageInput_1.default,
+            renderToast: Toast_1.default,
+        },
+        util: {
+            renderOverlay: renderOverlay_1.default,
+            runExtension: runExtension_1.default,
+        },
+        args,
+    };
+    return () => {
+        unloads.forEach((unload) => unload());
+    };
+}));
+//# sourceMappingURL=components.js.map