npm - @progress/kendo-themes-html - Versions diffs - 5.6.1-dev.4 → 5.6.1-dev.7 - Mend

@progress/kendo-themes-html 5.6.1-dev.4 → 5.6.1-dev.7

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

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

@@ -15,8 +15,8 @@ root.render(
             <span>LTR</span>
             <section>
                 <div className="k-pager k-widget">
-                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="arrow-end-left" /></a>
-                    <a className="k-link k-pager-nav k-focus"><Icon name="arrow-w" /></a>
+                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="caret-alt-to-left" /></a>
+                    <a className="k-link k-pager-nav k-focus"><Icon name="caret-alt-left" /></a>
                     <div className="k-pager-numbers-wrap">
                         <select className="k-picker k-dropdown-list k-dropdown">
                             <option>1</option>
@@ -30,45 +30,45 @@ root.render(
                             <li><a className="k-link k-selected k-focus">6</a></li>
                         </ul>
                     </div>
-                    <a className="k-link k-pager-nav k-hover"><Icon name="arrow-e" /></a>
-                    <a className="k-link k-pager-nav k-pager-last"><Icon name="arrow-end-right" /></a>
+                    <a className="k-link k-pager-nav k-hover"><Icon name="caret-alt-right" /></a>
+                    <a className="k-link k-pager-nav k-pager-last"><Icon name="caret-alt-to-right" /></a>
                     <span className="k-pager-sizes k-label">
                         <DropdownList value="20" />
                         items per page
                     </span>
-                    <a className="k-pager-refresh k-link"><Icon name="reload" /></a>
+                    <a className="k-pager-refresh k-link"><Icon name="arrow-rotate-cw" /></a>
                     <span className="k-pager-info k-label">1 - 20 of 91 items</span>
                 </div>
             </section>
             <section>
                 <div className="k-pager k-widget k-focus">
-                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="arrow-end-left" /></a>
-                    <a className="k-link k-pager-nav k-disabled"><Icon name="arrow-w" /></a>
+                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="caret-alt-to-left" /></a>
+                    <a className="k-link k-pager-nav k-disabled"><Icon name="caret-alt-left" /></a>
                     <span className="k-pager-input k-label">
                         Page
                         <Textbox showClearButton={false} value="999" />
                         of 8
                     </span>
-                    <a className="k-link k-pager-nav"><Icon name="arrow-e" /></a>
-                    <a className="k-link k-pager-nav k-pager-last"><Icon name="arrow-end-right" /></a>
+                    <a className="k-link k-pager-nav"><Icon name="caret-alt-right" /></a>
+                    <a className="k-link k-pager-nav k-pager-last"><Icon name="caret-alt-to-right" /></a>
                     <span className="k-pager-sizes k-label">
                         <DropdownList value="20" />
                         items per page
                     </span>
-                    <a className="k-pager-refresh k-link"><Icon name="reload" /></a>
+                    <a className="k-pager-refresh k-link"><Icon name="arrow-rotate-cw" /></a>
                     <span className="k-pager-info k-label">1 - 20 of 91 items</span>
                 </div>
             </section>
             <section>
                 <div className="k-pager k-widget">
-                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="arrow-end-left" /></a>
-                    <a className="k-link k-pager-nav k-disabled"><Icon name="arrow-w" /></a>
+                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="caret-alt-to-left" /></a>
+                    <a className="k-link k-pager-nav k-disabled"><Icon name="caret-alt-left" /></a>
                     <div className="k-pager-numbers-wrap">
                         <select className="k-picker k-dropdown-list k-dropdown">
                             <option>1</option>
@@ -81,15 +81,15 @@ root.render(
                             <li><a className="k-link">5</a></li>
                         </ul>
                     </div>
-                    <a className="k-link k-pager-nav"><Icon name="arrow-e" /></a>
-                    <a className="k-link k-pager-nav k-pager-last"><Icon name="arrow-end-right" /></a>
+                    <a className="k-link k-pager-nav"><Icon name="caret-alt-right" /></a>
+                    <a className="k-link k-pager-nav k-pager-last"><Icon name="caret-alt-to-right" /></a>
                     <span className="k-pager-sizes k-label">
                         <DropdownList value="20" />
                         items per page
                     </span>
-                    <a className="k-pager-refresh k-link"><Icon name="reload" /></a>
+                    <a className="k-pager-refresh k-link"><Icon name="arrow-rotate-cw" /></a>
                     <span className="k-pager-info k-label">1 - 20 of 91 items</span>
                 </div>
@@ -99,8 +99,8 @@ root.render(
             <span>RTL</span>
             <section>
                 <div className="k-pager k-widget" dir="rtl">
-                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="arrow-end-left" /></a>
-                    <a className="k-link k-pager-nav k-disabled"><Icon name="arrow-w" /></a>
+                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="caret-alt-to-left" /></a>
+                    <a className="k-link k-pager-nav k-disabled"><Icon name="caret-alt-left" /></a>
                     <div className="k-pager-numbers-wrap">
                         <select className="k-picker k-dropdown-list k-dropdown">
                             <option>1</option>
@@ -113,45 +113,45 @@ root.render(
                             <li><a className="k-link">5</a></li>
                         </ul>
                     </div>
-                    <a className="k-link k-pager-nav"><Icon name="arrow-e" /></a>
-                    <a className="k-link k-pager-nav k-pager-last"><Icon name="arrow-end-right" /></a>
+                    <a className="k-link k-pager-nav"><Icon name="caret-alt-right" /></a>
+                    <a className="k-link k-pager-nav k-pager-last"><Icon name="caret-alt-to-right" /></a>
                     <span className="k-pager-sizes k-label">
                         <DropdownList value="20" />
                         items per page
                     </span>
-                    <a className="k-pager-refresh k-link"><Icon name="reload" /></a>
+                    <a className="k-pager-refresh k-link"><Icon name="arrow-rotate-cw" /></a>
                     <span className="k-pager-info k-label">1 - 20 of 91 items</span>
                 </div>
             </section>
             <section>
                 <div className="k-pager k-widget" dir="rtl">
-                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="arrow-end-left" /></a>
-                    <a className="k-link k-pager-nav k-disabled"><Icon name="arrow-w" /></a>
+                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="caret-alt-to-left" /></a>
+                    <a className="k-link k-pager-nav k-disabled"><Icon name="caret-alt-left" /></a>
                     <span className="k-pager-input k-label">
                         Page
                         <Textbox showClearButton={false} value="999" />
                         of 8
                     </span>
-                    <a className="k-link k-pager-nav"><Icon name="arrow-e" /></a>
-                    <a className="k-link k-pager-nav k-pager-last"><Icon name="arrow-end-right" /></a>
+                    <a className="k-link k-pager-nav"><Icon name="caret-alt-right" /></a>
+                    <a className="k-link k-pager-nav k-pager-last"><Icon name="caret-alt-to-right" /></a>
                     <span className="k-pager-sizes k-label">
                         <DropdownList value="20" />
                         items per page
                     </span>
-                    <a className="k-pager-refresh k-link"><Icon name="reload" /></a>
+                    <a className="k-pager-refresh k-link"><Icon name="arrow-rotate-cw" /></a>
                     <span className="k-pager-info k-label">1 - 20 of 91 items</span>
                 </div>
             </section>
             <section>
                 <div className="k-pager k-widget" dir="rtl">
-                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="arrow-end-left" /></a>
-                    <a className="k-link k-pager-nav k-disabled"><Icon name="arrow-w" /></a>
+                    <a className="k-link k-pager-nav k-pager-first k-disabled"><Icon name="caret-alt-to-left" /></a>
+                    <a className="k-link k-pager-nav k-disabled"><Icon name="caret-alt-left" /></a>
                     <div className="k-pager-numbers-wrap">
                         <select className="k-picker k-dropdown-list k-dropdown">
                             <option>1</option>
@@ -164,15 +164,15 @@ root.render(
                             <li><a className="k-link">5</a></li>
                         </ul>
                     </div>
-                    <a className="k-link k-pager-nav"><Icon name="arrow-e" /></a>
-                    <a className="k-link k-pager-nav k-pager-last"><Icon name="arrow-end-right" /></a>
+                    <a className="k-link k-pager-nav"><Icon name="caret-alt-right" /></a>
+                    <a className="k-link k-pager-nav k-pager-last"><Icon name="caret-alt-to-right" /></a>
                     <span className="k-pager-sizes k-label">
                         <DropdownList value="20" />
                         items per page
                     </span>
-                    <a className="k-pager-refresh k-link"><Icon name="reload" /></a>
+                    <a className="k-pager-refresh k-link"><Icon name="arrow-rotate-cw" /></a>
                     <span className="k-pager-info k-label">1 - 20 of 91 items</span>
                 </div>

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

@@ -23,41 +23,39 @@ root.render(
         <style>{styles}</style>
         <div id="test-area" className="k-d-grid k-grid-cols-4">
-            <span className="k-colspan-all k-col-span-full">LTR</span>
             <section>
                 <div className="k-widget k-panelbar">
                     <div className="k-item">
                         <span className="k-link k-header">
-                            <Icon name="cog" />
+                            <Icon name="cog" className="k-panelbar-item-icon" />
                             Root
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
+                            <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                         </span>
                     </div>
                     <div className="k-item">
-                        <span className="k-link k-header k-state-hover">
-                            <span className="k-image"></span>
+                        <span className="k-link k-header k-hover">
+                            <span className="k-image k-panelbar-item-icon"></span>
                             Root hover
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
+                            <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                         </span>
                     </div>
                     <div className="k-item">
-                        <span className="k-link k-header k-state-focus">
+                        <span className="k-link k-header k-focus">
                             <span className="k-sprite"></span>
                             Root focus
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
+                            <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                         </span>
                     </div>
                     <div className="k-item">
-                        <span className="k-link k-header k-state-selected">
+                        <span className="k-link k-header k-selected">
                             Root selected
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
+                            <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                         </span>
                     </div>
                     <div className="k-item">
-                        <span className="k-link k-header k-state-disabled">
+                        <span className="k-link k-header k-disabled">
                             Root disabled
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
+                            <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                         </span>
                     </div>
                     <div className="k-item">
@@ -76,7 +74,7 @@ root.render(
                     <div className="k-item k-expanded">
                         <span className="k-link k-header">
                             Middle expanded
-                            <Icon className="k-panelbar-collapse" name="arrow-n" />
+                            <Icon className="k-panelbar-collapse" name="arrow-chevron-up" />
                         </span>
                         <div>
                             <div className="k-panel k-group">
@@ -84,27 +82,27 @@ root.render(
                                     <span className="k-link">Child</span>
                                 </div>
                                 <div className="k-item">
-                                    <span className="k-link k-state-hover">
+                                    <span className="k-link k-hover">
                                         Child hover
-                                        <Icon className="k-panelbar-expand" name="arrow-s" />
+                                        <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                                     </span>
                                 </div>
                                 <div className="k-item">
-                                    <span className="k-link k-state-focus">
+                                    <span className="k-link k-focus">
                                         Child focus
-                                        <Icon className="k-panelbar-expand" name="arrow-s" />
+                                        <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                                     </span>
                                 </div>
                                 <div className="k-item">
-                                    <span className="k-link k-state-selected">
+                                    <span className="k-link k-selected">
                                         Child selected
-                                        <Icon className="k-panelbar-expand" name="arrow-s" />
+                                        <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                                     </span>
                                 </div>
                                 <div className="k-item k-expanded">
                                     <span className="k-link">
                                         Child expanded
-                                        <Icon className="k-panelbar-collapse" name="arrow-n" />
+                                        <Icon className="k-panelbar-collapse" name="arrow-chevron-up" />
                                     </span>
                                     <div>
                                         <div className="k-panel k-group">
@@ -121,9 +119,9 @@ root.render(
                                     </div>
                                 </div>
                                 <div className="k-item">
-                                    <span className="k-link k-state-disabled">
+                                    <span className="k-link k-disabled">
                                         Child disabled
-                                        <Icon className="k-panelbar-expand" name="arrow-s" />
+                                        <Icon className="k-panelbar-expand" name="arrow-chevron-down" />
                                     </span>
                                 </div>
                                 <div className="k-item">
@@ -147,7 +145,7 @@ root.render(
                     <div className="k-item k-expanded">
                         <span className="k-link k-header">
                             First expanded
-                            <Icon className="k-panelbar-collapse" name="arrow-n" />
+                            <Icon className="k-panelbar-collapse" name="arrow-chevron-up" />
                         </span>
                         <div>
                             <div className="k-panelbar-content">
@@ -176,7 +174,7 @@ root.render(
                     <div className="k-item k-expanded">
                         <span className="k-link k-header">
                             Last expanded
-                            <Icon className="k-panelbar-collapse" name="arrow-n" />
+                            <Icon className="k-panelbar-collapse" name="arrow-chevron-up" />
                         </span>
                         <div>
                             <div className="k-panelbar-content">
@@ -187,172 +185,6 @@ root.render(
                     </div>
                 </div>
             </section>
-            <span className="k-colspan-all k-col-span-full">RTL</span>
-            <section>
-                <div className="k-widget k-panelbar" dir="rtl">
-                    <div className="k-item">
-                        <span className="k-link k-header">
-                            <Icon name="cog" />
-                            Root
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
-                        </span>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header k-state-hover">
-                            <span className="k-image"></span>
-                            Root hover
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
-                        </span>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header k-state-focus">
-                            <span className="k-sprite"></span>
-                            Root focus
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
-                        </span>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header k-state-selected">
-                            Root selected
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
-                        </span>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header k-state-disabled">
-                            Root disabled
-                            <Icon className="k-panelbar-expand" name="arrow-s" />
-                        </span>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header">
-                            Root last
-                        </span>
-                    </div>
-                </div>
-            </section>
-            <section>
-                <div className="k-widget k-panelbar" dir="rtl">
-                    <div className="k-item">
-                        <span className="k-link k-header">First</span>
-                    </div>
-                    <div className="k-item k-expanded">
-                        <span className="k-link k-header">
-                            Middle expanded
-                            <Icon className="k-panelbar-collapse" name="arrow-n" />
-                        </span>
-                        <div>
-                            <div className="k-panel k-group">
-                                <div className="k-item">
-                                    <span className="k-link">Child</span>
-                                </div>
-                                <div className="k-item">
-                                    <span className="k-link k-state-hover">
-                                        Child hover
-                                        <Icon className="k-panelbar-expand" name="arrow-s" />
-                                    </span>
-                                </div>
-                                <div className="k-item">
-                                    <span className="k-link k-state-focus">
-                                        Child focus
-                                        <Icon className="k-panelbar-expand" name="arrow-s" />
-                                    </span>
-                                </div>
-                                <div className="k-item">
-                                    <span className="k-link k-state-selected">
-                                        Child selected
-                                        <Icon className="k-panelbar-expand" name="arrow-s" />
-                                    </span>
-                                </div>
-                                <div className="k-item k-expanded">
-                                    <span className="k-link">
-                                        Child expanded
-                                        <Icon className="k-panelbar-collapse" name="arrow-n" />
-                                    </span>
-                                    <div>
-                                        <div className="k-panel k-group">
-                                            <div className="k-item">
-                                                <span className="k-link">Child</span>
-                                            </div>
-                                            <div className="k-item">
-                                                <span className="k-link">Child</span>
-                                            </div>
-                                            <div className="k-item">
-                                                <span className="k-link">Child</span>
-                                            </div>
-                                        </div>
-                                    </div>
-                                </div>
-                                <div className="k-item">
-                                    <span className="k-link k-state-disabled">
-                                        Child disabled
-                                        <Icon className="k-panelbar-expand" name="arrow-s" />
-                                    </span>
-                                </div>
-                                <div className="k-item">
-                                    <span className="k-link">
-                                        <span className="k-panelbar-item-text">Child last</span>
-                                    </span>
-                                </div>
-                            </div>
-                        </div>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header">
-                            <span className="k-panelbar-item-text">Last</span>
-                        </span>
-                    </div>
-                </div>
-            </section>
-            <section>
-                <div className="k-widget k-panelbar" dir="rtl">
-                    <div className="k-item k-expanded">
-                        <span className="k-link k-header">
-                            First expanded
-                            <Icon className="k-panelbar-collapse" name="arrow-n" />
-                        </span>
-                        <div>
-                            <div className="k-panelbar-content">
-                                <h4>Title in template</h4>
-                                <p>Multi line paragraph in template. Some more content to break onto multiple lines</p>
-                            </div>
-                        </div>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header">Middle</span>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header">Last</span>
-                    </div>
-                </div>
-            </section>
-            <section>
-                <div className="k-widget k-panelbar" dir="rtl">
-                    <div className="k-item">
-                        <span className="k-link k-header">First</span>
-                    </div>
-                    <div className="k-item">
-                        <span className="k-link k-header">Middle</span>
-                    </div>
-                    <div className="k-item k-expanded">
-                        <span className="k-link k-header">
-                            Last expanded
-                            <Icon className="k-panelbar-collapse" name="arrow-n" />
-                        </span>
-                        <div>
-                            <div className="k-panelbar-content">
-                                <h4>Title in template</h4>
-                                <p>Multi line paragraph in template. Some more content to break onto multiple lines</p>
-                            </div>
-                        </div>
-                    </div>
-                </div>
-            </section>
         </div>
     </>
 );