@syncfusion/ej2-image-editor 28.1.33 → 28.1.41

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (79) hide show
  1. package/README.md +1 -1
  2. package/dist/ej2-image-editor.umd.min.js +2 -2
  3. package/dist/ej2-image-editor.umd.min.js.map +1 -1
  4. package/dist/es6/ej2-image-editor.es2015.js +9 -4
  5. package/dist/es6/ej2-image-editor.es2015.js.map +1 -1
  6. package/dist/es6/ej2-image-editor.es5.js +9 -4
  7. package/dist/es6/ej2-image-editor.es5.js.map +1 -1
  8. package/dist/global/ej2-image-editor.min.js +2 -2
  9. package/dist/global/ej2-image-editor.min.js.map +1 -1
  10. package/dist/global/index.d.ts +1 -1
  11. package/package.json +11 -11
  12. package/src/image-editor/action/draw.js +4 -2
  13. package/src/image-editor/base/image-editor.js +1 -1
  14. package/src/image-editor/renderer/toolbar.js +4 -1
  15. package/styles/bds-lite.css +4 -0
  16. package/styles/bds.css +4 -0
  17. package/styles/bootstrap-dark-lite.css +4 -0
  18. package/styles/bootstrap-dark.css +4 -0
  19. package/styles/bootstrap-lite.css +4 -0
  20. package/styles/bootstrap.css +4 -0
  21. package/styles/bootstrap4-lite.css +4 -0
  22. package/styles/bootstrap4.css +4 -0
  23. package/styles/bootstrap5-dark-lite.css +4 -0
  24. package/styles/bootstrap5-dark.css +4 -0
  25. package/styles/bootstrap5-lite.css +4 -0
  26. package/styles/bootstrap5.3-lite.css +4 -0
  27. package/styles/bootstrap5.3.css +4 -0
  28. package/styles/bootstrap5.css +4 -0
  29. package/styles/fabric-dark-lite.css +4 -0
  30. package/styles/fabric-dark.css +4 -0
  31. package/styles/fabric-lite.css +4 -0
  32. package/styles/fabric.css +4 -0
  33. package/styles/fluent-dark-lite.css +4 -0
  34. package/styles/fluent-dark.css +4 -0
  35. package/styles/fluent-lite.css +4 -0
  36. package/styles/fluent.css +4 -0
  37. package/styles/fluent2-lite.css +4 -0
  38. package/styles/fluent2.css +4 -0
  39. package/styles/highcontrast-light-lite.css +4 -0
  40. package/styles/highcontrast-light.css +4 -0
  41. package/styles/highcontrast-lite.css +4 -0
  42. package/styles/highcontrast.css +4 -0
  43. package/styles/image-editor/_layout.scss +5 -1
  44. package/styles/image-editor/_tailwind3-definition.scss +5 -5
  45. package/styles/image-editor/bds.css +4 -0
  46. package/styles/image-editor/bootstrap-dark.css +4 -0
  47. package/styles/image-editor/bootstrap.css +4 -0
  48. package/styles/image-editor/bootstrap4.css +4 -0
  49. package/styles/image-editor/bootstrap5-dark.css +4 -0
  50. package/styles/image-editor/bootstrap5.3.css +4 -0
  51. package/styles/image-editor/bootstrap5.css +4 -0
  52. package/styles/image-editor/fabric-dark.css +4 -0
  53. package/styles/image-editor/fabric.css +4 -0
  54. package/styles/image-editor/fluent-dark.css +4 -0
  55. package/styles/image-editor/fluent.css +4 -0
  56. package/styles/image-editor/fluent2.css +4 -0
  57. package/styles/image-editor/highcontrast-light.css +4 -0
  58. package/styles/image-editor/highcontrast.css +4 -0
  59. package/styles/image-editor/material-dark.css +4 -0
  60. package/styles/image-editor/material.css +4 -0
  61. package/styles/image-editor/material3-dark.css +4 -0
  62. package/styles/image-editor/material3.css +4 -0
  63. package/styles/image-editor/tailwind-dark.css +4 -0
  64. package/styles/image-editor/tailwind.css +4 -0
  65. package/styles/image-editor/tailwind3.css +12 -8
  66. package/styles/material-dark-lite.css +4 -0
  67. package/styles/material-dark.css +4 -0
  68. package/styles/material-lite.css +4 -0
  69. package/styles/material.css +4 -0
  70. package/styles/material3-dark-lite.css +4 -0
  71. package/styles/material3-dark.css +4 -0
  72. package/styles/material3-lite.css +4 -0
  73. package/styles/material3.css +4 -0
  74. package/styles/tailwind-dark-lite.css +4 -0
  75. package/styles/tailwind-dark.css +4 -0
  76. package/styles/tailwind-lite.css +4 -0
  77. package/styles/tailwind.css +4 -0
  78. package/styles/tailwind3-lite.css +8 -4
  79. package/styles/tailwind3.css +12 -8
