@metadev/lux 0.15.0 → 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.
@@ -119,9 +119,12 @@
119
119
  (isNewArray ? newValue.length !== 0 : Boolean(newValue)));
120
120
  };
121
121
 
122
+ var LOST_FOCUS_TIME_WINDOW_MS = 200; // ms
122
123
  var AutocompleteComponent = /** @class */ (function () {
123
124
  function AutocompleteComponent(cd) {
124
125
  this.cd = cd;
126
+ this.lostFocusHandled = false;
127
+ this.t0 = 0;
125
128
  this.showSpinner = false;
126
129
  this.touched = false;
127
130
  this.completionList = [];
@@ -323,14 +326,33 @@
323
326
  };
324
327
  AutocompleteComponent.prototype.onLostFocus = function (label) {
325
328
  var _this = this;
326
- if (label) {
327
- this.pickSelectionOrFirstMatch(label);
328
- }
329
+ this.lostFocusHandled = false;
330
+ this.t0 = performance.now();
331
+ console.log('Init LostFocus');
329
332
  setTimeout(function () {
330
- _this.toggleCompletion(false, label);
331
- }, 200);
333
+ // needs to postpone actions some milliseconds to verify if
334
+ // lost focus was followed by a list selection -> then cancel
335
+ // if not -> make side effect
336
+ if (!_this.lostFocusHandled) {
337
+ console.log('Lost focus 2', _this.lostFocusHandled, 'SIDE EFFECT', performance.now() - _this.t0, 'label:', label);
338
+ if (label) {
339
+ _this.pickSelectionOrFirstMatch(label);
340
+ }
341
+ _this.toggleCompletion(false, label);
342
+ }
343
+ else {
344
+ // do nothing (list selection took place)
345
+ console.log('onlost focus 2', _this.lostFocusHandled, 'nothing', performance.now() - _this.t0);
346
+ }
347
+ }, LOST_FOCUS_TIME_WINDOW_MS);
332
348
  };
333
349
  AutocompleteComponent.prototype.complete = function (item) {
350
+ this.lostFocusHandled = true; // prevent a previous lostFocus to trigger a side effect
351
+ var ellapsed = performance.now() - this.t0;
352
+ if (ellapsed > LOST_FOCUS_TIME_WINDOW_MS) {
353
+ console.warn('complete. lostfocus->click timeout of ', LOST_FOCUS_TIME_WINDOW_MS, 'ms exceed: ', performance.now() - this.t0, ' ms');
354
+ }
355
+ console.log('complete. set to true. CANCELED side effect', performance.now() - this.t0);
334
356
  if (item !== null) {
335
357
  this.value = item.key;
336
358
  this.label = item.label;
@@ -466,7 +488,7 @@
466
488
  useExisting: i0.forwardRef(function () { return AutocompleteComponent; })
467
489
  }
468
490
  ],
469
- 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:#495057;color:var(--lux-symbol-color, #495057);text-align:center;white-space:nowrap;background:#e9ecef;background:var(--lux-symbol-background, #e9ecef);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,.postfix,.infix,.prefix{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.prefix{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.infix{border-radius:0}.postfix{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.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"]
491
+ 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"]
470
492
  },] }
471
493
  ];
