v19.2.44 is released

Author: pipeline

config.json

@@ -143,6 +143,8 @@
 		"wip",
 		"validation",
 		"editing",
-		"progressbar"
+		"progressbar",
+		"adaptive-ui",
+		null
 	]
 }

index.html

@@ -154,7 +154,7 @@
                             <span class='sb-download-text'>FREE TRIAL</span>
                         </button>
                     </a>
-                    <a href='https://www.npmjs.com/search?q=ej2-typescript' target="_blank" style=" display: none; ">
+                    <a href='https://www.npmjs.com/search?q=ej2-typescript' target="_blank">
                         <button class='sb-npm-btn'>
                             <img class="npm-svg" src="styles/images/NPM.svg" alt="npm icon"><span class="doc-npm-link">Install NPM</span>
                         </button>
@@ -208,6 +208,14 @@
                         <span class='sb-icons sb-theme-select sb-icon-icon-selection'></span>
                         <span class="switch-text">Bootstrap v4</span>
                     </li>
+					<li class="e-list" id="tailwind">
+                           <span class='sb-icons sb-theme-select sb-icon-icon-selection'></span>
+                           <span class="switch-text">Tailwind</span>
+                    </li>
+                    <!--<li class="e-list" id="tailwind-dark">-->
+                    <!--       <span class='sb-icons sb-theme-select sb-icon-icon-selection'></span>-->
+                    <!--       <span class="switch-text">Tailwind Dark</span>-->
+                    <!--</li>-->
                     <li class="e-list" id="highcontrast">
                         <span class='sb-icons sb-theme-select sb-icon-icon-selection'></span>
                         <span class="switch-text">High Contrast</span>
@@ -231,6 +239,8 @@
                                 <option value="fabric">Fabric</option>
                                 <option value="bootstrap">Bootstrap</option>
                                 <option value="bootstrap4">Bootstrap v4</option>
+                                <!--<option value="tailwind-dark">Tailwind Dark</option>-->
+                                <option value="tailwind">Tailwind</option>
                                 <option value="highcontrast">High Contrast</option>
                             </select>
                         </div>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "@syncfusion/ej2-samples",
-  "version": "19.1.63",
+  "version": "19.2.44",
   "description": "Samples for Syncfusion Essential JS 2",
   "author": "Syncfusion Inc.",
   "license": "SEE LICENSE IN license",

sampleOrder.json

@@ -127,7 +127,6 @@
             "step-area": "Step Area",
             "range-area": "Range Area",
             "stacked-area": "Stacked Area",
-            "stacked-step-area":"Stacked Step Area",
             "stacked-area-100": "100% Stacked Area",
             "area-empty": "Area - Empty Points",
             "area-segments": "Area Zone",
@@ -235,7 +234,6 @@
             "semi-circular-gauge": "Semi-circular Gauge",
             "arc-gauge": "Arc Gauge",
             "legend": "Legend",
-            "gradient-color":"Gradient Color",  
             "compass": "Direction Compass",
             "pointer-image": "Pointer Image",
             "pointer": "Pointer Customization",
@@ -368,8 +366,7 @@
             "remote-data": "Remote Data",
             "crud": "CRUD",
             "venn-diagram": "Venn Diagram",
