magic-editor-x 1.3.3 → 1.3.5

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.
@@ -0,0 +1,20 @@
1
+ /**
2
+ * Magic Editor X - Advanced Block Editor for Strapi
3
+ *
4
+ * Copyright (c) 2025 Schero D.
5
+ *
6
+ * Licensed under the MIT License
7
+ *
8
+ * This plugin is free to use for personal and commercial projects.
9
+ *
10
+ * IMPORTANT RESTRICTION:
11
+ * The license validation system (license-service.js, license-controller.js
12
+ * and related components) must remain intact and functional. Removing or
13
+ * bypassing this system is strictly prohibited.
14
+ *
15
+ * See LICENSE file for full terms.
16
+ *
17
+ * Repository: https://github.com/Schero94/magic-editor-x
18
+ * Issues: https://github.com/Schero94/magic-editor-x/issues
19
+ */
20
+
package/LICENSE CHANGED
@@ -1,6 +1,6 @@
1
1
  MIT License
2
2
 
3
- Copyright (c) 2024 Schero D.
3
+ Copyright (c) 2025 Schero D.
4
4
 
5
5
  Permission is hereby granted, free of charge, to any person obtaining a copy
6
6
  of this software and associated documentation files (the "Software"), to deal
@@ -12,6 +12,12 @@ furnished to do so, subject to the following conditions:
12
12
  The above copyright notice and this permission notice shall be included in all
13
13
  copies or substantial portions of the Software.
14
14
 
15
+ **ADDITIONAL CONDITION:**
16
+ The license validation system (including but not limited to license-service.js,
17
+ license-controller.js, and related API endpoints) must remain intact and functional.
18
+ Removing, bypassing, or disabling the license validation system is strictly
19
+ prohibited.
20
+
15
21
  THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
16
22
  IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
17
23
  FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
@@ -37941,7 +37941,7 @@ var snapshotService$1 = ({ strapi: strapi2 }) => {
37941
37941
  };
37942
37942
  };
37943
37943
  const name = "magic-editor-x";
37944
- const version = "1.3.2";
37944
+ const version = "1.3.4";
37945
37945
  const description = "Advanced block-based editor for Strapi v5 with Editor.js, Media Library integration, and real-time collaboration support";
