survey-react 1.10.1 → 1.10.3

package/defaultV2.css

@@ -1,5 +1,5 @@
 /*!
- * surveyjs - Survey JavaScript library v1.10.1
+ * surveyjs - Survey JavaScript library v1.10.3
  * Copyright (c) 2015-2024 Devsoft Baltic OÜ  - http://surveyjs.io/
  * License: MIT (http://www.opensource.org/licenses/mit-license.php)
  */
@@ -1544,6 +1544,18 @@ sv-brand-info, .sv-brand-info {
   margin-left: var(--sjs-base-unit, var(--base-unit, 8px));
 }
 
+.sv-ranking-shortcut {
+  cursor: grabbing;
+  position: absolute;
+  z-index: 10000;
+  border-radius: calc(12.5 * var(--sjs-base-unit, var(--base-unit, 8px)));
+  min-width: 100px;
+  max-width: 400px;
+  box-shadow: var(--sjs-shadow-medium, 0px 2px 6px 0px rgba(0, 0, 0, 0.1)), var(--sjs-shadow-large, 0px 8px 16px 0px rgba(0, 0, 0, 0.1));
+  background-color: var(--sjs-general-backcolor, var(--background, #fff));
+  font-family: var(--sjs-font-family, var(--font-family, var(--sjs-default-font-family)));
+}
+
 .sv-ranking--select-to-rank {
   display: flex;
 }
@@ -3908,7 +3920,7 @@ textarea.sd-input:disabled:not(.sd-input--disabled) {
   box-shadow: var(--sjs-shadow-inner-reset, inset 0px 0px 0px 0px rgba(0, 0, 0, 0.15)), 0 0 0 2px var(--sjs-primary-backcolor, var(--primary, #19b394));
 }
 
-.sd-item--allowhover .sd-selectbase__label:hover .sd-item__decorator {
+.sd-item--allowhover:not(.sd-item--readonly) .sd-selectbase__label:hover .sd-item__decorator {
   background: var(--sjs-editorpanel-hovercolor, var(--sjs-general-backcolor-dim-dark, rgb(243, 243, 243)));
   outline: none;
 }
@@ -4442,6 +4454,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   position: relative;
   width: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
   height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  box-sizing: content-box;
 }
 .sd-rating__item-star:not(:first-of-type) {
   padding-left: calc(0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
@@ -4484,6 +4497,81 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   stroke: transparent;
   fill: var(--sjs-primary-backcolor, var(--primary, #19b394));
 }
+.sd-rating__item-star--selected:nth-child(1) svg {
+  transition-delay: 0ms;
+}
+.sd-rating__item-star--selected:nth-child(2) svg {
+  transition-delay: 25ms;
+}
+.sd-rating__item-star--selected:nth-child(3) svg {
+  transition-delay: 50ms;
+}
+.sd-rating__item-star--selected:nth-child(4) svg {
+  transition-delay: 75ms;
+}
+.sd-rating__item-star--selected:nth-child(5) svg {
+  transition-delay: 100ms;
+}
+.sd-rating__item-star--selected:nth-child(6) svg {
+  transition-delay: 125ms;
+}
+.sd-rating__item-star--selected:nth-child(7) svg {
+  transition-delay: 150ms;
+}
+.sd-rating__item-star--selected:nth-child(8) svg {
+  transition-delay: 175ms;
+}
+.sd-rating__item-star--selected:nth-child(9) svg {
+  transition-delay: 200ms;
+}
+.sd-rating__item-star--selected:nth-child(10) svg {
+  transition-delay: 225ms;
+}
+.sd-rating__item-star--selected:nth-child(11) svg {
+  transition-delay: 250ms;
+}
+.sd-rating__item-star--selected:nth-child(12) svg {
+  transition-delay: 275ms;
+}
+.sd-rating__item-star--selected:nth-child(13) svg {
+  transition-delay: 300ms;
+}
+.sd-rating__item-star--selected:nth-child(14) svg {
+  transition-delay: 325ms;
+}
+.sd-rating__item-star--selected:nth-child(15) svg {
+  transition-delay: 350ms;
+}
+.sd-rating__item-star--selected:nth-child(16) svg {
+  transition-delay: 375ms;
+}
+.sd-rating__item-star--selected:nth-child(17) svg {
+  transition-delay: 400ms;
+}
+.sd-rating__item-star--selected:nth-child(18) svg {
+  transition-delay: 425ms;
+}
+.sd-rating__item-star--selected:nth-child(19) svg {
+  transition-delay: 450ms;
+}
+.sd-rating__item-star--selected:nth-child(20) svg {
+  transition-delay: 475ms;
+}
+.sd-rating__item-star--selected:nth-child(21) svg {
+  transition-delay: 500ms;
+}
+.sd-rating__item-star--selected:nth-child(22) svg {
+  transition-delay: 525ms;
+}
+.sd-rating__item-star--selected:nth-child(23) svg {
+  transition-delay: 550ms;
+}
+.sd-rating__item-star--selected:nth-child(24) svg {
+  transition-delay: 575ms;
+}
+.sd-rating__item-star--selected:nth-child(25) svg {
+  transition-delay: 600ms;
+}
 
 .sd-rating__item-star--error svg {
   stroke: none;
@@ -5173,8 +5261,8 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   background: linear-gradient(0deg, var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1))), var(--sjs-special-red-light, var(--red-light, rgba(230, 10, 62, 0.1))));
 }
 
-.sd-imagepicker__item:focus-within .sd-imagepicker__image,
-.sd-imagepicker__item--allowhover .sd-imagepicker__image:hover {
+.sd-imagepicker__item:focus-within .sd-imagepicker__image .sd-imagepicker__image:hover,
+.sd-imagepicker__item--allowhover:not(.sd-imagepicker__item--readonly, .sd-imagepicker__item--preview) .sd-imagepicker__image:hover {
   opacity: 0.5;
 }
 
@@ -5437,12 +5525,12 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   line-height: var(--sjs-font-size, 16px);
   font-weight: 600;
 }
-@media only screen and (min-width: calc(125 * (var(--sjs-base-unit, var(--base-unit, 8px))))) {
+@media only screen and (min-width: 1000px) {
   .sd-progress__text {
     margin-left: 5%;
   }
 }
-@media only screen and (max-width: calc(125 * (var(--sjs-base-unit, var(--base-unit, 8px))))) {
+@media only screen and (max-width: 1000px) {
   .sd-progress__text {
     margin-left: 10px;
   }
@@ -5497,6 +5585,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   height: 100%;
   box-sizing: border-box;
   border-radius: calc(12.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  overflow: hidden;
 }
 
 .sd-boolean.sd-boolean--checked .sd-boolean__label--true,
@@ -5524,7 +5613,6 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   transition-timing-function: linear;
   color: var(--sjs-primary-backcolor, var(--primary, #19b394));
   font-weight: 600;
-  margin-left: 0%;
   z-index: 2;
 }
 .sd-boolean__thumb .sv-string-viewer.sv-string-viewer--multiline {
@@ -5538,9 +5626,6 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
 .sd-boolean--exchanged .sd-boolean__thumb {
   margin-left: calc(50% + 0.5 * (var(--sjs-base-unit, var(--base-unit, 8px))));
 }
-.sd-boolean--exchanged.sd-boolean--checked .sd-boolean__thumb {
-  margin-left: 0%;
-}
 .sd-boolean--exchanged.sd-boolean:not(.sd-boolean--checked):not(sd-boolean--indeterminate) .sd-boolean__label--false, .sd-boolean--exchanged.sd-boolean.sd-boolean--checked .sd-boolean__label--true {
   color: var(--sjs-font-editorfont-placeholdercolor, var(--sjs-general-forecolor-light, var(--foreground-light, #909090)));
 }
@@ -5888,11 +5973,12 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
     transform: translateX(0);
   }
 }
-.sd-paneldynamic__panel-wrapper--fade-in-left,
-.sd-paneldynamic__panel-wrapper--fade-in-right {
+.sd-paneldynamic__panel-wrapper--fade-in.sv-pd-animation-left,
+.sd-paneldynamic__panel-wrapper--fade-in.sv-pd-animation-right {
+  --sjs-pd-tab-animation-delay: 0ms;
   animation-name: movePanel, changeHeight, paddingFadeIn, fadeIn;
   animation-duration: var(--sjs-pd-tab-move-in-duration, 250ms), var(--sjs-pd-tab-height-change-duration, 250ms), var(--sjs-pd-tab-height-change-duration, 250ms), var(--sjs-pd-tab-fade-in-duration, 250ms);
-  animation-delay: var(--sjs-pd-tab-move-in-delay, 100ms), var(--sjs-pd-tab-height-change-delay, 0ms), var(--sjs-pd-tab-height-change-delay, 0ms), var(--sjs-pd-tab-fade-in-delay, 100ms);
+  animation-delay: calc(var(--sjs-pd-tab-move-in-delay, 100ms) + var(--sjs-pd-tab-animation-delay)), calc(var(--sjs-pd-tab-height-change-delay, 0ms) + var(--sjs-pd-tab-animation-delay)), calc(var(--sjs-pd-tab-height-change-delay, 0ms) + var(--sjs-pd-tab-animation-delay)), calc(var(--sjs-pd-tab-fade-in-delay, 100ms) + var(--sjs-pd-tab-animation-delay));
   animation-timing-function: cubic-bezier(0, 0, 0.58, 1);
   animation-fill-mode: forwards;
   opacity: 0;
@@ -5903,16 +5989,16 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   --animation-padding-bottom: calc(1 * var(--sd-base-padding));
 }
 
-.sd-paneldynamic__panel-wrapper--fade-in-left {
+.sd-paneldynamic__panel-wrapper--fade-in.sv-pd-animation-left {
   --sjs-pd-tab-move-margin: calc(1 * var(--sjs-pd-tab-move-in-margin, 50%));
 }
 
-.sd-paneldynamic__panel-wrapper--fade-in-right {
+.sd-paneldynamic__panel-wrapper--fade-in.sv-pd-animation-right {
   --sjs-pd-tab-move-margin: calc(-1 * var(--sjs-pd-tab-move-in-margin, 50%));
 }
 
-.sd-paneldynamic__panel-wrapper--fade-out-left,
-.sd-paneldynamic__panel-wrapper--fade-out-right {
+.sd-paneldynamic__panel-wrapper--fade-out.sv-pd-animation-left,
+.sd-paneldynamic__panel-wrapper--fade-out.sv-pd-animation-right {
   animation-name: fadeIn, movePanel;
   animation-duration: var(--sjs-pd-tab-fade-out-duration, 250ms), var(--sjs-pd-tab-move-out-duration, 250ms);
   animation-delay: var(--sjs-pd-tab-fade-out-delay, 0ms), var(--sjs-pd-tab-move-out-delay, 0ms);
@@ -5925,14 +6011,40 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   width: calc(100% - 2 * var(--sd-base-padding));
 }
 
-.sd-paneldynamic__panel-wrapper--fade-out-left {
+.sd-paneldynamic__panel-wrapper--fade-out.sv-pd-animation-left {
   --sjs-pd-tab-move-margin: calc(-1 * var(--sjs-pd-tab-move-out-margin, 50%));
 }
 
-.sd-paneldynamic__panel-wrapper--fade-out-right {
+.sd-paneldynamic__panel-wrapper--fade-out.sv-pd-animation-right {
   --sjs-pd-tab-move-margin: calc(1 * var(--sjs-pd-tab-move-out-margin, 50%));
 }
 
+.sd-paneldynamic__panel-wrapper--fade-in.sv-pd-animation-adding {
+  animation-name: fadeIn, changeHeight, paddingFadeIn;
+  animation-duration: var(--sjs-pd-tab-add-fade-in-duration, 500ms), var(--sjs-pd-tab-height-change-duration, 250ms), var(--sjs-pd-tab-height-change-duration, 250ms);
+  animation-delay: calc(var(--sjs-pd-tab-add-fade-in-delay, 250ms) + var(--sjs-pd-tab-animation-delay)), calc(var(--sjs-pd-tab-height-change-delay, 0ms) + var(--sjs-pd-tab-animation-delay)), calc(var(--sjs-pd-tab-height-change-delay, 0ms) + var(--sjs-pd-tab-animation-delay));
+  animation-timing-function: cubic-bezier(0, 0, 0.58, 1);
+  animation-fill-mode: forwards;
+  transform: translateX(0);
+}
+
+.sd-paneldynamic__panel-wrapper--fade-in.sv-pd-animation-removing {
+  --sjs-pd-tab-animation-delay: var(--sjs-pd-tab-remove-fade-in-delay, 150ms);
+}
+
+.sd-paneldynamic__panel-wrapper--fade-out.sv-pd-animation-removing {
+  animation-name: fadeIn;
+  animation-duration: var(--sjs-pd-tab-remove-fade-out-duration, 150ms);
+  animation-delay: var(--sjs-pd-tab-remove-fade-out-delay, 0ms);
+  animation-timing-function: cubic-bezier(0.42, 0, 1, 1);
+  animation-direction: reverse;
+  animation-fill-mode: forwards;
+  position: absolute;
+  left: var(--sd-base-padding);
+  top: 0;
+  width: calc(100% - 2 * var(--sd-base-padding));
+}
+
 .sd-paneldynamic__panel-wrapper--fade-in,
 .sd-paneldynamic__panel-wrapper--fade-out {
   animation-name: fadeIn, moveInWithOverflow, paddingFadeIn;
@@ -6159,7 +6271,7 @@ legend + sv-ng-rating-item + .sd-rating__item-smiley {
   min-width: 100%;
   max-width: 100%;
   overflow: hidden;
-  max-height: calc(6 * (var(--sjs-base-unit, var(--base-unit, 8px))));
+  max-height: calc(3 * (var(--sjs-font-size, 16px)));
   text-overflow: ellipsis;
   line-height: var(--sjs-font-size, 16px);
   display: -webkit-box;