-            "fishbone-diagram": "Fishbone Diagram",
-            "virtualization":"Virtualization"
+            "fishbone-diagram": "Fishbone Diagram"
         }
     },
     "dialog": {
@@ -384,8 +381,7 @@
             "resizable": "Resizable",
             "position": "Positioning",
             "animation": "Animation",
-            "multiple-dialogs": "Multiple Dialogs",
-            "components-dialog":"Components inside Dialog"
+            "multiple-dialogs": "Multiple Dialogs"
         }
     },
     "document-editor": {
@@ -409,11 +405,7 @@
             "document-protection": "Document Protection",
             "toolbar-customization": "Toolbar Customization",
             "web-layout": "Web Layout",
-            "comments": "Comments",
-            "track-changes":"Track Changes",
-            "form-fields":"Form Fields",
-            "mail-merge":"Mail Merge",
-            "notes":"Footnotes and Endnotes"
+            "comments": "Comments"
         }
     },
     "drop-down-list": {
@@ -436,10 +428,7 @@
             "local-data": "Local Data",
             "remote-data": "Remote Data",
             "icons": "Icons and Images",
-            "checkbox":"Checkbox",
-            "multiple-selection":"Multiple Selection",
-            "template": "Template",
-            "filtering":"Filtering"
+            "template": "Template"
         }
     },
     "file-manager": {
@@ -479,22 +468,18 @@
             "working-time-range": "Working Time Range",
             "holidays": "Holidays",
             "resources": "Resource Allocation",
-            "resource-view":"Resource View",
-            "resource-multi-taskbar":"Resource Multi Taskbar",
             "event-markers": "Event Markers",
             "indicators": "Indicators",
             "baseline": "Baseline",
             "unscheduled-tasks": "Unscheduled Tasks",
             "timeline": "Timeline API",
             "zooming": "Zooming",
             "editing": "Editing",
-            "selection":"Selection",
             "filtering": "Filtering",
             "contextMenu": "Context Menu",
             "exporting": "Exporting",
             "events": "Events",
             "keyboard-interactions": "Keyboard Interactions",
-            "split-tasks":"Split Tasks",
             "column-menu": "Column Menu",
             "show-hide-column": "Show or Hide Column",
             "reorder": "Column Reorder",
@@ -509,8 +494,7 @@
             "sorting": "Default",
             "sorting-api": "Sorting API",
             "taskMode": "Task Scheduling Mode",
-            "drag-and-drop": "Row Drag And Drop",
-            "virtual-scroll":"Virtual Scrolling"
+            "drag-and-drop": "Row Drag And Drop"
         }
     },
     "grid": {
@@ -592,7 +576,6 @@
             "legend": "Legend Placement",
             "large-data": "Large Data",
             "palette": "Palette Mode",
-            "color-range":"Color Range",
             "render-mode": "Rendering mode",
             "tooltip-template": "Tooltip Template"
         }
@@ -612,11 +595,8 @@
             "overview": "Overview",
             "default": "Default Functionalities",
             "swimlane": "Swimlane",
-            "workflow":"Workflow",
             "stacked-header": "Stacked Header",
             "dialog-editing": "Dialog Editing",
-            "search-filter":"Search and Filter Cards",
-            "sorting":"Sorting Cards",
             "local-data": "Local Data",
             "remote-data": "Remote Data",
             "header-template": "Header Template",
@@ -639,7 +619,6 @@
             "data": "Data Sample",
             "axes": "Axes and Pointers",
             "annotation": "Annotation",
-            "gradient-color":"Gradient Color",
             "tooltip": "Tooltip",
             "style": "Styles",
             "export": "Export"
@@ -757,7 +736,9 @@
             "custom-toolbar": "Custom Toolbar",
             "right-to-left": "Right to Left",
             "form-filling": "Form Filling",
