@syncfusion/ej2-react-inputs 21.2.9 → 22.1.38

package/CHANGELOG.md

@@ -2,42 +2,63 @@
 
 ## [Unreleased]
 
-### ColorPicker
+### Uploader
 
 #### Bug Fixes
 
-- Facing exception when mode switching from color palette to color picker has been resolved.
-- Color picker value is not getting reset for transparent case.
+- `#I460888` - Issue with "console error occurs when we render the toast in the `beforeUpload` event of the uploader" has been resolved.
 
-## 21.2.8 (2023-05-30)
+### TextBox
 
-### ColorPicker
+#### Bug Fixes
+
+- `#472075` - Issue with "Textbox component style overrides with native Tailwind CSS" has been resolved.
+
+## 22.1.34 (2023-06-21)
+
+### NumericTextbox
 
 #### Bug Fixes
 
-- Issue with keyboard navigation has been resolved.
+- Issue with "Unwanted calls for CalculateWidth method" has been resolved.
 
-### Uploader
+### TextBox
+
+#### New Features
+
+- Provided clear icon support for Multiline Textbox, allowing users to easily clear the contents of the textarea with a single click.
+
+### FormValidator
+
+#### New Features
+
+- Provided support for validating multiple date formats using a form validator.
+- Provided support for placing validation messages outside the component for all Syncfusion Form Components.
+
+## 21.2.9 (2023-06-06)
+
+### ColorPicker
 
 #### Bug Fixes
 
-- `#I452946` - The issue of "status not being updated inside the template when using use State" has been resolved.
+- Facing exception when mode switching from color palette to color picker has been resolved.
+- Color picker value is not getting reset for transparent case.
 
-## 21.2.6 (2023-05-23)
+## 21.2.8 (2023-05-30)
 
-### Uploader
+### ColorPicker
 
 #### Bug Fixes
 
-- `#I460888` - Issue with "Console error occurs when deleting files after data load" has been resolved.
+- Issue with keyboard navigation has been resolved.
 
-- `#I452946` - The issue of removed uploaded files when using templates and use State to set status has been resolved.
+## 21.2.6 (2023-05-23)
 
-### FormValidator
+### Uploader
 
 #### Bug Fixes
 
-- `#I457392` - The issue of "an error message being displayed after selecting valid item from the list" has been resolved.
+- `#I460888` - Issue with "Console error occurs when deleting files after data load" has been resolved.
 
 ## 21.1.38 (2023-04-04)
 
@@ -1259,14 +1280,6 @@ MaskedTextBox allows the user to enter the valid input only based on the provide
 - **Accessibility** - provides built-in accessibility support which helps to access all the MaskedTextBox component features through keyboard, on-screen readers, or other assistive technology devices.
 
 
-## 21.2.4 (2023-05-09)
-
-### TextBox
-
-#### Bug Fixes
-
-- `#I455410` - The issue of the textarea getting hidden when dynamically updating an attribute using HTML Attribute has been resolved.
-
 ## 19.1.66 (2021-06-01)
 
 ### NumericTextBox

package/dist/ej2-react-inputs.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-react-inputs.min.js
-*  version : 21.2.9
+*  version : 22.1.38
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/dist/ej2-react-inputs.umd.min.js

