survey-react 1.9.90 → 1.9.92

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 (14) hide show
  1. package/defaultV2.css +686 -697
  2. package/defaultV2.css.map +1 -1
  3. package/defaultV2.min.css +2 -2
  4. package/modern.css +255 -251
  5. package/modern.css.map +1 -1
  6. package/modern.min.css +2 -2
  7. package/package.json +1 -1
  8. package/survey.css +47 -47
  9. package/survey.css.map +1 -1
  10. package/survey.min.css +2 -2
  11. package/survey.react.d.ts +53 -5
  12. package/survey.react.js +353 -155
  13. package/survey.react.js.map +1 -1
  14. package/survey.react.min.js +3 -3
package/survey.css CHANGED
@@ -1,5 +1,5 @@
1
1
  /*!
2
- * surveyjs - Survey JavaScript library v1.9.90
2
+ * surveyjs - Survey JavaScript library v1.9.92
3
3
  * Copyright (c) 2015-2023 Devsoft Baltic OÜ - http://surveyjs.io/
4
4
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
5
5
  */
@@ -20,7 +20,7 @@
20
20
  display: inline-block;
21
21
  vertical-align: top;
22
22
  margin-top: 22px;
23
- font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
23
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
24
24
  width: 16px;
25
25
  height: 16px;
26
26
  cursor: pointer;
@@ -31,7 +31,7 @@
31
31
  display: inline-block;
32
32
  vertical-align: top;
33
33
  margin-top: 22px;
34
- font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
34
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
35
35
  width: 16px;
36
36
  height: 16px;
37
37
  cursor: pointer;
@@ -59,7 +59,7 @@
59
59
 