37946
37946
  const keywords = [
37947
37947
  "strapi",
@@ -37971,6 +37971,7 @@ const files = [
37971
37971
  "dist",
37972
37972
  "README.md",
37973
37973
  "LICENSE",
37974
+ "COPYRIGHT_NOTICE.txt",
37974
37975
  "pics"
37975
37976
  ];
37976
37977
  const scripts = {
@@ -37922,7 +37922,7 @@ var snapshotService$1 = ({ strapi: strapi2 }) => {
37922
37922
  };
37923
37923
  };
37924
37924
  const name = "magic-editor-x";
37925
- const version = "1.3.2";
37925
+ const version = "1.3.4";
37926
37926
  const description = "Advanced block-based editor for Strapi v5 with Editor.js, Media Library integration, and real-time collaboration support";
37927
37927
  const keywords = [
37928
37928
  "strapi",
@@ -37952,6 +37952,7 @@ const files = [
37952
37952
  "dist",
37953
37953
  "README.md",
37954
37954
  "LICENSE",
37955
+ "COPYRIGHT_NOTICE.txt",
37955
37956
  "pics"
37956
37957
  ];
37957
37958
  const scripts = {
package/dist/style.css CHANGED
@@ -1,3 +1,820 @@
1
+ /**
2
+ * Magic Editor X - EditorJS Block Styles
3
+ * Note: Layout styles are handled by styled-components
4
+ */
5
+
6
+ /* ============================================
7
+ EDITORJS CORE
8
+ ============================================ */
9
+
10
+ .codex-editor {
11
+ position: relative;
12
+ }
13
+
14
+ .ce-block__content {
15
+ max-width: 100% !important;
16
+ margin: 0 !important;
17
+ width: 100% !important;
18
+ }
19
+
20
+ .ce-toolbar__content {
21
+ max-width: 100% !important;
22
+ margin: 0 !important;
23
+ }
24
+
25
+ .ce-toolbar__actions {
26
+ width: 98%;
27
+ }
28
+
29
+ .ce-toolbar {
30
+ z-index: 30 !important;
31
+ margin-left: 10px;
32
+ }
33
+
34
+ /* Hide the dark popover header bar */
35
+ .ce-popover__custom-content,
36
+ .ce-popover-header,
37
+ .ce-popover__nothing-found-message {
38
+ display: none !important;
39
+ }
40
+
41
+ .ce-popover__search {
42
+ background: transparent !important;
43
+ border: none !important;
44
+ }
45
+
46
+ /* Hide the dark tooltip on hover */
47
+ .ce-toolbar__tooltip,
48
+ .ct,
49
+ .ct__content,
50
+ [data-ct],
51
+ .codex-tooltip,
52
+ .ce-settings__button::before,
53
+ .ce-toolbar__plus::before,
54
+ .ce-toolbar__settings-btn::before {
55
+ display: none !important;
56
+ opacity: 0 !important;
57
+ visibility: hidden !important;
58
+ }
59
+
60
+ /* Plus Button */
61
+ .ce-toolbar__plus {
62
+ width: 38px;
63
+ height: 38px;
64
+ color: #7C3AED;
65
+ background: linear-gradient(135deg, #f8f5ff 0%, #ede9fe 100%);
66
+ border-radius: 10px;
67
+ transition: all 0.2s ease;
68
+ border: 1px solid #e9e3f5;
69
+ position: relative;
70
+ left: 6px;
71
+ z-index: 31;
72
+ }
73
+
74
+ .ce-toolbar__plus:hover {
75
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
76
+ color: white;
77
+ transform: rotate(90deg) scale(1.05);
78
+ border-color: transparent;
79
+ box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3);
80
+ }
81
+
82
+ .ce-toolbar__plus::after,
83
+ .ce-toolbar__settings-btn::after,
84
+ .ce-inline-tool::after,
85
+ .ce-toolbox__button::after {
86
+ display: none !important;
87
+ opacity: 0 !important;
88
+ visibility: hidden !important;
89
+ content: none !important;
90
+ }
91
+
92
+ /* Settings Button */
93
+ .ce-toolbar__settings-btn {
94
+ width: 38px;
95
+ height: 38px;
96
+ color: #64748b;
97
+ background: #f8fafc;
98
+ border-radius: 10px;
99
+ transition: all 0.2s ease;
100
+ border: 1px solid #e2e8f0;
101
+ }
102
+
103
+ .ce-toolbar__settings-btn:hover {
104
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
105
+ color: white;
106
+ border-color: transparent;
107
+ box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3);
108
+ }
109
+
110
+ /* ============================================
111
+ BLOCK STYLES
112
+ ============================================ */
113
+
114
+ .ce-block {
115
+ padding: 6px 8px;
116
+ margin: 4px 0;
117
+ border-radius: 10px;
118
+ transition: background 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
119
+ border: 1px solid transparent;
120
+ position: relative;
121
+ }
122
+
123
+ .ce-block:hover {
124
+ background: rgba(124, 58, 237, 0.06);
125
+ border-color: rgba(124, 58, 237, 0.25);
126
+ box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
127
+ }
128
+
129
+ .ce-block--focused {
130
+ background: rgba(124, 58, 237, 0.08);
131
+ border-color: rgba(124, 58, 237, 0.4);
132
+ box-shadow: 0 10px 24px rgba(15, 23, 42, 0.12);
133
+ }
134
+
135
+ .ce-block--selected .ce-block__content {
136
+ background: rgba(124, 58, 237, 0.08);
137
+ border-radius: 6px;
138
+ padding: 4px 8px;
139
+ margin: -4px -8px;
140
+ }
141
+
142
+ /* ============================================
143
+ HEADER
144
+ ============================================ */
145
+
146
+ .ce-header {
147
+ padding: 8px 0;
148
+ margin: 0;
149
+ line-height: 1.3;
150
+ font-weight: 700;
151
+ color: #0f172a;
152
+ }
153
+
154
+ h1.ce-header { font-size: 2.5em; letter-spacing: -0.03em; }
155
+ h2.ce-header { font-size: 2em; letter-spacing: -0.02em; }
156
+ h3.ce-header { font-size: 1.5em; letter-spacing: -0.01em; }
157
+ h4.ce-header { font-size: 1.25em; }
158
+
159
+ /* ============================================
160
+ PARAGRAPH
161
+ ============================================ */
162
+
163
+ .ce-paragraph {
164
+ line-height: 1.8;
165
+ font-size: 16px;
166
+ color: #334155;
167
+ }
168
+
169
+ .ce-paragraph[data-placeholder]:empty::before {
170
+ color: #94a3b8;
171
+ font-style: normal;
172
+ }
173
+
174
+ /* ============================================
175
+ LIST
176
+ ============================================ */
177
+
178
+ .cdx-list,
179
+ .cdx-nested-list {
180
+ padding-left: 28px;
181
+ }
182
+
183
+ .cdx-list__item,
184
+ .cdx-nested-list__item-content {
185
+ padding: 6px 0;
186
+ line-height: 1.7;
187
+ }
188
+
189
+ /* ============================================
190
+ CHECKLIST
191
+ ============================================ */
192
+
193
+ .cdx-checklist__item {
194
+ display: flex;
195
+ align-items: flex-start;
196
+ padding: 10px 12px;
197
+ margin: 4px 0;
198
+ background: #fafbfc;
199
+ border-radius: 10px;
200
+ border: 1px solid transparent;
201
+ transition: all 0.15s ease;
202
+ }
203
+
204
+ .cdx-checklist__item:hover {
205
+ background: #f5f3ff;
206
+ border-color: #e9e3f5;
207
+ }
208
+
209
+ .cdx-checklist__item-checkbox {
210
+ width: 22px;
211
+ height: 22px;
212
+ border: 2px solid #cbd5e1;
213
+ border-radius: 6px;
214
+ margin-right: 14px;
215
+ flex-shrink: 0;
216
+ transition: all 0.2s ease;
217
+ cursor: pointer;
218
+ position: relative;
219
+ }
220
+
221
+ .cdx-checklist__item-checkbox:hover {
222
+ border-color: #7C3AED;
223
+ box-shadow: 0 0 0 3px rgba(124, 58, 237, 0.1);
224
+ }
225
+
226
+ .cdx-checklist__item--checked .cdx-checklist__item-checkbox {
227
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
228
+ border-color: #7C3AED;
229
+ }
230
+
231
+ .cdx-checklist__item--checked .cdx-checklist__item-checkbox::after {
232
+ content: '✓';
233
+ color: white;
234
+ font-size: 13px;
235
+ font-weight: bold;
236
+ position: absolute;
237
+ top: 50%;
238
+ left: 50%;
239
+ transform: translate(-50%, -50%);
240
+ }
241
+
242
+ .cdx-checklist__item--checked .cdx-checklist__item-text {
243
+ text-decoration: line-through;
244
+ color: #94a3b8;
245
+ }
246
+
247
+ /* ============================================
248
+ QUOTE
249
+ ============================================ */
250
+
251
+ .cdx-quote {
252
+ padding: 24px 28px;
253
+ border-left: 4px solid #7C3AED;
254
+ background: linear-gradient(135deg, #faf8ff 0%, #f5f3ff 100%);
255
+ border-radius: 0 16px 16px 0;
256
+ margin: 16px 0;
257
+ position: relative;
258
+ }
259
+
260
+ .cdx-quote::before {
261
+ content: '"';
262
+ position: absolute;
263
+ top: 12px;
264
+ left: 20px;
265
+ font-size: 56px;
266
+ color: #ddd6fe;
267
+ font-family: Georgia, serif;
268
+ line-height: 1;
269
+ }
270
+
271
+ .cdx-quote__text {
272
+ font-style: italic;
273
+ font-size: 17px;
274
+ line-height: 1.75;
275
+ color: #334155;
276
+ padding-left: 32px;
277
+ min-height: auto;
278
+ }
279
+
280
+ .cdx-quote__caption {
281
+ margin-top: 14px;
282
+ font-size: 14px;
283
+ color: #7C3AED;
284
+ font-weight: 600;
285
+ padding-left: 32px;
286
+ }
287
+
288
+ .cdx-quote__caption::before {
289
+ content: '— ';
290
+ }
291
+
292
+ /* ============================================
293
+ WARNING
294
+ ============================================ */
295
+
296
+ .cdx-warning {
297
+ display: flex;
298
+ align-items: flex-start;
299
+ padding: 20px 24px;
300
+ background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
301
+ border: 1px solid #fcd34d;
302
+ border-radius: 16px;
303
+ margin: 16px 0;
304
+ }
305
+
306
+ .cdx-warning__icon {
307
+ width: 28px;
308
+ height: 28px;
309
+ margin-right: 18px;
310
+ color: #d97706;
311
+ flex-shrink: 0;
312
+ }
313
+
314
+ .cdx-warning__title {
315
+ font-weight: 700;
316
+ margin-bottom: 6px;
317
+ color: #92400e;
318
+ font-size: 15px;
319
+ }
320
+
321
+ .cdx-warning__message {
322
+ font-size: 15px;
323
+ line-height: 1.65;
324
+ color: #78350f;
325
+ }
326
+
327
+ /* ============================================
328
+ CODE
329
+ ============================================ */
330
+
331
+ .ce-code__textarea {
332
+ font-family: 'JetBrains Mono', 'Fira Code', 'SF Mono', Monaco, monospace;
333
+ font-size: 14px;
334
+ background: linear-gradient(180deg, #1e1e2e 0%, #252536 100%);
335
+ color: #e2e8f0;
336
+ border-radius: 16px;
337
+ padding: 24px;
338
+ border: none;
339
+ resize: vertical;
340
+ min-height: 140px;
341
+ line-height: 1.65;
342
+ tab-size: 2;
343
+ box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.2);
344
+ }
345
+
346
+ .ce-code__textarea::placeholder {
347
+ color: #64748b;
348
+ }
349
+
350
+ /* ============================================
351
+ TABLE
352
+ ============================================ */
353
+
354
+ .tc-table {
355
+ width: 100%;
356
+ border-collapse: separate;
357
+ border-spacing: 0;
358
+ margin: 16px 0;
359
+ border: 1px solid #e2e8f0;
360
+ border-radius: 16px;
361
+ overflow: hidden;
362
+ box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
363
+ }
364
+
365
+ .tc-table__cell {
366
+ border: 1px solid #e2e8f0;
367
+ padding: 14px 18px;
368
+ vertical-align: top;
369
+ transition: background 0.15s ease;
370
+ font-size: 14px;
371
+ }
372
+
373
+ .tc-table__cell:focus {
374
+ background: rgba(124, 58, 237, 0.05);
375
+ outline: none;
376
+ }
377
+
378
+ .tc-table__cell--head {
379
+ background: linear-gradient(180deg, #f8fafc 0%, #f1f5f9 100%);
380
+ font-weight: 600;
381
+ color: #334155;
382
+ }
383
+
384
+ .tc-row:first-child .tc-table__cell:first-child { border-top-left-radius: 15px; }
385
+ .tc-row:first-child .tc-table__cell:last-child { border-top-right-radius: 15px; }
386
+ .tc-row:last-child .tc-table__cell:first-child { border-bottom-left-radius: 15px; }
387
+ .tc-row:last-child .tc-table__cell:last-child { border-bottom-right-radius: 15px; }
388
+
389
+ /* ============================================
390
+ DELIMITER
391
+ ============================================ */
392
+
393
+ .ce-delimiter {
394
+ text-align: center;
395
+ padding: 40px 0;
396
+ position: relative;
397
+ }
398
+
399
+ .ce-delimiter::before {
400
+ content: '';
401
+ position: absolute;
402
+ left: 50%;
403
+ top: 50%;
404
+ transform: translate(-50%, -50%);
405
+ width: 100px;
406
+ height: 4px;
407
+ background: linear-gradient(90deg, transparent, #7C3AED, transparent);
408
+ border-radius: 2px;
409
+ }
410
+
411
+ /* ============================================
412
+ IMAGE
413
+ ============================================ */
414
+
415
+ .image-tool {
416
+ border-radius: 16px;
417
+ overflow: hidden;
418
+ margin: 20px 0;
419
+ background: #f8fafc;
420
+ border: 1px solid #e2e8f0;
421
+ transition: all 0.2s ease;
422
+ }
423
+
424
+ .image-tool:hover {
425
+ box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
426
+ transform: translateY(-2px);
427
+ }
428
+
429
+ .image-tool__image {
430
+ max-width: 100%;
431
+ display: block;
432
+ }
433
+
434
+ .image-tool__image-picture {
435
+ max-width: 100%;
436
+ display: block;
437
+ }
438
+
439
+ .image-tool__caption {
440
+ font-size: 13px;
441
+ color: #64748b;
442
+ padding: 14px 18px;
443
+ text-align: center;
444
+ background: #f8fafc;
445
+ border-top: 1px solid #e2e8f0;
446
+ }
447
+
448
+ .image-tool--withBorder .image-tool__image {
449
+ border: 2px solid #e2e8f0;
450
+ border-radius: 12px;
451
+ margin: 12px;
452
+ }
453
+
454
+ .image-tool--withBackground .image-tool__image {
455
+ background: linear-gradient(135deg, #f1f5f9 0%, #e2e8f0 100%);
456
+ padding: 32px;
457
+ }
458
+
459
+ .image-tool--stretched .image-tool__image-picture {
460
+ width: 100%;
461
+ }
462
+
463
+ /* ============================================
464
+ LINK TOOL
465
+ ============================================ */
466
+
467
+ .link-tool {
468
+ border: 1px solid #e2e8f0;
469
+ border-radius: 16px;
470
+ overflow: hidden;
471
+ margin: 16px 0;
472
+ transition: all 0.2s ease;
473
+ }
474
+
475
+ .link-tool:hover {
476
+ border-color: #7C3AED;
477
+ box-shadow: 0 8px 24px rgba(124, 58, 237, 0.12);
478
+ transform: translateY(-2px);
479
+ }
480
+
481
+ .link-tool__content {
482
+ display: flex;
483
+ padding: 18px;
484
+ background: linear-gradient(135deg, #fafbff 0%, #f8f9ff 100%);
485
+ }
486
+
487
+ .link-tool__image {
488
+ width: 110px;
489
+ height: 110px;
490
+ object-fit: cover;
491
+ border-radius: 12px;
492
+ margin-right: 20px;
493
+ flex-shrink: 0;
494
+ border: 1px solid #e2e8f0;
495
+ }
496
+
497
+ .link-tool__title {
498
+ font-weight: 700;
499
+ font-size: 16px;
500
+ margin-bottom: 8px;
501
+ color: #1e293b;
502
+ line-height: 1.4;
503
+ }
504
+
505
+ .link-tool__description {
506
+ font-size: 14px;
507
+ color: #64748b;
508
+ line-height: 1.55;
509
+ margin-bottom: 10px;
510
+ display: -webkit-box;
511
+ line-clamp: 2;
512
+ -webkit-line-clamp: 2;
513
+ -webkit-box-orient: vertical;
514
+ overflow: hidden;
515
+ }
516
+
517
+ .link-tool__anchor {
518
+ font-size: 13px;
519
+ color: #7C3AED;
520
+ font-weight: 600;
521
+ }
522
+
523
+ /* ============================================
524
+ EMBED
525
+ ============================================ */
526
+
527
+ .embed-tool {
528
+ margin: 20px 0;
529
+ border-radius: 16px;
530
+ overflow: hidden;
531
+ border: 1px solid #e2e8f0;
532
+ }
533
+
534
+ .embed-tool__caption {
535
+ text-align: center;
536
+ font-size: 13px;
537
+ color: #64748b;
538
+ padding: 14px;
539
+ background: #f8fafc;
540
+ }
541
+
542
+ /* ============================================
543
+ RAW HTML
544
+ ============================================ */
545
+
546
+ .ce-rawtool__textarea {
547
+ font-family: 'JetBrains Mono', 'Fira Code', monospace;
548
+ font-size: 14px;
549
+ background: linear-gradient(180deg, #1e1e2e 0%, #252536 100%);
550
+ color: #e2e8f0;
551
+ border-radius: 16px;
552
+ padding: 24px;
553
+ border: none;
554
+ resize: vertical;
555
+ min-height: 140px;
556
+ width: 100%;
557
+ line-height: 1.65;
558
+ box-shadow: inset 0 2px 8px rgba(0, 0, 0, 0.2);
559
+ }
560
+
561
+ /* ============================================
562
+ ATTACHES
563
+ ============================================ */
564
+
565
+ .cdx-attaches {
566
+ background: linear-gradient(135deg, #f8fafc 0%, #f1f5f9 100%);
567
+ border: 1px solid #e2e8f0;
568
+ border-radius: 16px;
569
+ padding: 18px 22px;
570
+ margin: 16px 0;
571
+ display: flex;
572
+ align-items: center;
573
+ gap: 18px;
574
+ transition: all 0.2s ease;
575
+ }
576
+
577
+ .cdx-attaches:hover {
578
+ border-color: #7C3AED;
579
+ box-shadow: 0 4px 16px rgba(124, 58, 237, 0.12);
580
+ }
581
+
582
+ .cdx-attaches__file-icon {
583
+ width: 54px;
584
+ height: 54px;
585
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
586
+ border-radius: 12px;
587
+ display: flex;
588
+ align-items: center;
589
+ justify-content: center;
590
+ color: white;
591
+ font-weight: bold;
592
+ font-size: 12px;
593
+ text-transform: uppercase;
594
+ box-shadow: 0 4px 12px rgba(124, 58, 237, 0.3);
595
+ }
596
+
597
+ .cdx-attaches__file-info { flex: 1; }
598
+
599
+ .cdx-attaches__title {
600
+ font-weight: 600;
601
+ font-size: 15px;
602
+ color: #1e293b;
603
+ margin-bottom: 4px;
604
+ }
605
+
606
+ .cdx-attaches__size {
607
+ font-size: 13px;
608
+ color: #64748b;
609
+ }
610
+
611
+ /* ============================================
612
+ INLINE TOOLS
613
+ ============================================ */
614
+
615
+ .ce-inline-toolbar {
616
+ background: white;
617
+ border: 1px solid #e2e8f0;
618
+ border-radius: 12px;
619
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
620
+ padding: 6px;
621
+ z-index: 9999 !important;
622
+ }
623
+
624
+ .ce-inline-tool {
625
+ width: 36px;
626
+ height: 36px;
627
+ color: #475569;
628
+ border-radius: 8px;
629
+ transition: all 0.15s ease;
630
+ }
631
+
632
+ .ce-inline-tool:hover {
633
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
634
+ color: white;
635
+ }
636
+
637
+ .ce-inline-tool--active {
638
+ color: #7C3AED;
639
+ background: rgba(124, 58, 237, 0.1);
640
+ }
641
+
642
+ /* Marker */
643
+ mark.cdx-marker {
644
+ background: linear-gradient(120deg, #fef08a 0%, #fde047 100%);
645
+ padding: 3px 6px;
646
+ border-radius: 4px;
647
+ }
648
+
649
+ /* Inline Code */
650
+ code.inline-code {
651
+ background: #f1f5f9;
652
+ padding: 4px 10px;
653
+ border-radius: 6px;
654
+ font-family: 'JetBrains Mono', monospace;
655
+ font-size: 0.875em;
656
+ color: #7C3AED;
657
+ border: 1px solid #e2e8f0;
658
+ }
659
+
660
+ /* Underline */
661
+ u {
662
+ text-decoration-color: #7C3AED;
663
+ text-decoration-thickness: 2px;
664
+ text-underline-offset: 3px;
665
+ }
666
+
667
+ /* ============================================
668
+ SETTINGS & TOOLBOX
669
+ ============================================ */
670
+
671
+ .ce-settings {
672
+ background: white;
673
+ border: 1px solid #e2e8f0;
674
+ border-radius: 16px;
675
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
676
+ padding: 10px;
677
+ z-index: 9999 !important;
678
+ }
679
+
680
+ .ce-settings__button {
681
+ width: 40px;
682
+ height: 40px;
683
+ color: #475569;
684
+ border-radius: 10px;
685
+ transition: all 0.15s ease;
686
+ }
687
+
688
+ .ce-settings__button:hover {
689
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
690
+ color: white;
691
+ }
692
+
693
+ .ce-settings__button--active {
694
+ background: rgba(124, 58, 237, 0.1);
695
+ color: #7C3AED;
696
+ }
697
+
698
+ .ce-toolbox {
699
+ background: white;
700
+ border: 1px solid #e2e8f0;
701
+ border-radius: 16px;
702
+ box-shadow: 0 16px 48px rgba(0, 0, 0, 0.18);
703
+ padding: 10px;
704
+ z-index: 9999 !important;
705
+ }
706
+
707
+ .ce-toolbox__button {
708
+ width: 100%;
709
+ padding: 12px 16px;
710
+ color: #475569;
711
+ border-radius: 10px;
712
+ transition: all 0.15s ease;
713
+ display: flex;
714
+ align-items: center;
715
+ gap: 14px;
716
+ }
717
+
718
+ .ce-toolbox__button:hover {
719
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
720
+ color: white;
721
+ }
722
+
723
+ /* ============================================
724
+ CONVERSION TOOLBAR
725
+ ============================================ */
726
+
727
+ .ce-conversion-toolbar {
728
+ background: white;
729
+ border: 1px solid #e2e8f0;
730
+ border-radius: 16px;
731
+ box-shadow: 0 12px 40px rgba(0, 0, 0, 0.15);
732
+ padding: 10px;
733
+ z-index: 9999 !important;
734
+ }
735
+
736
+ .ce-conversion-tool {
737
+ padding: 12px 16px;
738
+ color: #475569;
739
+ border-radius: 10px;
740
+ transition: all 0.15s ease;
741
+ }
742
+
743
+ .ce-conversion-tool:hover {
744
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
745
+ color: white;
746
+ }
747
+
748
+ /* ============================================
749
+ POPOVER
750
+ ============================================ */
751
+
752
+ .ce-popover {
753
+ background: white;
754
+ border: 1px solid #e2e8f0;
755
+ border-radius: 16px;
756
+ box-shadow: 0 16px 48px rgba(0, 0, 0, 0.18);
757
+ z-index: 9999 !important;
758
+ }
759
+
760
+ .ce-popover__item {
761
+ padding: 12px 18px;
762
+ color: #475569;
763
+ border-radius: 10px;
764
+ transition: all 0.15s ease;
765
+ }
766
+
767
+ .ce-popover__item:hover {
768
+ background: linear-gradient(135deg, #7C3AED 0%, #6d28d9 100%);
769
+ color: white;
770
+ }
771
+
772
+ .ce-popover__item-icon {
773
+ width: 30px;
774
+ height: 30px;
775
+ background: #f1f5f9;
776
+ border-radius: 8px;
777
+ display: flex;
778
+ align-items: center;
779
+ justify-content: center;
780
+ margin-right: 14px;
781
+ }
782
+
783
+ .ce-popover__item:hover .ce-popover__item-icon {
784
+ background: rgba(255, 255, 255, 0.2);
785
+ }
786
+
787
+ /* ============================================
788
+ FOCUS & SELECTION
789
+ ============================================ */
790
+
791
+ .ce-block:focus,
792
+ .ce-block *:focus {
793
+ outline: none;
794
+ }
795
+
796
+ ::selection {
797
+ background-color: rgba(124, 58, 237, 0.2);
798
+ }
799
+
800
+ /* ============================================
801
+ ANIMATIONS
802
+ ============================================ */
803
+
804
+ @keyframes fadeInUp {
805
+ from {
806
+ opacity: 0;
807
+ transform: translateY(10px);
808
+ }
809
+ to {
810
+ opacity: 1;
811
+ transform: translateY(0);
812
+ }
813
+ }
814
+
815
+ .ce-block {
816
+ animation: fadeInUp 0.25s ease;
817
+ }
1
818
  /**
2
819
  * AI Assistant Styles for Editor.js
3
820
  * Inline toolbar, suggestions, and tooltips
@@ -34,6 +851,11 @@
34
851
  /* AI Inline Toolbar Container */
35
852
  .ai-inline-toolbar-container {
36
853
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
854
+ z-index: 10000 !important;
855
+ }
856
+
857
+ .ai-inline-toolbar-container > div {
858
+ z-index: 10000 !important;
37
859
  }
38
860
 
39
861
  /* Editor.js Inline Tool Button Customization */
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "magic-editor-x",
3
- "version": "1.3.3",
3
+ "version": "1.3.5",
4
4
  "description": "Advanced block-based editor for Strapi v5 with Editor.js, Media Library integration, and real-time collaboration support",
5
5
  "keywords": [
6
6
  "strapi",
@@ -30,6 +30,7 @@
30
30
  "dist",
31
31
  "README.md",
32
32
  "LICENSE",
33
+ "COPYRIGHT_NOTICE.txt",
33
34
  "pics"
34
35
  ],
35
36
  "scripts": {