npm - vcomply-workflow-engine - Versions diffs - 2.9.19 → 2.9.20 - Mend

vcomply-workflow-engine 2.9.19 → 2.9.20

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

package/esm2015/lib/confirmation-alert/confirmation-alert.component.js CHANGED Viewed

@@ -15,7 +15,7 @@ ConfirmationAlertComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-confirmation-alert',
                 template: "<!-- <p>confirmation-alert works!</p> -->\r\n<div class=\"confirmation-alert\" [class.warning-color]=\"config?.isRedAlert\">\r\n    <div class=\"confirmation-alert-top\" >\r\n        <span class=\"icon-block\">\r\n            <i class=\"icons\">&#xe930;</i>\r\n        </span>\r\n        <p class=\"text\" *ngIf=\"message\">{{message}}</p>\r\n    </div>\r\n    <div class=\"confirmation-alert-bottom\">\r\n        <p class=\"message\">Are you sure you would like to proceed?</p>\r\n        <div class=\"button-group\">\r\n          <ng-container *ngIf=\"false\">\r\n            <button class=\"outline\" type=\"button\" (click)=\"actionTaken('NO')\">NO</button>\r\n            <button class=\"fill\" type=\"button\" (click)=\"actionTaken('YES')\">Yes</button>\r\n          </ng-container>\r\n          <ng-container >\r\n            <button class=\"fill\" type=\"button\" (click)=\"actionTaken('NO')\">NO</button>\r\n            <button class=\"outline\" type=\"button\" (click)=\"actionTaken('YES')\">Yes</button>\r\n          </ng-container>\r\n\r\n        </div>\r\n    </div>\r\n</div>\r\n",
-                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");.confirmation-alert{display:block;position:absolute;z-index:1;right:0;bottom:0;left:0;background:#161b2f}.confirmation-alert-top{display:flex;align-items:center;justify-content:flex-start;padding:20px}.confirmation-alert.warning-color{background-color:#eb2424}.confirmation-alert.warning-color .confirmation-alert-bottom{border-top:1px solid #ffffff60;background-color:#eb2424}.confirmation-alert.warning-color .confirmation-alert-bottom button.fill{color:#eb2424}.confirmation-alert span.icon-block{height:36px;width:36px;border-radius:50%;background:#fff;border:1px solid #dcdcdc;display:flex;justify-content:center;align-items:center;margin-right:16px}.confirmation-alert span.icon-block i{color:#eb2424;font-size:12px}.confirmation-alert p.text{color:#fff;font-size:14px;font-weight:300;margin:0;width:calc(100% - 52px)}.confirmation-alert-bottom{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 12px 20px;background:#282e48}.confirmation-alert-bottom .button-group{display:flex}.confirmation-alert-bottom p.message{font-size:14px;font-weight:500;margin:0;line-height:20px;color:#fff}.confirmation-alert button{height:24px;width:64px;border:1px solid #000;border-radius:2px;display:flex;align-items:center;justify-content:center;line-height:22px;cursor:pointer;font-size:11px;text-transform:uppercase;font-weight:500;padding:0}.confirmation-alert button+button{margin-left:4px}.confirmation-alert button.fill{background:#fff;color:#1e5dd3;border-color:#fff}.confirmation-alert button.outline{background:transparent;color:#fff;border-color:#fff}"]
+                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";.confirmation-alert{display:block;position:absolute;z-index:1;right:0;bottom:0;left:0;background:#161B2F}.confirmation-alert-top{display:flex;align-items:center;justify-content:flex-start;padding:20px}.confirmation-alert.warning-color{background-color:#eb2424}.confirmation-alert.warning-color .confirmation-alert-bottom{border-top:1px solid #ffffff60;background-color:#eb2424}.confirmation-alert.warning-color .confirmation-alert-bottom button.fill{color:#eb2424}.confirmation-alert span.icon-block{height:36px;width:36px;border-radius:50%;background:#FFFFFF;border:1px solid #DCDCDC;display:flex;justify-content:center;align-items:center;margin-right:16px}.confirmation-alert span.icon-block i{color:#eb2424;font-size:12px}.confirmation-alert p.text{color:#fff;font-size:14px;font-weight:300;margin:0;width:calc(100% - 52px)}.confirmation-alert-bottom{display:flex;align-items:center;justify-content:space-between;padding:12px 12px 12px 20px;background:#282E48}.confirmation-alert-bottom .button-group{display:flex}.confirmation-alert-bottom p.message{font-size:14px;font-weight:500;margin:0;line-height:20px;color:#fff}.confirmation-alert button{height:24px;width:64px;border:1px solid #000;border-radius:2px;display:flex;align-items:center;justify-content:center;line-height:22px;cursor:pointer;font-size:11px;text-transform:uppercase;font-weight:500;padding:0}.confirmation-alert button+button{margin-left:4px}.confirmation-alert button.fill{background:#ffffff;color:#1e5dd3;border-color:#fff}.confirmation-alert button.outline{background:transparent;color:#fff;border-color:#fff}\n"]
             },] }
 ];
 ConfirmationAlertComponent.ctorParameters = () => [];

package/esm2015/lib/create-documents/create-documents.component.js CHANGED Viewed

