@datarailsshared/datarailsshared 1.3.13 → 1.3.14-dev
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/assets/styles/img/spinner.gif +0 -0
- package/bundles/datarailsshared-datarailsshared.umd.js +82 -5
- package/bundles/datarailsshared-datarailsshared.umd.js.map +1 -1
- package/datarailsshared-datarailsshared-1.3.14-dev.tgz +0 -0
- package/datarailsshared-datarailsshared.metadata.json +1 -1
- package/esm2015/lib/dr-dropdown/dr-dropdown.component.js +14 -3
- package/esm2015/lib/dr-inputs/dr-input/dr-input.component.js +1 -1
- package/esm2015/lib/dr-inputs/dr-inputs.module.js +13 -2
- package/esm2015/lib/dr-inputs/dr-toggle-button/dr-toggle-button.component.js +52 -0
- package/esm2015/lib/dr-tabs/dr-tabs.component.js +1 -1
- package/esm2015/lib/models/dropdown.js +1 -1
- package/esm2015/public-api.js +2 -1
- package/fesm2015/datarailsshared-datarailsshared.js +77 -6
- package/fesm2015/datarailsshared-datarailsshared.js.map +1 -1
- package/lib/dr-dropdown/dr-dropdown.component.d.ts +1 -0
- package/lib/dr-inputs/dr-toggle-button/dr-toggle-button.component.d.ts +17 -0
- package/lib/models/dropdown.d.ts +2 -0
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
- package/datarailsshared-datarailsshared-1.3.13.tgz +0 -0
|
Binary file
|
|
@@ -1419,7 +1419,7 @@
|
|
|
1419
1419
|
multi: true
|
|
1420
1420
|
}],
|
|
1421
1421
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
1422
|
-
styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:\"
|
|
1422
|
+
styles: [":host{position:relative;width:100%;display:flex;flex-direction:row;min-height:32px;height:32px;font-size:14px;font-family:\"Poppins\",sans-serif;border:1px solid #C3C4CE;border-radius:6px;color:#85889c;padding:0 8px;overflow:hidden;outline:none}:host:hover{border-color:#85889c}:host:focus-within{border-color:#21b8f1!important;color:#151b3f}:host.disabled{pointer-events:none;border:none;color:#85889c;background:#E5E6EA}:host.ng-valid.ng-dirty{border-color:#03a678}:host.ng-invalid.ng-dirty:not(:focus-within){border-color:#de2833!important}:host.ng-untouched.ng-valid{border-color:#c3c4ce}:host input{display:flex;flex-grow:1;height:100%;border:none;padding:4px 0;text-align:left}:host input:disabled{border:none;color:#85889c;background:transparent}:host input::-webkit-search-decoration,:host input::-webkit-search-cancel-button,:host input::-webkit-search-results-button,:host input::-webkit-search-results-decoration{-webkit-appearance:none}:host .clear-icon{visibility:hidden}:host.clearable .clear-icon,:host.ng-touched.ng-invalid .clear-icon{visibility:visible;content:url('data:image/svg+xml; utf8, <svg width=\"10\" height=\"10\" viewBox=\"0 0 10 10\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M5.91783 5.00001L9.03353 1.88395C9.11924 1.79818 9.16651 1.68374 9.16665 1.56171C9.16665 1.43962 9.11937 1.32504 9.03353 1.2394L8.76047 0.966415C8.67463 0.880433 8.56023 0.833344 8.43808 0.833344C8.31612 0.833344 8.20166 0.880433 8.11582 0.966415L5.00013 4.08227L1.88428 0.966415C1.79858 0.880433 1.68404 0.833344 1.56196 0.833344C1.44001 0.833344 1.32556 0.880433 1.23985 0.966415L0.966646 1.2394C0.788869 1.41719 0.788869 1.70637 0.966646 1.88395L4.08242 5.00001L0.966646 8.11593C0.880873 8.20184 0.833677 8.31628 0.833677 8.43831C0.833677 8.56034 0.880873 8.67478 0.966646 8.76062L1.23978 9.03361C1.32548 9.11952 1.44 9.16668 1.56188 9.16668C1.68397 9.16668 1.7985 9.11952 1.88421 9.03361L5.00005 5.91769L8.11575 9.03361C8.20159 9.11952 8.31605 9.16668 8.438 9.16668H8.43815C8.56017 9.16668 8.67456 9.11952 8.7604 9.03361L9.03346 8.76062C9.11916 8.67484 9.16643 8.56034 9.16643 8.43831C9.16643 8.31628 9.11916 8.20184 9.03346 8.116L5.91783 5.00001Z\" fill=\"%2351566F\"/></svg> ');margin:auto 8px;cursor:pointer}:host span+span,:host span+img{margin-left:0}:host.search-type{padding:0 16px;border-radius:16px}:host.search-type.ng-valid{border-color:#c3c4ce}:host.search-type .search-icon{content:url('data:image/svg+xml; utf8, <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\"><path d=\"M11.5816 10.2097C11.4878 10.1157 11.3605 10.0629 11.2277 10.0629H10.8175C10.7473 10.0629 10.6799 10.035 10.6303 9.98534C10.5322 9.88724 10.527 9.73044 10.6132 9.62178C11.4154 8.6112 11.8925 7.33534 11.8925 5.94625C11.8925 2.66209 9.23042 0 5.94625 0C2.66209 0 0 2.66209 0 5.94625C0 9.23042 2.66209 11.8925 5.94625 11.8925C7.33523 11.8925 8.611 11.4155 9.62155 10.6172C9.7304 10.5312 9.88711 10.5366 9.9852 10.6347C10.0349 10.6845 10.0629 10.7519 10.0629 10.8223V11.2277C10.0629 11.3605 10.1157 11.4878 10.2097 11.5816L14.2834 15.6472C14.4787 15.8421 14.795 15.8419 14.9901 15.6468L15.6468 14.9901C15.8419 14.795 15.8421 14.4787 15.6472 14.2834L11.5816 10.2097ZM5.94625 10.0629C3.67296 10.0629 1.82962 8.21955 1.82962 5.94625C1.82962 3.67296 3.67296 1.82962 5.94625 1.82962C8.21955 1.82962 10.0629 3.67296 10.0629 5.94625C10.0629 8.21955 8.21955 10.0629 5.94625 10.0629Z\" fill=\"%23BCBCBC\"/></svg> ');margin:auto 0 auto 8px;cursor:pointer}:host.with-button{padding-right:0}:host.with-button button{color:#0061ff;background:#F6F7F8;height:100%;width:auto;padding:0 8px;display:flex;align-items:center;border:none;border-left:1px solid #C3C4CE}:host ::ng-deep img[prefixIcon],:host ::ng-deep img[suffixIcon],:host ::ng-deep i[prefixIcon],:host ::ng-deep i[suffixIcon]{position:relative;margin:auto 8px}:host ::ng-deep img[prefixIcon],:host ::ng-deep i[prefixIcon]{margin-left:0}:host ::ng-deep img[suffixIcon],:host ::ng-deep i[suffixIcon]{margin-right:0}\n"]
|
|
1423
1423
|
},] }
|
|
1424
1424
|
];
|
|
1425
1425
|
DrInputComponent.ctorParameters = function () { return [
|
|
@@ -1847,6 +1847,61 @@
|
|
|
1847
1847
|
checkedChange: [{ type: i0.Output }]
|
|
1848
1848
|
};
|
|
1849
1849
|
|
|
1850
|
+
var DrToggleButtonComponent = /** @class */ (function () {
|
|
1851
|
+
function DrToggleButtonComponent(cdr) {
|
|
1852
|
+
this.cdr = cdr;
|
|
1853
|
+
this._disabled = false;
|
|
1854
|
+
this.onChange = function () { };
|
|
1855
|
+
this.onTouched = function () { };
|
|
1856
|
+
}
|
|
1857
|
+
Object.defineProperty(DrToggleButtonComponent.prototype, "disabled", {
|
|
1858
|
+
set: function (value) {
|
|
1859
|
+
this.setDisabledState(value);
|
|
1860
|
+
},
|
|
1861
|
+
enumerable: false,
|
|
1862
|
+
configurable: true
|
|
1863
|
+
});
|
|
1864
|
+
DrToggleButtonComponent.prototype.writeValue = function (value) {
|
|
1865
|
+
this.selectedValue = value;
|
|
1866
|
+
this.cdr.markForCheck();
|
|
1867
|
+
};
|
|
1868
|
+
DrToggleButtonComponent.prototype.registerOnChange = function (fn) {
|
|
1869
|
+
this.onChange = fn;
|
|
1870
|
+
};
|
|
1871
|
+
DrToggleButtonComponent.prototype.registerOnTouched = function (fn) {
|
|
1872
|
+
this.onTouched = fn;
|
|
1873
|
+
};
|
|
1874
|
+
DrToggleButtonComponent.prototype.setDisabledState = function (isDisabled) {
|
|
1875
|
+
this._disabled = isDisabled;
|
|
1876
|
+
};
|
|
1877
|
+
DrToggleButtonComponent.prototype.setValue = function (item) {
|
|
1878
|
+
this.selectedValue = item;
|
|
1879
|
+
this.onChange(this.selectedValue);
|
|
1880
|
+
this.onTouched();
|
|
1881
|
+
this.cdr.markForCheck();
|
|
1882
|
+
};
|
|
1883
|
+
return DrToggleButtonComponent;
|
|
1884
|
+
}());
|
|
1885
|
+
DrToggleButtonComponent.decorators = [
|
|
1886
|
+
{ type: i0.Component, args: [{
|
|
1887
|
+
selector: 'dr-toggle-button',
|
|
1888
|
+
template: "<div class=\"toggle-container\" [class.disabled]=\"this._disabled \">\r\n <div *ngFor=\"let item of items\" (click)=\"setValue(item)\"\r\n [class.selected]=\"item === selectedValue\"\r\n class=\"toggle-container__item\">\r\n {{item.name || item}}\r\n </div>\r\n</div>\r\n",
|
|
1889
|
+
providers: [
|
|
1890
|
+
{ provide: forms.NG_VALUE_ACCESSOR, useExisting: i0.forwardRef(function () { return DrToggleButtonComponent; }), multi: true }
|
|
1891
|
+
],
|
|
1892
|
+
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
1893
|
+
styles: [".toggle-container{display:flex;flex-wrap:nowrap;background:#F6F7F8;border:1px solid #C3C4CE;box-sizing:border-box;border-radius:20px;height:28px}.toggle-container.disabled{pointer-events:none}.toggle-container__item{height:28px;display:flex;align-items:center;justify-content:center;padding:4px 16px;border-radius:20px;margin:-1px;cursor:pointer}.toggle-container__item.selected{background:#F3F7FF;border:1px solid #579BF2;color:#0061ff;font-weight:600}\n"]
|
|
1894
|
+
},] }
|
|
1895
|
+
];
|
|
1896
|
+
DrToggleButtonComponent.ctorParameters = function () { return [
|
|
1897
|
+
{ type: i0.ChangeDetectorRef }
|
|
1898
|
+
]; };
|
|
1899
|
+
DrToggleButtonComponent.propDecorators = {
|
|
1900
|
+
items: [{ type: i0.Input }],
|
|
1901
|
+
selectedValue: [{ type: i0.Input }],
|
|
1902
|
+
disabled: [{ type: i0.Input }]
|
|
1903
|
+
};
|
|
1904
|
+
|
|
1850
1905
|
var ISpinnerOptions = /** @class */ (function (_super) {
|
|
1851
1906
|
__extends(ISpinnerOptions, _super);
|
|
1852
1907
|
function ISpinnerOptions() {
|
|
@@ -2518,6 +2573,17 @@
|
|
|
2518
2573
|
return act.disabled(act.data);
|
|
2519
2574
|
}
|
|
2520
2575
|
};
|
|
2576
|
+
DrDropdownComponent.prototype.selected = function (act) {
|
|
2577
|
+
if (!act.selected) {
|
|
2578
|
+
return false;
|
|
2579
|
+
}
|
|
2580
|
+
if (typeof act.selected === 'boolean') {
|
|
2581
|
+
return act.selected;
|
|
2582
|
+
}
|
|
2583
|
+
else {
|
|
2584
|
+
return act.selected(act.data);
|
|
2585
|
+
}
|
|
2586
|
+
};
|
|
2521
2587
|
DrDropdownComponent.prototype.tooltipToShow = function (act) {
|
|
2522
2588
|
if (act.toolTipIfDisabled || this.disabled(act) || !act.toolTip) {
|
|
2523
2589
|
return '';
|
|
@@ -2546,9 +2612,9 @@
|
|
|
2546
2612
|
DrDropdownComponent.decorators = [
|
|
2547
2613
|
{ type: i0.Component, args: [{
|
|
2548
2614
|
selector: 'dr-dropdown',
|
|
2549
|
-
template: "<div #menuContainer\r\n (clickOutside)=\"onClickedOutside()\"\r\n [drDropdownPosition]=\"option\"\r\n [position]=\"position\"\r\n class=\"dr-dropdown\">\r\n <div class=\"dr-dropdown__container\">\r\n <div *ngFor=\"let act of list | drDropdownItemShowPipe\"\r\n (click)=\"action(act)\"\r\n [drTooltip]=\"tooltipToShow(act)\"\r\n [drTooltipPosition]=\"'top'\"\r\n [drTooltipOptions]=\"{ withoutArrow: true }\"\r\n class=\"dr-dropdown__container__item\"\r\n [class.item-disabled]=\"disabled(act)\"
|
|
2615
|
+
template: "<div #menuContainer\r\n (clickOutside)=\"onClickedOutside()\"\r\n [drDropdownPosition]=\"option\"\r\n [position]=\"position\"\r\n class=\"dr-dropdown\">\r\n <div class=\"dr-dropdown__container\">\r\n <div *ngFor=\"let act of list | drDropdownItemShowPipe\"\r\n (click)=\"action(act)\"\r\n [drTooltip]=\"tooltipToShow(act)\"\r\n [drTooltipPosition]=\"'top'\"\r\n [drTooltipOptions]=\"{ withoutArrow: true }\"\r\n class=\"dr-dropdown__container__item\"\r\n [class.item-disabled]=\"disabled(act)\"\r\n [class.item-selected]=\"selected(act)\">\r\n <i *ngIf=\"act.icon\" [class]=\"act.icon\"></i>\r\n <span class=\"dr-dropdown__container__item__text\">{{act.title}}</span>\r\n <i *ngFor=\"let actionIcon of act.actionIcons\"\r\n [class]=\"actionIcon.icon\"\r\n [class.showOnHover]=\"actionIcon.showOnHover\"\r\n (click)=\"onActionIconClick(actionIcon, act.data)\"></i>\r\n <i *ngIf=\"act.children?.length\" class=\"dr-icon-arrow-right\"></i>\r\n <dr-dropdown *ngIf=\"act.children?.length\" [options]=\"act.childOptions\"></dr-dropdown>\r\n </div>\r\n </div>\r\n</div>\r\n",
|
|
2550
2616
|
changeDetection: i0.ChangeDetectionStrategy.OnPush,
|
|
2551
|
-
styles: ["::ng-deep .dr-dropdown__container__item .dr-dropdown{visibility:hidden}::ng-deep .dr-dropdown__container__item:hover .dr-dropdown{visibility:visible}.dr-dropdown{position:absolute;z-index:-1;top:0;left:0;width:auto}.dr-dropdown__container{display:flex;flex-direction:column;background:#fff;border-radius:4px;box-shadow:0 4px 8px 1px #00000040;padding:8px 0;overflow-y:auto;max-height:60vh}.dr-dropdown__container__item{display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}.dr-dropdown__container__item:hover{background-color:#f6f7f8}.dr-dropdown__container__item.item-disabled{color:#bcbcbc;pointer-events:none}.dr-dropdown__container__item i:first-child{margin-right:8px}.dr-dropdown__container__item__text{margin-right:auto}.dr-dropdown__container__item i,.dr-dropdown__container__item__text{color:#151b3f}.dr-dropdown.content-top{transform:translate(-50%,-100%)}.dr-dropdown.content-top-left{transform:translate(-100%,-100%)}.dr-dropdown.content-bottom{transform:translate(-50%,50%)}.dr-dropdown.content-bottom-left{transform:translate(-90%,35%)}.dr-dropdown.content-left{transform:translate(-100%)}.dr-dropdown.content-left-center{transform:translate(-100%,-50%)}.dr-dropdown.content-right{transform:translate(5%)}\n"]
|
|
2617
|
+
styles: ["::ng-deep .dr-dropdown__container__item .dr-dropdown{visibility:hidden}::ng-deep .dr-dropdown__container__item:hover .dr-dropdown{visibility:visible}.dr-dropdown{position:absolute;z-index:-1;top:0;left:0;width:auto}.dr-dropdown__container{display:flex;flex-direction:column;background:#fff;border-radius:4px;box-shadow:0 4px 8px 1px #00000040;padding:8px 0;overflow-y:auto;max-height:60vh}.dr-dropdown__container__item{display:flex;align-items:center;justify-content:flex-start;cursor:pointer;min-width:15rem;font-style:normal;font-weight:400;font-size:14px;line-height:24px;clear:both;width:100%;white-space:nowrap;padding:0 12px;height:36px;flex-shrink:0}.dr-dropdown__container__item:hover{background-color:#f6f7f8}.dr-dropdown__container__item:hover .showOnHover{visibility:visible}.dr-dropdown__container__item.item-selected{background:#F3F7FF}.dr-dropdown__container__item.item-disabled{color:#bcbcbc;pointer-events:none}.dr-dropdown__container__item i:first-child{margin-right:8px}.dr-dropdown__container__item__text{margin-right:auto}.dr-dropdown__container__item i,.dr-dropdown__container__item__text{color:#151b3f}.dr-dropdown__container__item .showOnHover{visibility:hidden}.dr-dropdown.content-top{transform:translate(-50%,-100%)}.dr-dropdown.content-top-left{transform:translate(-100%,-100%)}.dr-dropdown.content-bottom{transform:translate(-50%,50%)}.dr-dropdown.content-bottom-left{transform:translate(-90%,35%)}.dr-dropdown.content-left{transform:translate(-100%)}.dr-dropdown.content-left-center{transform:translate(-100%,-50%)}.dr-dropdown.content-right{transform:translate(5%)}\n"]
|
|
2552
2618
|
},] }
|
|
2553
2619
|
];
|
|
2554
2620
|
DrDropdownComponent.ctorParameters = function () { return [
|
|
@@ -2763,7 +2829,7 @@
|
|
|
2763
2829
|
{ type: i0.Component, args: [{
|
|
2764
2830
|
selector: 'dr-tabs',
|
|
2765
2831
|
template: "<mat-tab-group disableRipple [selectedIndex]=\"selectedTab\"\r\n (selectedIndexChange)=\"selectedIndexChange($event)\"\r\n [class.with-radio]=\"withRadio\">\r\n <mat-tab *ngFor=\"let tab of tabsContentList; let index = index\" label=\"{{tab.label}}\" [disabled]=\"tab.disabled\" >\r\n <ng-container *ngIf=\"withRadio\">\r\n <ng-template mat-tab-label>\r\n <dr-radio-button [value]=\"index\"\r\n [(ngModel)]=\"selectedTab\">\r\n </dr-radio-button>\r\n {{tab.label}}\r\n </ng-template>\r\n </ng-container>\r\n\r\n <ng-container *ngTemplateOutlet=\"tab.contentTemplate\" ></ng-container>\r\n </mat-tab>\r\n</mat-tab-group>\r\n",
|
|
2766
|
-
styles: [":host{width:100%}:host ::ng-deep .mat-tab-group,:host ::ng-deep .mat-tab-body-wrapper{height:100%}:host ::ng-deep .mat-tab-nav-bar,:host ::ng-deep .mat-tab-header{border-bottom:1px solid #D5DAE5}:host ::ng-deep .mat-tab-labels{padding:0 17px}:host ::ng-deep .mat-tab-label{padding:0 8px;min-width:0;height:38px;opacity:1}:host ::ng-deep .mat-tab-label:not(:last-child){margin-right:21px}:host ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#579bf2;font-weight:700}:host ::ng-deep .mat-tab-label-content{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:\"
|
|
2832
|
+
styles: [":host{width:100%}:host ::ng-deep .mat-tab-group,:host ::ng-deep .mat-tab-body-wrapper{height:100%}:host ::ng-deep .mat-tab-nav-bar,:host ::ng-deep .mat-tab-header{border-bottom:1px solid #D5DAE5}:host ::ng-deep .mat-tab-labels{padding:0 17px}:host ::ng-deep .mat-tab-label{padding:0 8px;min-width:0;height:38px;opacity:1}:host ::ng-deep .mat-tab-label:not(:last-child){margin-right:21px}:host ::ng-deep .mat-tab-label-active .mat-tab-label-content{color:#579bf2;font-weight:700}:host ::ng-deep .mat-tab-label-content{font-weight:400;font-size:14px;line-height:22px;color:#51566f;font-family:\"Poppins\",sans-serif}:host ::ng-deep .mat-ink-bar{height:3px;border-radius:5px;background-color:#579bf2!important}:host ::ng-deep .with-radio .mat-tab-labels{padding:0;margin-bottom:8px}:host ::ng-deep .with-radio .mat-tab-label{padding:8px 16px;min-width:0;flex-grow:1;justify-content:start;height:38px;opacity:1}:host ::ng-deep .with-radio .mat-tab-label:not(:last-child){margin-right:8px}:host ::ng-deep .with-radio .mat-tab-label-active{background:#F6F7F8;border-radius:3px}:host ::ng-deep .with-radio .mat-tab-label-active .mat-tab-label-content{color:#0c142b;font-weight:600}:host ::ng-deep .with-radio .mat-ink-bar{display:none!important}\n"]
|
|
2767
2833
|
},] }
|
|
2768
2834
|
];
|
|
2769
2835
|
DrTabsComponent.ctorParameters = function () { return []; };
|
|
@@ -2854,7 +2920,17 @@
|
|
|
2854
2920
|
},] }
|
|
2855
2921
|
];
|
|
2856
2922
|
|
|
2857
|
-
var components$1 = [
|
|
2923
|
+
var components$1 = [
|
|
2924
|
+
DrButtonComponent,
|
|
2925
|
+
RadioButtonComponent,
|
|
2926
|
+
CheckboxComponent,
|
|
2927
|
+
DrInputComponent,
|
|
2928
|
+
DrSelectComponent,
|
|
2929
|
+
DrToggleComponent,
|
|
2930
|
+
DrToggleButtonComponent,
|
|
2931
|
+
DrDatePickerComponent,
|
|
2932
|
+
DrDatePickerFormatDirective
|
|
2933
|
+
];
|
|
2858
2934
|
var DrInputsModule = /** @class */ (function () {
|
|
2859
2935
|
function DrInputsModule() {
|
|
2860
2936
|
}
|
|
@@ -3051,6 +3127,7 @@
|
|
|
3051
3127
|
exports.DrTabsModule = DrTabsModule;
|
|
3052
3128
|
exports.DrTagComponent = DrTagComponent;
|
|
3053
3129
|
exports.DrTagModule = DrTagModule;
|
|
3130
|
+
exports.DrToggleButtonComponent = DrToggleButtonComponent;
|
|
3054
3131
|
exports.DrToggleComponent = DrToggleComponent;
|
|
3055
3132
|
exports.DrTooltipDirective = DrTooltipDirective;
|
|
3056
3133
|
exports.DrTooltipModule = DrTooltipModule;
|