@byline/richtext-lexical 6.10.1 → 6.11.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.
Files changed (59) hide show
  1. package/dist/field/content-editable.css +22 -18
  2. package/dist/field/editor-component.css +33 -29
  3. package/dist/field/editor.css +1218 -1214
  4. package/dist/field/extensions/admonition/admonition-modal.css +20 -16
  5. package/dist/field/extensions/admonition/admonition-node.css +114 -110
  6. package/dist/field/extensions/admonition/icons/danger-icon.css +13 -9
  7. package/dist/field/extensions/admonition/icons/note-icon.css +13 -9
  8. package/dist/field/extensions/admonition/icons/tip-icon.css +13 -9
  9. package/dist/field/extensions/admonition/icons/warning-icon.css +13 -9
  10. package/dist/field/extensions/auto-embed/auto-embed-modal.css +14 -10
  11. package/dist/field/extensions/floating-text-format/index.css +130 -126
  12. package/dist/field/extensions/inline-image/inline-image-modal.css +120 -116
  13. package/dist/field/extensions/inline-image/inline-image-node-component.css +243 -239
  14. package/dist/field/extensions/layout/insert-layout-modal.css +16 -12
  15. package/dist/field/extensions/link/floating-link-editor.css +113 -109
  16. package/dist/field/extensions/link/link-target-fields.css +61 -57
  17. package/dist/field/normalize/adapted-notice.css +2 -4
  18. package/dist/field/plugins/table-plugin/table-modal.css +17 -13
  19. package/dist/field/themes/lexical-editor-theme.css +471 -467
  20. package/dist/field/ui/button.css +28 -24
  21. package/dist/field/ui/checkbox.css +43 -39
  22. package/dist/field/ui/color-picker.css +69 -65
  23. package/dist/field/ui/dialog.css +18 -14
  24. package/dist/field/ui/input.css +23 -19
  25. package/dist/field/ui/modal.css +66 -62
  26. package/dist/field/ui/placeholder.css +25 -21
  27. package/dist/field/ui/select.css +32 -28
  28. package/dist/field/ui/text-area.css +29 -25
  29. package/dist/richtext-field_module.css +21 -17
  30. package/package.json +6 -6
  31. package/src/field/content-editable.css +31 -17
  32. package/src/field/editor-component.css +56 -40
  33. package/src/field/editor.css +1248 -1232
  34. package/src/field/extensions/admonition/admonition-modal.css +32 -16
  35. package/src/field/extensions/admonition/admonition-node.css +105 -89
  36. package/src/field/extensions/admonition/icons/danger-icon.css +25 -9
  37. package/src/field/extensions/admonition/icons/note-icon.css +25 -9
  38. package/src/field/extensions/admonition/icons/tip-icon.css +25 -9
  39. package/src/field/extensions/admonition/icons/warning-icon.css +25 -9
  40. package/src/field/extensions/auto-embed/auto-embed-modal.css +25 -9
  41. package/src/field/extensions/floating-text-format/index.css +142 -126
  42. package/src/field/extensions/inline-image/inline-image-modal.css +144 -128
  43. package/src/field/extensions/inline-image/inline-image-node-component.css +258 -242
  44. package/src/field/extensions/layout/insert-layout-modal.css +28 -12
  45. package/src/field/extensions/link/floating-link-editor.css +129 -113
  46. package/src/field/extensions/link/link-target-fields.css +68 -52
  47. package/src/field/normalize/adapted-notice.css +5 -4
  48. package/src/field/plugins/table-plugin/table-modal.css +29 -13
  49. package/src/field/themes/lexical-editor-theme.css +508 -494
  50. package/src/field/ui/button.css +46 -30
  51. package/src/field/ui/checkbox.css +62 -46
  52. package/src/field/ui/color-picker.css +89 -73
  53. package/src/field/ui/dialog.css +30 -14
  54. package/src/field/ui/input.css +38 -22
  55. package/src/field/ui/modal.css +81 -65
  56. package/src/field/ui/placeholder.css +36 -20
  57. package/src/field/ui/select.css +46 -30
  58. package/src/field/ui/text-area.css +45 -29
  59. package/src/richtext-field.module.css +38 -22