@@ -126,7 +126,7 @@ CreateDocumentsComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-create-documents',
                 template: "<!-- <p>create-documents works!</p> -->\r\n<div class=\"create-documents\">\r\n    <div class=\"create-documents-container\">\r\n        <div class=\"message-box\">\r\n            <!-- <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/bulb.svg\" alt=\"\"> -->\r\n            <svg version=\"1.1\" id=\"Capa_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 480.8 480.8\" style=\"enable-background:new 0 0 480.8 480.8;\" xml:space=\"preserve\">\r\n                <path style=\"fill:#FFD517;\" d=\"M317.112,314.4c-22.4,22.4-19.6,67.6-19.6,67.6h-113.6c0,0,2.4-45.2-19.6-67.6\r\n                                        c-24.4-21.6-40-52.8-40-87.6c0-64,52-116,116-116s116,52,116,116C356.312,261.6,341.112,292.8,317.112,314.4L317.112,314.4z\" />\r\n                <g>\r\n                    <path style=\"fill:#E5E5E5;\" d=\"M300.712,417.6c0,6-4.8,10.8-10.8,10.8h-98.8c-6,0-10.8-4.8-10.8-10.8l0,0c0-6,4.8-10.8,10.8-10.8\r\n                                            h98.4C295.512,406.8,300.712,411.6,300.712,417.6L300.712,417.6z\" />\r\n                    <path style=\"fill:#E5E5E5;\" d=\"M285.912,462.4c0,6-4.8,10.8-10.8,10.8h-69.2c-6,0-10.8-4.8-10.8-10.8l0,0c0-6,4.8-10.8,10.8-10.8\r\n                                            h69.2C281.112,451.6,285.912,456.4,285.912,462.4L285.912,462.4z\" />\r\n                </g>\r\n                <g>\r\n                    <path style=\"fill:#210B20;\" d=\"M323.112,318.4c26-23.6,40.8-56.8,40.8-91.6c0-68-55.6-123.6-123.6-123.6s-123.6,55.6-123.6,123.6\r\n                                            c0,35.6,15.6,69.6,42,92.8c19.6,19.6,17.6,61.2,17.6,61.6c0,2,0.8,4,2,5.6c1.6,1.6,3.6,2.4,5.6,2.4h113.2c2,0,4-0.8,5.6-2.4\r\n                                            s2-3.6,2-5.6c0-0.4-2-42,17.6-61.6C322.712,319.2,323.112,318.8,323.112,318.4z M311.912,308.4c-0.8,0.4-1.2,1.2-1.6,2\r\n                                            c-17.6,18.8-20.4,49.6-20.8,64h-98c-0.4-14.8-3.6-46.8-22.4-65.6c-23.6-20.8-37.2-50.4-37.2-81.6c0-60,48.8-108.4,108.4-108.4\r\n                                            c60,0,108.4,48.8,108.4,108.4C348.712,258,335.512,288,311.912,308.4z\" />\r\n                    <path style=\"fill:#210B20;\" d=\"M240.312,135.2c-4,0-7.6,3.2-7.6,7.6c0,4,3.2,7.6,7.6,7.6c44.8,0,81.2,36.4,81.2,81.2\r\n                                            c0,4,3.2,7.6,7.6,7.6c4,0,7.6-3.2,7.6-7.6C336.712,178.4,293.512,135.2,240.312,135.2z\" />\r\n                    <path style=\"fill:#210B20;\" d=\"M308.312,417.6c0-10.4-8.4-18.4-18.4-18.4h-98.8c-10.4,0-18.4,8.4-18.4,18.4\r\n                                            c0,10.4,8.4,18.4,18.4,18.4h98.4C299.912,436,308.312,428,308.312,417.6z M289.512,420.8h-98.4c-2,0-3.2-1.6-3.2-3.2\r\n                                            c0-2,1.6-3.2,3.2-3.2h98.4c2,0,3.2,1.6,3.2,3.2C293.112,419.6,291.512,420.8,289.512,420.8z\" />\r\n                    <path style=\"fill:#210B20;\" d=\"M275.112,444h-69.2c-10.4,0-18.4,8.4-18.4,18.4c0,10.4,8.4,18.4,18.4,18.4h69.2\r\n                                            c10.4,0,18.4-8.4,18.4-18.4C293.512,452.4,285.112,444,275.112,444z M275.112,465.6h-69.2c-2,0-3.2-1.6-3.2-3.2\r\n                                            c0-2,1.6-3.2,3.2-3.2h69.2c2,0,3.2,1.6,3.2,3.2C278.312,464.4,277.112,465.6,275.112,465.6z\" />\r\n                    <path style=\"fill:#210B20;\" d=\"M247.912,58.8V7.6c0-4-3.2-7.6-7.6-7.6c-4,0-7.6,3.2-7.6,7.6v51.6c0,4,3.2,7.6,7.6,7.6\r\n                                            C244.712,66.4,247.912,63.2,247.912,58.8z\" />\r\n                    <path style=\"fill:#210B20;\" d=\"M366.312,38c-3.6-2.4-8-1.2-10.4,2l-28.4,42.8c-2.4,3.6-1.2,8,2,10.4c1.2,0.8,2.8,1.2,4,1.2\r\n                                            c2.4,0,4.8-1.2,6.4-3.2l28.4-42.8C370.712,45.2,369.512,40.4,366.312,38z\" />\r\n                    <path style=\"fill:#210B20;\" d=\"M149.912,92.8c1.2,0,2.8-0.4,4-1.2c3.6-2.4,4.4-6.8,2.4-10.4l-27.6-43.2c-2.4-3.6-6.8-4.4-10.4-2.4\r\n                                            c-3.6,2.4-4.4,6.8-2.4,10.4l27.6,43.2C145.112,91.6,147.512,92.8,149.912,92.8z\" />\r\n                    <path style=\"fill:#210B20;\" d=\"M43.912,128.8l45.2,24.4c1.2,0.8,2.4,0.8,3.6,0.8c2.8,0,5.2-1.6,6.8-4c2-3.6,0.8-8.4-3.2-10.4\r\n                                            l-45.2-24.4c-3.6-2-8.4-0.8-10.4,3.2C39.112,122.4,40.312,126.8,43.912,128.8z\" />\r\n                    <path style=\"fill:#210B20;\" d=\"M387.912,154.4c1.2,0,2.4-0.4,3.6-0.8l45.2-24.4c3.6-2,5.2-6.4,3.2-10.4c-2-3.6-6.4-5.2-10.4-3.2\r\n                                            l-45.2,24.4c-3.6,2-5.2,6.4-3.2,10.4C382.312,152.8,385.112,154.4,387.912,154.4z\" />\r\n                </g>\r\n            </svg>\r\n            <p>There are multiple ways to create a policy on VComply. You can either draft it from scratch using\r\n                VComply\u2019s online editor or upload an existing DOCX or PDF file.</p>\r\n        </div>\r\n        <ul>\r\n            <li>\r\n                <label [class.active]=\"selectedDocumentType=='draft'\">\r\n                    <input type=\"radio\" name=\"docType\" (change)=\"changeDocType('draft')\" [checked]=\"selectedDocumentType==='draft'\" >\r\n                    <div class=\"wrapper\" style=\"font-family: unset !important;\">\r\n                        <!-- <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/draft.svg\" alt=\"\"> -->\r\n                        <svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 64 64\" style=\"enable-background:new 0 0 64 64;\" xml:space=\"preserve\">\r\n                            <style type=\"text/css\">\r\n                                .p1{fill:#F8F8F8;}\r\n                                .p2{fill:#747576;}\r\n                                .p3{fill:#BDBDBD;}\r\n                                .p4{fill:#DBDBDB;}\r\n                                .p5{fill:#1E5DD3;}\r\n                                .p6{fill:#FFFFFF;}\r\n                            </style>\r\n                            <path class=\"p1\" d=\"M52,16.2V58c0,1.1-0.9,2-2,2H14c-1.1,0-2-0.9-2-2V6c0-1.1,0.9-2,2-2h25.9\" />\r\n                            <image style=\"overflow:visible;\" width=\"1920\" height=\"1080\" xlink:href=\"94778146.jpg\" transform=\"matrix(1 0 0 1 -8160 -8160)\">\r\n                            </image>\r\n                            <path class=\"p2\" d=\"M52,12v12H12V6c0-1.1,0.9-2,2-2h30\" />\r\n                            <path class=\"p3\" d=\"M44,4v6.7c0,0.7,0.6,1.3,1.3,1.3H52\" />\r\n                            <g>\r\n                                <path class=\"p4\" d=\"M46.2,30.1H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,30.1,46.2,30.1z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"p4\" d=\"M46.2,34.5H17.9c-0.6,0-1-0.4-1-1c0-0.6,0.4-1,1-1h28.3c0.6,0,1,0.4,1,1C47.2,34.1,46.8,34.5,46.2,34.5z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"p4\" d=\"M46.2,39H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,39,46.2,39z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"p4\" d=\"M46.2,43.4H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,43.4,46.2,43.4z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"p4\" d=\"M46.2,47.8H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,47.8,46.2,47.8z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"p4\" d=\"M46.2,52.2H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,52.2,46.2,52.2z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"p4\" d=\"M46.2,56.6H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,56.6,46.2,56.6z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"p6\" d=\"M24.6,16.9c-0.2,0.4-0.6,0.8-1,1s-1,0.4-1.6,0.4h-2v-5.6h2c0.6,0,1.1,0.1,1.6,0.3c0.4,0.2,0.8,0.6,1,1\r\n                                c0.2,0.4,0.4,0.9,0.4,1.5C24.9,16,24.8,16.5,24.6,16.9z M23.3,16.8c0.3-0.3,0.5-0.8,0.5-1.3c0-0.6-0.2-1-0.5-1.4\r\n                                c-0.3-0.3-0.8-0.5-1.4-0.5h-0.8v3.7h0.8C22.5,17.2,23,17.1,23.3,16.8z\" />\r\n                                <path class=\"p6\" d=\"M28.7,18.2L27.4,16h-0.5v2.2h-1.1v-5.6h2.2c0.7,0,1.2,0.2,1.5,0.5s0.5,0.7,0.5,1.3c0,0.4-0.1,0.8-0.4,1.1\r\n                                s-0.6,0.5-1,0.6l1.4,2.3H28.7z M26.9,15.3h0.9c0.6,0,1-0.3,1-0.9c0-0.3-0.1-0.5-0.2-0.6c-0.2-0.2-0.4-0.2-0.7-0.2h-0.9V15.3z\" />\r\n                                <path class=\"p6\" d=\"M34.1,17.1h-2.3l-0.4,1.1h-1.2l2.1-5.6h1.3l2.1,5.6h-1.2L34.1,17.1z M33.8,16.3L33,13.9l-0.8,2.4H33.8z\" />\r\n                                <path class=\"p6\" d=\"M39.8,12.6v0.9h-2.4V15h1.9v0.9h-1.9v2.4h-1.1v-5.6H39.8z\" />\r\n                                <path class=\"p6\" d=\"M44.4,12.6v0.9h-1.6v4.8h-1.1v-4.8h-1.6v-0.9H44.4z\" />\r\n                            </g>\r\n                            <path class=\"p5\" d=\"M32,33.1c-5.2,0-9.4,4.2-9.4,9.4s4.2,9.4,9.4,9.4s9.4-4.2,9.4-9.4C41.4,37.3,37.2,33.2,32,33.1z\" />\r\n                            <g>\r\n                                <path class=\"p6\" d=\"M36.1,40.8l-5.8,5.8L28,44.4l5.8-5.8c0.2-0.2,0.4-0.2,0.6,0l1.7,1.7C36.2,40.4,36.2,40.7,36.1,40.8z\" />\r\n                                <path class=\"p6\" d=\"M36.8,38c-0.5-0.5-1.3-0.5-1.7,0l-0.4,0.3c0,0,0.1,0,0.1,0.1l1.7,1.7c0,0,0,0.1,0.1,0.1l0.4-0.4\r\n                                c0.2-0.2,0.4-0.5,0.4-0.9C37.1,38.5,37,38.2,36.8,38L36.8,38z\" />\r\n                                <path class=\"p6\" d=\"M27.9,44.9l-1,2.6c-0.1,0.1,0,0.2,0.1,0.4c0.1,0.1,0.1,0.1,0.2,0.1c0.1,0,0.1,0,0.1,0l2.6-1L27.9,44.9z\" />\r\n                                <path class=\"p6\" d=\"M30.2,41.3c0.1,0,0.2-0.1,0.2-0.1l2.2-2.2c0.1-0.1,0.3-0.1,0.4-0.1l0.5-0.5c-0.4-0.3-0.9-0.3-1.3,0.1L30,40.7\r\n                                c-0.1,0.1-0.1,0.4,0,0.5C30,41.2,30,41.3,30.2,41.3L30.2,41.3z\" />\r\n                            </g>\r\n                        </svg>\r\n                        <div class=\"label-right\">\r\n                            <div class=\"text\"><strong>Create</strong> a Policy</div>\r\n                            <div class=\"check\">\r\n                                <svg class=\"checkIcon\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n                                    <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n                                    <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n                                </svg>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </label>\r\n            </li>\r\n            <li>\r\n                <label [class.active]=\"selectedDocumentType=='docx'\">\r\n                    <!-- <input type=\"radio\" name=\"docType\"> -->\r\n                    <div class=\"wrapper\" style=\"font-family: unset !important;\">\r\n                        <div class=\"line-progress\" *ngIf=\"selectedDocumentType=='docx' && isUploading\">\r\n                            <div class=\"line-progress-bar\"></div>\r\n                        </div>\r\n                        <!-- <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/docx.svg\" alt=\"\"> -->\r\n                        <!-- <span class=\"text\"  *ngIf=\"!(selectedDocumentType=='docx' && filename)\">Upload a <strong>DOCX</strong></span>\r\n                        <span class=\"text\" *ngIf=\"(selectedDocumentType=='docx') && filename\">\r\n                            {{filename}}\r\n                        </span> -->\r\n                        <svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 64 64\" style=\"enable-background:new 0 0 64 64;\" xml:space=\"preserve\">\r\n                            <style type=\"text/css\">\r\n                                .d1{fill:#F8F8F8;}\r\n                                .d2{fill:#337DBE;}\r\n                                .d3{fill:#3C92DF;}\r\n                                .d4{fill:#DBDBDB;}\r\n                                .d5{fill:#F2BF19;}\r\n                                .d6{fill:#FAFAFA;}\r\n                            </style>\r\n                            <path class=\"d1\" d=\"M52,16.2V58c0,1.1-0.9,2-2,2H14c-1.1,0-2-0.9-2-2V6c0-1.1,0.9-2,2-2h25.9\" />\r\n                            <path class=\"d2\" d=\"M52,12v12H12V6c0-1.1,0.9-2,2-2h30\" />\r\n                            <path class=\"d3\" d=\"M44,4v6.7c0,0.7,0.6,1.3,1.3,1.3H52\" />\r\n                            <g>\r\n                                <path class=\"d4\" d=\"M46.2,30.1H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,30.1,46.2,30.1z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"d4\" d=\"M46.2,34.5H17.9c-0.6,0-1-0.4-1-1c0-0.6,0.4-1,1-1h28.3c0.6,0,1,0.4,1,1C47.2,34.1,46.8,34.5,46.2,34.5z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"d4\" d=\"M46.2,39H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,39,46.2,39z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"d4\" d=\"M46.2,43.4H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,43.4,46.2,43.4z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"d4\" d=\"M46.2,47.8H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,47.8,46.2,47.8z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"d4\" d=\"M46.2,52.2H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,52.2,46.2,52.2z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"d4\" d=\"M46.2,56.6H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,56.6,46.2,56.6z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"d1\" d=\"M25.4,16.9c-0.2,0.4-0.6,0.8-1,1s-1,0.4-1.6,0.4h-2v-5.6h2c0.6,0,1.1,0.1,1.6,0.3c0.4,0.2,0.8,0.6,1,1\r\n                                c0.2,0.4,0.4,0.9,0.4,1.5C25.7,16,25.6,16.5,25.4,16.9z M24.1,16.8c0.3-0.3,0.5-0.8,0.5-1.3c0-0.6-0.2-1-0.5-1.4\r\n                                c-0.3-0.3-0.8-0.5-1.4-0.5h-0.8v3.7h0.8C23.3,17.2,23.8,17.1,24.1,16.8z\" />\r\n                                <path class=\"d1\" d=\"M30.7,12.9c0.4,0.2,0.8,0.6,1,1s0.4,0.9,0.4,1.5s-0.1,1.1-0.4,1.5c-0.2,0.4-0.6,0.8-1,1\r\n                                c-0.4,0.2-0.9,0.4-1.4,0.4c-0.5,0-1-0.1-1.4-0.4c-0.4-0.2-0.8-0.6-1-1c-0.2-0.4-0.4-0.9-0.4-1.5s0.1-1.1,0.4-1.5s0.6-0.8,1-1\r\n                                c0.4-0.2,0.9-0.4,1.4-0.4C29.8,12.5,30.2,12.6,30.7,12.9z M28.4,13.8c-0.3,0.1-0.4,0.4-0.6,0.6c-0.1,0.3-0.2,0.6-0.2,1\r\n                                c0,0.4,0.1,0.7,0.2,1c0.1,0.3,0.3,0.5,0.6,0.6c0.3,0.1,0.5,0.2,0.9,0.2c0.3,0,0.6-0.1,0.9-0.2c0.3-0.1,0.4-0.4,0.6-0.6\r\n                                c0.1-0.3,0.2-0.6,0.2-1c0-0.4-0.1-0.7-0.2-1c-0.1-0.3-0.3-0.5-0.6-0.6c-0.3-0.1-0.5-0.2-0.9-0.2C28.9,13.6,28.6,13.6,28.4,13.8z\" />\r\n                                <path class=\"d1\" d=\"M37.2,13.1c0.5,0.4,0.8,0.9,0.9,1.5H37c-0.1-0.3-0.3-0.5-0.6-0.7c-0.3-0.2-0.6-0.3-0.9-0.3\r\n                                c-0.3,0-0.6,0.1-0.8,0.2s-0.4,0.4-0.6,0.6c-0.1,0.3-0.2,0.6-0.2,1c0,0.4,0.1,0.7,0.2,1c0.1,0.3,0.3,0.5,0.6,0.6s0.5,0.2,0.8,0.2\r\n                                c0.4,0,0.7-0.1,0.9-0.3c0.3-0.2,0.4-0.4,0.6-0.7h1.2c-0.1,0.6-0.5,1.1-0.9,1.5c-0.5,0.4-1,0.5-1.8,0.5c-0.5,0-1-0.1-1.4-0.4\r\n                                c-0.4-0.2-0.7-0.6-1-1c-0.2-0.4-0.3-0.9-0.3-1.5c0-0.6,0.1-1.1,0.3-1.5c0.2-0.4,0.5-0.8,1-1c0.4-0.2,0.9-0.4,1.4-0.4\r\n                                C36.2,12.5,36.8,12.7,37.2,13.1z\" />\r\n                                <path class=\"d1\" d=\"M42.3,18.2L41,16.3l-1.1,1.9h-1.3l1.8-2.9l-1.8-2.8h1.3l1.2,1.9l1.1-1.9h1.3l-1.8,2.8l1.9,2.8H42.3z\" />\r\n                            </g>\r\n                            <path class=\"d5\" d=\"M32,33.1c-5.2,0-9.4,4.2-9.4,9.4s4.2,9.4,9.4,9.4s9.4-4.2,9.4-9.4C41.4,37.3,37.2,33.2,32,33.1z\" />\r\n                            <path class=\"d6\" d=\"M38,41.8l-5.7-5.7c-0.2-0.2-0.4-0.2-0.6,0L26,41.8c-0.1,0.1-0.1,0.2-0.1,0.3c0,0.2,0.2,0.4,0.4,0.4h2.9v6.1\r\n                            c0,0.2,0.2,0.4,0.4,0.4h4.9c0.2,0,0.4-0.2,0.4-0.4v-6.1h2.9c0.2,0,0.3-0.1,0.4-0.3C38.1,42.1,38.1,42,38,41.8z\" />\r\n                        </svg>\r\n                        <div class=\"label-right\">\r\n                            <div class=\"text\">\r\n                                <ng-container *ngIf=\"!(selectedDocumentType=='docx' && filename)\">Upload a <strong>DOCX</strong></ng-container>\r\n                                <ng-container *ngIf=\"(selectedDocumentType=='docx') && filename\">{{filename}}</ng-container>\r\n                            </div>\r\n                            <div class=\"check\">\r\n                                <svg class=\"checkIcon\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n                                    <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n                                    <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n                                </svg>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                    <input type=\"file\" accept=\".docx\" id=\"DOCfile\" hidden\r\n                    (change)=\"handleFileInput($event.target.files)\" onclick=\"event.stopPropagation();\" #docxUploadButton>\r\n                </label>\r\n            </li>\r\n            <li>\r\n                <label [class.active]=\"selectedDocumentType=='pdf'\">\r\n                    <!-- <input type=\"radio\" name=\"docType\"> -->\r\n                    <input type=\"file\" accept=\".pdf\" id=\"PDFfile\" hidden\r\n                    (change)=\"handleFileInput($event.target.files)\" onclick=\"event.stopPropagation();\" #pdfUploadButton>\r\n                    <div class=\"wrapper\" style=\"font-family: unset !important;\">\r\n                        <div class=\"line-progress\" *ngIf=\"selectedDocumentType=='pdf' && isUploading\">\r\n                            <div class=\"line-progress-bar\"></div>\r\n                        </div>\r\n                        <!-- <img src=\"https://cdn.v-comply.com/libraries/workflow-engine/assets/workflow/pdf.svg\" alt=\"\">\r\n                        <div class=\"text\" *ngIf=\"!(selectedDocumentType=='pdf' && filename)\">Upload a\r\n                            <strong>PDF</strong>\r\n                        </div>\r\n                        <div class=\"text\" *ngIf=\"(selectedDocumentType=='pdf') && filename\">\r\n                            {{filename}}\r\n                        </div> -->\r\n                        <svg version=\"1.1\" id=\"Layer_1\" xmlns=\"http://www.w3.org/2000/svg\" xmlns:xlink=\"http://www.w3.org/1999/xlink\" x=\"0px\" y=\"0px\" viewBox=\"0 0 64 64\" style=\"enable-background:new 0 0 64 64;\" xml:space=\"preserve\">\r\n                            <style type=\"text/css\">\r\n                                .pd1{fill:#F8F8F8;}\r\n                                .pd2{fill:#EE3939;}\r\n                                .pd3{fill:#F95858;}\r\n                                .pd4{fill:#DBDBDB;}\r\n                                .pd5{fill:#34AA44;}\r\n                                .pd6{fill:#FAFAFA;}\r\n                            </style>\r\n                            <path class=\"pd1\" d=\"M52,16.2V58c0,1.1-0.9,2-2,2H14c-1.1,0-2-0.9-2-2V6c0-1.1,0.9-2,2-2h25.9\" />\r\n                            <path class=\"pd2\" d=\"M52,12v12H12V6c0-1.1,0.9-2,2-2h30\" />\r\n                            <path class=\"pd3\" d=\"M44,4v6.7c0,0.7,0.6,1.3,1.3,1.3H52\" />\r\n                            <g>\r\n                                <path class=\"pd4\" d=\"M46.2,30.1H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,30.1,46.2,30.1z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"pd4\" d=\"M46.2,34.5H17.9c-0.6,0-1-0.4-1-1c0-0.6,0.4-1,1-1h28.3c0.6,0,1,0.4,1,1C47.2,34.1,46.8,34.5,46.2,34.5z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"pd4\" d=\"M46.2,39H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,39,46.2,39z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"pd4\" d=\"M46.2,43.4H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,43.4,46.2,43.4z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"pd4\" d=\"M46.2,47.8H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,47.8,46.2,47.8z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"pd4\" d=\"M46.2,52.2H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,52.2,46.2,52.2z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"pd4\" d=\"M46.2,56.6H17.9c-0.6,0-1-0.4-1-1s0.4-1,1-1h28.3c0.6,0,1,0.4,1,1S46.8,56.6,46.2,56.6z\" />\r\n                            </g>\r\n                            <g>\r\n                                <path class=\"pd1\" d=\"M26.2,16.2v2.1h-1.1v-5.6h2.1c0.7,0,1.2,0.2,1.5,0.5c0.3,0.3,0.5,0.8,0.5,1.3c0,0.5-0.2,1-0.5,1.3\r\n                                c-0.3,0.3-0.8,0.5-1.5,0.5H26.2z M28,14.4c0-0.3-0.1-0.5-0.2-0.6c-0.2-0.1-0.4-0.2-0.8-0.2h-0.8v1.7H27C27.7,15.2,28,15,28,14.4z\" />\r\n                                <path class=\"pd1\" d=\"M34.5,16.9c-0.2,0.4-0.6,0.8-1,1s-1,0.4-1.6,0.4h-2v-5.6h2c0.6,0,1.1,0.1,1.6,0.3c0.4,0.2,0.8,0.6,1,1\r\n                                c0.2,0.4,0.4,0.9,0.4,1.5C34.8,16,34.7,16.5,34.5,16.9z M33.2,16.8c0.3-0.3,0.5-0.8,0.5-1.3c0-0.6-0.2-1-0.5-1.4\r\n                                c-0.3-0.3-0.8-0.5-1.4-0.5H31v3.7h0.8C32.4,17.2,32.9,17.1,33.2,16.8z\" />\r\n                                <path class=\"pd1\" d=\"M39.2,12.6v0.9h-2.4V15h1.9v0.9h-1.9v2.4h-1.1v-5.6H39.2z\" />\r\n                            </g>\r\n                            <path class=\"pd5\" d=\"M32,33.1c-5.2,0-9.4,4.2-9.4,9.4s4.2,9.4,9.4,9.4s9.4-4.2,9.4-9.4C41.4,37.3,37.2,33.2,32,33.1z\" />\r\n                            <path class=\"pd6\" d=\"M38,41.8l-5.7-5.7c-0.2-0.2-0.4-0.2-0.6,0L26,41.8c-0.1,0.1-0.1,0.2-0.1,0.3c0,0.2,0.2,0.4,0.4,0.4h2.9v6.1\r\n                            c0,0.2,0.2,0.4,0.4,0.4h4.9c0.2,0,0.4-0.2,0.4-0.4v-6.1h2.9c0.2,0,0.3-0.1,0.4-0.3C38.1,42.1,38.1,42,38,41.8z\" />\r\n                        </svg>\r\n                        <div class=\"label-right\">\r\n                            <div class=\"text\">\r\n                                <ng-container *ngIf=\"!(selectedDocumentType=='pdf' && filename)\">Upload a <strong>PDF</strong></ng-container>\r\n                                <ng-container *ngIf=\"(selectedDocumentType=='pdf') && filename\">{{filename}}</ng-container>\r\n                            </div>\r\n                            <div class=\"check\">\r\n                                <svg class=\"checkIcon\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n                                    <circle class=\"checkIcon__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n                                    <path class=\"checkIcon__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n                                </svg>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                </label>\r\n            </li>\r\n        </ul>\r\n    </div>\r\n</div>\r\n<div class=\"bottom-button\">\r\n    <button type=\"button\" class=\"back\" (click)=\"editPolicyEmit()\"><i class=\"icons\">&#xe91d;</i> Back</button>\r\n    <button type=\"button\" class=\"next\" (click)=\"editor(selectedDocumentType)\" [class.disabled]=\"!selectedDocumentType\">Next <i class=\"icons\">&#xe91e;</i></button>\r\n</div>\r\n",