472
494
  AutocompleteComponent.ctorParameters = function () { return [
@@ -1146,7 +1168,7 @@
1146
1168
  DatetimeComponent.decorators = [
1147
1169
  { type: i0.Component, args: [{
1148
1170
  selector: 'lux-datetime',
1149
- 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=\"infix\"\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 ? 'postfix symbol' : 'infix symbol'\">\n <span>{{ localTime ? '' : 'UTC' }}</span>\n </div>\n</ng-container>\n<button\n #clearButton\n *ngIf=\"!(disabled || readonly)\"\n class=\"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",
1171
+ 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",
1150
1172
  providers: [
1151
1173
  {
1152
1174
  provide: forms.NG_VALUE_ACCESSOR,
@@ -1159,7 +1181,7 @@
1159
1181
  useExisting: i0.forwardRef(function () { return DatetimeComponent; })
1160
1182
  }
1161
1183
  ],
1162
- 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:#495057;color:var(--lux-symbol-color, #495057);text-align:center;white-space:nowrap;background:#e9ecef;background:var(--lux-symbol-background, #e9ecef);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,.postfix,.infix,.prefix{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.prefix{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.infix{border-radius:0}.postfix{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}: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"]
1184
+ 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"]
1163
1185
  },] }
1164
1186
  ];
1165
1187
  DatetimeComponent.ctorParameters = function () { return []; };
@@ -1649,6 +1671,12 @@
1649
1671
  InputComponent.prototype.isPermillage = function () {
1650
1672
  return this.type === 'permillage';
1651
1673
  };
1674
+ InputComponent.prototype.hasPrefix = function () {
1675
+ return this.currency === 'USD';
1676
+ };
1677
+ InputComponent.prototype.hasPostfix = function () {
1678
+ return (this.currency === 'EUR' || this.isPercentage() || this.isPermillage());
1679
+ };
1652
1680
  InputComponent.prototype.checkClassName = function () {
1653
1681
  if (this.readonly === true) {
1654
1682
  return 'readonly';
@@ -1723,7 +1751,7 @@
1723
1751
  InputComponent.decorators = [
1724
1752
  { type: i0.Component, args: [{
1725
1753
  selector: 'lux-input',
1726
- 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 class=\"infix\"\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 symbol\">\n <span>\u20AC</span>\n</div>\n<div *ngIf=\"isPercentage()\" class=\"postfix symbol\">\n <span>%</span>\n</div>\n<div *ngIf=\"isPermillage()\" class=\"postfix 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",
1754
+ 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",
1727
1755
  providers: [
1728
1756
  {
1729
1757
  provide: forms.NG_VALUE_ACCESSOR,
@@ -1736,7 +1764,7 @@
1736
1764
  useExisting: i0.forwardRef(function () { return InputComponent; })
1737
1765
  }
1738
1766
  ],
1739
- 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:#495057;color:var(--lux-symbol-color, #495057);text-align:center;white-space:nowrap;background:#e9ecef;background:var(--lux-symbol-background, #e9ecef);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,.postfix,.infix,.prefix{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.prefix{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.infix{border-radius:0}.postfix{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}:host{position:relative;display:flex;align-items:stretch}.readonly{border:none}.readonly:focus{border:none;outline:none}\n"]
1767
+ 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"]
1740
1768
  },] }
1741
1769
  ];
1742
1770
  InputComponent.ctorParameters = function () { return [
@@ -1897,7 +1925,7 @@
1897
1925
  useExisting: i0.forwardRef(function () { return FilterComponent; })
1898
1926
  }
1899
1927
  ],
1900
- 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:#495057;color:var(--lux-symbol-color, #495057);text-align:center;white-space:nowrap;background:#e9ecef;background:var(--lux-symbol-background, #e9ecef);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,.postfix,.infix,.prefix{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.prefix{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.infix{border-radius:0}.postfix{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.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"]
1928
+ 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"]
1901
1929
  },] }
1902
1930
  ];
1903
1931
  FilterComponent.ctorParameters = function () { return []; };
@@ -2880,36 +2908,52 @@
2880
2908
  this.latitudeValue = null;
2881
2909
  this.longitudeValue = null;
2882
2910
  this.isValidNumber = isValidNumber;
