@payloadcms/richtext-slate 3.0.0-beta.44 → 3.0.0-beta.45

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.
@@ -1,5 +1,5 @@
1
1
  @import 'styles';
2
- @import './toastify.scss';
2
+ @import './toasts.scss';
3
3
  @import './colors.scss';
4
4
 
5
5
  :root {
@@ -0,0 +1,111 @@
1
+ .payload-toast-container {
2
+ .payload-toast-close-button {
3
+ left: unset;
4
+ right: 0.5rem;
5
+ top: 1.55rem;
6
+ color: var(--theme-elevation-400);
7
+ background: unset;
8
+ border: none;
9
+ display: flex;
10
+ width: 1.25rem;
11
+ height: 1.25rem;
12
+ justify-content: center;
13
+ align-items: center;
14
+
15
+ &:hover {
16
+ background: none;
17
+ }
18
+
19
+ svg {
20
+ width: 2rem;
21
+ height: 2rem;
22
+ }
23
+
24
+ [dir='RTL'] & {
25
+ right: unset;
26
+ left: 0.5rem;
27
+ }
28
+ }
29
+
30
+ .payload-toast-item {
31
+ padding: 1rem 2.5rem 1rem 1rem;
32
+ color: var(--theme-text);
33
+ font-style: normal;
34
+ font-weight: 600;
35
+ display: flex;
36
+ gap: 1rem;
37
+ align-items: center;
38
+ width: 100%;
39
+ border-radius: 0.15rem;
40
+ border: 1px solid var(--theme-border-color);
41
+ background: var(--theme-input-bg);
42
+ box-shadow:
43
+ 0px 10px 4px -8px rgba(0, 2, 4, 0.02),
44
+ 0px 2px 3px 0px rgba(0, 2, 4, 0.05);
45
+
46
+ .toast-content {
47
+ transition: opacity 100ms cubic-bezier(0.55, 0.055, 0.675, 0.19);
48
+ }
49
+
50
+ &[data-front='false'] {
51
+ .toast-content {
52
+ opacity: 0;
53
+ }
54
+ }
55
+
56
+ &[data-expanded='true'] {
57
+ .toast-content {
58
+ opacity: 1;
59
+ }
60
+ }
61
+
62
+ .toast-icon {
63
+ svg {
64
+ width: 2.4rem;
65
+ height: 2.4rem;
66
+ }
67
+ }
68
+
69
+ &.toast-warning {
70
+ border-color: var(--theme-warning-200);
71
+ background-color: var(--theme-warning-100);
72
+ }
73
+
74
+ &.toast-error {
75
+ border-color: var(--theme-error-300);
76
+ background-color: var(--theme-error-150);
77
+ }
78
+
79
+ &.toast-success {
80
+ border-color: var(--theme-success-200);
81
+ background-color: var(--theme-success-100);
82
+ }
83
+
84
+ &.toast-info {
85
+ border-color: var(--theme-elevation-250);
86
+ background-color: var(--theme-elevation-100);
87
+ }
88
+
89
+ [data-theme='light'] & {
90
+ &.toast-warning {
91
+ border-color: var(--theme-warning-550);
92
+ background-color: var(--theme-warning-100);
93
+ }
94
+
95
+ &.toast-error {
96
+ border-color: var(--theme-error-200);
97
+ background-color: var(--theme-error-50);
98
+ }
99
+
100
+ &.toast-success {
101
+ border-color: var(--theme-success-550);
102
+ background-color: var(--theme-success-50);
103
+ }
104
+
105
+ &.toast-info {
106
+ border-color: var(--theme-border-color);
107
+ background-color: var(--theme-elevation-50);
108
+ }
109
+ }
110
+ }
111
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@payloadcms/richtext-slate",
3
- "version": "3.0.0-beta.44",
3
+ "version": "3.0.0-beta.45",
4
4
  "description": "The officially supported Slate richtext adapter for Payload",
5
5
  "homepage": "https://payloadcms.com",
6
6
  "repository": {
@@ -36,15 +36,15 @@
36
36
  "@types/node": "20.12.5",
37
37
  "@types/react": "npm:types-react@19.0.0-beta.2",
38
38
  "@types/react-dom": "npm:types-react-dom@19.0.0-beta.2",
39
- "@payloadcms/eslint-config": "1.1.1",
40
- "payload": "3.0.0-beta.44",
41
- "@payloadcms/ui": "3.0.0-beta.44"
39
+ "payload": "3.0.0-beta.45",
40
+ "@payloadcms/ui": "3.0.0-beta.45",
41
+ "@payloadcms/eslint-config": "1.1.1"
42
42
  },
43
43
  "peerDependencies": {
44
44
  "react": "^19.0.0 || ^19.0.0-rc-f994737d14-20240522",
45
- "@payloadcms/ui": "3.0.0-beta.44",
46
- "payload": "3.0.0-beta.44",
47
- "@payloadcms/translations": "3.0.0-beta.44"
45
+ "@payloadcms/translations": "3.0.0-beta.45",
46
+ "payload": "3.0.0-beta.45",
47
+ "@payloadcms/ui": "3.0.0-beta.45"
48
48
  },
49
49
  "engines": {
50
50
  "node": "^18.20.2 || >=20.9.0"
@@ -1,58 +0,0 @@
1
- @import 'vars';
2
-
3
- .Toastify {
4
- .Toastify__toast-container {
5
- left: base(5);
6
- transform: none;
7
- right: base(5);
8
- width: auto;
9
- }
10
-
11
- .Toastify__toast {
12
- padding: base(0.5);
13
- border-radius: $style-radius-m;
14
- font-weight: 600;
15
- }
16
-
17
- .Toastify__close-button {
18
- align-self: center;
19
- opacity: 0.7;
20
-
21
- &:hover {
22
- opacity: 1;
23
- }
24
- }
25
-
26
- .Toastify__toast--success {
27
- color: var(--color-success-900);
28
- background: var(--color-success-500);
29
-
30
- .Toastify__progress-bar {
31
- background-color: var(--color-success-900);
32
- }
33
- }
34
-
35
- .Toastify__close-button--success {
36
- color: var(--color-success-900);
37
- }
38
-
39
- .Toastify__toast--error {
40
- background: var(--theme-error-500);
41
- color: #fff;
42
-
43
- .Toastify__progress-bar {
44
- background-color: #fff;
45
- }
46
- }
47
-
48
- .Toastify__close-button--light {
49
- color: inherit;
50
- }
51
-
52
- @include mid-break {
53
- .Toastify__toast-container {
54
- left: $baseline;
55
- right: $baseline;
56
- }
57
- }
58
- }