-                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");.create-documents{display:flex;align-items:center;height:calc(100vh - 50px);position:absolute;top:0;right:0;background:#fff;z-index:10;padding:10%}.create-documents-container .message-box{background:#fbfbfb;border-radius:4px;border:1px solid #f1f1f1;padding:16px 8px 12px 16px;margin-bottom:20px;display:flex;align-items:flex-start}.create-documents-container .message-box img,.create-documents-container .message-box svg{background:#fff;width:33px;min-width:33px;border-radius:4px;box-shadow:0 3px 6px #1e5dd333;margin-right:12px;padding:4px}.create-documents-container .message-box p{font-size:12px;font-weight:500;color:#747576;margin:0}.create-documents-container ul{padding:0;margin:0;display:block}.create-documents-container ul li{list-style:none;display:block}.create-documents-container ul li label{margin:0;position:relative;display:block;cursor:pointer}.create-documents-container ul li label .wrapper{display:flex;align-items:center;padding:0 50px 0 80px;border:1px solid #dbdbdb;border-radius:4px;width:100%;background:transparent;justify-content:center;position:relative;height:100px}.create-documents-container ul li label .wrapper img,.create-documents-container ul li label .wrapper svg{width:82px;position:absolute;left:0;top:8px}.create-documents-container ul li label .wrapper .label-right{width:100%;display:block}.create-documents-container ul li label .wrapper .label-right .text{font-size:16px;line-height:24px;color:#747576;display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-align:center}.create-documents-container ul li label .wrapper .label-right .text strong{font-weight:500}.create-documents-container ul li label .wrapper .label-right .check{display:none;width:32px;height:32px;position:absolute;right:14px;top:33px}.create-documents-container ul li label .wrapper .label-right .check .checkIcon{width:32px;height:32px;background:#fff;border-radius:50%;stroke-width:4;stroke:#34aa44;stroke-miterlimit:10;box-shadow:inset 0 0 0 #34aa44;-webkit-animation:fillCheck .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;animation:fillCheck .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;margin-right:10px;position:static}.create-documents-container ul li label .wrapper .label-right .check .checkIcon__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;-webkit-animation:strokeCheck .6s cubic-bezier(.65,0,.45,1) forwards;animation:strokeCheck .6s cubic-bezier(.65,0,.45,1) forwards}.create-documents-container ul li label .wrapper .label-right .check .checkIcon__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;-webkit-animation:strokeCheck .3s cubic-bezier(.65,0,.45,1) .8s forwards;animation:strokeCheck .3s cubic-bezier(.65,0,.45,1) .8s forwards}.create-documents-container ul li label input{width:100%;position:absolute;top:0;right:0;bottom:0;left:0;margin:0;padding:0;z-index:1;opacity:0;height:100%;pointer-events:none}.create-documents-container ul li label input:checked+span.wrapper{background:#eefcf0;border-color:#34aa44}.create-documents-container ul li label input:checked+span.wrapper span.check{visibility:visible}.create-documents-container ul li label.active .wrapper{background:#eefcf0;border:1px solid #34aa44}.create-documents-container ul li label.active .wrapper .label-right .text{max-width:250px}.create-documents-container ul li label.active .wrapper .label-right .check{display:block}.create-documents-container ul li+li{margin-top:8px}.bottom-button{background:#fff;display:flex;align-items:center;position:absolute;bottom:0;right:0;width:100%;z-index:10}.bottom-button button{background:#1e5dd3;border:none;border-radius:0;color:#fff;font-size:13px;font-weight:600;text-transform:uppercase;width:100%;padding:0;position:relative;margin:0!important}.bottom-button button i{position:absolute;top:16px;font-size:18px;font-weight:500}.bottom-button button.next i{right:16px}.bottom-button button.back{background:#f1f1f1;color:#1e5dd3}.bottom-button button.back i{left:16px}@-webkit-keyframes strokeCheck{to{stroke-dashoffset:0}}@keyframes strokeCheck{to{stroke-dashoffset:0}}@-webkit-keyframes fillCheck{to{box-shadow:inset 0 0 0 2px #34aa44}}@keyframes fillCheck{to{box-shadow:inset 0 0 0 2px #34aa44}}button{height:50px;display:flex;align-items:center;justify-content:center;font-size:13px;line-height:19px;letter-spacing:3.08px;color:#fff;background:#1e5dd3;cursor:pointer;border:1px solid #1e5dd3;outline:none;border-radius:0;text-transform:uppercase;font-weight:600;width:164px;bottom:0}disabled{pointer-events:none!important;opacity:.3!important;filter:grayscale(1)!important}.line-progress{position:absolute;left:0;top:0;height:2px;display:block;width:100%;background-color:#d4e2fc;background-clip:padding-box;overflow:hidden}.line-progress-bar{bottom:0;width:40%;background:#4681ef;border-radius:5px;display:inline-block;position:absolute;-webkit-animation:linear infinite;animation:linear infinite;-webkit-animation-name:run;animation-name:run;-webkit-animation-duration:1s;animation-duration:1s;top:0}@keyframes run{0%{left:0}50%{left:60%}to{left:0}}@-webkit-keyframes run{0%{left:0}50%{left:60%}to{left:0}}"]
+                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";.create-documents{display:flex;align-items:center;height:calc(100vh - 50px);position:absolute;top:0px;right:0px;background:white;z-index:10;padding:10%}.create-documents-container .message-box{background:#FBFBFB;border-radius:4px;border:1px solid #F1F1F1;padding:16px 8px 12px 16px;margin-bottom:20px;display:flex;align-items:flex-start}.create-documents-container .message-box img,.create-documents-container .message-box svg{background:#FFFFFF;width:33px;min-width:33px;border-radius:4px;box-shadow:0 3px 6px #1e5dd333;margin-right:12px;padding:4px}.create-documents-container .message-box p{font-size:12px;font-weight:500;color:#747576;margin:0}.create-documents-container ul{padding:0;margin:0;display:block}.create-documents-container ul li{list-style:none;display:block}.create-documents-container ul li label{margin:0;position:relative;display:block;cursor:pointer}.create-documents-container ul li label .wrapper{display:flex;align-items:center;padding:0 50px 0 80px;border:1px solid #DBDBDB;border-radius:4px;width:100%;background:transparent;justify-content:center;position:relative;height:100px}.create-documents-container ul li label .wrapper img,.create-documents-container ul li label .wrapper svg{width:82px;position:absolute;left:0;top:8px}.create-documents-container ul li label .wrapper .label-right{width:100%;display:block}.create-documents-container ul li label .wrapper .label-right .text{font-size:16px;line-height:24px;color:#747576;display:block;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;text-align:center}.create-documents-container ul li label .wrapper .label-right .text strong{font-weight:500}.create-documents-container ul li label .wrapper .label-right .check{display:none;width:32px;height:32px;position:absolute;right:14px;top:33px}.create-documents-container ul li label .wrapper .label-right .check .checkIcon{width:32px;height:32px;background:#ffffff;border-radius:50%;stroke-width:4;stroke:#34aa44;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fillCheck .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;margin-right:10px;position:static}.create-documents-container ul li label .wrapper .label-right .check .checkIcon__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:strokeCheck .6s cubic-bezier(.65,0,.45,1) forwards}.create-documents-container ul li label .wrapper .label-right .check .checkIcon__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:strokeCheck .3s cubic-bezier(.65,0,.45,1) .8s forwards}.create-documents-container ul li label input{width:100%;position:absolute;top:0;right:0;bottom:0;left:0;margin:0;padding:0;z-index:1;opacity:0;height:100%;pointer-events:none}.create-documents-container ul li label input:checked+span.wrapper{background:#EEFCF0;border-color:#34aa44}.create-documents-container ul li label input:checked+span.wrapper span.check{visibility:visible}.create-documents-container ul li label.active .wrapper{background:#EEFCF0;border:1px solid #34AA44}.create-documents-container ul li label.active .wrapper .label-right .text{max-width:250px}.create-documents-container ul li label.active .wrapper .label-right .check{display:block}.create-documents-container ul li+li{margin-top:8px}.bottom-button{background:#fff;display:flex;align-items:center;position:absolute;bottom:0;right:0;width:100%;z-index:10}.bottom-button button{background:#1E5DD3;border:none;border-radius:0;color:#fff;font-size:13px;font-weight:600;text-transform:uppercase;width:100%;padding:0;position:relative;margin:0!important}.bottom-button button i{position:absolute;top:16px;font-size:18px;font-weight:500}.bottom-button button.next i{right:16px}.bottom-button button.back{background:#F1F1F1;color:#1e5dd3}.bottom-button button.back i{left:16px}@keyframes strokeCheck{to{stroke-dashoffset:0}}@keyframes fillCheck{to{box-shadow:inset 0 0 0 2px #34aa44}}button{height:50px;display:flex;align-items:center;justify-content:center;font-size:13px;line-height:19px;letter-spacing:3.08px;color:#fff;background:#1e5dd3;cursor:pointer;border:1px solid #1e5dd3;outline:none;border-radius:0;text-transform:uppercase;font-weight:600;width:164px;bottom:0}disabled{pointer-events:none!important;opacity:.3!important;filter:grayscale(1)!important}.line-progress{position:absolute;left:0;top:0;height:2px;display:block;width:100%;background-color:#d4e2fc;background-clip:padding-box;overflow:hidden}.line-progress-bar{bottom:0;width:40%;background:#4681ef;border-radius:5px;display:inline-block;position:absolute;animation:linear infinite;animation-name:run;animation-duration:1s;top:0}@keyframes run{0%{left:0}50%{left:60%}to{left:0}}\n"]
             },] }
 ];
 CreateDocumentsComponent.ctorParameters = () => [

package/esm2015/lib/formgroup/cs-checkbox/cs-checkbox.component.js CHANGED Viewed

@@ -16,7 +16,7 @@ CsCheckboxComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-cs-checkbox',
                 template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\" (click)=\"chileClick($event)\">\r\n  <input type=\"checkbox\" [name]=\"value\"  [disabled]=\"disabled\" [disabled]=\"readonly\" [class.enable]=\"readonly\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\r\n  <span class=\"checkbox\">\r\n    <span class=\"inner\"></span>\r\n  </span>\r\n  <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\" *ngIf=\"!oneLine\">\r\n    <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n    <path class=\"checkmark__check\" fill=\"none\" d=\"M14.1 27.2l7.1 7.2 16.7-16.8\" />\r\n  </svg>\r\n  <svg id=\"check\" viewBox=\"-281 373 48 48\" *ngIf=\"oneLine\">\r\n    <path id=\"check-stroke\" d=\"M-273.2,398.2l10,9.9 l22.4-22.3\"/>\r\n  </svg>\r\n  <span class=\"value\"><ng-content></ng-content></span>\r\n</label>\r\n",
-                styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:relative;padding:2px;margin-top:0}label.checkbox-item span.value{color:#747576;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}label.checkbox-item input[type=checkbox].enable:disabled~*{opacity:1}label.checkbox-item.disabled{pointer-events:none}.disabled{opacity:.4!important}.checkmark{width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 0 #34aa44;-webkit-animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark.checked{-webkit-animation:fill 0s ease-in-out 0s forwards,scale 0s ease-in-out 0s both;animation:fill 0s ease-in-out 0s forwards,scale 0s ease-in-out 0s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;-webkit-animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__circle.checked{-webkit-animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards;animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;-webkit-animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}.checkmark__check.checked{-webkit-animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards;animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards}#check{width:100%}#check-stroke{stroke:#34aa44;fill:none;stroke-width:4;stroke-linecap:round;-webkit-animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards;stroke-dasharray:100%,200%}@-webkit-keyframes stroke{to{stroke-dashoffset:0}}@keyframes stroke{to{stroke-dashoffset:0}}@-webkit-keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@-webkit-keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}"]
+                styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:relative;padding:2px;margin-top:0}label.checkbox-item span.value{color:#747576;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}label.checkbox-item input[type=checkbox].enable:disabled~*{opacity:1}label.checkbox-item.disabled{pointer-events:none}.disabled{opacity:.4!important}.checkmark{width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark.checked{animation:fill 0s ease-in-out 0s forwards,scale 0s ease-in-out 0s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__circle.checked{animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}.checkmark__check.checked{animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards}#check{width:100%}#check-stroke{stroke:#34aa44;fill:none;stroke-width:4;stroke-linecap:round;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards;stroke-dasharray:100%,200%}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale(1.1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"]
             },] }
 ];
 CsCheckboxComponent.ctorParameters = () => [];

