@syncfusion/ej2-image-editor 24.1.46 → 24.2.4

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 (68) hide show
  1. package/CHANGELOG.md +12 -0
  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 +189 -39
  5. package/dist/es6/ej2-image-editor.es2015.js.map +1 -1
  6. package/dist/es6/ej2-image-editor.es5.js +189 -39
  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 +3 -0
  13. package/src/image-editor/action/selection.d.ts +1 -0
  14. package/src/image-editor/action/selection.js +11 -2
  15. package/src/image-editor/action/shape.js +6 -6
  16. package/src/image-editor/action/undo-redo.d.ts +1 -0
  17. package/src/image-editor/action/undo-redo.js +43 -6
  18. package/src/image-editor/renderer/toolbar.d.ts +4 -0
  19. package/src/image-editor/renderer/toolbar.js +126 -25
  20. package/styles/bootstrap-dark.css +12 -0
  21. package/styles/bootstrap.css +12 -0
  22. package/styles/bootstrap4.css +12 -0
  23. package/styles/bootstrap5-dark.css +12 -0
  24. package/styles/bootstrap5.css +12 -0
  25. package/styles/fabric-dark.css +12 -0
  26. package/styles/fabric.css +12 -0
  27. package/styles/fluent-dark.css +12 -0
  28. package/styles/fluent.css +12 -0
  29. package/styles/highcontrast-light.css +12 -0
  30. package/styles/highcontrast.css +12 -0
  31. package/styles/image-editor/_bootstrap-dark-definition.scss +1 -0
  32. package/styles/image-editor/_bootstrap-definition.scss +1 -0
  33. package/styles/image-editor/_bootstrap4-definition.scss +1 -0
  34. package/styles/image-editor/_bootstrap5-definition.scss +1 -0
  35. package/styles/image-editor/_fabric-dark-definition.scss +1 -0
  36. package/styles/image-editor/_fabric-definition.scss +1 -0
  37. package/styles/image-editor/_fluent-definition.scss +1 -0
  38. package/styles/image-editor/_fusionnew-definition.scss +1 -0
  39. package/styles/image-editor/_highcontrast-definition.scss +1 -0
  40. package/styles/image-editor/_highcontrast-light-definition.scss +1 -0
  41. package/styles/image-editor/_layout.scss +32 -2
  42. package/styles/image-editor/_material-dark-definition.scss +1 -0
  43. package/styles/image-editor/_material-definition.scss +1 -0
  44. package/styles/image-editor/_material3-definition.scss +3 -2
  45. package/styles/image-editor/_tailwind-definition.scss +1 -0
  46. package/styles/image-editor/bootstrap-dark.css +12 -0
  47. package/styles/image-editor/bootstrap.css +12 -0
  48. package/styles/image-editor/bootstrap4.css +12 -0
  49. package/styles/image-editor/bootstrap5-dark.css +12 -0
  50. package/styles/image-editor/bootstrap5.css +12 -0
  51. package/styles/image-editor/fabric-dark.css +12 -0
  52. package/styles/image-editor/fabric.css +12 -0
  53. package/styles/image-editor/fluent-dark.css +12 -0
  54. package/styles/image-editor/fluent.css +12 -0
  55. package/styles/image-editor/highcontrast-light.css +12 -0
  56. package/styles/image-editor/highcontrast.css +12 -0
  57. package/styles/image-editor/material-dark.css +12 -0
  58. package/styles/image-editor/material.css +12 -0
  59. package/styles/image-editor/material3-dark.css +25 -4
  60. package/styles/image-editor/material3.css +25 -4
  61. package/styles/image-editor/tailwind-dark.css +15 -2
  62. package/styles/image-editor/tailwind.css +15 -2
  63. package/styles/material-dark.css +12 -0
  64. package/styles/material.css +12 -0
  65. package/styles/material3-dark.css +25 -4
  66. package/styles/material3.css +25 -4
  67. package/styles/tailwind-dark.css +15 -2
  68. package/styles/tailwind.css +15 -2
package/styles/image-editor/tailwind-dark.css CHANGED
@@ -535,15 +535,16 @@
535
535
  }
536
536
 
537
537
  .e-ie-finetune-slider-wrap {
538
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
538
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
539
539
  }
540
540
 
541
541
  .e-transparency-slider-wrap {
542
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
542
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
543
543
  }
544
544
 
545
545
  .e-ie-slider-wrap {
546
546
  top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
547
+ top: calc(50% - 13px) !important; /* stylelint-disable-line declaration-no-important */
547
548
  }
548
549
 