@@ -694,6 +694,10 @@
694
694
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
695
695
  }
696
696
 
697
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
698
+ top: calc(50% + 60px);
699
+ }
700
+
697
701
  .e-image-editor {
698
702
  background: #292929;
699
703
  }
@@ -696,6 +696,10 @@
696
696
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
697
697
  }
698
698
 
699
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
700
+ top: calc(50% + 60px);
701
+ }
702
+
699
703
  .e-image-editor {
700
704
  background: #eee;
701
705
  }
@@ -716,6 +716,10 @@
716
716
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
717
717
  }
718
718
 
719
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
720
+ top: calc(50% + 60px);
721
+ }
722
+
719
723
  .e-image-editor {
720
724
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.14)), to(rgba(var(--color-sf-primary), 0.14))), rgba(var(--color-sf-surface));
721
725
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.14), rgba(var(--color-sf-primary), 0.14)), rgba(var(--color-sf-surface));
@@ -718,6 +718,10 @@
718
718
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
719
719
  }
720
720
 
721
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
722
+ top: calc(50% + 60px);
723
+ }
724
+
721
725
  .e-image-editor {
722
726
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.14)), to(rgba(var(--color-sf-primary), 0.14))), rgba(var(--color-sf-surface));
723
727
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.14), rgba(var(--color-sf-primary), 0.14)), rgba(var(--color-sf-surface));
@@ -676,6 +676,10 @@
676
676
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
677
677
  }
678
678
 
679
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
680
+ top: calc(50% + 60px);
681
+ }
682
+
679
683
  .e-image-editor {
680
684
  background: #4b5563;
681
685
  }
@@ -676,6 +676,10 @@
676
676
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
677
677
  }
678
678
 
679
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
680
+ top: calc(50% + 60px);
681
+ }
682
+
679
683
  .e-image-editor {
680
684
  background: #e5e7eb;
681
685
  }
@@ -292,8 +292,8 @@
292
292
  .e-image-editor .e-toolbar {
293
293
  border: none;
294
294
  border-bottom: 1px solid var(--color-sf-border);
295
- height: 40px !important; /* stylelint-disable-line declaration-no-important */
296
- min-height: 40px !important; /* stylelint-disable-line declaration-no-important */
295
+ height: 48px !important; /* stylelint-disable-line declaration-no-important */
296
+ min-height: 48px !important; /* stylelint-disable-line declaration-no-important */
297
297
  }
298
298
  .e-image-editor .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-height {
299
299
  margin-left: 20px;
@@ -434,7 +434,7 @@
434
434
  }
435
435
 
436
436
  .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
437
- top: calc(50% - 5px) !important; /* stylelint-disable-line declaration-no-important */
437
+ top: calc(50% - 6px) !important; /* stylelint-disable-line declaration-no-important */
438
438
  }
439
439
 
440
440
  .e-ie-finetune-value-span {
@@ -446,7 +446,7 @@
446
446
  }
447
447
 
448
448
  .e-ie-finetune-slider-wrap {
449
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
449
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
450
450
  }
451
451
 
452
452
  .e-transparency-slider-wrap {
@@ -680,6 +680,10 @@
680
680
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
681
681
  }
682
682
 
683
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
684
+ top: calc(50% + 60px);
685
+ }
686
+
683
687
  .e-image-editor {
684
688
  background: var(--color-sf-content-bg-color);
685
689
  }
@@ -756,7 +760,7 @@
756
760
 
757
761
  .e-bigger .e-image-editor .e-contextual-toolbar-wrapper .e-slider-container .e-slider .e-handle,
758
762
  .e-image-editor.e-bigger .e-contextual-toolbar-wrapper .e-slider-container .e-slider .e-handle {
759
- top: calc(50% - 8px) !important; /* stylelint-disable-line declaration-no-important */
763
+ top: calc(50% - 10px) !important; /* stylelint-disable-line declaration-no-important */
760
764
  }
761
765
  .e-bigger .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar,
762
766
  .e-image-editor.e-bigger .e-contextual-toolbar-wrapper .e-toolbar {
@@ -769,8 +773,8 @@
769
773
  }
770
774
  .e-bigger .e-image-editor .e-toolbar,
771
775
  .e-image-editor.e-bigger .e-toolbar {
772
- height: 46px !important; /* stylelint-disable-line declaration-no-important */
773
- min-height: 46px !important; /* stylelint-disable-line declaration-no-important */
776
+ height: 56px !important; /* stylelint-disable-line declaration-no-important */
777
+ min-height: 56px !important; /* stylelint-disable-line declaration-no-important */
774
778
  }
