@syncfusion/ej2-image-editor 32.1.19 → 32.1.24

package/styles/image-editor/_bigger.tailwind-dark.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './theme-variables.tailwind-dark';
+@import './_bigger';

package/styles/image-editor/_bigger.tailwind.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './theme-variables.tailwind';
+@import './_bigger';

package/styles/image-editor/_bigger.tailwind3.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './theme-variables.tailwind3';
+@import './_bigger';

package/styles/image-editor/_layout.bds.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.bds';
+@import './_layout';

package/styles/image-editor/_layout.bootstrap-dark.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.bootstrap-dark';
+@import './_layout';

package/styles/image-editor/_layout.bootstrap.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.bootstrap';
+@import './_layout';

package/styles/image-editor/_layout.bootstrap4.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.bootstrap4';
+@import './_layout';

package/styles/image-editor/_layout.bootstrap5-dark.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.bootstrap5-dark';
+@import './_layout';

package/styles/image-editor/_layout.bootstrap5.3.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.bootstrap5.3';
+@import './_layout';

package/styles/image-editor/_layout.bootstrap5.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.bootstrap5';
+@import './_layout';

package/styles/image-editor/_layout.fabric-dark.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.fabric-dark';
+@import './_layout';

package/styles/image-editor/_layout.fabric.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.fabric';
+@import './_layout';

package/styles/image-editor/_layout.fluent-dark.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.fluent-dark';
+@import './_layout';

package/styles/image-editor/_layout.fluent.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.fluent';
+@import './_layout';

package/styles/image-editor/_layout.fluent2.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.fluent2';
+@import './_layout';

package/styles/image-editor/_layout.highcontrast-light.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.highcontrast-light';
+@import './_layout';

package/styles/image-editor/_layout.highcontrast.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.highcontrast';
+@import './_layout';

package/styles/image-editor/_layout.material-dark.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.material-dark';
+@import './_layout';

package/styles/image-editor/_layout.material.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.material';
+@import './_layout';

package/styles/image-editor/_layout.material3-dark.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.material3-dark';
+@import './_layout';

package/styles/image-editor/_layout.material3.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.material3';
+@import './_layout';

package/styles/image-editor/_layout.scss

@@ -1,5 +1,4 @@
 @use 'ej2-base/styles/common/mixin' as *;