package/esm2015/lib/formgroup/cs-checkbox-indeterminate/cs-checkbox-indeterminate.component.js CHANGED Viewed

@@ -20,7 +20,7 @@ CsCheckboxIndeterminateComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-cs-checkbox-indeterminate',
                 template: "<label class=\"checkbox-item\" [class.disabled]=\"disabled\" (click)=\"chileClick($event)\">\r\n    <input type=\"checkbox\" [name]=\"value\" [disabled]=\"disabled\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" />\r\n    <span class=\"checkbox\">\r\n      <span class=\"inner\"></span>\r\n    </span>\r\n    <svg class=\"checkmark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\">\r\n      <circle class=\"checkmark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n      <path fill=\"none\" d=\"M37.9,27H14v-2h23.9V27z\"/>\r\n    </svg>\r\n    <span class=\"value\"><ng-content></ng-content></span>\r\n  </label>\r\n  ",
-                styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;max-width:100%;position:relative;padding:0 0 0 24px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;left:0;top:0;padding:2px;margin-top:0}label.checkbox-item span.value{display:block;color:#747576;font-size:14px;line-height:16px;font-weight:400;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 0 #34aa44;-webkit-animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;-webkit-animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;-webkit-animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@-webkit-keyframes stroke{to{stroke-dashoffset:0}}@keyframes stroke{to{stroke-dashoffset:0}}@-webkit-keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@-webkit-keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}"]
+                styles: ["label.checkbox-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;max-width:100%;position:relative;padding:0 0 0 24px}label.checkbox-item span{display:inline-flex;align-items:center;justify-content:center}label.checkbox-item span.checkbox{height:16px;width:16px;border-radius:2px;border:1px solid #dbdbdb;position:absolute;left:0;top:0;padding:2px;margin-top:0}label.checkbox-item span.value{display:block;color:#747576;font-size:14px;line-height:16px;font-weight:400;max-width:calc(100% - 26px)}label.checkbox-item span.value:empty{display:none}label.checkbox-item svg{display:none;margin-top:0}label.checkbox-item input[type=checkbox]{display:none}label.checkbox-item input[type=checkbox]:checked~svg{display:block}label.checkbox-item input[type=checkbox]:checked+.checkbox{display:none}label.checkbox-item input[type=checkbox]:disabled~*{opacity:.7}.disabled{opacity:.4!important}.checkmark{position:absolute;left:0;top:0;width:16px;height:16px;border-radius:2px;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.checkmark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.checkmark__check{transform-origin:50% 50%;stroke-dasharray:48;stroke-dashoffset:48;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale(1.1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"]
             },] }
 ];
 CsCheckboxIndeterminateComponent.ctorParameters = () => [];

