@plasmicpkgs/tiptap 0.0.1

package/skinny/registerMention.cjs.js

@@ -0,0 +1,420 @@
+'use strict';
+
+var host = require('@plasmicapp/host');
+var TiptapMention = require('@tiptap/extension-mention');
+var react = require('@tiptap/react');
+var React = require('react');
+var tippy = require('tippy.js');
+var registerTiptap = require('./registerTiptap-fd9bf882.cjs.js');
+require('@tiptap/extension-document');
+require('@tiptap/extension-paragraph');
+require('@tiptap/extension-text');
+require('antd');
+require('@plasmicapp/host/registerComponent');
+require('@plasmicapp/host/registerGlobalContext');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var TiptapMention__default = /*#__PURE__*/_interopDefault(TiptapMention);
+var React__default = /*#__PURE__*/_interopDefault(React);
+var tippy__default = /*#__PURE__*/_interopDefault(tippy);
+
+var MentionList = React.forwardRef(
+  (props, ref) => {
+    const [selectedIndex, setSelectedIndex] = React.useState(0);
+    const {
+      items = [],
+      suggestionItem,
+      searchField,
+      popupClassName,
+      itemClassName,
+      selectedItemClassName
+    } = props;
+    const selectItem = (index) => {
+      var _a;
+      const item = items[index];
+      if (item) {
+        (_a = props.command) == null ? void 0 : _a.call(props, { id: item[searchField] });
+      }
+    };
+    const upHandler = () => {
+      setSelectedIndex((selectedIndex + (items == null ? void 0 : items.length) - 1) % items.length);
+    };
+    const downHandler = () => {
+      setSelectedIndex((selectedIndex + 1) % items.length);
+    };
+    const enterHandler = () => {
+      selectItem(selectedIndex);
+    };
+    React.useEffect(() => setSelectedIndex(0), [items]);
+    React.useImperativeHandle(ref, () => ({
+      onKeyDown: (event) => {
+        if (event.key === "ArrowUp") {
+          upHandler();
+          return true;
+        }
+        if (event.key === "ArrowDown") {
+          downHandler();
+          return true;
+        }
+        if (event.key === "Enter") {
+          enterHandler();
+          return true;
+        }
+        return false;
+      }
+    }));
+    const css = `
+    .SuggestionsList {
+        background: #eee;
+        position: relative;
+        border-radius: 0.5rem;
+
+      & .item {
+        display: block;
+        width: 100%;
+
+        & .is-selected {
+          color: purple;
+        }
+      }
+    }
+
+    `;
+    const hasSuggestionItemSlot = suggestionItem == null ? void 0 : suggestionItem.props.children;
+    return /* @__PURE__ */ React__default.default.createElement("div", { className: `SuggestionsList` }, /* @__PURE__ */ React__default.default.createElement("div", { className: popupClassName }, props.items.length ? props.items.map((item, index) => /* @__PURE__ */ React__default.default.createElement(
+      "div",
+      {
+        role: "button",
+        className: `item`,
+        key: index,
+        onClick: () => selectItem(index)
+      },
+      /* @__PURE__ */ React__default.default.createElement(
+        host.DataProvider,
+        {
+          key: item[searchField],
+          name: "suggestionItem",
+          data: item
+        },
+        /* @__PURE__ */ React__default.default.createElement(
+          "div",
+          {
+            className: `${itemClassName} ${index === selectedIndex ? "is-selected" : ""}`
+          },
+          /* @__PURE__ */ React__default.default.createElement(
+            "div",
+            {
+              className: index === selectedIndex ? selectedItemClassName : ""
+            },
+            hasSuggestionItemSlot ? host.repeatedElement(index === 0, suggestionItem) : item[searchField]
+          )
+        )
+      )
+    )) : /* @__PURE__ */ React__default.default.createElement("div", { className: "item" }, "No result")), /* @__PURE__ */ React__default.default.createElement("style", { dangerouslySetInnerHTML: { __html: css } }));
+  }
+);
+
+var __defProp = Object.defineProperty;
+var __getOwnPropSymbols = Object.getOwnPropertySymbols;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __propIsEnum = Object.prototype.propertyIsEnumerable;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __spreadValues = (a, b) => {
+  for (var prop in b || (b = {}))
+    if (__hasOwnProp.call(b, prop))
+      __defNormalProp(a, prop, b[prop]);
+  if (__getOwnPropSymbols)
+    for (var prop of __getOwnPropSymbols(b)) {
+      if (__propIsEnum.call(b, prop))
+        __defNormalProp(a, prop, b[prop]);
+    }
+  return a;
+};
+function Mention(props) {
+  const {
+    dataStatic = [],
+    dataDynamic,
+    hasDataDynamic,
+    suggestionItem,
+    searchField = "id",
+    popupClassName,
+    itemClassName,
+    selectedItemClassName,
+    mentionClassName,
+    maxSuggestionCount = 5
+  } = props;
+  const dataDynamicRef = React.useRef(dataDynamic);
+  const hasDataDynamicRef = React.useRef(hasDataDynamic);
+  const maxSuggestionCountRef = React.useRef(maxSuggestionCount);
+  dataDynamicRef.current = dataDynamic;
+  hasDataDynamicRef.current = hasDataDynamic;
+  maxSuggestionCountRef.current = maxSuggestionCount;
+  const { setMention } = registerTiptap.useTiptapContext();
+  React.useEffect(() => {
+    setMention(
+      TiptapMention__default.default.configure({
+        HTMLAttributes: {
+          class: mentionClassName
+        },
+        renderLabel: ({ options, node }) => {
+          return `${options.suggestion.char}${node.attrs.id}`;
+        },
+        suggestion: {
+          /**
+           * This function below only does static filtering. It can't give query parameters to the Plasmic query for filtering at the server side to avoid some complexities.
+           *
+           * Before we move on to the issues, lets first explain how it could have supported server-side filtering via query params:
+           * - The user creates a plasmic query to fetch the suggestions. These suggestions are filtered by some query parameter. The value of the query parameter is bound to the currentMention state.
+           *
+           * - When the user types `@abc` for example, the following async function `items` is triggered. It knows the query and returns the new set of suggestions. The returned array is rendered in the suggestions popup
+           *
+           * Issues:
+           * 1. Stale Query issue:
+           * The same async function is responsible for setting the currentMention state, and also return the new suggestion results. We can't await the Plasmic query after it is triggered by the currentMention state change. So query results it has are stale.
+           *
+           * Solution: We poll the Plasmic query's isLoading field (indefinitely)
+           *
+           * For simplicity, therefore, we are just supporting static filtering for now, and may consider the approach highlighted above for filtering via query params.
+           *
+           * 2. The async function is provided at the time of extension initialization. That async function only knows the state/props in its render cycle, so these props are outdated at the time the async function is triggered.
+           *
+           * We can't put all of them in the useEffect dependencies array, because change in any of them will cause the Mention extension to be removed/re-added, resulting in a flicker on every keystroke + lost input focus (which causes the suggestion popup to never show)
+           *
+           * Solution: Use refs
+           *
+           * @param param0
+           * @returns
+           */
+          items: ({ query }) => {
+            var _a, _b;
+            if (!query)
+              return [];
+            if (!hasDataDynamicRef.current) {
+              const res = (dataStatic == null ? void 0 : dataStatic.filter(
+                (item) => {
+                  var _a2, _b2, _c;
+                  return (_c = (_b2 = (_a2 = item[searchField]).toLowerCase) == null ? void 0 : _b2.call(_a2)) == null ? void 0 : _c.includes(query.toLowerCase());
+                }
+              ).slice(0, maxSuggestionCountRef.current)) || [];
+              return res;
+            }
+            if (!dataDynamicRef.current)
+              return [];
+            if (((_a = dataDynamicRef.current) == null ? void 0 : _a.isLoading) === false) {
+              const data = (_b = dataDynamicRef.current.data) == null ? void 0 : _b.response;
+              if (!Array.isArray(data))
+                return [];
+              return (data == null ? void 0 : data.filter(
+                (item) => {
+                  var _a2, _b2, _c;
+                  return (_c = (_b2 = (_a2 = item[searchField]).toLowerCase) == null ? void 0 : _b2.call(_a2)) == null ? void 0 : _c.includes(query.toLowerCase());
+                }
+              ).slice(0, maxSuggestionCountRef.current)) || [];
+            }
+            return [];
+          },
+          render: () => {
+            let component;
+            let popup;
+            const otherProps = {
+              suggestionItem,
+              searchField,
+              popupClassName,
+              itemClassName,
+              selectedItemClassName
+            };
+            return {
+              // eslint-disable-next-line no-shadow
+              onStart: (props2) => {
+                component = new react.ReactRenderer(MentionList, {
+                  props: __spreadValues(__spreadValues({}, props2), otherProps),
+                  editor: props2.editor
+                });
+                if (!props2.clientRect) {
+                  return;
+                }
+                popup = tippy__default.default("body", {
+                  getReferenceClientRect: props2.clientRect,
+                  appendTo: () => document.body,
+                  content: component.element,
+                  showOnCreate: true,
+                  interactive: true,
+                  trigger: "manual",
+                  placement: "bottom-start"
+                });
+              },
+              // eslint-disable-next-line no-shadow
+              onUpdate(props2) {
+                var _a;
+                component.updateProps(__spreadValues(__spreadValues({}, props2), otherProps));
+                if (!props2.clientRect) {
+                  return;
+                }
+                (_a = popup == null ? void 0 : popup[0]) == null ? void 0 : _a.setProps({
+                  getReferenceClientRect: props2.clientRect
+                });
+              },
+              // eslint-disable-next-line no-shadow
+              onKeyDown(props2) {
+                var _a, _b;
+                if (props2.event.key === "Escape") {
+                  (_a = popup == null ? void 0 : popup[0]) == null ? void 0 : _a.hide();
+                  return true;
+                }
+                return ((_b = component.ref) == null ? void 0 : _b.onKeyDown(props2.event)) || false;
+              },
+              onExit() {
+                var _a;
+                (_a = popup == null ? void 0 : popup[0]) == null ? void 0 : _a.destroy();
+                component.destroy();
+              }
+            };
+          }
+        }
+      })
+    );
+    return () => {
+      setMention(void 0);
+    };
+  }, [
+    searchField,
+    mentionClassName,
+    popupClassName,
+    itemClassName,
+    selectedItemClassName
+  ]);
+  const inCanvas = !!host.usePlasmicCanvasContext();
+  const providerData = React.useMemo(() => {
+    var _a, _b;
+    const noData = [{ [searchField]: "No data" }];
+    let data = inCanvas ? noData : [];
+    if (!hasDataDynamic) {
+      if ((dataStatic == null ? void 0 : dataStatic.length) && Array.isArray(dataStatic)) {
+        data = [...dataStatic];
+      }
+      return data;
+    }
+    if (!dataDynamic || dataDynamic.isLoading)
+      return noData;
+    data = (_b = (_a = dataDynamic.data) == null ? void 0 : _a.response) != null ? _b : noData;
+    if (!Array.isArray(data))
+      return noData;
+    return data.slice(0, maxSuggestionCount);
+  }, [
+    dataDynamic,
+    searchField,
+    hasDataDynamic,
+    maxSuggestionCount,
+    dataStatic
+  ]);
+  return /* @__PURE__ */ React__default.default.createElement(
+    "div",
+    {
+      style: __spreadValues({}, {
+        // bare minimum styles (that need not be overridden)
+        // We just want to make the dataProvider data available to the MentionList component (<DataProvider> is needed to be returned from the returned JSX). It should not be shown in the UI, hence the display: none
+        display: "none",
+        position: "absolute",
+        top: 0,
+        background: "white"
+      })
+    },
+    providerData == null ? void 0 : providerData.slice(0, maxSuggestionCount).map((item, index) => {
+      var _a;
+      return (
+        // Data provider needs to be in the returned JSX (the actual use of the "suggestionItem" data is in the MentionList component.)
+        /* @__PURE__ */ React__default.default.createElement(host.DataProvider, { key: item.id, name: "suggestionItem", data: item }, (_a = host.repeatedElement(index === 0, suggestionItem)) != null ? _a : item[searchField])
+      );
+    })
+  );
+}
+Mention.displayName = "Mention";
+function registerMention(loader) {
+  registerTiptap.registerComponentHelper(loader, Mention, {
+    name: `${registerTiptap.TIPTAP_COMPONENT_NAME}-extension-mention`,
+    displayName: "Tiptap Mention",
+    providesData: true,
+    props: {
+      dataDynamic: {
+        type: "dataSourceOpData",
+        description: "Filtered suggestions",
+        disableDynamicValue: true,
+        // we don't want the users to temper with the Plasmic's default query type.
+        hidden: (ps) => !ps.hasDataDynamic
+      },
+      searchField: {
+        type: "string",
+        defaultValueHint: "id"
+      },
+      maxSuggestionCount: {
+        type: "number",
+        defaultValueHint: 5,
+        description: "Limits the number of suggestions that appear in the suggestions popup"
+      },
+      dataStatic: {
+        type: "array",
+        hidden: (ps) => Boolean(ps.hasDataDynamic),
+        itemType: {
+          type: "object",
+          nameFunc: (item) => item.label,
+          fields: {
+            id: "string",
+            label: "string"
+          }
+        },
+        defaultValue: [
+          {
+            id: "thomasEd1",
+            label: "Thomas Edison"
+          },
+          {
+            id: "sherlock221b",
+            label: "Sherlock Holmes"
+          },
+          {
+            id: "eliot_thomas",
+            label: "T.S Eliot"
+          },
+          {
+            id: "shakespeare74",
+            label: "William Shakespeare"
+          }
+        ]
+      },
+      hasDataDynamic: {
+        type: "boolean"
+      },
+      mentionClassName: {
+        type: "class",
+        displayName: "Mention label"
+      },
+      popupClassName: {
+        type: "class",
+        displayName: "Suggestion Popup"
+      },
+      itemClassName: {
+        type: "class",
+        displayName: "Suggestion Item"
+      },
+      selectedItemClassName: {
+        type: "class",
+        displayName: "Selected Item"
+      },
+      suggestionItem: {
+        type: "slot"
+      },
+      currentMention: {
+        type: "string",
+        hidden: () => true
+      }
+    },
+    importName: "Mention",
+    importPath: "@plasmicpkgs/tiptap/skinny/registerMention",
+    parentComponentName: registerTiptap.TIPTAP_COMPONENT_NAME
+  });
+}
+
+exports.Mention = Mention;
+exports.registerMention = registerMention;
+//# sourceMappingURL=registerMention.cjs.js.map