-@use './theme-variables' as *;
 @include export-module('image-editor-layout') {
   .e-ie-toolbar-upload-div.e-hide,
   .e-ie-toolbar-upload-btn.e-hide,

package/styles/image-editor/_layout.tailwind-dark.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.tailwind-dark';
+@import './_layout';

package/styles/image-editor/_layout.tailwind.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.tailwind';
+@import './_layout';

package/styles/image-editor/_layout.tailwind3.scss

@@ -0,0 +1,3 @@
+@use 'ej2-base/styles/common/mixin' as *;
+@import './_theme-variables.tailwind3';
+@import './_layout';

package/styles/image-editor/_theme-variables.bds.scss

@@ -0,0 +1 @@
+@forward './_bds-definition';

package/styles/image-editor/_theme-variables.bootstrap-dark.scss

@@ -0,0 +1 @@
+@forward './_bootstrap-dark-definition';

package/styles/image-editor/_theme-variables.bootstrap.scss

@@ -0,0 +1 @@
+@forward './_bootstrap-definition';

package/styles/image-editor/_theme-variables.bootstrap4.scss

@@ -0,0 +1 @@
+@forward './_bootstrap4-definition';

package/styles/image-editor/_theme-variables.bootstrap5-dark.scss

@@ -0,0 +1 @@
+@forward './_bootstrap5-dark-definition';

package/styles/image-editor/_theme-variables.bootstrap5.3.scss

@@ -0,0 +1 @@
+@forward './_bootstrap5.3-definition';

package/styles/image-editor/_theme-variables.bootstrap5.scss

@@ -0,0 +1 @@
+@forward './_bootstrap5-definition';

package/styles/image-editor/_theme-variables.fabric-dark.scss

@@ -0,0 +1 @@
+@forward './_fabric-dark-definition';

package/styles/image-editor/_theme-variables.fabric.scss

@@ -0,0 +1 @@
+@forward './_fabric-definition';

package/styles/image-editor/_theme-variables.fluent-dark.scss

@@ -0,0 +1 @@
+@forward './_fluent-dark-definition';

package/styles/image-editor/_theme-variables.fluent.scss

@@ -0,0 +1 @@
+@forward './_fluent-definition';

package/styles/image-editor/_theme-variables.fluent2.scss

@@ -0,0 +1 @@
+@forward './_fluent2-definition';

package/styles/image-editor/_theme-variables.highcontrast-light.scss

@@ -0,0 +1 @@
+@forward './_highcontrast-light-definition';

package/styles/image-editor/_theme-variables.highcontrast.scss

@@ -0,0 +1 @@
+@forward './_highcontrast-definition';

package/styles/image-editor/_theme-variables.material-dark.scss

@@ -0,0 +1 @@
+@forward './_material-dark-definition';

package/styles/image-editor/_theme-variables.material.scss

@@ -0,0 +1 @@
+@forward './_material-definition';

package/styles/image-editor/_theme-variables.material3-dark.scss

@@ -0,0 +1 @@
+@forward './_material3-dark-definition';

package/styles/image-editor/_theme-variables.material3.scss

@@ -0,0 +1 @@
+@forward './_material3-definition';

package/styles/image-editor/_theme-variables.tailwind-dark.scss

@@ -0,0 +1 @@
+@forward './_tailwind-dark-definition';

package/styles/image-editor/_theme-variables.tailwind.scss

@@ -0,0 +1 @@
+@forward './_tailwind-definition';

package/styles/image-editor/_theme.bds.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.bds';
+@import 'ej2-navigations/styles/toolbar/theme-variables.bds';
+@import './theme-variables.bds';
+@import './_theme';

package/styles/image-editor/_theme.bootstrap-dark.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.bootstrap-dark';
+@import 'ej2-navigations/styles/toolbar/theme-variables.bootstrap-dark';
+@import './theme-variables.bootstrap-dark';
+@import './_theme';

package/styles/image-editor/_theme.bootstrap.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.bootstrap';
+@import 'ej2-navigations/styles/toolbar/theme-variables.bootstrap';
+@import './theme-variables.bootstrap';
+@import './_theme';

package/styles/image-editor/_theme.bootstrap4.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.bootstrap4';
+@import 'ej2-navigations/styles/toolbar/theme-variables.bootstrap4';
+@import './theme-variables.bootstrap4';
+@import './_theme';

package/styles/image-editor/_theme.bootstrap5-dark.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.bootstrap5-dark';
+@import 'ej2-navigations/styles/toolbar/theme-variables.bootstrap5-dark';
+@import './theme-variables.bootstrap5-dark';
+@import './_theme';

package/styles/image-editor/_theme.bootstrap5.3.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.bootstrap5.3';
+@import 'ej2-navigations/styles/toolbar/theme-variables.bootstrap5.3';
+@import './theme-variables.bootstrap5.3';
+@import './_theme';

package/styles/image-editor/_theme.bootstrap5.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.bootstrap5';
+@import 'ej2-navigations/styles/toolbar/theme-variables.bootstrap5';
+@import './theme-variables.bootstrap5';
+@import './_theme';

package/styles/image-editor/_theme.fabric-dark.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.fabric-dark';
+@import 'ej2-navigations/styles/toolbar/theme-variables.fabric-dark';
+@import './theme-variables.fabric-dark';
+@import './_theme';

package/styles/image-editor/_theme.fabric.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.fabric';
+@import 'ej2-navigations/styles/toolbar/theme-variables.fabric';
+@import './theme-variables.fabric';
+@import './_theme';

package/styles/image-editor/_theme.fluent-dark.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.fluent-dark';
+@import 'ej2-navigations/styles/toolbar/theme-variables.fluent-dark';
+@import './theme-variables.fluent-dark';
+@import './_theme';

package/styles/image-editor/_theme.fluent.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.fluent';
+@import 'ej2-navigations/styles/toolbar/theme-variables.fluent';
+@import './theme-variables.fluent';
+@import './_theme';

package/styles/image-editor/_theme.fluent2.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.fluent2';
+@import 'ej2-navigations/styles/toolbar/theme-variables.fluent2';
+@import './theme-variables.fluent2';
+@import './_theme';

package/styles/image-editor/_theme.highcontrast-light.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.highcontrast-light';
+@import 'ej2-navigations/styles/toolbar/theme-variables.highcontrast-light';
+@import './theme-variables.highcontrast-light';
+@import './_theme';

package/styles/image-editor/_theme.highcontrast.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.highcontrast';
+@import 'ej2-navigations/styles/toolbar/theme-variables.highcontrast';
+@import './theme-variables.highcontrast';
+@import './_theme';

package/styles/image-editor/_theme.material-dark.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.material-dark';
+@import 'ej2-navigations/styles/toolbar/theme-variables.material-dark';
+@import './theme-variables.material-dark';
+@import './_theme';

package/styles/image-editor/_theme.material.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.material';
+@import 'ej2-navigations/styles/toolbar/theme-variables.material';
+@import './theme-variables.material';
+@import './_theme';

package/styles/image-editor/_theme.material3-dark.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.material3-dark';
+@import 'ej2-navigations/styles/toolbar/theme-variables.material3-dark';
+@import './theme-variables.material3-dark';
+@import './_theme';

package/styles/image-editor/_theme.material3.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.material3';
+@import 'ej2-navigations/styles/toolbar/theme-variables.material3';
+@import './theme-variables.material3';
+@import './_theme';

package/styles/image-editor/_theme.scss

@@ -1,8 +1,5 @@
 @use 'sass:color';
 @use 'ej2-base/styles/common/mixin' as *;
-@use './theme-variables' as *;
-@use 'ej2-buttons/styles/button/theme-variables' as button-vars;
-@use 'ej2-navigations/styles/toolbar/theme-variables' as tbar-vars;
 @include export-module('image-editor-theme') {
   .e-image-editor {
     background: $image-editor-background;
@@ -14,12 +11,12 @@
       & .e-toolbar-item.e-selected .filterwrapper canvas,
       & .e-toolbar-item:hover .filter-wrapper canvas,
       & .e-toolbar-item.e-selected .filter-wrapper canvas {
-        border-color: button-vars.$btn-active-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+        border-color: $btn-active-bgcolor !important; /* stylelint-disable-line declaration-no-important */
       }
 
       & .e-toolbar-item.e-selected .filterwrapper:focus canvas,
       & .e-toolbar-item.e-selected .filter-wrapper:focus canvas {
-        border-color: button-vars.$btn-active-bgcolor !important; /* stylelint-disable-line declaration-no-important */
+        border-color: $btn-active-bgcolor !important; /* stylelint-disable-line declaration-no-important */
       }
     }
 
@@ -60,8 +57,8 @@
           border: none;
           margin-top: $image-editor-ddbtn-margin-top;
           @if $skin-name == 'bootstrap4' or $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' or $skin-name == 'bootstrap5-dark' {
-            background: tbar-vars.$tbar-default-bg;
-            color: tbar-vars.$tbar-default-icon-color;
+            background: $tbar-default-bg;
+            color: $tbar-default-icon-color;
           }
           @if $skin-name == 'highcontrast' or $skin-name == 'highcontrast-light' {
             border: 2px solid #000;
@@ -75,20 +72,20 @@
           }
 
           &:hover {
-            background: tbar-vars.$tbar-hover-bg;
+            background: $tbar-hover-bg;
             box-shadow: none;
             @if $skin-name == 'bootstrap5' or $skin-name == 'bootstrap5.3' {
               color: $secondary-text-color;
             }
             @else {
-              color: tbar-vars.$tbar-hover-font;
+              color: $tbar-hover-font;
             }
           }
 
           &:focus {
-            background: button-vars.$btn-focus-bgcolor;
+            background: $btn-focus-bgcolor;
             box-shadow: none;
-            color: button-vars.$btn-focus-color;
+            color: $btn-focus-color;
             @if $skin-name == 'FluentUI' {
               outline: none !important; /* stylelint-disable-line declaration-no-important */
               box-shadow: inset 0 0 0 1px !important; /* stylelint-disable-line declaration-no-important */
@@ -122,9 +119,9 @@
           }
 
           &:active {
-            background: button-vars.$btn-active-bgcolor;
+            background: $btn-active-bgcolor;
             box-shadow: none;
-            color: button-vars.$btn-active-color;
+            color: $btn-active-color;
           }
         }
 

package/styles/image-editor/_theme.tailwind-dark.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.tailwind-dark';
+@import 'ej2-navigations/styles/toolbar/theme-variables.tailwind-dark';
+@import './theme-variables.tailwind-dark';
+@import './_theme';

package/styles/image-editor/_theme.tailwind.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.tailwind';
+@import 'ej2-navigations/styles/toolbar/theme-variables.tailwind';
+@import './theme-variables.tailwind';
+@import './_theme';

package/styles/image-editor/_theme.tailwind3.scss

@@ -0,0 +1,6 @@
+@use 'sass:color';
+@use 'ej2-base/styles/common/mixin' as *;
+@import 'ej2-buttons/styles/button/theme-variables.tailwind3';
+@import 'ej2-navigations/styles/toolbar/theme-variables.tailwind3';
+@import './theme-variables.tailwind3';
+@import './_theme';

package/styles/image-editor/bds.css

@@ -299,6 +299,10 @@
   content: "\e931";
 }
 