package/esm2015/lib/formgroup/cs-radio/cs-radio.component.js CHANGED Viewed

@@ -13,7 +13,7 @@ CsRadioComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-cs-radio',
                 template: "<label class=\"radio-item\">\r\n  <input type=\"radio\" [disabled]=\"disabled\" [disabled]=\"readonly\" [class.enable]=\"readonly\" [name]=\"name\" [value]=\"value\" [checked]=\"checked\" (change)=\"changeState($event)\" />\r\n  <span class=\"radio\">\r\n    <span class=\"inner\"></span>\r\n  </span>\r\n  <svg class=\"radiomark\" xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 52 52\" *ngIf=\"!oneLine\">\r\n    <circle class=\"radiomark__circle\" cx=\"26\" cy=\"26\" r=\"25\" fill=\"none\" />\r\n    <circle class=\"radiomark__check\" cx=\"26\" cy=\"26\" r=\"5\" fill=\"none\" />\r\n  </svg>\r\n  <svg id=\"check\" viewBox=\"-281 373 48 48\" *ngIf=\"oneLine\">\r\n\t\t<path id=\"check-stroke\" d=\"M-273.2,398.2l10,9.9 l22.4-22.3\"/>\r\n\t</svg>\r\n  <span class=\"value\"><ng-content></ng-content></span>\r\n</label>\r\n",