package/src/field/extensions/admonition/admonition-modal.css CHANGED
@@ -1,25 +1,41 @@
1
- .admonition-modal-container {
2
- max-width: 650px;
3
- }
1
+ @layer base,
2
+ byline-base,
3
+ theme,
4
+ byline-theme,
5
+ byline-functional,
6
+ byline-typography,
7
+ components,
8
+ byline-components,
9
+ overrides,
10
+ byline-utilities,
11
+ utilities;
4
12
 
5
- .admonition-modal-header h3 {
6
- margin: 0;
7
- }
13
+ @layer byline-components.primitives, byline-components.cms;
8
14
 
9
- .admonition-modal-header {
10
- padding-bottom: 0.75rem;
11
- }
15
+ @layer byline-components.cms {
16
+ .admonition-modal-container {
17
+ max-width: 650px;
18
+ }
12
19
 
13
- .admonition-modal-radio-group {
14
- flex-direction: column;
15
- }
20
+ .admonition-modal-header h3 {
21
+ margin: 0;
22
+ }
23
+
24
+ .admonition-modal-header {
25
+ padding-bottom: 0.75rem;
26
+ }
16
27
 
17
- @media screen and (min-width: 640px) {
18
28
  .admonition-modal-radio-group {
19
- flex-direction: row;
29
+ flex-direction: column;
20
30
  }
21
31
 
22
- .admonition-modal-actions {
23
- margin: 0.75rem 0 0;
32
+ @media screen and (min-width: 640px) {
33
+ .admonition-modal-radio-group {
34
+ flex-direction: row;
35
+ }
36
+
37
+ .admonition-modal-actions {
38
+ margin: 0.75rem 0 0;
39
+ }
24
40
  }
25
41
  }
package/src/field/extensions/admonition/admonition-node.css CHANGED
@@ -1,3 +1,17 @@
1
+ @layer base,
2
+ byline-base,
3
+ theme,
4
+ byline-theme,
5
+ byline-functional,
6
+ byline-typography,
7
+ components,
8
+ byline-components,
9
+ overrides,
10
+ byline-utilities,
11
+ utilities;
12
+
13
+ @layer byline-components.primitives, byline-components.cms;
14
+
1
15
  /**
2
16
  * Admonition (callout) block — ElementNode chrome.
3
17
  *
@@ -7,107 +21,109 @@
7
21
  * (the DOM slot returned by `getDOMSlot`).
8
22
  */
9
23
 
10
- .LexicalEditor__admonition {
11
- position: relative;
12
- margin-top: 0.5rem;
13
- margin-bottom: 1.5rem;
14
- padding: 8px 12px 4px;
15
- border: solid 1px #666666;
16
- border-left-width: 4px;
17
- border-radius: 3px;
18
- }
24
+ @layer byline-components.cms {
25
+ .LexicalEditor__admonition {
26
+ position: relative;
27
+ margin-top: 0.5rem;
28
+ margin-bottom: 1.5rem;
29
+ padding: 8px 12px 4px;
30
+ border: solid 1px #666666;
31
+ border-left-width: 4px;
32
+ border-radius: 3px;
33
+ }
19
34
 
20
- /* Per-type accent — colours the left border + header icon. */
21
- .LexicalEditor__admonition.admonition-note {
22
- border-left-color: #4a90d9;
23
- }
24
- .LexicalEditor__admonition.admonition-tip {
25
- border-left-color: #3fa45b;
26
- }
27
- .LexicalEditor__admonition.admonition-warning {
28
- border-left-color: #d9a334;
29
- }
30
- .LexicalEditor__admonition.admonition-danger {
31
- border-left-color: #d94a4a;
32
- }
35
+ /* Per-type accent — colours the left border + header icon. */
36
+ .LexicalEditor__admonition.admonition-note {
37
+ border-left-color: #4a90d9;
38
+ }
39
+ .LexicalEditor__admonition.admonition-tip {
40
+ border-left-color: #3fa45b;
41
+ }
42
+ .LexicalEditor__admonition.admonition-warning {
43
+ border-left-color: #d9a334;
44
+ }
45
+ .LexicalEditor__admonition.admonition-danger {
46
+ border-left-color: #d94a4a;
47
+ }
33
48
 
34
- .LexicalEditor__admonition .AdmonitionNode__header {
35
- display: flex;
36
- align-items: center;
37
- gap: 6px;
38
- font-weight: bold;
39
- font-size: 1rem;
40
- text-transform: capitalize;
41
- margin-bottom: 0.25rem;
42
- user-select: none;
43
- }
49
+ .LexicalEditor__admonition .AdmonitionNode__header {
50
+ display: flex;
51
+ align-items: center;
52
+ gap: 6px;
53
+ font-weight: bold;
54
+ font-size: 1rem;
55
+ text-transform: capitalize;
56
+ margin-bottom: 0.25rem;
57
+ user-select: none;
58
+ }
44
59
 
45
- .LexicalEditor__admonition .AdmonitionNode__icon {
46
- display: inline-flex;
47
- align-items: center;
48
- }
60
+ .LexicalEditor__admonition .AdmonitionNode__icon {
61
+ display: inline-flex;
62
+ align-items: center;
63
+ }
49
64
 
50
- .LexicalEditor__admonition .AdmonitionNode__icon svg {
51
- width: 20px;
52
- height: 20px;
53
- fill: currentColor;
54
- }
65
+ .LexicalEditor__admonition .AdmonitionNode__icon svg {
66
+ width: 20px;
67
+ height: 20px;
68
+ fill: currentColor;
69
+ }
55
70
 
56
- .LexicalEditor__admonition.admonition-note .AdmonitionNode__icon {
57
- color: #4a90d9;
58
- }
59
- .LexicalEditor__admonition.admonition-tip .AdmonitionNode__icon {
60
- color: #3fa45b;
61
- }
62
- .LexicalEditor__admonition.admonition-warning .AdmonitionNode__icon {
63
- color: #d9a334;
64
- }
65
- .LexicalEditor__admonition.admonition-danger .AdmonitionNode__icon {
66
- color: #d94a4a;
67
- }
71
+ .LexicalEditor__admonition.admonition-note .AdmonitionNode__icon {
72
+ color: #4a90d9;
73
+ }
74
+ .LexicalEditor__admonition.admonition-tip .AdmonitionNode__icon {
75
+ color: #3fa45b;
76
+ }
77
+ .LexicalEditor__admonition.admonition-warning .AdmonitionNode__icon {
78
+ color: #d9a334;
79
+ }
80
+ .LexicalEditor__admonition.admonition-danger .AdmonitionNode__icon {
81
+ color: #d94a4a;
82
+ }
68
83
 
69
- .LexicalEditor__admonition .AdmonitionNode__title {
70
- flex: 1 1 auto;
71
- }
84
+ .LexicalEditor__admonition .AdmonitionNode__title {
85
+ flex: 1 1 auto;
86
+ }
72
87
 
73
- .LexicalEditor__admonition .AdmonitionNode__edit-button {
74
- flex: 0 0 auto;
75
- font-size: 0.8rem;
76
- padding: 2px 8px;
77
- border: 1px solid rgba(0, 0, 0, 0.2);
78
- border-radius: 5px;
79
- background-color: rgba(0, 0, 0, 0.04);
80
- color: inherit;
81
- cursor: pointer;
82
- user-select: none;
83
- }
88
+ .LexicalEditor__admonition .AdmonitionNode__edit-button {
89
+ flex: 0 0 auto;
90
+ font-size: 0.8rem;
91
+ padding: 2px 8px;
92
+ border: 1px solid rgba(0, 0, 0, 0.2);
93
+ border-radius: 5px;
94
+ background-color: rgba(0, 0, 0, 0.04);
95
+ color: inherit;
96
+ cursor: pointer;
97
+ user-select: none;
98
+ }
84
99
 
85
- .LexicalEditor__admonition .AdmonitionNode__edit-button:hover {
86
- background-color: rgba(60, 132, 244, 0.18);
87
- }
100
+ .LexicalEditor__admonition .AdmonitionNode__edit-button:hover {
101
+ background-color: rgba(60, 132, 244, 0.18);
102
+ }
88
103
 
89
- .LexicalEditor__admonition .AdmonitionNode__content {
90
- font-size: 0.925em;
91
- color: #4b5563;
92
- }
104
+ .LexicalEditor__admonition .AdmonitionNode__content {
105
+ font-size: 0.925em;
106
+ color: #4b5563;
107
+ }
93
108
 
94
- .LexicalEditor__admonition .AdmonitionNode__content > * {
95
- margin-bottom: 0.25em;
96
- }
109
+ .LexicalEditor__admonition .AdmonitionNode__content > * {
110
+ margin-bottom: 0.25em;
111
+ }
97
112
 
98
- .LexicalEditor__admonition .AdmonitionNode__content > *:last-child {
99
- margin-bottom: 0;
100
- }
113
+ .LexicalEditor__admonition .AdmonitionNode__content > *:last-child {
114
+ margin-bottom: 0;
115
+ }
101
116
 
102
- .dark .LexicalEditor__admonition {
103
- border-color: #444444;
104
- }
117
+ .dark .LexicalEditor__admonition {
118
+ border-color: #444444;
119
+ }
105
120
 
106
- .dark .LexicalEditor__admonition .AdmonitionNode__content {
107
- color: #9ca3af;
108
- }
121
+ .dark .LexicalEditor__admonition .AdmonitionNode__content {
122
+ color: #9ca3af;
123
+ }
109
124
 
110
- .dark .LexicalEditor__admonition .AdmonitionNode__edit-button {
111
- border-color: rgba(255, 255, 255, 0.2);
112
- background-color: rgba(255, 255, 255, 0.08);
125
+ .dark .LexicalEditor__admonition .AdmonitionNode__edit-button {
126
+ border-color: rgba(255, 255, 255, 0.2);
127
+ background-color: rgba(255, 255, 255, 0.08);
128
+ }
113
129
  }
package/src/field/extensions/admonition/icons/danger-icon.css CHANGED
@@ -1,11 +1,27 @@
1
- .danger-icon {
2
- margin-right: 0.5rem;
3
- margin-top: 3px;
4
- }
1
+ @layer base,
2
+ byline-base,
3
+ theme,
4
+ byline-theme,
5
+ byline-functional,
6
+ byline-typography,
7
+ components,
8
+ byline-components,
9
+ overrides,
10
+ byline-utilities,
11
+ utilities;
12
+
13
+ @layer byline-components.primitives, byline-components.cms;
14
+
15
+ @layer byline-components.cms {
16
+ .danger-icon {
17
+ margin-right: 0.5rem;
18
+ margin-top: 3px;
19
+ }
5
20
 
6
- .danger-icon svg {
7
- display: block;
8
- width: 25px;
9
- height: 25px;
10
- fill: #ce2438;
21
+ .danger-icon svg {
22
+ display: block;
23
+ width: 25px;
24
+ height: 25px;
25
+ fill: #ce2438;
26
+ }
11
27
  }
package/src/field/extensions/admonition/icons/note-icon.css CHANGED
@@ -1,11 +1,27 @@
1
- .note-icon {
2
- margin-right: 0.5rem;
3
- margin-top: 3px;
4
- }
1
+ @layer base,
2
+ byline-base,
3
+ theme,
4
+ byline-theme,
5
+ byline-functional,
6
+ byline-typography,
7
+ components,
8
+ byline-components,
9
+ overrides,
10
+ byline-utilities,
11
+ utilities;
12
+
13
+ @layer byline-components.primitives, byline-components.cms;
14
+
15
+ @layer byline-components.cms {
16
+ .note-icon {
17
+ margin-right: 0.5rem;
18
+ margin-top: 3px;
19
+ }
5
20
 
6
- .note-icon svg {
7
- display: block;
8
- width: 25px;
9
- height: 25px;
10
- fill: #445566;
21
+ .note-icon svg {
22
+ display: block;
23
+ width: 25px;
24
+ height: 25px;
25
+ fill: #445566;
26
+ }
11
27
  }
package/src/field/extensions/admonition/icons/tip-icon.css CHANGED
@@ -1,11 +1,27 @@
1
- .tip-icon {
2
- margin-right: 0.5rem;
3
- margin-top: 3px;
4
- }
1
+ @layer base,
2
+ byline-base,
3
+ theme,
4
+ byline-theme,
5
+ byline-functional,
6
+ byline-typography,
7
+ components,
8
+ byline-components,
9
+ overrides,
10
+ byline-utilities,
11
+ utilities;
12
+
13
+ @layer byline-components.primitives, byline-components.cms;
14
+
15
+ @layer byline-components.cms {
16
+ .tip-icon {
17
+ margin-right: 0.5rem;
18
+ margin-top: 3px;
19
+ }
5
20
 
6
- .tip-icon svg {
7
- display: block;
8
- width: 25px;
9
- height: 25px;
10
- fill: #0fad2f;
21
+ .tip-icon svg {
22
+ display: block;
23
+ width: 25px;
24
+ height: 25px;
25
+ fill: #0fad2f;
26
+ }
11
27
  }
package/src/field/extensions/admonition/icons/warning-icon.css CHANGED
@@ -1,11 +1,27 @@
1
- .warning-icon {
2
- margin-right: 0.5rem;
3
- margin-top: 3px;
4
- }
1
+ @layer base,
2
+ byline-base,
3
+ theme,
4
+ byline-theme,
5
+ byline-functional,
6
+ byline-typography,
7
+ components,
8
+ byline-components,
9
+ overrides,
10
+ byline-utilities,
11
+ utilities;
12
+
13
+ @layer byline-components.primitives, byline-components.cms;
14
+
15
+ @layer byline-components.cms {
16
+ .warning-icon {
17
+ margin-right: 0.5rem;
18
+ margin-top: 3px;
19
+ }
5
20
 
6
- .warning-icon svg {
7
- display: block;
8
- width: 25px;
9
- height: 25px;
10
- fill: #e2cf1e;
21
+ .warning-icon svg {
22
+ display: block;
23
+ width: 25px;
24
+ height: 25px;
25
+ fill: #e2cf1e;
26
+ }
11
27
  }
package/src/field/extensions/auto-embed/auto-embed-modal.css CHANGED
@@ -1,15 +1,31 @@
1
- .auto-embed-modal-container {
2
- min-width: 340px;
3
- max-width: 600px;
4
- }
1
+ @layer base,
2
+ byline-base,
3
+ theme,
4
+ byline-theme,
5
+ byline-functional,
6
+ byline-typography,
7
+ components,
8
+ byline-components,
9
+ overrides,
10
+ byline-utilities,
11
+ utilities;
5
12
 
6
- .auto-embed-modal-header {
7
- margin-bottom: 1rem;
8
- }
13
+ @layer byline-components.primitives, byline-components.cms;
9
14
 
10
- @media screen and (min-width: 640px) {
15
+ @layer byline-components.cms {
11
16
  .auto-embed-modal-container {
12
17
  min-width: 340px;
13
- width: 500px;
18
+ max-width: 600px;
19
+ }
20
+
21
+ .auto-embed-modal-header {
22
+ margin-bottom: 1rem;
23
+ }
24
+
25
+ @media screen and (min-width: 640px) {
26
+ .auto-embed-modal-container {
27
+ min-width: 340px;
28
+ width: 500px;
29
+ }
14
30
  }
15
31
  }