+
+
+
+
 .e-ie-toolbar-upload-div.e-hide,
 .e-ie-toolbar-upload-btn.e-hide,
 .e-ie-img-quality-slider,
@@ -807,6 +811,77 @@
   top: calc(50% - 16px) !important; /* stylelint-disable-line declaration-no-important */
 }
 
+
+
+
+
+/* stylelint-disable */
+.e-btn.e-primary:focus {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px var(--color-sf-brand-solid-shadow) !important;
+          box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px var(--color-sf-brand-solid-shadow) !important;
+}
+
+.e-btn.e-success:focus {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(23, 177, 105, 0.24) !important;
+          box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(23, 177, 105, 0.24) !important;
+}
+
+.e-btn.e-info:focus {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px var(--color-sf-brand-solid-shadow) !important;
+          box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px var(--color-sf-brand-solid-shadow) !important;
+}
+
+.e-btn.e-warning:focus {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(247, 143, 8, 0.24) !important;
+          box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(247, 143, 8, 0.24) !important;
+}
+
+.e-btn.e-danger:focus {
+  -webkit-box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(240, 68, 55, 0.24) !important;
+          box-shadow: 0 1px 2px 0 rgba(16, 24, 40, 0.05), 0 0 0 4px rgba(240, 68, 55, 0.24) !important;
+}
+
+.e-btn.e-outline.e-info {
+  background: transparent !important;
+  border-color: var(--color-sf-utility-info-border-color) !important;
+  color: var(--color-sf-utility-info-text) !important;
+}
+
+.e-btn.e-outline.e-info:hover {
+  background: var(--color-sf-utility-info-bg-color-hover) !important;
+  border-color: var(--color-sf-utility-info-border-color) !important;
+  color: var(--color-sf-utility-info-text-hover) !important;
+}
+
+.e-btn.e-outline.e-info:active {
+  background: var(--color-sf-utility-info-bg-color-pressed) !important;
+  border-color: var(--color-sf-utility-info-border-color) !important;
+  color: var(--color-sf-utility-info-text-hover) !important;
+}
+
+.e-btn.e-flat.e-info {
+  color: var(--color-sf-utility-info-text) !important;
+}
+
+.e-bigger .e-btn,
+.e-bigger .e-btn,
+.e-bigger .e-css.e-btn,
+.e-bigger.e-css.e-btn {
+  font-size: 14px;
+  line-height: 1.572em;
+  padding: 8px 15px;
+  border-radius: 8px !important;
+  font-weight: 600;
+}
+
+
+
+
+
+
+
+
+
 .e-image-editor {
   background: var(--color-sf-border-secondary);
 }