-            "hand-written":"Handwritten Signature"
+            "formdesigner": "Form Designer",
+            "annotations": "Annotations",
+            "hand-written": "Handwritten Signature"
         }
     },
     "pivot-table": {
@@ -804,9 +785,7 @@
             "angle": "Angle",
             "custom-content": "Custom Contents",
             "labels": "Labels",
-            "radius": "Radius",
-            "stripes": "Stripes",
-            "progress_segment":"Progress Segment"
+            "radius": "Radius"
         }
     },
     "query-builder": {
@@ -851,7 +830,6 @@
             "client-side-events": "Events",
             "blog-posting": "Use Case",
             "auto-save": "Auto Save",
-            "file-browser":"File Browser",
             "types": "Type",
             "insert-emoticons": "Insert  Emoticons",
             "insert-special-characters": "Insert Special Characters",
@@ -865,7 +843,6 @@
     "schedule": {
         "ControlName": "Scheduler",
         "Samples": {
-            "overview":"Overview",
             "default": "Default Functionalities",
             "local-data": "Local Data",
             "remote-data": "Remote Data",
@@ -875,7 +852,6 @@
             "search-events": "Search Events",
             "timezone": "Timezone",
             "external-drag-drop": "External Drag and Drop",
-            "inline-editing": "Inline Editing",
             "virtual-scrolling": "Virtual Scrolling ",
             "views": "Basic Views",
             "timeline": "Timeline Views",
@@ -899,7 +875,6 @@
             "date-header-template": "Date Header",
             "event-template": "Events",
             "tooltip": "Tooltip",
-            "quick-info-template": "Quick Info Template",
             "editor-validation": "Field Validation",
             "editor-custom-field": "Additional Fields",
             "editor-template": "Editor Template",
@@ -988,7 +963,6 @@
         "Samples": {
             "default": "Default Functionalities",
             "formula": "Formula",
-            "protect-sheet": "Protect Sheet",
             "cell-data-binding": "Cell Data Binding",
             "remote-data-binding": "Remote Data Binding",
             "cell-formatting": "Cell Formatting",

src/auto-complete/custom-filtering.ts

@@ -29,16 +29,19 @@ import * as booksData from './dataSource.json';
             let result: any = fuse.search(e.text);
             // declare  object array for storing filtering results
             let data: { [key: string]: Object; }[] = [];
-            // store the search result to the array
+            // store the search result to the array 
             for (let i: number = 0; i < result.length; i++) {
                 data.push(result[i].item as any);
             }
             // pass the filter data source to updateData method.
             e.updateData(data, null);
             let popupElement: HTMLElement = document.getElementById('books_popup');
-            let lists: Element[] = <NodeListOf<Element> & Element[]>popupElement.querySelectorAll('.e-list-item');
-            // For highlight the typed characters, pass the result data and list items to highlightSearch method.
-            highlightSearch(lists, result);
+            if (popupElement)
+            {
+                let lists: Element[] = <NodeListOf<Element> & Element[]>popupElement.querySelectorAll('.e-list-item');
+                // For highlight the typed characters, pass the result data and list items to highlightSearch method.
+                highlightSearch(lists, result);
+            }
         }
     });
     atcObj.appendTo('#books');

src/auto-complete/template.html

@@ -162,4 +162,15 @@
     .e-bigger:not(.bootstrap) #employees_popup.e-popup .empImage {
         margin: 10px 16px;
     }
+
+    .tailwind #employees_popup .job {
+        margin-top: -7px;
+        margin-bottom: 5px;
+    }
+
+    .e-bigger.tailwind #employees_popup .job {
+        margin-top: -15px;
+        margin-bottom: 5px;
+    }
+
 </style>

src/avatar/card-stack.json

