npm - @progress/kendo-themes-html - Versions diffs - 5.6.1-dev.5 → 5.7.0 - Mend

@progress/kendo-themes-html 5.6.1-dev.5 → 5.7.0

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 (827) hide show

package/src/drawer/tests/drawer-overlay-mini.tsx CHANGED Viewed

@@ -31,19 +31,19 @@ root.render(
                                     <span className="k-item-text">Item</span>
                                 </li>
                                 <li className="k-drawer-item k-drawer-separator"></li>
-                                <li className="k-drawer-item k-state-hover">
+                                <li className="k-drawer-item k-hover">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Hovered Item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-selected">
+                                <li className="k-drawer-item k-selected">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Selected Item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-selected k-state-hover">
+                                <li className="k-drawer-item k-selected k-hover">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Selected and hovered item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-focused">
+                                <li className="k-drawer-item k-focus">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Focused item</span>
                                 </li>
@@ -53,16 +53,16 @@ root.render(
                                     <Icon name="star-outline" />
                                 </li>
                                 <li className="k-drawer-item k-drawer-separator"></li>
-                                <li className="k-drawer-item k-state-hover">
+                                <li className="k-drawer-item k-hover">
                                     <Icon name="star-outline" />
                                 </li>
-                                <li className="k-drawer-item k-state-selected">
+                                <li className="k-drawer-item k-selected">
                                     <Icon name="star-outline" />
                                 </li>
-                                <li className="k-drawer-item k-state-selected k-state-hover">
+                                <li className="k-drawer-item k-selected k-hover">
                                     <Icon name="star-outline" />
                                 </li>
-                                <li className="k-drawer-item k-state-focused">
+                                <li className="k-drawer-item k-focus">
                                     <Icon name="star-outline" />
                                 </li>
                             </ul>
@@ -82,19 +82,19 @@ root.render(
                                     <span className="k-item-text">Item</span>
                                 </li>
                                 <li className="k-drawer-item k-drawer-separator"></li>
-                                <li className="k-drawer-item k-state-hover">
+                                <li className="k-drawer-item k-hover">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Hovered Item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-selected">
+                                <li className="k-drawer-item k-selected">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Selected Item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-selected k-state-hover">
+                                <li className="k-drawer-item k-selected k-hover">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Selected and hovered item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-focused">
+                                <li className="k-drawer-item k-focus">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Focused item</span>
                                 </li>
@@ -104,16 +104,16 @@ root.render(
                                     <Icon name="star-outline" />
                                 </li>
                                 <li className="k-drawer-item k-drawer-separator"></li>
-                                <li className="k-drawer-item k-state-hover">
+                                <li className="k-drawer-item k-hover">
                                     <Icon name="star-outline" />
                                 </li>
-                                <li className="k-drawer-item k-state-selected">
+                                <li className="k-drawer-item k-selected">
                                     <Icon name="star-outline" />
                                 </li>
-                                <li className="k-drawer-item k-state-selected k-state-hover">
+                                <li className="k-drawer-item k-selected k-hover">
                                     <Icon name="star-outline" />
                                 </li>
-                                <li className="k-drawer-item k-state-focused">
+                                <li className="k-drawer-item k-focus">
                                     <Icon name="star-outline" />
                                 </li>
                             </ul>

package/src/drawer/tests/drawer-overlay.tsx CHANGED Viewed

@@ -31,19 +31,19 @@ root.render(
                                     <span className="k-item-text">Item</span>
                                 </li>
                                 <li className="k-drawer-item k-drawer-separator"></li>
-                                <li className="k-drawer-item k-state-hover">
+                                <li className="k-drawer-item k-hover">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Hovered Item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-selected">
+                                <li className="k-drawer-item k-selected">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Selected Item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-selected k-state-hover">
+                                <li className="k-drawer-item k-selected k-hover">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Selected and hovered item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-focused">
+                                <li className="k-drawer-item k-focus">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Focused item</span>
                                 </li>
@@ -87,19 +87,19 @@ root.render(
                                     <span className="k-item-text">Item</span>
                                 </li>
                                 <li className="k-drawer-item k-drawer-separator"></li>
-                                <li className="k-drawer-item k-state-hover">
+                                <li className="k-drawer-item k-hover">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Hovered Item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-selected">
+                                <li className="k-drawer-item k-selected">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Selected Item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-selected k-state-hover">
+                                <li className="k-drawer-item k-selected k-hover">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Selected and hovered item</span>
                                 </li>
-                                <li className="k-drawer-item k-state-focused">
+                                <li className="k-drawer-item k-focus">
                                     <Icon name="star-outline" />
                                     <span className="k-item-text">Focused item</span>
                                 </li>

package/src/drawer/tests/drawer-rtl.tsx CHANGED Viewed

@@ -32,19 +32,19 @@ root.render(
                                         <span className="k-item-text">Item</span>
                                     </li>
                                     <li className="k-drawer-item k-drawer-separator"></li>
-                                    <li className="k-drawer-item k-state-hover">
+                                    <li className="k-drawer-item k-hover">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected">
+                                    <li className="k-drawer-item k-selected">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Selected</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-hover">
+                                    <li className="k-drawer-item k-selected k-hover">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Selected hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-focused">
+                                    <li className="k-drawer-item k-focus">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Focus</span>
                                     </li>
@@ -72,19 +72,19 @@ root.render(
                                         <span className="k-item-text">Item</span>
                                     </li>
                                     <li className="k-drawer-item k-drawer-separator"></li>
-                                    <li className="k-drawer-item k-state-hover">
+                                    <li className="k-drawer-item k-hover">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected">
+                                    <li className="k-drawer-item k-selected">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Selected</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-hover">
+                                    <li className="k-drawer-item k-selected k-hover">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Selected hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-focused">
+                                    <li className="k-drawer-item k-focus">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Focus</span>
                                     </li>
@@ -113,11 +113,11 @@ root.render(
                                         <span className="k-item-text">Item</span>
                                     </li>
                                     <li className="k-drawer-item k-drawer-separator"></li>
-                                    <li className="k-drawer-item k-state-hover">
+                                    <li className="k-drawer-item k-hover">
                                         <Icon name="twitter" />
                                         <span className="k-item-text">Hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected">
+                                    <li className="k-drawer-item k-selected">
                                         <Icon name="anchor" />
                                         <span className="k-item-text">Selected</span>
                                     </li>
@@ -131,13 +131,13 @@ root.render(
                                             <span className="k-item-text">Drawer Link</span>
                                         </span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-hover">
+                                    <li className="k-drawer-item k-selected k-hover">
                                         <span className="k-item-text">Selected hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-focused">
+                                    <li className="k-drawer-item k-focus">
                                         <span className="k-item-text">Focus</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-focused">
+                                    <li className="k-drawer-item k-selected k-focus">
                                         <span className="k-item-text">Selected focus</span>
                                     </li>
                                     <li className="k-drawer-item">
@@ -187,11 +187,11 @@ root.render(
                                         <span className="k-item-text">Item</span>
                                     </li>
                                     <li className="k-drawer-item k-drawer-separator"></li>
-                                    <li className="k-drawer-item k-state-hover">
+                                    <li className="k-drawer-item k-hover">
                                         <Icon name="twitter" />
                                         <span className="k-item-text">Hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected">
+                                    <li className="k-drawer-item k-selected">
                                         <Icon name="anchor" />
                                         <span className="k-item-text">Selected</span>
                                     </li>
@@ -205,13 +205,13 @@ root.render(
                                             <span className="k-item-text">Drawer Link</span>
                                         </span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-hover">
+                                    <li className="k-drawer-item k-selected k-hover">
                                         <span className="k-item-text">Selected hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-focused">
+                                    <li className="k-drawer-item k-focus">
                                         <span className="k-item-text">Focus</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-focused">
+                                    <li className="k-drawer-item k-selected k-focus">
                                         <span className="k-item-text">Selected focus</span>
                                     </li>
                                     <li className="k-drawer-item">

package/src/drawer/tests/drawer.tsx CHANGED Viewed

@@ -32,19 +32,19 @@ root.render(
                                         <span className="k-item-text">Item</span>
                                     </li>
                                     <li className="k-drawer-item k-drawer-separator"></li>
-                                    <li className="k-drawer-item k-state-hover">
+                                    <li className="k-drawer-item k-hover">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected">
+                                    <li className="k-drawer-item k-selected">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Selected</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-hover">
+                                    <li className="k-drawer-item k-selected k-hover">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Selected hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-focused">
+                                    <li className="k-drawer-item k-focus">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Focus</span>
                                     </li>
@@ -72,19 +72,19 @@ root.render(
                                         <span className="k-item-text">Item</span>
                                     </li>
                                     <li className="k-drawer-item k-drawer-separator"></li>
-                                    <li className="k-drawer-item k-state-hover">
+                                    <li className="k-drawer-item k-hover">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected">
+                                    <li className="k-drawer-item k-selected">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Selected</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-hover">
+                                    <li className="k-drawer-item k-selected k-hover">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Selected hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-focused">
+                                    <li className="k-drawer-item k-focus">
                                         <Icon name="star-outline" />
                                         <span className="k-item-text">Focus</span>
                                     </li>
@@ -113,11 +113,11 @@ root.render(
                                         <span className="k-item-text">Item</span>
                                     </li>
                                     <li className="k-drawer-item k-drawer-separator"></li>
-                                    <li className="k-drawer-item k-state-hover">
+                                    <li className="k-drawer-item k-hover">
                                         <Icon name="twitter" />
                                         <span className="k-item-text">Hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected">
+                                    <li className="k-drawer-item k-selected">
                                         <Icon name="anchor" />
                                         <span className="k-item-text">Selected</span>
                                     </li>
@@ -131,13 +131,13 @@ root.render(
                                             <span className="k-item-text">Drawer Link</span>
                                         </span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-hover">
+                                    <li className="k-drawer-item k-selected k-hover">
                                         <span className="k-item-text">Selected hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-focused">
+                                    <li className="k-drawer-item k-focus">
                                         <span className="k-item-text">Focus</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-focused">
+                                    <li className="k-drawer-item k-selected k-focus">
                                         <span className="k-item-text">Selected focus</span>
                                     </li>
                                     <li className="k-drawer-item">
@@ -187,11 +187,11 @@ root.render(
                                         <span className="k-item-text">Item</span>
                                     </li>
                                     <li className="k-drawer-item k-drawer-separator"></li>
-                                    <li className="k-drawer-item k-state-hover">
+                                    <li className="k-drawer-item k-hover">
                                         <Icon name="twitter" />
                                         <span className="k-item-text">Hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected">
+                                    <li className="k-drawer-item k-selected">
                                         <Icon name="anchor" />
                                         <span className="k-item-text">Selected</span>
                                     </li>
@@ -205,13 +205,13 @@ root.render(
                                             <span className="k-item-text">Drawer Link</span>
                                         </span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-hover">
+                                    <li className="k-drawer-item k-selected k-hover">
                                         <span className="k-item-text">Selected hover</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-focused">
+                                    <li className="k-drawer-item k-focus">
                                         <span className="k-item-text">Focus</span>
                                     </li>
-                                    <li className="k-drawer-item k-state-selected k-state-focused">
+                                    <li className="k-drawer-item k-selected k-focus">
                                         <span className="k-item-text">Selected focus</span>
                                     </li>
                                     <li className="k-drawer-item">

package/src/editor/tests/editor-angular.tsx CHANGED Viewed

@@ -114,7 +114,7 @@ root.render(
                             <Button icon="image"></Button>
                         </div>
                     </div>
-                    <div className="k-editor-content k-state-focused">
+                    <div className="k-editor-content k-focus">
                         <iframe className="k-iframe" frameBorder="0" src="editor-iFrameContent.html"></iframe>
                     </div>
                 </div>
@@ -159,7 +159,7 @@ root.render(
                             <Button icon="image"></Button>
                         </div>
                     </div>
-                    <div className="k-editor-content k-state-focused"><div className="ProseMirror"><p>The Kendo UI Angular Editor allows your users to edit HTML in a familiar, user-friendly way.</p><p>In this version, the Editor provides the core HTML editing engine which includes basic text formatting, hyperlinks, and lists. The widget <strong>outputs identical HTML</strong> across all major browsers, follows accessibility standards, and provides API for content manipulation.</p><p>Features include:</p><ul><li>Text formatting</li><li>Bulleted and numbered lists</li><li>Hyperlinks</li><li>Cross-browser support</li><li>Identical HTML output across browsers</li></ul></div></div>
+                    <div className="k-editor-content k-focus"><div className="ProseMirror"><p>The Kendo UI Angular Editor allows your users to edit HTML in a familiar, user-friendly way.</p><p>In this version, the Editor provides the core HTML editing engine which includes basic text formatting, hyperlinks, and lists. The widget <strong>outputs identical HTML</strong> across all major browsers, follows accessibility standards, and provides API for content manipulation.</p><p>Features include:</p><ul><li>Text formatting</li><li>Bulleted and numbered lists</li><li>Hyperlinks</li><li>Cross-browser support</li><li>Identical HTML output across browsers</li></ul></div></div>
                 </div>
             </section>

package/src/editor/tests/editor-find-replace.tsx CHANGED Viewed

@@ -43,7 +43,7 @@ root.render(
                         <div className="k-tabstrip k-tabstrip-top k-editor-find-replace">
                             <div className="k-tabstrip-items-wrapper k-hstack">
                                 <ul className="k-tabstrip-items k-reset">
-                                    <li className="k-item k-state-active k-tab-on-top">
+                                    <li className="k-item k-active k-tab-on-top">
                                         <span className="k-link">Find</span>
                                     </li>
                                     <li className="k-item">
@@ -51,7 +51,7 @@ root.render(
                                     </li>
                                 </ul>
                             </div>
-                            <div className="k-tabstrip-content k-state-active">
+                            <div className="k-tabstrip-content k-active">
                                 <div className="k-form k-form-horizontal">
                                     <div className="k-form-field">
                                         <div className="k-form-label">
@@ -110,12 +110,12 @@ root.render(
                                     <li className="k-item">
                                         <span className="k-link">Find</span>
                                     </li>
-                                    <li className="k-item k-state-active k-tab-on-top">
+                                    <li className="k-item k-active k-tab-on-top">
                                         <span className="k-link">Replace</span>
                                     </li>
                                 </ul>
                             </div>
-                            <div className="k-tabstrip-content k-state-active">
+                            <div className="k-tabstrip-content k-active">
                                 <div className="k-form k-form-horizontal">
                                     <div className="k-form-field">
                                         <div className="k-form-label">

package/src/editor/tests/editor-jquery.tsx CHANGED Viewed

@@ -245,7 +245,7 @@ root.render(
             <span></span>
             <section>
                 <div className="k-animation-container" style={{ width: "166px", height: "254px", overflow: "visible", display: "inline-block", position: "relative" }}>
-                    <div className="k-ct-popup k-popup k-group k-reset k-state-border-up" style={{ display: "block", position: "absolute", width: '100%' }}>
+                    <div className="k-ct-popup k-popup k-group k-reset" style={{ display: "block", position: "absolute", width: '100%' }}>
                         <span className="k-ct-cell k-disabled k-selected"></span>
                         <span className="k-ct-cell k-disabled k-selected"></span>
                         <span className="k-ct-cell k-disabled k-selected"></span>

package/src/editor/tests/editor-table-wizard-accessibility.tsx CHANGED Viewed

@@ -39,10 +39,10 @@ root.render(
                                 <ul className="k-tabstrip-items k-reset">
                                     <li className="k-item k-first"><span className="k-loading k-complete"></span><span className="k-link">Table</span></li>
                                     <li className="k-item"><span className="k-loading k-complete"></span><span className="k-link">Cell</span></li>
-                                    <li className="k-item k-last k-tab-on-top k-state-active"><span className="k-loading k-complete"></span><span className="k-link">Accessibility</span></li>
+                                    <li className="k-item k-last k-tab-on-top k-active"><span className="k-loading k-complete"></span><span className="k-link">Accessibility</span></li>
                                 </ul>
                             </div>
-                            <div className="k-tabstrip-content k-state-active">
+                            <div className="k-tabstrip-content k-active">
                                 <div className="k-form k-form-horizontal">
                                     <div className="k-form-field">
                                         <div className="k-form-label">

package/src/fab/fab.tsx CHANGED Viewed

@@ -66,7 +66,7 @@ export class FloatingActionButton extends React.Component<FloatingActionButtonPr
                         [`k-fab-${fillMode}`]: fillMode,
                         [`k-fab-${fillMode}-${themeColor}`]: Boolean(fillMode && themeColor),
                         [`k-rounded-${kendoThemeMaps.roundedMap[rounded!] || rounded}`]: rounded,
-                        [`k-pos-absolute k-${position}`]: position,
+                        [`!k-pos-absolute k-${position}`]: position,
                         'k-hover': hover,
                         'k-focus': focus,
                         'k-active': active,

package/src/filemanager/tests/filemanager-drag-hint.tsx CHANGED Viewed

@@ -59,7 +59,7 @@ root.render(
                                     <span className="k-file-preview"><Icon className="k-file-icon" name="folder" /></span>
                                     <span className="k-file-name">Folder</span>
                                 </div>
-                                <div className="k-listview-item k-state-selected">
+                                <div className="k-listview-item k-selected">
                                     <span className="k-file-preview"><Icon className="k-file-icon" name="file-image" /></span>
                                     <span className="k-file-name">file.png</span>
                                 </div>

package/src/filemanager/tests/filemanager-gridview.tsx CHANGED Viewed

@@ -134,7 +134,7 @@ root.render(
                     </div>
                     {/* Resizing Handle */}
-                    <div className="k-splitbar k-splitbar-horizontal k-splitbar-draggable-horizontal k-filemanager-splitbar-navigation k-state-focused">
+                    <div className="k-splitbar k-splitbar-horizontal k-splitbar-draggable-horizontal k-filemanager-splitbar-navigation k-focus">
                         <span className="k-resize-handle"></span>
                     </div>

package/src/filemanager/tests/filemanager-listview.tsx CHANGED Viewed

@@ -91,7 +91,7 @@ root.render(
                     </div>
                     {/* Resizing Handle */}
-                    <div className="k-splitbar k-splitbar-horizontal k-splitbar-draggable-horizontal k-filemanager-splitbar-navigation k-state-focused">
+                    <div className="k-splitbar k-splitbar-horizontal k-splitbar-draggable-horizontal k-filemanager-splitbar-navigation k-focus">
                         <span className="k-resize-handle"></span>
                     </div>

package/src/filemanager/tests/filemanager-preview.tsx CHANGED Viewed

@@ -84,7 +84,7 @@ root.render(
                                             <td>13/12/2019 at 12:22:04 PM</td>
                                             <td>0</td>
                                         </tr>
-                                        <tr className="k-alt k-state-selected">
+                                        <tr className="k-alt k-selected">
                                             <td>
                                                 <span className="k-file-preview"><Icon className="k-file-icon" name="file" /></span>
                                                 <span className="k-file-name">file.png</span>
@@ -209,7 +209,7 @@ root.render(
                     </div>
                     {/* Resizing Handle */}
-                    <div className="k-splitbar k-splitbar-horizontal k-splitbar-draggable-horizontal k-filemanager-splitbar-navigation k-state-focused">
+                    <div className="k-splitbar k-splitbar-horizontal k-splitbar-draggable-horizontal k-filemanager-splitbar-navigation k-focus">
                         <span className="k-resize-handle"></span>
                     </div>
@@ -287,7 +287,7 @@ root.render(
                                         <col />
                                     </colgroup>
                                     <tbody>
-                                        <tr className="k-state-selected">
+                                        <tr className="k-selected">
                                             <td>
                                                 <span className="k-file-preview"><Icon className="k-file-icon" name="folder" /></span>
                                                 <span className="k-file-name">Folder</span>
@@ -295,7 +295,7 @@ root.render(
                                             <td>13/12/2019 at 12:22:04 PM</td>
                                             <td>0</td>
                                         </tr>
-                                        <tr className="k-alt k-state-selected">
+                                        <tr className="k-alt k-selected">
                                             <td>
                                                 <span className="k-file-preview"><Icon className="k-file-icon" name="file" /></span>
                                                 <span className="k-file-name">file.png</span>

package/src/form/tests/form-field-inputs-angular-rtl.tsx CHANGED Viewed

@@ -197,7 +197,7 @@ root.render(
                                             </span>
                                             <span className="k-file-name-size-wrapper">
                                                 <span className="k-file-name">test long long long long long long long long long long long long long.pdf</span>
-                                                <span className="k-text-success k-file-information">File successfully uploaded.</span>
+                                                <span className="!k-text-success k-file-information">File successfully uploaded.</span>
                                             </span>
                                             <div>
                                                 <strong className="k-upload-status">
@@ -379,7 +379,7 @@ root.render(
                                                 </span>
                                                 <span className="k-file-name-size-wrapper">
                                                     <span className="k-file-name">test long long long long long long long long long long long long long.pdf</span>
-                                                    <span className="k-text-success k-file-information">File successfully uploaded.</span>
+                                                    <span className="!k-text-success k-file-information">File successfully uploaded.</span>
                                                 </span>
                                                 <div>
                                                     <strong className="k-upload-status">

package/src/form/tests/form-field-inputs-angular.tsx CHANGED Viewed

@@ -197,7 +197,7 @@ root.render(
                                             </span>
                                             <span className="k-file-name-size-wrapper">
                                                 <span className="k-file-name">test long long long long long long long long long long long long long.pdf</span>
-                                                <span className="k-text-success k-file-information">File successfully uploaded.</span>
+                                                <span className="!k-text-success k-file-information">File successfully uploaded.</span>
                                             </span>
                                             <div>
                                                 <strong className="k-upload-status">
@@ -379,7 +379,7 @@ root.render(
                                                 </span>
                                                 <span className="k-file-name-size-wrapper">
                                                     <span className="k-file-name">test long long long long long long long long long long long long long.pdf</span>
-                                                    <span className="k-text-success k-file-information">File successfully uploaded.</span>
+                                                    <span className="!k-text-success k-file-information">File successfully uploaded.</span>
                                                 </span>
                                                 <div>
                                                     <strong className="k-upload-status">

package/src/form/tests/form-field-inputs-react.tsx CHANGED Viewed

@@ -172,7 +172,7 @@ root.render(
                                         </span>
                                         <span className="k-file-name-size-wrapper">
                                             <span className="k-file-name">test long long long long long long long long long long long long long.pdf</span>
-                                            <span className="k-file-validation-message k-text-success">File(s) successfully uploaded.</span>
+                                            <span className="k-file-validation-message !k-text-success">File(s) successfully uploaded.</span>
                                         </span>
                                         <strong className="k-upload-status">
                                             <Button fillMode="flat" icon="close" className="k-upload-action"></Button>
@@ -352,7 +352,7 @@ root.render(
                                             </span>
                                             <span className="k-file-name-size-wrapper">
                                                 <span className="k-file-name">test long long long long long long long long long long long long long.pdf</span>
-                                                <span className="k-file-validation-message k-text-success">File(s) successfully uploaded.</span>
+                                                <span className="k-file-validation-message !k-text-success">File(s) successfully uploaded.</span>
                                             </span>
                                             <strong className="k-upload-status">
                                                 <Button fillMode="flat" icon="close" className="k-upload-action"></Button>

package/src/form/tests/form-misc-react.tsx CHANGED Viewed

@@ -42,7 +42,7 @@ root.render(
                     </div>
                     <div className="k-form-field">
-                        <label className="k-label k-text-error">Error:<span className="k-field-info">(field info)</span></label>
+                        <label className="k-label !k-text-error">Error:<span className="k-field-info">(field info)</span></label>
                         <Textbox placeholder="Textbox..." invalid />
                         <div className="k-form-hint k-text-end">Hint: hint message</div>
                         <div className="k-form-error k-text-end">Error: error message</div>
@@ -99,7 +99,7 @@ root.render(
                     </div>
                     <div className="k-form-field">
-                        <label className="k-label k-text-error">Error:<span className="k-field-info">(field info)</span></label>
+                        <label className="k-label !k-text-error">Error:<span className="k-field-info">(field info)</span></label>
                         <div className="k-form-field-wrap">
                             <Textbox placeholder="Textbox..." />
                             <div className="k-form-hint k-text-end">Hint: hint message</div>