775
779
  .e-bigger .e-image-editor .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-height span, .e-bigger .e-image-editor .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-width span,
776
780
  .e-image-editor.e-bigger .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-height span,
@@ -828,7 +832,7 @@
828
832
  line-height: 1;
829
833
  }
830
834
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
831
- top: calc(50% - 6px) !important; /* stylelint-disable-line declaration-no-important */
835
+ top: calc(50% - 8px) !important; /* stylelint-disable-line declaration-no-important */
832
836
  }
833
837
 
834
838
  .e-bigger .e-ie-save-dialog .e-ie-img-save-name {
@@ -694,6 +694,10 @@
694
694
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
695
695
  }
696
696
 
697
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
698
+ top: calc(50% + 60px);
699
+ }
700
+
697
701
  .e-image-editor {
698
702
  background: #292929;
699
703
  }
@@ -694,6 +694,10 @@
694
694
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
695
695
  }
696
696
 
697
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
698
+ top: calc(50% + 60px);
699
+ }
700
+
697
701
  .e-image-editor {
698
702
  background: #292929;
699
703
  }
@@ -696,6 +696,10 @@
696
696
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
697
697
  }
698
698
 
699
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
700
+ top: calc(50% + 60px);
701
+ }
702
+
699
703
  .e-image-editor {
700
704
  background: #eee;
701
705
  }
@@ -696,6 +696,10 @@
696
696
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
697
697
  }
698
698
 
699
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
700
+ top: calc(50% + 60px);
701
+ }
702
+
699
703
  .e-image-editor {
700
704
  background: #eee;
701
705
  }
@@ -716,6 +716,10 @@
716
716
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
717
717
  }
718
718
 
719
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
720
+ top: calc(50% + 60px);
721
+ }
722
+
719
723
  .e-image-editor {
720
724
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.14)), to(rgba(var(--color-sf-primary), 0.14))), rgba(var(--color-sf-surface));
721
725
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.14), rgba(var(--color-sf-primary), 0.14)), rgba(var(--color-sf-surface));
@@ -716,6 +716,10 @@
716
716
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
717
717
  }
718
718
 
719
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
720
+ top: calc(50% + 60px);
721
+ }
722
+
719
723
  .e-image-editor {
720
724
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.14)), to(rgba(var(--color-sf-primary), 0.14))), rgba(var(--color-sf-surface));
721
725
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.14), rgba(var(--color-sf-primary), 0.14)), rgba(var(--color-sf-surface));
@@ -718,6 +718,10 @@
718
718
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
719
719
  }
720
720
 
721
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
722
+ top: calc(50% + 60px);
723
+ }
724
+
721
725
  .e-image-editor {
722
726
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.14)), to(rgba(var(--color-sf-primary), 0.14))), rgba(var(--color-sf-surface));
723
727
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.14), rgba(var(--color-sf-primary), 0.14)), rgba(var(--color-sf-surface));
@@ -718,6 +718,10 @@
718
718
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
719
719
  }
720
720
 
721
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
722
+ top: calc(50% + 60px);
723
+ }
724
+
721
725
  .e-image-editor {
722
726
  background: -webkit-gradient(linear, left bottom, left top, from(rgba(var(--color-sf-primary), 0.14)), to(rgba(var(--color-sf-primary), 0.14))), rgba(var(--color-sf-surface));
723
727
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.14), rgba(var(--color-sf-primary), 0.14)), rgba(var(--color-sf-surface));
@@ -676,6 +676,10 @@
676
676
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
677
677
  }
678
678
 
679
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
680
+ top: calc(50% + 60px);
681
+ }
682
+
679
683
  .e-image-editor {
680
684
  background: #4b5563;
681
685
  }
@@ -676,6 +676,10 @@
676
676
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
677
677
  }
678
678
 
679
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
680
+ top: calc(50% + 60px);
681
+ }
682
+
679
683
  .e-image-editor {
680
684
  background: #4b5563;
681
685
  }
@@ -676,6 +676,10 @@
676
676
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
677
677
  }
678
678
 
679
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
680
+ top: calc(50% + 60px);
681
+ }
682
+
679
683
  .e-image-editor {
680
684
  background: #e5e7eb;
681
685
  }
@@ -676,6 +676,10 @@
676
676
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
677
677
  }
678
678
 
679
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
680
+ top: calc(50% + 60px);
681
+ }
682
+
679
683
  .e-image-editor {
680
684
  background: #e5e7eb;
681
685
  }
@@ -292,8 +292,8 @@
292
292
  .e-image-editor .e-toolbar {
293
293
  border: none;
294
294
  border-bottom: 1px solid var(--color-sf-border);
295
- height: 40px !important; /* stylelint-disable-line declaration-no-important */
296
- min-height: 40px !important; /* stylelint-disable-line declaration-no-important */
295
+ height: 48px !important; /* stylelint-disable-line declaration-no-important */
296
+ min-height: 48px !important; /* stylelint-disable-line declaration-no-important */
297
297
  }
