@byline/richtext-lexical 6.10.0 → 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 (60) 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/lexical-editor.tsx +2 -0
  60. package/src/richtext-field.module.css +38 -22
@@ -1,26 +1,30 @@
1
- .admonition-modal-container {
2
- max-width: 650px;
3
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
4
2
 
5
- .admonition-modal-header h3 {
6
- margin: 0;
7
- }
3
+ @layer byline-components.cms {
4
+ .admonition-modal-container {
5
+ max-width: 650px;
6
+ }
8
7
 
9
- .admonition-modal-header {
10
- padding-bottom: .75rem;
11
- }
8
+ .admonition-modal-header h3 {
9
+ margin: 0;
10
+ }
12
11
 
13
- .admonition-modal-radio-group {
14
- flex-direction: column;
15
- }
12
+ .admonition-modal-header {
13
+ padding-bottom: .75rem;
14
+ }
16
15
 
17
- @media screen and (min-width: 640px) {
18
16
  .admonition-modal-radio-group {
19
- flex-direction: row;
17
+ flex-direction: column;
20
18
  }
21
19
 
22
- .admonition-modal-actions {
23
- margin: .75rem 0 0;
20
+ @media screen and (min-width: 640px) {
21
+ .admonition-modal-radio-group {
22
+ flex-direction: row;
23
+ }
24
+
25
+ .admonition-modal-actions {
26
+ margin: .75rem 0 0;
27
+ }
24
28
  }
25
29
  }
26
30
 
@@ -1,112 +1,116 @@
1
- .LexicalEditor__admonition {
2
- border: 1px solid #666;
3
- border-left-width: 4px;
4
- border-radius: 3px;
5
- margin-top: .5rem;
6
- margin-bottom: 1.5rem;
7
- padding: 8px 12px 4px;
8
- position: relative;
9
- }
10
-
11
- .LexicalEditor__admonition.admonition-note {
12
- border-left-color: #4a90d9;
13
- }
14
-
15
- .LexicalEditor__admonition.admonition-tip {
16
- border-left-color: #3fa45b;
17
- }
18
-
19
- .LexicalEditor__admonition.admonition-warning {
20
- border-left-color: #d9a334;
21
- }
22
-
23
- .LexicalEditor__admonition.admonition-danger {
24
- border-left-color: #d94a4a;
25
- }
26
-
27
- .LexicalEditor__admonition .AdmonitionNode__header {
28
- text-transform: capitalize;
29
- -webkit-user-select: none;
30
- user-select: none;
31
- align-items: center;
32
- gap: 6px;
33
- margin-bottom: .25rem;
34
- font-size: 1rem;
35
- font-weight: bold;
36
- display: flex;
37
- }
38
-
39
- .LexicalEditor__admonition .AdmonitionNode__icon {
40
- align-items: center;
41
- display: inline-flex;
42
- }
43
-
44
- .LexicalEditor__admonition .AdmonitionNode__icon svg {
45
- fill: currentColor;
46
- width: 20px;
47
- height: 20px;
48
- }
49
-
50
- .LexicalEditor__admonition.admonition-note .AdmonitionNode__icon {
51
- color: #4a90d9;
52
- }
53
-
54
- .LexicalEditor__admonition.admonition-tip .AdmonitionNode__icon {
55
- color: #3fa45b;
56
- }
57
-
58
- .LexicalEditor__admonition.admonition-warning .AdmonitionNode__icon {
59
- color: #d9a334;
60
- }
61
-
62
- .LexicalEditor__admonition.admonition-danger .AdmonitionNode__icon {
63
- color: #d94a4a;
64
- }
65
-
66
- .LexicalEditor__admonition .AdmonitionNode__title {
67
- flex: auto;
68
- }
69
-
70
- .LexicalEditor__admonition .AdmonitionNode__edit-button {
71
- color: inherit;
72
- cursor: pointer;
73
- -webkit-user-select: none;
74
- user-select: none;
75
- background-color: #0000000a;
76
- border: 1px solid #0003;
77
- border-radius: 5px;
78
- flex: none;
79
- padding: 2px 8px;
80
- font-size: .8rem;
81
- }
82
-
83
- .LexicalEditor__admonition .AdmonitionNode__edit-button:hover {
84
- background-color: #3c84f42e;
85
- }
86
-
87
- .LexicalEditor__admonition .AdmonitionNode__content {
88
- color: #4b5563;
89
- font-size: .925em;
90
- }
91
-
92
- .LexicalEditor__admonition .AdmonitionNode__content > * {
93
- margin-bottom: .25em;
94
- }
95
-
96
- .LexicalEditor__admonition .AdmonitionNode__content > :last-child {
97
- margin-bottom: 0;
98
- }
99
-
100
- .dark .LexicalEditor__admonition {
101
- border-color: #444;
102
- }
103
-
104
- .dark .LexicalEditor__admonition .AdmonitionNode__content {
105
- color: #9ca3af;
106
- }
107
-
108
- .dark .LexicalEditor__admonition .AdmonitionNode__edit-button {
109
- background-color: #ffffff14;
110
- border-color: #fff3;
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
2
+
3
+ @layer byline-components.cms {
4
+ .LexicalEditor__admonition {
5
+ border: 1px solid #666;
6
+ border-left-width: 4px;
7
+ border-radius: 3px;
8
+ margin-top: .5rem;
9
+ margin-bottom: 1.5rem;
10
+ padding: 8px 12px 4px;
11
+ position: relative;
12
+ }
13
+
14
+ .LexicalEditor__admonition.admonition-note {
15
+ border-left-color: #4a90d9;
16
+ }
17
+
18
+ .LexicalEditor__admonition.admonition-tip {
19
+ border-left-color: #3fa45b;
20
+ }
21
+
22
+ .LexicalEditor__admonition.admonition-warning {
23
+ border-left-color: #d9a334;
24
+ }
25
+
26
+ .LexicalEditor__admonition.admonition-danger {
27
+ border-left-color: #d94a4a;
28
+ }
29
+
30
+ .LexicalEditor__admonition .AdmonitionNode__header {
31
+ text-transform: capitalize;
32
+ -webkit-user-select: none;
33
+ user-select: none;
34
+ align-items: center;
35
+ gap: 6px;
36
+ margin-bottom: .25rem;
37
+ font-size: 1rem;
38
+ font-weight: bold;
39
+ display: flex;
40
+ }
41
+
42
+ .LexicalEditor__admonition .AdmonitionNode__icon {
43
+ align-items: center;
44
+ display: inline-flex;
45
+ }
46
+
47
+ .LexicalEditor__admonition .AdmonitionNode__icon svg {
48
+ fill: currentColor;
49
+ width: 20px;
50
+ height: 20px;
51
+ }
52
+
53
+ .LexicalEditor__admonition.admonition-note .AdmonitionNode__icon {
54
+ color: #4a90d9;
55
+ }
56
+
57
+ .LexicalEditor__admonition.admonition-tip .AdmonitionNode__icon {
58
+ color: #3fa45b;
59
+ }
60
+
61
+ .LexicalEditor__admonition.admonition-warning .AdmonitionNode__icon {
62
+ color: #d9a334;
63
+ }
64
+
65
+ .LexicalEditor__admonition.admonition-danger .AdmonitionNode__icon {
66
+ color: #d94a4a;
67
+ }
68
+
69
+ .LexicalEditor__admonition .AdmonitionNode__title {
70
+ flex: auto;
71
+ }
72
+
73
+ .LexicalEditor__admonition .AdmonitionNode__edit-button {
74
+ color: inherit;
75
+ cursor: pointer;
76
+ -webkit-user-select: none;
77
+ user-select: none;
78
+ background-color: #0000000a;
79
+ border: 1px solid #0003;
80
+ border-radius: 5px;
81
+ flex: none;
82
+ padding: 2px 8px;
83
+ font-size: .8rem;
84
+ }
85
+
86
+ .LexicalEditor__admonition .AdmonitionNode__edit-button:hover {
87
+ background-color: #3c84f42e;
88
+ }
89
+
90
+ .LexicalEditor__admonition .AdmonitionNode__content {
91
+ color: #4b5563;
92
+ font-size: .925em;
93
+ }
94
+
95
+ .LexicalEditor__admonition .AdmonitionNode__content > * {
96
+ margin-bottom: .25em;
97
+ }
98
+
99
+ .LexicalEditor__admonition .AdmonitionNode__content > :last-child {
100
+ margin-bottom: 0;
101
+ }
102
+
103
+ .dark .LexicalEditor__admonition {
104
+ border-color: #444;
105
+ }
106
+
107
+ .dark .LexicalEditor__admonition .AdmonitionNode__content {
108
+ color: #9ca3af;
109
+ }
110
+
111
+ .dark .LexicalEditor__admonition .AdmonitionNode__edit-button {
112
+ background-color: #ffffff14;
113
+ border-color: #fff3;
114
+ }
111
115
  }
112
116
 
@@ -1,12 +1,16 @@
1
- .danger-icon {
2
- margin-top: 3px;
3
- margin-right: .5rem;
4
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
2
+
3
+ @layer byline-components.cms {
4
+ .danger-icon {
5
+ margin-top: 3px;
6
+ margin-right: .5rem;
7
+ }
5
8
 
6
- .danger-icon svg {
7
- fill: #ce2438;
8
- width: 25px;
9
- height: 25px;
10
- display: block;
9
+ .danger-icon svg {
10
+ fill: #ce2438;
11
+ width: 25px;
12
+ height: 25px;
13
+ display: block;
14
+ }
11
15
  }
12
16
 
@@ -1,12 +1,16 @@
1
- .note-icon {
2
- margin-top: 3px;
3
- margin-right: .5rem;
4
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
2
+
3
+ @layer byline-components.cms {
4
+ .note-icon {
5
+ margin-top: 3px;
6
+ margin-right: .5rem;
7
+ }
5
8
 
6
- .note-icon svg {
7
- fill: #456;
8
- width: 25px;
9
- height: 25px;
10
- display: block;
9
+ .note-icon svg {
10
+ fill: #456;
11
+ width: 25px;
12
+ height: 25px;
13
+ display: block;
14
+ }
11
15
  }
12
16
 
@@ -1,12 +1,16 @@
1
- .tip-icon {
2
- margin-top: 3px;
3
- margin-right: .5rem;
4
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
2
+
3
+ @layer byline-components.cms {
4
+ .tip-icon {
5
+ margin-top: 3px;
6
+ margin-right: .5rem;
7
+ }
5
8
 
6
- .tip-icon svg {
7
- fill: #0fad2f;
8
- width: 25px;
9
- height: 25px;
10
- display: block;
9
+ .tip-icon svg {
10
+ fill: #0fad2f;
11
+ width: 25px;
12
+ height: 25px;
13
+ display: block;
14
+ }
11
15
  }
12
16
 
@@ -1,12 +1,16 @@
1
- .warning-icon {
2
- margin-top: 3px;
3
- margin-right: .5rem;
4
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
2
+
3
+ @layer byline-components.cms {
4
+ .warning-icon {
5
+ margin-top: 3px;
6
+ margin-right: .5rem;
7
+ }
5
8
 
6
- .warning-icon svg {
7
- fill: #e2cf1e;
8
- width: 25px;
9
- height: 25px;
10
- display: block;
9
+ .warning-icon svg {
10
+ fill: #e2cf1e;
11
+ width: 25px;
12
+ height: 25px;
13
+ display: block;
14
+ }
11
15
  }
12
16
 
@@ -1,16 +1,20 @@
1
- .auto-embed-modal-container {
2
- min-width: 340px;
3
- max-width: 600px;
4
- }
5
-
6
- .auto-embed-modal-header {
7
- margin-bottom: 1rem;
8
- }
1
+ @layer base, byline-base, theme, byline-theme, byline-functional, byline-typography, components, byline-components, overrides, byline-utilities, utilities, byline-components.primitives;
9
2
 
10
- @media screen and (min-width: 640px) {
3
+ @layer byline-components.cms {
11
4
  .auto-embed-modal-container {
12
- width: 500px;
13
5
  min-width: 340px;
6
+ max-width: 600px;
7
+ }
8
+
9
+ .auto-embed-modal-header {
10
+ margin-bottom: 1rem;
11
+ }
12
+
13
+ @media screen and (min-width: 640px) {
14
+ .auto-embed-modal-container {
15
+ width: 500px;
16
+ min-width: 340px;
17
+ }
14
18
  }
15
19
  }
16
20