package/skinny/registerMention.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"registerMention.cjs.js","sources":["../src/components/MentionList.tsx","../src/registerMention.tsx"],"sourcesContent":["import { DataProvider, repeatedElement } from \"@plasmicapp/host\";\nimport { SuggestionProps } from \"@tiptap/suggestion\";\nimport React, {\n  forwardRef,\n  useEffect,\n  useImperativeHandle,\n  useState,\n} from \"react\";\n\ntype MentionListProps = SuggestionProps<any> & {\n  suggestionItem: React.ReactNode;\n  searchField: string;\n  popupClassName: string;\n  itemClassName: string;\n  selectedItemClassName: string;\n};\n\nexport default forwardRef(\n  (\n    props: MentionListProps,\n    ref: React.ForwardedRef<{ onKeyDown: (e: KeyboardEvent) => boolean }>\n  ) => {\n    const [selectedIndex, setSelectedIndex] = useState(0);\n    const {\n      items = [],\n      suggestionItem,\n      searchField,\n      popupClassName,\n      itemClassName,\n      selectedItemClassName,\n    } = props;\n\n    const selectItem = (index: number) => {\n      const item = items[index];\n\n      if (item) {\n        props.command?.({ id: item[searchField] });\n      }\n    };\n\n    const upHandler = () => {\n      setSelectedIndex((selectedIndex + items?.length - 1) % items.length);\n    };\n\n    const downHandler = () => {\n      setSelectedIndex((selectedIndex + 1) % items.length);\n    };\n\n    const enterHandler = () => {\n      selectItem(selectedIndex);\n    };\n\n    useEffect(() => setSelectedIndex(0), [items]);\n\n    useImperativeHandle(ref, () => ({\n      onKeyDown: (event) => {\n        if (event.key === \"ArrowUp\") {\n          upHandler();\n          return true;\n        }\n\n        if (event.key === \"ArrowDown\") {\n          downHandler();\n          return true;\n        }\n\n        if (event.key === \"Enter\") {\n          enterHandler();\n          return true;\n        }\n\n        return false;\n      },\n    }));\n\n    // bare minimum styles that can easily be overridden.\n    const css = `\n    .SuggestionsList {\n        background: #eee;\n        position: relative;\n        border-radius: 0.5rem;\n\n      & .item {\n        display: block;\n        width: 100%;\n\n        & .is-selected {\n          color: purple;\n        }\n      }\n    }\n\n    `;\n\n    const hasSuggestionItemSlot = (suggestionItem as any)?.props.children;\n    return (\n      <div className={`SuggestionsList`}>\n        <div className={popupClassName}>\n          {props.items.length ? (\n            props.items.map((item, index: number) => (\n              <div\n                role=\"button\"\n                className={`item`}\n                key={index}\n                onClick={() => selectItem(index)}\n              >\n                <DataProvider\n                  key={item[searchField]}\n                  name={\"suggestionItem\"}\n                  data={item}\n                >\n                  <div\n                    className={`${itemClassName} ${\n                      index === selectedIndex ? \"is-selected\" : \"\"\n                    }`}\n                  >\n                    <div\n                      /**\n                       * override styles from is-selected.\n                       * Reason: The styles added by Plasmic user via the Design tab in the studio have low-proiorty selectors\n                       * compared to the default styles defined above. And we do not have a choice on the selector either, so its not possible to increase its selector priority\n                       * What we do here though is add a child div with the className that should be able to overWrite the default styles instead.\n                       */\n                      className={\n                        index === selectedIndex ? selectedItemClassName : \"\"\n                      }\n                    >\n                      {hasSuggestionItemSlot\n                        ? repeatedElement(index === 0, suggestionItem)\n                        : item[searchField]}\n                    </div>\n                  </div>\n                </DataProvider>\n              </div>\n            ))\n          ) : (\n            <div className=\"item\">No result</div>\n          )}\n        </div>\n        <style dangerouslySetInnerHTML={{ __html: css }} />\n      </div>\n    );\n  }\n);\n","import {\n  DataProvider,\n  repeatedElement,\n  usePlasmicCanvasContext,\n} from \"@plasmicapp/host\";\nimport TiptapMention, { MentionOptions } from \"@tiptap/extension-mention\";\nimport { ReactRenderer } from \"@tiptap/react\";\nimport React, { useEffect, useMemo, useRef } from \"react\";\nimport tippy, { GetReferenceClientRect, Instance, Props } from \"tippy.js\";\nimport MentionList from \"./components/MentionList\";\nimport { useTiptapContext } from \"./contexts\";\nimport { TIPTAP_COMPONENT_NAME } from \"./registerTiptap\";\nimport { Registerable, registerComponentHelper } from \"./utils\";\n\nexport type QueryResult = {\n  data?: { response: any[] };\n  error?: Error;\n  isLoading?: boolean;\n};\n\nexport type MentionProps = Omit<MentionOptions, \"HTMLAttributes\"> & {\n  className: string;\n  dataStatic?: any[];\n  hasDataDynamic?: boolean;\n  dataDynamic?: QueryResult;\n  suggestionItem: React.ReactNode;\n  searchField?: string;\n  popupClassName?: string;\n  itemClassName?: string;\n  selectedItemClassName?: string;\n  mentionClassName?: string;\n  maxSuggestionCount?: number;\n};\n\nexport function Mention(props: MentionProps) {\n  const {\n    dataStatic = [],\n    dataDynamic,\n    hasDataDynamic,\n    suggestionItem,\n    searchField = \"id\",\n    popupClassName,\n    itemClassName,\n    selectedItemClassName,\n    mentionClassName,\n    maxSuggestionCount = 5,\n  } = props;\n\n  /**\n   * Although refs should be sparingly used, we need all these refs here due to the way tiptap works:\n   *\n   * It needs to be passed the async function that returns the suggestion items, when the extension is initialized (ie. in the .configure() call). Whenever there is a need for new suggestions, the same async callback is called. Without refs, that callback would always use stale data. That is why we absolutely need these here.\n   */\n  const dataDynamicRef = useRef(dataDynamic);\n  const hasDataDynamicRef = useRef(hasDataDynamic);\n  const maxSuggestionCountRef = useRef(maxSuggestionCount);\n  dataDynamicRef.current = dataDynamic;\n  hasDataDynamicRef.current = hasDataDynamic;\n  maxSuggestionCountRef.current = maxSuggestionCount;\n\n  const { setMention } = useTiptapContext();\n  useEffect(() => {\n    setMention(\n      TiptapMention.configure({\n        HTMLAttributes: {\n          class: mentionClassName,\n        },\n        renderLabel: ({ options, node }) => {\n          return `${options.suggestion.char}${node.attrs.id}`;\n        },\n        suggestion: {\n          /**\n           * This function below only does static filtering. It can't give query parameters to the Plasmic query for filtering at the server side to avoid some complexities.\n           *\n           * Before we move on to the issues, lets first explain how it could have supported server-side filtering via query params:\n           * - The user creates a plasmic query to fetch the suggestions. These suggestions are filtered by some query parameter. The value of the query parameter is bound to the currentMention state.\n           *\n           * - When the user types `@abc` for example, the following async function `items` is triggered. It knows the query and returns the new set of suggestions. The returned array is rendered in the suggestions popup\n           *\n           * Issues:\n           * 1. Stale Query issue:\n           * The same async function is responsible for setting the currentMention state, and also return the new suggestion results. We can't await the Plasmic query after it is triggered by the currentMention state change. So query results it has are stale.\n           *\n           * Solution: We poll the Plasmic query's isLoading field (indefinitely)\n           *\n           * For simplicity, therefore, we are just supporting static filtering for now, and may consider the approach highlighted above for filtering via query params.\n           *\n           * 2. The async function is provided at the time of extension initialization. That async function only knows the state/props in its render cycle, so these props are outdated at the time the async function is triggered.\n           *\n           * We can't put all of them in the useEffect dependencies array, because change in any of them will cause the Mention extension to be removed/re-added, resulting in a flicker on every keystroke + lost input focus (which causes the suggestion popup to never show)\n           *\n           * Solution: Use refs\n           *\n           * @param param0\n           * @returns\n           */\n          items: ({ query }: { query: string }) => {\n            if (!query) return [];\n\n            if (!hasDataDynamicRef.current) {\n              // for static data, just filter the static array and return results\n              const res =\n                dataStatic\n                  ?.filter((item) =>\n                    item[searchField]\n                      .toLowerCase?.()\n                      ?.includes(query.toLowerCase())\n                  )\n                  .slice(0, maxSuggestionCountRef.current) || [];\n              return res;\n            }\n\n            if (!dataDynamicRef.current) return [];\n\n            if (dataDynamicRef.current?.isLoading === false) {\n              const data = dataDynamicRef.current.data?.response;\n              if (!Array.isArray(data)) return [];\n              return (\n                data\n                  ?.filter((item) =>\n                    item[searchField]\n                      .toLowerCase?.()\n                      ?.includes(query.toLowerCase())\n                  )\n                  .slice(0, maxSuggestionCountRef.current) || []\n              );\n            }\n\n            return [];\n          },\n          render: () => {\n            let component: ReactRenderer<\n              { onKeyDown: (e: KeyboardEvent) => boolean },\n              typeof MentionList\n            >;\n            let popup: Instance<Props>[];\n            const otherProps = {\n              suggestionItem,\n              searchField,\n              popupClassName,\n              itemClassName,\n              selectedItemClassName,\n            };\n\n            return {\n              // eslint-disable-next-line no-shadow\n              onStart: (props) => {\n                component = new ReactRenderer<any, any>(MentionList, {\n                  props: {\n                    ...props,\n                    ...otherProps,\n                  },\n                  editor: props.editor,\n                });\n\n                if (!props.clientRect) {\n                  return;\n                }\n\n                popup = tippy(\"body\", {\n                  getReferenceClientRect:\n                    props.clientRect as GetReferenceClientRect,\n                  appendTo: () => document.body,\n                  content: component.element,\n                  showOnCreate: true,\n                  interactive: true,\n                  trigger: \"manual\",\n                  placement: \"bottom-start\",\n                });\n              },\n\n              // eslint-disable-next-line no-shadow\n              onUpdate(props) {\n                component.updateProps({\n                  ...props,\n                  ...otherProps,\n                });\n\n                if (!props.clientRect) {\n                  return;\n                }\n\n                popup?.[0]?.setProps({\n                  getReferenceClientRect:\n                    props.clientRect as GetReferenceClientRect,\n                });\n              },\n\n              // eslint-disable-next-line no-shadow\n              onKeyDown(props) {\n                if (props.event.key === \"Escape\") {\n                  popup?.[0]?.hide();\n\n                  return true;\n                }\n\n                return component.ref?.onKeyDown(props.event) || false;\n              },\n\n              onExit() {\n                popup?.[0]?.destroy();\n                component.destroy();\n              },\n            };\n          },\n        },\n      })\n    );\n    return () => {\n      setMention(undefined);\n    };\n    // add only those dependencies that are OK to trigger a flicker in the tiptap editor, while it re-initializes. ie. changes that are one-time (or not frequent / not per keystroke)\n  }, [\n    searchField,\n    mentionClassName,\n    popupClassName,\n    itemClassName,\n    selectedItemClassName,\n  ]);\n\n  const inCanvas = !!usePlasmicCanvasContext();\n\n  const providerData = useMemo(() => {\n    const noData = [{ [searchField]: \"No data\" }];\n    let data = inCanvas ? noData : [];\n    if (!hasDataDynamic) {\n      if (dataStatic?.length && Array.isArray(dataStatic)) {\n        data = [...dataStatic];\n      }\n      return data;\n    }\n\n    if (!dataDynamic || dataDynamic.isLoading) return noData;\n    data = dataDynamic.data?.response ?? noData;\n    if (!Array.isArray(data)) return noData;\n    return data.slice(0, maxSuggestionCount);\n  }, [\n    dataDynamic,\n    searchField,\n    hasDataDynamic,\n    maxSuggestionCount,\n    dataStatic,\n  ]);\n\n  return (\n    <div\n      style={{\n        // ...(showSuggestionItem ? {} : { display: \"none\" }),\n        ...{\n          // bare minimum styles (that need not be overridden)\n          // We just want to make the dataProvider data available to the MentionList component (<DataProvider> is needed to be returned from the returned JSX). It should not be shown in the UI, hence the display: none\n          display: \"none\",\n          position: \"absolute\",\n          top: 0,\n          background: \"white\",\n        },\n      }}\n    >\n      {providerData?.slice(0, maxSuggestionCount).map((item, index) => (\n        // Data provider needs to be in the returned JSX (the actual use of the \"suggestionItem\" data is in the MentionList component.)\n        <DataProvider key={item.id} name={\"suggestionItem\"} data={item}>\n          {repeatedElement(index === 0, suggestionItem) ?? item[searchField]}\n        </DataProvider>\n      ))}\n    </div>\n  );\n  // return null;\n}\nMention.displayName = \"Mention\";\n\nexport function registerMention(loader?: Registerable) {\n  registerComponentHelper(loader, Mention, {\n    name: `${TIPTAP_COMPONENT_NAME}-extension-mention`,\n    displayName: \"Tiptap Mention\",\n    providesData: true,\n    props: {\n      dataDynamic: {\n        type: \"dataSourceOpData\" as any,\n        description: \"Filtered suggestions\",\n        disableDynamicValue: true, // we don't want the users to temper with the Plasmic's default query type.\n        hidden: (ps) => !ps.hasDataDynamic,\n      },\n      searchField: {\n        type: \"string\",\n        defaultValueHint: \"id\",\n      },\n      maxSuggestionCount: {\n        type: \"number\",\n        defaultValueHint: 5,\n        description:\n          \"Limits the number of suggestions that appear in the suggestions popup\",\n      },\n      dataStatic: {\n        type: \"array\",\n        hidden: (ps) => Boolean(ps.hasDataDynamic),\n        itemType: {\n          type: \"object\",\n          nameFunc: (item) => item.label,\n          fields: {\n            id: \"string\",\n            label: \"string\",\n          },\n        },\n        defaultValue: [\n          {\n            id: \"thomasEd1\",\n            label: \"Thomas Edison\",\n          },\n          {\n            id: \"sherlock221b\",\n            label: \"Sherlock Holmes\",\n          },\n          {\n            id: \"eliot_thomas\",\n            label: \"T.S Eliot\",\n          },\n          {\n            id: \"shakespeare74\",\n            label: \"William Shakespeare\",\n          },\n        ],\n      },\n      hasDataDynamic: {\n        type: \"boolean\",\n      },\n      mentionClassName: {\n        type: \"class\",\n        displayName: \"Mention label\",\n      },\n      popupClassName: {\n        type: \"class\",\n        displayName: \"Suggestion Popup\",\n      },\n      itemClassName: {\n        type: \"class\",\n        displayName: \"Suggestion Item\",\n      },\n      selectedItemClassName: {\n        type: \"class\",\n        displayName: \"Selected Item\",\n      },\n      suggestionItem: {\n        type: \"slot\",\n      },\n      currentMention: {\n        type: \"string\",\n        hidden: () => true,\n      },\n    },\n    importName: \"Mention\",\n    importPath: \"@plasmicpkgs/tiptap/skinny/registerMention\",\n    parentComponentName: TIPTAP_COMPONENT_NAME,\n  });\n}\n"],"names":["forwardRef","useState","useEffect","useImperativeHandle","React","DataProvider","repeatedElement","useRef","useTiptapContext","TiptapMention","_a","_b","props","ReactRenderer","tippy","usePlasmicCanvasContext","useMemo","registerComponentHelper","TIPTAP_COMPONENT_NAME"],"mappings":"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"}

package/skinny/registerMention.d.ts

@@ -0,0 +1,28 @@
+import { MentionOptions } from "@tiptap/extension-mention";
+import React from "react";
+import { Registerable } from "./utils";
+export type QueryResult = {
+    data?: {
+        response: any[];
+    };
+    error?: Error;
+    isLoading?: boolean;
+};
+export type MentionProps = Omit<MentionOptions, "HTMLAttributes"> & {
+    className: string;
+    dataStatic?: any[];
+    hasDataDynamic?: boolean;
+    dataDynamic?: QueryResult;
+    suggestionItem: React.ReactNode;
+    searchField?: string;
+    popupClassName?: string;
+    itemClassName?: string;
+    selectedItemClassName?: string;
+    mentionClassName?: string;
+    maxSuggestionCount?: number;
+};
+export declare function Mention(props: MentionProps): React.JSX.Element;
+export declare namespace Mention {
+    var displayName: string;
+}
+export declare function registerMention(loader?: Registerable): void;