@@ -1 +1 @@
-{"index.html":"<html><head><link href=\"https://cdn.syncfusion.com/ej2/material.css\" rel=\"stylesheet\">\n\n    <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\">\n\n    <style>\n            body{\n                touch-action:none;\n            }\n        </style></head><body><div class=\"stackblitz-container {{theme}}\">\n<div class=\"col-lg-12 control-section\">\n    <div class=\"sample_container\">\n        <!-- Card Component -->\n        <div class=\"e-card e-custom-card\">\n            <div class=\"e-card-header\">\n                <!-- xLarge Circle Avatar-->\n                <div class=\"e-avatar e-avatar-circle e-avatar-xlarge\">\n                    <img src=\"//ej2.syncfusion.com/demos/src/avatar/images/pic02.png\" alt=\"profile_pic\">\n                </div>\n                &nbsp;\n            </div>\n            <div class=\"e-card-header\">\n                <div class=\"e-card-header-caption center\">\n                    <div class=\"e-card-header-title name\">Laura Callahan</div>\n                    <div class=\"e-card-sub-title\">Sales Coordinator</div>\n                </div>\n            </div>\n            <div class=\"e-card-content\">\n                    <p class=\"avatar-content\"> Laura received a BA in psychology from the University of Washington. She has also completed a course\n                        in business French. She reads and writes French.</p>\n            </div>\n        </div>\n    </div>\n</div>\n\n\n\n\n<style>\n    .sample_container {\n        max-width: 300px;\n        margin: auto;\n        min-height: 400px;\n    }\n\n    /* Card Customizations */\n\n    .e-custom-card {\n        position: relative;\n        margin-top: 80px;\n        overflow: visible;\n        border-radius: 15px;\n        box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);\n        transition: 0.2s;\n        border-width: 1px;\n        padding: 1px;\n    }\n\n    .e-custom-card.e-card:hover {\n        border-width: 1px;\n        padding: 1px;\n    }\n\n    .e-custom-card :nth-child(2) .e-card-header-title.name {\n        margin-top: 20px;\n    }\n\n    .sample_container p.avatar-content {\n        line-height: 20px;\n        font-family: inherit;\n    }\n\n    .e-custom-card .e-card-header {\n        text-align: center;\n    }\n\n    .e-custom-card .e-avatar {\n        font-size: 40px;\n        position: absolute;\n        top: calc(0% - 1.5em);\n        left: calc(50% - 1.5em);\n        box-shadow: 0 16px 28px -8px rgba(0, 0, 0, .36), 0 4px 15px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);\n    }\n\n    .e-card.e-custom-card :nth-child(3) {\n        padding: 12px 0px 20px 0px;\n        height: 130px;\n    }\n\n    .e-custom-card.e-card .e-card-header .e-card-header-caption .e-card-header-title {\n        font-size: 24px;\n        font-weight: 500;\n        line-height: normal;\n        color: rgba(83, 101, 132, 0.65);\n        text-shadow: 0 0 0.1px;\n    }\n\n    .e-custom-card.e-card .e-card-header .e-card-header-caption .e-card-sub-title {\n        font-size: 12px;\n        font-weight: 500;\n        line-height: normal;\n        color: rgba(86, 90, 97, 0.65);\n        text-shadow: 0 0 0.1px;\n    }\n\n    .e-custom-card.e-card .e-card-content {\n        overflow: visible;\n        width: auto;\n        margin: -5px 20px 0 20px;\n        word-spacing: 1px;\n    }\n\n    .avatar-content {\n        color: rgba(250, 200, 130, 0.6);\n        margin: 0 auto;\n        text-align: center;\n        color: rgb(94, 94, 94);\n        border: none;\n        padding: 0;\n        font-size: 14px;\n    }\n\n    .avatar-content {\n        margin-bottom: 0;\n    }\n\n    .sample_container .name {\n        margin-top: 10px;\n    }\n\n    .highcontrast .e-custom-card.e-card .avatar-content {\n        color: rgba(255, 255, 255, 0.84);\n    }\n\n    .highcontrast .e-custom-card.e-card .e-card-header .e-card-header-caption .e-card-sub-title {\n        color: rgba(255, 255, 255, 0.45);\n    }\n\n    .highcontrast .e-custom-card.e-card .e-card-header .e-card-header-caption .e-card-header-title {\n        color: rgba(255, 255, 255, 0.84);\n    }\n</style>\n</div></body></html>","index.ts":"{{ripple}}\n/**\n *  Sample for CSS Basic Layout Badge\n */\n\n    \n//\n"}
+{"index.html":"<html><head><link href=\"https://cdn.syncfusion.com/ej2/material.css\" rel=\"stylesheet\">\n\n    <link href=\"https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css\" rel=\"stylesheet\">\n\n    <style>\n            body{\n                touch-action:none;\n            }\n        </style></head><body><div class=\"stackblitz-container {{theme}}\">\n<div class=\"col-lg-12 control-section\">\n    <div class=\"sample_container\">\n        <!-- Card Component -->\n        <div class=\"e-card e-custom-card\">\n            <div class=\"e-card-header\">\n                <!-- xLarge Circle Avatar-->\n                <div class=\"e-avatar e-avatar-circle e-avatar-xlarge\">\n                    <img src=\"//ej2.syncfusion.com/demos/src/avatar/images/pic02.png\" alt=\"profile_pic\">\n                </div>\n                &nbsp;\n            </div>\n            <div class=\"e-card-header\">\n                <div class=\"e-card-header-caption center\">\n                    <div class=\"e-card-header-title name\">Laura Callahan</div>\n                    <div class=\"e-card-sub-title\">Sales Coordinator</div>\n                </div>\n            </div>\n            <div class=\"e-card-content\">\n                    <p class=\"avatar-content\"> Laura received a BA in psychology from the University of Washington. She has also completed a course\n                        in business French. She reads and writes French.</p>\n            </div>\n        </div>\n    </div>\n</div>\n\n\n\n\n<style>\n    .sample_container {\n        max-width: 300px;\n        margin: auto;\n        min-height: 400px;\n    }\n\n    /* Card Customizations */\n\n    .e-custom-card {\n        position: relative;\n        margin-top: 80px;\n        overflow: visible;\n        border-radius: 15px;\n        box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);\n        transition: 0.2s;\n        border-width: 1px;\n        padding: 1px;\n    }\n\n    .e-custom-card.e-card:hover {\n        border-width: 1px;\n        padding: 1px;\n    }\n\n    .e-custom-card :nth-child(2) .e-card-header-title.name {\n        margin-top: 20px;\n    }\n\n    .sample_container p.avatar-content {\n        line-height: 20px;\n        font-family: inherit;\n    }\n\n    .e-custom-card .e-card-header {\n        text-align: center;\n    }\n\n    .e-custom-card .e-avatar {\n        font-size: 40px;\n        position: absolute;\n        top: calc(0% - 1.5em);\n        left: calc(50% - 1.5em);\n        box-shadow: 0 16px 28px -8px rgba(0, 0, 0, .36), 0 4px 15px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);\n    }\n\n    .tailwind .e-custom-card .e-avatar {\n        height: 3em;\n        width: 3em;\n    }\n\n    .e-card.e-custom-card :nth-child(3) {\n        padding: 12px 0px 20px 0px;\n        height: 130px;\n    }\n\n    .e-custom-card.e-card .e-card-header .e-card-header-caption .e-card-header-title {\n        font-size: 24px;\n        font-weight: 500;\n        line-height: normal;\n        color: rgba(83, 101, 132, 0.65);\n        text-shadow: 0 0 0.1px;\n    }\n\n    .e-custom-card.e-card .e-card-header .e-card-header-caption .e-card-sub-title {\n        font-size: 12px;\n        font-weight: 500;\n        line-height: normal;\n        color: rgba(86, 90, 97, 0.65);\n        text-shadow: 0 0 0.1px;\n    }\n\n    .e-custom-card.e-card .e-card-content {\n        overflow: visible;\n        width: auto;\n        margin: -5px 20px 0 20px;\n        word-spacing: 1px;\n    }\n\n    .avatar-content {\n        color: rgba(250, 200, 130, 0.6);\n        margin: 0 auto;\n        text-align: center;\n        color: rgb(94, 94, 94);\n        border: none;\n        padding: 0;\n        font-size: 14px;\n    }\n\n    .avatar-content {\n        margin-bottom: 0;\n    }\n\n    .sample_container .name {\n        margin-top: 10px;\n    }\n\n    .highcontrast .e-custom-card.e-card .avatar-content {\n        color: rgba(255, 255, 255, 0.84);\n    }\n\n    .highcontrast .e-custom-card.e-card .e-card-header .e-card-header-caption .e-card-sub-title {\n        color: rgba(255, 255, 255, 0.45);\n    }\n\n    .highcontrast .e-custom-card.e-card .e-card-header .e-card-header-caption .e-card-header-title {\n        color: rgba(255, 255, 255, 0.84);\n    }\n</style>\n</div></body></html>","index.ts":"{{ripple}}\n/**\n *  Sample for CSS Basic Layout Badge\n */\n\n    \n//\n"}

src/avatar/card.html

@@ -79,6 +79,11 @@
         box-shadow: 0 16px 28px -8px rgba(0, 0, 0, .36), 0 4px 15px 0 rgba(0, 0, 0, .12), 0 8px 10px -5px rgba(0, 0, 0, .2);
     }
 
+    .tailwind .e-custom-card .e-avatar {
+        height: 3em;
+        width: 3em;
+    }
+
     .e-card.e-custom-card :nth-child(3) {
         padding: 12px 0px 20px 0px;
         height: 130px;