-                styles: ["label{max-width:600px}label.radio-item{cursor:pointer;margin:0;padding:0;max-width:100%}label.radio-item,label.radio-item span{display:inline-flex;align-items:center}label.radio-item span.radio{background:#fff;height:16px;width:16px;border-radius:50%;border:1px solid #dbdbdb;position:relative;padding:5px;margin-top:0}label.radio-item span.radio .inner{height:10px;width:10px;border-radius:50%;background:#fff;display:none}label.radio-item span.value{color:#747576;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.radio-item span.value:empty{display:none}label.radio-item svg{display:none;margin-top:0}label.radio-item input[type=radio],label.radio-item input[type=radio]:checked+span.radio{display:none}label.radio-item input[type=radio]:checked~svg{display:block}label.radio-item input[type=radio]:disabled~*{opacity:.7}label.radio-item input[type=radio].enable:disabled~*{opacity:1}.radiomark{width:16px;height:16px;border-radius:50%;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 0 #34aa44;-webkit-animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.radiomark.checked{-webkit-animation:fill 0s ease-in-out 0s forwards,scale 0s ease-in-out 0s both;animation:fill 0s ease-in-out 0s forwards,scale 0s ease-in-out 0s both}.radiomark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;-webkit-animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.radiomark__circle.checked{-webkit-animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards;animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards}.radiomark__check{stroke-dasharray:100;stroke-dashoffset:100;stroke-width:10;-webkit-animation:stroke .3s cubic-bezier(.65,0,.45,1) 0s forwards;animation:stroke .3s cubic-bezier(.65,0,.45,1) 0s forwards}.radiomark__check.checked{-webkit-animation:stroke 0s cubic-bezier(.65,0,.45,1) 0s forwards;animation:stroke 0s cubic-bezier(.65,0,.45,1) 0s forwards}#check{width:100%}#check-stroke{stroke:#34aa44;fill:none;stroke-width:4;stroke-linecap:round;-webkit-animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards;stroke-dasharray:100%,200%}#check-stroke.checked{-webkit-animation:stroke 0s cubic-bezier(.65,0,.45,1) 0s forwards;animation:stroke 0s cubic-bezier(.65,0,.45,1) 0s forwards}@-webkit-keyframes stroke{to{stroke-dashoffset:0}}@keyframes stroke{to{stroke-dashoffset:0}}@-webkit-keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@keyframes scale{0%,to{transform:none}50%{transform:scale3d(1.1,1.1,1)}}@-webkit-keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}"]
+                styles: ["label{max-width:600px}label.radio-item{display:inline-flex;align-items:center;cursor:pointer;margin:0;padding:0;max-width:100%}label.radio-item span{display:inline-flex;align-items:center}label.radio-item span.radio{background:#fff;height:16px;width:16px;border-radius:50%;border:1px solid #dbdbdb;position:relative;padding:5px;margin-top:0}label.radio-item span.radio .inner{height:10px;width:10px;border-radius:50%;background:#ffffff;display:none}label.radio-item span.value{color:#747576;font-size:14px;line-height:16px;font-weight:400;margin-left:10px;max-width:calc(100% - 26px)}label.radio-item span.value:empty{display:none}label.radio-item svg{display:none;margin-top:0}label.radio-item input[type=radio]{display:none}label.radio-item input[type=radio]:checked+span.radio{display:none}label.radio-item input[type=radio]:checked~svg{display:block}label.radio-item input[type=radio]:disabled~*{opacity:.7}label.radio-item input[type=radio].enable:disabled~*{opacity:1}.radiomark{width:16px;height:16px;border-radius:50%;stroke-width:4;stroke:#fff;stroke-miterlimit:10;box-shadow:inset 0 0 #34aa44;animation:fill .4s ease-in-out .4s forwards,scale .3s ease-in-out .9s both}.radiomark.checked{animation:fill 0s ease-in-out 0s forwards,scale 0s ease-in-out 0s both}.radiomark__circle{stroke-dasharray:166;stroke-dashoffset:166;stroke-width:2;stroke-miterlimit:10;stroke:#34aa44;fill:none;animation:stroke .6s cubic-bezier(.65,0,.45,1) forwards}.radiomark__circle.checked{animation:stroke 0s cubic-bezier(.65,0,.45,1) forwards}.radiomark__check{stroke-dasharray:100;stroke-dashoffset:100;stroke-width:10;animation:stroke .3s cubic-bezier(.65,0,.45,1) 0s forwards}.radiomark__check.checked{animation:stroke 0s cubic-bezier(.65,0,.45,1) 0s forwards}#check{width:100%}#check-stroke{stroke:#34aa44;fill:none;stroke-width:4;stroke-linecap:round;animation:stroke .3s cubic-bezier(.65,0,.45,1) .8s forwards;stroke-dasharray:100%,200%}#check-stroke.checked{animation:stroke 0s cubic-bezier(.65,0,.45,1) 0s forwards}@keyframes stroke{to{stroke-dashoffset:0}}@keyframes scale{0%,to{transform:none}50%{transform:scale(1.1)}}@keyframes fill{to{box-shadow:inset 0 0 0 30px #34aa44}}\n"]
             },] }
 ];
 CsRadioComponent.ctorParameters = () => [];

