@metadev/lux 0.15.3 → 0.16.0
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/metadev-lux.umd.js +124 -73
- package/bundles/metadev-lux.umd.js.map +1 -1
- package/esm2015/lib/autocomplete/autocomplete.component.js +1 -1
- package/esm2015/lib/datetime/datetime.component.js +3 -3
- package/esm2015/lib/filter/filter.component.js +1 -1
- package/esm2015/lib/geolocation/geolocation.component.js +110 -63
- package/esm2015/lib/input/input.component.js +9 -3
- package/esm2015/lib/map/map.component.js +5 -7
- package/esm2015/lib/pagination/pagination.component.js +1 -1
- package/esm2015/lib/radiogroup/radiogroup.component.js +1 -1
- package/fesm2015/metadev-lux.js +124 -73
- package/fesm2015/metadev-lux.js.map +1 -1
- package/lib/geolocation/geolocation.component.d.ts +48 -30
- package/lib/input/input.component.d.ts +2 -0
- package/metadev-lux.metadata.json +1 -1
- package/package.json +1 -1
package/fesm2015/metadev-lux.js
CHANGED
|
@@ -448,7 +448,7 @@ AutocompleteComponent.decorators = [
|
|
|
448
448
|
useExisting: forwardRef(() => AutocompleteComponent)
|
|
449
449
|
}
|
|
450
450
|
],
|
|
451
|
-
styles: ["input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color
|
|
451
|
+
styles: [":focus{z-index:1}input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);border:1px solid #495057;border:1px solid var(--lux-input-border-color, #495057);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none}.lux-autocomplete .lux-autocomplete-box{display:grid;grid-template-columns:1fr -webkit-max-content;grid-template-columns:1fr max-content}.lux-autocomplete input{padding:.1rem 1.5rem .1rem .5rem;padding:var(--lux-autocomplete-input-padding, .1rem 1.5rem .1rem .5rem);text-overflow:ellipsis;grid-row:1;grid-column-start:1;grid-column-end:3}.lux-autocomplete .icon-suggestions{grid-row:1;grid-column:2;width:1.5rem;border:none;background-color:transparent;background:url(/assets/img/suggestions.svg) no-repeat center;background-size:.5rem .5rem;z-index:1;position:relative;left:-1rem}.lux-autocomplete .icon-clear{grid-row:1;grid-column:2;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);border:none;background-color:transparent;background:url(/assets/img/filter-clear.png) no-repeat center;background:var(--lux-autocomplete-icon-clear, url(/assets/img/filter-clear.png) no-repeat center);background-size:.5rem .5rem;background-size:var(--lux-autocomplete-icon-bg-size, .5rem .5rem);z-index:1}.lux-autocomplete .icon-dropdown{grid-row:1;grid-column:2;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);height:1.3rem;height:var(--lux-autocomplete-icon-height, 1.3rem);border:none;background-color:transparent;background:url(/assets/img/drop-down-arrow.svg) no-repeat center;background:var(--lux-autocomplete-icon-dropdown, url(/assets/img/drop-down-arrow.svg) no-repeat center);background-size:.5rem .5rem;background-size:var(--lux-autocomplete-icon-bg-size, .5rem .5rem);z-index:1}.lux-autocomplete .icon-spinner{grid-row:1;grid-column:2;width:1.5rem;border:none;background-color:transparent;background:url(/assets/img/spinner.svg) no-repeat center;background-size:1.2rem 1.2rem;z-index:1}.lux-completion-list{visibility:collapse;position:absolute;border:1px solid #ccc;margin:0;padding:0;max-height:10rem;overflow:auto;z-index:2}.lux-completion-list ul{list-style:none;margin:0;padding:0}.showCompletion{visibility:visible}.lux-completion-item{background-color:#fff;color:#000;padding:.1rem .5rem;cursor:pointer}.selected{background-color:#2e2eac;color:#fff}.disabled{background-color:#f0f0f0;color:#444}.disabled .selected{background-color:#9898ec;color:#fff}.bold{font-weight:bold}\n"]
|
|
452
452
|
},] }
|
|
453
453
|
];
|
|
454
454
|
AutocompleteComponent.ctorParameters = () => [
|
|
@@ -1081,7 +1081,7 @@ DatetimeComponent.idCounter = 0;
|
|
|
1081
1081
|
DatetimeComponent.decorators = [
|
|
1082
1082
|
{ type: Component, args: [{
|
|
1083
1083
|
selector: 'lux-datetime',
|
|
1084
|
-
template: "<input\n #dateInput\n class=\"prefix\"\n type=\"date\"\n [id]=\"inputId + '$date'\"\n [(ngModel)]=\"dateValue\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n [placeholder]=\"\"\n [ngClass]=\"className\"\n (keyup)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n (change)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n/>\n<input\n #timeInput\n class=\"
|
|
1084
|
+
template: "<input\n #dateInput\n class=\"rounded-left prefix\"\n type=\"date\"\n [id]=\"inputId + '$date'\"\n [(ngModel)]=\"dateValue\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n [placeholder]=\"\"\n [ngClass]=\"className\"\n (keyup)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n (change)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n/>\n<input\n #timeInput\n class=\"\"\n type=\"time\"\n [id]=\"inputId + '$time'\"\n [(ngModel)]=\"timeValue\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n [placeholder]=\"\"\n [step]=\"includeSeconds ? 1 : 60\"\n [ngClass]=\"className\"\n (keyup)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n (change)=\"onEventDatetime(dateInput.value, timeInput.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n/>\n<ng-container *ngIf=\"!localTime\">\n <div [class]=\"disabled || readonly ? 'rounded-right postfix symbol' : 'postfix symbol'\">\n <span>{{ localTime ? '' : 'UTC' }}</span>\n </div>\n</ng-container>\n<button\n #clearButton\n *ngIf=\"!(disabled || readonly)\"\n class=\"rounded-right postfix icon-clear\"\n [id]=\"inputId + '$clear'\"\n [ngClass]=\"className\"\n (click)=\"updateDatetime(undefined)\"\n aria-label=\"clear\"\n></button>\n\n<div *ngIf=\"inlineErrors && lastErrors && (dirty || touched)\" class=\"alert\">\n <div *ngIf=\"lastErrors.required\">\n {{ userErrors[this.lang].required }}\n </div>\n <div *ngIf=\"lastErrors.min\">\n {{ userErrors[this.lang].min.replace('$min', lastErrors.min.min) }}\n </div>\n <div *ngIf=\"lastErrors.max\">\n {{ userErrors[this.lang].max.replace('$max', lastErrors.max.max) }}\n </div>\n</div>\n",
|
|
1085
1085
|
providers: [
|
|
1086
1086
|
{
|
|
1087
1087
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -1094,7 +1094,7 @@ DatetimeComponent.decorators = [
|
|
|
1094
1094
|
useExisting: forwardRef(() => DatetimeComponent)
|
|
1095
1095
|
}
|
|
1096
1096
|
],
|
|
1097
|
-
styles: ["input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color
|
|
1097
|
+
styles: [":focus{z-index:1}input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);border:1px solid #495057;border:1px solid var(--lux-input-border-color, #495057);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none}:host{position:relative;display:flex;align-items:stretch}.readonly{border:none}.readonly:focus{border:none;outline:none}.icon-clear{grid-row:1;grid-column:2;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);background:url(/assets/img/filter-clear.png) no-repeat center;background:var(--lux-autocomplete-icon-clear, url(/assets/img/filter-clear.png) no-repeat center);background-size:.5rem .5rem;background-size:var(--lux-autocomplete-icon-bg-size, .5rem .5rem);z-index:1}\n"]
|
|
1098
1098
|
},] }
|
|
1099
1099
|
];
|
|
1100
1100
|
DatetimeComponent.ctorParameters = () => [];
|
|
@@ -1550,6 +1550,12 @@ class InputComponent {
|
|
|
1550
1550
|
isPermillage() {
|
|
1551
1551
|
return this.type === 'permillage';
|
|
1552
1552
|
}
|
|
1553
|
+
hasPrefix() {
|
|
1554
|
+
return this.currency === 'USD';
|
|
1555
|
+
}
|
|
1556
|
+
hasPostfix() {
|
|
1557
|
+
return (this.currency === 'EUR' || this.isPercentage() || this.isPermillage());
|
|
1558
|
+
}
|
|
1553
1559
|
checkClassName() {
|
|
1554
1560
|
if (this.readonly === true) {
|
|
1555
1561
|
return 'readonly';
|
|
@@ -1623,7 +1629,7 @@ InputComponent.idCounter = 0;
|
|
|
1623
1629
|
InputComponent.decorators = [
|
|
1624
1630
|
{ type: Component, args: [{
|
|
1625
1631
|
selector: 'lux-input',
|
|
1626
|
-
template: "<div *ngIf=\"currency && currency === 'USD'\" class=\"prefix symbol\">\n <span>$</span>\n</div>\n<input\n #input\n *ngIf=\"type !== 'textarea'\"\n class=\"infix\"\n placement=\"top\"\n [id]=\"inputId\"\n [type]=\"domain\"\n [attr.value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n [attr.min]=\"min?.toString() || undefined\"\n [attr.max]=\"max?.toString() || undefined\"\n [attr.step]=\"step?.toString() || undefined\"\n [attr.pattern]=\"pattern || undefined\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"className\"\n (keyup)=\"onKeyUp(input.value)\"\n (change)=\"onChangeValue(input.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n/>\n<textarea\n #textarea\n *ngIf=\"type === 'textarea'\"\n
|
|
1632
|
+
template: "<div *ngIf=\"currency && currency === 'USD'\" class=\"prefix rounded-left symbol\">\n <span>$</span>\n</div>\n<input\n #input\n *ngIf=\"type !== 'textarea'\"\n [class]=\"hasPrefix() ? (hasPostfix() ? 'infix' : 'postfix rounded-right') : (hasPostfix() ? 'prefix rounded-left' : 'rounded')\"\n placement=\"top\"\n [id]=\"inputId\"\n [type]=\"domain\"\n [attr.value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n [attr.min]=\"min?.toString() || undefined\"\n [attr.max]=\"max?.toString() || undefined\"\n [attr.step]=\"step?.toString() || undefined\"\n [attr.pattern]=\"pattern || undefined\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"className\"\n (keyup)=\"onKeyUp(input.value)\"\n (change)=\"onChangeValue(input.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n/>\n<textarea\n #textarea\n *ngIf=\"type === 'textarea'\"\n placement=\"top\"\n [id]=\"inputId\"\n [attr.value]=\"value\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n [attr.cols]=\"cols?.toString() || undefined\"\n [attr.rows]=\"rows?.toString() || undefined\"\n [placeholder]=\"placeholder\"\n [ngClass]=\"className\"\n (keyup)=\"onKeyUp(textarea.value)\"\n (change)=\"onChangeValue(textarea.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n></textarea>\n<div *ngIf=\"currency && currency === 'EUR'\" class=\"postfix rounded-right symbol\">\n <span>\u20AC</span>\n</div>\n<div *ngIf=\"isPercentage()\" class=\"postfix rounded-right symbol\">\n <span>%</span>\n</div>\n<div *ngIf=\"isPermillage()\" class=\"postfix rounded-right symbol\">\n <span>\u2030</span>\n</div>\n\n<div *ngIf=\"inlineErrors && lastErrors && (dirty || touched)\" class=\"alert\">\n <div *ngIf=\"lastErrors.required\">\n {{ userErrors[this.lang].required }}\n </div>\n <div *ngIf=\"lastErrors.email\">{{ userErrors[this.lang].email }}</div>\n <div *ngIf=\"lastErrors.min\">\n {{ userErrors[this.lang].min.replace('$min', lastErrors.min.min) }}\n </div>\n <div *ngIf=\"lastErrors.max\">\n {{ userErrors[this.lang].max.replace('$max', lastErrors.max.max) }}\n </div>\n</div>\n",
|
|
1627
1633
|
providers: [
|
|
1628
1634
|
{
|
|
1629
1635
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -1636,7 +1642,7 @@ InputComponent.decorators = [
|
|
|
1636
1642
|
useExisting: forwardRef(() => InputComponent)
|
|
1637
1643
|
}
|
|
1638
1644
|
],
|
|
1639
|
-
styles: ["input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color
|
|
1645
|
+
styles: [":focus{z-index:1}input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);border:1px solid #495057;border:1px solid var(--lux-input-border-color, #495057);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none}:host{position:relative;display:flex;align-items:stretch}.readonly{border:none}.readonly:focus{border:none;outline:none}\n"]
|
|
1640
1646
|
},] }
|
|
1641
1647
|
];
|
|
1642
1648
|
InputComponent.ctorParameters = () => [
|
|
@@ -1787,7 +1793,7 @@ FilterComponent.decorators = [
|
|
|
1787
1793
|
useExisting: forwardRef(() => FilterComponent)
|
|
1788
1794
|
}
|
|
1789
1795
|
],
|
|
1790
|
-
styles: ["input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color
|
|
1796
|
+
styles: [":focus{z-index:1}input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);border:1px solid #495057;border:1px solid var(--lux-input-border-color, #495057);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none}.filter{display:grid;grid-template-columns:auto 1.5rem 1.5rem .5rem auto}.filter input{grid-row:1;grid-column-start:1;grid-column-end:4}.filter .hide{visibility:collapse}.filter .clear-indicator{grid-row:1;grid-column:2;border:none}.filter .search-indicator{grid-row:1;grid-column:3}.filter .btn-search{grid-row:1;grid-column:5}.filter .icon-search{background:url(/assets/img/filter-search.png) no-repeat center;background:var(--lux-filter-icon-search, url(/assets/img/filter-search.png) no-repeat center);background-size:1rem;background-size:var(--lux-filter-icon-bg-size, 1rem);background-position:center;width:1rem;width:var(--lux-filter-icon-width, 1rem)}.filter .icon-clear{background:url(/assets/img/filter-clear.png) no-repeat center;background:var(--lux-filter-icon-clear, url(/assets/img/filter-clear.png) no-repeat center);background-size:1rem;background-size:var(--lux-filter-icon-bg-size, 1rem);background-position:center}\n"]
|
|
1791
1797
|
},] }
|
|
1792
1798
|
];
|
|
1793
1799
|
FilterComponent.ctorParameters = () => [];
|
|
@@ -2418,36 +2424,52 @@ class GeolocationComponent {
|
|
|
2418
2424
|
this.latitudeValue = null;
|
|
2419
2425
|
this.longitudeValue = null;
|
|
2420
2426
|
this.isValidNumber = isValidNumber;
|
|
2421
|
-
this.
|
|
2427
|
+
this.i18n = {
|
|
2422
2428
|
en: {
|
|
2423
|
-
|
|
2424
|
-
|
|
2425
|
-
|
|
2426
|
-
|
|
2427
|
-
|
|
2428
|
-
|
|
2429
|
-
|
|
2430
|
-
|
|
2431
|
-
|
|
2432
|
-
|
|
2433
|
-
|
|
2434
|
-
|
|
2435
|
-
|
|
2436
|
-
|
|
2437
|
-
|
|
2438
|
-
|
|
2439
|
-
|
|
2440
|
-
|
|
2441
|
-
|
|
2442
|
-
|
|
2443
|
-
|
|
2429
|
+
lat: 'latitude',
|
|
2430
|
+
lon: 'longitude',
|
|
2431
|
+
selectLocation: 'Select location',
|
|
2432
|
+
location: 'Location',
|
|
2433
|
+
selectAction: 'Select',
|
|
2434
|
+
cancelAction: 'Cancel',
|
|
2435
|
+
closeAction: 'Close',
|
|
2436
|
+
typeToSearch: 'type to search',
|
|
2437
|
+
cardinalPoints: {
|
|
2438
|
+
north: 'N',
|
|
2439
|
+
south: 'S',
|
|
2440
|
+
east: 'E',
|
|
2441
|
+
west: 'W'
|
|
2442
|
+
},
|
|
2443
|
+
userErrors: {
|
|
2444
|
+
required: 'Required field.',
|
|
2445
|
+
minLatitude: 'Minimum latitude is $minLatitude.',
|
|
2446
|
+
maxLatitude: 'Maximum latitude is $maxLatitude.',
|
|
2447
|
+
minLongitude: 'Minimum longitude is $minLongitude.',
|
|
2448
|
+
maxLongitude: 'Maximum longitude is $maxLongitude.'
|
|
2449
|
+
}
|
|
2444
2450
|
},
|
|
2445
2451
|
es: {
|
|
2446
|
-
|
|
2447
|
-
|
|
2448
|
-
|
|
2449
|
-
|
|
2450
|
-
|
|
2452
|
+
lat: 'latitud',
|
|
2453
|
+
lon: 'longitud',
|
|
2454
|
+
selectLocation: 'Seleccione ubicación',
|
|
2455
|
+
location: 'Ubicación',
|
|
2456
|
+
selectAction: 'Seleccionar',
|
|
2457
|
+
cancelAction: 'Cancelar',
|
|
2458
|
+
closeAction: 'Cerrar',
|
|
2459
|
+
typeToSearch: 'escribe para buscar',
|
|
2460
|
+
cardinalPoints: {
|
|
2461
|
+
north: 'N',
|
|
2462
|
+
south: 'S',
|
|
2463
|
+
east: 'E',
|
|
2464
|
+
west: 'O'
|
|
2465
|
+
},
|
|
2466
|
+
userErrors: {
|
|
2467
|
+
required: 'El campo es obligatorio.',
|
|
2468
|
+
minLatitude: 'La latitud mínima es $minLatitude.',
|
|
2469
|
+
maxLatitude: 'La latitud máxima es $maxLatitude.',
|
|
2470
|
+
minLongitude: 'La longitud mínima es $minLongitude.',
|
|
2471
|
+
maxLongitude: 'La longitud máxima es $maxLongitude.'
|
|
2472
|
+
}
|
|
2451
2473
|
}
|
|
2452
2474
|
};
|
|
2453
2475
|
this.lang = languageDetector();
|
|
@@ -2532,48 +2554,40 @@ class GeolocationComponent {
|
|
|
2532
2554
|
validate(control) {
|
|
2533
2555
|
const value = control.value;
|
|
2534
2556
|
let result = null;
|
|
2535
|
-
if (this.required && (value
|
|
2557
|
+
if (this.required && !exists(value)) {
|
|
2536
2558
|
result = result || {};
|
|
2537
2559
|
result.required = { value, reason: 'Required field.' };
|
|
2538
2560
|
}
|
|
2539
|
-
if (this.minLatitude
|
|
2540
|
-
this.minLatitude !== null &&
|
|
2541
|
-
this.latitudeValue < this.minLatitude) {
|
|
2561
|
+
if (exists(this.minLatitude) && this.latitudeValue < this.minLatitude) {
|
|
2542
2562
|
result = result || {};
|
|
2543
2563
|
result.minLatitude = {
|
|
2544
2564
|
value,
|
|
2545
2565
|
min: this.minLatitude,
|
|
2546
|
-
reason: `
|
|
2566
|
+
reason: `Latitude is lower than minimum value: ${this.minLatitude}.`
|
|
2547
2567
|
};
|
|
2548
2568
|
}
|
|
2549
|
-
if (this.maxLatitude
|
|
2550
|
-
this.maxLatitude !== null &&
|
|
2551
|
-
this.latitudeValue < this.maxLatitude) {
|
|
2569
|
+
if (exists(this.maxLatitude) && this.latitudeValue > this.maxLatitude) {
|
|
2552
2570
|
result = result || {};
|
|
2553
2571
|
result.maxLatitude = {
|
|
2554
2572
|
value,
|
|
2555
2573
|
max: this.maxLatitude,
|
|
2556
|
-
reason: `
|
|
2574
|
+
reason: `Latitude is higher than maximum value: ${this.maxLatitude}.`
|
|
2557
2575
|
};
|
|
2558
2576
|
}
|
|
2559
|
-
if (this.minLongitude
|
|
2560
|
-
this.minLongitude !== null &&
|
|
2561
|
-
this.longitudeValue < this.minLongitude) {
|
|
2577
|
+
if (exists(this.minLongitude) && this.longitudeValue < this.minLongitude) {
|
|
2562
2578
|
result = result || {};
|
|
2563
2579
|
result.minLongitude = {
|
|
2564
2580
|
value,
|
|
2565
2581
|
min: this.minLongitude,
|
|
2566
|
-
reason: `
|
|
2582
|
+
reason: `Longitude is lower than minimum value: ${this.minLongitude}.`
|
|
2567
2583
|
};
|
|
2568
2584
|
}
|
|
2569
|
-
if (this.maxLongitude
|
|
2570
|
-
this.maxLongitude !== null &&
|
|
2571
|
-
this.longitudeValue < this.maxLongitude) {
|
|
2585
|
+
if (exists(this.maxLongitude) && this.longitudeValue > this.maxLongitude) {
|
|
2572
2586
|
result = result || {};
|
|
2573
2587
|
result.maxLongitude = {
|
|
2574
2588
|
value,
|
|
2575
2589
|
max: this.maxLongitude,
|
|
2576
|
-
reason: `
|
|
2590
|
+
reason: `Longitude is higher than maximum value: ${this.maxLongitude}.`
|
|
2577
2591
|
};
|
|
2578
2592
|
}
|
|
2579
2593
|
this.lastErrors = result;
|
|
@@ -2590,28 +2604,49 @@ class GeolocationComponent {
|
|
|
2590
2604
|
if (this.disabled || this.readonly) {
|
|
2591
2605
|
return;
|
|
2592
2606
|
}
|
|
2593
|
-
this.
|
|
2594
|
-
|
|
2595
|
-
|
|
2596
|
-
|
|
2607
|
+
if (isValidNumber(this.longitudeValue)) {
|
|
2608
|
+
this.value = {
|
|
2609
|
+
type: 'Point',
|
|
2610
|
+
coordinates: [this.longitudeValue, newLatitude]
|
|
2611
|
+
};
|
|
2612
|
+
}
|
|
2613
|
+
else {
|
|
2614
|
+
this.value = {
|
|
2615
|
+
type: 'Point',
|
|
2616
|
+
coordinates: [0, newLatitude]
|
|
2617
|
+
};
|
|
2618
|
+
}
|
|
2597
2619
|
}
|
|
2598
2620
|
updateLongitude(newLongitude) {
|
|
2599
2621
|
if (this.disabled || this.readonly) {
|
|
2600
2622
|
return;
|
|
2601
2623
|
}
|
|
2602
|
-
this.
|
|
2603
|
-
|
|
2604
|
-
|
|
2605
|
-
|
|
2624
|
+
if (isValidNumber(this.latitudeValue)) {
|
|
2625
|
+
this.value = {
|
|
2626
|
+
type: 'Point',
|
|
2627
|
+
coordinates: [newLongitude, this.latitudeValue]
|
|
2628
|
+
};
|
|
2629
|
+
}
|
|
2630
|
+
else {
|
|
2631
|
+
this.value = {
|
|
2632
|
+
type: 'Point',
|
|
2633
|
+
coordinates: [newLongitude, 0]
|
|
2634
|
+
};
|
|
2635
|
+
}
|
|
2606
2636
|
}
|
|
2607
2637
|
updateLatitudeAndLongitude(newLatitudeAndLongitude) {
|
|
2608
2638
|
if (this.disabled || this.readonly) {
|
|
2609
2639
|
return;
|
|
2610
2640
|
}
|
|
2611
|
-
|
|
2612
|
-
|
|
2613
|
-
|
|
2614
|
-
|
|
2641
|
+
if (!exists(newLatitudeAndLongitude)) {
|
|
2642
|
+
this.value = undefined;
|
|
2643
|
+
}
|
|
2644
|
+
else {
|
|
2645
|
+
this.value = {
|
|
2646
|
+
type: 'Point',
|
|
2647
|
+
coordinates: newLatitudeAndLongitude
|
|
2648
|
+
};
|
|
2649
|
+
}
|
|
2615
2650
|
}
|
|
2616
2651
|
roundToStepAndUpdateLatitudeAndLongitude(newLatitudeAndLongitude) {
|
|
2617
2652
|
const newLatitude = roundToMultipleOf(newLatitudeAndLongitude[1], this.step);
|
|
@@ -2619,6 +2654,9 @@ class GeolocationComponent {
|
|
|
2619
2654
|
if (this.disabled || this.readonly) {
|
|
2620
2655
|
return;
|
|
2621
2656
|
}
|
|
2657
|
+
if (!exists(newLatitudeAndLongitude)) {
|
|
2658
|
+
this.value = undefined;
|
|
2659
|
+
}
|
|
2622
2660
|
this.value = {
|
|
2623
2661
|
type: 'Point',
|
|
2624
2662
|
coordinates: [newLongitude, newLatitude]
|
|
@@ -2631,11 +2669,19 @@ class GeolocationComponent {
|
|
|
2631
2669
|
if (isValidNumber(newLatitude)) {
|
|
2632
2670
|
this.updateLatitude(+newLatitude);
|
|
2633
2671
|
}
|
|
2672
|
+
else {
|
|
2673
|
+
this.updateLatitude(undefined);
|
|
2674
|
+
}
|
|
2675
|
+
this.markAsTouched();
|
|
2634
2676
|
}
|
|
2635
2677
|
onEventLongitude(newLongitude) {
|
|
2636
2678
|
if (isValidNumber(newLongitude)) {
|
|
2637
2679
|
this.updateLongitude(+newLongitude);
|
|
2638
2680
|
}
|
|
2681
|
+
else {
|
|
2682
|
+
this.updateLongitude(undefined);
|
|
2683
|
+
}
|
|
2684
|
+
this.markAsTouched();
|
|
2639
2685
|
}
|
|
2640
2686
|
onKeyPress(event) {
|
|
2641
2687
|
this.keyPress.emit(event);
|
|
@@ -2653,8 +2699,14 @@ class GeolocationComponent {
|
|
|
2653
2699
|
}
|
|
2654
2700
|
}, (_) => { });
|
|
2655
2701
|
}
|
|
2702
|
+
onSearchLocationChanged(newValue, map) {
|
|
2703
|
+
map.markerPoint = newValue;
|
|
2704
|
+
map.center = map.markerPoint;
|
|
2705
|
+
}
|
|
2656
2706
|
get mapTitle() {
|
|
2657
|
-
return this._disabled || !!this.readonly
|
|
2707
|
+
return this._disabled || !!this.readonly
|
|
2708
|
+
? this.i18n[this.lang].location
|
|
2709
|
+
: this.i18n[this.lang].selectLocation;
|
|
2658
2710
|
}
|
|
2659
2711
|
get self() {
|
|
2660
2712
|
return this;
|
|
@@ -2678,7 +2730,7 @@ GeolocationComponent.idCounter = 0;
|
|
|
2678
2730
|
GeolocationComponent.decorators = [
|
|
2679
2731
|
{ type: Component, args: [{
|
|
2680
2732
|
selector: 'lux-geolocation',
|
|
2681
|
-
template: "<
|
|
2733
|
+
template: "<input\n #latitude\n class=\"rounded-left prefix\"\n type=\"number\"\n [id]=\"inputId + '$latitude'\"\n [(ngModel)]=\"latitudeValue\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n [attr.min]=\"\n minLatitude !== undefined && minLatitude !== null\n ? minLatitude.toString()\n : undefined\n \"\n [attr.max]=\"\n maxLatitude !== undefined && maxLatitude !== null\n ? maxLatitude.toString()\n : undefined\n \"\n [attr.step]=\"\n step !== undefined && step !== null ? step.toString() : undefined\n \"\n [placeholder]=\"i18n[lang].lat\"\n [ngClass]=\"className\"\n (keyup)=\"onEventLatitude(latitude.value)\"\n (change)=\"onEventLatitude(latitude.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n/>\n<div class=\"infix symbol clickable\" (click)=\"openModalMap(modalMap)\">\n <span *ngIf=\"isValidNumber(latitudeValue) && latitudeValue >= 0\">{{\n i18n[this.lang].cardinalPoints.north\n }}</span>\n <span *ngIf=\"isValidNumber(latitudeValue) && latitudeValue < 0\">{{\n i18n[this.lang].cardinalPoints.south\n }}</span>\n <span *ngIf=\"!isValidNumber(latitudeValue)\" class=\"icon-globe\"></span>\n</div>\n<input\n #longitude\n class=\"prefix\"\n type=\"number\"\n [id]=\"inputId + '$longitude'\"\n [(ngModel)]=\"longitudeValue\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.disabled]=\"disabled === true ? 'true' : undefined\"\n [attr.readonly]=\"readonly === true ? 'true' : undefined\"\n [attr.min]=\"\n minLongitude !== undefined && minLongitude !== null\n ? minLongitude.toString()\n : undefined\n \"\n [attr.max]=\"\n maxLongitude !== undefined && maxLongitude !== null\n ? maxLongitude.toString()\n : undefined\n \"\n [attr.step]=\"\n step !== undefined && step !== null ? step.toString() : undefined\n \"\n [placeholder]=\"i18n[lang].lon\"\n [ngClass]=\"className\"\n (keyup)=\"onEventLongitude(longitude.value)\"\n (change)=\"onEventLongitude(longitude.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n/>\n<div\n [class]=\"\n disabled || readonly\n ? 'clickable rounded-right postfix symbol'\n : 'clickable postfix symbol'\n \"\n (click)=\"openModalMap(modalMap)\"\n>\n <span *ngIf=\"isValidNumber(longitudeValue) && longitudeValue >= 0\">{{\n i18n[this.lang].cardinalPoints.east\n }}</span>\n <span *ngIf=\"isValidNumber(longitudeValue) && longitudeValue < 0\">{{\n i18n[this.lang].cardinalPoints.west\n }}</span>\n <span *ngIf=\"!isValidNumber(longitudeValue)\" class=\"icon-globe\"></span>\n</div>\n<button\n #clearButton\n *ngIf=\"!(disabled || readonly)\"\n class=\"rounded-right postfix icon icon-clear\"\n [id]=\"inputId + '$clear'\"\n [ngClass]=\"className\"\n (click)=\"updateLatitudeAndLongitude(undefined)\"\n aria-label=\"clear\"\n></button>\n\n<div *ngIf=\"inlineErrors && lastErrors && (dirty || touched)\" class=\"alert\">\n <div *ngIf=\"lastErrors.required\">\n {{ i18n[this.lang].userErrors.required }}\n </div>\n <div *ngIf=\"lastErrors.minLatitude\">\n {{\n i18n[this.lang].userErrors.minLatitude.replace(\n '$minLatitude',\n lastErrors.minLatitude.min\n )\n }}\n </div>\n <div *ngIf=\"lastErrors.maxLatitude\">\n {{\n i18n[this.lang].userErrors.maxLatitude.replace(\n '$maxLatitude',\n lastErrors.maxLatitude.max\n )\n }}\n </div>\n <div *ngIf=\"lastErrors.minLongitude\">\n {{\n i18n[this.lang].userErrors.minLongitude.replace(\n '$minLongitude',\n lastErrors.minLongitude.min\n )\n }}\n </div>\n <div *ngIf=\"lastErrors.maxLongitude\">\n {{\n i18n[this.lang].userErrors.maxLongitude.replace(\n '$maxLongitude',\n lastErrors.maxLongitude.max\n )\n }}\n </div>\n</div>\n\n<ng-template #modalMap let-modal>\n <div class=\"lux-modal-header\">\n <h4 class=\"modal-title\" id=\"modal-basic-title\">{{ mapTitle }}</h4>\n <button\n type=\"button\"\n class=\"close\"\n aria-label=\"Close\"\n (click)=\"modal.dismiss('Cross click')\"\n >\n <span aria-hidden=\"true\">\u00D7</span>\n </button>\n </div>\n <div class=\"lux-modal-body content\">\n <lux-autocomplete\n #searchBar\n [attr.aria-label]=\"i18n[lang].typeToSearch\"\n [placeholder]=\"i18n[lang].typeToSearch\"\n *ngIf=\"!disabled && !readonly\"\n [instance]=\"self\"\n [resolveLabelsFunction]=\"getLabels\"\n [populateFunction]=\"getData\"\n (valueChange)=\"onSearchLocationChanged(searchBar.value, map)\"\n ></lux-autocomplete>\n <div class=\"map-container\">\n <lux-map\n #map\n [center]=\"value\"\n [markerPoint]=\"value\"\n [zoom]=\"zoom\"\n [readonly]=\"readonly === true || disabled === true ? true : false\"\n ></lux-map>\n </div>\n </div>\n <div class=\"lux-modal-footer\">\n <button\n *ngIf=\"disabled || readonly\"\n type=\"button\"\n class=\"btn btn-cancel\"\n (click)=\"modal.close('cancel')\"\n >\n {{ i18n[lang].closeAction }}\n </button>\n <button\n *ngIf=\"!disabled && !readonly\"\n type=\"button\"\n class=\"btn btn-cancel\"\n (click)=\"modal.close('cancel')\"\n >\n {{ i18n[lang].cancelAction }}\n </button>\n <button\n *ngIf=\"!disabled && !readonly\"\n type=\"button\"\n class=\"btn btn-select\"\n (click)=\"modal.close(map.markerPoint.coordinates)\"\n >\n {{ i18n[lang].selectAction }}\n </button>\n </div>\n</ng-template>\n",
|
|
2682
2734
|
providers: [
|
|
2683
2735
|
{
|
|
2684
2736
|
provide: NG_VALUE_ACCESSOR,
|
|
@@ -2691,7 +2743,7 @@ GeolocationComponent.decorators = [
|
|
|
2691
2743
|
useExisting: forwardRef(() => GeolocationComponent)
|
|
2692
2744
|
}
|
|
2693
2745
|
],
|
|
2694
|
-
styles: ["input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color
|
|
2746
|
+
styles: [":focus{z-index:1}input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);border:1px solid #495057;border:1px solid var(--lux-input-border-color, #495057);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none}:host{position:relative;display:flex;align-items:stretch}.btn-select{color:#fff;background-color:#4242d1;margin-left:2rem}.btn-cancel{color:#fff;background-color:#c22929}.readonly:focus{outline:none}.icon,.icon-clear,.icon-globe{display:inline-block;background-size:1rem 1rem;background-position:center;background-repeat:no-repeat;min-width:1rem;min-height:1rem;width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);z-index:1}.clickable{cursor:pointer}.icon-globe{background:url(/assets/img/globe.svg) no-repeat center;background:var(--lux-autocomplete-icon-globe, url(/assets/img/globe.svg) no-repeat center);background-size:1rem;height:100%}.icon-clear{width:1.5rem;width:var(--lux-autocomplete-icon-width, 1.5rem);background:url(/assets/img/filter-clear.png) no-repeat center;background:var(--lux-autocomplete-icon-clear, url(/assets/img/filter-clear.png) no-repeat center);background-size:.5rem .5rem;background-size:var(--lux-autocomplete-icon-bg-size, .5rem .5rem);z-index:1}.lux-modal-body{padding:0}.map-container{height:45vh;height:var(--lux-geolocation-map-height, 45vh);width:90vw;width:var(--lux-geolocation-map-width, 90vw)}\n"]
|
|
2695
2747
|
},] }
|
|
2696
2748
|
];
|
|
2697
2749
|
GeolocationComponent.ctorParameters = () => [
|
|
@@ -2701,6 +2753,7 @@ GeolocationComponent.ctorParameters = () => [
|
|
|
2701
2753
|
GeolocationComponent.propDecorators = {
|
|
2702
2754
|
latitude: [{ type: ViewChild, args: ['latitude', { static: true },] }],
|
|
2703
2755
|
longitude: [{ type: ViewChild, args: ['longitude', { static: true },] }],
|
|
2756
|
+
map: [{ type: ViewChild, args: ['map', { static: false },] }],
|
|
2704
2757
|
minLatitude: [{ type: Input }],
|
|
2705
2758
|
maxLatitude: [{ type: Input }],
|
|
2706
2759
|
minLongitude: [{ type: Input }],
|
|
@@ -3096,12 +3149,10 @@ class MapComponent {
|
|
|
3096
3149
|
return this._zoom;
|
|
3097
3150
|
}
|
|
3098
3151
|
set center(center) {
|
|
3099
|
-
if (center) {
|
|
3100
|
-
|
|
3101
|
-
|
|
3102
|
-
|
|
3103
|
-
this._map.getView().setCenter(ol.proj.fromLonLat(center.coordinates));
|
|
3104
|
-
}
|
|
3152
|
+
if (center && center.coordinates && center.coordinates.length === 2) {
|
|
3153
|
+
this._center = center;
|
|
3154
|
+
if (this._map) {
|
|
3155
|
+
this._map.getView().setCenter(ol.proj.fromLonLat(center.coordinates));
|
|
3105
3156
|
}
|
|
3106
3157
|
}
|
|
3107
3158
|
}
|
|
@@ -3448,7 +3499,7 @@ PaginationComponent.decorators = [
|
|
|
3448
3499
|
{ type: Component, args: [{
|
|
3449
3500
|
selector: 'lux-pagination',
|
|
3450
3501
|
template: "<div class=\"lux-pagination\" *ngIf=\"showPagination\">\n <ng-container *ngIf=\"!hidePrevious\">\n <a\n luxTooltip\n [content]=\"first\"\n placement=\"top\"\n delay=\"500\"\n (click)=\"onFirst()\"\n [ngClass]=\"{\n enabledFirstLast: !hidePrevious\n }\"\n class=\"button-pagination icon arrow-left-end\"\n ></a>\n <a\n luxTooltip\n [content]=\"previous\"\n placement=\"top\"\n delay=\"500\"\n (click)=\"onPrevious()\"\n [ngClass]=\"{\n enabledFirstLast: !hidePrevious\n }\"\n class=\"button-pagination icon arrow-left\"\n ></a>\n </ng-container>\n\n <span class=\"ellipsis\" *ngIf=\"displayPreviousEllipsis\">...</span>\n\n <ng-container *ngFor=\"let pageNum of pages\">\n <a\n luxTooltip\n content=\"{{ pageNum + 1 }}\"\n placement=\"top\"\n delay=\"500\"\n [ngClass]=\"{\n disabled: pageNum === paginationInfo.page,\n enabled: pageNum !== paginationInfo.page\n }\"\n class=\"button-pagination\"\n (click)=\"onPage(pageNum)\"\n >{{ pageNum + 1 }}</a\n >\n </ng-container>\n\n <span class=\"ellipsis\" *ngIf=\"displayNextEllipsis\">...</span>\n\n <ng-container *ngIf=\"!lastPage\">\n <a\n luxTooltip\n [content]=\"next\"\n placement=\"top\"\n delay=\"500\"\n (click)=\"onNext()\"\n [ngClass]=\"{\n enabledFirstLast: !lastPage\n }\"\n class=\"button-pagination icon arrow-right\"\n ></a>\n <a\n luxTooltip\n [content]=\"last\"\n placement=\"top\"\n delay=\"500\"\n (click)=\"onLast()\"\n [ngClass]=\"{\n enabledFirstLast: !lastPage\n }\"\n class=\"button-pagination icon arrow-right-end\"\n ></a>\n </ng-container>\n</div>\n",
|
|
3451
|
-
styles: ["input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color
|
|
3502
|
+
styles: [":focus{z-index:1}input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);border:1px solid #495057;border:1px solid var(--lux-input-border-color, #495057);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none}.lux-pagination{display:flex;flex-direction:row;margin:2% 0;width:100%;background:white;align-items:center}.disabled{cursor:not-allowed;border:1px solid #325c81;border:var(--lux-pagination-disabled-border, 1px solid #325c81);border-radius:10%;border-radius:var(--lux-pagination-disabled-border-radius, 10%);padding:1%;margin:0 .7%;color:#fff;color:var(--lux-pagination-disabled-color, white);background-color:#325c81;background-color:var(--lux-pagination-disabled-background-color, #325c81);text-decoration:none;pointer-events:none}.enabled{border:1px solid #cfcfcf;border:var(--lux-pagination-enabled-border, 1px solid #cfcfcf);border-radius:10%;border-radius:var(--lux-pagination-enabled-border-radius, 10%);padding:1%;margin:0 .7%;color:#325c81;color:var(--lux-pagination-enabled-color, #325c81);width:-webkit-min-content;width:-moz-min-content;width:min-content;cursor:pointer}.enabledFirstLast{border:1px solid #cfcfcf;border-radius:10%;padding:1%;color:#325c81;margin:0 .7%;width:-webkit-min-content;width:-moz-min-content;width:min-content;cursor:pointer}.ellipsis{margin:0 .5rem;padding:0;color:#325c81;width:-webkit-min-content;width:-moz-min-content;width:min-content}.button-pagination{width:1em;width:var(--lux-pagination-button-width, 1em);height:1.2em;height:var(--lux-pagination-button-height, 1.2em);font-size:80%;font-size:var(--lux-pagination-font-size, 80%);text-align:center}.icon{background-size:1.3em 1.4em;background-position:center;background-repeat:no-repeat}.arrow-right{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2268%22 height%3D%2248%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%3E %3Ctitle%3Ebackground%3C%2Ftitle%3E %3Crect fill%3D%22none%22 id%3D%22canvas_background%22 height%3D%22402%22 width%3D%221082%22 y%3D%22-1%22 x%3D%22-1%22%2F%3E %3C%2Fg%3E %3Cg%3E %3Ctitle%3ELayer 1%3C%2Ftitle%3E %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_2%22 points%3D%2221.8%2C45.7 10.4%2C44.3 30.8%2C24 10.4%2C3.7 21.8%2C2.3 43.5%2C24 %22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\");background-position:.4em}.arrow-left{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2268%22 height%3D%2248%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%3E %3Ctitle%3Ebackground%3C%2Ftitle%3E %3Crect fill%3D%22none%22 id%3D%22canvas_background%22 height%3D%22402%22 width%3D%221082%22 y%3D%22-1%22 x%3D%22-1%22%2F%3E %3C%2Fg%3E %3Cg%3E %3Ctitle%3ELayer 1%3C%2Ftitle%3E %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_2%22 points%3D%2221.8%2C45.7 10.4%2C44.3 30.8%2C24 10.4%2C3.7 21.8%2C2.3 43.5%2C24 %22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\");transform:rotate(180deg);background-position:.4em}.arrow-right-end{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2268%22 height%3D%2248%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%3E %3Ctitle%3Ebackground%3C%2Ftitle%3E %3Crect fill%3D%22none%22 id%3D%22canvas_background%22 height%3D%22402%22 width%3D%221082%22 y%3D%22-1%22 x%3D%22-1%22%2F%3E %3C%2Fg%3E %3Cg%3E %3Ctitle%3ELayer 1%3C%2Ftitle%3E %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_2%22 points%3D%2221.8%2C45.7 10.4%2C44.3 30.8%2C24 10.4%2C3.7 21.8%2C2.3 43.5%2C24 %22%2F%3E %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_3%22 points%3D%2241.8%2C45.7 30.4%2C44.3 50.8%2C24 30.4%2C3.7 41.8%2C2.3 63.5%2C24 %22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\");background-position:.1em}.arrow-left-end{background-image:url(\"data:image/svg+xml,%3Csvg width%3D%2268%22 height%3D%2248%22 xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E %3Cg%3E %3Ctitle%3Ebackground%3C%2Ftitle%3E %3Crect fill%3D%22none%22 id%3D%22canvas_background%22 height%3D%22402%22 width%3D%221082%22 y%3D%22-1%22 x%3D%22-1%22%2F%3E %3C%2Fg%3E %3Cg%3E %3Ctitle%3ELayer 1%3C%2Ftitle%3E %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_2%22 points%3D%2221.8%2C45.7 10.4%2C44.3 30.8%2C24 10.4%2C3.7 21.8%2C2.3 43.5%2C24 %22%2F%3E %3Cpolygon fill%3D%22%23325C81%22 id%3D%22svg_3%22 points%3D%2241.8%2C45.7 30.4%2C44.3 50.8%2C24 30.4%2C3.7 41.8%2C2.3 63.5%2C24 %22%2F%3E %3C%2Fg%3E%3C%2Fsvg%3E\");background-position:.1em;transform:rotate(180deg)}@media only screen and (min-width: 300px) and (max-width: 500px){.arrow-right{background-position:.2em}.arrow-left{background-position:.2em}.arrow-right-end{background-position:0em}.arrow-left-end{background-position:0em}}@media only screen and (min-width: 500px) and (max-width: 850px){.arrow-right{background-position:.3em}.arrow-left{background-position:.3em}.arrow-right-end{background-position:0em}.arrow-left-end{background-position:0em}}@media only screen and (min-width: 900px){.arrow-right{background-position:.2em}.arrow-left{background-position:.2em}.arrow-right-end{background-position:0em}.arrow-left-end{background-position:0em}}\n"]
|
|
3452
3503
|
},] }
|
|
3453
3504
|
];
|
|
3454
3505
|
PaginationComponent.ctorParameters = () => [];
|
|
@@ -3555,7 +3606,7 @@ RadiogroupComponent.decorators = [
|
|
|
3555
3606
|
useExisting: forwardRef(() => RadiogroupComponent)
|
|
3556
3607
|
}
|
|
3557
3608
|
],
|
|
3558
|
-
styles: ["input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color
|
|
3609
|
+
styles: [":focus{z-index:1}input,select,textarea{border:solid 1px #495057;border:solid 1px var(--lux-input-border-color, #495057);margin:0;margin:var(--lux-input-margin, 0rem);padding:0 .5rem;padding:var(--lux-input-padding, 0rem .5rem)}.alert{padding:.2rem 2rem;background:#fe2e2e;background:var(--lux-alert-background, #fe2e2e);color:#fff;color:var(--lux-alert-color, white);font-family:Consolas,monospace;width:45%;margin-right:1rem;display:inline-block}.symbol{display:inline-block;align-items:baseline;padding:0 .5rem;margin-bottom:0;font-weight:400;color:default;color:var(--lux-symbol-color, default);text-align:center;white-space:nowrap;background:default;background:var(--lux-symbol-background, default);border:1px solid #495057;border:1px solid var(--lux-input-border-color, #495057);font-size:1rem;font-size:var(--lux-symbol-font-size, 1rem)}.rounded,.rounded-right,.rounded-middle,.rounded-left{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.rounded-left{border-top-right-radius:0;border-bottom-right-radius:0}.rounded-middle{border-radius:0}.rounded-right{border-top-left-radius:0;border-bottom-left-radius:0}.prefix{border-right:none}.infix{border-left:none;border-right:none}.postfix{border-left:none}.radiogroup{display:flex}.radio-item{border-radius:0;border:1px solid #ccc;padding:0 .5rem;padding:var(--lux-radiogroup-padding, 0rem .5rem)}.radio-item input{display:none}.radio-item label{color:initial;color:var(--lux-radiogroup-color, initial);font-size:initial;font-size:var(--lux-radiogroup-font-size, initial);margin-top:.3rem;margin-bottom:.3rem}.radio-item.selected{background-color:#2e2eac;background-color:var(--lux-radiogroup-selected-background-color, #2e2eac)}.radio-item.selected label{font-size:initial;font-size:var(--lux-radiogroup-font-size, initial);color:#fff;color:var(--lux-radiogroup-selected-color, white)}.radio-start{border-top-left-radius:.5rem;border-bottom-left-radius:.5rem}.radio-end{border-top-right-radius:.5rem;border-bottom-right-radius:.5rem}.disabled .radio-item{background-color:#f0f0f0;color:#444}.disabled .selected{font-size:initial;font-size:var(--lux-radiogroup-selected-disabled-font-size, initial);color:#fff;color:var(--lux-radiogroup-selected-disabled-color, white);background-color:#9898ec;background-color:var(--lux-radiogroup-selected-disabled-background-color, #9898ec)}.unselectable{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}\n"]
|
|
3559
3610
|
},] }
|
|
3560
3611
|
];
|
|
3561
3612
|
RadiogroupComponent.ctorParameters = () => [];
|