@siemens/element-ng 49.12.0 → 49.13.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/fesm2022/siemens-element-ng-application-header.mjs +35 -13
- package/fesm2022/siemens-element-ng-application-header.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-autocomplete.mjs +9 -13
- package/fesm2022/siemens-element-ng-autocomplete.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-form.mjs +24 -46
- package/fesm2022/siemens-element-ng-form.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-header-dropdown.mjs +14 -7
- package/fesm2022/siemens-element-ng-header-dropdown.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-ip-input.mjs +1 -1
- package/fesm2022/siemens-element-ng-ip-input.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-phone-number.mjs +63 -42
- package/fesm2022/siemens-element-ng-phone-number.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-tabs.mjs +33 -6
- package/fesm2022/siemens-element-ng-tabs.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-tooltip.mjs +178 -75
- package/fesm2022/siemens-element-ng-tooltip.mjs.map +1 -1
- package/fesm2022/siemens-element-ng-tree-view.mjs +1 -1
- package/fesm2022/siemens-element-ng-tree-view.mjs.map +1 -1
- package/package.json +3 -3
- package/types/siemens-element-ng-application-header.d.ts +12 -4
- package/types/siemens-element-ng-autocomplete.d.ts +19 -19
- package/types/siemens-element-ng-form.d.ts +1 -3
- package/types/siemens-element-ng-header-dropdown.d.ts +5 -0
- package/types/siemens-element-ng-phone-number.d.ts +2 -2
- package/types/siemens-element-ng-tabs.d.ts +4 -0
- package/types/siemens-element-ng-tooltip.d.ts +10 -26
|
@@ -129,7 +129,7 @@ class SiPhoneNumberInputComponent {
|
|
|
129
129
|
*/
|
|
130
130
|
errormessageId = input(`${this.id()}-errormessage`, ...(ngDevMode ? [{ debugName: "errormessageId" }] : []));
|
|
131
131
|
phoneInput = viewChild.required('phoneInput');
|
|
132
|
-
selectedCountry;
|
|
132
|
+
selectedCountry = signal(undefined, ...(ngDevMode ? [{ debugName: "selectedCountry" }] : []));
|
|
133
133
|
placeholder = '';
|
|
134
134
|
countryFocused = signal(false, ...(ngDevMode ? [{ debugName: "countryFocused" }] : []));
|
|
135
135
|
open = false;
|
|
@@ -157,7 +157,12 @@ class SiPhoneNumberInputComponent {
|
|
|
157
157
|
allowedCountries = computed(() => this.supportedCountries() ?? this.phoneUtil.getSupportedRegions(), ...(ngDevMode ? [{ debugName: "allowedCountries" }] : []));
|
|
158
158
|
disabledNgControl = signal(false, ...(ngDevMode ? [{ debugName: "disabledNgControl" }] : []));
|
|
159
159
|
isValidNumber = true;
|
|
160
|
-
phoneNumber
|
|
160
|
+
phoneNumber = signal(undefined, { ...(ngDevMode ? { debugName: "phoneNumber" } : {}), equal: (a, b) => {
|
|
161
|
+
if (!a || !b) {
|
|
162
|
+
return !a && !b;
|
|
163
|
+
}
|
|
164
|
+
return this.phoneUtil.isNumberMatch(a, b) === PhoneNumberUtil.MatchType.EXACT_MATCH;
|
|
165
|
+
} });
|
|
161
166
|
onChange = () => { };
|
|
162
167
|
onTouched = () => { };
|
|
163
168
|
ngOnChanges(changes) {
|
|
@@ -167,8 +172,9 @@ class SiPhoneNumberInputComponent {
|
|
|
167
172
|
}
|
|
168
173
|
/** @internal */
|
|
169
174
|
writeValue(value) {
|
|
170
|
-
|
|
171
|
-
|
|
175
|
+
const phoneNumber = this.parseNumber(value);
|
|
176
|
+
this.phoneNumber.set(phoneNumber);
|
|
177
|
+
if (phoneNumber) {
|
|
172
178
|
this.writeValueToInput();
|
|
173
179
|
this.country.set(this.getRegionCode());
|
|
174
180
|
}
|
|
@@ -198,12 +204,13 @@ class SiPhoneNumberInputComponent {
|
|
|
198
204
|
return null;
|
|
199
205
|
}
|
|
200
206
|
this.isValidNumber = false;
|
|
201
|
-
|
|
207
|
+
const phoneNumber = this.phoneNumber();
|
|
208
|
+
if (!phoneNumber || !this.phoneUtil.isValidNumber(phoneNumber)) {
|
|
202
209
|
return {
|
|
203
210
|
invalidPhoneNumberFormat: true
|
|
204
211
|
};
|
|
205
212
|
}
|
|
206
|
-
if (!this.countryList().some(c => c.value.isoCode === this.selectedCountry.isoCode)) {
|
|
213
|
+
if (!this.countryList().some(c => c.value.isoCode === this.selectedCountry().isoCode)) {
|
|
207
214
|
return {
|
|
208
215
|
notSupportedPhoneNumberCountry: true
|
|
209
216
|
};
|
|
@@ -213,23 +220,24 @@ class SiPhoneNumberInputComponent {
|
|
|
213
220
|
}
|
|
214
221
|
input() {
|
|
215
222
|
const rawNumber = this.phoneInput().nativeElement.value;
|
|
216
|
-
|
|
217
|
-
|
|
223
|
+
const phoneNumber = this.parseNumber(rawNumber);
|
|
224
|
+
this.phoneNumber.set(phoneNumber);
|
|
225
|
+
if (phoneNumber) {
|
|
218
226
|
const regionCode = this.getRegionCode();
|
|
219
227
|
let countryInfo = this.countryList().find(country => regionCode === country.value.isoCode)?.value;
|
|
220
228
|
if (!countryInfo && regionCode) {
|
|
221
229
|
countryInfo = {
|
|
222
230
|
name: this.getCountryName(regionCode),
|
|
223
|
-
countryCode:
|
|
231
|
+
countryCode: phoneNumber.getCountryCode(),
|
|
224
232
|
isoCode: regionCode
|
|
225
233
|
};
|
|
226
234
|
}
|
|
227
|
-
if (countryInfo && this.selectedCountry?.isoCode !== countryInfo.isoCode) {
|
|
228
|
-
this.selectedCountry
|
|
235
|
+
if (countryInfo && this.selectedCountry()?.isoCode !== countryInfo.isoCode) {
|
|
236
|
+
this.selectedCountry.set(countryInfo);
|
|
229
237
|
}
|
|
230
238
|
}
|
|
231
239
|
else if (rawNumber.trim().startsWith('+')) {
|
|
232
|
-
this.selectedCountry
|
|
240
|
+
this.selectedCountry.set(undefined);
|
|
233
241
|
}
|
|
234
242
|
this.handleChange();
|
|
235
243
|
}
|
|
@@ -237,14 +245,9 @@ class SiPhoneNumberInputComponent {
|
|
|
237
245
|
this.countryFocused.set(false);
|
|
238
246
|
this.onTouched();
|
|
239
247
|
this.writeValueToInput();
|
|
240
|
-
this.valueChange.emit({
|
|
241
|
-
country: this.selectedCountry,
|
|
242
|
-
phoneNumber: this.formatPhoneNumber(PhoneNumberFormat.INTERNATIONAL),
|
|
243
|
-
isValid: this.isValidNumber
|
|
244
|
-
});
|
|
245
248
|
}
|
|
246
249
|
countryInput(num) {
|
|
247
|
-
this.selectedCountry
|
|
250
|
+
this.selectedCountry.set(num);
|
|
248
251
|
this.updatePlaceholder();
|
|
249
252
|
this.refreshValueAfterCountryChange();
|
|
250
253
|
this.handleChange();
|
|
@@ -261,15 +264,15 @@ class SiPhoneNumberInputComponent {
|
|
|
261
264
|
}
|
|
262
265
|
writeCountry() {
|
|
263
266
|
const currentCountry = this.country();
|
|
264
|
-
this.selectedCountry
|
|
265
|
-
if (!this.selectedCountry) {
|
|
267
|
+
this.selectedCountry.set(this.countryList().find(country => country.value.isoCode === currentCountry)?.value);
|
|
268
|
+
if (!this.selectedCountry()) {
|
|
266
269
|
const countryCode = this.phoneUtil.getCountryCodeForRegion(currentCountry ?? this.defaultCountry() ?? 'XX');
|
|
267
270
|
if (countryCode) {
|
|
268
|
-
this.selectedCountry
|
|
271
|
+
this.selectedCountry.set({
|
|
269
272
|
isoCode: currentCountry,
|
|
270
273
|
countryCode,
|
|
271
274
|
name: this.getCountryName(currentCountry)
|
|
272
|
-
};
|
|
275
|
+
});
|
|
273
276
|
}
|
|
274
277
|
}
|
|
275
278
|
this.updatePlaceholder();
|
|
@@ -280,9 +283,10 @@ class SiPhoneNumberInputComponent {
|
|
|
280
283
|
return (new Intl.DisplayNames([this.translate.currentLanguage ?? this.locale], { type: 'region' }).of(countryCode.toUpperCase()) ?? '');
|
|
281
284
|
}
|
|
282
285
|
updatePlaceholder() {
|
|
283
|
-
|
|
286
|
+
const selectedCountry = this.selectedCountry();
|
|
287
|
+
if (selectedCountry) {
|
|
284
288
|
this.placeholder = this.phoneUtil
|
|
285
|
-
.format(this.phoneUtil.getExampleNumber(
|
|
289
|
+
.format(this.phoneUtil.getExampleNumber(selectedCountry.isoCode), PhoneNumberFormat.NATIONAL)
|
|
286
290
|
.replace(/^0/, '');
|
|
287
291
|
}
|
|
288
292
|
}
|
|
@@ -290,7 +294,7 @@ class SiPhoneNumberInputComponent {
|
|
|
290
294
|
try {
|
|
291
295
|
let regionCodeForParsing;
|
|
292
296
|
if (!rawNumber?.trim().startsWith('+')) {
|
|
293
|
-
regionCodeForParsing = this.selectedCountry?.isoCode;
|
|
297
|
+
regionCodeForParsing = this.selectedCountry()?.isoCode;
|
|
294
298
|
}
|
|
295
299
|
return this.phoneUtil.parse(rawNumber, regionCodeForParsing);
|
|
296
300
|
}
|
|
@@ -304,42 +308,50 @@ class SiPhoneNumberInputComponent {
|
|
|
304
308
|
* This Method fakes a complete number to force PhoneUtil returning a proper region code.
|
|
305
309
|
*/
|
|
306
310
|
getRegionCode() {
|
|
307
|
-
|
|
308
|
-
|
|
311
|
+
const phoneNumber = this.phoneNumber();
|
|
312
|
+
if (phoneNumber) {
|
|
313
|
+
const regionCode = this.phoneUtil.getRegionCodeForNumber(phoneNumber);
|
|
309
314
|
if (regionCode) {
|
|
310
315
|
return regionCode;
|
|
311
316
|
}
|
|
312
|
-
const nationalNumber =
|
|
317
|
+
const nationalNumber = phoneNumber.getNationalNumber() + '';
|
|
313
318
|
if (
|
|
314
319
|
// USA, CANADA, ...
|
|
315
|
-
(
|
|
320
|
+
(phoneNumber.getCountryCode() === 1 && nationalNumber.length >= 3) ||
|
|
316
321
|
// UK, ...
|
|
317
|
-
(
|
|
322
|
+
(phoneNumber.getCountryCode() === 44 && nationalNumber.length >= 4)) {
|
|
318
323
|
return this.phoneUtil.getRegionCodeForNumber(this.phoneUtil.parse('+' +
|
|
319
|
-
|
|
324
|
+
phoneNumber.getCountryCode() +
|
|
320
325
|
nationalNumber +
|
|
321
326
|
new Array(10 - nationalNumber.length).fill(5).join('')));
|
|
322
327
|
}
|
|
323
|
-
return this.phoneUtil.getRegionCodeForCountryCode(
|
|
328
|
+
return this.phoneUtil.getRegionCodeForCountryCode(phoneNumber.getCountryCode());
|
|
324
329
|
}
|
|
325
330
|
return undefined;
|
|
326
331
|
}
|
|
327
332
|
formatPhoneNumber(format) {
|
|
328
|
-
|
|
329
|
-
|
|
333
|
+
const phoneNumber = this.phoneNumber();
|
|
334
|
+
if (phoneNumber) {
|
|
335
|
+
return this.phoneUtil.format(phoneNumber, format);
|
|
330
336
|
}
|
|
331
337
|
return undefined;
|
|
332
338
|
}
|
|
333
339
|
handleChange() {
|
|
334
|
-
|
|
335
|
-
|
|
340
|
+
const selectedCountry = this.selectedCountry();
|
|
341
|
+
if (selectedCountry && this.country() !== selectedCountry.isoCode) {
|
|
342
|
+
this.country.set(selectedCountry.isoCode);
|
|
336
343
|
}
|
|
337
|
-
if (this.phoneNumber) {
|
|
344
|
+
if (this.phoneNumber()) {
|
|
338
345
|
this.onChange(this.formatPhoneNumber(PhoneNumberFormat.INTERNATIONAL));
|
|
339
346
|
}
|
|
340
347
|
else {
|
|
341
348
|
this.onChange('');
|
|
342
349
|
}
|
|
350
|
+
this.valueChange.emit({
|
|
351
|
+
country: this.selectedCountry(),
|
|
352
|
+
phoneNumber: this.formatPhoneNumber(PhoneNumberFormat.INTERNATIONAL),
|
|
353
|
+
isValid: this.isValidNumber
|
|
354
|
+
});
|
|
343
355
|
}
|
|
344
356
|
writeTextToInput(value) {
|
|
345
357
|
this.phoneInput().nativeElement.value = value ?? '';
|
|
@@ -348,13 +360,22 @@ class SiPhoneNumberInputComponent {
|
|
|
348
360
|
* Format and update input text or clear input text if the input value is undefined.
|
|
349
361
|
*/
|
|
350
362
|
writeValueToInput() {
|
|
351
|
-
if (this.phoneNumber) {
|
|
363
|
+
if (this.phoneNumber()) {
|
|
352
364
|
this.writeTextToInput(this.formatPhoneNumber(PhoneNumberFormat.NATIONAL).replace(/^0/, ''));
|
|
353
365
|
}
|
|
354
366
|
}
|
|
355
367
|
refreshValueAfterCountryChange() {
|
|
356
|
-
|
|
357
|
-
|
|
368
|
+
const selectedCountry = this.selectedCountry();
|
|
369
|
+
if (selectedCountry) {
|
|
370
|
+
this.phoneNumber.update(current => {
|
|
371
|
+
if (!current) {
|
|
372
|
+
return undefined;
|
|
373
|
+
}
|
|
374
|
+
// TODO: Remove any once https://github.com/DefinitelyTyped/DefinitelyTyped/pull/75189 is merged/released
|
|
375
|
+
const phoneNumber = current?.clone();
|
|
376
|
+
phoneNumber.setCountryCode(selectedCountry.countryCode);
|
|
377
|
+
return phoneNumber;
|
|
378
|
+
});
|
|
358
379
|
this.writeValueToInput();
|
|
359
380
|
}
|
|
360
381
|
}
|
|
@@ -374,7 +395,7 @@ class SiPhoneNumberInputComponent {
|
|
|
374
395
|
provide: SI_FORM_ITEM_CONTROL,
|
|
375
396
|
useExisting: SiPhoneNumberInputComponent
|
|
376
397
|
}
|
|
377
|
-
], viewQueries: [{ propertyName: "phoneInput", first: true, predicate: ["phoneInput"], descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"btn-group w-100 d-flex shadow-none border-0\"\n [class.disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-disabled]=\"disabled()\"\n>\n <button\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin\n siPhoneNumberInputSelect\n class=\"dropdown-toggle d-flex align-items-center ms-n4 my-n4 py-2 px-4 border-0\"\n type=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-labelledby]=\"id() + '-aria-label ' + id() + '-value'\"\n [attr.aria-expanded]=\"open\"\n [options]=\"countryList()\"\n [value]=\"selectedCountry\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [attr.aria-controls]=\"id() + '-listbox'\"\n (valueChange)=\"countryInput($event)\"\n (click)=\"openOverlay()\"\n (focus)=\"countryFocused.set(true)\"\n (blur)=\"countryFocused.set(false)\"\n >\n <span class=\"visually-hidden\" [id]=\"id() + '-aria-label'\">{{\n selectCountryAriaLabel() | translate\n }}</span>\n <span\n aria-hidden=\"true\"\n [class]=\"`fi fi-${(selectedCountry?.isoCode | lowercase) ?? 'xx'}`\"\n ></span>\n @if (selectedCountry) {\n <span class=\"si-body ms-4\" [id]=\"id() + '-value'\">\n <span class=\"visually-hidden\">{{ selectedCountry.name }}</span>\n +{{ selectedCountry.countryCode }}\n </span>\n }\n <si-icon class=\"icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n\n <ng-template\n cdkConnectedOverlay\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"open\"\n [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n [cdkConnectedOverlayOffsetX]=\"-1\"\n [
|
|
398
|
+
], viewQueries: [{ propertyName: "phoneInput", first: true, predicate: ["phoneInput"], descendants: true, isSignal: true }], usesOnChanges: true, ngImport: i0, template: "<div\n class=\"btn-group w-100 d-flex shadow-none border-0\"\n [class.disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-disabled]=\"disabled()\"\n>\n <button\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin\n siPhoneNumberInputSelect\n class=\"dropdown-toggle d-flex align-items-center ms-n4 my-n4 py-2 px-4 border-0\"\n type=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-labelledby]=\"id() + '-aria-label ' + id() + '-value'\"\n [attr.aria-expanded]=\"open\"\n [options]=\"countryList()\"\n [value]=\"selectedCountry()\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [attr.aria-controls]=\"id() + '-listbox'\"\n (valueChange)=\"countryInput($event)\"\n (click)=\"openOverlay()\"\n (focus)=\"countryFocused.set(true)\"\n (blur)=\"countryFocused.set(false)\"\n >\n <span class=\"visually-hidden\" [id]=\"id() + '-aria-label'\">{{\n selectCountryAriaLabel() | translate\n }}</span>\n <span\n aria-hidden=\"true\"\n [class]=\"`fi fi-${(selectedCountry()?.isoCode | lowercase) ?? 'xx'}`\"\n ></span>\n @if (selectedCountry(); as selectedCountry) {\n <span class=\"si-body ms-4\" [id]=\"id() + '-value'\">\n <span class=\"visually-hidden\">{{ selectedCountry.name }}</span>\n +{{ selectedCountry.countryCode }}\n </span>\n }\n <si-icon class=\"icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n\n <ng-template\n cdkConnectedOverlay\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"open\"\n [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n [cdkConnectedOverlayOffsetX]=\"-1\"\n [cdkConnectedOverlayMinWidth]=\"overlayWidth\"\n (backdropClick)=\"overlayDetach()\"\n (detach)=\"overlayDetach()\"\n >\n <si-select-list-has-filter\n [baseId]=\"id()\"\n [filterPlaceholder]=\"placeholderForSearch()\"\n [noResultsFoundLabel]=\"searchNoResultsFoundLabel()\"\n [optionTemplate]=\"optionTemplate\"\n (closeOverlay)=\"overlayDetach()\"\n />\n </ng-template>\n <ng-template #optionTemplate let-option>\n <span aria-hidden=\"true\" [class]=\"`fi me-5 fi-${(option.value.isoCode | lowercase)}`\"></span>\n {{ option.value.name }} +{{ option.value.countryCode }}\n </ng-template>\n </button>\n <input\n #phoneInput\n type=\"tel\"\n class=\"ms-4 border-0 p-0 focus-none shadow-none flex-grow-1 phone-number\"\n [attr.aria-label]=\"phoneNumberAriaLabel() | translate\"\n [attr.aria-describedby]=\"errormessageId()\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"input()\"\n (blur)=\"blur()\"\n />\n</div>\n", styles: [":host:focus-within:not(.country-focus){outline:var(--element-button-focus-width) solid var(--element-focus-default);outline-offset:var(--element-button-focus-overlay-width)}.search-country{display:inline-block;margin-block-start:8px;margin-block-end:8px;margin-inline:8px;inline-size:calc(100% - 16px)}.disabled{pointer-events:none}.disabled,.disabled:hover,.disabled:focus{--border-color: var(--element-ui-3);color:var(--element-text-disabled)}.dropdown-toggle{border-radius:var(--element-input-radius);min-inline-size:auto!important;background:transparent}.dropdown-toggle .fi.fi-xx{background-image:none;background-color:var(--element-text-disabled)}.dropdown-toggle:disabled{opacity:var(--element-action-disabled-opacity)}.dropdown-toggle.readonly{cursor:default}.phone-number{background-color:transparent;inline-size:inherit}.phone-number:disabled,.phone-number[readonly]{opacity:1}.phone-number:disabled{color:var(--element-text-disabled)}.phone-number:disabled::placeholder{color:transparent}.phone-number::placeholder{color:var(--element-text-secondary)}\n"], dependencies: [{ kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation", "cdkConnectedOverlayUsePopover", "cdkConnectedOverlayMatchWidth", "cdkConnectedOverlay"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "directive", type: SiPhoneNumberInputSelectDirective, selector: "[siPhoneNumberInputSelect]" }, { kind: "component", type: SiSelectListHasFilterComponent, selector: "si-select-list-has-filter", inputs: ["filterPlaceholder", "noResultsFoundLabel"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }, { kind: "pipe", type: LowerCasePipe, name: "lowercase" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
378
399
|
}
|
|
379
400
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiPhoneNumberInputComponent, decorators: [{
|
|
380
401
|
type: Component,
|
|
@@ -408,7 +429,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
|
|
|
408
429
|
'[class.disabled]': 'disabled()',
|
|
409
430
|
'[class.readonly]': 'readonly()',
|
|
410
431
|
'[class.country-focus]': 'countryFocused()'
|
|
411
|
-
}, template: "<div\n class=\"btn-group w-100 d-flex shadow-none border-0\"\n [class.disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-disabled]=\"disabled()\"\n>\n <button\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin\n siPhoneNumberInputSelect\n class=\"dropdown-toggle d-flex align-items-center ms-n4 my-n4 py-2 px-4 border-0\"\n type=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-labelledby]=\"id() + '-aria-label ' + id() + '-value'\"\n [attr.aria-expanded]=\"open\"\n [options]=\"countryList()\"\n [value]=\"selectedCountry\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [attr.aria-controls]=\"id() + '-listbox'\"\n (valueChange)=\"countryInput($event)\"\n (click)=\"openOverlay()\"\n (focus)=\"countryFocused.set(true)\"\n (blur)=\"countryFocused.set(false)\"\n >\n <span class=\"visually-hidden\" [id]=\"id() + '-aria-label'\">{{\n selectCountryAriaLabel() | translate\n }}</span>\n <span\n aria-hidden=\"true\"\n [class]=\"`fi fi-${(selectedCountry?.isoCode | lowercase) ?? 'xx'}`\"\n ></span>\n @if (selectedCountry) {\n <span class=\"si-body ms-4\" [id]=\"id() + '-value'\">\n <span class=\"visually-hidden\">{{ selectedCountry.name }}</span>\n +{{ selectedCountry.countryCode }}\n </span>\n }\n <si-icon class=\"icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n\n <ng-template\n cdkConnectedOverlay\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"open\"\n [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n [cdkConnectedOverlayOffsetX]=\"-1\"\n [
|
|
432
|
+
}, template: "<div\n class=\"btn-group w-100 d-flex shadow-none border-0\"\n [class.disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-disabled]=\"disabled()\"\n>\n <button\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin\n siPhoneNumberInputSelect\n class=\"dropdown-toggle d-flex align-items-center ms-n4 my-n4 py-2 px-4 border-0\"\n type=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-labelledby]=\"id() + '-aria-label ' + id() + '-value'\"\n [attr.aria-expanded]=\"open\"\n [options]=\"countryList()\"\n [value]=\"selectedCountry()\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [attr.aria-controls]=\"id() + '-listbox'\"\n (valueChange)=\"countryInput($event)\"\n (click)=\"openOverlay()\"\n (focus)=\"countryFocused.set(true)\"\n (blur)=\"countryFocused.set(false)\"\n >\n <span class=\"visually-hidden\" [id]=\"id() + '-aria-label'\">{{\n selectCountryAriaLabel() | translate\n }}</span>\n <span\n aria-hidden=\"true\"\n [class]=\"`fi fi-${(selectedCountry()?.isoCode | lowercase) ?? 'xx'}`\"\n ></span>\n @if (selectedCountry(); as selectedCountry) {\n <span class=\"si-body ms-4\" [id]=\"id() + '-value'\">\n <span class=\"visually-hidden\">{{ selectedCountry.name }}</span>\n +{{ selectedCountry.countryCode }}\n </span>\n }\n <si-icon class=\"icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n\n <ng-template\n cdkConnectedOverlay\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"open\"\n [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n [cdkConnectedOverlayOffsetX]=\"-1\"\n [cdkConnectedOverlayMinWidth]=\"overlayWidth\"\n (backdropClick)=\"overlayDetach()\"\n (detach)=\"overlayDetach()\"\n >\n <si-select-list-has-filter\n [baseId]=\"id()\"\n [filterPlaceholder]=\"placeholderForSearch()\"\n [noResultsFoundLabel]=\"searchNoResultsFoundLabel()\"\n [optionTemplate]=\"optionTemplate\"\n (closeOverlay)=\"overlayDetach()\"\n />\n </ng-template>\n <ng-template #optionTemplate let-option>\n <span aria-hidden=\"true\" [class]=\"`fi me-5 fi-${(option.value.isoCode | lowercase)}`\"></span>\n {{ option.value.name }} +{{ option.value.countryCode }}\n </ng-template>\n </button>\n <input\n #phoneInput\n type=\"tel\"\n class=\"ms-4 border-0 p-0 focus-none shadow-none flex-grow-1 phone-number\"\n [attr.aria-label]=\"phoneNumberAriaLabel() | translate\"\n [attr.aria-describedby]=\"errormessageId()\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"input()\"\n (blur)=\"blur()\"\n />\n</div>\n", styles: [":host:focus-within:not(.country-focus){outline:var(--element-button-focus-width) solid var(--element-focus-default);outline-offset:var(--element-button-focus-overlay-width)}.search-country{display:inline-block;margin-block-start:8px;margin-block-end:8px;margin-inline:8px;inline-size:calc(100% - 16px)}.disabled{pointer-events:none}.disabled,.disabled:hover,.disabled:focus{--border-color: var(--element-ui-3);color:var(--element-text-disabled)}.dropdown-toggle{border-radius:var(--element-input-radius);min-inline-size:auto!important;background:transparent}.dropdown-toggle .fi.fi-xx{background-image:none;background-color:var(--element-text-disabled)}.dropdown-toggle:disabled{opacity:var(--element-action-disabled-opacity)}.dropdown-toggle.readonly{cursor:default}.phone-number{background-color:transparent;inline-size:inherit}.phone-number:disabled,.phone-number[readonly]{opacity:1}.phone-number:disabled{color:var(--element-text-disabled)}.phone-number:disabled::placeholder{color:transparent}.phone-number::placeholder{color:var(--element-text-secondary)}\n"] }]
|
|
412
433
|
}], propDecorators: { id: [{ type: i0.Input, args: [{ isSignal: true, alias: "id", required: false }] }], country: [{ type: i0.Input, args: [{ isSignal: true, alias: "country", required: false }] }, { type: i0.Output, args: ["countryChange"] }], defaultCountry: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultCountry", required: false }] }], placeholderForSearch: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholderForSearch", required: false }] }], searchNoResultsFoundLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "searchNoResultsFoundLabel", required: false }] }], selectCountryAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "selectCountryAriaLabel", required: false }] }], phoneNumberAriaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "phoneNumberAriaLabel", required: false }] }], supportedCountries: [{ type: i0.Input, args: [{ isSignal: true, alias: "supportedCountries", required: false }] }], labelledby: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelledby", required: false }] }], disabledInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], valueChange: [{ type: i0.Output, args: ["valueChange"] }], errormessageId: [{ type: i0.Input, args: [{ isSignal: true, alias: "errormessageId", required: false }] }], phoneInput: [{ type: i0.ViewChild, args: ['phoneInput', { isSignal: true }] }] } });
|
|
413
434
|
|
|
414
435
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"siemens-element-ng-phone-number.mjs","sources":["../../../../projects/element-ng/phone-number/si-phone-number-input-select.directive.ts","../../../../projects/element-ng/phone-number/si-phone-number-input.component.ts","../../../../projects/element-ng/phone-number/si-phone-number-input.component.html","../../../../projects/element-ng/phone-number/si-phone-number-input.module.ts","../../../../projects/element-ng/phone-number/index.ts","../../../../projects/element-ng/phone-number/siemens-element-ng-phone-number.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Directive } from '@angular/core';\nimport {\n SiSelectSimpleOptionsDirective,\n SiSelectSingleValueDirective\n} from '@siemens/element-ng/select';\n\n/**\n * This directive provides the si-select options and value strategy for the phone number input.\n * As we don't use si-select directly, we need to provide these strategies manually.\n */\n@Directive({\n selector: '[siPhoneNumberInputSelect]',\n hostDirectives: [\n {\n directive: SiSelectSimpleOptionsDirective,\n inputs: ['options']\n },\n { directive: SiSelectSingleValueDirective, inputs: ['value'], outputs: ['valueChange'] }\n ]\n})\nexport class SiPhoneNumberInputSelectDirective {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';\nimport { LowerCasePipe } from '@angular/common';\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n computed,\n ElementRef,\n inject,\n input,\n LOCALE_ID,\n model,\n OnChanges,\n output,\n signal,\n SimpleChanges,\n viewChild\n} from '@angular/core';\nimport {\n AbstractControl,\n ControlValueAccessor,\n NG_VALIDATORS,\n NG_VALUE_ACCESSOR,\n ValidationErrors,\n Validator\n} from '@angular/forms';\nimport { elementDown2 } from '@siemens/element-icons';\nimport { SI_FORM_ITEM_CONTROL, SiFormItemControl } from '@siemens/element-ng/form';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SelectOption, SiSelectListHasFilterComponent } from '@siemens/element-ng/select';\nimport {\n injectSiTranslateService,\n SiTranslatePipe,\n t\n} from '@siemens/element-translate-ng/translate';\nimport { PhoneNumber, PhoneNumberFormat, PhoneNumberUtil } from 'google-libphonenumber';\n\nimport { SiPhoneNumberInputSelectDirective } from './si-phone-number-input-select.directive';\nimport { CountryInfo, PhoneDetails } from './si-phone-number-input.models';\n\n@Component({\n selector: 'si-phone-number-input',\n imports: [\n CdkOverlayOrigin,\n CdkConnectedOverlay,\n SiIconComponent,\n SiPhoneNumberInputSelectDirective,\n SiSelectListHasFilterComponent,\n SiTranslatePipe,\n LowerCasePipe\n ],\n templateUrl: './si-phone-number-input.component.html',\n styleUrl: './si-phone-number-input.component.scss',\n providers: [\n {\n provide: NG_VALIDATORS,\n useExisting: SiPhoneNumberInputComponent,\n multi: true\n },\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: SiPhoneNumberInputComponent,\n multi: true\n },\n {\n provide: SI_FORM_ITEM_CONTROL,\n useExisting: SiPhoneNumberInputComponent\n }\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'role': 'group',\n '[attr.aria-labelledby]': 'labelledby()',\n '[attr.id]': 'id()',\n '[class.disabled]': 'disabled()',\n '[class.readonly]': 'readonly()',\n '[class.country-focus]': 'countryFocused()'\n }\n})\nexport class SiPhoneNumberInputComponent\n implements ControlValueAccessor, Validator, OnChanges, SiFormItemControl\n{\n private static idCounter = 0;\n\n private phoneUtil = PhoneNumberUtil.getInstance();\n private translate = injectSiTranslateService();\n private locale = inject(LOCALE_ID).toString();\n private changeDetectorRef = inject(ChangeDetectorRef);\n private elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n\n /**\n * Unique identifier.\n *\n * @defaultValue\n * ```\n * `__si-phone-number-input-${SiPhoneNumberInputComponent.idCounter++}`\n * ```\n */\n readonly id = input(`__si-phone-number-input-${SiPhoneNumberInputComponent.idCounter++}`);\n\n /**\n * ISO_3166-2 Code of the selected country.\n */\n readonly country = model<string>();\n\n /**\n * ISO_3166-2 Code of the country which shall be used on form-control reset.\n */\n readonly defaultCountry = input<string>();\n\n /**\n * Placeholder text for country search input.\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_PLACEHOLDER:Search`)\n * ```\n */\n readonly placeholderForSearch = input(\n t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_PLACEHOLDER:Search`)\n );\n /**\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_NO-RESULTS_FOUND:No results found`)\n * ```\n */\n readonly searchNoResultsFoundLabel = input(\n t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_NO-RESULTS_FOUND:No results found`)\n );\n /**\n * Text for the country dropdown aria-label attribute.\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SELECT_COUNTRY:Select country`)\n * ```\n */\n readonly selectCountryAriaLabel = input(\n t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SELECT_COUNTRY:Select country`)\n );\n /**\n * Text for the phone number input aria-label attribute.\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.PHONE_NUMBER_INPUT_LABEL:Enter phone number`)\n * ```\n */\n readonly phoneNumberAriaLabel = input(\n t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.PHONE_NUMBER_INPUT_LABEL:Enter phone number`)\n );\n /**\n * List of countries in ISO2 format, from which the user is allowed to select one.\n * If no values are provided, the dropdown will show all known countries.\n */\n readonly supportedCountries = input<readonly string[] | null>();\n\n /**\n * @defaultValue\n * ```\n * `${this.id()}-label`\n * ```\n */\n readonly labelledby = input(`${this.id()}-label`);\n\n /** @defaultValue false */\n // eslint-disable-next-line @angular-eslint/no-input-rename\n readonly disabledInput = input(false, { alias: 'disabled', transform: booleanAttribute });\n\n /** @defaultValue false */\n readonly readonly = input(false, { transform: booleanAttribute });\n\n readonly valueChange = output<PhoneDetails>();\n\n /**\n * This ID will be bound to the `aria-describedby` attribute of the phone-number-input.\n * Use this to reference the element containing the error message(s) for the phone-number-input.\n * It will be picked by the {@link SiFormItemComponent} if the phone-number-input is used inside a form item.\n *\n * @defaultValue\n * ```\n * `${this.id()}-errormessage`\n * ```\n */\n readonly errormessageId = input(`${this.id()}-errormessage`);\n\n protected readonly phoneInput = viewChild.required<ElementRef<HTMLInputElement>>('phoneInput');\n protected selectedCountry?: CountryInfo;\n protected placeholder = '';\n protected readonly countryFocused = signal(false);\n protected open = false;\n protected overlayWidth = 0;\n protected readonly disabled = computed(() => this.disabledInput() || this.disabledNgControl());\n protected readonly countryList = computed(() => {\n const countries = this.allowedCountries() ?? this.phoneUtil.getSupportedRegions();\n return countries\n .map((country: string) => {\n const countryInfo: CountryInfo = {\n name: this.getCountryName(country),\n countryCode: this.phoneUtil.getCountryCodeForRegion(country),\n isoCode: country\n };\n return {\n type: 'option',\n value: countryInfo,\n label: `${countryInfo.name} +${countryInfo.countryCode}`,\n typeaheadLabel: `${countryInfo.name} +${countryInfo.countryCode}`\n } as SelectOption<CountryInfo>;\n })\n .sort((a, b) => a.value.name.localeCompare(b.value.name));\n });\n protected readonly icons = addIcons({ elementDown2 });\n private readonly allowedCountries = computed(\n () => this.supportedCountries() ?? this.phoneUtil.getSupportedRegions()\n );\n private readonly disabledNgControl = signal(false);\n private isValidNumber = true;\n private phoneNumber?: PhoneNumber;\n private onChange: (val: string) => void = () => {};\n private onTouched: () => void = () => {};\n\n ngOnChanges(changes: SimpleChanges<this>): void {\n if (changes.country) {\n this.writeCountry();\n }\n }\n\n /** @internal */\n writeValue(value: string | undefined): void {\n this.phoneNumber = this.parseNumber(value);\n if (this.phoneNumber) {\n this.writeValueToInput();\n this.country.set(this.getRegionCode());\n } else {\n // Number could not be parsed, write raw value instead to handle cases like undefined\n this.writeTextToInput(value);\n this.country.set(this.defaultCountry() ?? this.country());\n }\n this.writeCountry();\n this.changeDetectorRef.markForCheck();\n }\n\n /** @internal */\n registerOnChange(fn: any): void {\n this.onChange = fn;\n }\n\n /** @internal */\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /** @internal */\n setDisabledState(isDisabled: boolean): void {\n this.disabledNgControl.set(isDisabled);\n }\n\n /** @internal */\n validate(control: AbstractControl): ValidationErrors | null {\n if (!this.phoneInput().nativeElement.value) {\n return null;\n }\n\n this.isValidNumber = false;\n if (!this.phoneNumber || !this.phoneUtil.isValidNumber(this.phoneNumber)) {\n return {\n invalidPhoneNumberFormat: true\n };\n }\n\n if (!this.countryList().some(c => c.value.isoCode === this.selectedCountry!.isoCode)) {\n return {\n notSupportedPhoneNumberCountry: true\n };\n }\n\n this.isValidNumber = true;\n return null;\n }\n\n protected input(): void {\n const rawNumber = this.phoneInput().nativeElement.value;\n this.phoneNumber = this.parseNumber(rawNumber);\n\n if (this.phoneNumber) {\n const regionCode = this.getRegionCode();\n let countryInfo = this.countryList().find(\n country => regionCode === country.value.isoCode\n )?.value;\n if (!countryInfo && regionCode) {\n countryInfo = {\n name: this.getCountryName(regionCode),\n countryCode: this.phoneNumber.getCountryCode()!,\n isoCode: regionCode\n };\n }\n if (countryInfo && this.selectedCountry?.isoCode !== countryInfo.isoCode) {\n this.selectedCountry = countryInfo;\n }\n } else if (rawNumber.trim().startsWith('+')) {\n this.selectedCountry = undefined;\n }\n\n this.handleChange();\n }\n\n protected blur(): void {\n this.countryFocused.set(false);\n this.onTouched();\n this.writeValueToInput();\n this.valueChange.emit({\n country: this.selectedCountry,\n phoneNumber: this.formatPhoneNumber(PhoneNumberFormat.INTERNATIONAL),\n isValid: this.isValidNumber\n });\n }\n\n protected countryInput(num: CountryInfo): void {\n this.selectedCountry = num;\n this.updatePlaceholder();\n this.refreshValueAfterCountryChange();\n this.handleChange();\n }\n\n protected openOverlay(): void {\n if (!this.readonly()) {\n this.open = true;\n this.overlayWidth = this.elementRef.nativeElement.getBoundingClientRect().width + 2; // 2px border\n }\n }\n\n protected overlayDetach(): void {\n this.open = false;\n this.phoneInput().nativeElement.focus();\n }\n\n private writeCountry(): void {\n const currentCountry = this.country()!;\n this.selectedCountry = this.countryList().find(\n country => country.value.isoCode === currentCountry\n )?.value;\n if (!this.selectedCountry) {\n const countryCode = this.phoneUtil.getCountryCodeForRegion(\n currentCountry ?? this.defaultCountry() ?? 'XX'\n );\n if (countryCode) {\n this.selectedCountry = {\n isoCode: currentCountry,\n countryCode,\n name: this.getCountryName(currentCountry)\n };\n }\n }\n this.updatePlaceholder();\n this.refreshValueAfterCountryChange();\n }\n\n private getCountryName(countryCode: string): string {\n // This auto translates the given country name to the selected locale language\n return (\n new Intl.DisplayNames([this.translate.currentLanguage ?? this.locale], { type: 'region' }).of(\n countryCode.toUpperCase()\n ) ?? ''\n );\n }\n\n private updatePlaceholder(): void {\n if (this.selectedCountry) {\n this.placeholder = this.phoneUtil\n .format(\n this.phoneUtil.getExampleNumber(this.selectedCountry.isoCode),\n PhoneNumberFormat.NATIONAL\n )\n .replace(/^0/, '');\n }\n }\n\n private parseNumber(rawNumber: string | undefined): PhoneNumber | undefined {\n try {\n let regionCodeForParsing: string | undefined;\n if (!rawNumber?.trim().startsWith('+')) {\n regionCodeForParsing = this.selectedCountry?.isoCode;\n }\n return this.phoneUtil.parse(rawNumber, regionCodeForParsing);\n } catch (e) {\n // The Number is too short, we cannot parse it yet. Error can be ignored. Hopefully, the user enters more digits.\n return;\n }\n }\n\n /**\n * PhoneUtil does not resolve country code early enough when the national prefix is shared among other countries (+1 and +44).\n * This Method fakes a complete number to force PhoneUtil returning a proper region code.\n */\n private getRegionCode(): string | undefined {\n if (this.phoneNumber) {\n const regionCode = this.phoneUtil.getRegionCodeForNumber(this.phoneNumber);\n if (regionCode) {\n return regionCode;\n }\n\n const nationalNumber = this.phoneNumber.getNationalNumber() + '';\n if (\n // USA, CANADA, ...\n (this.phoneNumber.getCountryCode() === 1 && nationalNumber.length >= 3) ||\n // UK, ...\n (this.phoneNumber.getCountryCode() === 44 && nationalNumber.length >= 4)\n ) {\n return this.phoneUtil.getRegionCodeForNumber(\n this.phoneUtil.parse(\n '+' +\n this.phoneNumber.getCountryCode() +\n nationalNumber +\n new Array(10 - nationalNumber.length).fill(5).join('')\n )\n );\n }\n\n return this.phoneUtil.getRegionCodeForCountryCode(this.phoneNumber.getCountryCode()!);\n }\n\n return undefined;\n }\n\n private formatPhoneNumber(format: PhoneNumberFormat): string | undefined {\n if (this.phoneNumber) {\n return this.phoneUtil.format(this.phoneNumber, format);\n }\n\n return undefined;\n }\n\n private handleChange(): void {\n if (this.selectedCountry && this.country() !== this.selectedCountry?.isoCode) {\n this.country.set(this.selectedCountry?.isoCode);\n }\n\n if (this.phoneNumber) {\n this.onChange(this.formatPhoneNumber(PhoneNumberFormat.INTERNATIONAL)!);\n } else {\n this.onChange('');\n }\n }\n\n private writeTextToInput(value?: string): void {\n this.phoneInput().nativeElement.value = value ?? '';\n }\n /**\n * Format and update input text or clear input text if the input value is undefined.\n */\n private writeValueToInput(): void {\n if (this.phoneNumber) {\n this.writeTextToInput(this.formatPhoneNumber(PhoneNumberFormat.NATIONAL)!.replace(/^0/, ''));\n }\n }\n\n private refreshValueAfterCountryChange(): void {\n if (this.selectedCountry) {\n this.phoneNumber?.setCountryCode(this.selectedCountry?.countryCode);\n this.writeValueToInput();\n }\n }\n}\n","<div\n class=\"btn-group w-100 d-flex shadow-none border-0\"\n [class.disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-disabled]=\"disabled()\"\n>\n <button\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin\n siPhoneNumberInputSelect\n class=\"dropdown-toggle d-flex align-items-center ms-n4 my-n4 py-2 px-4 border-0\"\n type=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-labelledby]=\"id() + '-aria-label ' + id() + '-value'\"\n [attr.aria-expanded]=\"open\"\n [options]=\"countryList()\"\n [value]=\"selectedCountry\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [attr.aria-controls]=\"id() + '-listbox'\"\n (valueChange)=\"countryInput($event)\"\n (click)=\"openOverlay()\"\n (focus)=\"countryFocused.set(true)\"\n (blur)=\"countryFocused.set(false)\"\n >\n <span class=\"visually-hidden\" [id]=\"id() + '-aria-label'\">{{\n selectCountryAriaLabel() | translate\n }}</span>\n <span\n aria-hidden=\"true\"\n [class]=\"`fi fi-${(selectedCountry?.isoCode | lowercase) ?? 'xx'}`\"\n ></span>\n @if (selectedCountry) {\n <span class=\"si-body ms-4\" [id]=\"id() + '-value'\">\n <span class=\"visually-hidden\">{{ selectedCountry.name }}</span>\n +{{ selectedCountry.countryCode }}\n </span>\n }\n <si-icon class=\"icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n\n <ng-template\n cdkConnectedOverlay\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"open\"\n [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n [cdkConnectedOverlayOffsetX]=\"-1\"\n [cdkConnectedOverlayWidth]=\"overlayWidth\"\n (backdropClick)=\"overlayDetach()\"\n (detach)=\"overlayDetach()\"\n >\n <si-select-list-has-filter\n [baseId]=\"id()\"\n [filterPlaceholder]=\"placeholderForSearch()\"\n [noResultsFoundLabel]=\"searchNoResultsFoundLabel()\"\n [optionTemplate]=\"optionTemplate\"\n (closeOverlay)=\"overlayDetach()\"\n />\n </ng-template>\n <ng-template #optionTemplate let-option>\n <span aria-hidden=\"true\" [class]=\"`fi me-5 fi-${(option.value.isoCode | lowercase)}`\"></span>\n {{ option.value.name }} +{{ option.value.countryCode }}\n </ng-template>\n </button>\n <input\n #phoneInput\n type=\"tel\"\n class=\"ms-4 border-0 p-0 focus-none shadow-none flex-grow-1 phone-number\"\n [attr.aria-label]=\"phoneNumberAriaLabel() | translate\"\n [attr.aria-describedby]=\"errormessageId()\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"input()\"\n (blur)=\"blur()\"\n />\n</div>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiPhoneNumberInputComponent } from './si-phone-number-input.component';\n\n@NgModule({\n imports: [SiPhoneNumberInputComponent],\n exports: [SiPhoneNumberInputComponent]\n})\nexport class SiPhoneNumberInputModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-phone-number-input.module';\nexport * from './si-phone-number-input.component';\nexport * from './si-phone-number-input.models';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"siemens-element-ng-phone-number.mjs","sources":["../../../../projects/element-ng/phone-number/si-phone-number-input-select.directive.ts","../../../../projects/element-ng/phone-number/si-phone-number-input.component.ts","../../../../projects/element-ng/phone-number/si-phone-number-input.component.html","../../../../projects/element-ng/phone-number/si-phone-number-input.module.ts","../../../../projects/element-ng/phone-number/index.ts","../../../../projects/element-ng/phone-number/siemens-element-ng-phone-number.ts"],"sourcesContent":["/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { Directive } from '@angular/core';\nimport {\n SiSelectSimpleOptionsDirective,\n SiSelectSingleValueDirective\n} from '@siemens/element-ng/select';\n\n/**\n * This directive provides the si-select options and value strategy for the phone number input.\n * As we don't use si-select directly, we need to provide these strategies manually.\n */\n@Directive({\n selector: '[siPhoneNumberInputSelect]',\n hostDirectives: [\n {\n directive: SiSelectSimpleOptionsDirective,\n inputs: ['options']\n },\n { directive: SiSelectSingleValueDirective, inputs: ['value'], outputs: ['valueChange'] }\n ]\n})\nexport class SiPhoneNumberInputSelectDirective {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { CdkConnectedOverlay, CdkOverlayOrigin } from '@angular/cdk/overlay';\nimport { LowerCasePipe } from '@angular/common';\nimport {\n booleanAttribute,\n ChangeDetectionStrategy,\n ChangeDetectorRef,\n Component,\n computed,\n ElementRef,\n inject,\n input,\n LOCALE_ID,\n model,\n OnChanges,\n output,\n signal,\n SimpleChanges,\n viewChild\n} from '@angular/core';\nimport {\n AbstractControl,\n ControlValueAccessor,\n NG_VALIDATORS,\n NG_VALUE_ACCESSOR,\n ValidationErrors,\n Validator\n} from '@angular/forms';\nimport { elementDown2 } from '@siemens/element-icons';\nimport { SI_FORM_ITEM_CONTROL, SiFormItemControl } from '@siemens/element-ng/form';\nimport { addIcons, SiIconComponent } from '@siemens/element-ng/icon';\nimport { SelectOption, SiSelectListHasFilterComponent } from '@siemens/element-ng/select';\nimport {\n injectSiTranslateService,\n SiTranslatePipe,\n t\n} from '@siemens/element-translate-ng/translate';\nimport { PhoneNumber, PhoneNumberFormat, PhoneNumberUtil } from 'google-libphonenumber';\n\nimport { SiPhoneNumberInputSelectDirective } from './si-phone-number-input-select.directive';\nimport { CountryInfo, PhoneDetails } from './si-phone-number-input.models';\n\n@Component({\n selector: 'si-phone-number-input',\n imports: [\n CdkOverlayOrigin,\n CdkConnectedOverlay,\n SiIconComponent,\n SiPhoneNumberInputSelectDirective,\n SiSelectListHasFilterComponent,\n SiTranslatePipe,\n LowerCasePipe\n ],\n templateUrl: './si-phone-number-input.component.html',\n styleUrl: './si-phone-number-input.component.scss',\n providers: [\n {\n provide: NG_VALIDATORS,\n useExisting: SiPhoneNumberInputComponent,\n multi: true\n },\n {\n provide: NG_VALUE_ACCESSOR,\n useExisting: SiPhoneNumberInputComponent,\n multi: true\n },\n {\n provide: SI_FORM_ITEM_CONTROL,\n useExisting: SiPhoneNumberInputComponent\n }\n ],\n changeDetection: ChangeDetectionStrategy.OnPush,\n host: {\n 'role': 'group',\n '[attr.aria-labelledby]': 'labelledby()',\n '[attr.id]': 'id()',\n '[class.disabled]': 'disabled()',\n '[class.readonly]': 'readonly()',\n '[class.country-focus]': 'countryFocused()'\n }\n})\nexport class SiPhoneNumberInputComponent\n implements ControlValueAccessor, Validator, OnChanges, SiFormItemControl\n{\n private static idCounter = 0;\n\n private phoneUtil = PhoneNumberUtil.getInstance();\n private translate = injectSiTranslateService();\n private locale = inject(LOCALE_ID).toString();\n private changeDetectorRef = inject(ChangeDetectorRef);\n private elementRef = inject<ElementRef<HTMLElement>>(ElementRef);\n\n /**\n * Unique identifier.\n *\n * @defaultValue\n * ```\n * `__si-phone-number-input-${SiPhoneNumberInputComponent.idCounter++}`\n * ```\n */\n readonly id = input(`__si-phone-number-input-${SiPhoneNumberInputComponent.idCounter++}`);\n\n /**\n * ISO_3166-2 Code of the selected country.\n */\n readonly country = model<string>();\n\n /**\n * ISO_3166-2 Code of the country which shall be used on form-control reset.\n */\n readonly defaultCountry = input<string>();\n\n /**\n * Placeholder text for country search input.\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_PLACEHOLDER:Search`)\n * ```\n */\n readonly placeholderForSearch = input(\n t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_PLACEHOLDER:Search`)\n );\n /**\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_NO-RESULTS_FOUND:No results found`)\n * ```\n */\n readonly searchNoResultsFoundLabel = input(\n t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SEARCH_NO-RESULTS_FOUND:No results found`)\n );\n /**\n * Text for the country dropdown aria-label attribute.\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SELECT_COUNTRY:Select country`)\n * ```\n */\n readonly selectCountryAriaLabel = input(\n t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.SELECT_COUNTRY:Select country`)\n );\n /**\n * Text for the phone number input aria-label attribute.\n *\n * @defaultValue\n * ```\n * t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.PHONE_NUMBER_INPUT_LABEL:Enter phone number`)\n * ```\n */\n readonly phoneNumberAriaLabel = input(\n t(() => $localize`:@@SI_PHONE_NUMBER_INPUT.PHONE_NUMBER_INPUT_LABEL:Enter phone number`)\n );\n /**\n * List of countries in ISO2 format, from which the user is allowed to select one.\n * If no values are provided, the dropdown will show all known countries.\n */\n readonly supportedCountries = input<readonly string[] | null>();\n\n /**\n * @defaultValue\n * ```\n * `${this.id()}-label`\n * ```\n */\n readonly labelledby = input(`${this.id()}-label`);\n\n /** @defaultValue false */\n // eslint-disable-next-line @angular-eslint/no-input-rename\n readonly disabledInput = input(false, { alias: 'disabled', transform: booleanAttribute });\n\n /** @defaultValue false */\n readonly readonly = input(false, { transform: booleanAttribute });\n\n readonly valueChange = output<PhoneDetails>();\n\n /**\n * This ID will be bound to the `aria-describedby` attribute of the phone-number-input.\n * Use this to reference the element containing the error message(s) for the phone-number-input.\n * It will be picked by the {@link SiFormItemComponent} if the phone-number-input is used inside a form item.\n *\n * @defaultValue\n * ```\n * `${this.id()}-errormessage`\n * ```\n */\n readonly errormessageId = input(`${this.id()}-errormessage`);\n\n protected readonly phoneInput = viewChild.required<ElementRef<HTMLInputElement>>('phoneInput');\n protected readonly selectedCountry = signal<CountryInfo | undefined>(undefined);\n protected placeholder = '';\n protected readonly countryFocused = signal(false);\n protected open = false;\n protected overlayWidth = 0;\n protected readonly disabled = computed(() => this.disabledInput() || this.disabledNgControl());\n protected readonly countryList = computed(() => {\n const countries = this.allowedCountries() ?? this.phoneUtil.getSupportedRegions();\n return countries\n .map((country: string) => {\n const countryInfo: CountryInfo = {\n name: this.getCountryName(country),\n countryCode: this.phoneUtil.getCountryCodeForRegion(country),\n isoCode: country\n };\n return {\n type: 'option',\n value: countryInfo,\n label: `${countryInfo.name} +${countryInfo.countryCode}`,\n typeaheadLabel: `${countryInfo.name} +${countryInfo.countryCode}`\n } as SelectOption<CountryInfo>;\n })\n .sort((a, b) => a.value.name.localeCompare(b.value.name));\n });\n protected readonly icons = addIcons({ elementDown2 });\n private readonly allowedCountries = computed(\n () => this.supportedCountries() ?? this.phoneUtil.getSupportedRegions()\n );\n private readonly disabledNgControl = signal(false);\n private isValidNumber = true;\n private readonly phoneNumber = signal<PhoneNumber | undefined>(undefined, {\n equal: (a, b) => {\n if (!a || !b) {\n return !a && !b;\n }\n return this.phoneUtil.isNumberMatch(a, b) === PhoneNumberUtil.MatchType.EXACT_MATCH;\n }\n });\n private onChange: (val: string) => void = () => {};\n private onTouched: () => void = () => {};\n\n ngOnChanges(changes: SimpleChanges<this>): void {\n if (changes.country) {\n this.writeCountry();\n }\n }\n\n /** @internal */\n writeValue(value: string | undefined): void {\n const phoneNumber = this.parseNumber(value);\n this.phoneNumber.set(phoneNumber);\n if (phoneNumber) {\n this.writeValueToInput();\n this.country.set(this.getRegionCode());\n } else {\n // Number could not be parsed, write raw value instead to handle cases like undefined\n this.writeTextToInput(value);\n this.country.set(this.defaultCountry() ?? this.country());\n }\n this.writeCountry();\n this.changeDetectorRef.markForCheck();\n }\n\n /** @internal */\n registerOnChange(fn: any): void {\n this.onChange = fn;\n }\n\n /** @internal */\n registerOnTouched(fn: () => void): void {\n this.onTouched = fn;\n }\n\n /** @internal */\n setDisabledState(isDisabled: boolean): void {\n this.disabledNgControl.set(isDisabled);\n }\n\n /** @internal */\n validate(control: AbstractControl): ValidationErrors | null {\n if (!this.phoneInput().nativeElement.value) {\n return null;\n }\n\n this.isValidNumber = false;\n const phoneNumber = this.phoneNumber();\n if (!phoneNumber || !this.phoneUtil.isValidNumber(phoneNumber)) {\n return {\n invalidPhoneNumberFormat: true\n };\n }\n\n if (!this.countryList().some(c => c.value.isoCode === this.selectedCountry()!.isoCode)) {\n return {\n notSupportedPhoneNumberCountry: true\n };\n }\n\n this.isValidNumber = true;\n return null;\n }\n\n protected input(): void {\n const rawNumber = this.phoneInput().nativeElement.value;\n const phoneNumber = this.parseNumber(rawNumber);\n this.phoneNumber.set(phoneNumber);\n\n if (phoneNumber) {\n const regionCode = this.getRegionCode();\n let countryInfo = this.countryList().find(\n country => regionCode === country.value.isoCode\n )?.value;\n if (!countryInfo && regionCode) {\n countryInfo = {\n name: this.getCountryName(regionCode),\n countryCode: phoneNumber.getCountryCode()!,\n isoCode: regionCode\n };\n }\n if (countryInfo && this.selectedCountry()?.isoCode !== countryInfo.isoCode) {\n this.selectedCountry.set(countryInfo);\n }\n } else if (rawNumber.trim().startsWith('+')) {\n this.selectedCountry.set(undefined);\n }\n\n this.handleChange();\n }\n\n protected blur(): void {\n this.countryFocused.set(false);\n this.onTouched();\n this.writeValueToInput();\n }\n\n protected countryInput(num: CountryInfo): void {\n this.selectedCountry.set(num);\n this.updatePlaceholder();\n this.refreshValueAfterCountryChange();\n this.handleChange();\n }\n\n protected openOverlay(): void {\n if (!this.readonly()) {\n this.open = true;\n this.overlayWidth = this.elementRef.nativeElement.getBoundingClientRect().width + 2; // 2px border\n }\n }\n\n protected overlayDetach(): void {\n this.open = false;\n this.phoneInput().nativeElement.focus();\n }\n\n private writeCountry(): void {\n const currentCountry = this.country()!;\n this.selectedCountry.set(\n this.countryList().find(country => country.value.isoCode === currentCountry)?.value\n );\n if (!this.selectedCountry()) {\n const countryCode = this.phoneUtil.getCountryCodeForRegion(\n currentCountry ?? this.defaultCountry() ?? 'XX'\n );\n if (countryCode) {\n this.selectedCountry.set({\n isoCode: currentCountry,\n countryCode,\n name: this.getCountryName(currentCountry)\n });\n }\n }\n this.updatePlaceholder();\n this.refreshValueAfterCountryChange();\n }\n\n private getCountryName(countryCode: string): string {\n // This auto translates the given country name to the selected locale language\n return (\n new Intl.DisplayNames([this.translate.currentLanguage ?? this.locale], { type: 'region' }).of(\n countryCode.toUpperCase()\n ) ?? ''\n );\n }\n\n private updatePlaceholder(): void {\n const selectedCountry = this.selectedCountry();\n if (selectedCountry) {\n this.placeholder = this.phoneUtil\n .format(\n this.phoneUtil.getExampleNumber(selectedCountry.isoCode),\n PhoneNumberFormat.NATIONAL\n )\n .replace(/^0/, '');\n }\n }\n\n private parseNumber(rawNumber: string | undefined): PhoneNumber | undefined {\n try {\n let regionCodeForParsing: string | undefined;\n if (!rawNumber?.trim().startsWith('+')) {\n regionCodeForParsing = this.selectedCountry()?.isoCode;\n }\n return this.phoneUtil.parse(rawNumber, regionCodeForParsing);\n } catch (e) {\n // The Number is too short, we cannot parse it yet. Error can be ignored. Hopefully, the user enters more digits.\n return;\n }\n }\n\n /**\n * PhoneUtil does not resolve country code early enough when the national prefix is shared among other countries (+1 and +44).\n * This Method fakes a complete number to force PhoneUtil returning a proper region code.\n */\n private getRegionCode(): string | undefined {\n const phoneNumber = this.phoneNumber();\n if (phoneNumber) {\n const regionCode = this.phoneUtil.getRegionCodeForNumber(phoneNumber);\n if (regionCode) {\n return regionCode;\n }\n\n const nationalNumber = phoneNumber.getNationalNumber() + '';\n if (\n // USA, CANADA, ...\n (phoneNumber.getCountryCode() === 1 && nationalNumber.length >= 3) ||\n // UK, ...\n (phoneNumber.getCountryCode() === 44 && nationalNumber.length >= 4)\n ) {\n return this.phoneUtil.getRegionCodeForNumber(\n this.phoneUtil.parse(\n '+' +\n phoneNumber.getCountryCode() +\n nationalNumber +\n new Array(10 - nationalNumber.length).fill(5).join('')\n )\n );\n }\n\n return this.phoneUtil.getRegionCodeForCountryCode(phoneNumber.getCountryCode()!);\n }\n\n return undefined;\n }\n\n private formatPhoneNumber(format: PhoneNumberFormat): string | undefined {\n const phoneNumber = this.phoneNumber();\n if (phoneNumber) {\n return this.phoneUtil.format(phoneNumber, format);\n }\n\n return undefined;\n }\n\n private handleChange(): void {\n const selectedCountry = this.selectedCountry();\n if (selectedCountry && this.country() !== selectedCountry.isoCode) {\n this.country.set(selectedCountry.isoCode);\n }\n\n if (this.phoneNumber()) {\n this.onChange(this.formatPhoneNumber(PhoneNumberFormat.INTERNATIONAL)!);\n } else {\n this.onChange('');\n }\n\n this.valueChange.emit({\n country: this.selectedCountry(),\n phoneNumber: this.formatPhoneNumber(PhoneNumberFormat.INTERNATIONAL),\n isValid: this.isValidNumber\n });\n }\n\n private writeTextToInput(value?: string): void {\n this.phoneInput().nativeElement.value = value ?? '';\n }\n /**\n * Format and update input text or clear input text if the input value is undefined.\n */\n private writeValueToInput(): void {\n if (this.phoneNumber()) {\n this.writeTextToInput(this.formatPhoneNumber(PhoneNumberFormat.NATIONAL)!.replace(/^0/, ''));\n }\n }\n\n private refreshValueAfterCountryChange(): void {\n const selectedCountry = this.selectedCountry();\n if (selectedCountry) {\n this.phoneNumber.update(current => {\n if (!current) {\n return undefined;\n }\n // TODO: Remove any once https://github.com/DefinitelyTyped/DefinitelyTyped/pull/75189 is merged/released\n const phoneNumber = (current as any)?.clone();\n phoneNumber.setCountryCode(selectedCountry.countryCode);\n return phoneNumber;\n });\n this.writeValueToInput();\n }\n }\n}\n","<div\n class=\"btn-group w-100 d-flex shadow-none border-0\"\n [class.disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-disabled]=\"disabled()\"\n>\n <button\n #trigger=\"cdkOverlayOrigin\"\n cdkOverlayOrigin\n siPhoneNumberInputSelect\n class=\"dropdown-toggle d-flex align-items-center ms-n4 my-n4 py-2 px-4 border-0\"\n type=\"button\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [disabled]=\"disabled()\"\n [class.readonly]=\"readonly()\"\n [attr.aria-labelledby]=\"id() + '-aria-label ' + id() + '-value'\"\n [attr.aria-expanded]=\"open\"\n [options]=\"countryList()\"\n [value]=\"selectedCountry()\"\n [tabindex]=\"disabled() ? '-1' : '0'\"\n [attr.aria-controls]=\"id() + '-listbox'\"\n (valueChange)=\"countryInput($event)\"\n (click)=\"openOverlay()\"\n (focus)=\"countryFocused.set(true)\"\n (blur)=\"countryFocused.set(false)\"\n >\n <span class=\"visually-hidden\" [id]=\"id() + '-aria-label'\">{{\n selectCountryAriaLabel() | translate\n }}</span>\n <span\n aria-hidden=\"true\"\n [class]=\"`fi fi-${(selectedCountry()?.isoCode | lowercase) ?? 'xx'}`\"\n ></span>\n @if (selectedCountry(); as selectedCountry) {\n <span class=\"si-body ms-4\" [id]=\"id() + '-value'\">\n <span class=\"visually-hidden\">{{ selectedCountry.name }}</span>\n +{{ selectedCountry.countryCode }}\n </span>\n }\n <si-icon class=\"icon dropdown-caret\" [icon]=\"icons.elementDown2\" />\n\n <ng-template\n cdkConnectedOverlay\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"open\"\n [cdkConnectedOverlayFlexibleDimensions]=\"true\"\n [cdkConnectedOverlayOffsetX]=\"-1\"\n [cdkConnectedOverlayMinWidth]=\"overlayWidth\"\n (backdropClick)=\"overlayDetach()\"\n (detach)=\"overlayDetach()\"\n >\n <si-select-list-has-filter\n [baseId]=\"id()\"\n [filterPlaceholder]=\"placeholderForSearch()\"\n [noResultsFoundLabel]=\"searchNoResultsFoundLabel()\"\n [optionTemplate]=\"optionTemplate\"\n (closeOverlay)=\"overlayDetach()\"\n />\n </ng-template>\n <ng-template #optionTemplate let-option>\n <span aria-hidden=\"true\" [class]=\"`fi me-5 fi-${(option.value.isoCode | lowercase)}`\"></span>\n {{ option.value.name }} +{{ option.value.countryCode }}\n </ng-template>\n </button>\n <input\n #phoneInput\n type=\"tel\"\n class=\"ms-4 border-0 p-0 focus-none shadow-none flex-grow-1 phone-number\"\n [attr.aria-label]=\"phoneNumberAriaLabel() | translate\"\n [attr.aria-describedby]=\"errormessageId()\"\n [placeholder]=\"placeholder\"\n [disabled]=\"disabled()\"\n [readonly]=\"readonly()\"\n (input)=\"input()\"\n (blur)=\"blur()\"\n />\n</div>\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nimport { NgModule } from '@angular/core';\n\nimport { SiPhoneNumberInputComponent } from './si-phone-number-input.component';\n\n@NgModule({\n imports: [SiPhoneNumberInputComponent],\n exports: [SiPhoneNumberInputComponent]\n})\nexport class SiPhoneNumberInputModule {}\n","/**\n * Copyright (c) Siemens 2016 - 2026\n * SPDX-License-Identifier: MIT\n */\nexport * from './si-phone-number-input.module';\nexport * from './si-phone-number-input.component';\nexport * from './si-phone-number-input.models';\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -13,6 +13,7 @@ import { SiMenuDirective, SiMenuItemComponent } from '@siemens/element-ng/menu';
|
|
|
13
13
|
import * as i1$1 from '@siemens/element-ng/resize-observer';
|
|
14
14
|
import { SiResizeObserverModule } from '@siemens/element-ng/resize-observer';
|
|
15
15
|
import { SiTranslatePipe } from '@siemens/element-translate-ng/translate';
|
|
16
|
+
import { SiTooltipService, SiTooltipDirective } from '@siemens/element-ng/tooltip';
|
|
16
17
|
import { toSignal } from '@angular/core/rxjs-interop';
|
|
17
18
|
import { startWith } from 'rxjs/operators';
|
|
18
19
|
|
|
@@ -81,12 +82,16 @@ class SiTabBaseDirective {
|
|
|
81
82
|
tabContent = viewChild('tabContent', { ...(ngDevMode ? { debugName: "tabContent" } : {}), read: TemplateRef });
|
|
82
83
|
static tabCounter = 0;
|
|
83
84
|
indexBeforeClose = -1;
|
|
85
|
+
tooltipService = inject(SiTooltipService);
|
|
86
|
+
existingTooltip = inject(SiTooltipDirective, { optional: true });
|
|
87
|
+
tooltipRef;
|
|
84
88
|
/** @internal */
|
|
85
89
|
tabId = `${SiTabBaseDirective.tabCounter++}`;
|
|
86
90
|
icons = addIcons({ elementCancel });
|
|
87
91
|
tabset = inject(SI_TABSET);
|
|
88
92
|
index = computed(() => this.tabset.tabPanels().indexOf(this), ...(ngDevMode ? [{ debugName: "index" }] : []));
|
|
89
93
|
constructor() {
|
|
94
|
+
this.setupIconTooltip();
|
|
90
95
|
// Update the focusKeyManager if a tab is added that is active or if the tab is set active by the app.
|
|
91
96
|
// This effect should not run, if active was already applied to the focusKeyManager.
|
|
92
97
|
effect(() => {
|
|
@@ -99,6 +104,28 @@ class SiTabBaseDirective {
|
|
|
99
104
|
});
|
|
100
105
|
});
|
|
101
106
|
}
|
|
107
|
+
setupIconTooltip() {
|
|
108
|
+
effect(onCleanup => {
|
|
109
|
+
const icon = this.icon();
|
|
110
|
+
// Only add an automatic tooltip if the consumer has not already applied an
|
|
111
|
+
// active `siTooltip` directive (i.e. one that is not disabled and has a tooltip).
|
|
112
|
+
const hasActiveTooltip = !!this.existingTooltip &&
|
|
113
|
+
!this.existingTooltip.isDisabled() &&
|
|
114
|
+
!!this.existingTooltip.siTooltip();
|
|
115
|
+
if (icon && !hasActiveTooltip) {
|
|
116
|
+
this.tooltipRef = this.tooltipService.createTooltip({
|
|
117
|
+
element: this.tabButton,
|
|
118
|
+
placement: 'auto',
|
|
119
|
+
tooltip: () => this.heading(),
|
|
120
|
+
tooltipContext: () => undefined
|
|
121
|
+
});
|
|
122
|
+
}
|
|
123
|
+
onCleanup(() => {
|
|
124
|
+
this.tooltipRef?.destroy();
|
|
125
|
+
this.tooltipRef = undefined;
|
|
126
|
+
});
|
|
127
|
+
});
|
|
128
|
+
}
|
|
102
129
|
ngOnDestroy() {
|
|
103
130
|
if (this.indexBeforeClose >= 0) {
|
|
104
131
|
this.tabset.removedTabByUser(this.indexBeforeClose, this.active());
|
|
@@ -204,15 +231,15 @@ class SiTabLinkComponent extends SiTabBaseDirective {
|
|
|
204
231
|
super.selectTab(retainFocus);
|
|
205
232
|
}
|
|
206
233
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabLinkComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
207
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabLinkComponent, isStandalone: true, selector: "a[si-tab][routerLink]", providers: [{ provide: SiTabBaseDirective, useExisting: SiTabLinkComponent }], usesInheritance: true, hostDirectives: [{ directive: i1.RouterLinkActive }], ngImport: i0, template: "@let icon = this.icon();\n
|
|
234
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabLinkComponent, isStandalone: true, selector: "a[si-tab][routerLink]", providers: [SiTooltipService, { provide: SiTabBaseDirective, useExisting: SiTabLinkComponent }], usesInheritance: true, hostDirectives: [{ directive: i1.RouterLinkActive }], ngImport: i0, template: "@let icon = this.icon();\n<span class=\"text-truncate\" [class.visually-hidden]=\"!!icon\">{{ heading() | translate }}</span>\n@if (icon) {\n <si-icon class=\"tab-icon\" [icon]=\"icon\" />\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n <si-icon\n class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost close\"\n [icon]=\"icons.elementCancel\"\n (click)=\"closeTab($event)\"\n />\n}\n\n<ng-template #tabContent>\n <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiTabBadgeComponent, selector: "si-tab-badge", inputs: ["badgeContent", "badgeColor"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
208
235
|
}
|
|
209
236
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabLinkComponent, decorators: [{
|
|
210
237
|
type: Component,
|
|
211
|
-
args: [{ selector: 'a[si-tab][routerLink]', imports: [SiIconComponent, SiTranslatePipe, SiTabBadgeComponent], providers: [{ provide: SiTabBaseDirective, useExisting: SiTabLinkComponent }], changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
|
|
238
|
+
args: [{ selector: 'a[si-tab][routerLink]', imports: [SiIconComponent, SiTranslatePipe, SiTabBadgeComponent], providers: [SiTooltipService, { provide: SiTabBaseDirective, useExisting: SiTabLinkComponent }], changeDetection: ChangeDetectionStrategy.OnPush, hostDirectives: [
|
|
212
239
|
{
|
|
213
240
|
directive: RouterLinkActive
|
|
214
241
|
}
|
|
215
|
-
], template: "@let icon = this.icon();\n
|
|
242
|
+
], template: "@let icon = this.icon();\n<span class=\"text-truncate\" [class.visually-hidden]=\"!!icon\">{{ heading() | translate }}</span>\n@if (icon) {\n <si-icon class=\"tab-icon\" [icon]=\"icon\" />\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n <si-icon\n class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost close\"\n [icon]=\"icons.elementCancel\"\n (click)=\"closeTab($event)\"\n />\n}\n\n<ng-template #tabContent>\n <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"] }]
|
|
216
243
|
}] });
|
|
217
244
|
|
|
218
245
|
/**
|
|
@@ -374,14 +401,14 @@ class SiTabComponent extends SiTabBaseDirective {
|
|
|
374
401
|
this.active.set(false);
|
|
375
402
|
}
|
|
376
403
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
377
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabComponent, isStandalone: true, selector: "si-tab", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, canActivate: { classPropertyName: "canActivate", publicName: "canActivate", isSignal: true, isRequired: false, transformFunction: null }, canDeactivate: { classPropertyName: "canDeactivate", publicName: "canDeactivate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "activeChange" }, host: { listeners: { "click": "selectTabByUser()", "keydown.enter": "selectTabByUser()" } }, providers: [{ provide: SiTabBaseDirective, useExisting: SiTabComponent }], usesInheritance: true, ngImport: i0, template: "@let icon = this.icon();\n
|
|
404
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: SiTabComponent, isStandalone: true, selector: "si-tab", inputs: { active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, canActivate: { classPropertyName: "canActivate", publicName: "canActivate", isSignal: true, isRequired: false, transformFunction: null }, canDeactivate: { classPropertyName: "canDeactivate", publicName: "canDeactivate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { active: "activeChange" }, host: { listeners: { "click": "selectTabByUser()", "keydown.enter": "selectTabByUser()" } }, providers: [SiTooltipService, { provide: SiTabBaseDirective, useExisting: SiTabComponent }], usesInheritance: true, ngImport: i0, template: "@let icon = this.icon();\n<span class=\"text-truncate\" [class.visually-hidden]=\"!!icon\">{{ heading() | translate }}</span>\n@if (icon) {\n <si-icon class=\"tab-icon\" [icon]=\"icon\" />\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n <si-icon\n class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost close\"\n [icon]=\"icons.elementCancel\"\n (click)=\"closeTab($event)\"\n />\n}\n\n<ng-template #tabContent>\n <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"], dependencies: [{ kind: "component", type: SiIconComponent, selector: "si-icon", inputs: ["icon"] }, { kind: "component", type: SiTabBadgeComponent, selector: "si-tab-badge", inputs: ["badgeContent", "badgeColor"] }, { kind: "pipe", type: SiTranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
378
405
|
}
|
|
379
406
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: SiTabComponent, decorators: [{
|
|
380
407
|
type: Component,
|
|
381
|
-
args: [{ selector: 'si-tab', imports: [SiIconComponent, SiTranslatePipe, SiTabBadgeComponent], providers: [{ provide: SiTabBaseDirective, useExisting: SiTabComponent }], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
408
|
+
args: [{ selector: 'si-tab', imports: [SiIconComponent, SiTranslatePipe, SiTabBadgeComponent], providers: [SiTooltipService, { provide: SiTabBaseDirective, useExisting: SiTabComponent }], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
382
409
|
'(click)': 'selectTabByUser()',
|
|
383
410
|
'(keydown.enter)': 'selectTabByUser()'
|
|
384
|
-
}, template: "@let icon = this.icon();\n
|
|
411
|
+
}, template: "@let icon = this.icon();\n<span class=\"text-truncate\" [class.visually-hidden]=\"!!icon\">{{ heading() | translate }}</span>\n@if (icon) {\n <si-icon class=\"tab-icon\" [icon]=\"icon\" />\n}\n<si-tab-badge [badgeColor]=\"badgeColor()\" [badgeContent]=\"badgeContent()\" />\n@if (closable() && !disabledTab()) {\n <si-icon\n class=\"ms-2 btn btn-circle btn-sm btn-tertiary-ghost close\"\n [icon]=\"icons.elementCancel\"\n (click)=\"closeTab($event)\"\n />\n}\n\n<ng-template #tabContent>\n <ng-content />\n</ng-template>\n", styles: [":host.nav-link{flex-shrink:0;transform:translate(0)}:host.nav-link.icon-only{min-inline-size:auto}.tab-icon{font-size:1.5rem}\n"] }]
|
|
385
412
|
}], propDecorators: { active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }, { type: i0.Output, args: ["activeChange"] }], canActivate: [{ type: i0.Input, args: [{ isSignal: true, alias: "canActivate", required: false }] }], canDeactivate: [{ type: i0.Input, args: [{ isSignal: true, alias: "canDeactivate", required: false }] }] } });
|
|
386
413
|
|
|
387
414
|
/**
|