@@ -1,6 +1,6 @@
 /*!
 *  filename: ej2-react-inputs.umd.min.js
-*  version : 21.2.9
+*  version : 22.1.38
 *  Copyright Syncfusion Inc. 2001 - 2020. All rights reserved.
 *  Use of this code is subject to the terms of our license.
 *  A copy of the current license can be obtained at any time by e-mailing

package/package.json

@@ -1,8 +1,8 @@
 {
   "_from": "@syncfusion/ej2-react-inputs@*",
-  "_id": "@syncfusion/ej2-react-inputs@21.2.8",
+  "_id": "@syncfusion/ej2-react-inputs@22.1.34",
   "_inBundle": false,
-  "_integrity": "sha512-BkLoBxEyVYimYkCaz91R7qZQJrA8YwD10eiugVjH2w9CMwesNDpvF9bAYo26aAkvoL0shzK6qUy2OmJ3VD1WCw==",
+  "_integrity": "sha512-dLmC1DeaSpXZWeNBDLvWYhLZNUgGN4c7dt+Ot7G/6xZ/OWD8kp6dZbNe3mwaKaNL8MTAfvOpoxtogz7mfylf9A==",
   "_location": "/@syncfusion/ej2-react-inputs",
   "_phantomChildren": {},
   "_requested": {
@@ -19,8 +19,8 @@
   "_requiredBy": [
     "/"
   ],
-  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-react-inputs/-/ej2-react-inputs-21.2.8.tgz",
-  "_shasum": "cdd02ea31736917c533e1f4b222b48131e235f90",
+  "_resolved": "https://nexus.syncfusion.com/repository/ej2-hotfix-new/@syncfusion/ej2-react-inputs/-/ej2-react-inputs-22.1.34.tgz",
+  "_shasum": "20acc9245b2375b5c52d785fd856a8e31573bb12",
   "_spec": "@syncfusion/ej2-react-inputs@*",
   "_where": "/jenkins/workspace/elease-automation_release_21.1.1/packages/included",
   "author": {
@@ -31,9 +31,9 @@
   },
   "bundleDependencies": false,
   "dependencies": {
-    "@syncfusion/ej2-base": "~21.2.9",
-    "@syncfusion/ej2-inputs": "21.2.9",
-    "@syncfusion/ej2-react-base": "~21.2.8"
+    "@syncfusion/ej2-base": "~22.1.38",
+    "@syncfusion/ej2-inputs": "22.1.38",
+    "@syncfusion/ej2-react-base": "~22.1.34"
   },
   "deprecated": false,
   "description": "A package of Essential JS 2 input components such as Textbox, Color-picker, Masked-textbox, Numeric-textbox, Slider, Upload, and Form-validator that is used to get input from the users. for React",
@@ -71,6 +71,6 @@
     "type": "git",
     "url": "git+https://github.com/syncfusion/ej2-react-ui-components.git"
   },
-  "version": "21.2.9",
+  "version": "22.1.38",
   "sideEffects": false
 }

package/styles/bootstrap-dark.css

@@ -1864,6 +1864,7 @@ input.e-input,
 }
 
 input.e-input.e-bigger,
+.e-bigger input.e-input,
 .e-input-group.e-bigger input,
 .e-input-group.e-bigger input.e-input,
 .e-input-group.e-control-wrapper.e-bigger input,
@@ -2857,8 +2858,8 @@ textarea.e-input.e-bigger.e-small,
 .e-input-group.e-control-wrapper .e-clear-icon.e-bigger,
 .e-bigger .e-input-group .e-clear-icon,
 .e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
-  min-height: 0;
   min-width: 38px;
+  min-height: 0;
   padding-bottom: 0;
   padding-right: 0;
   padding-top: 0;
@@ -2874,6 +2875,19 @@ textarea.e-input.e-bigger.e-small,
   padding-top: 0;
 }
 
+.e-input-group.e-small .e-clear-icon,
+.e-input-group .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group .e-clear-icon,
+.e-input-group.e-control-wrapper.e-small .e-clear-icon,
+.e-input-group.e-control-wrapper .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
+  min-height: 0;
+  min-width: 38px;
+  padding-bottom: 0;
+  padding-right: 0;
+  padding-top: 0;
+}
+
 .e-input-group.e-small.e-bigger .e-clear-icon,
 .e-input-group.e-small .e-clear-icon.e-bigger,
 .e-bigger .e-input-group.e-small .e-clear-icon,
@@ -6811,6 +6825,8 @@ body.e-colorpicker-overflow {
   padding: 4px;
   line-height: 9px;
   display: block;
+  min-width: calc(1em + 8px);
+  min-height: calc(1em + 8px);
   position: relative;
 }
 .e-rating-container .e-rating-item-container .e-rating-item {
@@ -6953,7 +6969,7 @@ body.e-colorpicker-overflow {
   font-size: 22px;
 }
 
-.e-rating-container .e-rating-item-list:focus .e-rating-focus {
+.e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus {
   outline-color: #676767;
   border-radius: 2px;
 }
@@ -6965,6 +6981,7 @@ body.e-colorpicker-overflow {
 }
 .e-rating-container .e-reset.e-disabled {
   color: #505050;
+  opacity: 1;
 }
 .e-rating-container .e-rating-item-container .e-rating-icon {
   -webkit-text-fill-color: transparent;
@@ -7018,6 +7035,9 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
+.e-rating-container.e-disabled {
+  opacity: 1;
+}
 .e-rating-container.e-disabled .e-rating-item-container .e-rating-icon {
   -webkit-text-stroke: 1px #505050;
 }
@@ -7036,7 +7056,7 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
-.e-rating-container.e-disabled.e-rtl.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl.e-rating-intermediate .e-rating-icon {
+.e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-intermediate .e-rating-icon {
   background: linear-gradient(to left, #505050 var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */

