@kopexa/tiptap 17.4.0 → 17.5.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -18,9 +18,10 @@ function BubbleMenu({ editor }) {
18
18
  TiptapBubbleMenu,
19
19
  {
20
20
  editor,
21
- shouldShow: ({ editor: e, state }) => {
21
+ shouldShow: ({ editor: e, state, view }) => {
22
22
  const { selection } = state;
23
23
  const { empty } = selection;
24
+ if (!view.hasFocus()) return false;
24
25
  if (empty) return false;
25
26
  if (e.isActive("codeBlock")) return false;
26
27
  if (e.isActive("link")) return false;
@@ -7,10 +7,10 @@ import {
7
7
  } from "./chunk-DZLGLP7R.mjs";
8
8
  import {
9
9
  LinkBubble
10
- } from "./chunk-XNDXYI2N.mjs";
10
+ } from "./chunk-XGAABDMW.mjs";
11
11
  import {
12
12
  BubbleMenu
13
- } from "./chunk-GL3RTIER.mjs";
13
+ } from "./chunk-2UDCL55K.mjs";
14
14
  import {
15
15
  VariableSuggestion
16
16
  } from "./chunk-H7MS2UMO.mjs";
@@ -79,11 +79,46 @@ var EditorContentArea = ({ variant, variables }) => {
79
79
  const { editor } = useContext(EditorContext);
80
80
  const { isDragging } = useUiEditorState(editor);
81
81
  useScrollToHash();
82
+ const handleKeyDown = useCallback(
83
+ (e) => {
84
+ if (!(editor == null ? void 0 : editor.isFocused)) return;
85
+ const isMod = e.metaKey || e.ctrlKey;
86
+ const key = e.key.toLowerCase();
87
+ const editorShortcuts = [
88
+ isMod && key === "b",
89
+ // Bold
90
+ isMod && key === "i",
91
+ // Italic
92
+ isMod && key === "u",
93
+ // Underline
94
+ isMod && e.shiftKey && key === "x",
95
+ // Strikethrough
96
+ isMod && key === "k",
97
+ // Link
98
+ isMod && key === "z",
99
+ // Undo
100
+ isMod && e.shiftKey && key === "z",
101
+ // Redo
102
+ isMod && key === "y",
103
+ // Redo (alternative)
104
+ isMod && key === "a",
105
+ // Select all
106
+ isMod && key === "e",
107
+ // Code
108
+ isMod && e.shiftKey && key === "e"
109
+ // Code block
110
+ ];
111
+ if (editorShortcuts.some(Boolean)) {
112
+ e.stopPropagation();
113
+ }
114
+ },
115
+ [editor]
116
+ );
82
117
  if (!editor) {
83
118
  return null;
84
119
  }
85
120
  const isEditable = editor.isEditable;
86
- return /* @__PURE__ */ jsxs("div", { className: styles.wrapper(), children: [
121
+ return /* @__PURE__ */ jsxs("div", { className: styles.wrapper(), onKeyDown: handleKeyDown, children: [
87
122
  /* @__PURE__ */ jsxs(
88
123
  EditorContent,
89
124
  {
@@ -64,7 +64,8 @@ function LinkBubble({ editor }) {
64
64
  {
65
65
  editor,
66
66
  pluginKey: "linkBubbleMenu",
67
- shouldShow: ({ editor: e }) => {
67
+ shouldShow: ({ editor: e, view }) => {
68
+ if (!view.hasFocus()) return false;
68
69
  return e.isActive("link") && e.isEditable;
69
70
  },
70
71
  options: {
package/dist/index.js CHANGED
@@ -4266,9 +4266,10 @@ function BubbleMenu({ editor }) {
4266
4266
  import_menus.BubbleMenu,
4267
4267
  {
4268
4268
  editor,
4269
- shouldShow: ({ editor: e, state }) => {
4269
+ shouldShow: ({ editor: e, state, view }) => {
4270
4270
  const { selection } = state;
4271
4271
  const { empty } = selection;
4272
+ if (!view.hasFocus()) return false;
4272
4273
  if (empty) return false;
4273
4274
  if (e.isActive("codeBlock")) return false;
4274
4275
  if (e.isActive("link")) return false;
@@ -4462,7 +4463,8 @@ function LinkBubble({ editor }) {
4462
4463
  {
4463
4464
  editor,
4464
4465
  pluginKey: "linkBubbleMenu",
4465
- shouldShow: ({ editor: e }) => {
4466
+ shouldShow: ({ editor: e, view }) => {
4467
+ if (!view.hasFocus()) return false;
4466
4468
  return e.isActive("link") && e.isEditable;
4467
4469
  },
4468
4470
  options: {
@@ -7119,11 +7121,46 @@ var EditorContentArea = ({ variant, variables }) => {
7119
7121
  const { editor } = (0, import_react57.useContext)(import_react56.EditorContext);
7120
7122
  const { isDragging } = useUiEditorState(editor);
7121
7123
  useScrollToHash();
7124
+ const handleKeyDown = (0, import_react57.useCallback)(
7125
+ (e) => {
7126
+ if (!(editor == null ? void 0 : editor.isFocused)) return;
7127
+ const isMod = e.metaKey || e.ctrlKey;
7128
+ const key = e.key.toLowerCase();
7129
+ const editorShortcuts = [
7130
+ isMod && key === "b",
7131
+ // Bold
7132
+ isMod && key === "i",
7133
+ // Italic
7134
+ isMod && key === "u",
7135
+ // Underline
7136
+ isMod && e.shiftKey && key === "x",
7137
+ // Strikethrough
7138
+ isMod && key === "k",
7139
+ // Link
7140
+ isMod && key === "z",
7141
+ // Undo
7142
+ isMod && e.shiftKey && key === "z",
7143
+ // Redo
7144
+ isMod && key === "y",
7145
+ // Redo (alternative)
7146
+ isMod && key === "a",
7147
+ // Select all
7148
+ isMod && key === "e",
7149
+ // Code
7150
+ isMod && e.shiftKey && key === "e"
7151
+ // Code block
7152
+ ];
7153
+ if (editorShortcuts.some(Boolean)) {
7154
+ e.stopPropagation();
7155
+ }
7156
+ },
7157
+ [editor]
7158
+ );
7122
7159
  if (!editor) {
7123
7160
  return null;
7124
7161
  }
7125
7162
  const isEditable = editor.isEditable;
7126
- return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: styles.wrapper(), children: [
7163
+ return /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)("div", { className: styles.wrapper(), onKeyDown: handleKeyDown, children: [
7127
7164
  /* @__PURE__ */ (0, import_jsx_runtime32.jsxs)(
7128
7165
  import_react56.EditorContent,
7129
7166
  {
package/dist/index.mjs CHANGED
@@ -4,13 +4,13 @@ import {
4
4
  } from "./chunk-QIELBKP3.mjs";
5
5
  import {
6
6
  BasicEditor
7
- } from "./chunk-GDDWW2IQ.mjs";
7
+ } from "./chunk-JZBRWJHC.mjs";
8
8
  import "./chunk-MNTOOEHA.mjs";
9
9
  import "./chunk-ERPGWXFK.mjs";
10
10
  import "./chunk-6552DQWB.mjs";
11
11
  import "./chunk-DZLGLP7R.mjs";
12
- import "./chunk-XNDXYI2N.mjs";
13
- import "./chunk-GL3RTIER.mjs";
12
+ import "./chunk-XGAABDMW.mjs";
13
+ import "./chunk-2UDCL55K.mjs";
14
14
  import {
15
15
  VariableSuggestion
16
16
  } from "./chunk-H7MS2UMO.mjs";
@@ -3941,9 +3941,10 @@ function BubbleMenu({ editor }) {
3941
3941
  import_menus.BubbleMenu,
3942
3942
  {
3943
3943
  editor,
3944
- shouldShow: ({ editor: e, state }) => {
3944
+ shouldShow: ({ editor: e, state, view }) => {
3945
3945
  const { selection } = state;
3946
3946
  const { empty } = selection;
3947
+ if (!view.hasFocus()) return false;
3947
3948
  if (empty) return false;
3948
3949
  if (e.isActive("codeBlock")) return false;
3949
3950
  if (e.isActive("link")) return false;
@@ -4137,7 +4138,8 @@ function LinkBubble({ editor }) {
4137
4138
  {
4138
4139
  editor,
4139
4140
  pluginKey: "linkBubbleMenu",
4140
- shouldShow: ({ editor: e }) => {
4141
+ shouldShow: ({ editor: e, view }) => {
4142
+ if (!view.hasFocus()) return false;
4141
4143
  return e.isActive("link") && e.isEditable;
4142
4144
  },
4143
4145
  options: {
@@ -6794,11 +6796,46 @@ var EditorContentArea = ({ variant, variables }) => {
6794
6796
  const { editor } = (0, import_react57.useContext)(import_react56.EditorContext);
6795
6797
  const { isDragging } = useUiEditorState(editor);
6796
6798
  useScrollToHash();
6799
+ const handleKeyDown = (0, import_react57.useCallback)(
6800
+ (e) => {
6801
+ if (!(editor == null ? void 0 : editor.isFocused)) return;
6802
+ const isMod = e.metaKey || e.ctrlKey;
6803
+ const key = e.key.toLowerCase();
6804
+ const editorShortcuts = [
6805
+ isMod && key === "b",
6806
+ // Bold
6807
+ isMod && key === "i",
6808
+ // Italic
6809
+ isMod && key === "u",
6810
+ // Underline
6811
+ isMod && e.shiftKey && key === "x",
6812
+ // Strikethrough
6813
+ isMod && key === "k",
6814
+ // Link
6815
+ isMod && key === "z",
6816
+ // Undo
6817
+ isMod && e.shiftKey && key === "z",
6818
+ // Redo
6819
+ isMod && key === "y",
6820
+ // Redo (alternative)
6821
+ isMod && key === "a",
6822
+ // Select all
6823
+ isMod && key === "e",
6824
+ // Code
6825
+ isMod && e.shiftKey && key === "e"
6826
+ // Code block
6827
+ ];
6828
+ if (editorShortcuts.some(Boolean)) {
6829
+ e.stopPropagation();
6830
+ }
6831
+ },
6832
+ [editor]
6833
+ );
6797
6834
  if (!editor) {
6798
6835
  return null;
6799
6836
  }
6800
6837
  const isEditable = editor.isEditable;
6801
- return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: styles.wrapper(), children: [
6838
+ return /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)("div", { className: styles.wrapper(), onKeyDown: handleKeyDown, children: [
6802
6839
  /* @__PURE__ */ (0, import_jsx_runtime31.jsxs)(
6803
6840
  import_react56.EditorContent,
6804
6841
  {
@@ -2,13 +2,13 @@
2
2
  "use client";
3
3
  import {
4
4
  BasicEditor
5
- } from "../../chunk-GDDWW2IQ.mjs";
5
+ } from "../../chunk-JZBRWJHC.mjs";
6
6
  import "../../chunk-MNTOOEHA.mjs";
7
7
  import "../../chunk-ERPGWXFK.mjs";
8
8
  import "../../chunk-6552DQWB.mjs";
9
9
  import "../../chunk-DZLGLP7R.mjs";
10
- import "../../chunk-XNDXYI2N.mjs";
11
- import "../../chunk-GL3RTIER.mjs";
10
+ import "../../chunk-XGAABDMW.mjs";
11
+ import "../../chunk-2UDCL55K.mjs";
12
12
  import "../../chunk-H7MS2UMO.mjs";
13
13
  import "../../chunk-HLLA2HRV.mjs";
14
14
  import "../../chunk-L5RDMV3H.mjs";
@@ -637,9 +637,10 @@ function BubbleMenu({ editor }) {
637
637
  import_menus.BubbleMenu,
638
638
  {
639
639
  editor,
640
- shouldShow: ({ editor: e, state }) => {
640
+ shouldShow: ({ editor: e, state, view }) => {
641
641
  const { selection } = state;
642
642
  const { empty } = selection;
643
+ if (!view.hasFocus()) return false;
643
644
  if (empty) return false;
644
645
  if (e.isActive("codeBlock")) return false;
645
646
  if (e.isActive("link")) return false;
@@ -3,7 +3,7 @@
3
3
  import {
4
4
  BubbleMenu,
5
5
  bubble_menu_default
6
- } from "../../chunk-GL3RTIER.mjs";
6
+ } from "../../chunk-2UDCL55K.mjs";
7
7
  import "../../chunk-LNVWG34E.mjs";
8
8
  import "../../chunk-LVNUU67N.mjs";
9
9
  import "../../chunk-7VGROP26.mjs";
@@ -89,7 +89,8 @@ function LinkBubble({ editor }) {
89
89
  {
90
90
  editor,
91
91
  pluginKey: "linkBubbleMenu",
92
- shouldShow: ({ editor: e }) => {
92
+ shouldShow: ({ editor: e, view }) => {
93
+ if (!view.hasFocus()) return false;
93
94
  return e.isActive("link") && e.isEditable;
94
95
  },
95
96
  options: {
@@ -3,7 +3,7 @@
3
3
  import {
4
4
  LinkBubble,
5
5
  link_bubble_default
6
- } from "../../chunk-XNDXYI2N.mjs";
6
+ } from "../../chunk-XGAABDMW.mjs";
7
7
  export {
8
8
  LinkBubble,
9
9
  link_bubble_default as default
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kopexa/tiptap",
3
- "version": "17.4.0",
3
+ "version": "17.5.0",
4
4
  "description": "our tiptap components",
5
5
  "keywords": [
6
6
  "tiptap"
@@ -28,7 +28,7 @@
28
28
  "motion": ">=12.23.6",
29
29
  "react": ">=19.0.0-rc.0",
30
30
  "react-dom": ">=19.0.0-rc.0",
31
- "@kopexa/theme": "17.13.0"
31
+ "@kopexa/theme": "17.13.1"
32
32
  },
33
33
  "dependencies": {
34
34
  "@floating-ui/dom": "^1.7.4",
@@ -62,28 +62,28 @@
62
62
  "markdown-it": "^14.1.0",
63
63
  "react-hotkeys-hook": "^5.2.3",
64
64
  "react-intl": "^7.1.14",
65
- "@kopexa/chip": "17.1.22",
66
- "@kopexa/callout": "17.0.25",
67
- "@kopexa/dialog": "17.0.25",
68
- "@kopexa/button": "17.0.25",
69
- "@kopexa/dropdown-menu": "17.0.25",
70
- "@kopexa/editor-utils": "17.0.25",
71
- "@kopexa/extension-code": "17.0.25",
72
- "@kopexa/extension-controlref": "17.1.7",
73
- "@kopexa/extension-table": "17.0.25",
74
- "@kopexa/icons": "17.3.7",
75
- "@kopexa/input": "17.0.25",
76
- "@kopexa/label": "17.0.25",
77
- "@kopexa/popover": "17.0.25",
78
- "@kopexa/select": "17.0.25",
79
- "@kopexa/switch": "17.0.25",
80
- "@kopexa/shared-utils": "17.0.25",
81
- "@kopexa/separator": "17.0.25",
82
- "@kopexa/toolbar": "17.0.25",
83
- "@kopexa/use-composed-ref": "17.0.25",
84
- "@kopexa/use-is-mobile": "17.0.25",
85
- "@kopexa/tabs": "17.0.25",
86
- "@kopexa/react-utils": "17.0.25"
65
+ "@kopexa/button": "17.0.26",
66
+ "@kopexa/callout": "17.0.26",
67
+ "@kopexa/dialog": "17.0.26",
68
+ "@kopexa/chip": "17.1.23",
69
+ "@kopexa/dropdown-menu": "17.0.26",
70
+ "@kopexa/editor-utils": "17.0.26",
71
+ "@kopexa/extension-controlref": "17.1.8",
72
+ "@kopexa/icons": "17.3.8",
73
+ "@kopexa/extension-code": "17.0.26",
74
+ "@kopexa/extension-table": "17.0.26",
75
+ "@kopexa/label": "17.0.26",
76
+ "@kopexa/popover": "17.0.26",
77
+ "@kopexa/switch": "17.0.26",
78
+ "@kopexa/select": "17.0.26",
79
+ "@kopexa/input": "17.0.26",
80
+ "@kopexa/react-utils": "17.0.26",
81
+ "@kopexa/separator": "17.0.26",
82
+ "@kopexa/shared-utils": "17.0.26",
83
+ "@kopexa/tabs": "17.0.26",
84
+ "@kopexa/toolbar": "17.0.26",
85
+ "@kopexa/use-composed-ref": "17.0.26",
86
+ "@kopexa/use-is-mobile": "17.0.26"
87
87
  },
88
88
  "clean-package": "../../../clean-package.config.json",
89
89
  "module": "dist/index.mjs",