549
550
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
@@ -563,6 +564,18 @@
563
564
  margin-left: calc(50% - 80px) !important; /* stylelint-disable-line declaration-no-important */
564
565
  }
565
566
 
567
+ .e-device .e-transparency-slider-wrap {
568
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
569
+ }
570
+
571
+ .e-device .e-ie-finetune-slider-wrap {
572
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
573
+ }
574
+
575
+ .e-device .e-ie-slider-wrap {
576
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
577
+ }
578
+
566
579
  .e-image-editor {
567
580
  background: #4b5563;
568
581
  }
package/styles/image-editor/tailwind.css CHANGED
@@ -535,15 +535,16 @@
535
535
  }
536
536
 
537
537
  .e-ie-finetune-slider-wrap {
538
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
538
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
539
539
  }
540
540
 
541
541
  .e-transparency-slider-wrap {
542
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
542
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
543
543
  }
544
544
 
545
545
  .e-ie-slider-wrap {
546
546
  top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
547
+ top: calc(50% - 13px) !important; /* stylelint-disable-line declaration-no-important */
547
548
  }
548
549
 
549
550
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
@@ -563,6 +564,18 @@
563
564
  margin-left: calc(50% - 80px) !important; /* stylelint-disable-line declaration-no-important */
564
565
  }
565
566
 
567
+ .e-device .e-transparency-slider-wrap {
568
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
569
+ }
570
+
571
+ .e-device .e-ie-finetune-slider-wrap {
572
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
573
+ }
574
+
575
+ .e-device .e-ie-slider-wrap {
576
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
577
+ }
578
+
566
579
  .e-image-editor {
567
580
  background: #e5e7eb;
568
581
  }
package/styles/material-dark.css CHANGED
@@ -566,6 +566,18 @@
566
566
  margin-left: calc(50% - 80px) !important; /* stylelint-disable-line declaration-no-important */
567
567
  }
568
568
 
569
+ .e-device .e-transparency-slider-wrap {
570
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
571
+ }
572
+
573
+ .e-device .e-ie-finetune-slider-wrap {
574
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
575
+ }
576
+
577
+ .e-device .e-ie-slider-wrap {
578
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
579
+ }
580
+
569
581
  .e-image-editor {
570
582
  background: #292929;
571
583
  }
package/styles/material.css CHANGED
@@ -571,6 +571,18 @@
571
571
  margin-left: calc(50% - 80px) !important; /* stylelint-disable-line declaration-no-important */
572
572
  }
573
573
 
574
+ .e-device .e-transparency-slider-wrap {
575
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
576
+ }
577
+
578
+ .e-device .e-ie-finetune-slider-wrap {
579
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
580
+ }
581
+
582
+ .e-device .e-ie-slider-wrap {
583
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
584
+ }
585
+
574
586
  .e-image-editor {
575
587
  background: #eee;
576
588
  }
package/styles/material3-dark.css CHANGED
@@ -596,23 +596,24 @@
596
596
  }
597
597
 
598
598
  .e-ie-finetune-value-span {
599
- top: 29% !important; /* stylelint-disable-line declaration-no-important */
599
+ top: 30% !important; /* stylelint-disable-line declaration-no-important */
600
600
  }
601
601
 
602
602
  .e-ie-finetune-slider-label {
603
- top: 28% !important; /* stylelint-disable-line declaration-no-important */
603
+ top: 30% !important; /* stylelint-disable-line declaration-no-important */
604
604
  }
605
605
 
606
606
  .e-ie-finetune-slider-wrap {
607
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
607
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
608
608
  }
609
609
 
610
610
  .e-transparency-slider-wrap {
611
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
611
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
612
612
  }
613
613
 
614
614
  .e-ie-slider-wrap {
615
615
  top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
616
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
616
617
  }
617
618
 
618
619
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
@@ -634,6 +635,26 @@
634
635
  margin-left: calc(50% - 80px) !important; /* stylelint-disable-line declaration-no-important */
635
636
  }
636
637
 
638
+ .e-device .e-transparency-slider-wrap {
639
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
640
+ }
641
+
642
+ .e-device .e-ie-finetune-slider-wrap {
643
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
644
+ }
645
+
646
+ .e-device .e-ie-finetune-value-span {
647
+ top: 29% !important; /* stylelint-disable-line declaration-no-important */
648
+ }
649
+
650
+ .e-device .e-ie-finetune-slider-label {
651
+ top: 28% !important; /* stylelint-disable-line declaration-no-important */
652
+ }
653
+
654
+ .e-device .e-ie-slider-wrap {
655
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
656
+ }
657
+
637
658
  .e-image-editor {
638
659
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.14), rgba(var(--color-sf-primary), 0.14)), rgba(var(--color-sf-surface));
639
660
  }
