@payloadcms/ui 3.0.0-beta.111 → 3.0.0-beta.113
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/dist/elements/AddNewRelation/index.scss +36 -34
- package/dist/elements/AppHeader/index.scss +152 -150
- package/dist/elements/ArrayAction/index.scss +23 -21
- package/dist/elements/Autosave/index.scss +4 -2
- package/dist/elements/Banner/index.scss +51 -49
- package/dist/elements/BulkUpload/ActionsBar/index.scss +45 -43
- package/dist/elements/BulkUpload/AddFilesView/index.scss +23 -21
- package/dist/elements/BulkUpload/AddingFilesView/index.scss +16 -14
- package/dist/elements/BulkUpload/DrawerCloseButton/index.scss +23 -21
- package/dist/elements/BulkUpload/EditForm/index.scss +6 -4
- package/dist/elements/BulkUpload/FileSidebar/index.scss +214 -212
- package/dist/elements/BulkUpload/Header/index.scss +11 -9
- package/dist/elements/Button/index.scss +202 -200
- package/dist/elements/Card/index.scss +58 -56
- package/dist/elements/CodeEditor/index.scss +16 -14
- package/dist/elements/Collapsible/index.scss +125 -123
- package/dist/elements/ColumnSelector/index.scss +36 -34
- package/dist/elements/CopyToClipboard/index.scss +21 -19
- package/dist/elements/DatePicker/index.scss +309 -307
- package/dist/elements/DeleteDocument/index.scss +32 -30
- package/dist/elements/DeleteMany/index.scss +29 -27
- package/dist/elements/DocumentControls/index.js +1 -1
- package/dist/elements/DocumentControls/index.js.map +1 -1
- package/dist/elements/DocumentControls/index.scss +190 -188
- package/dist/elements/DocumentDrawer/index.scss +55 -53
- package/dist/elements/DocumentFields/index.scss +144 -142
- package/dist/elements/Drawer/index.scss +111 -109
- package/dist/elements/Dropzone/index.scss +32 -30
- package/dist/elements/DuplicateDocument/index.scss +31 -29
- package/dist/elements/EditMany/index.scss +162 -160
- package/dist/elements/EditUpload/index.scss +180 -178
- package/dist/elements/ErrorPill/index.scss +27 -25
- package/dist/elements/FieldSelect/index.scss +4 -2
- package/dist/elements/FileDetails/DraggableFileDetails/index.scss +25 -23
- package/dist/elements/FileDetails/FileMeta/index.scss +21 -19
- package/dist/elements/FileDetails/StaticFileDetails/index.scss +104 -102
- package/dist/elements/GenerateConfirmation/index.scss +29 -27
- package/dist/elements/Gutter/index.scss +14 -12
- package/dist/elements/Hamburger/index.scss +38 -36
- package/dist/elements/IDLabel/index.scss +11 -9
- package/dist/elements/ListControls/index.scss +71 -69
- package/dist/elements/ListDrawer/index.scss +93 -91
- package/dist/elements/ListHeader/index.scss +9 -7
- package/dist/elements/ListSelection/index.scss +14 -12
- package/dist/elements/Loading/index.scss +108 -106
- package/dist/elements/Localizer/LocalizerLabel/index.scss +44 -42
- package/dist/elements/Localizer/index.scss +7 -5
- package/dist/elements/Locked/index.scss +11 -9
- package/dist/elements/Nav/NavToggler/index.scss +9 -7
- package/dist/elements/NavGroup/index.scss +43 -41
- package/dist/elements/Pagination/ClickableArrow/index.scss +34 -32
- package/dist/elements/Pagination/index.scss +40 -38
- package/dist/elements/PerPage/index.scss +37 -35
- package/dist/elements/Pill/index.scss +103 -101
- package/dist/elements/Popup/PopupButtonList/index.scss +45 -43
- package/dist/elements/Popup/PopupTrigger/index.scss +23 -21
- package/dist/elements/Popup/index.scss +185 -183
- package/dist/elements/PreviewSizes/index.scss +115 -113
- package/dist/elements/PublishMany/index.scss +28 -26
- package/dist/elements/ReactSelect/ClearIndicator/index.scss +6 -4
- package/dist/elements/ReactSelect/DropdownIndicator/index.scss +11 -9
- package/dist/elements/ReactSelect/MultiValue/index.scss +26 -24
- package/dist/elements/ReactSelect/MultiValueLabel/index.scss +16 -14
- package/dist/elements/ReactSelect/MultiValueRemove/index.scss +20 -18
- package/dist/elements/ReactSelect/ValueContainer/index.scss +22 -20
- package/dist/elements/ReactSelect/index.d.ts.map +1 -1
- package/dist/elements/ReactSelect/index.js +1 -0
- package/dist/elements/ReactSelect/index.js.map +1 -1
- package/dist/elements/ReactSelect/index.scss +63 -60
- package/dist/elements/RelationshipTable/cells/DrawerLink/index.scss +5 -3
- package/dist/elements/RelationshipTable/index.scss +21 -19
- package/dist/elements/RenderTitle/index.scss +7 -5
- package/dist/elements/SearchFilter/index.scss +31 -28
- package/dist/elements/SelectAll/index.scss +5 -3
- package/dist/elements/SelectRow/index.scss +6 -4
- package/dist/elements/ShimmerEffect/index.scss +26 -24
- package/dist/elements/SortColumn/index.scss +51 -49
- package/dist/elements/SortComplex/index.scss +27 -25
- package/dist/elements/Status/index.scss +45 -43
- package/dist/elements/StayLoggedIn/index.scss +28 -26
- package/dist/elements/StepNav/index.scss +62 -61
- package/dist/elements/Table/DefaultCell/fields/Checkbox/index.scss +20 -18
- package/dist/elements/Table/DefaultCell/fields/Code/index.scss +22 -20
- package/dist/elements/Table/DefaultCell/fields/File/index.scss +18 -16
- package/dist/elements/Table/DefaultCell/fields/JSON/index.scss +20 -18
- package/dist/elements/Table/index.scss +74 -72
- package/dist/elements/Thumbnail/index.scss +37 -35
- package/dist/elements/ThumbnailCard/index.scss +31 -29
- package/dist/elements/Tooltip/index.scss +77 -75
- package/dist/elements/UnpublishMany/index.scss +28 -26
- package/dist/elements/Upload/index.scss +122 -120
- package/dist/elements/WhereBuilder/Condition/Number/index.scss +4 -2
- package/dist/elements/WhereBuilder/Condition/Relationship/index.scss +9 -7
- package/dist/elements/WhereBuilder/Condition/Text/index.scss +4 -2
- package/dist/elements/WhereBuilder/Condition/index.scss +43 -41
- package/dist/elements/WhereBuilder/index.scss +28 -26
- package/dist/exports/client/index.d.ts +1 -0
- package/dist/exports/client/index.d.ts.map +1 -1
- package/dist/exports/client/index.js +7 -7
- package/dist/exports/client/index.js.map +3 -3
- package/dist/fields/Array/index.scss +74 -72
- package/dist/fields/Blocks/BlocksDrawer/BlockSearch/index.scss +25 -23
- package/dist/fields/Blocks/BlocksDrawer/index.scss +36 -34
- package/dist/fields/Blocks/SectionTitle/index.scss +51 -49
- package/dist/fields/Blocks/index.scss +89 -87
- package/dist/fields/Checkbox/index.scss +107 -105
- package/dist/fields/Code/index.scss +18 -16
- package/dist/fields/Collapsible/index.d.ts.map +1 -1
- package/dist/fields/Collapsible/index.scss +8 -6
- package/dist/fields/ConfirmPassword/index.scss +18 -16
- package/dist/fields/DateTime/index.scss +13 -11
- package/dist/fields/Email/index.scss +21 -19
- package/dist/fields/FieldDescription/index.scss +9 -7
- package/dist/fields/FieldError/index.scss +13 -11
- package/dist/fields/FieldLabel/index.scss +17 -15
- package/dist/fields/Group/index.scss +107 -105
- package/dist/fields/JSON/index.scss +11 -9
- package/dist/fields/Number/index.scss +19 -17
- package/dist/fields/Password/index.scss +18 -16
- package/dist/fields/Point/index.scss +33 -31
- package/dist/fields/RadioGroup/Radio/index.scss +58 -56
- package/dist/fields/RadioGroup/index.scss +57 -55
- package/dist/fields/Relationship/index.scss +44 -42
- package/dist/fields/Relationship/select-components/MultiValueLabel/index.scss +40 -38
- package/dist/fields/Relationship/select-components/SingleValue/index.scss +43 -41
- package/dist/fields/Row/index.scss +31 -29
- package/dist/fields/Select/index.scss +16 -14
- package/dist/fields/Tabs/Tab/index.scss +58 -56
- package/dist/fields/Tabs/index.scss +46 -44
- package/dist/fields/Text/index.scss +23 -21
- package/dist/fields/Textarea/index.scss +89 -87
- package/dist/fields/Upload/HasMany/index.scss +20 -18
- package/dist/fields/Upload/HasOne/index.scss +5 -3
- package/dist/fields/Upload/RelationshipContent/index.scss +44 -42
- package/dist/fields/Upload/UploadCard/index.scss +21 -19
- package/dist/fields/Upload/index.scss +49 -47
- package/dist/forms/Form/index.scss +5 -3
- package/dist/forms/RenderFields/index.scss +47 -45
- package/dist/forms/Submit/index.scss +5 -3
- package/dist/graphics/Account/Default/index.scss +43 -41
- package/dist/icons/Calendar/index.scss +8 -6
- package/dist/icons/Check/index.scss +9 -7
- package/dist/icons/Chevron/index.scss +18 -16
- package/dist/icons/CloseMenu/index.scss +7 -5
- package/dist/icons/Copy/index.scss +9 -7
- package/dist/icons/DragHandle/index.scss +9 -7
- package/dist/icons/Edit/index.scss +9 -7
- package/dist/icons/Line/index.scss +8 -6
- package/dist/icons/Link/index.scss +8 -6
- package/dist/icons/Lock/index.scss +6 -4
- package/dist/icons/LogOut/index.scss +8 -6
- package/dist/icons/Menu/index.scss +6 -4
- package/dist/icons/More/index.scss +8 -6
- package/dist/icons/Plus/index.scss +6 -4
- package/dist/icons/Search/index.scss +8 -6
- package/dist/icons/Swap/index.scss +9 -7
- package/dist/icons/X/index.scss +6 -4
- package/dist/providers/Auth/index.d.ts +9 -4
- package/dist/providers/Auth/index.d.ts.map +1 -1
- package/dist/providers/Auth/index.js +51 -56
- package/dist/providers/Auth/index.js.map +1 -1
- package/dist/scss/app.scss +166 -162
- package/dist/scss/colors.scss +256 -254
- package/dist/scss/resets.scss +9 -7
- package/dist/scss/toastify.scss +42 -40
- package/dist/scss/toasts.scss +105 -103
- package/dist/scss/type.scss +81 -79
- package/dist/styles.css +1 -1
- package/package.json +5 -5
|
@@ -1,145 +1,147 @@
|
|
|
1
1
|
@import '../../scss/styles.scss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
&__imageWrap {
|
|
12
|
-
min-width: 60%;
|
|
13
|
-
border-right: 1px solid var(--theme-elevation-150);
|
|
14
|
-
}
|
|
3
|
+
@layer payload-default {
|
|
4
|
+
.preview-sizes {
|
|
5
|
+
margin: base(2) calc(var(--gutter-h) * -1) 0 calc(var(--gutter-h) * -1);
|
|
6
|
+
border-top: 1px solid var(--theme-elevation-150);
|
|
7
|
+
max-height: calc(100vh - base(6));
|
|
8
|
+
height: 100%;
|
|
9
|
+
display: flex;
|
|
10
|
+
flex-direction: row;
|
|
15
11
|
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
}
|
|
12
|
+
&__imageWrap {
|
|
13
|
+
min-width: 60%;
|
|
14
|
+
border-right: 1px solid var(--theme-elevation-150);
|
|
15
|
+
}
|
|
21
16
|
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
column-gap: base(1);
|
|
17
|
+
&__preview {
|
|
18
|
+
max-height: calc(100% - base(6));
|
|
19
|
+
padding: base(1.5) base(1.5) base(1.5) var(--gutter-h);
|
|
20
|
+
object-fit: contain;
|
|
21
|
+
}
|
|
28
22
|
|
|
29
|
-
|
|
23
|
+
&__meta {
|
|
24
|
+
border-bottom: 1px solid var(--theme-elevation-150);
|
|
25
|
+
padding: base(1) var(--gutter-h);
|
|
30
26
|
display: flex;
|
|
31
27
|
flex-wrap: wrap;
|
|
32
28
|
column-gap: base(1);
|
|
33
|
-
text-wrap: wrap;
|
|
34
|
-
width: 100%;
|
|
35
|
-
}
|
|
36
29
|
|
|
37
|
-
|
|
38
|
-
|
|
30
|
+
.file-meta {
|
|
31
|
+
display: flex;
|
|
32
|
+
flex-wrap: wrap;
|
|
33
|
+
column-gap: base(1);
|
|
34
|
+
text-wrap: wrap;
|
|
35
|
+
width: 100%;
|
|
36
|
+
}
|
|
37
|
+
|
|
38
|
+
.file-meta__url {
|
|
39
|
+
width: 100%;
|
|
40
|
+
}
|
|
39
41
|
}
|
|
40
|
-
}
|
|
41
42
|
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
&__listWrap {
|
|
48
|
-
padding-right: var(--gutter-h);
|
|
49
|
-
overflow-y: scroll;
|
|
43
|
+
&__sizeName,
|
|
44
|
+
.file-meta__size-type {
|
|
45
|
+
color: var(--theme-elevation-600);
|
|
46
|
+
}
|
|
50
47
|
|
|
51
|
-
|
|
52
|
-
|
|
48
|
+
&__listWrap {
|
|
49
|
+
padding-right: var(--gutter-h);
|
|
50
|
+
overflow-y: scroll;
|
|
51
|
+
|
|
52
|
+
&::-webkit-scrollbar {
|
|
53
|
+
width: 0;
|
|
54
|
+
}
|
|
55
|
+
|
|
56
|
+
&::after {
|
|
57
|
+
content: '';
|
|
58
|
+
display: block;
|
|
59
|
+
position: sticky;
|
|
60
|
+
bottom: 0;
|
|
61
|
+
left: 0;
|
|
62
|
+
height: base(4);
|
|
63
|
+
width: 100%;
|
|
64
|
+
background: linear-gradient(180deg, transparent 0, var(--theme-bg) 100%);
|
|
65
|
+
pointer-events: none;
|
|
66
|
+
}
|
|
53
67
|
}
|
|
54
68
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
display:
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
width: 100%;
|
|
63
|
-
background: linear-gradient(180deg, transparent 0, var(--theme-bg) 100%);
|
|
64
|
-
pointer-events: none;
|
|
69
|
+
&__list {
|
|
70
|
+
list-style: none;
|
|
71
|
+
display: flex;
|
|
72
|
+
flex-direction: column;
|
|
73
|
+
gap: base(0.5);
|
|
74
|
+
margin: 0;
|
|
75
|
+
padding: base(1.5) 0 base(1.5) base(1.5);
|
|
65
76
|
}
|
|
66
|
-
}
|
|
67
77
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
padding: base(1.5) 0 base(1.5) base(1.5);
|
|
75
|
-
}
|
|
78
|
+
&__sizeOption {
|
|
79
|
+
padding: base(0.5);
|
|
80
|
+
display: flex;
|
|
81
|
+
gap: base(1);
|
|
82
|
+
cursor: pointer;
|
|
83
|
+
transition: background-color 0.2s ease-in-out;
|
|
76
84
|
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
cursor: pointer;
|
|
82
|
-
transition: background-color 0.2s ease-in-out;
|
|
85
|
+
&:hover {
|
|
86
|
+
background-color: var(--theme-elevation-100);
|
|
87
|
+
}
|
|
88
|
+
}
|
|
83
89
|
|
|
84
|
-
|
|
90
|
+
&--selected {
|
|
85
91
|
background-color: var(--theme-elevation-100);
|
|
86
92
|
}
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
&--selected {
|
|
90
|
-
background-color: var(--theme-elevation-100);
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
&__image {
|
|
94
|
-
display: flex;
|
|
95
|
-
width: 30%;
|
|
96
|
-
min-width: 30%;
|
|
97
|
-
align-items: center;
|
|
98
|
-
justify-content: center;
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
&__sizeMeta {
|
|
102
|
-
padding: base(0.5) 0;
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
&__sizeName,
|
|
106
|
-
&__sizeMeta {
|
|
107
|
-
overflow: hidden;
|
|
108
|
-
text-overflow: ellipsis;
|
|
109
|
-
}
|
|
110
|
-
|
|
111
|
-
@include mid-break {
|
|
112
|
-
margin-top: base(1);
|
|
113
|
-
max-height: calc(100vh - base(4));
|
|
114
|
-
}
|
|
115
93
|
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
&__imageWrap {
|
|
123
|
-
height: 60%;
|
|
124
|
-
border: none;
|
|
94
|
+
&__image {
|
|
95
|
+
display: flex;
|
|
96
|
+
width: 30%;
|
|
97
|
+
min-width: 30%;
|
|
98
|
+
align-items: center;
|
|
99
|
+
justify-content: center;
|
|
125
100
|
}
|
|
126
101
|
|
|
127
|
-
&
|
|
128
|
-
|
|
129
|
-
padding: calc(var(--gutter-h) * 2) var(--gutter-h);
|
|
102
|
+
&__sizeMeta {
|
|
103
|
+
padding: base(0.5) 0;
|
|
130
104
|
}
|
|
131
105
|
|
|
132
|
-
&
|
|
133
|
-
|
|
106
|
+
&__sizeName,
|
|
107
|
+
&__sizeMeta {
|
|
108
|
+
overflow: hidden;
|
|
109
|
+
text-overflow: ellipsis;
|
|
134
110
|
}
|
|
135
111
|
|
|
136
|
-
|
|
137
|
-
|
|
112
|
+
@include mid-break {
|
|
113
|
+
margin-top: base(1);
|
|
114
|
+
max-height: calc(100vh - base(4));
|
|
138
115
|
}
|
|
139
116
|
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
height:
|
|
117
|
+
@include small-break {
|
|
118
|
+
margin-top: 0;
|
|
119
|
+
max-height: calc(100vh - base(3.5));
|
|
120
|
+
flex-direction: column;
|
|
121
|
+
justify-content: space-between;
|
|
122
|
+
|
|
123
|
+
&__imageWrap {
|
|
124
|
+
height: 60%;
|
|
125
|
+
border: none;
|
|
126
|
+
}
|
|
127
|
+
|
|
128
|
+
&__list,
|
|
129
|
+
&__preview {
|
|
130
|
+
padding: calc(var(--gutter-h) * 2) var(--gutter-h);
|
|
131
|
+
}
|
|
132
|
+
|
|
133
|
+
&__preview {
|
|
134
|
+
max-height: calc(100% - base(4));
|
|
135
|
+
}
|
|
136
|
+
|
|
137
|
+
&__sizeOption {
|
|
138
|
+
padding: base(0.25);
|
|
139
|
+
}
|
|
140
|
+
|
|
141
|
+
&__listWrap {
|
|
142
|
+
border-top: 1px solid var(--theme-elevation-150);
|
|
143
|
+
height: 40%;
|
|
144
|
+
}
|
|
143
145
|
}
|
|
144
146
|
}
|
|
145
147
|
}
|
|
@@ -1,37 +1,39 @@
|
|
|
1
1
|
@import '../../scss/styles.scss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
align-items: center;
|
|
7
|
-
justify-content: center;
|
|
8
|
-
height: 100%;
|
|
9
|
-
|
|
10
|
-
&__wrapper {
|
|
11
|
-
z-index: 1;
|
|
12
|
-
position: relative;
|
|
3
|
+
@layer payload-default {
|
|
4
|
+
.publish-many {
|
|
5
|
+
@include blur-bg;
|
|
13
6
|
display: flex;
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
}
|
|
7
|
+
align-items: center;
|
|
8
|
+
justify-content: center;
|
|
9
|
+
height: 100%;
|
|
18
10
|
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
11
|
+
&__wrapper {
|
|
12
|
+
z-index: 1;
|
|
13
|
+
position: relative;
|
|
14
|
+
display: flex;
|
|
15
|
+
flex-direction: column;
|
|
16
|
+
gap: base(0.8);
|
|
17
|
+
padding: base(2);
|
|
18
|
+
}
|
|
23
19
|
|
|
24
|
-
|
|
25
|
-
|
|
20
|
+
&__content {
|
|
21
|
+
display: flex;
|
|
22
|
+
flex-direction: column;
|
|
23
|
+
gap: base(0.4);
|
|
24
|
+
|
|
25
|
+
> * {
|
|
26
|
+
margin: 0;
|
|
27
|
+
}
|
|
26
28
|
}
|
|
27
|
-
}
|
|
28
29
|
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
30
|
+
&__controls {
|
|
31
|
+
display: flex;
|
|
32
|
+
gap: base(0.4);
|
|
32
33
|
|
|
33
|
-
|
|
34
|
-
|
|
34
|
+
.btn {
|
|
35
|
+
margin: 0;
|
|
36
|
+
}
|
|
35
37
|
}
|
|
36
38
|
}
|
|
37
39
|
}
|
|
@@ -1,9 +1,11 @@
|
|
|
1
1
|
@import '../../../scss/styles.scss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
3
|
+
@layer payload-default {
|
|
4
|
+
.clear-indicator {
|
|
5
|
+
cursor: pointer;
|
|
5
6
|
|
|
6
|
-
|
|
7
|
-
|
|
7
|
+
&:focus-visible {
|
|
8
|
+
outline: var(--accessibility-outline);
|
|
9
|
+
}
|
|
8
10
|
}
|
|
9
11
|
}
|
|
@@ -1,16 +1,18 @@
|
|
|
1
1
|
@import '../../../scss/styles.scss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
@layer payload-default {
|
|
4
|
+
.dropdown-indicator {
|
|
5
|
+
cursor: pointer;
|
|
6
|
+
@include btn-reset;
|
|
6
7
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
&:focus-visible {
|
|
9
|
+
outline: var(--accessibility-outline);
|
|
10
|
+
}
|
|
10
11
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
12
|
+
&__icon {
|
|
13
|
+
.stroke {
|
|
14
|
+
stroke-width: 1px;
|
|
15
|
+
}
|
|
14
16
|
}
|
|
15
17
|
}
|
|
16
18
|
}
|
|
@@ -1,37 +1,39 @@
|
|
|
1
1
|
@import '../../../scss/styles.scss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
3
|
+
@layer payload-default {
|
|
4
|
+
.multi-value {
|
|
5
|
+
&.rs__multi-value {
|
|
6
|
+
display: flex;
|
|
7
|
+
padding: 0;
|
|
8
|
+
border: 1px solid var(--theme-border-color);
|
|
9
|
+
border-radius: var(--style-radius-s);
|
|
10
|
+
line-height: calc(#{$baseline} - 2px);
|
|
11
|
+
margin: base(0.25) base(0.5) base(0.25) 0;
|
|
12
|
+
transition: border 0.2s cubic-bezier(0.2, 0, 0, 1);
|
|
12
13
|
|
|
13
|
-
|
|
14
|
-
|
|
14
|
+
&:hover {
|
|
15
|
+
border: 1px solid var(--theme-elevation-250);
|
|
16
|
+
}
|
|
15
17
|
}
|
|
16
|
-
}
|
|
17
18
|
|
|
18
|
-
|
|
19
|
-
|
|
19
|
+
&--is-dragging {
|
|
20
|
+
z-index: 2;
|
|
21
|
+
}
|
|
20
22
|
}
|
|
21
|
-
}
|
|
22
23
|
|
|
23
|
-
html[data-theme='light'] {
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
24
|
+
html[data-theme='light'] {
|
|
25
|
+
.multi-value {
|
|
26
|
+
&.rs__multi-value {
|
|
27
|
+
background: var(--theme-elevation-50);
|
|
28
|
+
}
|
|
27
29
|
}
|
|
28
30
|
}
|
|
29
|
-
}
|
|
30
31
|
|
|
31
|
-
html[data-theme='dark'] {
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
32
|
+
html[data-theme='dark'] {
|
|
33
|
+
.multi-value {
|
|
34
|
+
&.rs__multi-value {
|
|
35
|
+
background: var(--theme-elevation-50);
|
|
36
|
+
}
|
|
35
37
|
}
|
|
36
38
|
}
|
|
37
39
|
}
|
|
@@ -1,20 +1,22 @@
|
|
|
1
1
|
@import '../../../scss/styles.scss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
3
|
+
@layer payload-default {
|
|
4
|
+
.multi-value-label {
|
|
5
|
+
@extend %small;
|
|
6
|
+
display: flex;
|
|
7
|
+
align-items: center;
|
|
8
|
+
max-width: 150px;
|
|
9
|
+
color: currentColor;
|
|
10
|
+
padding: 0 base(0.4);
|
|
10
11
|
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
12
|
+
&__text {
|
|
13
|
+
text-overflow: ellipsis;
|
|
14
|
+
overflow: hidden;
|
|
15
|
+
white-space: nowrap;
|
|
16
|
+
}
|
|
16
17
|
|
|
17
|
-
|
|
18
|
-
|
|
18
|
+
&:focus-visible {
|
|
19
|
+
outline: var(--accessibility-outline);
|
|
20
|
+
}
|
|
19
21
|
}
|
|
20
22
|
}
|
|
@@ -1,24 +1,26 @@
|
|
|
1
1
|
@import '../../../scss/styles.scss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
3
|
+
@layer payload-default {
|
|
4
|
+
.multi-value-remove {
|
|
5
|
+
cursor: pointer;
|
|
6
|
+
width: base(1);
|
|
7
|
+
display: flex;
|
|
8
|
+
align-items: center;
|
|
9
|
+
justify-content: center;
|
|
10
|
+
position: relative;
|
|
11
|
+
background-color: transparent;
|
|
12
|
+
border: none;
|
|
13
|
+
padding: 0;
|
|
14
|
+
color: inherit;
|
|
14
15
|
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
16
|
+
&:hover {
|
|
17
|
+
color: var(--theme-elevation-800);
|
|
18
|
+
background: var(--theme-elevation-150);
|
|
19
|
+
}
|
|
19
20
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
21
|
+
&__icon {
|
|
22
|
+
width: 100%;
|
|
23
|
+
height: 100%;
|
|
24
|
+
}
|
|
23
25
|
}
|
|
24
26
|
}
|
|
@@ -1,31 +1,33 @@
|
|
|
1
1
|
@import '../../../scss/styles.scss';
|
|
2
2
|
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
3
|
+
@layer payload-default {
|
|
4
|
+
.value-container {
|
|
5
|
+
flex-grow: 1;
|
|
6
|
+
min-width: 0;
|
|
6
7
|
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
8
|
+
.rs__value-container {
|
|
9
|
+
overflow: visible;
|
|
10
|
+
padding: 2px;
|
|
11
|
+
gap: 2px;
|
|
11
12
|
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
padding-bottom: 0;
|
|
16
|
-
color: currentColor;
|
|
17
|
-
|
|
18
|
-
.field-label {
|
|
13
|
+
> * {
|
|
14
|
+
margin: 0;
|
|
15
|
+
padding-top: 0;
|
|
19
16
|
padding-bottom: 0;
|
|
17
|
+
color: currentColor;
|
|
18
|
+
|
|
19
|
+
.field-label {
|
|
20
|
+
padding-bottom: 0;
|
|
21
|
+
}
|
|
20
22
|
}
|
|
21
|
-
}
|
|
22
23
|
|
|
23
|
-
|
|
24
|
-
|
|
24
|
+
&--is-multi {
|
|
25
|
+
width: calc(100% + base(0.25));
|
|
25
26
|
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
27
|
+
&.rs__value-container--has-value {
|
|
28
|
+
padding: 0;
|
|
29
|
+
margin-inline-start: -4px;
|
|
30
|
+
}
|
|
29
31
|
}
|
|
30
32
|
}
|
|
31
33
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ReactSelect/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA2B,MAAM,OAAO,CAAA;AAI/C,OAAO,KAAK,EAAU,uBAAuB,EAAE,MAAM,YAAY,CAAA;AACjE,YAAY,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAQxC,OAAO,cAAc,CAAA;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/elements/ReactSelect/index.tsx"],"names":[],"mappings":"AAKA,OAAO,KAA2B,MAAM,OAAO,CAAA;AAI/C,OAAO,KAAK,EAAU,uBAAuB,EAAE,MAAM,YAAY,CAAA;AACjE,YAAY,EAAE,MAAM,EAAE,MAAM,YAAY,CAAA;AAQxC,OAAO,cAAc,CAAA;AAuMrB,eAAO,MAAM,WAAW,EAAE,KAAK,CAAC,EAAE,CAAC,uBAAuB,CAQzD,CAAA"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":["arrayMove","getTranslation","React","useEffect","useId","Select","CreatableSelect","useTranslation","DraggableSortable","ShimmerEffect","ClearIndicator","Control","DropdownIndicator","Input","generateMultiValueDraggableID","MultiValue","MultiValueLabel","MultiValueRemove","SingleValue","ValueContainer","createOption","label","value","SelectAdapter","props","i18n","t","inputValue","setInputValue","useState","uuid","hasMounted","setHasMounted","className","components","customProps","disabled","filterOption","undefined","getOptionValue","isClearable","isCreatable","isLoading","isSearchable","noOptionsMessage","numberOnly","onChange","onMenuClose","onMenuOpen","options","placeholder","showError","loadingMessage","classes","filter","Boolean","join","_jsx","height","captureMenuScroll","classNamePrefix","instanceId","isDisabled","menuPlacement","handleKeyDown","event","acceptableKeys","isNumber","test","key","isActionKey","includes","preventDefault","trim","onInputChange","newValue","onKeyDown","SortableSelect","draggableIDs","Array","isArray","map","optionValue","ids","onDragEnd","moveFromIndex","moveToIndex","sorted","ReactSelect","isMulti","isSortable"],"sources":["../../../src/elements/ReactSelect/index.tsx"],"sourcesContent":["'use client'\nimport type { KeyboardEventHandler } from 'react'\n\nimport { arrayMove } from '@dnd-kit/sortable'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useEffect, useId } from 'react'\nimport Select from 'react-select'\nimport CreatableSelect from 'react-select/creatable'\n\nimport type { Option, ReactSelectAdapterProps } from './types.js'\nexport type { Option } from './types.js'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport { ClearIndicator } from './ClearIndicator/index.js'\nimport { Control } from './Control/index.js'\nimport { DropdownIndicator } from './DropdownIndicator/index.js'\nimport './index.scss'\nimport { Input } from './Input/index.js'\nimport { generateMultiValueDraggableID, MultiValue } from './MultiValue/index.js'\nimport { MultiValueLabel } from './MultiValueLabel/index.js'\nimport { MultiValueRemove } from './MultiValueRemove/index.js'\nimport { SingleValue } from './SingleValue/index.js'\nimport { ValueContainer } from './ValueContainer/index.js'\n\nconst createOption = (label: string) => ({\n label,\n value: label,\n})\n\nconst SelectAdapter: React.FC<ReactSelectAdapterProps> = (props) => {\n const { i18n, t } = useTranslation()\n const [inputValue, setInputValue] = React.useState('') // for creatable select\n const uuid = useId()\n const [hasMounted, setHasMounted] = React.useState(false)\n\n useEffect(() => {\n setHasMounted(true)\n }, [])\n\n const {\n className,\n components,\n customProps,\n disabled = false,\n filterOption = undefined,\n getOptionValue,\n isClearable = true,\n isCreatable,\n isLoading,\n isSearchable = true,\n noOptionsMessage = () => t('general:noOptions'),\n numberOnly = false,\n onChange,\n onMenuClose,\n onMenuOpen,\n options,\n placeholder = t('general:selectValue'),\n showError,\n value,\n } = props\n\n const loadingMessage = () => t('general:loading') + '...'\n\n const classes = [className, 'react-select', showError && 'react-select--error']\n .filter(Boolean)\n .join(' ')\n\n if (!hasMounted) {\n return <ShimmerEffect height=\"calc(var(--base) * 2 + 2px)\" />\n }\n\n if (!isCreatable) {\n return (\n <Select\n captureMenuScroll\n customProps={customProps}\n isLoading={isLoading}\n placeholder={getTranslation(placeholder, i18n)}\n {...props}\n className={classes}\n classNamePrefix=\"rs\"\n components={{\n ClearIndicator,\n Control,\n DropdownIndicator,\n Input,\n MultiValue,\n MultiValueLabel,\n MultiValueRemove,\n SingleValue,\n ValueContainer,\n ...components,\n }}\n filterOption={filterOption}\n getOptionValue={getOptionValue}\n instanceId={uuid}\n isClearable={isClearable}\n isDisabled={disabled}\n isSearchable={isSearchable}\n loadingMessage={loadingMessage}\n menuPlacement=\"auto\"\n noOptionsMessage={noOptionsMessage}\n onChange={onChange}\n onMenuClose={onMenuClose}\n onMenuOpen={onMenuOpen}\n options={options}\n value={value}\n />\n )\n }\n const handleKeyDown: KeyboardEventHandler = (event) => {\n if (numberOnly === true) {\n const acceptableKeys = [\n 'Tab',\n 'Escape',\n 'Backspace',\n 'Enter',\n 'ArrowRight',\n 'ArrowLeft',\n 'ArrowUp',\n 'ArrowDown',\n ]\n const isNumber = !/\\D/.test(event.key)\n const isActionKey = acceptableKeys.includes(event.key)\n if (!isNumber && !isActionKey) {\n event.preventDefault()\n return\n }\n }\n if (!value || !inputValue || inputValue.trim() === '') {\n return\n }\n if (filterOption && !filterOption(null, inputValue)) {\n return\n }\n switch (event.key) {\n case 'Enter':\n case 'Tab':\n onChange([...(value as Option[]), createOption(inputValue)])\n setInputValue('')\n event.preventDefault()\n break\n default:\n break\n }\n }\n\n return (\n <CreatableSelect\n captureMenuScroll\n isLoading={isLoading}\n placeholder={getTranslation(placeholder, i18n)}\n {...props}\n className={classes}\n classNamePrefix=\"rs\"\n components={{\n ClearIndicator,\n Control,\n DropdownIndicator,\n Input,\n MultiValue,\n MultiValueLabel,\n MultiValueRemove,\n SingleValue,\n ValueContainer,\n ...components,\n }}\n filterOption={filterOption}\n inputValue={inputValue}\n instanceId={uuid}\n isClearable={isClearable}\n isDisabled={disabled}\n isSearchable={isSearchable}\n loadingMessage={loadingMessage}\n menuPlacement=\"auto\"\n noOptionsMessage={noOptionsMessage}\n onChange={onChange}\n onInputChange={(newValue) => setInputValue(newValue)}\n onKeyDown={handleKeyDown}\n onMenuClose={onMenuClose}\n onMenuOpen={onMenuOpen}\n options={options}\n value={value}\n />\n )\n}\n\nconst SortableSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n const { getOptionValue, onChange, value } = props\n\n let draggableIDs: string[] = []\n if (value) {\n draggableIDs = (Array.isArray(value) ? value : [value]).map((optionValue) => {\n return generateMultiValueDraggableID(optionValue, getOptionValue)\n })\n }\n\n return (\n <DraggableSortable\n className=\"react-select-container\"\n ids={draggableIDs}\n onDragEnd={({ moveFromIndex, moveToIndex }) => {\n let sorted = value\n if (value && Array.isArray(value)) {\n sorted = arrayMove(value, moveFromIndex, moveToIndex)\n }\n onChange(sorted)\n }}\n >\n <SelectAdapter {...props} />\n </DraggableSortable>\n )\n}\n\nexport const ReactSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n const { isMulti, isSortable } = props\n\n if (isMulti && isSortable) {\n return <SortableSelect {...props} />\n }\n\n return <SelectAdapter {...props} />\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"index.js","names":["arrayMove","getTranslation","React","useEffect","useId","Select","CreatableSelect","useTranslation","DraggableSortable","ShimmerEffect","ClearIndicator","Control","DropdownIndicator","Input","generateMultiValueDraggableID","MultiValue","MultiValueLabel","MultiValueRemove","SingleValue","ValueContainer","createOption","label","value","SelectAdapter","props","i18n","t","inputValue","setInputValue","useState","uuid","hasMounted","setHasMounted","className","components","customProps","disabled","filterOption","undefined","getOptionValue","isClearable","isCreatable","isLoading","isSearchable","noOptionsMessage","numberOnly","onChange","onMenuClose","onMenuOpen","options","placeholder","showError","loadingMessage","classes","filter","Boolean","join","_jsx","height","captureMenuScroll","classNamePrefix","instanceId","isDisabled","menuPlacement","unstyled","handleKeyDown","event","acceptableKeys","isNumber","test","key","isActionKey","includes","preventDefault","trim","onInputChange","newValue","onKeyDown","SortableSelect","draggableIDs","Array","isArray","map","optionValue","ids","onDragEnd","moveFromIndex","moveToIndex","sorted","ReactSelect","isMulti","isSortable"],"sources":["../../../src/elements/ReactSelect/index.tsx"],"sourcesContent":["'use client'\nimport type { KeyboardEventHandler } from 'react'\n\nimport { arrayMove } from '@dnd-kit/sortable'\nimport { getTranslation } from '@payloadcms/translations'\nimport React, { useEffect, useId } from 'react'\nimport Select from 'react-select'\nimport CreatableSelect from 'react-select/creatable'\n\nimport type { Option, ReactSelectAdapterProps } from './types.js'\nexport type { Option } from './types.js'\n\nimport { useTranslation } from '../../providers/Translation/index.js'\nimport { DraggableSortable } from '../DraggableSortable/index.js'\nimport { ShimmerEffect } from '../ShimmerEffect/index.js'\nimport { ClearIndicator } from './ClearIndicator/index.js'\nimport { Control } from './Control/index.js'\nimport { DropdownIndicator } from './DropdownIndicator/index.js'\nimport './index.scss'\nimport { Input } from './Input/index.js'\nimport { generateMultiValueDraggableID, MultiValue } from './MultiValue/index.js'\nimport { MultiValueLabel } from './MultiValueLabel/index.js'\nimport { MultiValueRemove } from './MultiValueRemove/index.js'\nimport { SingleValue } from './SingleValue/index.js'\nimport { ValueContainer } from './ValueContainer/index.js'\n\nconst createOption = (label: string) => ({\n label,\n value: label,\n})\n\nconst SelectAdapter: React.FC<ReactSelectAdapterProps> = (props) => {\n const { i18n, t } = useTranslation()\n const [inputValue, setInputValue] = React.useState('') // for creatable select\n const uuid = useId()\n const [hasMounted, setHasMounted] = React.useState(false)\n\n useEffect(() => {\n setHasMounted(true)\n }, [])\n\n const {\n className,\n components,\n customProps,\n disabled = false,\n filterOption = undefined,\n getOptionValue,\n isClearable = true,\n isCreatable,\n isLoading,\n isSearchable = true,\n noOptionsMessage = () => t('general:noOptions'),\n numberOnly = false,\n onChange,\n onMenuClose,\n onMenuOpen,\n options,\n placeholder = t('general:selectValue'),\n showError,\n value,\n } = props\n\n const loadingMessage = () => t('general:loading') + '...'\n\n const classes = [className, 'react-select', showError && 'react-select--error']\n .filter(Boolean)\n .join(' ')\n\n if (!hasMounted) {\n return <ShimmerEffect height=\"calc(var(--base) * 2 + 2px)\" />\n }\n\n if (!isCreatable) {\n return (\n <Select\n captureMenuScroll\n customProps={customProps}\n isLoading={isLoading}\n placeholder={getTranslation(placeholder, i18n)}\n {...props}\n className={classes}\n classNamePrefix=\"rs\"\n components={{\n ClearIndicator,\n Control,\n DropdownIndicator,\n Input,\n MultiValue,\n MultiValueLabel,\n MultiValueRemove,\n SingleValue,\n ValueContainer,\n ...components,\n }}\n filterOption={filterOption}\n getOptionValue={getOptionValue}\n instanceId={uuid}\n isClearable={isClearable}\n isDisabled={disabled}\n isSearchable={isSearchable}\n loadingMessage={loadingMessage}\n menuPlacement=\"auto\"\n noOptionsMessage={noOptionsMessage}\n onChange={onChange}\n onMenuClose={onMenuClose}\n onMenuOpen={onMenuOpen}\n options={options}\n unstyled={true}\n value={value}\n />\n )\n }\n const handleKeyDown: KeyboardEventHandler = (event) => {\n if (numberOnly === true) {\n const acceptableKeys = [\n 'Tab',\n 'Escape',\n 'Backspace',\n 'Enter',\n 'ArrowRight',\n 'ArrowLeft',\n 'ArrowUp',\n 'ArrowDown',\n ]\n const isNumber = !/\\D/.test(event.key)\n const isActionKey = acceptableKeys.includes(event.key)\n if (!isNumber && !isActionKey) {\n event.preventDefault()\n return\n }\n }\n if (!value || !inputValue || inputValue.trim() === '') {\n return\n }\n if (filterOption && !filterOption(null, inputValue)) {\n return\n }\n switch (event.key) {\n case 'Enter':\n case 'Tab':\n onChange([...(value as Option[]), createOption(inputValue)])\n setInputValue('')\n event.preventDefault()\n break\n default:\n break\n }\n }\n\n return (\n <CreatableSelect\n captureMenuScroll\n isLoading={isLoading}\n placeholder={getTranslation(placeholder, i18n)}\n {...props}\n className={classes}\n classNamePrefix=\"rs\"\n components={{\n ClearIndicator,\n Control,\n DropdownIndicator,\n Input,\n MultiValue,\n MultiValueLabel,\n MultiValueRemove,\n SingleValue,\n ValueContainer,\n ...components,\n }}\n filterOption={filterOption}\n inputValue={inputValue}\n instanceId={uuid}\n isClearable={isClearable}\n isDisabled={disabled}\n isSearchable={isSearchable}\n loadingMessage={loadingMessage}\n menuPlacement=\"auto\"\n noOptionsMessage={noOptionsMessage}\n onChange={onChange}\n onInputChange={(newValue) => setInputValue(newValue)}\n onKeyDown={handleKeyDown}\n onMenuClose={onMenuClose}\n onMenuOpen={onMenuOpen}\n options={options}\n value={value}\n />\n )\n}\n\nconst SortableSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n const { getOptionValue, onChange, value } = props\n\n let draggableIDs: string[] = []\n if (value) {\n draggableIDs = (Array.isArray(value) ? value : [value]).map((optionValue) => {\n return generateMultiValueDraggableID(optionValue, getOptionValue)\n })\n }\n\n return (\n <DraggableSortable\n className=\"react-select-container\"\n ids={draggableIDs}\n onDragEnd={({ moveFromIndex, moveToIndex }) => {\n let sorted = value\n if (value && Array.isArray(value)) {\n sorted = arrayMove(value, moveFromIndex, moveToIndex)\n }\n onChange(sorted)\n }}\n >\n <SelectAdapter {...props} />\n </DraggableSortable>\n )\n}\n\nexport const ReactSelect: React.FC<ReactSelectAdapterProps> = (props) => {\n const { isMulti, isSortable } = props\n\n if (isMulti && isSortable) {\n return <SortableSelect {...props} />\n }\n\n return <SelectAdapter {...props} />\n}\n"],"mappings":"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","ignoreList":[]}
|