298
298
  .e-image-editor .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-height {
299
299
  margin-left: 20px;
@@ -434,7 +434,7 @@
434
434
  }
435
435
 
436
436
  .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
437
- top: calc(50% - 5px) !important; /* stylelint-disable-line declaration-no-important */
437
+ top: calc(50% - 6px) !important; /* stylelint-disable-line declaration-no-important */
438
438
  }
439
439
 
440
440
  .e-ie-finetune-value-span {
@@ -446,7 +446,7 @@
446
446
  }
447
447
 
448
448
  .e-ie-finetune-slider-wrap {
449
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
449
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
450
450
  }
451
451
 
452
452
  .e-transparency-slider-wrap {
@@ -680,6 +680,10 @@
680
680
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
681
681
  }
682
682
 
683
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
684
+ top: calc(50% + 60px);
685
+ }
686
+
683
687
  .e-image-editor {
684
688
  background: var(--color-sf-content-bg-color);
685
689
  }
@@ -292,8 +292,8 @@
292
292
  .e-image-editor .e-toolbar {
293
293
  border: none;
294
294
  border-bottom: 1px solid var(--color-sf-border);
295
- height: 40px !important; /* stylelint-disable-line declaration-no-important */
296
- min-height: 40px !important; /* stylelint-disable-line declaration-no-important */
295
+ height: 48px !important; /* stylelint-disable-line declaration-no-important */
296
+ min-height: 48px !important; /* stylelint-disable-line declaration-no-important */
297
297
  }
298
298
  .e-image-editor .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-height {
299
299
  margin-left: 20px;
@@ -434,7 +434,7 @@
434
434
  }
435
435
 
436
436
  .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
437
- top: calc(50% - 5px) !important; /* stylelint-disable-line declaration-no-important */
437
+ top: calc(50% - 6px) !important; /* stylelint-disable-line declaration-no-important */
438
438
  }
439
439
 
440
440
  .e-ie-finetune-value-span {
@@ -446,7 +446,7 @@
446
446
  }
447
447
 
448
448
  .e-ie-finetune-slider-wrap {
449
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
449
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
450
450
  }
451
451
 
452
452
  .e-transparency-slider-wrap {
@@ -680,6 +680,10 @@
680
680
  margin-left: 10px !important; /* stylelint-disable-line declaration-no-important */
681
681
  }
682
682
 
683
+ .e-device.e-image-editor .e-ie-drop-area .e-ie-drop-info {
684
+ top: calc(50% + 60px);
685
+ }
686
+
683
687
  .e-image-editor {
684
688
  background: var(--color-sf-content-bg-color);
685
689
  }
@@ -756,7 +760,7 @@
756
760
 
757
761
  .e-bigger .e-image-editor .e-contextual-toolbar-wrapper .e-slider-container .e-slider .e-handle,
758
762
  .e-image-editor.e-bigger .e-contextual-toolbar-wrapper .e-slider-container .e-slider .e-handle {
759
- top: calc(50% - 8px) !important; /* stylelint-disable-line declaration-no-important */
763
+ top: calc(50% - 10px) !important; /* stylelint-disable-line declaration-no-important */
760
764
  }
761
765
  .e-bigger .e-image-editor .e-contextual-toolbar-wrapper .e-toolbar,
762
766
  .e-image-editor.e-bigger .e-contextual-toolbar-wrapper .e-toolbar {
@@ -769,8 +773,8 @@
769
773
  }
770
774
  .e-bigger .e-image-editor .e-toolbar,
771
775
  .e-image-editor.e-bigger .e-toolbar {
772
- height: 46px !important; /* stylelint-disable-line declaration-no-important */
773
- min-height: 46px !important; /* stylelint-disable-line declaration-no-important */
776
+ height: 56px !important; /* stylelint-disable-line declaration-no-important */
777
+ min-height: 56px !important; /* stylelint-disable-line declaration-no-important */
774
778
  }
775
779
  .e-bigger .e-image-editor .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-height span, .e-bigger .e-image-editor .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-width span,
776
780
  .e-image-editor.e-bigger .e-toolbar .e-toolbar-items .e-toolbar-item.e-ie-resize-height span,
@@ -828,7 +832,7 @@
828
832
  line-height: 1;
829
833
  }
830
834
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
831
- top: calc(50% - 6px) !important; /* stylelint-disable-line declaration-no-important */
835
+ top: calc(50% - 8px) !important; /* stylelint-disable-line declaration-no-important */
832
836
  }
833
837
 
834
838
  .e-bigger .e-ie-save-dialog .e-ie-img-save-name {