autumnnote 1.0.6 → 1.0.8

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.
package/README.md CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  <p align="center"><img src="image/banner.png" width="120" alt="AutumnNote Banner"/></p>
4
4
 
5
- [![Version](https://img.shields.io/badge/version-1.0.6-blue)](#)
5
+ [![Version](https://img.shields.io/badge/version-1.0.8-blue)](#)
6
6
  [![CI](https://github.com/cmm-cmm/Autumn-Note/actions/workflows/pages.yml/badge.svg)](https://github.com/cmm-cmm/Autumn-Note/actions/workflows/pages.yml)
7
7
  [![JavaScript](https://img.shields.io/badge/JavaScript-ES2022-F7DF1E?logo=javascript&logoColor=black)](https://developer.mozilla.org/en-US/docs/Web/JavaScript)
8
8
  [![Build](https://img.shields.io/badge/Build-Vite-646CFF?logo=vite&logoColor=white)](https://vitejs.dev/)
@@ -51,7 +51,7 @@ Floating toolbars appear automatically when the user clicks on an editable eleme
51
51
  | **Link** | Open in new tab, Edit (reopens dialog), Unlink |
52
52
  | **Image** | Edit alt/URL (reopens dialog), Delete |
53
53
  | **Video** | Edit (reopens dialog), Delete |
54
- | **Table cell** | Row above/below, Delete row, Column left/right, Delete column, Merge cells, Column width, Row height, Border width, Delete table |
54
+ | **Table cell** | Row above/below, Delete row, Column left/right, Delete column, Merge cells, Unmerge cells, Cell selection mode, Column width, Row height, Border width, Delete table |
55
55
  | **Code block** (`<pre>`) | Copy code, Delete block |
56
56
 
57
57
  ### Context menu
@@ -74,7 +74,7 @@ Right-click inside the editor opens a context menu with: **Undo**, **Redo**, **C
74
74
  - **Tree-shakeable** — ES module build; all core utilities are individually exported
75
75
 
76
76
  ### Security
77
- - All HTML (pasted content, `setHTML()`, or code-view output) is passed through a DOM-based sanitiser that strips `<script>`, `<iframe>`, `<object>`, `<embed>`, and all `on*` event handler attributes
77
+ - All HTML (pasted content, `setHTML()`, or code-view output) is passed through a DOM-based sanitiser that strips `<script>`, `<object>`, `<embed>`, and all `on*` event handler attributes; `<iframe>` elements are permitted in `setHTML()` to support embedded content
78
78
  - `javascript:` and `data:` URLs are rejected in links and images
79
79
  - Clipboard paste sanitises rich content to remove XSS vectors before inserting
80
80
 
@@ -30,7 +30,22 @@
30
30
  .an-container.an-disabled .an-editable {
31
31
  cursor: text;
32
32
  user-select: text;
33
- background: #fafafa;
33
+ }
34
+ .an-container.an-disabled .an-editable ul.an-checklist input[type=checkbox] {
35
+ pointer-events: none;
36
+ cursor: default;
37
+ opacity: 1;
38
+ }
39
+ .an-container.an-disabled .an-editable img {
40
+ -webkit-user-drag: none;
41
+ user-drag: none;
42
+ }
43
+ .an-container.an-disabled .an-editable .an-video-wrapper {
44
+ -webkit-user-drag: none;
45
+ user-drag: none;
46
+ }
47
+ .an-container.an-disabled .an-editable .an-video-wrapper .an-video-shield {
48
+ pointer-events: none;
34
49
  }
35
50
  .an-container.an-fullscreen {
36
51
  position: fixed;
@@ -60,6 +75,9 @@
60
75
  align-items: center;
61
76
  gap: 2px;
62
77
  }
78
+ .an-btn-group > .an-btn {
79
+ padding: 0;
80
+ }
63
81
  .an-btn-group + .an-btn-group {
64
82
  position: relative;
65
83
  padding-left: 8px;
@@ -326,6 +344,7 @@
326
344
  }
327
345
 
328
346
  .an-editable {
347
+ position: relative;
329
348
  flex: 1;
330
349
  padding: 12px 14px;
331
350
  min-height: 0;
@@ -339,7 +358,10 @@
339
358
  content: attr(data-placeholder);
340
359
  color: #6b7280;
341
360
  pointer-events: none;
342
- float: left;
361
+ position: absolute;
362
+ top: 12px;
363
+ left: 14px;
364
+ right: 14px;
343
365
  }
344
366
  .an-editable p {
345
367
  margin: 0 0 0.75em;
@@ -349,8 +371,9 @@
349
371
  line-height: 1.3;
350
372
  }
351
373
  .an-editable ul, .an-editable ol {
352
- margin: 0 0 0.75em 1.5em;
353
- padding: 0;
374
+ margin: 0 0 0.75em 0;
375
+ padding-left: 1.5em;
376
+ list-style-position: inside;
354
377
  }
355
378
  .an-editable li {
356
379
  margin-bottom: 0.25em;
@@ -413,7 +436,16 @@
413
436
  inset: 0;
414
437
  z-index: 2;
415
438
  cursor: default;
439
+ pointer-events: all;
416
440
  }
441
+ .an-video-wrapper .an-video-shield {
442
+ position: absolute;
443
+ inset: 0;
444
+ z-index: 2;
445
+ cursor: default;
446
+ pointer-events: all;
447
+ }
448
+
417
449
  .an-editable table, .an-editable .an-table {
418
450
  border-collapse: collapse;
419
451
  table-layout: fixed;
@@ -529,6 +561,25 @@
529
561
  letter-spacing: 0.02em;
530
562
  }
531
563
 
564
+ .an-link-tooltip-btn--active {
565
+ background: rgba(59, 130, 246, 0.12) !important;
566
+ color: #3b82f6 !important;
567
+ }
568
+ .an-link-tooltip-btn--active svg {
569
+ stroke: #3b82f6;
570
+ }
571
+
572
+ .an-cell-selected {
573
+ background-color: rgba(59, 130, 246, 0.18) !important;
574
+ outline: 2px solid #3b82f6;
575
+ outline-offset: -2px;
576
+ }
577
+
578
+ .an-table-select-mode td,
579
+ .an-table-select-mode th {
580
+ cursor: cell;
581
+ }
582
+
532
583
  .an-size-popover {
533
584
  position: fixed;
534
585
  background: #ffffff;
@@ -821,6 +872,91 @@
821
872
  background: #d1d5db;
822
873
  }
823
874
 
875
+ .an-context-icon--color {
876
+ flex-direction: column;
877
+ gap: 2px;
878
+ width: 16px;
879
+ align-items: center;
880
+ }
881
+ .an-context-icon--color .an-context-icon-svg {
882
+ display: flex;
883
+ align-items: center;
884
+ justify-content: center;
885
+ line-height: 0;
886
+ }
887
+
888
+ .an-context-color-strip {
889
+ display: block;
890
+ width: 100%;
891
+ height: 3px;
892
+ border-radius: 1px;
893
+ flex-shrink: 0;
894
+ }
895
+
896
+ .an-context-color-palette {
897
+ display: flex;
898
+ flex-wrap: wrap;
899
+ gap: 3px;
900
+ padding: 6px 12px 2px;
901
+ }
902
+
903
+ .an-context-color-swatch {
904
+ width: 15px;
905
+ height: 15px;
906
+ border-radius: 3px;
907
+ border: 1px solid rgba(0, 0, 0, 0.12);
908
+ cursor: pointer;
909
+ flex-shrink: 0;
910
+ position: relative;
911
+ transition: transform 0.1s;
912
+ }
913
+ .an-context-color-swatch:hover {
914
+ transform: scale(1.28);
915
+ z-index: 1;
916
+ border-color: rgba(0, 0, 0, 0.4);
917
+ }
918
+
919
+ .an-context-color-none {
920
+ display: flex;
921
+ align-items: center;
922
+ justify-content: center;
923
+ background: #fff !important;
924
+ color: #999;
925
+ }
926
+ .an-context-color-none svg {
927
+ display: block;
928
+ }
929
+ .an-context-color-none:hover {
930
+ color: #333;
931
+ }
932
+
933
+ .an-context-color-custom {
934
+ display: flex;
935
+ align-items: center;
936
+ gap: 8px;
937
+ padding: 4px 12px 8px;
938
+ font-size: 12px;
939
+ color: #6b7280;
940
+ cursor: pointer;
941
+ }
942
+ .an-context-color-custom input[type=color] {
943
+ width: 18px;
944
+ height: 18px;
945
+ padding: 0;
946
+ border: 1px solid #d1d5db;
947
+ border-radius: 3px;
948
+ cursor: pointer;
949
+ background: transparent;
950
+ -webkit-appearance: none;
951
+ appearance: none;
952
+ }
953
+ .an-context-color-custom span {
954
+ flex: 1;
955
+ }
956
+ .an-context-color-custom:hover span {
957
+ color: #111827;
958
+ }
959
+
824
960
  .an-image-resizer {
825
961
  position: absolute;
826
962
  z-index: 10000;
@@ -1265,6 +1401,7 @@
1265
1401
  .an-editable figure.an-figure img {
1266
1402
  display: block;
1267
1403
  max-width: 100%;
1404
+ margin: 0 auto;
1268
1405
  }
1269
1406
  .an-editable figcaption.an-figcaption {
1270
1407
  font-size: 0.85em;
@@ -1506,6 +1643,17 @@
1506
1643
  border-color: #3f3f5f;
1507
1644
  color: #cdd6f4;
1508
1645
  }
1646
+ .an-theme-dark .an-link-tooltip-btn--active {
1647
+ background: rgba(99, 102, 241, 0.2) !important;
1648
+ color: #818cf8 !important;
1649
+ }
1650
+ .an-theme-dark .an-link-tooltip-btn--active svg {
1651
+ stroke: #818cf8;
1652
+ }
1653
+ .an-theme-dark .an-cell-selected {
1654
+ background-color: rgba(99, 102, 241, 0.25) !important;
1655
+ outline-color: #6366f1;
1656
+ }
1509
1657
  .an-theme-dark .an-table-cell {
1510
1658
  background: #24273a;
1511
1659
  border-color: #3f3f5f;
@@ -1520,6 +1668,22 @@
1520
1668
  .an-theme-dark .an-context-sep {
1521
1669
  background: #3f3f5f;
1522
1670
  }
1671
+ .an-theme-dark .an-context-color-swatch {
1672
+ border-color: rgba(255, 255, 255, 0.15);
1673
+ }
1674
+ .an-theme-dark .an-context-color-swatch:hover {
1675
+ border-color: rgba(255, 255, 255, 0.5);
1676
+ }
1677
+ .an-theme-dark .an-context-color-none {
1678
+ background: #1e1e2e !important;
1679
+ color: #888;
1680
+ }
1681
+ .an-theme-dark .an-context-color-none:hover {
1682
+ color: #ccc;
1683
+ }
1684
+ .an-theme-dark .an-context-color-custom input[type=color] {
1685
+ border-color: #3f3f5f;
1686
+ }
1523
1687
  .an-theme-dark .an-icon-cat {
1524
1688
  border-color: #3f3f5f;
1525
1689
  color: #a6adc8;