survey-react 1.12.2 → 1.12.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "survey-react",
-  "version": "1.12.2",
+  "version": "1.12.4",
   "description": "survey.js is a JavaScript Survey Library. It is a modern way to add a survey to your website. It uses JSON for survey metadata and results.",
   "keywords": [
     "Survey",

package/survey.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.12.2
+ * surveyjs - Survey JavaScript library v1.12.4
  * Copyright (c) 2015-2024 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -452,6 +452,16 @@ sv-brand-info,
   position: absolute;
   z-index: 10000;
   font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
+  min-width: 100px;
+  max-width: 400px;
+}
+.sv-drag-drop-choices-shortcut .sv-ranking-item {
+  height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sv-drag-drop-choices-shortcut .sv-ranking-item .sv-ranking-item__text .sv-string-viewer,
+.sv-drag-drop-choices-shortcut .sv-ranking-item .sv-ranking-item__text .sv-string-editor {
+  overflow: hidden;
+  white-space: nowrap;
 }
 
 .sv-drag-drop-choices-shortcut__content.sv-drag-drop-choices-shortcut__content {
@@ -680,12 +690,13 @@ sv-brand-info,
   line-height: calc(1.5 * (var(--sjs-internal-font-editorfont-size)));
   margin: 0 calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   overflow-wrap: break-word;
-  word-break: break-all;
+  word-break: normal;
   align-self: self-start;
   padding-top: var(--sjs-base-unit, var(--base-unit, 8px));
   padding-bottom: var(--sjs-base-unit, var(--base-unit, 8px));
 }
-.sv-ranking-item__text .sv-string-viewer {
+.sv-ranking-item__text .sv-string-viewer,
+.sv-ranking-item__text .sv-string-editor {
   overflow: initial;
   white-space: pre-line;
 }
@@ -730,7 +741,8 @@ sv-brand-info,
 .sv-ranking-item--ghost {
   height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-ranking-item--ghost .sv-ranking-item__text .sv-string-viewer {
+.sv-ranking-item--ghost .sv-ranking-item__text .sv-string-viewer,
+.sv-ranking-item--ghost .sv-ranking-item__text .sv-string-editor {
   white-space: unset;
 }
 
@@ -826,7 +838,8 @@ sv-brand-info,
 .sv-ranking-shortcut .sv-ranking-item {
   height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-ranking-shortcut .sv-ranking-item .sv-ranking-item__text .sv-string-viewer {
+.sv-ranking-shortcut .sv-ranking-item .sv-ranking-item__text .sv-string-viewer,
+.sv-ranking-shortcut .sv-ranking-item .sv-ranking-item__text .sv-string-editor {
   overflow: hidden;
   white-space: nowrap;
 }
@@ -960,6 +973,32 @@ sv-brand-info,
   left: initial;
 }
 
+.sv-ranking--select-to-rank-swap-areas {
+  flex-direction: row-reverse;
+}
+.sv-ranking--select-to-rank-swap-areas .sv-ranking__container--to .sv-ranking-item {
+  padding-left: 0;
+  left: -24px !important;
+}
+.sv-ranking--select-to-rank-swap-areas .sv-ranking__container--from .sv-ranking-item {
+  padding-left: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  left: 0;
+}
+.sv-ranking--select-to-rank-swap-areas .sv-ranking__container--from .sv-ranking-item__ghost.sv-ranking-item__ghost {
+  left: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sv-ranking--select-to-rank-swap-areas .sv-ranking__container--empty.sv-ranking__container--to .sv-ranking__container-placeholder {
+  padding-right: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-left: 0;
+}
+.sv-ranking--select-to-rank-swap-areas .sv-ranking__container--empty.sv-ranking__container--to .sv-ranking-item__ghost.sv-ranking-item__ghost {
+  right: calc(2 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+}
+.sv-ranking--select-to-rank-swap-areas .sv-ranking__container--empty.sv-ranking__container--from .sv-ranking__container-placeholder {
+  padding-left: calc(5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  padding-right: 0;
+}
+
 body {
   --sv-default-mark: true;
 }
@@ -988,7 +1027,7 @@ body {
 }
 .sv_main input[type=button]:hover,
 .sv_main button:hover {
-  background-color: var(--main-hover-color, #179d82);
+  background-color: var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
 }
 .sv_main .sv_q_other input,
 .sv_main .sv_q_text_root,
@@ -1140,7 +1179,7 @@ body {
 }
 .sv_main .sv_q_erbox:not([style*="display: none"]):not([style*="display:none"]) {
   border: 1px solid var(--error-color, #ed5565);
-  background-color: var(--error-background-color, #fcdfe2);
+  background-color: var(--error-background-color, rgb(251.6489361702, 223.3510638298, 226.329787234));
   color: var(--error-color, #ed5565);
 }
 .sv_main .sv_q_erbox:not([style*="display: none"]):not([style*="display:none"]) + input, .sv_main .sv_q_erbox:not([style*="display: none"]):not([style*="display:none"]) + textarea, .sv_main .sv_q_erbox:not([style*="display: none"]):not([style*="display:none"]) + .sv_select_wrapper select {
@@ -1183,18 +1222,18 @@ body {
 }
 .sv_main .sv_q_m_cell_selected {
   color: var(--body-background-color, white);
-  background-color: var(--main-hover-color, #179d82);
+  background-color: var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
 }
 .sv_main .sv_q_rating_item.active .sv_q_rating_item_text {
-  background-color: var(--main-hover-color, #179d82);
-  border-color: var(--main-hover-color, #179d82);
+  background-color: var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
+  border-color: var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
   color: var(--body-background-color, white);
 }
 .sv_main .sv_q_rating_item .sv_q_rating_item_text {
   border: 1px solid var(--border-color, #e7e7e7);
 }
 .sv_main .sv_q_rating_item .sv_q_rating_item_text:hover {
-  border: 1px solid var(--main-hover-color, #179d82);
+  border: 1px solid var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
 }
 .sv_main .sv_q_rating__item-star > svg {
   fill: var(--text-color, #6d7072);
@@ -1205,7 +1244,7 @@ body {
   border: 1px solid transparent;
 }
 .sv_main .sv_q_rating__item-star > svg:hover {
-  border: 1px solid var(--main-hover-color, #179d82);
+  border: 1px solid var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
 }
 .sv_main .sv_q_rating__item-star > svg.sv-star-2 {
   display: none;
@@ -1226,10 +1265,10 @@ body {
   display: block;
 }
 .sv_main .sv_q_rating__item-smiley > svg:hover {
-  border: 1px solid var(--main-hover-color, #179d82);
+  border: 1px solid var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
 }
 .sv_main .sv_q_rating__item-smiley--selected > svg {
-  background-color: var(--main-hover-color, #179d82);
+  background-color: var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
   fill: var(--body-background-color, white);
 }
 .sv_main .sv_q_imgsel.checked label > div {
@@ -1616,7 +1655,7 @@ body {
 }
 
 .sv_main.sv_main .sv-action-bar-item.sv_edit_btn:hover {
-  background-color: var(--main-hover-color, #179d82);
+  background-color: var(--main-hover-color, rgb(22.7658536585, 156.7341463415, 129.5902439024));
 }
 
 .sv_main .sv_p_root .sv_row .sv_q.sv_qstn:first-child:last-child {
@@ -3040,7 +3079,8 @@ f-panel {
   word-break: break-all;
   margin: 0 calc(2 * var(--base-unit, 8px));
 }
-.sv-ranking-item__text .sv-string-viewer {
+.sv-ranking-item__text .sv-string-viewer,
+.sv-ranking-item__text .sv-string-editor {
   overflow: initial;
   white-space: pre-line;
 }
@@ -3064,7 +3104,8 @@ f-panel {
 .sv-ranking-item--ghost {
   height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sv-ranking-item--ghost .sv-ranking-item__text .sv-string-viewer {
+.sv-ranking-item--ghost .sv-ranking-item__text .sv-string-viewer,
+.sv-ranking-item--ghost .sv-ranking-item__text .sv-string-editor {
   white-space: unset;
 }
 
@@ -3641,12 +3682,6 @@ sv-popup {
   border: unset;
 }
 
-.sv-popup__shadow {
-  width: 100%;
-  height: 100%;
-  border-radius: calc(1 * var(--base-unit, 8px));
-}
-
 .sv-popup--overlay .sv-popup__body-content {
   border-radius: calc(2 * var(--base-unit, 8px)) calc(2 * var(--base-unit, 8px)) 0px 0px;
   background: var(--background, #fff);
@@ -3845,7 +3880,7 @@ sv-popup {
   padding-inline-start: calc(2 * var(--base-unit, 8px));
   cursor: pointer;
   overflow: hidden;
-  text-align: left;
+  text-align: start;
   text-overflow: ellipsis;
   white-space: nowrap;
   display: flex;