roamjs-components 0.86.0-alpha.2 → 0.86.0

package/docs/types.md

@@ -1,32 +0,0 @@
-## Type Definitions
-
-https://github.com/RoamJS/roamjs-components/blob/main/src/types
-
-The `https://github.com/RoamJS/roamjs-components/blob/main/src/types` directory defines the core types and interfaces used throughout the Roam Research extension ecosystem. These types cover a wide range of functionalities, from data structures and queries to user interface components and SmartBlocks.
-
-The [`index.ts`](https://github.com/RoamJS/roamjs-components/blob/main/src/dom/index.ts#L0) file serves as the entry point, importing and re-exporting types from other modules such as [`native`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L0), [`query-builder`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/query-builder.ts#L0), and [`smartblocks`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/index.ts#L15). It also defines the [`Registry`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/index.ts#L22) type, which centralizes the storage of various elements, event listeners, and other state used by the extension. Additionally, it extends the global [`Window`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/index.ts#L57) object with Roam Research-specific APIs and utilities, including the [`roamAlphaAPI`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/index.ts#L83) and [`roamjs`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/index.ts#L234) namespaces.
-
-The [`native.ts`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L0) file provides a comprehensive set of types for working with the Roam Research application. Key types include:
-
-- **Datalog Types**: These types, such as [`DatalogSrcVar`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L6) and [`DatalogVariable`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L11), model the structure of Datalog queries, which are integral to the Roam Research data model.
-- **Roam Research Data Structures**: Types like [`RoamBasicBlock`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L139), [`RoamBasicPage`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L144), and [`RoamBasicNode`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L146) represent the various elements of Roam Research, such as blocks, pages, and nodes.
-- **User Interface Components**: Types such as [`Action`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L447), [`ButtonAction`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L419), and [`SwitchAction`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L425) model the user interface components that can be added to the Roam Research application.
-- **Client-Side Actions**: Types like [`ClientParams`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L324) and [`ActionParams`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L341) represent the parameters for various client-side actions, such as creating or updating blocks and pages.
-- **User Settings**: The [`UserSettings`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L363) type represents the user settings for the Roam Research application.
-- **Sidebar Functionality**: Types like [`SidebarWindowInput`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L376) and [`SidebarBlockWindow`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/native.ts#L381) model the sidebar functionality of the Roam Research application.
-
-The [`query-builder.ts`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/query-builder.ts#L0) file defines types related to querying and working with data in [Query Builder](https://github.com/RoamJS/query-builder). Key types include:
-
-- **Result**: Represents the result of a query, containing fields like [`text`](https://github.com/RoamJS/roamjs-components/blob/main/src/marked/index.ts#L211) and [`uid`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/getOauth.ts#L45).
-- **RunQuery** and **RunQuerySync**: Function types that execute a query and return the results.
-- **ListActiveQueries**: A function type that returns active queries.
-- **IsDiscourseNode**: A function type that determines if a node is a discourse node.
-
-The [`smartblocks.ts`](https://github.com/RoamJS/roamjs-components/blob/main/src/types/smartblocks.ts#L0) file defines types and interfaces used in the [SmartBlocks](https://github.com/RoamJS/smartblocks) extension. Key types include:
-
-- **CommandOutput**: Represents the output of a command handler.
-- **CommandHandler**: A function type that handles commands.
-- **SmartBlocksContext**: Represents the context in which a SmartBlock is executed.
-- **RegisterCommand** and **UnregisterCommand**: Function types for registering and unregistering commands.
-
-These types are essential for building robust and extensible Roam Research applications and integrations. For more detailed information on specific types, refer to the subsections on [Index Types](https://wiki.mutable.ai/RoamJS/roamjs-components#index-types), [Native Types](https://wiki.mutable.ai/RoamJS/roamjs-components#native-types), [Query Builder Types](https://wiki.mutable.ai/RoamJS/roamjs-components#query-builder-types), and [SmartBlocks Types](https://wiki.mutable.ai/RoamJS/roamjs-components#smartblocks-types).

package/docs/util.md

@@ -1,38 +0,0 @@
-## Utility Functions
-
-https://github.com/RoamJS/roamjs-components/blob/main/src/util
-
-Utility functions in the RoamJS ecosystem provide essential support for various operations, including API interactions, DOM manipulation, data extraction, settings management, extension management, and miscellaneous tasks.
-
-## API Interaction Utilities
-
-Functions like [`apiDelete()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/apiDelete.ts#L3), [`apiGet()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/apiGet.ts#L3), [`apiPost()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/apiPost.ts#L3), and [`apiPut()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/apiPut.ts#L3) standardize HTTP requests, while [`getOauth()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/getOauth.ts#L8) and [`getOauthAccounts()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/getOauthAccounts.ts#L7) manage OAuth authentication. For more details, see [API Interaction Utilities](https://wiki.mutable.ai/RoamJS/roamjs-components#api-interaction-utilities).
-
-## DOM and Rendering Utilities
-
-Utilities such as [`createOverlayRender()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/createOverlayRender.ts#L4), [`getRenderRoot()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/getRenderRoot.ts#L3), and [`renderOverlay()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/renderOverlay.ts#L16) facilitate DOM manipulation and component rendering within the Roam application. For more details, see [DOM and Rendering Utilities](https://wiki.mutable.ai/RoamJS/roamjs-components#dom-and-rendering-utilities).
-
-## Data Extraction and Transformation Utilities
-
-Functions like [`extractRef()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/extractRef.ts#L3), [`extractTag()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/extractTag.ts#L1), and [`createTagRegex()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/createTagRegex.ts#L1) handle the extraction and transformation of data from Roam page content. For more details, see [Data Extraction and Transformation Utilities](https://wiki.mutable.ai/RoamJS/roamjs-components#setting-and-configuration-utilities).
-
-## Setting and Configuration Utilities
-
-Utilities such as [`addInputSetting()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/addInputSetting.ts#L5), [`setInputSetting()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/setInputSetting.ts#L6), and [`getSettingValueFromTree()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/getSettingValueFromTree.ts#L5) manage settings and configurations within Roam extensions. For more details, see [Setting and Configuration Utilities](https://wiki.mutable.ai/RoamJS/roamjs-components#extension-management-utilities).
-
-## Extension Management Utilities
-
-Functions like [`extensionDeprecatedWarning()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/extensionDeprecatedWarning.ts#L11) and [`runExtension()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/runExtension.ts#L22) manage and run Roam extensions. For more details, see [Extension Management Utilities](https://wiki.mutable.ai/RoamJS/roamjs-components#extension-management-utilities).
-
-## Miscellaneous Utilities
-
-Various other utilities include [`isControl()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/isControl.ts#L1), [`toFlexRegex()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/toFlexRegex.ts#L1), and [`getWorkerClient()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/getWorkerClient.ts#L1), which handle tasks like checking DOM elements and interacting with web workers.
-
-## Key Design Choices and Important Implementations
-
-- **OAuth Management**: [`getOauth()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/getOauth.ts#L8) retrieves OAuth information from local storage or the Roam Research database, ensuring efficient access to authentication data.
-- **Overlay Rendering**: [`createOverlayRender()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/createOverlayRender.ts#L4) and [`renderOverlay()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/renderOverlay.ts#L16) manage the rendering of React components as overlays, providing a flexible way to display modal content.
-- **Extension Lifecycle Management**: [`runExtension()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/runExtension.ts#L22) handles the setup and cleanup of Roam extensions, including event listeners and registry management.
-- **Settings Management**: [`setInputSetting()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/setInputSetting.ts#L6) and [`getSettingValueFromTree()`](https://github.com/RoamJS/roamjs-components/blob/main/src/util/getSettingValueFromTree.ts#L5) streamline the process of managing input settings within Roam blocks, ensuring consistent configuration handling.
-
-These utilities are designed to be reusable and modular, promoting code organization and maintainability across the RoamJS ecosystem.

package/docs/writes.md

@@ -1,23 +0,0 @@
-# Write Operations
-
-https://github.com/RoamJS/roamjs-components/blob/main/src/writes
-
-`https://github.com/RoamJS/roamjs-components/blob/main/src/writes` contains functions that handle various write operations in a Roam. These functions include clearing, creating, updating, and deleting blocks, as well as creating pages and managing sidebar operations.
-
-- [`clearBlockById`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/clearBlockById.ts#L4): Clears the content of a block by its ID. It uses [`getUidsFromId`](https://github.com/RoamJS/roamjs-components/blob/main/src/dom/getUidsFromId.ts#L1) to extract the block UID and then calls [`submitActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/submitActions.ts#L19) to update the block content to an empty string.
-- [`clearBlockByUid`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/clearBlockByUid.ts#L3): Clears the content of a block by its UID. It directly calls [`submitActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/submitActions.ts#L19) with an update action to set the block content to an empty string.
-- [`createBlock`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/createBlock.ts#L41): Creates a new block with the provided content and options. It gathers the necessary actions using [`gatherActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/createBlock.ts#L4) and submits them using [`submitActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/submitActions.ts#L19).
-- [`createPage`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/createPage.ts#L6): Creates a new page with the provided title. It checks if the title matches a daily note pattern and generates a UID if necessary. It then submits actions to create the page and any child blocks using [`submitActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/submitActions.ts#L19).
-- [`deleteBlock`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/deleteBlock.ts#L3): Deletes a block by its UID. It submits a delete action using [`submitActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/submitActions.ts#L19).
-- [`openBlockInSidebar`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/openBlockInSidebar.ts#L1): Opens a block in the sidebar. It checks if the block is already open in the sidebar and either opens the sidebar or adds a new window with the block UID.
-- [`updateActiveBlock`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/updateActiveBlock.ts#L4): Updates the content of the currently active block. It retrieves the active block UID using [`getActiveUids`](https://github.com/RoamJS/roamjs-components/blob/main/src/dom/getActiveUids.ts#L3) and submits an update action using [`submitActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/submitActions.ts#L19).
-- [`updateBlock`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/updateBlock.ts#L4): Updates the properties of a block, including text, heading, text alignment, view type, and open state. It submits these updates using [`submitActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/submitActions.ts#L19).
-
-The [`submitActions`](https://github.com/RoamJS/roamjs-components/blob/main/src/writes/submitActions.ts#L19) function is central to these operations, handling the submission of various actions to the Roam Research API. It manages an action queue and retries actions in case of API errors.
-
-For more details on see
-
-- [Block Operations](https://wiki.mutable.ai/RoamJS/roamjs-components#block-operations)
-- [Page Operations](https://wiki.mutable.ai/RoamJS/roamjs-components#page-operations)
-- [Sidebar Operations](https://wiki.mutable.ai/RoamJS/roamjs-components#sidebar-operations)
-- [Action Submission](https://wiki.mutable.ai/RoamJS/roamjs-components#action-submission)

package/patches/@blueprintjs+core+3.50.4.patch

@@ -1,48 +0,0 @@
-diff --git a/node_modules/@blueprintjs/core/lib/esm/components/alert/alert.d.ts b/node_modules/@blueprintjs/core/lib/esm/components/alert/alert.d.ts
-index 09b06be..f74f6a3 100644
---- a/node_modules/@blueprintjs/core/lib/esm/components/alert/alert.d.ts
-+++ b/node_modules/@blueprintjs/core/lib/esm/components/alert/alert.d.ts
-@@ -5,6 +5,7 @@ import { IOverlayLifecycleProps } from "../overlay/overlay";
- export declare type AlertProps = IAlertProps;
- /** @deprecated use AlertProps */
- export interface IAlertProps extends IOverlayLifecycleProps, Props {
-+    children?: React.ReactNode;
-     /**
-      * Whether pressing <kbd>escape</kbd> when focused on the Alert should cancel the alert.
-      * If this prop is enabled, then either `onCancel` or `onClose` must also be defined.
-diff --git a/node_modules/@blueprintjs/core/lib/esm/components/dialog/dialog.d.ts b/node_modules/@blueprintjs/core/lib/esm/components/dialog/dialog.d.ts
-index e90ee31..3e4f4ef 100644
---- a/node_modules/@blueprintjs/core/lib/esm/components/dialog/dialog.d.ts
-+++ b/node_modules/@blueprintjs/core/lib/esm/components/dialog/dialog.d.ts
-@@ -6,6 +6,7 @@ import { IBackdropProps, OverlayableProps } from "../overlay/overlay";
- export declare type DialogProps = IDialogProps;
- /** @deprecated use DialogProps */
- export interface IDialogProps extends OverlayableProps, IBackdropProps, Props {
-+    children?: React.ReactNode;
-     /**
-      * Toggles the visibility of the overlay and its children.
-      * This prop is required because the component is controlled.
-diff --git a/node_modules/@blueprintjs/core/lib/esm/components/tabs/tabs.d.ts b/node_modules/@blueprintjs/core/lib/esm/components/tabs/tabs.d.ts
-index 2ca5fe5..870a32e 100644
---- a/node_modules/@blueprintjs/core/lib/esm/components/tabs/tabs.d.ts
-+++ b/node_modules/@blueprintjs/core/lib/esm/components/tabs/tabs.d.ts
-@@ -6,6 +6,7 @@ export declare const Expander: React.FunctionComponent;
- export declare type TabsProps = ITabsProps;
- /** @deprecated use TabsProps */
- export interface ITabsProps extends Props {
-+    children?: React.ReactNode;
-     /**
-      * Whether the selected tab indicator should animate its movement.
-      *
-diff --git a/node_modules/@blueprintjs/core/lib/esm/components/tooltip/tooltip.d.ts b/node_modules/@blueprintjs/core/lib/esm/components/tooltip/tooltip.d.ts
-index 94f4af9..4db48a9 100644
---- a/node_modules/@blueprintjs/core/lib/esm/components/tooltip/tooltip.d.ts
-+++ b/node_modules/@blueprintjs/core/lib/esm/components/tooltip/tooltip.d.ts
-@@ -6,6 +6,7 @@ import { IPopoverSharedProps } from "../popover/popoverSharedProps";
- export declare type TooltipProps = ITooltipProps;
- /** @deprecated use TooltipProps */
- export interface ITooltipProps extends IPopoverSharedProps, IntentProps {
-+    children?: React.ReactNode;
-     /**
-      * The content that will be displayed inside of the tooltip.
-      */

package/patches/@blueprintjs+select+3.18.6.patch

@@ -1,12 +0,0 @@
-diff --git a/node_modules/@blueprintjs/select/lib/esm/components/select/select.d.ts b/node_modules/@blueprintjs/select/lib/esm/components/select/select.d.ts
-index f8b9bc6..ee0b6da 100644
---- a/node_modules/@blueprintjs/select/lib/esm/components/select/select.d.ts
-+++ b/node_modules/@blueprintjs/select/lib/esm/components/select/select.d.ts
-@@ -4,6 +4,7 @@ import { IListItemsProps } from "../../common";
- export declare type SelectProps<T> = ISelectProps<T>;
- /** @deprecated use SelectProps */
- export interface ISelectProps<T> extends IListItemsProps<T> {
-+    children?: React.ReactNode;
-     /**
-      * Whether the component should take up the full width of its container.
-      * This overrides `popoverProps.fill`. You also have to ensure that the child

package/patches/dotenv+16.3.1.patch

@@ -1,12 +0,0 @@
-diff --git a/node_modules/dotenv/lib/main.d.ts b/node_modules/dotenv/lib/main.d.ts
-index af84746..2247963 100644
---- a/node_modules/dotenv/lib/main.d.ts
-+++ b/node_modules/dotenv/lib/main.d.ts
-@@ -1,6 +1,6 @@
- // TypeScript Version: 3.0
- /// <reference types="node" />
--import type { URL } from 'node:url';
-+import type { URL } from 'url';
- 
- export interface DotenvParseOutput {
-   [name: string]: string;

package/src/components/AutocompleteInput.tsx

@@ -1,248 +0,0 @@
-import {
-  InputGroup,
-  Menu,
-  MenuItem,
-  PopoverPosition,
-  Popover,
-  Button,
-  TextArea,
-} from "@blueprintjs/core";
-import React, {
-  useState,
-  useCallback,
-  useMemo,
-  useRef,
-  useEffect,
-} from "react";
-import useArrowKeyDown from "../hooks/useArrowKeyDown";
-import fuzzy from "fuzzy";
-
-type FilterOptions<T> = (options: T[], query: string) => T[];
-type OnNewItem<T> = (s: string) => T;
-type ItemToQuery<T> = (t?: T) => string;
-
-export type AutocompleteInputProps<T = string> = {
-  value?: T;
-  setValue: (q: T) => void;
-  showButton?: boolean;
-  onBlur?: (v: string) => void;
-  onConfirm?: () => void;
-  options?: T[];
-  placeholder?: string;
-  autoFocus?: boolean;
-  multiline?: boolean;
-  id?: string;
-  filterOptions?: FilterOptions<T>;
-  itemToQuery?: ItemToQuery<T>;
-  renderItem?: (props: {
-    item: T;
-    onClick: () => void;
-    active: boolean;
-  }) => React.ReactElement;
-  onNewItem?: OnNewItem<T>;
-  disabled?: boolean;
-  maxItemsDisplayed?: number;
-};
-
-// eslint-disable-next-line @typescript-eslint/no-unnecessary-type-constraint
-const AutocompleteInput = <T extends unknown = string>({
-  value,
-  setValue,
-  onBlur,
-  onConfirm,
-  showButton,
-  options = [],
-  placeholder = "Enter value",
-  autoFocus,
-  multiline,
-  id,
-  filterOptions: _filterOptions,
-  itemToQuery: _itemToQuery,
-  renderItem,
-  onNewItem: _onNewItem,
-  disabled,
-  maxItemsDisplayed = Infinity,
-}: AutocompleteInputProps<T>): React.ReactElement => {
-  const [isOpen, setIsOpen] = useState(false);
-  const itemToQuery = useMemo<ItemToQuery<T>>(
-    () => _itemToQuery || ((s) => (s ? `${s}` : "")),
-    [_itemToQuery]
-  );
-  const [query, setQuery] = useState<string>(() => itemToQuery(value));
-  const open = useCallback(() => setIsOpen(true), [setIsOpen]);
-  const close = useCallback(() => setIsOpen(false), [setIsOpen]);
-  const [isTyping, setIsTyping] = useState(false);
-  const filterOptions = useMemo<FilterOptions<T>>(
-    () =>
-      _filterOptions ||
-      ((o, q) =>
-        fuzzy
-          .filter(q, o, { extract: itemToQuery })
-          .map((f) => f.original)
-          .filter((f): f is T => !!f)),
-    [_filterOptions, itemToQuery]
-  );
-  const onNewItem = useMemo<OnNewItem<T>>(
-    () => _onNewItem || ((s) => s as T),
-    [_onNewItem]
-  );
-
-  const items = useMemo(
-    () =>
-      (query ? filterOptions(options, query) : options).slice(
-        0,
-        maxItemsDisplayed
-      ),
-    [query, options, filterOptions, maxItemsDisplayed]
-  );
-  const menuRef = useRef<HTMLUListElement>(null);
-  const inputRef = useRef<HTMLInputElement & HTMLTextAreaElement>(null);
-  const onEnter = useCallback(
-    (value?: T) => {
-      if (isOpen && value) {
-        setQuery(itemToQuery(value));
-        setValue(value);
-        setIsTyping(false);
-      } else if (onConfirm) {
-        onConfirm();
-      } else {
-        setIsOpen(true);
-      }
-    },
-    [setValue, onConfirm, isOpen]
-  );
-  const { activeIndex, onKeyDown } = useArrowKeyDown({
-    onEnter,
-    results: items,
-    menuRef,
-  });
-  useEffect(() => {
-    if (!items.length || !isTyping) close();
-    else open();
-  }, [items, close, open, isTyping]);
-  useEffect(() => {
-    if (query && isOpen) setValue(items[activeIndex] || onNewItem(query));
-    else if (query) setValue(onNewItem(query));
-  }, [setValue, activeIndex, items, onNewItem, query]);
-  useEffect(() => {
-    if (
-      inputRef.current &&
-      inputRef.current === document.activeElement &&
-      value
-    ) {
-      const index = itemToQuery(value).length;
-      inputRef.current.setSelectionRange(index, index);
-    }
-    const touchEndListener = (e: TouchEvent) => {
-      if (
-        !e.target ||
-        !menuRef.current ||
-        menuRef.current.contains(e.target as Element)
-      ) {
-        return;
-      }
-      if (!inputRef.current || inputRef.current.contains(e.target as Element)) {
-        return;
-      }
-      close();
-    };
-    document.body.addEventListener("touchend", touchEndListener);
-    return () =>
-      document.body.removeEventListener("touchend", touchEndListener);
-  }, [inputRef, menuRef, close]);
-  const Input = useMemo(() => (multiline ? TextArea : InputGroup), [multiline]);
-  return (
-    <Popover
-      portalClassName={"roamjs-autocomplete-input"}
-      targetClassName={"roamjs-autocomplete-input-target"}
-      captureDismiss={true}
-      isOpen={isOpen}
-      onOpened={open}
-      minimal
-      autoFocus={false}
-      enforceFocus={false}
-      position={PopoverPosition.BOTTOM_LEFT}
-      modifiers={{
-        flip: { enabled: false },
-        preventOverflow: { enabled: false },
-      }}
-      content={
-        <Menu className={"max-h-64 overflow-auto max-w-md"} ulRef={menuRef}>
-          {items.map((t, i) => {
-            const onClick = () => {
-              setIsTyping(false);
-              setValue(t);
-              setQuery(itemToQuery(t));
-              inputRef.current?.focus();
-            };
-            const sharedProps = {
-              onClick,
-              onTouchEnd: onClick,
-              active: activeIndex === i,
-            };
-            return renderItem ? (
-              <React.Fragment key={i}>
-                {renderItem?.({
-                  item: t,
-                  ...sharedProps,
-                })}
-              </React.Fragment>
-            ) : (
-              <MenuItem
-                text={itemToQuery(t)}
-                key={i}
-                multiline
-                {...sharedProps}
-              />
-            );
-          })}
-        </Menu>
-      }
-      target={
-        <Input
-          disabled={disabled}
-          value={query}
-          onChange={(e) => {
-            setIsTyping(true);
-            setQuery(e.target.value);
-          }}
-          autoFocus={autoFocus}
-          placeholder={placeholder}
-          onKeyDown={(e) => {
-            if (e.key === "Escape") {
-              e.stopPropagation();
-              close();
-            } else {
-              onKeyDown(e);
-            }
-          }}
-          id={id}
-          onClick={() => setIsTyping(true)}
-          onBlur={(e) => {
-            if (
-              e.relatedTarget === null ||
-              !(e.relatedTarget as HTMLElement).closest?.(
-                ".roamjs-autocomplete-input"
-              )
-            ) {
-              setIsTyping(false);
-            }
-            if (onBlur) {
-              onBlur(e.target.value);
-            }
-          }}
-          inputRef={inputRef}
-          {...(showButton
-            ? {
-                rightElement: (
-                  <Button icon={"add"} minimal onClick={() => onEnter()} />
-                ),
-              }
-            : {})}
-        />
-      }
-    />
-  );
-};
-
-export default AutocompleteInput;

package/src/components/BlockErrorBoundary.tsx

@@ -1,39 +0,0 @@
-import React from "react";
-import createBlock from "../writes/createBlock";
-
-type BlockErrorBoundaryProps = {
-  blockUid: string;
-  message: string;
-  children: React.ReactNode;
-};
-type BlockErrorBoundaryState = { hasError: boolean };
-
-class BlockErrorBoundary extends React.Component<
-  BlockErrorBoundaryProps,
-  BlockErrorBoundaryState
-> {
-  constructor(props: BlockErrorBoundaryProps) {
-    super(props);
-    this.state = { hasError: false };
-  }
-
-  static getDerivedStateFromError(): BlockErrorBoundaryState {
-    return { hasError: true };
-  }
-
-  componentDidCatch(error: Error): void {
-    createBlock({
-      node: { text: this.props.message.replace("{ERROR}", error.message) },
-      parentUid: this.props.blockUid,
-    });
-  }
-
-  render(): React.ReactNode {
-    if (this.state.hasError) {
-      return <div>Component Failed To Load</div>;
-    }
-    return this.props.children;
-  }
-}
-
-export default BlockErrorBoundary;

package/src/components/BlockInput.tsx

@@ -1,117 +0,0 @@
-import {
-  Popover,
-  PopoverPosition,
-  Menu,
-  MenuItem,
-  InputGroup,
-} from "@blueprintjs/core";
-import React, { useCallback, useMemo, useRef, useState } from "react";
-import getAllBlockUidsAndTexts from "../queries/getAllBlockUidsAndTexts";
-import useArrowKeyDown from "../hooks/useArrowKeyDown";
-
-const searchBlocksByString = (
-  q: string,
-  blocks: { text: string; uid: string }[]
-) => {
-  const regex = new RegExp(q, "i");
-  return blocks.filter((a) => regex.test(a.text)).slice(0, 9);
-};
-
-const BlockInput = ({
-  value,
-  setValue,
-  onBlur,
-  onConfirm,
-  getAllBlocks = getAllBlockUidsAndTexts,
-  autoFocus,
-}: {
-  value: string;
-  setValue: (q: string, uid?: string) => void;
-  onBlur?: (v: string) => void;
-  onConfirm?: () => void;
-  getAllBlocks?: () => { text: string; uid: string }[];
-  autoFocus?: boolean;
-}): React.ReactElement => {
-  const [isOpen, setIsOpen] = useState(false);
-  const open = useCallback(() => setIsOpen(true), [setIsOpen]);
-  const close = useCallback(() => setIsOpen(false), [setIsOpen]);
-  const allBlocks = useMemo(getAllBlocks, []);
-  const items = useMemo(
-    () => (value && isOpen ? searchBlocksByString(value, allBlocks) : []),
-    [value, allBlocks]
-  );
-  const menuRef = useRef<HTMLUListElement>(null);
-  const inputRef = useRef<HTMLInputElement>(null);
-  const { activeIndex, onKeyDown } = useArrowKeyDown({
-    onEnter: (value) => {
-      if (isOpen) {
-        setValue(value.text, value.uid);
-        close();
-      } else if (onConfirm) {
-        onConfirm();
-      }
-    },
-    results: items,
-    menuRef,
-  });
-  return (
-    <Popover
-      portalClassName={"roamjs-block-input"}
-      targetClassName={"roamjs-block-input-target"}
-      captureDismiss={true}
-      isOpen={isOpen}
-      onOpened={open}
-      minimal={true}
-      autoFocus={false}
-      enforceFocus={false}
-      position={PopoverPosition.BOTTOM_LEFT}
-      modifiers={{
-        flip: { enabled: false },
-        preventOverflow: { enabled: false },
-      }}
-      content={
-        <Menu className={"max-h-64 overflow-auto max-w-md"} ulRef={menuRef}>
-          {items.map((t, i) => (
-            <MenuItem
-              text={t.text}
-              active={activeIndex === i}
-              key={t.uid}
-              multiline
-              onClick={() => {
-                setValue(t.text, t.uid);
-                close();
-                inputRef.current?.focus();
-              }}
-            />
-          ))}
-        </Menu>
-      }
-      target={
-        <InputGroup
-          value={value || ""}
-          onChange={(e: React.ChangeEvent<HTMLInputElement>) => {
-            setValue(e.target.value);
-            setIsOpen(!!e.target.value);
-          }}
-          placeholder={"Search for a block"}
-          onKeyDown={onKeyDown}
-          onBlur={(e) => {
-            if (
-              e.relatedTarget &&
-              !(e.relatedTarget as HTMLElement).closest?.(".roamjs-block-input")
-            ) {
-              close();
-            }
-            if (onBlur) {
-              onBlur(e.target.value);
-            }
-          }}
-          inputRef={inputRef}
-          autoFocus={autoFocus}
-        />
-      }
-    />
-  );
-};
-
-export default BlockInput;

package/src/components/ComponentContainer.tsx

@@ -1,70 +0,0 @@
-import { Button } from "@blueprintjs/core";
-import React, { useCallback, useState } from "react";
-import getUidsFromId from "../dom/getUidsFromId";
-import getBlockUidFromTarget from "../dom/getBlockUidFromTarget";
-import renderWithUnmount from "../util/renderWithUnmount";
-import { OnloadArgs } from "../types/native";
-
-const ComponentContainer: React.FunctionComponent<{
-  blockId?: string;
-  className?: string;
-  children?: React.ReactNode;
-}> = ({ blockId, className, children }) => {
-  const [showIcons, setShowIcons] = useState(false);
-  const appear = useCallback(() => setShowIcons(true), [setShowIcons]);
-  const disappear = useCallback(() => setShowIcons(false), [setShowIcons]);
-
-  const { blockUid, windowId } = getUidsFromId(blockId);
-  return (
-    <div
-      className={className}
-      onMouseOver={appear}
-      onMouseLeave={disappear}
-      style={{ position: "relative", width: "fit-content", minWidth: 300 }}
-    >
-      {showIcons && (
-        <div className={"roamjs-edit-component absolute top-2 right-2 z-50"}>
-          {blockId && (
-            <Button
-              icon="edit"
-              minimal
-              onClick={() =>
-                window.roamAlphaAPI.ui.setBlockFocusAndSelection({
-                  location: { "block-uid": blockUid, "window-id": windowId },
-                })
-              }
-            />
-          )}
-        </div>
-      )}
-      {children}
-    </div>
-  );
-};
-
-export const createComponentRender =
-  (
-    Fc: (props: { blockUid: string }) => React.ReactElement,
-    className?: string
-  ) =>
-  (b: HTMLButtonElement, args?: OnloadArgs): void => {
-    if (b.parentElement) {
-      b.parentElement.onmousedown = (e: MouseEvent) => e.stopPropagation();
-      const blockUid = getBlockUidFromTarget(b);
-      const possibleBlockId = b.closest(".roam-block")?.id;
-      const blockId = possibleBlockId?.endsWith?.(blockUid)
-        ? possibleBlockId
-        : undefined;
-      if (blockUid) {
-        renderWithUnmount(
-          <ComponentContainer blockId={blockId} className={className}>
-            <Fc blockUid={blockUid} />
-          </ComponentContainer>,
-          b.parentElement,
-          args
-        );
-      }
-    }
-  };
-
-export default ComponentContainer;