60
60
  .sv_progress-buttons__list li {
61
61
  width: 138px;
62
- font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
62
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
63
63
  font-family: var(--font-family, var(--font-family));
64
64
  position: relative;
65
65
  text-align: center;
@@ -151,7 +151,7 @@
151
151
  background-color: cadetblue;
152
152
  padding: 1px;
153
153
  font-family: var(--font-family, var(--font-family));
154
- font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
154
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
155
155
  font-style: normal;
156
156
  font-weight: 400;
157
157
  line-height: 1.42857143;
@@ -180,7 +180,7 @@
180
180
  .sv_window_title {
181
181
  padding: 8px 14px;
182
182
  margin: 0;
183
- font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
183
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
184
184
  background-color: #f7f7f7;
185
185
  border-bottom: 1px solid #ebebeb;
186
186
  border-radius: calc(1 * var(--sjs-corner-radius, 4px)) calc(1 * var(--sjs-corner-radius, 4px)) 0 0;
@@ -197,7 +197,7 @@
197
197
  .sv_window_title a:link,
198
198
  .sv_window_title a:visited {
199
199
  text-decoration: none;
200
- font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
200
+ font-size: calc(0.875 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
201
201
  font-style: normal;
202
202
  color: black;
203
203
  }
@@ -218,8 +218,8 @@
218
218
 
219
219
  .sv-brand-info__text {
220
220
  font-weight: 600;
221
- font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
222
- line-height: calc(3 * var(--base-unit, 8px));
221
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
222
+ line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
223
223
  color: #161616;
224
224
  }
225
225
 
@@ -232,47 +232,47 @@
232
232
 
233
233
  .sv-brand-info__terms {
234
234
  font-weight: 400;
235
- font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
236
- line-height: calc(2 * var(--base-unit, 8px));
235
+ font-size: calc(0.75 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
236
+ line-height: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
237
237
  }
238
238
  .sv-brand-info__terms a {
239
239
  color: #909090;
240
240
  }
241
241
 
242
242
  .sv-dragged-element-shortcut {
243
- height: calc(3 * var(--base-unit, 8px));
244
- min-width: calc(12.5 * var(--base-unit, 8px));
245
- border-radius: calc(4.5 * var(--base-unit, 8px));
246
- background-color: var(--background, #fff);
247
- padding: calc(2 * var(--base-unit, 8px));
243
+ height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
244
+ min-width: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
245
+ border-radius: calc(4.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
246
+ background-color: var(--sjs-general-backcolor, var(--background, #fff));
247
+ padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)));
248
248
  cursor: grabbing;
249
249
  position: absolute;
250
- z-index: 1000;
250
+ z-index: 10000;
251
251
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
252
252
  font-family: var(--font-family, var(--font-family));
253
- font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
254
- padding-left: calc(2.5 * var(--base-unit, 8px));
255
- line-height: calc(3 * var(--base-unit, 8px));
253
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
254
+ padding-left: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
255
+ line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
256
256
  }
257
257
 
258
258
  .sv-matrixdynamic__drag-icon {
259
- padding-top: calc(1.75 * var(--base-unit, 8px));
259
+ padding-top: calc(1.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
260
260
  }
261
261
 
262
262
  .sv-matrixdynamic__drag-icon:after {
263
263
  content: " ";
264
264
  display: block;
265
- height: calc(0.75 * var(--base-unit, 8px));
266
- width: calc(2.5 * var(--base-unit, 8px));
265
+ height: calc(0.75 * var(--sjs-base-unit, var(--base-unit, 8px)));
266
+ width: calc(2.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
267
267
  border: 1px solid #e7e7e7;
268
268
  box-sizing: border-box;
269
- border-radius: calc(1.25 * var(--base-unit, 8px));
269
+ border-radius: calc(1.25 * var(--sjs-base-unit, var(--base-unit, 8px)));
270
270
  cursor: move;
271
- margin-top: calc(1.5 * var(--base-unit, 8px));
271
+ margin-top: calc(1.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
272
272
  }
273
273
 
274
274
  .sv-matrix-row--drag-drop-ghost-mod td {
275
- background-color: var(--background-dim, #f3f3f3);
275
+ background-color: var(--sjs-general-backcolor-dim, var(--background-dim, #f3f3f3));
276
276
  }
277
277
 
278
278
  .sv-matrix-row--drag-drop-ghost-mod td > * {
@@ -282,24 +282,24 @@
282
282
  .sv-save-data_root {
283
283
  position: absolute;
284
284
  left: 50%;
285
- bottom: calc(3 * var(--base-unit, 8px));
286
- background: var(--background, #fff);
285
+ bottom: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
286
+ background: var(--sjs-general-backcolor, var(--background, #fff));
287
287
  opacity: 0;
288
- padding: calc(3 * var(--base-unit, 8px)) calc(6 * var(--base-unit, 8px));
288
+ padding: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
289
289
  box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);
290
290
  border-radius: calc(2 * var(--sjs-corner-radius, 4px));
291
291
  color: var(--sjs-general-forecolor, var(--foreground, #161616));
292
- min-width: calc(30 * var(--base-unit, 8px));
292
+ min-width: calc(30 * var(--sjs-base-unit, var(--base-unit, 8px)));
293
293
  text-align: center;
294
294
  z-index: 1600;
295
295
  font-family: var(--font-family, var(--font-family));
296
- font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
297
- line-height: calc(3 * var(--base-unit, 8px));
296
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
297
+ line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
298
298
  display: flex;
299
299
  flex-direction: row;
300
300
  justify-content: center;
301
301
  align-items: center;
302
- transform: translateX(-50%) translateY(calc(3 * var(--base-unit, 8px)));
302
+ transform: translateX(-50%) translateY(calc(3 * var(--sjs-base-unit, var(--base-unit, 8px))));
303
303
  transition-timing-function: ease-in;
304
304
  transition-property: transform, opacity;
305
305
  transition-delay: 0.25s;
@@ -330,31 +330,31 @@
330
330
  }
331
331
 
332
332
  .sv-save-data_root.sv-save-data_error {
333
- background-color: var(--red, #e60a3e);
334
- color: var(--background, #fff);
333
+ background-color: var(--sjs-special-red, var(--red, #e60a3e));
334
+ color: var(--sjs-general-backcolor, var(--background, #fff));
335
335
  font-weight: 600;
336
- padding: calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) calc(6 * var(--base-unit, 8px));
337
- gap: calc(6 * var(--base-unit, 8px));
336
+ padding: calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(2 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
337
+ gap: calc(6 * var(--sjs-base-unit, var(--base-unit, 8px)));
338
338
  }
339
339
 
340
340
  .sv-save-data_root.sv-save-data_error .sv-save-data_button {
341
341
  font-weight: 600;
342
- font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--base-unit, 8px))));
343
- line-height: calc(3 * var(--base-unit, 8px));
344
- height: calc(5 * var(--base-unit, 8px));
342
+ font-size: calc(1 * var(--sjs-font-size, calc(2 * var(--sjs-base-unit, var(--base-unit, 8px)))));
343
+ line-height: calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
344
+ height: calc(5 * var(--sjs-base-unit, var(--base-unit, 8px)));
345
345
  color: #ffffff;
346
- background-color: var(--red, #e60a3e);
347
- border: calc(0.25 * var(--base-unit, 8px)) solid #ffffff;
346
+ background-color: var(--sjs-special-red, var(--red, #e60a3e));
347
+ border: calc(0.25 * var(--sjs-base-unit, var(--base-unit, 8px))) solid #ffffff;
348
348
  border-radius: calc(1.5 * var(--sjs-corner-radius, 4px));
349
- padding: calc(1 * var(--base-unit, 8px)) calc(3 * var(--base-unit, 8px));
349
+ padding: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px))) calc(3 * var(--sjs-base-unit, var(--base-unit, 8px)));
350
350
  display: flex;
351
351
  align-items: center;
352
352
  }
353
353
 
354
354
  .sv-save-data_root.sv-save-data_error .sv-save-data_button:hover,
355
355
  .sv-save-data_root.sv-save-data_error .sv-save-data_button:focus {
356
- color: var(--red, #e60a3e);
357
- background-color: var(--background, #fff);
356
+ color: var(--sjs-special-red, var(--red, #e60a3e));
357
+ background-color: var(--sjs-general-backcolor, var(--background, #fff));
358
358
  }
359
359
 
360
360
  .sv-save-data_root.sv-save-data_success {
@@ -1560,7 +1560,7 @@ sv-components-container,
1560
1560
  outline: none;
1561
1561
  padding: 0px;
1562
1562
  padding-top: 1px;
1563
- width: auto;
1563
+ width: 100%;
1564
1564
  display: flex;
1565
1565
  flex-grow: 1;
1566
1566
  overflow: hidden;
@@ -3239,7 +3239,7 @@ sv-popup {
3239
3239
  .sv-list__filter {
3240
3240
  border-bottom: 1px solid rgba(0, 0, 0, 0.16);
3241
3241
  background: var(--background, #fff);
3242
- padding-bottom: calc(1 * var(--base-unit, 8px));
3242
+ padding-bottom: calc(1 * var(--sjs-base-unit, var(--base-unit, 8px)));
3243
3243
  }
3244
3244
 
3245
3245
  .sv-list__input {