@atlaskit/prosemirror-input-rules 2.1.7 → 2.1.9

package/CHANGELOG.md

@@ -1,5 +1,18 @@
 # @atlaskit/prosemirror-input-rules
 
+## 2.1.9
+
+### Patch Changes
+
+- [`0606572f9b8`](https://bitbucket.org/atlassian/atlassian-frontend/commits/0606572f9b8) - [ux] ED-15348 docs(changeset): ED-15348 Fix a bug preventing typeahead actions to be fired from a gap cursor. Typing a typeahead trigger key (/, : or @) should pop-up a typeahead menu. However, if the current selection is inside a gap cursor, the trigger character is inserted and the pop-up menu doesn't open. This changeset fixes that.
+- Updated dependencies
+
+## 2.1.8
+
+### Patch Changes
+
+- Updated dependencies
+
 ## 2.1.7
 
 ### Patch Changes

package/dist/cjs/handler.js

@@ -9,6 +9,8 @@ exports.createInputEventHandler = void 0;
 
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
 
+var _selection = require("@atlaskit/editor-common/selection");
+
 var _constants = require("./constants");
 
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
@@ -87,8 +89,16 @@ function findMatchOnRules(_ref3) {
       state = _ref3.state;
 
   for (var i = 0; i < rules.length; i++) {
-    var rule = rules[i];
-    var match = rule.match.exec(textBefore);
+    var _textBefore$at;
+
+    var rule = rules[i]; // Some plugins like Typeahead require a whitespace before a trigger character.
+    // We want them to fire inside a gap cursor. Yet, a gap cursor is not considered a whitespace,
+    // and `textBefore` contains the text in the previous block before the gap cursor.
+    // Here is a workaround: if we inside a gap cursor, match the input rule only against the last typed character
+    // (which may be a typeahead trigger) and ignore the rest.
+
+    var matchString = state.selection instanceof _selection.GapCursorSelection ? (_textBefore$at = textBefore.at(-1)) !== null && _textBefore$at !== void 0 ? _textBefore$at : '' : textBefore;
+    var match = rule.match.exec(matchString);
 
     if (!match) {
       continue;

package/dist/cjs/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/prosemirror-input-rules",
-	"version": "2.1.7",
+	"version": "2.1.9",
 	"sideEffects": false
 }

package/dist/es2019/handler.js

@@ -1,3 +1,4 @@
+import { GapCursorSelection } from '@atlaskit/editor-common/selection';
 import { leafNodeReplacementCharacter, MAX_REGEX_MATCH, TEXT_INPUT_RULE_TRANSACTION_KEY } from './constants';
 export const createInputEventHandler = ({
   rules,
@@ -68,8 +69,16 @@ function findMatchOnRules({
   state
 }) {
   for (let i = 0; i < rules.length; i++) {
-    const rule = rules[i];
-    const match = rule.match.exec(textBefore);
+    var _textBefore$at;
+
+    const rule = rules[i]; // Some plugins like Typeahead require a whitespace before a trigger character.
+    // We want them to fire inside a gap cursor. Yet, a gap cursor is not considered a whitespace,
+    // and `textBefore` contains the text in the previous block before the gap cursor.
+    // Here is a workaround: if we inside a gap cursor, match the input rule only against the last typed character
+    // (which may be a typeahead trigger) and ignore the rest.
+
+    const matchString = state.selection instanceof GapCursorSelection ? (_textBefore$at = textBefore.at(-1)) !== null && _textBefore$at !== void 0 ? _textBefore$at : '' : textBefore;
+    const match = rule.match.exec(matchString);
 
     if (!match) {
       continue;

package/dist/es2019/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/prosemirror-input-rules",
-	"version": "2.1.7",
+	"version": "2.1.9",
 	"sideEffects": false
 }

package/dist/esm/handler.js

@@ -4,6 +4,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (O
 
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
 
+import { GapCursorSelection } from '@atlaskit/editor-common/selection';
 import { leafNodeReplacementCharacter, MAX_REGEX_MATCH, TEXT_INPUT_RULE_TRANSACTION_KEY } from './constants';
 export var createInputEventHandler = function createInputEventHandler(_ref) {
   var rules = _ref.rules,
@@ -75,8 +76,16 @@ function findMatchOnRules(_ref3) {
       state = _ref3.state;
 
   for (var i = 0; i < rules.length; i++) {
-    var rule = rules[i];
-    var match = rule.match.exec(textBefore);
+    var _textBefore$at;
+
+    var rule = rules[i]; // Some plugins like Typeahead require a whitespace before a trigger character.
+    // We want them to fire inside a gap cursor. Yet, a gap cursor is not considered a whitespace,
+    // and `textBefore` contains the text in the previous block before the gap cursor.
+    // Here is a workaround: if we inside a gap cursor, match the input rule only against the last typed character
+    // (which may be a typeahead trigger) and ignore the rest.
+
+    var matchString = state.selection instanceof GapCursorSelection ? (_textBefore$at = textBefore.at(-1)) !== null && _textBefore$at !== void 0 ? _textBefore$at : '' : textBefore;
+    var match = rule.match.exec(matchString);
 
     if (!match) {
       continue;

package/dist/esm/version.json

@@ -1,5 +1,5 @@
 {
 	"name": "@atlaskit/prosemirror-input-rules",
-	"version": "2.1.7",
+	"version": "2.1.9",
 	"sideEffects": false
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@atlaskit/prosemirror-input-rules",
-  "version": "2.1.7",
+  "version": "2.1.9",
   "description": "A package that contains helpers to create autoformatting rules for ProseMirror",
   "publishConfig": {
     "registry": "https://registry.npmjs.org/"
@@ -19,13 +19,13 @@
     "releaseModel": "scheduled"
   },
   "dependencies": {
-    "@atlaskit/editor-common": "^69.0.0",
+    "@atlaskit/editor-common": "^71.0.0",
     "@babel/runtime": "^7.0.0",
     "prosemirror-state": "1.3.4"
   },
   "devDependencies": {
-    "@atlaskit/adf-schema": "^23.2.0",
-    "@atlaskit/editor-test-helpers": "^17.1.0",
+    "@atlaskit/adf-schema": "^24.0.0",
+    "@atlaskit/editor-test-helpers": "^17.2.0",
     "@atlassian/atlassian-frontend-prettier-config-1.0.1": "npm:@atlassian/atlassian-frontend-prettier-config@1.0.1",
     "@types/prosemirror-history": "^1.0.1",
     "@types/prosemirror-model": "^1.11.0",
@@ -41,7 +41,10 @@
       "import-structure": "atlassian-conventions"
     },
     "@repo/internal": {
-      "deprecation": "no-deprecated-imports"
+      "deprecation": "no-deprecated-imports",
+      "styling": [
+        "emotion"
+      ]
     }
   },
   "af:exports": {

package/report.api.md

@@ -1,57 +1,82 @@
+<!-- API Report Version: 2.2 -->
+
 ## API Report File for "@atlaskit/prosemirror-input-rules"
 
-> Do not edit this file. It is a report generated by [API Extractor](https://api-extractor.com/).
+> Do not edit this file. This report is auto-generated using [API Extractor](https://api-extractor.com/).
+> [Learn more about API reports](https://hello.atlassian.net/wiki/spaces/UR/pages/1825484529/Package+API+Reports)
+
+### Table of contents
+
+- [Main Entry Types](#main-entry-types)
+
+### Main Entry Types
+
+<!--SECTION START: Main Entry Types-->
 
 ```ts
 import type { EditorState } from 'prosemirror-state';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import type { Transaction } from 'prosemirror-state';
 
-export declare function createInputRulePlugin(
+// @public (undocumented)
+export function createInputRulePlugin(
   pluginName: string,
   rules: InputRuleWrapper[],
   options?: Options,
 ): SafePlugin;
 
-export declare type InputRuleHandler = (
+// @public (undocumented)
+export type InputRuleHandler = (
   state: EditorState,
   matchResult: RegExpExecArray,
   start: number,
   end: number,
 ) => Transaction | null;
 
-export declare interface InputRuleWrapper {
-  match: RegExp;
+// @public (undocumented)
+export interface InputRuleWrapper {
+  // (undocumented)
   handler: InputRuleHandler;
+  // (undocumented)
+  match: RegExp;
+  // (undocumented)
   onHandlerApply?: OnHandlerApply;
 }
 
-export declare const leafNodeReplacementCharacter = '\uFFFC';
+// @public (undocumented)
+export const leafNodeReplacementCharacter = '\uFFFC';
 
-export declare const MAX_REGEX_MATCH = 500;
+// @public (undocumented)
+export const MAX_REGEX_MATCH = 500;
 
-declare type OnBeforeRegexMatch = (tr: Transaction) => void;
+// @public (undocumented)
+type OnBeforeRegexMatch = (tr: Transaction) => void;
 
-export declare type OnHandlerApply = (
+// @public (undocumented)
+export type OnHandlerApply = (
   state: EditorState,
   tr: Transaction,
   matchResult: RegExpExecArray,
 ) => void;
 
-export declare type OnInputEvent = (props: {
+// @public (undocumented)
+export type OnInputEvent = (props: {
   state: EditorState;
   from: number;
   to: number;
 }) => boolean;
 
-declare type Options = {
+// @public (undocumented)
+type Options = {
   allowInsertTextOnDocument?: boolean;
   onInputEvent?: OnInputEvent;
   onBeforeRegexMatch?: OnBeforeRegexMatch;
 };
 
-export declare const TEXT_INPUT_RULE_TRANSACTION_KEY =
-  'input_rule_plugin_transaction';
+// @public (undocumented)
+export const TEXT_INPUT_RULE_TRANSACTION_KEY = 'input_rule_plugin_transaction';
 
-export {};
+// (No @packageDocumentation comment for this package)
 ```
+
+<!--SECTION END: Main Entry Types-->

package/src/handler.ts

@@ -1,5 +1,7 @@
 import type { EditorState, PluginKey, Transaction } from 'prosemirror-state';
 
+import { GapCursorSelection } from '@atlaskit/editor-common/selection';
+
 import {
   leafNodeReplacementCharacter,
   MAX_REGEX_MATCH,
@@ -22,65 +24,67 @@ type Options = {
   onBeforeRegexMatch?: OnBeforeRegexMatch;
 };
 
-export const createInputEventHandler = ({
-  rules,
-  pluginKey,
-  allowInsertTextOnDocument,
-  onInputEvent,
-  onBeforeRegexMatch,
-}: Options): HandleInputEvent => ({ view, from, to, text }) => {
-  if (view.composing) {
-    return false;
-  }
+export const createInputEventHandler =
+  ({
+    rules,
+    pluginKey,
+    allowInsertTextOnDocument,
+    onInputEvent,
+    onBeforeRegexMatch,
+  }: Options): HandleInputEvent =>
+  ({ view, from, to, text }) => {
+    if (view.composing) {
+      return false;
+    }
 
-  const state = view.state;
-  const $from = state.doc.resolve(from);
+    const state = view.state;
+    const $from = state.doc.resolve(from);
 
-  if ($from.parent.type.spec.code) {
-    return false;
-  }
-  if (onInputEvent && !onInputEvent({ state, from, to })) {
-    return false;
-  }
+    if ($from.parent.type.spec.code) {
+      return false;
+    }
+    if (onInputEvent && !onInputEvent({ state, from, to })) {
+      return false;
+    }
 
-  const textBefore =
-    $from.parent.textBetween(
-      Math.max(0, $from.parentOffset - MAX_REGEX_MATCH),
-      $from.parentOffset,
-      undefined,
-      leafNodeReplacementCharacter,
-    ) + text;
+    const textBefore =
+      $from.parent.textBetween(
+        Math.max(0, $from.parentOffset - MAX_REGEX_MATCH),
+        $from.parentOffset,
+        undefined,
+        leafNodeReplacementCharacter,
+      ) + text;
 
-  const result = findMatchOnRules({
-    rules,
-    textBefore,
-    from,
-    to,
-    state,
-  });
-
-  if (!result) {
-    return false;
-  }
+    const result = findMatchOnRules({
+      rules,
+      textBefore,
+      from,
+      to,
+      state,
+    });
 
-  const tr = allowInsertTextOnDocument
-    ? state.tr.insertText(text, from, to)
-    : state.tr;
-  tr.setMeta(TEXT_INPUT_RULE_TRANSACTION_KEY, true);
-  tr.setMeta(pluginKey, {
-    textInserted: text,
-    from: result.from,
-    to: result.to,
-    matchedRule: result.matchedRule,
-  } as InputRulePluginState);
-
-  if (onBeforeRegexMatch) {
-    onBeforeRegexMatch(tr);
-  }
+    if (!result) {
+      return false;
+    }
 
-  view.dispatch(tr);
-  return true;
-};
+    const tr = allowInsertTextOnDocument
+      ? state.tr.insertText(text, from, to)
+      : state.tr;
+    tr.setMeta(TEXT_INPUT_RULE_TRANSACTION_KEY, true);
+    tr.setMeta(pluginKey, {
+      textInserted: text,
+      from: result.from,
+      to: result.to,
+      matchedRule: result.matchedRule,
+    } as InputRulePluginState);
+
+    if (onBeforeRegexMatch) {
+      onBeforeRegexMatch(tr);
+    }
+
+    view.dispatch(tr);
+    return true;
+  };
 
 type FindMatchOnRulesProps = {
   rules: InputRuleWrapper[];
@@ -103,7 +107,18 @@ function findMatchOnRules({
 }: FindMatchOnRulesProps): RuleMatchedResult | null {
   for (let i = 0; i < rules.length; i++) {
     const rule = rules[i];
-    const match = rule.match.exec(textBefore);
+
+    // Some plugins like Typeahead require a whitespace before a trigger character.
+    // We want them to fire inside a gap cursor. Yet, a gap cursor is not considered a whitespace,
+    // and `textBefore` contains the text in the previous block before the gap cursor.
+    // Here is a workaround: if we inside a gap cursor, match the input rule only against the last typed character
+    // (which may be a typeahead trigger) and ignore the rest.
+    const matchString: string =
+      state.selection instanceof GapCursorSelection
+        ? textBefore.at(-1) ?? ''
+        : textBefore;
+
+    const match = rule.match.exec(matchString);
     if (!match) {
       continue;
     }

package/src/plugin.ts

@@ -56,10 +56,8 @@ export function createInputRulePlugin(
         tr.getMeta(pluginKey),
       );
 
-      const pluginState:
-        | InputRulePluginState
-        | undefined
-        | null = transactionWithInputRuleMeta?.getMeta(pluginKey);
+      const pluginState: InputRulePluginState | undefined | null =
+        transactionWithInputRuleMeta?.getMeta(pluginKey);
 
       if (!pluginState || !transactionWithInputRuleMeta) {
         return null;

package/tsconfig.json

@@ -1,7 +1,6 @@
 {
   "extends": "../../../tsconfig.json",
   "compilerOptions": {
-    "noImplicitAny": true,
     "baseUrl": "./"
   },
   "include": [