Merge branch 'master' into feature/vue3

surveyjs · Dec 28, 2022 · 458abf5 · 458abf5
2 parents d0171d1 + 4e577d4
commit 458abf5
Show file tree

Hide file tree

Showing 14 changed files with 107 additions and 82 deletions.
diff --git a/build-scripts/survey-core/package.json b/build-scripts/survey-core/package.json
@@ -27,7 +27,13 @@
     "survey.core.js",
     "survey.core.min.js",
     "survey.i18n.js",
-    "survey.i18n.min.js"
+    "survey.i18n.min.js",
+    "bootstrap-integration.d.ts",
+    "bootstrap-integration.js",
+    "bootstrap-integration.min.js",
+    "bootstrap-material-integration.d.ts",
+    "bootstrap-material-integration.js",
+    "bootstrap-material-integration.min.js"
   ],
   "main": "survey.core.js",
   "repository": {

diff --git a/src/common-styles/common-styles.scss b/src/common-styles/common-styles.scss
@@ -0,0 +1,11 @@
+@import "./sv-actionbar.scss";
+@import "./sv-drag-drop.scss";
+@import "./sv-popup.scss";
+@import "./sv-buttongroup.scss";
+@import "./sv-visuallyhidden.scss";
+@import "./sv-hidden.scss";
+@import "./sv-titleactions.scss";
+@import "./window.scss";
+@import "./sv-brand-info.scss";
+@import "./sv-ranking.scss";
+@import "./sv-list.scss";
diff --git a/src/common-styles/sv-actionbar.scss b/src/common-styles/sv-actionbar.scss
@@ -6,7 +6,7 @@ $background-dim: var(--background-dim, #f3f3f3);
 
 $foreground: var(--foreground, #161616);
 $foreground-light: var(--foreground-light, #909090);
-
+$border: var(--border, #d6d6d6);
 $base-unit: var(--base-unit, 8px);
 
 @function calcSize($multiplier) {

diff --git a/src/common-styles/sv-drag-drop.scss b/src/common-styles/sv-drag-drop.scss
@@ -0,0 +1,48 @@
+$base-unit: var(--base-unit, 8px);
+$font-family: var(--font-family);
+$background: var(--background, #fff);
+$background-dim: var(--background-dim, #f3f3f3);
+$font-family: "Open Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
+
+@function calcSize($multiplier) {
+  $result: calc(#{$multiplier} * #{$base-unit});
+  @return $result;
+}
+
+.sv-dragged-element-shortcut {
+  height: calcSize(3);
+  min-width: calcSize(12.5);
+  border-radius: calcSize(4.5);
+  background-color: $background;
+  padding: calcSize(2);
+  cursor: grabbing;
+  position: absolute;
+  z-index: 1000;
+  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
+  font-family: var(--font-family, $font-family);
+  font-size: calcSize(2);
+  padding-left: calcSize(2.5);
+  line-height: calcSize(3);
+}
+
+.sv-matrixdynamic__drag-icon {
+  padding-top: calcSize(1.75);
+}
+.sv-matrixdynamic__drag-icon:after {
+  content: " ";
+  display: block;
+  height: calcSize(0.75);
+  width: calcSize(2.5);
+  border: 1px solid #e7e7e7;
+  box-sizing: border-box;
+  border-radius: calcSize(1.25);
+  cursor: move;
+  margin-top: calcSize(1.5);
+}
+
+.sv-matrix-row--drag-drop-ghost-mod td {
+  background-color: $background-dim;
+}
+.sv-matrix-row--drag-drop-ghost-mod td > * {
+  visibility: hidden;
+}
diff --git a/src/common-styles/sv-list.scss b/src/common-styles/sv-list.scss
@@ -63,6 +63,8 @@ $base-unit: var(--base-unit, 8px);
   padding-inline-end: calcSize(8);
   padding-inline-start: calcSize(2);
   color: $foreground;
+  font-size: calcSize(2);
+  line-height: calcSize(3);
   cursor: pointer;
   overflow: hidden;
   text-overflow: ellipsis;
@@ -83,19 +85,29 @@ $base-unit: var(--base-unit, 8px);
   .sv-list__item-body {
     padding-top: calcSize(1.5);
     padding-bottom: calcSize(1.5);
+    gap: calcSize(2);
+    display: flex;
   }
 }
 .sv-list__item-icon {
-  float: inline-start; // float: left;
+  float: left;
   width: calcSize(3);
   height: calcSize(3);
+
   svg {
     display: block;
   }
   use {
     fill: $foreground-light;
   }
-  margin-inline-end: calcSize(2); //margin-right: calcSize(2);
+}
+
+[dir="rtl"],
+[style*="direction:rtl"],
+[style*="direction: rtl"] {
+  .sv-list__item-icon {
+    float: right;
+  }
 }
 .sv-list__item-separator {
   margin: calcSize(1) 0;
@@ -138,7 +150,6 @@ li:focus .sv-list__item.sv-list__item--selected {
   height: 100%;
   flex-direction: column;
   display: flex;
-  flex-direction: column;
   min-height: 0;
 }
 
@@ -152,7 +163,7 @@ li:focus .sv-list__item.sv-list__item--selected {
   display: block;
   position: absolute;
   top: calcSize(1.5);
-  inset-block-start: calcSize(2); //left: calcSize(2);
+  inset-inline-start: calcSize(2); //left: calcSize(2);
   .sv-svg-icon {
     width: calcSize(3);
     height: calcSize(3);
@@ -173,8 +184,10 @@ li:focus .sv-list__item.sv-list__item--selected {
   outline: none;
   font-size: 1em;
   color: $foreground;
-  padding: calcSize(1.5) calcSize(3) calcSize(1.5) calcSize(7);
+  padding: calcSize(1.5) calcSize(3);
+  padding-inline-start: calcSize(7);
   line-height: calcSize(3);
+  border: none;
 }
 
 .sv-list__input::placeholder {

diff --git a/src/common-styles/sv-popup.scss b/src/common-styles/sv-popup.scss
@@ -223,19 +223,18 @@ sv-popup {
   line-height: calcSize(3);
   text-align: center;
   color: $primary;
-
   border: none;
-  &:hover {
-    box-shadow: 0 0 0 2px $primary;
-  }
   outline: none;
 }
+.sv-popup__button:hover {
+  box-shadow: 0 0 0 2px $primary;
+}
 .sv-popup__button:disabled {
   color: $foreground-disabled;
   cursor: default;
-  &:hover {
-    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
-  }
+}
+.sv-popup__button:disabled:hover {
+  box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.15);
 }
 .sv-popup__button--apply {
   background-color: $primary;

diff --git a/src/default-styles.scss b/src/default-styles.scss
@@ -651,46 +651,6 @@ f-panel {
 }
 // EO ranking
 
-// drag drop
-.sv-dragged-element-shortcut {
-  height: 24px;
-  min-width: 100px;
-  border-radius: 36px;
-  background-color: white;
-  padding: 16px;
-  cursor: grabbing;
-  position: absolute;
-  z-index: 1000;
-  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.1);
-  font-family: "Open Sans";
-  font-size: 16px;
-  padding-left: 20px;
-  line-height: 24px;
-}
-
-.sv-matrixdynamic__drag-icon {
-  padding-top: 14px;
-}
-.sv-matrixdynamic__drag-icon:after {
-  content: " ";
-  display: block;
-  height: 6px;
-  width: 20px;
-  border: 1px solid #e7e7e7;
-  box-sizing: border-box;
-  border-radius: 10px;
-  cursor: move;
-  margin-top: 12px;
-}
-
-.sv-matrix-row--drag-drop-ghost-mod td {
-  background-color: #f3f3f3;
-}
-.sv-matrix-row--drag-drop-ghost-mod td > * {
-  visibility: hidden;
-}
-//eo drag-drop
-
 .sv_qstn .sv_q_select_column {
   display: inline-block;
   vertical-align: top;
@@ -1322,12 +1282,13 @@ sv-popup {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
+  display: flex;
+  gap: calc(2 * 8px);
 }
 .sv-list__item-icon {
   float: left;
   width: calc(3 * 8px);
   height: calc(3 * 8px);
-  margin-right: calc(2 * 8px);
 }
 .sv-list__item-icon svg {
   display: block;

diff --git a/src/defaultV2-theme/blocks/sd-list.scss b/src/defaultV2-theme/blocks/sd-list.scss
@@ -1,5 +1,3 @@
-@import "../../common-styles/sv-list.scss";
-
 .sd-list {
   padding-right: calcSize(0.5);
   padding-left: calcSize(0.5);

diff --git a/src/defaultV2-theme/defaultV2.fontless.scss b/src/defaultV2-theme/defaultV2.fontless.scss
@@ -1,4 +1,5 @@
 @import "./variables.scss";
+@import "../common-styles/common-styles.scss";
 
 @import "blocks/sd-element.scss";
 @import "blocks/sd-question.scss";
@@ -43,17 +44,8 @@
 @import "blocks/sd-progress-buttons.scss";
 @import "blocks/sd-list.scss";
 @import "blocks/sd-timer.scss";
-@import "../common-styles/sv-actionbar.scss";
-@import "../common-styles/sv-popup.scss";
-@import "../common-styles/sv-buttongroup.scss";
-@import "../common-styles/sv-visuallyhidden.scss";
-@import "../common-styles/sv-hidden.scss";
-@import "../common-styles/sv-titleactions.scss";
-@import "../common-styles/window.scss";
 @import "../signaturepad.scss";
 @import "./defaultV2.m600.scss";
-@import "../common-styles/sv-brand-info.scss";
-@import "../common-styles/sv-ranking.scss";
 
 body {
   --sv-defaultV2-mark: true;

diff --git a/src/main.scss b/src/main.scss
@@ -6,6 +6,7 @@
 
 @import "./common-styles/window.scss";
 @import "./common-styles/sv-brand-info.scss";
+@import "./common-styles/sv-drag-drop.scss";
 
 $header-background-color: #e7e7e7;
 $body-container-background-color: #f4f4f4;

diff --git a/src/modern.fontless.scss b/src/modern.fontless.scss
@@ -35,20 +35,9 @@
 @import "./modern/blocks/sv-completedpage.scss";
 @import "./modern/blocks/sv-header.scss";
 @import "./modern/blocks/sv-signaturepad.scss";
-@import "./common-styles/sv-list.scss";
-@import "./common-styles/sv-buttongroup.scss";
-@import "./common-styles/sv-visuallyhidden.scss";
-@import "./common-styles/sv-hidden.scss";
-@import "./common-styles/sv-ranking.scss";
-
+@import "./common-styles/common-styles.scss";
 @import "./signaturepad.scss";
-
-@import "./common-styles/window.scss";
-
 @import "./boolean-checkbox.scss";
-@import "./common-styles/sv-actionbar.scss";
-@import "./common-styles/sv-titleactions.scss";
-@import "./common-styles/sv-brand-info.scss";
 
 //@import "./main.rtl.scss";
 @import "./modern.m600.scss";

diff --git a/src/plugins/themes/common-theme-settings.ts b/src/plugins/themes/common-theme-settings.ts
@@ -421,8 +421,8 @@ export function setStyles(): void {
     ".sv-list": "padding: 0; margin: 0; background: var(--background, #fff); list-style-type: none; overflow-y: auto;",
     ".sv-list__item--with-icon": "padding-top: 12px; padding-bottom: 12px;",
     ".sv-list__item": "width: 100%; box-sizing: border-box; cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;",
-    ".sv-list__item-body": "width: 100%; box-sizing: border-box; font-size: calc(2 * var(--base-unit, 8px)); line-height: calc(3 * var(--base-unit, 8px)); padding-top: calc(1 * var(--base-unit, 8px)); padding-bottom: calc(1 * var(--base-unit, 8px)); padding-inline-end: calc(8 * var(--base-unit, 8px)); padding-inline-start: calc(2 * var(--base-unit, 8px)); cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;",
-    ".sv-list__item-icon": "float: left; width: calc(3 * 8px); height: calc(3 * 8px); margin-right: calc(2 * 8px);",
+    ".sv-list__item-body": "width: 100%; box-sizing: border-box; font-size: calc(2 * var(--base-unit, 8px)); line-height: calc(3 * var(--base-unit, 8px)); padding-top: calc(1 * var(--base-unit, 8px)); padding-bottom: calc(1 * var(--base-unit, 8px)); padding-inline-end: calc(8 * var(--base-unit, 8px)); padding-inline-start: calc(2 * var(--base-unit, 8px)); cursor: pointer; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: flex; gap: calc(2 * 8px);",
+    ".sv-list__item-icon": "float: left; width: calc(3 * 8px); height: calc(3 * 8px);",
     ".sv-list__item-icon svg": "display: block;",
     ".sv-list__item-icon use": "fill: #909090;",
     ".sv-list__item:hover .sv-list__item-body": "background-color: var(--background-dim, #f3f3f3);",

diff --git a/src/question.ts b/src/question.ts
@@ -1471,6 +1471,13 @@ export class Question extends SurveyElement<Question>
       ? 1
       : 0;
   }
+  /**
+  * Returns `true` if a question answer matches the `correctAnswer` property value.
+  *
+  * [View Demo](https://surveyjs.io/form-library/examples/create-a-scored-quiz (linkStyle))
+  * @see correctAnswer
+  * @see SurveyModel.getQuizQuestions
+  */
   public isAnswerCorrect(): boolean {
     return this.correctAnswerCount == this.quizQuestionCount;
   }
@@ -1654,7 +1661,7 @@ export class Question extends SurveyElement<Question>
     return json;
   }
   /**
-   * Returns true if there is a validation error(s) in the question.
+   * Returns `true` if there is a validation error(s) in the question.
    * @param fireCallback set it to true to show an error in UI.
    */
   public hasErrors(fireCallback: boolean = true, rec: any = null): boolean {

diff --git a/src/stylesmanager.ts b/src/stylesmanager.ts
@@ -276,7 +276,7 @@ export class StylesManager {
 
   static getAvailableThemes(): Array<any> {
     const themeMapper = (surveyCss.getAvailableThemes() as Array<string>)
-      .filter(themeName => ["defaultV2", "modern", "default"].indexOf(themeName) !== -1)
+      .filter(themeName => ["defaultV2", "default", "modern"].indexOf(themeName) !== -1)
       .map(themeName => { return { name: themeName, theme: surveyCss[themeName] }; });
     return themeMapper;
   }