package/styles/bootstrap.css

@@ -1864,6 +1864,7 @@ input.e-input,
 }
 
 input.e-input.e-bigger,
+.e-bigger input.e-input,
 .e-input-group.e-bigger input,
 .e-input-group.e-bigger input.e-input,
 .e-input-group.e-control-wrapper.e-bigger input,
@@ -2857,8 +2858,8 @@ textarea.e-input.e-bigger.e-small,
 .e-input-group.e-control-wrapper .e-clear-icon.e-bigger,
 .e-bigger .e-input-group .e-clear-icon,
 .e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
-  min-height: 0;
   min-width: 38px;
+  min-height: 0;
   padding-bottom: 0;
   padding-right: 0;
   padding-top: 0;
@@ -2874,6 +2875,19 @@ textarea.e-input.e-bigger.e-small,
   padding-top: 0;
 }
 
+.e-input-group.e-small .e-clear-icon,
+.e-input-group .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group .e-clear-icon,
+.e-input-group.e-control-wrapper.e-small .e-clear-icon,
+.e-input-group.e-control-wrapper .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
+  min-height: 0;
+  min-width: 38px;
+  padding-bottom: 0;
+  padding-right: 0;
+  padding-top: 0;
+}
+
 .e-input-group.e-small.e-bigger .e-clear-icon,
 .e-input-group.e-small .e-clear-icon.e-bigger,
 .e-bigger .e-input-group.e-small .e-clear-icon,
