raise-common-lib 0.0.80 → 0.0.82
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.
- package/bundles/raise-common-lib.umd.js +35 -20
- package/bundles/raise-common-lib.umd.js.map +1 -1
- package/bundles/raise-common-lib.umd.min.js +2 -2
- package/bundles/raise-common-lib.umd.min.js.map +1 -1
- package/esm2015/lib/common-grid/index.component.js +3 -1
- package/esm2015/lib/layout/drawer/index.component.js +6 -8
- package/esm2015/lib/layout/grid-box/index.component.js +5 -8
- package/esm2015/lib/layout/page-list/index.component.js +23 -3
- package/esm5/lib/common-grid/index.component.js +3 -1
- package/esm5/lib/layout/drawer/index.component.js +6 -8
- package/esm5/lib/layout/grid-box/index.component.js +5 -8
- package/esm5/lib/layout/page-list/index.component.js +23 -3
- package/fesm2015/raise-common-lib.js +32 -17
- package/fesm2015/raise-common-lib.js.map +1 -1
- package/fesm5/raise-common-lib.js +32 -17
- package/fesm5/raise-common-lib.js.map +1 -1
- package/lib/layout/grid-box/index.component.d.ts +1 -2
- package/lib/layout/page-list/index.component.d.ts +3 -0
- package/package.json +1 -1
- package/raise-common-lib.metadata.json +1 -1
- package/src/assets/style/reset/checkbox.scss +1 -1
- package/src/assets/style/reset/grid.scss +1 -1
|
@@ -2,8 +2,8 @@ import { __assign, __read, __spread } from 'tslib';
|
|
|
2
2
|
import { EventEmitter, Component, ChangeDetectorRef, ViewChild, Input, Output, HostBinding, ContentChild, Injectable, ɵɵdefineInjectable, ɵɵinject, HostListener, ComponentFactoryResolver, ViewContainerRef, ViewChildren, Inject, NgModule, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
|
3
3
|
import { GridComponent, GridModule, PagerModule, GridAllModule, PageService, SortService, FilterService, ExcelExportService, EditService, ResizeService, ToolbarService, ColumnChooserService, AggregateService, ColumnMenuService, DetailRowService, SelectionService, GroupService } from '@syncfusion/ej2-angular-grids';
|
|
4
4
|
import { times, debounce } from 'lodash';
|
|
5
|
-
import { CarouselAllModule, ToolbarModule, TabModule } from '@syncfusion/ej2-angular-navigations';
|
|
6
5
|
import { TreeGridComponent } from '@syncfusion/ej2-angular-treegrid';
|
|
6
|
+
import { CarouselAllModule, ToolbarModule, TabModule } from '@syncfusion/ej2-angular-navigations';
|
|
7
7
|
import { NavigationEnd, Router, ActivatedRoute, RouteReuseStrategy } from '@angular/router';
|
|
8
8
|
import { filter } from 'rxjs/operators';
|
|
9
9
|
import { Subject, BehaviorSubject } from 'rxjs';
|
|
@@ -133,6 +133,8 @@ var CommonGridComponent = /** @class */ (function () {
|
|
|
133
133
|
function () {
|
|
134
134
|
if (this.hiddenLoaded)
|
|
135
135
|
this.className = "";
|
|
136
|
+
this.gridId =
|
|
137
|
+
this.gridId + Date.now() + "_" + Math.random().toString(36).slice(2, 5);
|
|
136
138
|
this.ref && this.ref.markForCheck();
|
|
137
139
|
};
|
|
138
140
|
/**
|
|
@@ -1345,6 +1347,7 @@ if (false) {
|
|
|
1345
1347
|
var RsPageListComponent = /** @class */ (function () {
|
|
1346
1348
|
function RsPageListComponent() {
|
|
1347
1349
|
this.customPageTitle = false;
|
|
1350
|
+
this.hideSearch = false;
|
|
1348
1351
|
this.isInner = false;
|
|
1349
1352
|
this.hasWholeToolbarSlot = false;
|
|
1350
1353
|
}
|
|
@@ -1380,7 +1383,15 @@ var RsPageListComponent = /** @class */ (function () {
|
|
|
1380
1383
|
* @return {?}
|
|
1381
1384
|
*/
|
|
1382
1385
|
function () {
|
|
1383
|
-
this.gridContent
|
|
1386
|
+
if (this.gridContent) {
|
|
1387
|
+
this.gridContent.grid.search(this.searchValue);
|
|
1388
|
+
}
|
|
1389
|
+
else if (this.orignGrid) {
|
|
1390
|
+
this.orignGrid.search(this.searchValue);
|
|
1391
|
+
}
|
|
1392
|
+
else if (this.treeGrid) {
|
|
1393
|
+
this.treeGrid.search(this.searchValue);
|
|
1394
|
+
}
|
|
1384
1395
|
};
|
|
1385
1396
|
/**
|
|
1386
1397
|
* @return {?}
|
|
@@ -1394,15 +1405,18 @@ var RsPageListComponent = /** @class */ (function () {
|
|
|
1394
1405
|
RsPageListComponent.decorators = [
|
|
1395
1406
|
{ type: Component, args: [{
|
|
1396
1407
|
selector: "rs-page-list",
|
|
1397
|
-
template: "<div class=\"rs-page-list-wrap\" [ngClass]=\"{ 'is-not-inner': !isInner }\">\r\n <ng-container *ngIf=\"customPageTitle; else defaultTitle\">\r\n <ng-content select=\"[titleSlot]\"></ng-content>\r\n </ng-container>\r\n <ng-template #defaultTitle>\r\n <div class=\"rs-page-title\" *ngIf=\"pageTitle\">{{ pageTitle }}</div>\r\n </ng-template>\r\n <div class=\"rs-sub-section\">\r\n <ng-content select=\"[subSectionSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-content-wrap\">\r\n <div class=\"rs-content-tab\">\r\n <ng-content select=\"[contentTabSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-toolbar-wrap\">\r\n <div class=\"rs-whole-bar\" *ngIf=\"hasWholeToolbarSlot\">\r\n <ng-content select=\"[wholeToolbarSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-left-col\" *ngIf=\"!hasWholeToolbarSlot\">\r\n <ng-content select=\"[leftToolbarBtnSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-right-col\" *ngIf=\"!hasWholeToolbarSlot\">\r\n <ng-content select=\"[rightToolbarBtnSlot]\"></ng-content>\r\n <div class=\"rs-search-input\">\r\n <ejs-textbox\r\n type=\"text\"\r\n class=\"e-input\"\r\n [(ngModel)]=\"searchValue\"\r\n (input)=\"onInput()\"\r\n placeholder=\"Search all fields\"\r\n [showClearButton]=\"true\"\r\n autocomplete=\"off\"\r\n ></ejs-textbox>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"rs-grid-wrap\">\r\n <ng-content select=\"[gridSlot]\"></ng-content>\r\n </div>\r\n </div>\r\n</div>\r\n",
|
|
1408
|
+
template: "<div class=\"rs-page-list-wrap\" [ngClass]=\"{ 'is-not-inner': !isInner }\">\r\n <ng-container *ngIf=\"customPageTitle; else defaultTitle\">\r\n <ng-content select=\"[titleSlot]\"></ng-content>\r\n </ng-container>\r\n <ng-template #defaultTitle>\r\n <div class=\"rs-page-title\" *ngIf=\"pageTitle\">{{ pageTitle }}</div>\r\n </ng-template>\r\n <div class=\"rs-sub-section\">\r\n <ng-content select=\"[subSectionSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-content-wrap\">\r\n <div class=\"rs-content-tab\">\r\n <ng-content select=\"[contentTabSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-toolbar-wrap\">\r\n <div class=\"rs-whole-bar\" *ngIf=\"hasWholeToolbarSlot\">\r\n <ng-content select=\"[wholeToolbarSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-left-col\" *ngIf=\"!hasWholeToolbarSlot\">\r\n <ng-content select=\"[leftToolbarBtnSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-right-col\" *ngIf=\"!hasWholeToolbarSlot\">\r\n <ng-content select=\"[rightToolbarBtnSlot]\"></ng-content>\r\n <div class=\"rs-search-input\" *ngIf=\"!hideSearch\">\r\n <ejs-textbox\r\n type=\"text\"\r\n class=\"e-input\"\r\n [(ngModel)]=\"searchValue\"\r\n (input)=\"onInput()\"\r\n placeholder=\"Search all fields\"\r\n [showClearButton]=\"true\"\r\n autocomplete=\"off\"\r\n ></ejs-textbox>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"rs-grid-wrap\">\r\n <ng-content select=\"[gridSlot]\"></ng-content>\r\n </div>\r\n </div>\r\n</div>\r\n",
|
|
1398
1409
|
styles: [".rs-page-list-wrap{height:100%;display:flex;flex-direction:column;position:relative;margin:0 auto;max-width:1885px}.rs-page-list-wrap .rs-page-title{font-family:var(--rs-font-family);font-size:var(--rs-page-title-font-size);font-weight:700;text-align:left;color:var(--rs-page-title-color);display:flex;align-items:center;padding:16px 8px 12px 20px}.rs-page-list-wrap .rs-sub-section{width:100%}.rs-page-list-wrap .rs-content-wrap{display:flex;flex-direction:column;flex:1;height:0}.rs-page-list-wrap .rs-content-wrap .rs-toolbar-wrap{display:flex;justify-content:space-between;align-items:center;padding-bottom:4px;border-bottom:1px solid #eaedf0}.rs-page-list-wrap .rs-content-wrap .rs-toolbar-wrap .rs-whole-bar{width:100%}.rs-page-list-wrap .rs-content-wrap .rs-toolbar-wrap .rs-left-col,.rs-page-list-wrap .rs-content-wrap .rs-toolbar-wrap .rs-right-col{display:flex;align-items:center;gap:4px}.rs-page-list-wrap .rs-content-wrap .rs-toolbar-wrap .rs-left-col ::ng-deep .e-btn,.rs-page-list-wrap .rs-content-wrap .rs-toolbar-wrap .rs-right-col ::ng-deep .e-btn{height:24px}.rs-page-list-wrap .rs-content-wrap .rs-toolbar-wrap .rs-right-col{gap:12px}.rs-page-list-wrap .rs-content-wrap .rs-grid-wrap{flex:1;height:0}.rs-page-list-wrap.is-not-inner .rs-content-wrap{border-radius:15px;padding:12px 20px;background:#fff;border:1px solid var(--rs-border-color);box-shadow:0 0 4px 0 rgba(0,0,0,.1)}.rs-page-list-wrap .rs-search-input{width:240px}.rs-page-list-wrap .rs-search-input ::ng-deep .e-input-group{border-radius:14px!important}.rs-page-list-wrap .rs-search-input ::ng-deep .e-input-group.e-input-focus,.rs-page-list-wrap .rs-search-input ::ng-deep .e-input-group:hover{box-shadow:0 0 3px 0 rgba(31,123,255,.4)!important;border-color:var(--rs-input-hover-border-color)!important}.rs-page-list-wrap .rs-search-input ::ng-deep .e-input-group.e-input-focus input.e-input,.rs-page-list-wrap .rs-search-input ::ng-deep .e-input-group:hover input.e-input{box-shadow:none!important}.rs-page-list-wrap .rs-search-input ::ng-deep .e-input-group input.e-input{width:calc(100% - 50px);height:26px}.rs-page-list-wrap .rs-search-input ::ng-deep .e-input-group input.e-input:hover{box-shadow:none!important}.rs-page-list-wrap .rs-search-input ::ng-deep .e-input-group::before{content:\"\"!important;margin:6px 0 0 8px;display:block;width:16px;height:16px;background-image:url(/assets/img/search.svg);background-size:cover;background-position:center}"]
|
|
1399
1410
|
}] }
|
|
1400
1411
|
];
|
|
1401
1412
|
RsPageListComponent.propDecorators = {
|
|
1402
1413
|
gridContent: [{ type: ContentChild, args: [CommonGridComponent, { static: true },] }],
|
|
1414
|
+
orignGrid: [{ type: ContentChild, args: [GridComponent, { static: true },] }],
|
|
1415
|
+
treeGrid: [{ type: ContentChild, args: [TreeGridComponent, { static: true },] }],
|
|
1403
1416
|
wholeToolbarSlot: [{ type: ContentChild, args: ["wholeToolbarSlot", { static: true },] }],
|
|
1404
1417
|
pageTitle: [{ type: Input }],
|
|
1405
1418
|
customPageTitle: [{ type: Input }],
|
|
1419
|
+
hideSearch: [{ type: Input }],
|
|
1406
1420
|
isInner: [{ type: Input }]
|
|
1407
1421
|
};
|
|
1408
1422
|
return RsPageListComponent;
|
|
@@ -1411,12 +1425,18 @@ if (false) {
|
|
|
1411
1425
|
/** @type {?} */
|
|
1412
1426
|
RsPageListComponent.prototype.gridContent;
|
|
1413
1427
|
/** @type {?} */
|
|
1428
|
+
RsPageListComponent.prototype.orignGrid;
|
|
1429
|
+
/** @type {?} */
|
|
1430
|
+
RsPageListComponent.prototype.treeGrid;
|
|
1431
|
+
/** @type {?} */
|
|
1414
1432
|
RsPageListComponent.prototype.wholeToolbarSlot;
|
|
1415
1433
|
/** @type {?} */
|
|
1416
1434
|
RsPageListComponent.prototype.pageTitle;
|
|
1417
1435
|
/** @type {?} */
|
|
1418
1436
|
RsPageListComponent.prototype.customPageTitle;
|
|
1419
1437
|
/** @type {?} */
|
|
1438
|
+
RsPageListComponent.prototype.hideSearch;
|
|
1439
|
+
/** @type {?} */
|
|
1420
1440
|
RsPageListComponent.prototype.isInner;
|
|
1421
1441
|
/**
|
|
1422
1442
|
* @type {?}
|
|
@@ -1543,7 +1563,7 @@ if (false) {
|
|
|
1543
1563
|
*/
|
|
1544
1564
|
var GridBoxComponent = /** @class */ (function () {
|
|
1545
1565
|
function GridBoxComponent() {
|
|
1546
|
-
this.
|
|
1566
|
+
this.hideSearch = false;
|
|
1547
1567
|
this.isInner = false;
|
|
1548
1568
|
this.hasWholeToolbarSlot = false;
|
|
1549
1569
|
}
|
|
@@ -1601,7 +1621,7 @@ var GridBoxComponent = /** @class */ (function () {
|
|
|
1601
1621
|
GridBoxComponent.decorators = [
|
|
1602
1622
|
{ type: Component, args: [{
|
|
1603
1623
|
selector: "rs-grid-box",
|
|
1604
|
-
template: "<div class=\"rs-grid-box\" [ngClass]=\"{ 'is-not-inner': !isInner }\">\r\n <div class=\"rs-content-tab\">\r\n <ng-content select=\"[contentTabSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-toolbar-wrap\">\r\n <div class=\"rs-whole-bar\" *ngIf=\"hasWholeToolbarSlot\">\r\n <ng-content select=\"[wholeToolbarSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-left-col\" *ngIf=\"!hasWholeToolbarSlot\">\r\n <ng-content select=\"[leftToolbarBtnSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-right-col\" *ngIf=\"!hasWholeToolbarSlot\">\r\n <ng-content select=\"[rightToolbarBtnSlot]\"></ng-content>\r\n <div class=\"rs-search-input\">\r\n <ejs-textbox\r\n type=\"text\"\r\n class=\"e-input\"\r\n [(ngModel)]=\"searchValue\"\r\n (input)=\"onInput()\"\r\n placeholder=\"Search all fields\"\r\n [showClearButton]=\"true\"\r\n autocomplete=\"off\"\r\n ></ejs-textbox>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"rs-grid-wrap\">\r\n <ng-content select=\"[gridSlot]\"></ng-content>\r\n </div>\r\n</div>\r\n",
|
|
1624
|
+
template: "<div class=\"rs-grid-box\" [ngClass]=\"{ 'is-not-inner': !isInner }\">\r\n <div class=\"rs-content-tab\">\r\n <ng-content select=\"[contentTabSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-toolbar-wrap\">\r\n <div class=\"rs-whole-bar\" *ngIf=\"hasWholeToolbarSlot\">\r\n <ng-content select=\"[wholeToolbarSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-left-col\" *ngIf=\"!hasWholeToolbarSlot\">\r\n <ng-content select=\"[leftToolbarBtnSlot]\"></ng-content>\r\n </div>\r\n <div class=\"rs-right-col\" *ngIf=\"!hasWholeToolbarSlot\">\r\n <ng-content select=\"[rightToolbarBtnSlot]\"></ng-content>\r\n <div class=\"rs-search-input\" *ngIf=\"!hideSearch\">\r\n <ejs-textbox\r\n type=\"text\"\r\n class=\"e-input\"\r\n [(ngModel)]=\"searchValue\"\r\n (input)=\"onInput()\"\r\n placeholder=\"Search all fields\"\r\n [showClearButton]=\"true\"\r\n autocomplete=\"off\"\r\n ></ejs-textbox>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"rs-grid-wrap\">\r\n <ng-content select=\"[gridSlot]\"></ng-content>\r\n </div>\r\n</div>\r\n",
|
|
1605
1625
|
styles: [":host{height:100%}.rs-grid-box{display:flex;flex-direction:column;height:100%}.rs-grid-box.is-not-inner{border-radius:15px;padding:12px 20px;background:#fff;border:1px solid var(--rs-border-color);box-shadow:0 0 4px 0 rgba(0,0,0,.1)}.rs-grid-box .rs-toolbar-wrap{display:flex;justify-content:space-between;align-items:center;padding-bottom:4px;border-bottom:1px solid #eaedf0}.rs-grid-box .rs-toolbar-wrap .rs-whole-bar{width:100%}.rs-grid-box .rs-toolbar-wrap .rs-left-col,.rs-grid-box .rs-toolbar-wrap .rs-right-col{display:flex;align-items:center;gap:4px}.rs-grid-box .rs-toolbar-wrap .rs-left-col ::ng-deep .e-btn,.rs-grid-box .rs-toolbar-wrap .rs-right-col ::ng-deep .e-btn{height:24px}.rs-grid-box .rs-toolbar-wrap .rs-right-col{gap:12px}.rs-grid-box .rs-grid-wrap{flex:1;height:0}.rs-grid-box .rs-search-input{width:240px}.rs-grid-box .rs-search-input ::ng-deep .e-input-group{border-radius:14px!important}.rs-grid-box .rs-search-input ::ng-deep .e-input-group.e-input-focus,.rs-grid-box .rs-search-input ::ng-deep .e-input-group:hover{box-shadow:0 0 3px 0 rgba(31,123,255,.4)!important;border-color:var(--rs-input-hover-border-color)!important}.rs-grid-box .rs-search-input ::ng-deep .e-input-group.e-input-focus input.e-input,.rs-grid-box .rs-search-input ::ng-deep .e-input-group:hover input.e-input{box-shadow:none!important}.rs-grid-box .rs-search-input ::ng-deep .e-input-group input.e-input{width:calc(100% - 50px);height:26px}.rs-grid-box .rs-search-input ::ng-deep .e-input-group input.e-input:hover{box-shadow:none!important}.rs-grid-box .rs-search-input ::ng-deep .e-input-group::before{content:\"\"!important;margin:6px 0 0 8px;display:block;width:16px;height:16px;background-image:url(/assets/img/search.svg);background-size:cover;background-position:center}"]
|
|
1606
1626
|
}] }
|
|
1607
1627
|
];
|
|
@@ -1610,8 +1630,7 @@ var GridBoxComponent = /** @class */ (function () {
|
|
|
1610
1630
|
orignGrid: [{ type: ContentChild, args: [GridComponent, { static: true },] }],
|
|
1611
1631
|
treeGrid: [{ type: ContentChild, args: [TreeGridComponent, { static: true },] }],
|
|
1612
1632
|
wholeToolbarSlot: [{ type: ContentChild, args: ["wholeToolbarSlot", { static: true },] }],
|
|
1613
|
-
|
|
1614
|
-
customPageTitle: [{ type: Input }],
|
|
1633
|
+
hideSearch: [{ type: Input }],
|
|
1615
1634
|
isInner: [{ type: Input }]
|
|
1616
1635
|
};
|
|
1617
1636
|
return GridBoxComponent;
|
|
@@ -1626,9 +1645,7 @@ if (false) {
|
|
|
1626
1645
|
/** @type {?} */
|
|
1627
1646
|
GridBoxComponent.prototype.wholeToolbarSlot;
|
|
1628
1647
|
/** @type {?} */
|
|
1629
|
-
GridBoxComponent.prototype.
|
|
1630
|
-
/** @type {?} */
|
|
1631
|
-
GridBoxComponent.prototype.customPageTitle;
|
|
1648
|
+
GridBoxComponent.prototype.hideSearch;
|
|
1632
1649
|
/** @type {?} */
|
|
1633
1650
|
GridBoxComponent.prototype.isInner;
|
|
1634
1651
|
/**
|
|
@@ -2655,11 +2672,9 @@ var DrawerComponent = /** @class */ (function () {
|
|
|
2655
2672
|
this.setSlotElement(cache.toolbarEl, this.toolbarSlot.nativeElement);
|
|
2656
2673
|
this.setSlotElement(cache.headerEl, this.headerSlot.nativeElement);
|
|
2657
2674
|
this.setSlotElement(cache.topEl, this.topSlot.nativeElement);
|
|
2658
|
-
|
|
2659
|
-
|
|
2660
|
-
|
|
2661
|
-
this.element.nativeElement.style.setProperty("--drawer-top", drawerTop);
|
|
2662
|
-
}
|
|
2675
|
+
/** @type {?} */
|
|
2676
|
+
var drawerTop = cache.config.top ? cache.config.top + "px" : "";
|
|
2677
|
+
this.element.nativeElement.style.setProperty("--drawer-top", drawerTop);
|
|
2663
2678
|
if (cache.config.mode === "inner") {
|
|
2664
2679
|
this.content.nativeElement.insertBefore(this.header.nativeElement, this.content.nativeElement.firstChild);
|
|
2665
2680
|
this.content.nativeElement.append(this.toolbarSlot.nativeElement);
|
|
@@ -2776,8 +2791,8 @@ var DrawerComponent = /** @class */ (function () {
|
|
|
2776
2791
|
DrawerComponent.decorators = [
|
|
2777
2792
|
{ type: Component, args: [{
|
|
2778
2793
|
selector: "rs-drawer",
|
|
2779
|
-
template: "<div #element id=\"rs-drawer-container\" class=\"rs-drawer-container\">\r\n <div class=\"rs-drawer-content\">\r\n <ng-content></ng-content>\r\n </div>\r\n <div\r\n #drawer\r\n class=\"rs-drawer\"\r\n [attr.data-mode]=\"config.mode\"\r\n [attr.data-opened]=\"($isOpened | async) ? 'yes' : 'no'\"\r\n [attr.data-transition]=\"useTransition\"\r\n >\r\n <div class=\"drawer-header\" #header>\r\n <button class=\"drawer-return-button\" (click)=\"hide()\">\r\n <span class=\"drawer-sub-title\" *ngIf=\"config.subTitle\">\r\n {{ config.subTitle }}\r\n </span>\r\n </button>\r\n <div class=\"drawer-title\">{{ config.title }}</div>\r\n <div class=\"drawer-header-slot\" #headerSlot></div>\r\n </div>\r\n <div class=\"drawer-top-slot\" #topSlot></div>\r\n <div class=\"drawer-content\" #content>\r\n
|
|
2780
|
-
styles: [":host{display:block;height:100%}#rs-drawer-container{height:100%}.rs-drawer-container{height:100%;background-color:transparent;overflow:hidden;position:relative}.rs-drawer-container .rs-drawer-content{width:100%;height:100%;overflow:auto;margin-right:0!important}.rs-drawer-container .rs-drawer-content::-webkit-scrollbar{width:5px;height:5px;background:#fff;position:static;z-index:999;border-radius:10px}.rs-drawer-container .rs-drawer-content::-webkit-scrollbar-thumb{background:#eaedf0}.rs-drawer-container .rs-drawer{width:100%;height:100%;border-left:none;background-color:transparent;overflow:visible;pointer-events:none;opacity:0;display:flex;flex-flow:column nowrap;position:absolute;z-index:2;top:0;left:100%}.rs-drawer-container .rs-drawer[data-opened=yes]{left:0;opacity:1}.rs-drawer-container .rs-drawer[data-transition=yes]{transition:opacity .5s ease-in-out,left .5s ease-in-out}.rs-drawer-container .rs-drawer .drawer-header{flex:none;display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;box-sizing:content-box;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button{flex:none;display:flex;flex-flow:row nowrap;align-items:center;padding:0;border:none;background-color:transparent;cursor:pointer}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button::before{content:url(../../assets/img/drawer-back.svg);width:24px;height:24px;margin-right:8px;transition:transform 125ms ease-in-out}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button:hover::before{transform:translateX(-2px)}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button .drawer-sub-title{margin-right:12px;font-family:Arial;font-style:normal;font-weight:400}.rs-drawer-container .rs-drawer .drawer-header .drawer-title{flex:none;min-height:14px;padding:0 12px;border-left:1px solid #bdc4ca;font-family:Arial;font-style:normal;font-weight:400}.rs-drawer-container .rs-drawer .drawer-header .drawer-title:empty{padding:0}.rs-drawer-container .rs-drawer .drawer-content{flex:auto;padding:0 20px;border:1px solid #ebedf0;border-radius:15px;background-color:#fff;
|
|
2794
|
+
template: "<div #element id=\"rs-drawer-container\" class=\"rs-drawer-container\">\r\n <div class=\"rs-drawer-content\">\r\n <ng-content></ng-content>\r\n </div>\r\n <div\r\n #drawer\r\n class=\"rs-drawer\"\r\n [attr.data-mode]=\"config.mode\"\r\n [attr.data-opened]=\"($isOpened | async) ? 'yes' : 'no'\"\r\n [attr.data-transition]=\"useTransition\"\r\n >\r\n <div class=\"drawer-header\" #header>\r\n <button class=\"drawer-return-button\" (click)=\"hide()\">\r\n <span class=\"drawer-sub-title\" *ngIf=\"config.subTitle\">\r\n {{ config.subTitle }}\r\n </span>\r\n </button>\r\n <div class=\"drawer-title\">{{ config.title }}</div>\r\n <div class=\"drawer-header-slot\" #headerSlot></div>\r\n </div>\r\n <div class=\"drawer-top-slot\" #topSlot></div>\r\n <div class=\"drawer-content-box\">\r\n <div class=\"drawer-content\" #content>\r\n <div class=\"drawer-content-container\">\r\n <ng-template #dynamicComponentContainer></ng-template>\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"drawer-toolbar-slot\" #toolbarSlot></div>\r\n </div>\r\n</div>\r\n",
|
|
2795
|
+
styles: [":host{display:block;height:100%}#rs-drawer-container{height:100%}.rs-drawer-container{height:100%;background-color:transparent;overflow:hidden;position:relative}.rs-drawer-container .rs-drawer-content{width:100%;height:100%;overflow:auto;margin-right:0!important}.rs-drawer-container .rs-drawer-content::-webkit-scrollbar{width:5px;height:5px;background:#fff;position:static;z-index:999;border-radius:10px}.rs-drawer-container .rs-drawer-content::-webkit-scrollbar-thumb{background:#eaedf0}.rs-drawer-container .rs-drawer{width:100%;height:100%;border-left:none;background-color:transparent;overflow:visible;pointer-events:none;opacity:0;display:flex;flex-flow:column nowrap;position:absolute;z-index:2;top:0;left:100%}.rs-drawer-container .rs-drawer[data-opened=yes]{left:0;opacity:1}.rs-drawer-container .rs-drawer[data-transition=yes]{transition:opacity .5s ease-in-out,left .5s ease-in-out}.rs-drawer-container .rs-drawer .drawer-header{flex:none;display:flex;flex-flow:row nowrap;justify-content:flex-start;align-items:center;box-sizing:content-box;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button{flex:none;display:flex;flex-flow:row nowrap;align-items:center;padding:0;border:none;background-color:transparent;cursor:pointer}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button::before{content:url(../../assets/img/drawer-back.svg);width:24px;height:24px;margin-right:8px;transition:transform 125ms ease-in-out}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button:hover::before{transform:translateX(-2px)}.rs-drawer-container .rs-drawer .drawer-header .drawer-return-button .drawer-sub-title{margin-right:12px;font-family:Arial;font-style:normal;font-weight:400}.rs-drawer-container .rs-drawer .drawer-header .drawer-title{flex:none;min-height:14px;padding:0 12px;border-left:1px solid #bdc4ca;font-family:Arial;font-style:normal;font-weight:400}.rs-drawer-container .rs-drawer .drawer-header .drawer-title:empty{padding:0}.rs-drawer-container .rs-drawer .drawer-content-box{flex:auto;height:0;background-color:#f7fafb;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-content{height:100%;padding:0 20px;border:1px solid #ebedf0;border-radius:15px;background-color:#fff;display:flex;flex-flow:column nowrap}.rs-drawer-container .rs-drawer .drawer-content .drawer-content-container{flex:auto;overflow:hidden auto}.rs-drawer-container .rs-drawer .drawer-toolbar-slot{flex:none;height:32px;margin-left:auto;display:flex;flex-flow:row nowrap;justify-content:flex-end;align-items:center;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-toolbar-slot:empty{display:none}.rs-drawer-container .rs-drawer .drawer-top-slot{flex:none;pointer-events:auto}.rs-drawer-container .rs-drawer .drawer-top-slot:empty{height:var(--drawer-top,0);pointer-events:none}.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-header{height:46px;padding:0 0 0 8px;background-color:#f7fafb}.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-header .drawer-sub-title,.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-header .drawer-title{color:#1f3f5c;font-size:15px;font-weight:700;line-height:18px}.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-content{padding-bottom:20px}.rs-drawer-container .rs-drawer[data-mode=outer] .drawer-content .drawer-content-container{margin-right:-20px;padding-right:20px}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-top-slot:empty+.drawer-content-box{padding-top:calc((var(--drawer-top,0) + 1) * 16px)}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-header{height:24px;padding:6px 0;border-bottom:1px solid #eaedf0}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-header .drawer-sub-title,.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-header .drawer-title{color:#44566c;font-size:12px;line-height:14px}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-header .drawer-title{font-weight:700}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-content .drawer-content-container{margin-right:-20px;padding-right:20px}.rs-drawer-container .rs-drawer[data-mode=inner] .drawer-toolbar-slot{width:100%;padding:16px 0;box-sizing:content-box;border-top:1px solid #eaedf0}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar]{display:flex;flex-flow:row nowrap;justify-content:flex-end;align-items:center;gap:12px}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button{display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;gap:6px;min-width:80px;height:32px;padding:0 12px;border:1px solid #adb5bd;border-radius:4px;background-color:#fff;cursor:pointer;color:#44566c;font-size:13px;font-family:Arial;font-style:normal;font-weight:400;line-height:16px}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button:hover{border-color:#6c7c90}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button:disabled{opacity:1!important;border-color:#6c7c9066;color:#44566c66;cursor:unset}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button.primary{border:none;background-color:#1364b3;color:#fff}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button.primary:hover{background-color:#176bca}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button.primary:disabled{background-color:#1364b366}::ng-deep .rs-drawer-container .rs-drawer .drawer-toolbar-slot [drawer-toolbar] button img{width:16px;height:16px}::ng-deep .rs-drawer-container .rs-drawer[data-mode=outer] .drawer-toolbar-slot [drawer-toolbar] button{height:26px;font-size:12px;line-height:14px}::ng-deep .rs-drawer-container .rs-drawer[data-mode=inner] .drawer-toolbar-slot [drawer-toolbar] button img{display:none}"]
|
|
2781
2796
|
}] }
|
|
2782
2797
|
];
|
|
2783
2798
|
/** @nocollapse */
|