package/esm2015/lib/formgroup/cs-select/cs-select.component.js CHANGED Viewed

@@ -55,7 +55,7 @@ CsSelectComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-cs-select',
                 template: "<div class=\"input-group\">\r\n  <label *ngIf=\"dropdownLabel != undefined\">\r\n    {{ dropdownLabel }} <span class=\"sub-label\">{{ dropdownSubLabel }}</span> <span class=\"required\" *ngIf=\"isRequired\">*</span></label\r\n  >\r\n  <div class=\"custom-select-box\">\r\n    <input\r\n      type=\"text\"\r\n      [class.line]=\"stylex\"\r\n      [placeholder]=\"placeholder\"\r\n      [value]=\"selectedValue | pascal\"\r\n      readonly\r\n      (click)=\"openDropdown($event)\"\r\n      (keyup.enter)=\"openDropdown($event)\"\r\n      (keyup.arrowup)=\"openDropdown($event)\"\r\n      (keyup.arrowdown)=\"openDropdown($event)\"\r\n    />\r\n    <span class=\"arrow\" [class.line]=\"stylex\">\r\n      <!-- <i class=\"icons\">&#xe9e8;</i> -->\r\n    </span>\r\n    <div class=\"vx-overlay active\" *ngIf=\"dropdownOption === true\" (click)=\"closeDropdown()\"></div>\r\n    <ul\r\n      class=\"list-of-option\"\r\n      *ngIf=\"dropdownOption === true\"\r\n      #optionList\r\n      (keyup.Escape)=\"closeDropdown()\"\r\n      [style.top.px]=\"getTop\"\r\n      [style.left.px]=\"getLeft\"\r\n      [style.min-width.px]=\"getWidth\"\r\n      [style.max-width.px]=\"maxWidth\"\r\n      [class.active]=\"activeDoropdown\"\r\n    >\r\n      <li *ngFor=\"let data of dataList\">\r\n        <label *ngIf=\"colorBlock !== true\">\r\n          <input type=\"radio\" [value]=\"data[valueKey]\" name=\"sliceLabel\" (change)=\"selectOption(data)\" #option (keyup.enter)=\"closeDropdown()\" class=\"pointer-none\" />\r\n          <span (click)=\"closeDropdown(); selectOption(data)\" *ngIf=\"displayProperty && displayProperty !== ''\" class=\"value\">{{ data[displayProperty] }}</span>\r\n          <span (click)=\"closeDropdown(); selectOption(data)\" *ngIf=\"!displayProperty || displayProperty === ''\" class=\"value\">{{ data }}</span>\r\n        </label>\r\n        <label *ngIf=\"colorBlock === true\" class=\"colors\">\r\n          <input type=\"radio\" [value]=\"data[valueKey]\" name=\"sliceLabel\" (change)=\"selectOption(data)\" #option (keyup.enter)=\"closeDropdown()\" class=\"pointer-none\" />\r\n          <span (click)=\"selectOption(data)\" *ngIf=\"displayProperty && displayProperty !== ''\" class=\"value\" [ngStyle]=\"{ color: colorCode }\">{{ data[displayProperty] }}</span>\r\n          <span (click)=\"selectOption(data)\" *ngIf=\"!displayProperty || displayProperty === ''\" class=\"value\" [ngStyle]=\"{ color: colorCode }\">{{ data }}</span>\r\n        </label>\r\n      </li>\r\n    </ul>\r\n  </div>\r\n</div>\r\n",
-                styles: [".input-group{position:relative;margin-bottom:0}.input-group label{font-size:11px;color:#161b2f;font-weight:500;line-height:16px;margin-bottom:5px;text-transform:uppercase;display:block}.input-group label span.required{color:#eb2424;font-size:14px}.input-group label span.sub-label{color:#747576;font-size:11px;font-weight:400;margin-left:3px}.input-group input[type=text]{height:36px;line-height:16px;font-size:13px;color:#747576;font-weight:400;background:#fff;border:1px solid #dbdbdb;border-radius:4px;width:100%;padding:10px 13px;display:block;outline:none}.input-group input[type=text].line{border:none;border-bottom:1px solid #dbdbdb;border-radius:0;padding-left:0}.input-group:focus-within input[type=text]{border-color:#1e5dd3;box-shadow:0 3px 6px #1e5dd333}.input-group:focus-within input[type=text].line{box-shadow:none}.input-group .custom-select-box{position:relative}.input-group .custom-select-box .input,.input-group .custom-select-box input[type=text]{cursor:pointer;padding-right:30px}.input-group .custom-select-box .input.line,.input-group .custom-select-box input[type=text].line{padding-right:20px}.input-group .arrow{position:absolute;right:17px;color:#747576;bottom:8px;font-size:10px;pointer-events:none}.input-group .arrow:before{border-left-color:#707070;border-bottom:1px solid #707070;border-right:1px solid #707070;border-top-color:#707070;content:\"\";display:inline-block;right:15px;position:absolute;top:calc(50% - 4px);width:5px;height:5px;transform:rotate(45deg)}.input-group .arrow.line{right:5px}ul.list-of-option{position:fixed;overflow:auto;max-height:200px;padding:0;margin:0;display:block;border:1px solid #dbdbdb;box-shadow:0 3px 6px #1e5dd333;z-index:2147483002;background:#fff;border-radius:2px;opacity:0}ul.list-of-option.reset{top:inherit;bottom:100%;box-shadow:0 -3px 6px #1e5dd333}ul.list-of-option.active{opacity:1}ul.list-of-option li{width:100%;display:block;margin-bottom:0;padding:0;height:auto}ul.list-of-option li label{line-height:23px;font-size:13px;font-weight:400;border-radius:4px;display:flex;position:relative;margin:0;align-items:center}ul.list-of-option li label input[type=radio]{position:absolute;margin:0;height:100%;width:100%;opacity:0;cursor:pointer}ul.list-of-option li label input[type=radio]:checked+span,ul.list-of-option li label input[type=radio]:hover+span{background:#dcdcdc}ul.list-of-option li label span.value{color:#747576;font-size:14px;line-height:21px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;padding:5px 15px;width:100%;text-transform:none;cursor:pointer;text-align:left}.vx-overlay{display:block}"]
+                styles: [".input-group{position:relative;margin-bottom:0}.input-group label{font-size:11px;color:#161b2f;font-weight:500;line-height:16px;margin-bottom:5px;text-transform:uppercase;display:block}.input-group label span.required{color:#eb2424;font-size:14px}.input-group label span.sub-label{color:#747576;font-size:11px;font-weight:400;margin-left:3px}.input-group input[type=text]{height:36px;line-height:16px;font-size:13px;color:#747576;font-weight:400;background:#ffffff;border:1px solid #dbdbdb;border-radius:4px;width:100%;padding:10px 13px;display:block;outline:none}.input-group input[type=text].line{border:none;border-bottom:1px solid #dbdbdb;border-radius:0;padding-left:0}.input-group:focus-within input[type=text]{border-color:#1e5dd3;box-shadow:0 3px 6px #1e5dd333}.input-group:focus-within input[type=text].line{box-shadow:none}.input-group .custom-select-box{position:relative}.input-group .custom-select-box input[type=text],.input-group .custom-select-box .input{cursor:pointer;padding-right:30px}.input-group .custom-select-box input[type=text].line,.input-group .custom-select-box .input.line{padding-right:20px}.input-group .arrow{position:absolute;right:17px;color:#747576;bottom:8px;font-size:10px;pointer-events:none}.input-group .arrow:before{border-bottom-style:solid;border-bottom-width:1px;border-right-style:solid;border-right-width:1px;border-color:#707070;content:\"\";display:inline-block;right:15px;position:absolute;top:calc(50% - 4px);width:5px;height:5px;transform:rotate(45deg)}.input-group .arrow.line{right:5px}ul.list-of-option{position:fixed;overflow:auto;max-height:200px;padding:0;margin:0;display:block;border:1px solid #dbdbdb;box-shadow:0 3px 6px #1e5dd333;z-index:2147483002;background:#ffffff;border-radius:2px;opacity:0}ul.list-of-option.reset{top:inherit;bottom:100%;box-shadow:0 -3px 6px #1e5dd333}ul.list-of-option.active{opacity:1}ul.list-of-option li{width:100%;display:block;margin-bottom:0;padding:0;height:auto}ul.list-of-option li label{line-height:23px;font-size:13px;font-weight:400;border-radius:4px;display:flex;position:relative;margin:0;align-items:center}ul.list-of-option li label input[type=radio]{position:absolute;margin:0;height:100%;width:100%;opacity:0;cursor:pointer}ul.list-of-option li label input[type=radio]:checked+span,ul.list-of-option li label input[type=radio]:hover+span{background:#dcdcdc}ul.list-of-option li label span.value{color:#747576;font-size:14px;line-height:21px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;padding:5px 15px;width:100%;text-transform:none;cursor:pointer;text-align:left}.vx-overlay{display:block}\n"]
             },] }
 ];
 CsSelectComponent.ctorParameters = () => [];