package/styles/material3.css CHANGED
@@ -652,23 +652,24 @@
652
652
  }
653
653
 
654
654
  .e-ie-finetune-value-span {
655
- top: 29% !important; /* stylelint-disable-line declaration-no-important */
655
+ top: 30% !important; /* stylelint-disable-line declaration-no-important */
656
656
  }
657
657
 
658
658
  .e-ie-finetune-slider-label {
659
- top: 28% !important; /* stylelint-disable-line declaration-no-important */
659
+ top: 30% !important; /* stylelint-disable-line declaration-no-important */
660
660
  }
661
661
 
662
662
  .e-ie-finetune-slider-wrap {
663
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
663
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
664
664
  }
665
665
 
666
666
  .e-transparency-slider-wrap {
667
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
667
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
668
668
  }
669
669
 
670
670
  .e-ie-slider-wrap {
671
671
  top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
672
+ top: calc(50% - 12px) !important; /* stylelint-disable-line declaration-no-important */
672
673
  }
673
674
 
674
675
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
@@ -690,6 +691,26 @@
690
691
  margin-left: calc(50% - 80px) !important; /* stylelint-disable-line declaration-no-important */
691
692
  }
692
693
 
694
+ .e-device .e-transparency-slider-wrap {
695
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
696
+ }
697
+
698
+ .e-device .e-ie-finetune-slider-wrap {
699
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
700
+ }
701
+
702
+ .e-device .e-ie-finetune-value-span {
703
+ top: 29% !important; /* stylelint-disable-line declaration-no-important */
704
+ }
705
+
706
+ .e-device .e-ie-finetune-slider-label {
707
+ top: 28% !important; /* stylelint-disable-line declaration-no-important */
708
+ }
709
+
710
+ .e-device .e-ie-slider-wrap {
711
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
712
+ }
713
+
693
714
  .e-image-editor {
694
715
  background: linear-gradient(0deg, rgba(var(--color-sf-primary), 0.14), rgba(var(--color-sf-primary), 0.14)), rgba(var(--color-sf-surface));
695
716
  }
package/styles/tailwind-dark.css CHANGED
@@ -535,15 +535,16 @@
535
535
  }
536
536
 
537
537
  .e-ie-finetune-slider-wrap {
538
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
538
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
539
539
  }
540
540
 
541
541
  .e-transparency-slider-wrap {
542
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
542
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
543
543
  }
544
544
 
545
545
  .e-ie-slider-wrap {
546
546
  top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
547
+ top: calc(50% - 13px) !important; /* stylelint-disable-line declaration-no-important */
547
548
  }
548
549
 
549
550
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
@@ -563,6 +564,18 @@
563
564
  margin-left: calc(50% - 80px) !important; /* stylelint-disable-line declaration-no-important */
564
565
  }
565
566
 
567
+ .e-device .e-transparency-slider-wrap {
568
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
569
+ }
570
+
571
+ .e-device .e-ie-finetune-slider-wrap {
572
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
573
+ }
574
+
575
+ .e-device .e-ie-slider-wrap {
576
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
577
+ }
578
+
566
579
  .e-image-editor {
567
580
  background: #4b5563;
568
581
  }
package/styles/tailwind.css CHANGED
@@ -535,15 +535,16 @@
535
535
  }
536
536
 
537
537
  .e-ie-finetune-slider-wrap {
538
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
538
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
539
539
  }
540
540
 
541
541
  .e-transparency-slider-wrap {
542
- top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
542
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
543
543
  }
544
544
 
545
545
  .e-ie-slider-wrap {
546
546
  top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
547
+ top: calc(50% - 13px) !important; /* stylelint-disable-line declaration-no-important */
547
548
  }
548
549
 
549
550
  .e-bigger .e-straighten .e-control-wrapper.e-slider-container .e-slider .e-handle {
@@ -563,6 +564,18 @@
563
564
  margin-left: calc(50% - 80px) !important; /* stylelint-disable-line declaration-no-important */
564
565
  }
565
566
 
567
+ .e-device .e-transparency-slider-wrap {
568
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
569
+ }
570
+
571
+ .e-device .e-ie-finetune-slider-wrap {
572
+ top: calc(50% - 15px) !important; /* stylelint-disable-line declaration-no-important */
573
+ }
574
+
575
+ .e-device .e-ie-slider-wrap {
576
+ top: calc(50% - 14px) !important; /* stylelint-disable-line declaration-no-important */
577
+ }
578
+
566
579
  .e-image-editor {
567
580
  background: #e5e7eb;
568
581
  }