@storybook/core-common 6.4.2 → 6.4.3
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/cjs/templates/base-preview-body.html +0 -193
- package/dist/cjs/templates/base-preview-head.html +197 -2
- package/dist/esm/templates/base-preview-body.html +0 -193
- package/dist/esm/templates/base-preview-head.html +197 -2
- package/dist/modern/templates/base-preview-body.html +0 -193
- package/dist/modern/templates/base-preview-head.html +197 -2
- package/package.json +3 -3
|
@@ -1,196 +1,3 @@
|
|
|
1
|
-
<style>
|
|
2
|
-
@-webkit-keyframes sb-rotate360 {
|
|
3
|
-
from {
|
|
4
|
-
transform: rotate(0deg);
|
|
5
|
-
}
|
|
6
|
-
to {
|
|
7
|
-
transform: rotate(360deg);
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
@keyframes sb-rotate360 {
|
|
11
|
-
from {
|
|
12
|
-
transform: rotate(0deg);
|
|
13
|
-
}
|
|
14
|
-
to {
|
|
15
|
-
transform: rotate(360deg);
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
@-webkit-keyframes sb-glow {
|
|
19
|
-
0%,
|
|
20
|
-
100% {
|
|
21
|
-
opacity: 1;
|
|
22
|
-
}
|
|
23
|
-
50% {
|
|
24
|
-
opacity: 0.4;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
@keyframes sb-glow {
|
|
28
|
-
0%,
|
|
29
|
-
100% {
|
|
30
|
-
opacity: 1;
|
|
31
|
-
}
|
|
32
|
-
50% {
|
|
33
|
-
opacity: 0.4;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.sb-loader {
|
|
38
|
-
-webkit-animation: sb-rotate360 0.7s linear infinite;
|
|
39
|
-
animation: sb-rotate360 0.7s linear infinite;
|
|
40
|
-
border-color: rgba(97, 97, 97, 0.29);
|
|
41
|
-
border-radius: 50%;
|
|
42
|
-
border-style: solid;
|
|
43
|
-
border-top-color: #646464;
|
|
44
|
-
border-width: 2px;
|
|
45
|
-
display: inline-block;
|
|
46
|
-
height: 32px;
|
|
47
|
-
left: 50%;
|
|
48
|
-
margin-left: -16px;
|
|
49
|
-
margin-top: -16px;
|
|
50
|
-
mix-blend-mode: difference;
|
|
51
|
-
overflow: hidden;
|
|
52
|
-
position: absolute;
|
|
53
|
-
top: 50%;
|
|
54
|
-
transition: all 200ms ease-out;
|
|
55
|
-
vertical-align: top;
|
|
56
|
-
width: 32px;
|
|
57
|
-
z-index: 4;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
.sb-previewBlock {
|
|
61
|
-
background: #fff;
|
|
62
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
63
|
-
border-radius: 4px;
|
|
64
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 0;
|
|
65
|
-
margin: 25px auto 40px;
|
|
66
|
-
max-width: 600px;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
.sb-previewBlock_header {
|
|
70
|
-
align-items: center;
|
|
71
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 -1px 0 0 inset;
|
|
72
|
-
display: flex;
|
|
73
|
-
gap: 14px;
|
|
74
|
-
height: 40px;
|
|
75
|
-
padding: 0 12px;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
.sb-previewBlock_icon {
|
|
79
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
80
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
81
|
-
background: #e6e6e6;
|
|
82
|
-
height: 14px;
|
|
83
|
-
width: 14px;
|
|
84
|
-
}
|
|
85
|
-
.sb-previewBlock_icon:last-child {
|
|
86
|
-
margin-left: auto;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
.sb-previewBlock_body {
|
|
90
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
91
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
92
|
-
height: 182px;
|
|
93
|
-
position: relative;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
.sb-argstableBlock {
|
|
97
|
-
border-collapse: collapse;
|
|
98
|
-
border-spacing: 0;
|
|
99
|
-
font-size: 13px;
|
|
100
|
-
line-height: 20px;
|
|
101
|
-
margin: 25px auto 40px;
|
|
102
|
-
max-width: 600px;
|
|
103
|
-
text-align: left;
|
|
104
|
-
width: 100%;
|
|
105
|
-
}
|
|
106
|
-
.sb-argstableBlock th:first-of-type,
|
|
107
|
-
.sb-argstableBlock td:first-of-type {
|
|
108
|
-
padding-left: 20px;
|
|
109
|
-
}
|
|
110
|
-
.sb-argstableBlock th:nth-of-type(2),
|
|
111
|
-
.sb-argstableBlock td:nth-of-type(2) {
|
|
112
|
-
width: 35%;
|
|
113
|
-
}
|
|
114
|
-
.sb-argstableBlock th:nth-of-type(3),
|
|
115
|
-
.sb-argstableBlock td:nth-of-type(3) {
|
|
116
|
-
width: 15%;
|
|
117
|
-
}
|
|
118
|
-
.sb-argstableBlock th:laste-of-type,
|
|
119
|
-
.sb-argstableBlock td:laste-of-type {
|
|
120
|
-
width: 25%;
|
|
121
|
-
padding-right: 20px;
|
|
122
|
-
}
|
|
123
|
-
.sb-argstableBlock th span,
|
|
124
|
-
.sb-argstableBlock td span {
|
|
125
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
126
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
127
|
-
background-color: rgba(0, 0, 0, 0.1);
|
|
128
|
-
border-radius: 0;
|
|
129
|
-
box-shadow: none;
|
|
130
|
-
color: transparent;
|
|
131
|
-
}
|
|
132
|
-
.sb-argstableBlock th {
|
|
133
|
-
padding: 10px 15px;
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
.sb-argstableBlock-body {
|
|
137
|
-
border-radius: 4px;
|
|
138
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 1px, rgba(0, 0, 0, 0.065) 0 0 0 1px;
|
|
139
|
-
}
|
|
140
|
-
.sb-argstableBlock-body tr {
|
|
141
|
-
background: transparent;
|
|
142
|
-
overflow: hidden;
|
|
143
|
-
}
|
|
144
|
-
.sb-argstableBlock-body tr:not(:first-child) {
|
|
145
|
-
border-top: 1px solid #e6e6e6;
|
|
146
|
-
}
|
|
147
|
-
.sb-argstableBlock-body tr:first-child td:first-child {
|
|
148
|
-
border-top-left-radius: 4px;
|
|
149
|
-
}
|
|
150
|
-
.sb-argstableBlock-body tr:first-child td:last-child {
|
|
151
|
-
border-top-right-radius: 4px;
|
|
152
|
-
}
|
|
153
|
-
.sb-argstableBlock-body tr:last-child td:first-child {
|
|
154
|
-
border-bottom-left-radius: 4px;
|
|
155
|
-
}
|
|
156
|
-
.sb-argstableBlock-body tr:last-child td:last-child {
|
|
157
|
-
border-bottom-right-radius: 4px;
|
|
158
|
-
}
|
|
159
|
-
.sb-argstableBlock-body td {
|
|
160
|
-
background: #fff;
|
|
161
|
-
padding-bottom: 10px;
|
|
162
|
-
padding-top: 10px;
|
|
163
|
-
vertical-align: top;
|
|
164
|
-
}
|
|
165
|
-
.sb-argstableBlock-body td:not(:first-of-type) {
|
|
166
|
-
padding-left: 15px;
|
|
167
|
-
padding-right: 15px;
|
|
168
|
-
}
|
|
169
|
-
.sb-argstableBlock-body button {
|
|
170
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
171
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
172
|
-
background-color: rgba(0, 0, 0, 0.1);
|
|
173
|
-
border: 0;
|
|
174
|
-
border-radius: 0;
|
|
175
|
-
box-shadow: none;
|
|
176
|
-
color: transparent;
|
|
177
|
-
display: inline;
|
|
178
|
-
font-size: 12px;
|
|
179
|
-
line-height: 1;
|
|
180
|
-
padding: 10px 16px;
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
.sb-argstableBlock-summary {
|
|
184
|
-
margin-top: 4px;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
.sb-argstableBlock-code {
|
|
188
|
-
margin-right: 4px;
|
|
189
|
-
margin-bottom: 4px;
|
|
190
|
-
padding: 2px 5px;
|
|
191
|
-
}
|
|
192
|
-
</style>
|
|
193
|
-
|
|
194
1
|
<div class="sb-preparing-story sb-wrapper">
|
|
195
2
|
<div class="sb-loader"></div>
|
|
196
3
|
</div>
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
<base target="_parent" />
|
|
2
2
|
|
|
3
3
|
<style>
|
|
4
|
-
:not(.sb-show-main) > #root,
|
|
5
|
-
:not(.sb-show-main) > #docs-root,
|
|
6
4
|
:not(.sb-show-preparing-story) > .sb-preparing-story,
|
|
7
5
|
:not(.sb-show-preparing-docs) > .sb-preparing-docs,
|
|
8
6
|
:not(.sb-show-nopreview) > .sb-nopreview,
|
|
@@ -102,6 +100,203 @@
|
|
|
102
100
|
.sb-errordisplay pre {
|
|
103
101
|
white-space: pre-wrap;
|
|
104
102
|
}
|
|
103
|
+
|
|
104
|
+
@-webkit-keyframes sb-rotate360 {
|
|
105
|
+
from {
|
|
106
|
+
transform: rotate(0deg);
|
|
107
|
+
}
|
|
108
|
+
to {
|
|
109
|
+
transform: rotate(360deg);
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
@keyframes sb-rotate360 {
|
|
113
|
+
from {
|
|
114
|
+
transform: rotate(0deg);
|
|
115
|
+
}
|
|
116
|
+
to {
|
|
117
|
+
transform: rotate(360deg);
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
@-webkit-keyframes sb-glow {
|
|
121
|
+
0%,
|
|
122
|
+
100% {
|
|
123
|
+
opacity: 1;
|
|
124
|
+
}
|
|
125
|
+
50% {
|
|
126
|
+
opacity: 0.4;
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
@keyframes sb-glow {
|
|
130
|
+
0%,
|
|
131
|
+
100% {
|
|
132
|
+
opacity: 1;
|
|
133
|
+
}
|
|
134
|
+
50% {
|
|
135
|
+
opacity: 0.4;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/* We display the preparing loaders *over* the rendering story */
|
|
140
|
+
.sb-preparing-story,
|
|
141
|
+
.sb-preparing-docs {
|
|
142
|
+
background-color: white;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.sb-loader {
|
|
146
|
+
-webkit-animation: sb-rotate360 0.7s linear infinite;
|
|
147
|
+
animation: sb-rotate360 0.7s linear infinite;
|
|
148
|
+
border-color: rgba(97, 97, 97, 0.29);
|
|
149
|
+
border-radius: 50%;
|
|
150
|
+
border-style: solid;
|
|
151
|
+
border-top-color: #646464;
|
|
152
|
+
border-width: 2px;
|
|
153
|
+
display: inline-block;
|
|
154
|
+
height: 32px;
|
|
155
|
+
left: 50%;
|
|
156
|
+
margin-left: -16px;
|
|
157
|
+
margin-top: -16px;
|
|
158
|
+
mix-blend-mode: difference;
|
|
159
|
+
overflow: hidden;
|
|
160
|
+
position: absolute;
|
|
161
|
+
top: 50%;
|
|
162
|
+
transition: all 200ms ease-out;
|
|
163
|
+
vertical-align: top;
|
|
164
|
+
width: 32px;
|
|
165
|
+
z-index: 4;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.sb-previewBlock {
|
|
169
|
+
background: #fff;
|
|
170
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
171
|
+
border-radius: 4px;
|
|
172
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 0;
|
|
173
|
+
margin: 25px auto 40px;
|
|
174
|
+
max-width: 600px;
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
.sb-previewBlock_header {
|
|
178
|
+
align-items: center;
|
|
179
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 -1px 0 0 inset;
|
|
180
|
+
display: flex;
|
|
181
|
+
gap: 14px;
|
|
182
|
+
height: 40px;
|
|
183
|
+
padding: 0 12px;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.sb-previewBlock_icon {
|
|
187
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
188
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
189
|
+
background: #e6e6e6;
|
|
190
|
+
height: 14px;
|
|
191
|
+
width: 14px;
|
|
192
|
+
}
|
|
193
|
+
.sb-previewBlock_icon:last-child {
|
|
194
|
+
margin-left: auto;
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
.sb-previewBlock_body {
|
|
198
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
199
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
200
|
+
height: 182px;
|
|
201
|
+
position: relative;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
.sb-argstableBlock {
|
|
205
|
+
border-collapse: collapse;
|
|
206
|
+
border-spacing: 0;
|
|
207
|
+
font-size: 13px;
|
|
208
|
+
line-height: 20px;
|
|
209
|
+
margin: 25px auto 40px;
|
|
210
|
+
max-width: 600px;
|
|
211
|
+
text-align: left;
|
|
212
|
+
width: 100%;
|
|
213
|
+
}
|
|
214
|
+
.sb-argstableBlock th:first-of-type,
|
|
215
|
+
.sb-argstableBlock td:first-of-type {
|
|
216
|
+
padding-left: 20px;
|
|
217
|
+
}
|
|
218
|
+
.sb-argstableBlock th:nth-of-type(2),
|
|
219
|
+
.sb-argstableBlock td:nth-of-type(2) {
|
|
220
|
+
width: 35%;
|
|
221
|
+
}
|
|
222
|
+
.sb-argstableBlock th:nth-of-type(3),
|
|
223
|
+
.sb-argstableBlock td:nth-of-type(3) {
|
|
224
|
+
width: 15%;
|
|
225
|
+
}
|
|
226
|
+
.sb-argstableBlock th:laste-of-type,
|
|
227
|
+
.sb-argstableBlock td:laste-of-type {
|
|
228
|
+
width: 25%;
|
|
229
|
+
padding-right: 20px;
|
|
230
|
+
}
|
|
231
|
+
.sb-argstableBlock th span,
|
|
232
|
+
.sb-argstableBlock td span {
|
|
233
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
234
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
235
|
+
background-color: rgba(0, 0, 0, 0.1);
|
|
236
|
+
border-radius: 0;
|
|
237
|
+
box-shadow: none;
|
|
238
|
+
color: transparent;
|
|
239
|
+
}
|
|
240
|
+
.sb-argstableBlock th {
|
|
241
|
+
padding: 10px 15px;
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
.sb-argstableBlock-body {
|
|
245
|
+
border-radius: 4px;
|
|
246
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 1px, rgba(0, 0, 0, 0.065) 0 0 0 1px;
|
|
247
|
+
}
|
|
248
|
+
.sb-argstableBlock-body tr {
|
|
249
|
+
background: transparent;
|
|
250
|
+
overflow: hidden;
|
|
251
|
+
}
|
|
252
|
+
.sb-argstableBlock-body tr:not(:first-child) {
|
|
253
|
+
border-top: 1px solid #e6e6e6;
|
|
254
|
+
}
|
|
255
|
+
.sb-argstableBlock-body tr:first-child td:first-child {
|
|
256
|
+
border-top-left-radius: 4px;
|
|
257
|
+
}
|
|
258
|
+
.sb-argstableBlock-body tr:first-child td:last-child {
|
|
259
|
+
border-top-right-radius: 4px;
|
|
260
|
+
}
|
|
261
|
+
.sb-argstableBlock-body tr:last-child td:first-child {
|
|
262
|
+
border-bottom-left-radius: 4px;
|
|
263
|
+
}
|
|
264
|
+
.sb-argstableBlock-body tr:last-child td:last-child {
|
|
265
|
+
border-bottom-right-radius: 4px;
|
|
266
|
+
}
|
|
267
|
+
.sb-argstableBlock-body td {
|
|
268
|
+
background: #fff;
|
|
269
|
+
padding-bottom: 10px;
|
|
270
|
+
padding-top: 10px;
|
|
271
|
+
vertical-align: top;
|
|
272
|
+
}
|
|
273
|
+
.sb-argstableBlock-body td:not(:first-of-type) {
|
|
274
|
+
padding-left: 15px;
|
|
275
|
+
padding-right: 15px;
|
|
276
|
+
}
|
|
277
|
+
.sb-argstableBlock-body button {
|
|
278
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
279
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
280
|
+
background-color: rgba(0, 0, 0, 0.1);
|
|
281
|
+
border: 0;
|
|
282
|
+
border-radius: 0;
|
|
283
|
+
box-shadow: none;
|
|
284
|
+
color: transparent;
|
|
285
|
+
display: inline;
|
|
286
|
+
font-size: 12px;
|
|
287
|
+
line-height: 1;
|
|
288
|
+
padding: 10px 16px;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
.sb-argstableBlock-summary {
|
|
292
|
+
margin-top: 4px;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
.sb-argstableBlock-code {
|
|
296
|
+
margin-right: 4px;
|
|
297
|
+
margin-bottom: 4px;
|
|
298
|
+
padding: 2px 5px;
|
|
299
|
+
}
|
|
105
300
|
</style>
|
|
106
301
|
|
|
107
302
|
<script>
|
|
@@ -1,196 +1,3 @@
|
|
|
1
|
-
<style>
|
|
2
|
-
@-webkit-keyframes sb-rotate360 {
|
|
3
|
-
from {
|
|
4
|
-
transform: rotate(0deg);
|
|
5
|
-
}
|
|
6
|
-
to {
|
|
7
|
-
transform: rotate(360deg);
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
@keyframes sb-rotate360 {
|
|
11
|
-
from {
|
|
12
|
-
transform: rotate(0deg);
|
|
13
|
-
}
|
|
14
|
-
to {
|
|
15
|
-
transform: rotate(360deg);
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
@-webkit-keyframes sb-glow {
|
|
19
|
-
0%,
|
|
20
|
-
100% {
|
|
21
|
-
opacity: 1;
|
|
22
|
-
}
|
|
23
|
-
50% {
|
|
24
|
-
opacity: 0.4;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
@keyframes sb-glow {
|
|
28
|
-
0%,
|
|
29
|
-
100% {
|
|
30
|
-
opacity: 1;
|
|
31
|
-
}
|
|
32
|
-
50% {
|
|
33
|
-
opacity: 0.4;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.sb-loader {
|
|
38
|
-
-webkit-animation: sb-rotate360 0.7s linear infinite;
|
|
39
|
-
animation: sb-rotate360 0.7s linear infinite;
|
|
40
|
-
border-color: rgba(97, 97, 97, 0.29);
|
|
41
|
-
border-radius: 50%;
|
|
42
|
-
border-style: solid;
|
|
43
|
-
border-top-color: #646464;
|
|
44
|
-
border-width: 2px;
|
|
45
|
-
display: inline-block;
|
|
46
|
-
height: 32px;
|
|
47
|
-
left: 50%;
|
|
48
|
-
margin-left: -16px;
|
|
49
|
-
margin-top: -16px;
|
|
50
|
-
mix-blend-mode: difference;
|
|
51
|
-
overflow: hidden;
|
|
52
|
-
position: absolute;
|
|
53
|
-
top: 50%;
|
|
54
|
-
transition: all 200ms ease-out;
|
|
55
|
-
vertical-align: top;
|
|
56
|
-
width: 32px;
|
|
57
|
-
z-index: 4;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
.sb-previewBlock {
|
|
61
|
-
background: #fff;
|
|
62
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
63
|
-
border-radius: 4px;
|
|
64
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 0;
|
|
65
|
-
margin: 25px auto 40px;
|
|
66
|
-
max-width: 600px;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
.sb-previewBlock_header {
|
|
70
|
-
align-items: center;
|
|
71
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 -1px 0 0 inset;
|
|
72
|
-
display: flex;
|
|
73
|
-
gap: 14px;
|
|
74
|
-
height: 40px;
|
|
75
|
-
padding: 0 12px;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
.sb-previewBlock_icon {
|
|
79
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
80
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
81
|
-
background: #e6e6e6;
|
|
82
|
-
height: 14px;
|
|
83
|
-
width: 14px;
|
|
84
|
-
}
|
|
85
|
-
.sb-previewBlock_icon:last-child {
|
|
86
|
-
margin-left: auto;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
.sb-previewBlock_body {
|
|
90
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
91
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
92
|
-
height: 182px;
|
|
93
|
-
position: relative;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
.sb-argstableBlock {
|
|
97
|
-
border-collapse: collapse;
|
|
98
|
-
border-spacing: 0;
|
|
99
|
-
font-size: 13px;
|
|
100
|
-
line-height: 20px;
|
|
101
|
-
margin: 25px auto 40px;
|
|
102
|
-
max-width: 600px;
|
|
103
|
-
text-align: left;
|
|
104
|
-
width: 100%;
|
|
105
|
-
}
|
|
106
|
-
.sb-argstableBlock th:first-of-type,
|
|
107
|
-
.sb-argstableBlock td:first-of-type {
|
|
108
|
-
padding-left: 20px;
|
|
109
|
-
}
|
|
110
|
-
.sb-argstableBlock th:nth-of-type(2),
|
|
111
|
-
.sb-argstableBlock td:nth-of-type(2) {
|
|
112
|
-
width: 35%;
|
|
113
|
-
}
|
|
114
|
-
.sb-argstableBlock th:nth-of-type(3),
|
|
115
|
-
.sb-argstableBlock td:nth-of-type(3) {
|
|
116
|
-
width: 15%;
|
|
117
|
-
}
|
|
118
|
-
.sb-argstableBlock th:laste-of-type,
|
|
119
|
-
.sb-argstableBlock td:laste-of-type {
|
|
120
|
-
width: 25%;
|
|
121
|
-
padding-right: 20px;
|
|
122
|
-
}
|
|
123
|
-
.sb-argstableBlock th span,
|
|
124
|
-
.sb-argstableBlock td span {
|
|
125
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
126
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
127
|
-
background-color: rgba(0, 0, 0, 0.1);
|
|
128
|
-
border-radius: 0;
|
|
129
|
-
box-shadow: none;
|
|
130
|
-
color: transparent;
|
|
131
|
-
}
|
|
132
|
-
.sb-argstableBlock th {
|
|
133
|
-
padding: 10px 15px;
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
.sb-argstableBlock-body {
|
|
137
|
-
border-radius: 4px;
|
|
138
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 1px, rgba(0, 0, 0, 0.065) 0 0 0 1px;
|
|
139
|
-
}
|
|
140
|
-
.sb-argstableBlock-body tr {
|
|
141
|
-
background: transparent;
|
|
142
|
-
overflow: hidden;
|
|
143
|
-
}
|
|
144
|
-
.sb-argstableBlock-body tr:not(:first-child) {
|
|
145
|
-
border-top: 1px solid #e6e6e6;
|
|
146
|
-
}
|
|
147
|
-
.sb-argstableBlock-body tr:first-child td:first-child {
|
|
148
|
-
border-top-left-radius: 4px;
|
|
149
|
-
}
|
|
150
|
-
.sb-argstableBlock-body tr:first-child td:last-child {
|
|
151
|
-
border-top-right-radius: 4px;
|
|
152
|
-
}
|
|
153
|
-
.sb-argstableBlock-body tr:last-child td:first-child {
|
|
154
|
-
border-bottom-left-radius: 4px;
|
|
155
|
-
}
|
|
156
|
-
.sb-argstableBlock-body tr:last-child td:last-child {
|
|
157
|
-
border-bottom-right-radius: 4px;
|
|
158
|
-
}
|
|
159
|
-
.sb-argstableBlock-body td {
|
|
160
|
-
background: #fff;
|
|
161
|
-
padding-bottom: 10px;
|
|
162
|
-
padding-top: 10px;
|
|
163
|
-
vertical-align: top;
|
|
164
|
-
}
|
|
165
|
-
.sb-argstableBlock-body td:not(:first-of-type) {
|
|
166
|
-
padding-left: 15px;
|
|
167
|
-
padding-right: 15px;
|
|
168
|
-
}
|
|
169
|
-
.sb-argstableBlock-body button {
|
|
170
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
171
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
172
|
-
background-color: rgba(0, 0, 0, 0.1);
|
|
173
|
-
border: 0;
|
|
174
|
-
border-radius: 0;
|
|
175
|
-
box-shadow: none;
|
|
176
|
-
color: transparent;
|
|
177
|
-
display: inline;
|
|
178
|
-
font-size: 12px;
|
|
179
|
-
line-height: 1;
|
|
180
|
-
padding: 10px 16px;
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
.sb-argstableBlock-summary {
|
|
184
|
-
margin-top: 4px;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
.sb-argstableBlock-code {
|
|
188
|
-
margin-right: 4px;
|
|
189
|
-
margin-bottom: 4px;
|
|
190
|
-
padding: 2px 5px;
|
|
191
|
-
}
|
|
192
|
-
</style>
|
|
193
|
-
|
|
194
1
|
<div class="sb-preparing-story sb-wrapper">
|
|
195
2
|
<div class="sb-loader"></div>
|
|
196
3
|
</div>
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
<base target="_parent" />
|
|
2
2
|
|
|
3
3
|
<style>
|
|
4
|
-
:not(.sb-show-main) > #root,
|
|
5
|
-
:not(.sb-show-main) > #docs-root,
|
|
6
4
|
:not(.sb-show-preparing-story) > .sb-preparing-story,
|
|
7
5
|
:not(.sb-show-preparing-docs) > .sb-preparing-docs,
|
|
8
6
|
:not(.sb-show-nopreview) > .sb-nopreview,
|
|
@@ -102,6 +100,203 @@
|
|
|
102
100
|
.sb-errordisplay pre {
|
|
103
101
|
white-space: pre-wrap;
|
|
104
102
|
}
|
|
103
|
+
|
|
104
|
+
@-webkit-keyframes sb-rotate360 {
|
|
105
|
+
from {
|
|
106
|
+
transform: rotate(0deg);
|
|
107
|
+
}
|
|
108
|
+
to {
|
|
109
|
+
transform: rotate(360deg);
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
@keyframes sb-rotate360 {
|
|
113
|
+
from {
|
|
114
|
+
transform: rotate(0deg);
|
|
115
|
+
}
|
|
116
|
+
to {
|
|
117
|
+
transform: rotate(360deg);
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
@-webkit-keyframes sb-glow {
|
|
121
|
+
0%,
|
|
122
|
+
100% {
|
|
123
|
+
opacity: 1;
|
|
124
|
+
}
|
|
125
|
+
50% {
|
|
126
|
+
opacity: 0.4;
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
@keyframes sb-glow {
|
|
130
|
+
0%,
|
|
131
|
+
100% {
|
|
132
|
+
opacity: 1;
|
|
133
|
+
}
|
|
134
|
+
50% {
|
|
135
|
+
opacity: 0.4;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/* We display the preparing loaders *over* the rendering story */
|
|
140
|
+
.sb-preparing-story,
|
|
141
|
+
.sb-preparing-docs {
|
|
142
|
+
background-color: white;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.sb-loader {
|
|
146
|
+
-webkit-animation: sb-rotate360 0.7s linear infinite;
|
|
147
|
+
animation: sb-rotate360 0.7s linear infinite;
|
|
148
|
+
border-color: rgba(97, 97, 97, 0.29);
|
|
149
|
+
border-radius: 50%;
|
|
150
|
+
border-style: solid;
|
|
151
|
+
border-top-color: #646464;
|
|
152
|
+
border-width: 2px;
|
|
153
|
+
display: inline-block;
|
|
154
|
+
height: 32px;
|
|
155
|
+
left: 50%;
|
|
156
|
+
margin-left: -16px;
|
|
157
|
+
margin-top: -16px;
|
|
158
|
+
mix-blend-mode: difference;
|
|
159
|
+
overflow: hidden;
|
|
160
|
+
position: absolute;
|
|
161
|
+
top: 50%;
|
|
162
|
+
transition: all 200ms ease-out;
|
|
163
|
+
vertical-align: top;
|
|
164
|
+
width: 32px;
|
|
165
|
+
z-index: 4;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.sb-previewBlock {
|
|
169
|
+
background: #fff;
|
|
170
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
171
|
+
border-radius: 4px;
|
|
172
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 0;
|
|
173
|
+
margin: 25px auto 40px;
|
|
174
|
+
max-width: 600px;
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
.sb-previewBlock_header {
|
|
178
|
+
align-items: center;
|
|
179
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 -1px 0 0 inset;
|
|
180
|
+
display: flex;
|
|
181
|
+
gap: 14px;
|
|
182
|
+
height: 40px;
|
|
183
|
+
padding: 0 12px;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.sb-previewBlock_icon {
|
|
187
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
188
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
189
|
+
background: #e6e6e6;
|
|
190
|
+
height: 14px;
|
|
191
|
+
width: 14px;
|
|
192
|
+
}
|
|
193
|
+
.sb-previewBlock_icon:last-child {
|
|
194
|
+
margin-left: auto;
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
.sb-previewBlock_body {
|
|
198
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
199
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
200
|
+
height: 182px;
|
|
201
|
+
position: relative;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
.sb-argstableBlock {
|
|
205
|
+
border-collapse: collapse;
|
|
206
|
+
border-spacing: 0;
|
|
207
|
+
font-size: 13px;
|
|
208
|
+
line-height: 20px;
|
|
209
|
+
margin: 25px auto 40px;
|
|
210
|
+
max-width: 600px;
|
|
211
|
+
text-align: left;
|
|
212
|
+
width: 100%;
|
|
213
|
+
}
|
|
214
|
+
.sb-argstableBlock th:first-of-type,
|
|
215
|
+
.sb-argstableBlock td:first-of-type {
|
|
216
|
+
padding-left: 20px;
|
|
217
|
+
}
|
|
218
|
+
.sb-argstableBlock th:nth-of-type(2),
|
|
219
|
+
.sb-argstableBlock td:nth-of-type(2) {
|
|
220
|
+
width: 35%;
|
|
221
|
+
}
|
|
222
|
+
.sb-argstableBlock th:nth-of-type(3),
|
|
223
|
+
.sb-argstableBlock td:nth-of-type(3) {
|
|
224
|
+
width: 15%;
|
|
225
|
+
}
|
|
226
|
+
.sb-argstableBlock th:laste-of-type,
|
|
227
|
+
.sb-argstableBlock td:laste-of-type {
|
|
228
|
+
width: 25%;
|
|
229
|
+
padding-right: 20px;
|
|
230
|
+
}
|
|
231
|
+
.sb-argstableBlock th span,
|
|
232
|
+
.sb-argstableBlock td span {
|
|
233
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
234
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
235
|
+
background-color: rgba(0, 0, 0, 0.1);
|
|
236
|
+
border-radius: 0;
|
|
237
|
+
box-shadow: none;
|
|
238
|
+
color: transparent;
|
|
239
|
+
}
|
|
240
|
+
.sb-argstableBlock th {
|
|
241
|
+
padding: 10px 15px;
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
.sb-argstableBlock-body {
|
|
245
|
+
border-radius: 4px;
|
|
246
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 1px, rgba(0, 0, 0, 0.065) 0 0 0 1px;
|
|
247
|
+
}
|
|
248
|
+
.sb-argstableBlock-body tr {
|
|
249
|
+
background: transparent;
|
|
250
|
+
overflow: hidden;
|
|
251
|
+
}
|
|
252
|
+
.sb-argstableBlock-body tr:not(:first-child) {
|
|
253
|
+
border-top: 1px solid #e6e6e6;
|
|
254
|
+
}
|
|
255
|
+
.sb-argstableBlock-body tr:first-child td:first-child {
|
|
256
|
+
border-top-left-radius: 4px;
|
|
257
|
+
}
|
|
258
|
+
.sb-argstableBlock-body tr:first-child td:last-child {
|
|
259
|
+
border-top-right-radius: 4px;
|
|
260
|
+
}
|
|
261
|
+
.sb-argstableBlock-body tr:last-child td:first-child {
|
|
262
|
+
border-bottom-left-radius: 4px;
|
|
263
|
+
}
|
|
264
|
+
.sb-argstableBlock-body tr:last-child td:last-child {
|
|
265
|
+
border-bottom-right-radius: 4px;
|
|
266
|
+
}
|
|
267
|
+
.sb-argstableBlock-body td {
|
|
268
|
+
background: #fff;
|
|
269
|
+
padding-bottom: 10px;
|
|
270
|
+
padding-top: 10px;
|
|
271
|
+
vertical-align: top;
|
|
272
|
+
}
|
|
273
|
+
.sb-argstableBlock-body td:not(:first-of-type) {
|
|
274
|
+
padding-left: 15px;
|
|
275
|
+
padding-right: 15px;
|
|
276
|
+
}
|
|
277
|
+
.sb-argstableBlock-body button {
|
|
278
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
279
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
280
|
+
background-color: rgba(0, 0, 0, 0.1);
|
|
281
|
+
border: 0;
|
|
282
|
+
border-radius: 0;
|
|
283
|
+
box-shadow: none;
|
|
284
|
+
color: transparent;
|
|
285
|
+
display: inline;
|
|
286
|
+
font-size: 12px;
|
|
287
|
+
line-height: 1;
|
|
288
|
+
padding: 10px 16px;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
.sb-argstableBlock-summary {
|
|
292
|
+
margin-top: 4px;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
.sb-argstableBlock-code {
|
|
296
|
+
margin-right: 4px;
|
|
297
|
+
margin-bottom: 4px;
|
|
298
|
+
padding: 2px 5px;
|
|
299
|
+
}
|
|
105
300
|
</style>
|
|
106
301
|
|
|
107
302
|
<script>
|
|
@@ -1,196 +1,3 @@
|
|
|
1
|
-
<style>
|
|
2
|
-
@-webkit-keyframes sb-rotate360 {
|
|
3
|
-
from {
|
|
4
|
-
transform: rotate(0deg);
|
|
5
|
-
}
|
|
6
|
-
to {
|
|
7
|
-
transform: rotate(360deg);
|
|
8
|
-
}
|
|
9
|
-
}
|
|
10
|
-
@keyframes sb-rotate360 {
|
|
11
|
-
from {
|
|
12
|
-
transform: rotate(0deg);
|
|
13
|
-
}
|
|
14
|
-
to {
|
|
15
|
-
transform: rotate(360deg);
|
|
16
|
-
}
|
|
17
|
-
}
|
|
18
|
-
@-webkit-keyframes sb-glow {
|
|
19
|
-
0%,
|
|
20
|
-
100% {
|
|
21
|
-
opacity: 1;
|
|
22
|
-
}
|
|
23
|
-
50% {
|
|
24
|
-
opacity: 0.4;
|
|
25
|
-
}
|
|
26
|
-
}
|
|
27
|
-
@keyframes sb-glow {
|
|
28
|
-
0%,
|
|
29
|
-
100% {
|
|
30
|
-
opacity: 1;
|
|
31
|
-
}
|
|
32
|
-
50% {
|
|
33
|
-
opacity: 0.4;
|
|
34
|
-
}
|
|
35
|
-
}
|
|
36
|
-
|
|
37
|
-
.sb-loader {
|
|
38
|
-
-webkit-animation: sb-rotate360 0.7s linear infinite;
|
|
39
|
-
animation: sb-rotate360 0.7s linear infinite;
|
|
40
|
-
border-color: rgba(97, 97, 97, 0.29);
|
|
41
|
-
border-radius: 50%;
|
|
42
|
-
border-style: solid;
|
|
43
|
-
border-top-color: #646464;
|
|
44
|
-
border-width: 2px;
|
|
45
|
-
display: inline-block;
|
|
46
|
-
height: 32px;
|
|
47
|
-
left: 50%;
|
|
48
|
-
margin-left: -16px;
|
|
49
|
-
margin-top: -16px;
|
|
50
|
-
mix-blend-mode: difference;
|
|
51
|
-
overflow: hidden;
|
|
52
|
-
position: absolute;
|
|
53
|
-
top: 50%;
|
|
54
|
-
transition: all 200ms ease-out;
|
|
55
|
-
vertical-align: top;
|
|
56
|
-
width: 32px;
|
|
57
|
-
z-index: 4;
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
.sb-previewBlock {
|
|
61
|
-
background: #fff;
|
|
62
|
-
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
63
|
-
border-radius: 4px;
|
|
64
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 0;
|
|
65
|
-
margin: 25px auto 40px;
|
|
66
|
-
max-width: 600px;
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
.sb-previewBlock_header {
|
|
70
|
-
align-items: center;
|
|
71
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 -1px 0 0 inset;
|
|
72
|
-
display: flex;
|
|
73
|
-
gap: 14px;
|
|
74
|
-
height: 40px;
|
|
75
|
-
padding: 0 12px;
|
|
76
|
-
}
|
|
77
|
-
|
|
78
|
-
.sb-previewBlock_icon {
|
|
79
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
80
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
81
|
-
background: #e6e6e6;
|
|
82
|
-
height: 14px;
|
|
83
|
-
width: 14px;
|
|
84
|
-
}
|
|
85
|
-
.sb-previewBlock_icon:last-child {
|
|
86
|
-
margin-left: auto;
|
|
87
|
-
}
|
|
88
|
-
|
|
89
|
-
.sb-previewBlock_body {
|
|
90
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
91
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
92
|
-
height: 182px;
|
|
93
|
-
position: relative;
|
|
94
|
-
}
|
|
95
|
-
|
|
96
|
-
.sb-argstableBlock {
|
|
97
|
-
border-collapse: collapse;
|
|
98
|
-
border-spacing: 0;
|
|
99
|
-
font-size: 13px;
|
|
100
|
-
line-height: 20px;
|
|
101
|
-
margin: 25px auto 40px;
|
|
102
|
-
max-width: 600px;
|
|
103
|
-
text-align: left;
|
|
104
|
-
width: 100%;
|
|
105
|
-
}
|
|
106
|
-
.sb-argstableBlock th:first-of-type,
|
|
107
|
-
.sb-argstableBlock td:first-of-type {
|
|
108
|
-
padding-left: 20px;
|
|
109
|
-
}
|
|
110
|
-
.sb-argstableBlock th:nth-of-type(2),
|
|
111
|
-
.sb-argstableBlock td:nth-of-type(2) {
|
|
112
|
-
width: 35%;
|
|
113
|
-
}
|
|
114
|
-
.sb-argstableBlock th:nth-of-type(3),
|
|
115
|
-
.sb-argstableBlock td:nth-of-type(3) {
|
|
116
|
-
width: 15%;
|
|
117
|
-
}
|
|
118
|
-
.sb-argstableBlock th:laste-of-type,
|
|
119
|
-
.sb-argstableBlock td:laste-of-type {
|
|
120
|
-
width: 25%;
|
|
121
|
-
padding-right: 20px;
|
|
122
|
-
}
|
|
123
|
-
.sb-argstableBlock th span,
|
|
124
|
-
.sb-argstableBlock td span {
|
|
125
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
126
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
127
|
-
background-color: rgba(0, 0, 0, 0.1);
|
|
128
|
-
border-radius: 0;
|
|
129
|
-
box-shadow: none;
|
|
130
|
-
color: transparent;
|
|
131
|
-
}
|
|
132
|
-
.sb-argstableBlock th {
|
|
133
|
-
padding: 10px 15px;
|
|
134
|
-
}
|
|
135
|
-
|
|
136
|
-
.sb-argstableBlock-body {
|
|
137
|
-
border-radius: 4px;
|
|
138
|
-
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 1px, rgba(0, 0, 0, 0.065) 0 0 0 1px;
|
|
139
|
-
}
|
|
140
|
-
.sb-argstableBlock-body tr {
|
|
141
|
-
background: transparent;
|
|
142
|
-
overflow: hidden;
|
|
143
|
-
}
|
|
144
|
-
.sb-argstableBlock-body tr:not(:first-child) {
|
|
145
|
-
border-top: 1px solid #e6e6e6;
|
|
146
|
-
}
|
|
147
|
-
.sb-argstableBlock-body tr:first-child td:first-child {
|
|
148
|
-
border-top-left-radius: 4px;
|
|
149
|
-
}
|
|
150
|
-
.sb-argstableBlock-body tr:first-child td:last-child {
|
|
151
|
-
border-top-right-radius: 4px;
|
|
152
|
-
}
|
|
153
|
-
.sb-argstableBlock-body tr:last-child td:first-child {
|
|
154
|
-
border-bottom-left-radius: 4px;
|
|
155
|
-
}
|
|
156
|
-
.sb-argstableBlock-body tr:last-child td:last-child {
|
|
157
|
-
border-bottom-right-radius: 4px;
|
|
158
|
-
}
|
|
159
|
-
.sb-argstableBlock-body td {
|
|
160
|
-
background: #fff;
|
|
161
|
-
padding-bottom: 10px;
|
|
162
|
-
padding-top: 10px;
|
|
163
|
-
vertical-align: top;
|
|
164
|
-
}
|
|
165
|
-
.sb-argstableBlock-body td:not(:first-of-type) {
|
|
166
|
-
padding-left: 15px;
|
|
167
|
-
padding-right: 15px;
|
|
168
|
-
}
|
|
169
|
-
.sb-argstableBlock-body button {
|
|
170
|
-
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
171
|
-
animation: sb-glow 1.5s ease-in-out infinite;
|
|
172
|
-
background-color: rgba(0, 0, 0, 0.1);
|
|
173
|
-
border: 0;
|
|
174
|
-
border-radius: 0;
|
|
175
|
-
box-shadow: none;
|
|
176
|
-
color: transparent;
|
|
177
|
-
display: inline;
|
|
178
|
-
font-size: 12px;
|
|
179
|
-
line-height: 1;
|
|
180
|
-
padding: 10px 16px;
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
.sb-argstableBlock-summary {
|
|
184
|
-
margin-top: 4px;
|
|
185
|
-
}
|
|
186
|
-
|
|
187
|
-
.sb-argstableBlock-code {
|
|
188
|
-
margin-right: 4px;
|
|
189
|
-
margin-bottom: 4px;
|
|
190
|
-
padding: 2px 5px;
|
|
191
|
-
}
|
|
192
|
-
</style>
|
|
193
|
-
|
|
194
1
|
<div class="sb-preparing-story sb-wrapper">
|
|
195
2
|
<div class="sb-loader"></div>
|
|
196
3
|
</div>
|
|
@@ -1,8 +1,6 @@
|
|
|
1
1
|
<base target="_parent" />
|
|
2
2
|
|
|
3
3
|
<style>
|
|
4
|
-
:not(.sb-show-main) > #root,
|
|
5
|
-
:not(.sb-show-main) > #docs-root,
|
|
6
4
|
:not(.sb-show-preparing-story) > .sb-preparing-story,
|
|
7
5
|
:not(.sb-show-preparing-docs) > .sb-preparing-docs,
|
|
8
6
|
:not(.sb-show-nopreview) > .sb-nopreview,
|
|
@@ -102,6 +100,203 @@
|
|
|
102
100
|
.sb-errordisplay pre {
|
|
103
101
|
white-space: pre-wrap;
|
|
104
102
|
}
|
|
103
|
+
|
|
104
|
+
@-webkit-keyframes sb-rotate360 {
|
|
105
|
+
from {
|
|
106
|
+
transform: rotate(0deg);
|
|
107
|
+
}
|
|
108
|
+
to {
|
|
109
|
+
transform: rotate(360deg);
|
|
110
|
+
}
|
|
111
|
+
}
|
|
112
|
+
@keyframes sb-rotate360 {
|
|
113
|
+
from {
|
|
114
|
+
transform: rotate(0deg);
|
|
115
|
+
}
|
|
116
|
+
to {
|
|
117
|
+
transform: rotate(360deg);
|
|
118
|
+
}
|
|
119
|
+
}
|
|
120
|
+
@-webkit-keyframes sb-glow {
|
|
121
|
+
0%,
|
|
122
|
+
100% {
|
|
123
|
+
opacity: 1;
|
|
124
|
+
}
|
|
125
|
+
50% {
|
|
126
|
+
opacity: 0.4;
|
|
127
|
+
}
|
|
128
|
+
}
|
|
129
|
+
@keyframes sb-glow {
|
|
130
|
+
0%,
|
|
131
|
+
100% {
|
|
132
|
+
opacity: 1;
|
|
133
|
+
}
|
|
134
|
+
50% {
|
|
135
|
+
opacity: 0.4;
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/* We display the preparing loaders *over* the rendering story */
|
|
140
|
+
.sb-preparing-story,
|
|
141
|
+
.sb-preparing-docs {
|
|
142
|
+
background-color: white;
|
|
143
|
+
}
|
|
144
|
+
|
|
145
|
+
.sb-loader {
|
|
146
|
+
-webkit-animation: sb-rotate360 0.7s linear infinite;
|
|
147
|
+
animation: sb-rotate360 0.7s linear infinite;
|
|
148
|
+
border-color: rgba(97, 97, 97, 0.29);
|
|
149
|
+
border-radius: 50%;
|
|
150
|
+
border-style: solid;
|
|
151
|
+
border-top-color: #646464;
|
|
152
|
+
border-width: 2px;
|
|
153
|
+
display: inline-block;
|
|
154
|
+
height: 32px;
|
|
155
|
+
left: 50%;
|
|
156
|
+
margin-left: -16px;
|
|
157
|
+
margin-top: -16px;
|
|
158
|
+
mix-blend-mode: difference;
|
|
159
|
+
overflow: hidden;
|
|
160
|
+
position: absolute;
|
|
161
|
+
top: 50%;
|
|
162
|
+
transition: all 200ms ease-out;
|
|
163
|
+
vertical-align: top;
|
|
164
|
+
width: 32px;
|
|
165
|
+
z-index: 4;
|
|
166
|
+
}
|
|
167
|
+
|
|
168
|
+
.sb-previewBlock {
|
|
169
|
+
background: #fff;
|
|
170
|
+
border: 1px solid rgba(0, 0, 0, 0.1);
|
|
171
|
+
border-radius: 4px;
|
|
172
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 0;
|
|
173
|
+
margin: 25px auto 40px;
|
|
174
|
+
max-width: 600px;
|
|
175
|
+
}
|
|
176
|
+
|
|
177
|
+
.sb-previewBlock_header {
|
|
178
|
+
align-items: center;
|
|
179
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 -1px 0 0 inset;
|
|
180
|
+
display: flex;
|
|
181
|
+
gap: 14px;
|
|
182
|
+
height: 40px;
|
|
183
|
+
padding: 0 12px;
|
|
184
|
+
}
|
|
185
|
+
|
|
186
|
+
.sb-previewBlock_icon {
|
|
187
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
188
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
189
|
+
background: #e6e6e6;
|
|
190
|
+
height: 14px;
|
|
191
|
+
width: 14px;
|
|
192
|
+
}
|
|
193
|
+
.sb-previewBlock_icon:last-child {
|
|
194
|
+
margin-left: auto;
|
|
195
|
+
}
|
|
196
|
+
|
|
197
|
+
.sb-previewBlock_body {
|
|
198
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
199
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
200
|
+
height: 182px;
|
|
201
|
+
position: relative;
|
|
202
|
+
}
|
|
203
|
+
|
|
204
|
+
.sb-argstableBlock {
|
|
205
|
+
border-collapse: collapse;
|
|
206
|
+
border-spacing: 0;
|
|
207
|
+
font-size: 13px;
|
|
208
|
+
line-height: 20px;
|
|
209
|
+
margin: 25px auto 40px;
|
|
210
|
+
max-width: 600px;
|
|
211
|
+
text-align: left;
|
|
212
|
+
width: 100%;
|
|
213
|
+
}
|
|
214
|
+
.sb-argstableBlock th:first-of-type,
|
|
215
|
+
.sb-argstableBlock td:first-of-type {
|
|
216
|
+
padding-left: 20px;
|
|
217
|
+
}
|
|
218
|
+
.sb-argstableBlock th:nth-of-type(2),
|
|
219
|
+
.sb-argstableBlock td:nth-of-type(2) {
|
|
220
|
+
width: 35%;
|
|
221
|
+
}
|
|
222
|
+
.sb-argstableBlock th:nth-of-type(3),
|
|
223
|
+
.sb-argstableBlock td:nth-of-type(3) {
|
|
224
|
+
width: 15%;
|
|
225
|
+
}
|
|
226
|
+
.sb-argstableBlock th:laste-of-type,
|
|
227
|
+
.sb-argstableBlock td:laste-of-type {
|
|
228
|
+
width: 25%;
|
|
229
|
+
padding-right: 20px;
|
|
230
|
+
}
|
|
231
|
+
.sb-argstableBlock th span,
|
|
232
|
+
.sb-argstableBlock td span {
|
|
233
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
234
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
235
|
+
background-color: rgba(0, 0, 0, 0.1);
|
|
236
|
+
border-radius: 0;
|
|
237
|
+
box-shadow: none;
|
|
238
|
+
color: transparent;
|
|
239
|
+
}
|
|
240
|
+
.sb-argstableBlock th {
|
|
241
|
+
padding: 10px 15px;
|
|
242
|
+
}
|
|
243
|
+
|
|
244
|
+
.sb-argstableBlock-body {
|
|
245
|
+
border-radius: 4px;
|
|
246
|
+
box-shadow: rgba(0, 0, 0, 0.1) 0 1px 3px 1px, rgba(0, 0, 0, 0.065) 0 0 0 1px;
|
|
247
|
+
}
|
|
248
|
+
.sb-argstableBlock-body tr {
|
|
249
|
+
background: transparent;
|
|
250
|
+
overflow: hidden;
|
|
251
|
+
}
|
|
252
|
+
.sb-argstableBlock-body tr:not(:first-child) {
|
|
253
|
+
border-top: 1px solid #e6e6e6;
|
|
254
|
+
}
|
|
255
|
+
.sb-argstableBlock-body tr:first-child td:first-child {
|
|
256
|
+
border-top-left-radius: 4px;
|
|
257
|
+
}
|
|
258
|
+
.sb-argstableBlock-body tr:first-child td:last-child {
|
|
259
|
+
border-top-right-radius: 4px;
|
|
260
|
+
}
|
|
261
|
+
.sb-argstableBlock-body tr:last-child td:first-child {
|
|
262
|
+
border-bottom-left-radius: 4px;
|
|
263
|
+
}
|
|
264
|
+
.sb-argstableBlock-body tr:last-child td:last-child {
|
|
265
|
+
border-bottom-right-radius: 4px;
|
|
266
|
+
}
|
|
267
|
+
.sb-argstableBlock-body td {
|
|
268
|
+
background: #fff;
|
|
269
|
+
padding-bottom: 10px;
|
|
270
|
+
padding-top: 10px;
|
|
271
|
+
vertical-align: top;
|
|
272
|
+
}
|
|
273
|
+
.sb-argstableBlock-body td:not(:first-of-type) {
|
|
274
|
+
padding-left: 15px;
|
|
275
|
+
padding-right: 15px;
|
|
276
|
+
}
|
|
277
|
+
.sb-argstableBlock-body button {
|
|
278
|
+
-webkit-animation: sb-glow 1.5s ease-in-out infinite;
|
|
279
|
+
animation: sb-glow 1.5s ease-in-out infinite;
|
|
280
|
+
background-color: rgba(0, 0, 0, 0.1);
|
|
281
|
+
border: 0;
|
|
282
|
+
border-radius: 0;
|
|
283
|
+
box-shadow: none;
|
|
284
|
+
color: transparent;
|
|
285
|
+
display: inline;
|
|
286
|
+
font-size: 12px;
|
|
287
|
+
line-height: 1;
|
|
288
|
+
padding: 10px 16px;
|
|
289
|
+
}
|
|
290
|
+
|
|
291
|
+
.sb-argstableBlock-summary {
|
|
292
|
+
margin-top: 4px;
|
|
293
|
+
}
|
|
294
|
+
|
|
295
|
+
.sb-argstableBlock-code {
|
|
296
|
+
margin-right: 4px;
|
|
297
|
+
margin-bottom: 4px;
|
|
298
|
+
padding: 2px 5px;
|
|
299
|
+
}
|
|
105
300
|
</style>
|
|
106
301
|
|
|
107
302
|
<script>
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@storybook/core-common",
|
|
3
|
-
"version": "6.4.
|
|
3
|
+
"version": "6.4.3",
|
|
4
4
|
"description": "Storybook framework-agnostic API",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"storybook"
|
|
@@ -61,7 +61,7 @@
|
|
|
61
61
|
"@babel/preset-react": "^7.12.10",
|
|
62
62
|
"@babel/preset-typescript": "^7.12.7",
|
|
63
63
|
"@babel/register": "^7.12.1",
|
|
64
|
-
"@storybook/node-logger": "6.4.
|
|
64
|
+
"@storybook/node-logger": "6.4.3",
|
|
65
65
|
"@storybook/semver": "^7.3.2",
|
|
66
66
|
"@types/node": "^14.0.10",
|
|
67
67
|
"@types/pretty-hrtime": "^1.0.0",
|
|
@@ -110,6 +110,6 @@
|
|
|
110
110
|
"publishConfig": {
|
|
111
111
|
"access": "public"
|
|
112
112
|
},
|
|
113
|
-
"gitHead": "
|
|
113
|
+
"gitHead": "3e8133aa834b15a7c7021c6e5e090016491b5218",
|
|
114
114
|
"sbmodern": "dist/modern/index.js"
|
|
115
115
|
}
|