@@ -6790,6 +6804,8 @@ body.e-colorpicker-overflow {
   padding: 4px;
   line-height: 9px;
   display: block;
+  min-width: calc(1em + 8px);
+  min-height: calc(1em + 8px);
   position: relative;
 }
 .e-rating-container .e-rating-item-container .e-rating-item {
@@ -6932,7 +6948,7 @@ body.e-colorpicker-overflow {
   font-size: 24px;
 }
 
-.e-rating-container .e-rating-item-list:focus .e-rating-focus {
+.e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus {
   outline-color: #adadad;
   border-radius: 2px;
 }
@@ -6944,6 +6960,7 @@ body.e-colorpicker-overflow {
 }
 .e-rating-container .e-reset.e-disabled {
   color: #999;
+  opacity: 1;
 }
 .e-rating-container .e-rating-item-container .e-rating-icon {
   -webkit-text-fill-color: transparent;
@@ -6997,6 +7014,9 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
+.e-rating-container.e-disabled {
+  opacity: 1;
+}
 .e-rating-container.e-disabled .e-rating-item-container .e-rating-icon {
   -webkit-text-stroke: 1px #999;
 }
@@ -7015,7 +7035,7 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
-.e-rating-container.e-disabled.e-rtl.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl.e-rating-intermediate .e-rating-icon {
+.e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-intermediate .e-rating-icon {
   background: linear-gradient(to left, #999 var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */

package/styles/bootstrap4.css

@@ -1864,6 +1864,7 @@ input.e-input,
 }
 
 input.e-input.e-bigger,
+.e-bigger input.e-input,
 .e-input-group.e-bigger input,
 .e-input-group.e-bigger input.e-input,
 .e-input-group.e-control-wrapper.e-bigger input,
@@ -2857,8 +2858,8 @@ textarea.e-input.e-bigger.e-small,
 .e-input-group.e-control-wrapper .e-clear-icon.e-bigger,
 .e-bigger .e-input-group .e-clear-icon,
 .e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
-  min-height: 0;
   min-width: 34px;
+  min-height: 0;
   padding-bottom: 0;
   padding-right: 0;
   padding-top: 0;
@@ -2874,6 +2875,19 @@ textarea.e-input.e-bigger.e-small,
   padding-top: 0;
 }
 
+.e-input-group.e-small .e-clear-icon,
+.e-input-group .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group .e-clear-icon,
+.e-input-group.e-control-wrapper.e-small .e-clear-icon,
+.e-input-group.e-control-wrapper .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
+  min-height: 0;
+  min-width: 34px;
+  padding-bottom: 0;
+  padding-right: 0;
+  padding-top: 0;
+}
+
 .e-input-group.e-small.e-bigger .e-clear-icon,
 .e-input-group.e-small .e-clear-icon.e-bigger,
 .e-bigger .e-input-group.e-small .e-clear-icon,
@@ -6944,6 +6958,8 @@ body.e-colorpicker-overflow {
   padding: 4px;
   line-height: 11px;
   display: block;
+  min-width: calc(1em + 8px);
+  min-height: calc(1em + 8px);
   position: relative;
 }
 .e-rating-container .e-rating-item-container .e-rating-item {
@@ -7086,7 +7102,7 @@ body.e-colorpicker-overflow {
   font-size: 20px;
 }
 
-.e-rating-container .e-rating-item-list:focus .e-rating-focus {
+.e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus {
   outline-color: #007bff;
   border-radius: 4px;
 }
@@ -7098,6 +7114,7 @@ body.e-colorpicker-overflow {
 }
 .e-rating-container .e-reset.e-disabled {
   color: #343a40;
+  opacity: 1;
 }
 .e-rating-container .e-rating-item-container .e-rating-icon {
   -webkit-text-fill-color: transparent;
@@ -7128,7 +7145,6 @@ body.e-colorpicker-overflow {
   /* stylelint-disable property-no-vendor-prefix */
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
-  -webkit-text-stroke: 1px #dee2e6;
   -webkit-text-stroke: 1px #007bff;
 }
 .e-rating-container.e-rtl .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-rtl .e-rating-item-container.e-rating-intermediate .e-rating-icon {
@@ -7152,6 +7168,9 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
+.e-rating-container.e-disabled {
+  opacity: 1;
+}
 .e-rating-container.e-disabled .e-rating-item-container .e-rating-icon {
   -webkit-text-stroke: 1px #343a40;
 }
@@ -7170,7 +7189,7 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
-.e-rating-container.e-disabled.e-rtl.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl.e-rating-intermediate .e-rating-icon {
+.e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-intermediate .e-rating-icon {
   background: linear-gradient(to left, #343a40 var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */

package/styles/bootstrap5-dark.css

@@ -1953,6 +1953,7 @@ input.e-input,
 }
 
 input.e-input.e-bigger,
+.e-bigger input.e-input,
 .e-input-group.e-bigger input,
 .e-input-group.e-bigger input.e-input,
 .e-input-group.e-control-wrapper.e-bigger input,
@@ -2964,8 +2965,8 @@ textarea.e-input.e-bigger.e-small,
 .e-input-group.e-control-wrapper .e-clear-icon.e-bigger,
 .e-bigger .e-input-group .e-clear-icon,
 .e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
-  min-height: 0;
   min-width: 36px;
+  min-height: 0;
   padding-bottom: 0;
   padding-right: 0;
   padding-top: 0;
@@ -2981,6 +2982,19 @@ textarea.e-input.e-bigger.e-small,
   padding-top: 0;
 }
 
+.e-input-group.e-small .e-clear-icon,
+.e-input-group .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group .e-clear-icon,
+.e-input-group.e-control-wrapper.e-small .e-clear-icon,
+.e-input-group.e-control-wrapper .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
+  min-height: 0;
+  min-width: 36px;
+  padding-bottom: 0;
+  padding-right: 0;
+  padding-top: 0;
+}
+
 .e-input-group.e-small.e-bigger .e-clear-icon,
 .e-input-group.e-small .e-clear-icon.e-bigger,
 .e-bigger .e-input-group.e-small .e-clear-icon,
@@ -7094,6 +7108,8 @@ body.e-colorpicker-overflow {
   padding: 4px;
   line-height: 13px;
   display: block;
+  min-width: calc(1em + 8px);
+  min-height: calc(1em + 8px);
   position: relative;
 }
 .e-rating-container .e-rating-item-container .e-rating-item {
@@ -7236,7 +7252,7 @@ body.e-colorpicker-overflow {
   font-size: 22px;
 }
 
-.e-rating-container .e-rating-item-list:focus .e-rating-focus {
+.e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus {
   outline-color: #0d6efd;
   border-radius: 4px;
 }
@@ -7248,6 +7264,7 @@ body.e-colorpicker-overflow {
 }
 .e-rating-container .e-reset.e-disabled {
   color: #6c757d;
+  opacity: 1;
 }
 .e-rating-container .e-rating-item-container .e-rating-icon {
   -webkit-text-fill-color: transparent;
@@ -7302,6 +7319,9 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
+.e-rating-container.e-disabled {
+  opacity: 1;
+}
 .e-rating-container.e-disabled .e-rating-item-container .e-rating-icon {
   -webkit-text-stroke: 1px #495057;
 }
@@ -7320,7 +7340,7 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
-.e-rating-container.e-disabled.e-rtl.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl.e-rating-intermediate .e-rating-icon {
+.e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-intermediate .e-rating-icon {
   background: linear-gradient(to left, #6c757d var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */

package/styles/bootstrap5.css

@@ -1953,6 +1953,7 @@ input.e-input,
 }
 
 input.e-input.e-bigger,
+.e-bigger input.e-input,
 .e-input-group.e-bigger input,
 .e-input-group.e-bigger input.e-input,
 .e-input-group.e-control-wrapper.e-bigger input,
@@ -2964,8 +2965,8 @@ textarea.e-input.e-bigger.e-small,
 .e-input-group.e-control-wrapper .e-clear-icon.e-bigger,
 .e-bigger .e-input-group .e-clear-icon,
 .e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
-  min-height: 0;
   min-width: 36px;
+  min-height: 0;
   padding-bottom: 0;
   padding-right: 0;
   padding-top: 0;
@@ -2981,6 +2982,19 @@ textarea.e-input.e-bigger.e-small,
   padding-top: 0;
 }
 
+.e-input-group.e-small .e-clear-icon,
+.e-input-group .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group .e-clear-icon,
+.e-input-group.e-control-wrapper.e-small .e-clear-icon,
+.e-input-group.e-control-wrapper .e-clear-icon.e-small,
+.e-small.e-bigger .e-input-group.e-control-wrapper .e-clear-icon {
+  min-height: 0;
+  min-width: 36px;
+  padding-bottom: 0;
+  padding-right: 0;
+  padding-top: 0;
+}
+
 .e-input-group.e-small.e-bigger .e-clear-icon,
 .e-input-group.e-small .e-clear-icon.e-bigger,
 .e-bigger .e-input-group.e-small .e-clear-icon,
@@ -7094,6 +7108,8 @@ body.e-colorpicker-overflow {
   padding: 4px;
   line-height: 13px;
   display: block;
+  min-width: calc(1em + 8px);
+  min-height: calc(1em + 8px);
   position: relative;
 }
 .e-rating-container .e-rating-item-container .e-rating-item {
@@ -7236,7 +7252,7 @@ body.e-colorpicker-overflow {
   font-size: 22px;
 }
 
-.e-rating-container .e-rating-item-list:focus .e-rating-focus {
+.e-rating-container .e-rating-item-list:focus-visible:not(:hover) .e-rating-focus {
   outline-color: #0d6efd;
   border-radius: 4px;
 }
@@ -7248,6 +7264,7 @@ body.e-colorpicker-overflow {
 }
 .e-rating-container .e-reset.e-disabled {
   color: #adb5bd;
+  opacity: 1;
 }
 .e-rating-container .e-rating-item-container .e-rating-icon {
   -webkit-text-fill-color: transparent;
@@ -7302,6 +7319,9 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
+.e-rating-container.e-disabled {
+  opacity: 1;
+}
 .e-rating-container.e-disabled .e-rating-item-container .e-rating-icon {
   -webkit-text-stroke: 1px #ced4da;
 }
@@ -7320,7 +7340,7 @@ body.e-colorpicker-overflow {
   -webkit-background-clip: text;
   /* stylelint-enable property-no-vendor-prefix */
 }
-.e-rating-container.e-disabled.e-rtl.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl.e-rating-intermediate .e-rating-icon {
+.e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-selected .e-rating-icon, .e-rating-container.e-disabled.e-rtl .e-rating-item-container.e-rating-intermediate .e-rating-icon {
   background: linear-gradient(to left, #adb5bd var(--rating-value), transparent var(--rating-value));
   background-clip: text;
   /* stylelint-disable property-no-vendor-prefix */

package/styles/color-picker/fluent-dark.css

@@ -313,6 +313,7 @@ body.e-colorpicker-overflow {
 .e-container .e-slider-preview .e-preview-container .e-preview.e-previous {
   height: 24px;
   top: 25px;
+  top: 24px;
 }
 .e-container .e-selected-value {
   -ms-flex-align: center;

package/styles/color-picker/fluent.css

@@ -313,6 +313,7 @@ body.e-colorpicker-overflow {
 .e-container .e-slider-preview .e-preview-container .e-preview.e-previous {
   height: 24px;
   top: 25px;
+  top: 24px;
 }
 .e-container .e-selected-value {
   -ms-flex-align: center;