package/esm2015/lib/formgroup/cs-switch/cs-switch.component.js CHANGED Viewed

@@ -14,7 +14,7 @@ CsSwitchComponent.decorators = [
     { type: Component, args: [{
                 selector: 'app-cs-switch',
                 template: "<label class=\"cs-switch\" [class.top]=\"position == 'top'\">\r\n  <!-- [class.large]=\"large\" -->\r\n  <span class=\"value\" [class.disabled]=\"disabled\">\r\n    <ng-content></ng-content>\r\n  </span>\r\n  <!-- [class.last]=\"last\" -->\r\n  <span class=\"switch\" *ngIf=\"tooltipMessage === '' || tooltipMessage === undefined\">\r\n    <input type=\"checkbox\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" [disabled]=\"disabled\" />\r\n    <span class=\"switch-box\" [class.disabled]=\"disabled\">\r\n      <span class=\"switch-ball\"></span>\r\n    </span>\r\n  </span>\r\n  <span class=\"switch\" *ngIf=\"tooltipMessage !== '' && tooltipMessage !== undefined\">\r\n    <input type=\"checkbox\" [(ngModel)]=\"ngValue\" (ngModelChange)=\"valueChanged()\" [disabled]=\"disabled\" />\r\n    <span class=\"switch-box\" [class.disabled]=\"disabled\">\r\n      <span class=\"switch-ball\"></span>\r\n    </span>\r\n  </span>\r\n</label>\r\n",
-                styles: ["label.cs-switch{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;margin:0;padding:0}label.cs-switch.top{align-items:flex-start}label.cs-switch span.value{font-size:12px;color:#161b2f;font-weight:400;display:flex;justify-content:space-between;width:calc(100% - 35px);align-items:flex-start}label.cs-switch span.value:empty{display:none}label.cs-switch span.switch{position:relative;display:block;width:28px;height:16px}label.cs-switch span.switch input{position:absolute;opacity:0;margin:0;width:100%;height:100%;z-index:1;cursor:pointer}label.cs-switch span.switch input:checked+span.switch-box{background:#34aa44;border:1px solid #34aa44}label.cs-switch span.switch input:checked+span.switch-box .switch-ball{left:13px;border-color:#34aa44}label.cs-switch span.switch-box{height:100%;width:100%;border-radius:11px;background:#dbdbdb;border:1px solid #dbdbdb;display:block;transition:all .2s ease-in-out}label.cs-switch span.switch-ball{height:14px;width:14px;background:#fff;border-radius:50%;border:1px solid #dbdbdb;display:block;position:absolute;left:1px;top:1px;bottom:1px;transition:all .2s ease-in-out}.disabled,:disabled{pointer-events:none;opacity:.2}"]
+                styles: ["label.cs-switch{position:relative;display:flex;align-items:center;justify-content:space-between;width:100%;margin:0;padding:0}label.cs-switch.top{align-items:flex-start}label.cs-switch span.value{font-size:12px;color:#161b2f;font-weight:400;display:flex;justify-content:space-between;width:calc(100% - 35px);align-items:flex-start}label.cs-switch span.value:empty{display:none}label.cs-switch span.switch{position:relative;display:block;width:28px;height:16px}label.cs-switch span.switch input{position:absolute;opacity:0;margin:0;width:100%;height:100%;z-index:1;cursor:pointer}label.cs-switch span.switch input:checked+span.switch-box{background:#34aa44;border:1px solid #34aa44}label.cs-switch span.switch input:checked+span.switch-box .switch-ball{left:13px;border-color:#34aa44}label.cs-switch span.switch-box{height:100%;width:100%;border-radius:11px;background:#dbdbdb;border:1px solid #dbdbdb;display:block;transition:all .2s ease-in-out}label.cs-switch span.switch-ball{height:14px;width:14px;background:#ffffff;border-radius:50%;border:1px solid #dbdbdb;display:block;position:absolute;left:1px;top:1px;bottom:1px;transition:all .2s ease-in-out}:disabled{pointer-events:none;opacity:.2}.disabled{pointer-events:none;opacity:.2}\n"]
             },] }
 ];
 CsSwitchComponent.ctorParameters = () => [];

package/esm2015/lib/formgroup/select/cs-option/cs-option.component.js CHANGED Viewed

@@ -24,7 +24,7 @@ CsOptionComponent.decorators = [
     { type: Component, args: [{
                 selector: 'cs-option',
                 template: "<div class=\"list\">\r\n  <label>\r\n    <input type=\"radio\" tabindex=\"0\" [value]=\"value\" [name]=\"csSelect.name\" (click)=\"change($event)\" [checked]=\"csSelect.val === value\"  [appTooltip]=\"optionTooltip\" placement=\"bottom-left\" delay=\"0\" [tooltipMandatory]=\"true\" />\r\n    <span class=\"value\" #options [style.color]=\"color\">\r\n      <ng-content></ng-content>\r\n    </span>\r\n  </label>\r\n</div>\r\n",
-                styles: [".list label{line-height:23px;font-size:13px;font-weight:400;border-radius:4px;display:flex;position:relative;margin:0;align-items:center}.list label input[type=radio]{position:absolute;margin:0;height:100%;width:100%;opacity:0;cursor:pointer}.list label input[type=radio]:checked+span,.list label input[type=radio]:hover+span{background:#dcdcdc}.list label span.value{color:#747576;font-size:14px;line-height:21px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;padding:5px 15px;width:100%;text-transform:none;cursor:pointer;text-align:left}"]
+                styles: [".list label{line-height:23px;font-size:13px;font-weight:400;border-radius:4px;display:flex;position:relative;margin:0;align-items:center}.list label input[type=radio]{position:absolute;margin:0;height:100%;width:100%;opacity:0;cursor:pointer}.list label input[type=radio]:checked+span,.list label input[type=radio]:hover+span{background:#dcdcdc}.list label span.value{color:#747576;font-size:14px;line-height:21px;font-weight:400;max-width:100%;white-space:nowrap;overflow:hidden;display:block;text-overflow:ellipsis;padding:5px 15px;width:100%;text-transform:none;cursor:pointer;text-align:left}\n"]
             },] }
 ];
 CsOptionComponent.ctorParameters = () => [

package/esm2015/lib/formgroup/select/cs-select/cs-select.component.js CHANGED Viewed

@@ -80,7 +80,7 @@ CsSelectComponent.decorators = [
                         multi: true,
                     },
                 ],
-                styles: ["@import url(\"https://cdn.v-comply.com/design-system/css/icons/icons.css\");.selection-wrap{display:block}.selection-wrap .input-group{background:#fff;display:flex;position:relative}.selection-wrap .input-group:before{border:1px solid #707070;border-top:none;border-left:none;content:\"\";display:inline-block;right:8px;position:absolute;top:12px;width:5px;height:5px;transform:rotate(45deg)}.selection-wrap .input-group input.value{height:40px;line-height:16px;font-size:13px;color:#747576;font-weight:400;background:transparent;border:1px solid #dbdbdb;border-radius:4px;width:100%;padding:8px 40px 8px 13px;display:block;outline:none;cursor:pointer;position:relative}.selection-wrap .select-options{position:fixed;overflow:auto;max-height:200px;padding:0;margin:0;display:block;border:1px solid #dbdbdb;box-shadow:0 3px 6px #1e5dd333;z-index:2147483002;background:#fff;border-radius:2px;opacity:0}.selection-wrap .select-options.hidden{opacity:0}.selection-wrap .select-options.active{opacity:1}.selection-wrap .select-options.reset{top:inherit;bottom:100%;box-shadow:0 -3px 6px #1e5dd333}.vx-overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0}"]
+                styles: ["@import\"https://cdn.v-comply.com/design-system/css/icons/icons.css\";.selection-wrap{display:block}.selection-wrap .input-group{background:#fff;display:flex;position:relative}.selection-wrap .input-group:before{border:1px solid #707070;border-top:none;border-left:none;content:\"\";display:inline-block;right:8px;position:absolute;top:12px;width:5px;height:5px;transform:rotate(45deg)}.selection-wrap .input-group input.value{height:40px;line-height:16px;font-size:13px;color:#747576;font-weight:400;background:transparent;border:1px solid #dbdbdb;border-radius:4px;width:100%;padding:8px 40px 8px 13px;display:block;outline:none;cursor:pointer;position:relative}.selection-wrap .select-options{position:fixed;overflow:auto;max-height:200px;padding:0;margin:0;display:block;border:1px solid #dbdbdb;box-shadow:0 3px 6px #1e5dd333;z-index:2147483002;background:#ffffff;border-radius:2px;opacity:0}.selection-wrap .select-options.hidden{opacity:0}.selection-wrap .select-options.active{opacity:1}.selection-wrap .select-options.reset{top:inherit;bottom:100%;box-shadow:0 -3px 6px #1e5dd333}.vx-overlay{display:block;position:fixed;top:0;right:0;bottom:0;left:0}\n"]
             },] }
 ];
 CsSelectComponent.ctorParameters = () => [