devextreme-themebuilder 21.2.7 → 22.1.2-beta

package/data/scss/widgets/material/htmlEditor/_index.scss

@@ -10,6 +10,7 @@
 @use "../textEditor/colors" as *;
 @use "../toolbar/sizes" as *;
 @use "../common/mixins" as *;
+@use "../fileUploader/sizes" as *;
 @use "../../base/htmlEditor";
 
 // adduse
@@ -349,6 +350,50 @@
   }
 }
 
+.dx-htmleditor-add-image-popup > .dx-overlay-content > .dx-popup-content {
+  .dx-collection .dx-field-item:not(.dx-last-col) {
+    padding-right: $material-html-editor-add-image-dialog-base-padding;
+  }
+
+  .dx-fix-ratio-container {
+    .dx-textbox {
+      width: calc(100% - $material-button-height - $material-html-editor-add-image-dialog-base-padding);
+    }
+
+    .dx-buttongroup {
+      margin-left: $material-html-editor-add-image-dialog-base-padding;
+      width: $material-button-height;
+      margin-top: math.div($material-base-inline-widget-height - $material-button-height, 2);
+    }
+  }
+
+  .dx-collection .dx-field-item:not(.dx-first-col) {
+    padding-left: 0;
+  }
+
+  .dx-fileuploader-input-wrapper {
+    padding: $material-html-editor-add-image-dialog-fileuploader-padding;
+    border: 3px dashed $base-border-color;
+
+    .dx-fileuploader-input-label {
+      border-width: 0;
+    }
+  }
+}
+
+.dx-htmleditor-add-image-popup {
+  .dx-fileuploader-dragover {
+    .dx-fileuploader-input {
+      padding-top: $material-fileuploader-vertical-padding;
+      padding-bottom: $material-fileuploader-vertical-padding + 1px;
+    }
+
+    .dx-fileuploader-content {
+      background-color: color.change($htmleditor-border-color, $alpha: 0.8);
+    }
+  }
+}
+
 .dx-mention {
   background-color: $htmleditor-mention-bg;
 }

package/data/scss/widgets/material/htmlEditor/_sizes.scss

@@ -6,13 +6,16 @@
 $material-toolbar-size-editor-width: null !default;
 $material-html-editor-horizontal-padding: 15px !default;
 $material-htmleditor-toolbar-padding: null !default;
+$material-html-editor-add-image-dialog-fileuploader-padding: null !default;
 
 @if $size == "default" {
   $material-toolbar-size-editor-width: 120px !default;
   $material-htmleditor-toolbar-padding: 16px !default;
+  $material-html-editor-add-image-dialog-fileuploader-padding: 50px 40px;
 }
 
 @else if $size == "compact" {
   $material-toolbar-size-editor-width: 90px !default;
   $material-htmleditor-toolbar-padding: 11px !default;
+  $material-html-editor-add-image-dialog-fileuploader-padding: 40px 30px;
 }

package/data/scss/widgets/material/pager/_index.scss

@@ -23,6 +23,10 @@
     }
 
     .dx-pages {
+      .dx-page-indexes {
+        vertical-align: middle;
+      }
+
       .dx-navigate-button,
       .dx-light-pages {
         vertical-align: middle;
@@ -73,6 +77,11 @@
   }
 
   .dx-page-sizes .dx-page-size {
+    &:first-child,
+    &.dx-first-child {
+      margin-left: 0;
+    }
+
     padding: $material-pager-page-padding;
     line-height: $material-pager-page-line-height;
   }
@@ -85,8 +94,4 @@
       color: $pager-page-selected-color;
     }
   }
-
-  .dx-page-sizes .dx-page-size:first-child {
-    margin-left: 0;
-  }
 }

package/data/scss/widgets/material/toolbar/_index.scss

@@ -73,6 +73,20 @@
       padding: 0;
     }
 
+    .dx-button-mode-contained {
+      &.dx-button-default {
+        @include dx-button-flat-color-styling($button-default-bg, transparent, transparent, transparent);
+      }
+
+      &.dx-button-danger {
+        @include dx-button-flat-color-styling($button-danger-bg, transparent, transparent, transparent);
+      }
+
+      &.dx-button-success {
+        @include dx-button-flat-color-styling($button-success-bg, transparent, transparent, transparent);
+      }
+    }
+
     .dx-button {
       height: $material-list-item-height;
       padding: 0;

package/data/scss/widgets/material/validation/_index.scss

@@ -8,8 +8,6 @@
 
 // adduse
 @use "../overlay";
-
-
 @include dx-base-validation($validation-summary-color, $validation-message-color, $validation-message-background-color);
 
 .dx-invalid-message > .dx-overlay-content {

package/modules/bootstrap-extractor.js

@@ -76,7 +76,7 @@ class BootstrapExtractor {
     }
     readSassFile(fileName) {
         return __awaiter(this, void 0, void 0, function* () {
-            const path = require.resolve(`bootstrap-v${this.version}/scss/${fileName}`);
+            const path = require.resolve(`bootstrap${this.version}/scss/${fileName}`);
             return fs_1.promises.readFile(path, 'utf8');
         });
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "devextreme-themebuilder",
-  "version": "21.2.7",
+  "version": "22.1.2-beta",
   "description": "DevExtreme ThemeBuilder",
   "keywords": [
     "devextreme",
@@ -14,8 +14,8 @@
   "license": "SEE LICENSE IN README.md",
   "dependencies": {
     "autoprefixer": "^10.2.4",
-    "bootstrap-v4": "npm:bootstrap@^4.6.0",
-    "bootstrap-v5": "npm:bootstrap@^5.0.2",
+    "bootstrap4": "npm:bootstrap@^4.6.0",
+    "bootstrap5": "npm:bootstrap@^5.0.2",
     "clean-css": "^5.1.0",
     "less": "^3.13.1",
     "postcss": "^8.2.6",
@@ -43,7 +43,7 @@
     "filing-cabinet": "^2.6.0",
     "fs-extra": "^9.0.0",
     "jest": "^26.6.1",
-    "precinct": "^6.3.1",
+    "precinct": "^8.3.1",
     "sinon": "^9.2.4",
     "ts-jest": "^26.5.2",
     "ts-node": "^8.10.1",