@atlaskit/editor-plugin-type-ahead 10.3.0 → 10.3.2

package/CHANGELOG.md

@@ -1,5 +1,25 @@
 # @atlaskit/editor-plugin-type-ahead
 
+## 10.3.2
+
+### Patch Changes
+
+- Updated dependencies
+
+## 10.3.1
+
+### Patch Changes
+
+- [`cf6977530a136`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cf6977530a136) -
+  Support fullwidth slash ／ (U+FF0F) as a quick insert trigger for Japanese/CJK keyboard users.
+  Japanese keyboards produce the fullwidth slash when pressing the / key, which previously did not
+  open the quick insert menu. The fix adds a `customRegex` to the quick-insert typeahead handler
+  that matches both ASCII slash `/` and fullwidth slash `／`, and extends the trigger cleanup logic
+  in `openTypeAheadAtCursor` to handle `customRegex` alternatives.
+- [`cf6977530a136`](https://bitbucket.org/atlassian/atlassian-frontend-monorepo/commits/cf6977530a136) -
+  Add ./commands entry point exposing openTypeAheadAtCursor for test consumption
+- Updated dependencies
+
 ## 10.3.0
 
 ### Minor Changes

package/commands/package.json

@@ -0,0 +1,17 @@
+{
+  "name": "@atlaskit/editor-plugin-type-ahead/commands",
+  "main": "../dist/cjs/entry-points/commands.js",
+  "module": "../dist/esm/entry-points/commands.js",
+  "module:es2019": "../dist/es2019/entry-points/commands.js",
+  "sideEffects": [
+    "*.compiled.css"
+  ],
+  "types": "../dist/types/entry-points/commands.d.ts",
+  "typesVersions": {
+    ">=4.5 <5.9": {
+      "*": [
+        "../dist/types-ts4.5/entry-points/commands.d.ts"
+      ]
+    }
+  }
+}

package/dist/cjs/entry-points/commands.js

@@ -0,0 +1,18 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "openTypeAhead", {
+  enumerable: true,
+  get: function get() {
+    return _openTypeaheadAtCursor.openTypeAhead;
+  }
+});
+Object.defineProperty(exports, "openTypeAheadAtCursor", {
+  enumerable: true,
+  get: function get() {
+    return _openTypeaheadAtCursor.openTypeAheadAtCursor;
+  }
+});
+var _openTypeaheadAtCursor = require("../pm-plugins/commands/open-typeahead-at-cursor");