@@ -882,6 +957,10 @@
   border-color: #fcfcfd !important; /* stylelint-disable-line declaration-no-important */
 }
 
+
+
+
+
 .e-bigger .e-image-editor .e-contextual-toolbar-wrapper .e-slider-container .e-slider .e-handle,
 .e-image-editor.e-bigger .e-contextual-toolbar-wrapper .e-slider-container .e-slider .e-handle {
   top: calc(50% - 9px) !important; /* stylelint-disable-line declaration-no-important */

package/styles/image-editor/bds.scss

@@ -10,5 +10,5 @@
 @use 'ej2-popups/styles/spinner/bds-definition' as *;
 @use 'bds-definition' as *;
 @use 'icons/bds' as *;
-@use 'all' as *;
-@use 'bigger' as *;
+@use 'all.bds' as *;
+@use 'bigger.bds' as *;

package/styles/image-editor/bootstrap-dark.scss

@@ -10,5 +10,5 @@
 @use 'ej2-popups/styles/spinner/bootstrap-dark-definition' as *;
 @use 'bootstrap-dark-definition' as *;
 @use 'icons/bootstrap-dark' as *;
-@use 'all' as *;
-@use 'bigger' as *;
+@use 'all.bootstrap-dark' as *;
+@use 'bigger.bootstrap-dark' as *;

package/styles/image-editor/bootstrap.scss

@@ -10,5 +10,5 @@
 @use 'ej2-popups/styles/spinner/bootstrap-definition' as *;
 @use 'bootstrap-definition' as *;
 @use 'icons/bootstrap' as *;
-@use 'all' as *;
-@use 'bigger' as *;
+@use 'all.bootstrap' as *;
+@use 'bigger.bootstrap' as *;

package/styles/image-editor/bootstrap4.scss

@@ -10,5 +10,5 @@
 @use 'ej2-popups/styles/spinner/bootstrap4-definition' as *;
 @use 'bootstrap4-definition' as *;
 @use 'icons/bootstrap4' as *;
-@use 'all' as *;
-@use 'bigger' as *;
+@use 'all.bootstrap4' as *;
+@use 'bigger.bootstrap4' as *;

package/styles/image-editor/bootstrap5-dark.css

@@ -700,6 +700,7 @@
   top: calc(50% - 16px) !important; /* stylelint-disable-line declaration-no-important */
 }
 
+/* stylelint-disable */
 .e-image-editor {
   background: rgb(68.0034482759, 75.85, 83.6965517241);
 }

package/styles/image-editor/bootstrap5-dark.scss

@@ -10,5 +10,5 @@
 @use 'ej2-popups/styles/spinner/bootstrap5-dark-definition' as *;
 @use 'bootstrap5-dark-definition' as *;
 @use 'icons/bootstrap5-dark' as *;
-@use 'all' as *;
-@use 'bigger' as *;
+@use 'all.bootstrap5-dark' as *;
+@use 'bigger.bootstrap5-dark' as *;