2883
- this.userErrors = {
2884
- en: {
2885
- required: 'Required field.',
2886
- minLatitude: 'Minimum latitude is $minLatitude.',
2887
- maxLatitude: 'Maximum latitude is $maxLatitude.',
2888
- minLongitude: 'Minimum longitude is $minLongitude.',
2889
- maxLongitude: 'Maximum longitude is $maxLongitude.'
2890
- },
2891
- es: {
2892
- required: 'El campo es obligatorio.',
2893
- minLatitude: 'La latitud mínima es $minLatitude.',
2894
- maxLatitude: 'La latitud máxima es $maxLatitude.',
2895
- minLongitude: 'La longitud mínima es $minLongitude.',
2896
- maxLongitude: 'La longitud máxima es $maxLongitude.'
2897
- }
2898
- };
2899
- this.cardinalPoints = {
2911
+ this.i18n = {
2900
2912
  en: {
2901
- north: 'N',
2902
- south: 'S',
2903
- east: 'E',
2904
- west: 'W',
2905
- unknown: '?'
2913
+ lat: 'latitude',
2914
+ lon: 'longitude',
2915
+ selectLocation: 'Select location',
2916
+ location: 'Location',
2917
+ selectAction: 'Select',
2918
+ cancelAction: 'Cancel',
2919
+ closeAction: 'Close',
2920
+ typeToSearch: 'type to search',
2921
+ cardinalPoints: {
2922
+ north: 'N',
2923
+ south: 'S',
2924
+ east: 'E',
2925
+ west: 'W'
2926
+ },
2927
+ userErrors: {
2928
+ required: 'Required field.',
2929
+ minLatitude: 'Minimum latitude is $minLatitude.',
2930
+ maxLatitude: 'Maximum latitude is $maxLatitude.',
2931
+ minLongitude: 'Minimum longitude is $minLongitude.',
2932
+ maxLongitude: 'Maximum longitude is $maxLongitude.'
2933
+ }
2906
2934
  },
2907
2935
  es: {
2908
- north: 'N',
2909
- south: 'S',
2910
- east: 'E',
2911
- west: 'O',
2912
- unknown: '?'
2936
+ lat: 'latitud',
2937
+ lon: 'longitud',
2938
+ selectLocation: 'Seleccione ubicación',
2939
+ location: 'Ubicación',
2940
+ selectAction: 'Seleccionar',
2941
+ cancelAction: 'Cancelar',
2942
+ closeAction: 'Cerrar',
2943
+ typeToSearch: 'escribe para buscar',
2944
+ cardinalPoints: {
2945
+ north: 'N',
2946
+ south: 'S',
2947
+ east: 'E',
2948
+ west: 'O'
2949
+ },
2950
+ userErrors: {
2951
+ required: 'El campo es obligatorio.',
2952
+ minLatitude: 'La latitud mínima es $minLatitude.',
2953
+ maxLatitude: 'La latitud máxima es $maxLatitude.',
2954
+ minLongitude: 'La longitud mínima es $minLongitude.',
2955
+ maxLongitude: 'La longitud máxima es $maxLongitude.'
2956
+ }
2913
2957
  }
2914
2958
  };
2915
2959
  this.lang = languageDetector();
@@ -3010,48 +3054,40 @@
3010
3054
  GeolocationComponent.prototype.validate = function (control) {
3011
3055
  var value = control.value;
3012
3056
  var result = null;
3013
- if (this.required && (value === null || value === undefined)) {
3057
+ if (this.required && !exists(value)) {
3014
3058
  result = result || {};
3015
3059
  result.required = { value: value, reason: 'Required field.' };
3016
3060
  }
3017
- if (this.minLatitude !== undefined &&
3018
- this.minLatitude !== null &&
3019
- this.latitudeValue < this.minLatitude) {
3061
+ if (exists(this.minLatitude) && this.latitudeValue < this.minLatitude) {
3020
3062
  result = result || {};
3021
3063
  result.minLatitude = {
3022
3064
  value: value,
3023
3065
  min: this.minLatitude,
3024
- reason: "Value is lower than minimum value: " + this.minLatitude + "."
3066
+ reason: "Latitude is lower than minimum value: " + this.minLatitude + "."
3025
3067
  };
3026
3068
  }
3027
- if (this.maxLatitude !== undefined &&
3028
- this.maxLatitude !== null &&
3029
- this.latitudeValue < this.maxLatitude) {
3069
+ if (exists(this.maxLatitude) && this.latitudeValue > this.maxLatitude) {
3030
3070
  result = result || {};
3031
3071
  result.maxLatitude = {
3032
3072
  value: value,
3033
3073
  max: this.maxLatitude,
3034
- reason: "Value is lower than maximum value: " + this.maxLatitude + "."
3074
+ reason: "Latitude is higher than maximum value: " + this.maxLatitude + "."
3035
3075
  };
3036
3076
  }
3037
- if (this.minLongitude !== undefined &&
3038
- this.minLongitude !== null &&
3039
- this.longitudeValue < this.minLongitude) {
3077
+ if (exists(this.minLongitude) && this.longitudeValue < this.minLongitude) {
3040
3078
  result = result || {};
3041
3079
  result.minLongitude = {
3042
3080
  value: value,
3043
3081
  min: this.minLongitude,
3044
- reason: "Value is lower than minimum value: " + this.minLongitude + "."
3082
+ reason: "Longitude is lower than minimum value: " + this.minLongitude + "."
3045
3083
  };
3046
3084
  }
3047
- if (this.maxLongitude !== undefined &&
3048
- this.maxLongitude !== null &&
3049
- this.longitudeValue < this.maxLongitude) {
3085
+ if (exists(this.maxLongitude) && this.longitudeValue > this.maxLongitude) {
3050
3086
  result = result || {};
3051
3087
  result.maxLongitude = {
3052
3088
  value: value,
3053
3089
  max: this.maxLongitude,
3054
- reason: "Value is lower than maximum value: " + this.maxLongitude + "."
3090
+ reason: "Longitude is higher than maximum value: " + this.maxLongitude + "."
3055
3091
  };
3056
3092
  }
3057
3093
  this.lastErrors = result;
@@ -3068,28 +3104,49 @@
3068
3104
  if (this.disabled || this.readonly) {
3069
3105
  return;
3070
3106
  }
3071
- this.value = {
3072
- type: 'Point',
3073
- coordinates: [this.longitudeValue, newLatitude]
3074
- };
3107
+ if (isValidNumber(this.longitudeValue)) {
3108
+ this.value = {
3109
+ type: 'Point',
3110
+ coordinates: [this.longitudeValue, newLatitude]
3111
+ };
3112
+ }
3113
+ else {
3114
+ this.value = {
3115
+ type: 'Point',
3116
+ coordinates: [0, newLatitude]
3117
+ };
3118
+ }
3075
3119
  };
3076
3120
  GeolocationComponent.prototype.updateLongitude = function (newLongitude) {
3077
3121
  if (this.disabled || this.readonly) {
3078
3122
  return;
3079
3123
  }
3080
- this.value = {
3081
- type: 'Point',
3082
- coordinates: [newLongitude, this.latitudeValue]
3083
- };
3124
+ if (isValidNumber(this.latitudeValue)) {
3125
+ this.value = {
3126
+ type: 'Point',
3127
+ coordinates: [newLongitude, this.latitudeValue]
3128
+ };
3129
+ }
3130
+ else {
3131
+ this.value = {
3132
+ type: 'Point',
3133
+ coordinates: [newLongitude, 0]
3134
+ };
3135
+ }
3084
3136
  };
3085
3137
  GeolocationComponent.prototype.updateLatitudeAndLongitude = function (newLatitudeAndLongitude) {
3086
3138
  if (this.disabled || this.readonly) {
3087
3139
  return;
3088
3140
  }
3089
- this.value = {
3090
- type: 'Point',
3091
- coordinates: newLatitudeAndLongitude
3092
- };
3141
+ if (!exists(newLatitudeAndLongitude)) {
3142
+ this.value = undefined;
3143
+ }
3144
+ else {
3145
+ this.value = {
3146
+ type: 'Point',
3147
+ coordinates: newLatitudeAndLongitude
3148
+ };
3149
+ }
3093
3150
  };
3094
3151
  GeolocationComponent.prototype.roundToStepAndUpdateLatitudeAndLongitude = function (newLatitudeAndLongitude) {
3095
3152
  var newLatitude = roundToMultipleOf(newLatitudeAndLongitude[1], this.step);
@@ -3097,6 +3154,9 @@
3097
3154
  if (this.disabled || this.readonly) {
3098
3155
  return;
3099
3156
  }
3157
+ if (!exists(newLatitudeAndLongitude)) {
3158
+ this.value = undefined;
3159
+ }
3100
3160
  this.value = {
3101
3161
  type: 'Point',
3102
3162
  coordinates: [newLongitude, newLatitude]
@@ -3109,11 +3169,19 @@
3109
3169
  if (isValidNumber(newLatitude)) {
3110
3170
  this.updateLatitude(+newLatitude);
3111
3171
  }
3172
+ else {
3173
+ this.updateLatitude(undefined);
3174
+ }
3175
+ this.markAsTouched();
3112
3176
  };
3113
3177
  GeolocationComponent.prototype.onEventLongitude = function (newLongitude) {
3114
3178
  if (isValidNumber(newLongitude)) {
3115
3179
  this.updateLongitude(+newLongitude);
3116
3180
  }
3181
+ else {
3182
+ this.updateLongitude(undefined);
3183
+ }
3184
+ this.markAsTouched();
3117
3185
  };
3118
3186
  GeolocationComponent.prototype.onKeyPress = function (event) {
3119
3187
  this.keyPress.emit(event);
@@ -3132,9 +3200,15 @@
3132
3200
  }
3133
3201
  }, function (_) { });
3134
3202
  };
3203
+ GeolocationComponent.prototype.onSearchLocationChanged = function (newValue, map) {
3204
+ map.markerPoint = newValue;
3205
+ map.center = map.markerPoint;
3206
+ };
3135
3207
  Object.defineProperty(GeolocationComponent.prototype, "mapTitle", {
3136
3208
  get: function () {
3137
- return this._disabled || !!this.readonly ? 'Location:' : 'Select location:';
3209
+ return this._disabled || !!this.readonly
3210
+ ? this.i18n[this.lang].location
3211
+ : this.i18n[this.lang].selectLocation;
3138
3212
  },
3139
3213
  enumerable: false,
3140
3214
  configurable: true
@@ -3166,7 +3240,7 @@
3166
3240
  GeolocationComponent.decorators = [
3167
3241
  { type: i0.Component, args: [{
3168
3242
  selector: 'lux-geolocation',
3169
- template: "<div class=\"lux-geolocation\" [id]=\"inputId\">\n <input\n #latitude\n class=\"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=\"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\">\n <span *ngIf=\"isValidNumber(latitudeValue) && latitudeValue >= 0\">{{\n cardinalPoints[this.lang].north\n }}</span>\n <span *ngIf=\"isValidNumber(latitudeValue) && latitudeValue < 0\">{{\n cardinalPoints[this.lang].south\n }}</span>\n <span *ngIf=\"!isValidNumber(latitudeValue)\">{{\n cardinalPoints[this.lang].unknown\n }}</span>\n </div>\n <input\n #longitude\n class=\"infix\"\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=\"lon\"\n [ngClass]=\"className\"\n (keyup)=\"onEventLongitude(longitude.value)\"\n (change)=\"onEventLongitude(longitude.value)\"\n (keypress)=\"onKeyPress($event)\"\n (blur)=\"onLostFocus()\"\n />\n <div class=\"infix symbol\">\n <span *ngIf=\"isValidNumber(longitudeValue) && longitudeValue >= 0\">{{\n cardinalPoints[this.lang].east\n }}</span>\n <span *ngIf=\"isValidNumber(longitudeValue) && longitudeValue < 0\">{{\n cardinalPoints[this.lang].west\n }}</span>\n <span *ngIf=\"!isValidNumber(longitudeValue)\">{{\n cardinalPoints[this.lang].unknown\n }}</span>\n </div>\n <button class=\"postfix symbol\" (click)=\"openModalMap(modalMap)\">\n <span>\uD83C\uDF10</span>\n </button>\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.minLatitude\">\n {{\n userErrors[this.lang].minLatitude.replace(\n '$minLatitude',\n lastErrors.minLatitude.min\n )\n }}\n </div>\n <div *ngIf=\"lastErrors.maxLatitude\">\n {{\n userErrors[this.lang].maxLatitude.replace(\n '$maxLatitude',\n lastErrors.maxLatitude.max\n )\n }}\n </div>\n <div *ngIf=\"lastErrors.minLongitude\">\n {{\n userErrors[this.lang].minLongitude.replace(\n '$minLongitude',\n lastErrors.minLongitude.min\n )\n }}\n </div>\n <div *ngIf=\"lastErrors.maxLongitude\">\n {{\n userErrors[this.lang].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 *ngIf=\"!disabled && !readonly\"\n [instance]=\"self\"\n [resolveLabelsFunction]=\"getLabels\"\n [populateFunction]=\"getData\"\n (valueChange)=\"\n map.markerPoint = searchBar.value;\n map.center = map.markerPoint\n \"\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 Cancel\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 Select\n </button>\n </div>\n</ng-template>\n",
3243
+ 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",
3170
3244
  providers: [
3171
3245
  {
3172
3246
  provide: forms.NG_VALUE_ACCESSOR,
@@ -3179,7 +3253,7 @@
3179
3253
  useExisting: i0.forwardRef(function () { return GeolocationComponent; })
3180
3254
  }
3181
3255
  ],
3182
- 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:#495057;color:var(--lux-symbol-color, #495057);text-align:center;white-space:nowrap;background:#e9ecef;background:var(--lux-symbol-background, #e9ecef);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,.postfix,.infix,.prefix{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.prefix{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.infix{border-radius:0}.postfix{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}:host{position:relative;display:flex;align-items:stretch}.btn-select{background-color:#b4b8f0}.btn-cancel{background-color:#ffced7}.readonly:focus{outline:none}.lux-modal-body{padding:0}.map-container{height:45vh}\n"]
3256
+ 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"]
3183
3257
  },] }
3184
3258
  ];
3185
3259
  GeolocationComponent.ctorParameters = function () { return [
@@ -3189,6 +3263,7 @@
3189
3263
  GeolocationComponent.propDecorators = {
3190
3264
  latitude: [{ type: i0.ViewChild, args: ['latitude', { static: true },] }],
3191
3265
  longitude: [{ type: i0.ViewChild, args: ['longitude', { static: true },] }],
3266
+ map: [{ type: i0.ViewChild, args: ['map', { static: false },] }],
3192
3267
  minLatitude: [{ type: i0.Input }],
3193
3268
  maxLatitude: [{ type: i0.Input }],
3194
3269
  minLongitude: [{ type: i0.Input }],
@@ -3602,12 +3677,10 @@
3602
3677
  return this._center;
3603
3678
  },
3604
3679
  set: function (center) {
3605
- if (center) {
3606
- if (center.coordinates && center.coordinates.length === 2) {
3607
- this._center = center;
3608
- if (this._map) {
3609
- this._map.getView().setCenter(ol.proj.fromLonLat(center.coordinates));
3610
- }
3680
+ if (center && center.coordinates && center.coordinates.length === 2) {
3681
+ this._center = center;
3682
+ if (this._map) {
3683
+ this._map.getView().setCenter(ol.proj.fromLonLat(center.coordinates));
3611
3684
  }
3612
3685
  }
3613
3686
  },
@@ -3980,7 +4053,7 @@
3980
4053
  { type: i0.Component, args: [{
3981
4054
  selector: 'lux-pagination',
3982
4055
  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",
3983
- 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:#495057;color:var(--lux-symbol-color, #495057);text-align:center;white-space:nowrap;background:#e9ecef;background:var(--lux-symbol-background, #e9ecef);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,.postfix,.infix,.prefix{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.prefix{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.infix{border-radius:0}.postfix{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.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"]
4056
+ 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"]
3984
4057
  },] }
3985
4058
  ];
3986
4059
  PaginationComponent.ctorParameters = function () { return []; };
@@ -4097,7 +4170,7 @@
4097
4170
  useExisting: i0.forwardRef(function () { return RadiogroupComponent; })
4098
4171
  }
4099
4172
  ],
4100
- 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:#495057;color:var(--lux-symbol-color, #495057);text-align:center;white-space:nowrap;background:#e9ecef;background:var(--lux-symbol-background, #e9ecef);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,.postfix,.infix,.prefix{border-radius:.25rem;border:1px solid;border:var(--lux-input-border, 1px solid)}.prefix{border-right:none;border-top-right-radius:0;border-bottom-right-radius:0}.infix{border-radius:0}.postfix{border-left:none;border-top-left-radius:0;border-bottom-left-radius:0}.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"]
4173
+ 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"]
4101
4174
  },] }
4102
4175
  ];
4103
4176
  RadiogroupComponent.ctorParameters = function () { return []; };