package/dist/cjs/pm-plugins/commands/open-typeahead-at-cursor.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 exports.openTypeAheadAtCursor = exports.openTypeAhead = void 0;
 var _selection = require("@atlaskit/editor-common/selection");
 var _state = require("@atlaskit/editor-prosemirror/state");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _actions = require("../actions");
 var _key = require("../key");
 var openTypeAhead = exports.openTypeAhead = function openTypeAhead(props) {
@@ -49,7 +50,7 @@ var openTypeAheadAtCursor = exports.openTypeAheadAtCursor = function openTypeAhe
       // delete 1 pos before wherever selection is now - that will delete the empty space
       tr.delete(tr.selection.from - 1, tr.selection.from);
     } else {
-      var _selection$$head, _selection$$head$pare, _selection$$head$pare2;
+      var _selection$$head$pare, _selection$$head$pare2, _selection$$head;
       if (selection instanceof _state.NodeSelection) {
         if (isInline) {
           tr.deleteSelection();
@@ -78,7 +79,11 @@ var openTypeAheadAtCursor = exports.openTypeAheadAtCursor = function openTypeAhe
       // being inserted due to composition by checking if we have the trigger
       // directly before the typeahead. This should not happen unless it has
       // been eroneously added because we require whitespace/newline for typeahead.
-      if (cursorPos >= 2 && !!(selection !== null && selection !== void 0 && (_selection$$head = selection.$head) !== null && _selection$$head !== void 0 && (_selection$$head = _selection$$head.parent) !== null && _selection$$head !== void 0 && _selection$$head.textContent) && (_selection$$head$pare = (_selection$$head$pare2 = selection.$head.parent.textContent).endsWith) !== null && _selection$$head$pare !== void 0 && _selection$$head$pare.call(_selection$$head$pare2, triggerHandler.trigger)) {
+      // Check if the text ends with the trigger character (or any character matched
+      // by customRegex, to support wide-char variants like fullwidth slash ／)
+      var triggerPattern = (0, _expValEquals.expValEquals)('platform_editor_wide_slash_trigger', 'isEnabled', true) && triggerHandler.customRegex ? new RegExp("(".concat(triggerHandler.customRegex, ")$"), 'u') : null;
+      var endsWithTrigger = ((_selection$$head$pare = (_selection$$head$pare2 = selection.$head.parent.textContent).endsWith) === null || _selection$$head$pare === void 0 ? void 0 : _selection$$head$pare.call(_selection$$head$pare2, triggerHandler.trigger)) || triggerPattern && triggerPattern.test(selection.$head.parent.textContent);
+      if (cursorPos >= 2 && !!(selection !== null && selection !== void 0 && (_selection$$head = selection.$head) !== null && _selection$$head !== void 0 && (_selection$$head = _selection$$head.parent) !== null && _selection$$head !== void 0 && _selection$$head.textContent) && endsWithTrigger) {
         tr.delete(cursorPos - 1, cursorPos);
       }
     }

package/dist/cjs/pm-plugins/main.js

@@ -5,11 +5,14 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.createPlugin = createPlugin;
 var _steps = require("@atlaskit/adf-schema/steps");
+var _analytics = require("@atlaskit/editor-common/analytics");
 var _safePlugin = require("@atlaskit/editor-common/safe-plugin");
 var _utils = require("@atlaskit/editor-common/utils");
 var _view = require("@atlaskit/editor-prosemirror/view");
 var _platformFeatureFlags = require("@atlaskit/platform-feature-flags");
+var _expValEquals = require("@atlaskit/tmp-editor-statsig/exp-val-equals");
 var _actions = require("./actions");
+var _openTypeaheadAtCursor = require("./commands/open-typeahead-at-cursor");
 var _constants = require("./constants");
 var _decorations = require("./decorations");
 var _isInsertionTransaction = require("./isInsertionTransaction");
@@ -49,6 +52,11 @@ function createPlugin(_ref) {
     typeAheadHandlers: typeAheadHandlers,
     popupMountRef: popupMountRef
   });
+
+  // Tracks a wide-char trigger handler detected during IME composition (e.g. ／).
+  // Set by compositionupdate, cleared by compositionend. Used by handleKeyDown
+  // to intercept Enter that confirms the composition.
+  var pendingWideSlashHandler = null;
   return new _safePlugin.SafePlugin({
     key: _key.pluginKey,
     state: {
@@ -101,8 +109,53 @@ function createPlugin(_ref) {
         var _pluginKey$getState;
         return (_pluginKey$getState = _key.pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.decorationSet;
       },
+      handleKeyDown: function handleKeyDown(view, event) {
+        // When composing a wide-char trigger (e.g. ／), intercept the Enter key
+        // that confirms the composition so we can open the typeahead instead.
+        if (pendingWideSlashHandler && event.isComposing && (event.key === 'Enter' || event.keyCode === 13)) {
+          var handler = pendingWideSlashHandler;
+          pendingWideSlashHandler = null;
+          // Defer until ProseMirror has flushed the composed text into its state.
+          setTimeout(function () {
+            var command = (0, _openTypeaheadAtCursor.openTypeAheadAtCursor)({
+              triggerHandler: handler,
+              inputMethod: _analytics.INPUT_METHOD.KEYBOARD
+            });
+            var tr = command({
+              tr: view.state.tr
+            });
+            if (tr) {
+              view.dispatch(tr);
+            }
+          }, 0);
+          return true;
+        }
+        return false;
+      },
       handleDOMEvents: {
+        compositionupdate: function compositionupdate(view, event) {
+          // When the experiment is on, track whether the current composition
+          // exactly matches a wide-char trigger (e.g. ／ from Japanese keyboard).
+          // We can't open the typeahead yet because composition is still active,
+          // but we record the matching handler so the next keydown (Enter) can use it.
+          if ((0, _expValEquals.expValEquals)('platform_editor_wide_slash_trigger', 'isEnabled', true)) {
+            var _event$data, _typeAheadHandlers$fi;
+            var pendingData = (_event$data = event.data) !== null && _event$data !== void 0 ? _event$data : '';
+            pendingWideSlashHandler = (_typeAheadHandlers$fi = typeAheadHandlers.find(function (handler) {
+              if (!handler.customRegex) {
+                return false;
+              }
+              // Only match if the entire composition is a trigger character
+              var pattern = new RegExp("^(".concat(handler.customRegex, ")$"), 'u');
+              return pattern.test(pendingData);
+            })) !== null && _typeAheadHandlers$fi !== void 0 ? _typeAheadHandlers$fi : null;
+          }
+          return false;
+        },
         compositionend: function compositionend(view, event) {
+          // Clear the pending handler when composition ends (cancelled or committed
+          // via a non-Enter key like Space, which we don't want to intercept).
+          pendingWideSlashHandler = null;
           return false;
         },
         click: function click(view, event) {

package/dist/es2019/entry-points/commands.js

@@ -0,0 +1,2 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+export { openTypeAhead, openTypeAheadAtCursor } from '../pm-plugins/commands/open-typeahead-at-cursor';

package/dist/es2019/pm-plugins/commands/open-typeahead-at-cursor.js

@@ -1,5 +1,6 @@
 import { GapCursorSelection } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ACTIONS } from '../actions';
 import { pluginKey } from '../key';
 export const openTypeAhead = props => tr => {
@@ -46,7 +47,7 @@ export const openTypeAheadAtCursor = ({
     // delete 1 pos before wherever selection is now - that will delete the empty space
     tr.delete(tr.selection.from - 1, tr.selection.from);
   } else {
-    var _selection$$head, _selection$$head$pare, _selection$$head$pare2, _selection$$head$pare3;
+    var _selection$$head$pare, _selection$$head$pare2, _selection$$head, _selection$$head$pare3;
     if (selection instanceof NodeSelection) {
       if (isInline) {
         tr.deleteSelection();
@@ -75,7 +76,11 @@ export const openTypeAheadAtCursor = ({
     // being inserted due to composition by checking if we have the trigger
     // directly before the typeahead. This should not happen unless it has
     // been eroneously added because we require whitespace/newline for typeahead.
-    if (cursorPos >= 2 && !!(selection !== null && selection !== void 0 && (_selection$$head = selection.$head) !== null && _selection$$head !== void 0 && (_selection$$head$pare = _selection$$head.parent) !== null && _selection$$head$pare !== void 0 && _selection$$head$pare.textContent) && (_selection$$head$pare2 = (_selection$$head$pare3 = selection.$head.parent.textContent).endsWith) !== null && _selection$$head$pare2 !== void 0 && _selection$$head$pare2.call(_selection$$head$pare3, triggerHandler.trigger)) {
+    // Check if the text ends with the trigger character (or any character matched
+    // by customRegex, to support wide-char variants like fullwidth slash ／)
+    const triggerPattern = expValEquals('platform_editor_wide_slash_trigger', 'isEnabled', true) && triggerHandler.customRegex ? new RegExp(`(${triggerHandler.customRegex})$`, 'u') : null;
+    const endsWithTrigger = ((_selection$$head$pare = (_selection$$head$pare2 = selection.$head.parent.textContent).endsWith) === null || _selection$$head$pare === void 0 ? void 0 : _selection$$head$pare.call(_selection$$head$pare2, triggerHandler.trigger)) || triggerPattern && triggerPattern.test(selection.$head.parent.textContent);
+    if (cursorPos >= 2 && !!(selection !== null && selection !== void 0 && (_selection$$head = selection.$head) !== null && _selection$$head !== void 0 && (_selection$$head$pare3 = _selection$$head.parent) !== null && _selection$$head$pare3 !== void 0 && _selection$$head$pare3.textContent) && endsWithTrigger) {
       tr.delete(cursorPos - 1, cursorPos);
     }
   }

package/dist/es2019/pm-plugins/main.js

@@ -1,9 +1,12 @@
 import { InsertTypeAheadStep } from '@atlaskit/adf-schema/steps';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { closest } from '@atlaskit/editor-common/utils';
 import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ACTIONS } from './actions';
+import { openTypeAheadAtCursor } from './commands/open-typeahead-at-cursor';
 import { TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE } from './constants';
 import { factoryDecorations } from './decorations';
 import { isInsertionTransaction } from './isInsertionTransaction';
@@ -43,6 +46,11 @@ export function createPlugin({
     typeAheadHandlers,
     popupMountRef
   });
+
+  // Tracks a wide-char trigger handler detected during IME composition (e.g. ／).
+  // Set by compositionupdate, cleared by compositionend. Used by handleKeyDown
+  // to intercept Enter that confirms the composition.
+  let pendingWideSlashHandler = null;
   return new SafePlugin({
     key: pluginKey,
     state: {
@@ -95,8 +103,53 @@ export function createPlugin({
         var _pluginKey$getState;
         return (_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.decorationSet;
       },
+      handleKeyDown: (view, event) => {
+        // When composing a wide-char trigger (e.g. ／), intercept the Enter key
+        // that confirms the composition so we can open the typeahead instead.
+        if (pendingWideSlashHandler && event.isComposing && (event.key === 'Enter' || event.keyCode === 13)) {
+          const handler = pendingWideSlashHandler;
+          pendingWideSlashHandler = null;
+          // Defer until ProseMirror has flushed the composed text into its state.
+          setTimeout(() => {
+            const command = openTypeAheadAtCursor({
+              triggerHandler: handler,
+              inputMethod: INPUT_METHOD.KEYBOARD
+            });
+            const tr = command({
+              tr: view.state.tr
+            });
+            if (tr) {
+              view.dispatch(tr);
+            }
+          }, 0);
+          return true;
+        }
+        return false;
+      },
       handleDOMEvents: {
+        compositionupdate: (view, event) => {
+          // When the experiment is on, track whether the current composition
+          // exactly matches a wide-char trigger (e.g. ／ from Japanese keyboard).
+          // We can't open the typeahead yet because composition is still active,
+          // but we record the matching handler so the next keydown (Enter) can use it.
+          if (expValEquals('platform_editor_wide_slash_trigger', 'isEnabled', true)) {
+            var _event$data, _typeAheadHandlers$fi;
+            const pendingData = (_event$data = event.data) !== null && _event$data !== void 0 ? _event$data : '';
+            pendingWideSlashHandler = (_typeAheadHandlers$fi = typeAheadHandlers.find(handler => {
+              if (!handler.customRegex) {
+                return false;
+              }
+              // Only match if the entire composition is a trigger character
+              const pattern = new RegExp(`^(${handler.customRegex})$`, 'u');
+              return pattern.test(pendingData);
+            })) !== null && _typeAheadHandlers$fi !== void 0 ? _typeAheadHandlers$fi : null;
+          }
+          return false;
+        },
         compositionend: (view, event) => {
+          // Clear the pending handler when composition ends (cancelled or committed
+          // via a non-Enter key like Space, which we don't want to intercept).
+          pendingWideSlashHandler = null;
           return false;
         },
         click: (view, event) => {

package/dist/esm/entry-points/commands.js

@@ -0,0 +1,2 @@
+/* eslint-disable @atlaskit/editor/no-re-export */
+export { openTypeAhead, openTypeAheadAtCursor } from '../pm-plugins/commands/open-typeahead-at-cursor';

package/dist/esm/pm-plugins/commands/open-typeahead-at-cursor.js

@@ -1,5 +1,6 @@
 import { GapCursorSelection } from '@atlaskit/editor-common/selection';
 import { NodeSelection, TextSelection } from '@atlaskit/editor-prosemirror/state';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ACTIONS } from '../actions';
 import { pluginKey } from '../key';
 export var openTypeAhead = function openTypeAhead(props) {
@@ -43,7 +44,7 @@ export var openTypeAheadAtCursor = function openTypeAheadAtCursor(_ref) {
       // delete 1 pos before wherever selection is now - that will delete the empty space
       tr.delete(tr.selection.from - 1, tr.selection.from);
     } else {
-      var _selection$$head, _selection$$head$pare, _selection$$head$pare2;
+      var _selection$$head$pare, _selection$$head$pare2, _selection$$head;
       if (selection instanceof NodeSelection) {
         if (isInline) {
           tr.deleteSelection();
@@ -72,7 +73,11 @@ export var openTypeAheadAtCursor = function openTypeAheadAtCursor(_ref) {
       // being inserted due to composition by checking if we have the trigger
       // directly before the typeahead. This should not happen unless it has
       // been eroneously added because we require whitespace/newline for typeahead.
-      if (cursorPos >= 2 && !!(selection !== null && selection !== void 0 && (_selection$$head = selection.$head) !== null && _selection$$head !== void 0 && (_selection$$head = _selection$$head.parent) !== null && _selection$$head !== void 0 && _selection$$head.textContent) && (_selection$$head$pare = (_selection$$head$pare2 = selection.$head.parent.textContent).endsWith) !== null && _selection$$head$pare !== void 0 && _selection$$head$pare.call(_selection$$head$pare2, triggerHandler.trigger)) {
+      // Check if the text ends with the trigger character (or any character matched
+      // by customRegex, to support wide-char variants like fullwidth slash ／)
+      var triggerPattern = expValEquals('platform_editor_wide_slash_trigger', 'isEnabled', true) && triggerHandler.customRegex ? new RegExp("(".concat(triggerHandler.customRegex, ")$"), 'u') : null;
+      var endsWithTrigger = ((_selection$$head$pare = (_selection$$head$pare2 = selection.$head.parent.textContent).endsWith) === null || _selection$$head$pare === void 0 ? void 0 : _selection$$head$pare.call(_selection$$head$pare2, triggerHandler.trigger)) || triggerPattern && triggerPattern.test(selection.$head.parent.textContent);
+      if (cursorPos >= 2 && !!(selection !== null && selection !== void 0 && (_selection$$head = selection.$head) !== null && _selection$$head !== void 0 && (_selection$$head = _selection$$head.parent) !== null && _selection$$head !== void 0 && _selection$$head.textContent) && endsWithTrigger) {
         tr.delete(cursorPos - 1, cursorPos);
       }
     }

package/dist/esm/pm-plugins/main.js

@@ -1,9 +1,12 @@
 import { InsertTypeAheadStep } from '@atlaskit/adf-schema/steps';
+import { INPUT_METHOD } from '@atlaskit/editor-common/analytics';
 import { SafePlugin } from '@atlaskit/editor-common/safe-plugin';
 import { closest } from '@atlaskit/editor-common/utils';
 import { DecorationSet } from '@atlaskit/editor-prosemirror/view';
 import { fg } from '@atlaskit/platform-feature-flags';
+import { expValEquals } from '@atlaskit/tmp-editor-statsig/exp-val-equals';
 import { ACTIONS } from './actions';
+import { openTypeAheadAtCursor } from './commands/open-typeahead-at-cursor';
 import { TYPE_AHEAD_DECORATION_DATA_ATTRIBUTE } from './constants';
 import { factoryDecorations } from './decorations';
 import { isInsertionTransaction } from './isInsertionTransaction';
@@ -43,6 +46,11 @@ export function createPlugin(_ref) {
     typeAheadHandlers: typeAheadHandlers,
     popupMountRef: popupMountRef
   });
+
+  // Tracks a wide-char trigger handler detected during IME composition (e.g. ／).
+  // Set by compositionupdate, cleared by compositionend. Used by handleKeyDown
+  // to intercept Enter that confirms the composition.
+  var pendingWideSlashHandler = null;
   return new SafePlugin({
     key: pluginKey,
     state: {
@@ -95,8 +103,53 @@ export function createPlugin(_ref) {
         var _pluginKey$getState;
         return (_pluginKey$getState = pluginKey.getState(state)) === null || _pluginKey$getState === void 0 ? void 0 : _pluginKey$getState.decorationSet;
       },
+      handleKeyDown: function handleKeyDown(view, event) {
+        // When composing a wide-char trigger (e.g. ／), intercept the Enter key
+        // that confirms the composition so we can open the typeahead instead.
+        if (pendingWideSlashHandler && event.isComposing && (event.key === 'Enter' || event.keyCode === 13)) {
+          var handler = pendingWideSlashHandler;
+          pendingWideSlashHandler = null;
+          // Defer until ProseMirror has flushed the composed text into its state.
+          setTimeout(function () {
+            var command = openTypeAheadAtCursor({
+              triggerHandler: handler,
+              inputMethod: INPUT_METHOD.KEYBOARD
+            });
+            var tr = command({
+              tr: view.state.tr
+            });
+            if (tr) {
+              view.dispatch(tr);
+            }
+          }, 0);
+          return true;
+        }
+        return false;
+      },
       handleDOMEvents: {
+        compositionupdate: function compositionupdate(view, event) {
+          // When the experiment is on, track whether the current composition
+          // exactly matches a wide-char trigger (e.g. ／ from Japanese keyboard).
+          // We can't open the typeahead yet because composition is still active,
+          // but we record the matching handler so the next keydown (Enter) can use it.
+          if (expValEquals('platform_editor_wide_slash_trigger', 'isEnabled', true)) {
+            var _event$data, _typeAheadHandlers$fi;
+            var pendingData = (_event$data = event.data) !== null && _event$data !== void 0 ? _event$data : '';
+            pendingWideSlashHandler = (_typeAheadHandlers$fi = typeAheadHandlers.find(function (handler) {
+              if (!handler.customRegex) {
+                return false;
+              }
+              // Only match if the entire composition is a trigger character
+              var pattern = new RegExp("^(".concat(handler.customRegex, ")$"), 'u');
+              return pattern.test(pendingData);
+            })) !== null && _typeAheadHandlers$fi !== void 0 ? _typeAheadHandlers$fi : null;
+          }
+          return false;
+        },
         compositionend: function compositionend(view, event) {
+          // Clear the pending handler when composition ends (cancelled or committed
+          // via a non-Enter key like Space, which we don't want to intercept).
+          pendingWideSlashHandler = null;
           return false;
         },
         click: function click(view, event) {

package/dist/types/entry-points/commands.d.ts

@@ -0,0 +1 @@
+export { openTypeAhead, openTypeAheadAtCursor } from '../pm-plugins/commands/open-typeahead-at-cursor';

package/dist/types-ts4.5/entry-points/commands.d.ts

@@ -0,0 +1 @@
+export { openTypeAhead, openTypeAheadAtCursor } from '../pm-plugins/commands/open-typeahead-at-cursor';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@atlaskit/editor-plugin-type-ahead",
-	"version": "10.3.0",
+	"version": "10.3.2",
 	"description": "Type-ahead plugin for @atlaskit/editor-core",
 	"author": "Atlassian Pty Ltd",
 	"license": "Apache-2.0",
@@ -44,8 +44,8 @@
 		"@atlaskit/primitives": "^19.0.0",
 		"@atlaskit/prosemirror-history": "^0.2.0",
 		"@atlaskit/prosemirror-input-rules": "^3.7.0",
-		"@atlaskit/tmp-editor-statsig": "^84.3.0",
-		"@atlaskit/tokens": "^13.0.0",
+		"@atlaskit/tmp-editor-statsig": "^85.0.0",
+		"@atlaskit/tokens": "^13.1.0",
 		"@atlaskit/visually-hidden": "^3.1.0",
 		"@babel/runtime": "^7.0.0",
 		"@emotion/react": "^11.7.1",