@ngneers/controls 0.0.1-pre5 → 0.0.1-pre7
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/ngneers-controls-accordion.mjs +33 -33
- package/fesm2022/ngneers-controls-accordion.mjs.map +1 -1
- package/fesm2022/ngneers-controls-api-ng.mjs +22 -19
- package/fesm2022/ngneers-controls-api-ng.mjs.map +1 -1
- package/fesm2022/ngneers-controls-api-resize.mjs +706 -0
- package/fesm2022/ngneers-controls-api-resize.mjs.map +1 -0
- package/fesm2022/ngneers-controls-avatar.mjs +13 -13
- package/fesm2022/ngneers-controls-avatar.mjs.map +1 -1
- package/fesm2022/ngneers-controls-base.mjs +89 -64
- package/fesm2022/ngneers-controls-base.mjs.map +1 -1
- package/fesm2022/ngneers-controls-breadcrumb.mjs +19 -19
- package/fesm2022/ngneers-controls-breadcrumb.mjs.map +1 -1
- package/fesm2022/ngneers-controls-button-group.mjs +8 -8
- package/fesm2022/ngneers-controls-button-group.mjs.map +1 -1
- package/fesm2022/ngneers-controls-button.mjs +15 -10
- package/fesm2022/ngneers-controls-button.mjs.map +1 -1
- package/fesm2022/{ngneers-controls-calendar-time-BEeJIqIX.mjs → ngneers-controls-calendar-time-CKAqRgOP.mjs} +9 -9
- package/fesm2022/{ngneers-controls-calendar-time-BEeJIqIX.mjs.map → ngneers-controls-calendar-time-CKAqRgOP.mjs.map} +1 -1
- package/fesm2022/ngneers-controls-calendar.mjs +56 -56
- package/fesm2022/ngneers-controls-calendar.mjs.map +1 -1
- package/fesm2022/ngneers-controls-checkbox.mjs +9 -9
- package/fesm2022/ngneers-controls-checkbox.mjs.map +1 -1
- package/fesm2022/ngneers-controls-chip.mjs +7 -7
- package/fesm2022/ngneers-controls-chip.mjs.map +1 -1
- package/fesm2022/ngneers-controls-default-icons.mjs +61 -0
- package/fesm2022/ngneers-controls-default-icons.mjs.map +1 -0
- package/fesm2022/ngneers-controls-defer.mjs +10 -10
- package/fesm2022/ngneers-controls-defer.mjs.map +1 -1
- package/fesm2022/ngneers-controls-dialog.mjs +38 -40
- package/fesm2022/ngneers-controls-dialog.mjs.map +1 -1
- package/fesm2022/ngneers-controls-directives.mjs +45 -39
- package/fesm2022/ngneers-controls-directives.mjs.map +1 -1
- package/fesm2022/ngneers-controls-drawer.mjs +29 -29
- package/fesm2022/ngneers-controls-drawer.mjs.map +1 -1
- package/fesm2022/ngneers-controls-edit-inplace.mjs +16 -16
- package/fesm2022/ngneers-controls-edit-inplace.mjs.map +1 -1
- package/fesm2022/ngneers-controls-filter.mjs +192 -44
- package/fesm2022/ngneers-controls-filter.mjs.map +1 -1
- package/fesm2022/{ngneers-controls-i18n-de-CdTPeBiR.mjs → ngneers-controls-i18n-de-CF0xTWEX.mjs} +9 -5
- package/fesm2022/ngneers-controls-i18n-de-CF0xTWEX.mjs.map +1 -0
- package/fesm2022/{ngneers-controls-i18n-en-Cfp2pOLY.mjs → ngneers-controls-i18n-en-8B7xAjH2.mjs} +9 -5
- package/fesm2022/ngneers-controls-i18n-en-8B7xAjH2.mjs.map +1 -0
- package/fesm2022/ngneers-controls-i18n.mjs +5 -5
- package/fesm2022/ngneers-controls-i18n.mjs.map +1 -1
- package/fesm2022/ngneers-controls-icon.mjs +111 -47
- package/fesm2022/ngneers-controls-icon.mjs.map +1 -1
- package/fesm2022/ngneers-controls-inplace.mjs +18 -18
- package/fesm2022/ngneers-controls-inplace.mjs.map +1 -1
- package/fesm2022/ngneers-controls-input-field.mjs +16 -16
- package/fesm2022/ngneers-controls-input-field.mjs.map +1 -1
- package/fesm2022/ngneers-controls-input-mask.mjs +8 -8
- package/fesm2022/ngneers-controls-input-mask.mjs.map +1 -1
- package/fesm2022/ngneers-controls-input.mjs +6 -6
- package/fesm2022/ngneers-controls-input.mjs.map +1 -1
- package/fesm2022/ngneers-controls-item-view.mjs +33 -33
- package/fesm2022/ngneers-controls-item-view.mjs.map +1 -1
- package/fesm2022/ngneers-controls-list-box.mjs +31 -31
- package/fesm2022/ngneers-controls-list-box.mjs.map +1 -1
- package/fesm2022/ngneers-controls-menu.mjs +33 -33
- package/fesm2022/ngneers-controls-menu.mjs.map +1 -1
- package/fesm2022/ngneers-controls-message.mjs +4 -4
- package/fesm2022/ngneers-controls-message.mjs.map +1 -1
- package/fesm2022/ngneers-controls-paginator.mjs +13 -13
- package/fesm2022/ngneers-controls-paginator.mjs.map +1 -1
- package/fesm2022/ngneers-controls-popover.mjs +21 -16
- package/fesm2022/ngneers-controls-popover.mjs.map +1 -1
- package/fesm2022/ngneers-controls-progress.mjs +16 -16
- package/fesm2022/ngneers-controls-progress.mjs.map +1 -1
- package/fesm2022/ngneers-controls-scroll-shadow.mjs +54 -0
- package/fesm2022/ngneers-controls-scroll-shadow.mjs.map +1 -0
- package/fesm2022/ngneers-controls-scroller.mjs +74 -39
- package/fesm2022/ngneers-controls-scroller.mjs.map +1 -1
- package/fesm2022/ngneers-controls-select-button.mjs +7 -7
- package/fesm2022/ngneers-controls-select-button.mjs.map +1 -1
- package/fesm2022/ngneers-controls-select.mjs +48 -47
- package/fesm2022/ngneers-controls-select.mjs.map +1 -1
- package/fesm2022/ngneers-controls-slider.mjs +11 -11
- package/fesm2022/ngneers-controls-slider.mjs.map +1 -1
- package/fesm2022/ngneers-controls-spinner.mjs +7 -7
- package/fesm2022/ngneers-controls-spinner.mjs.map +1 -1
- package/fesm2022/ngneers-controls-splitter.mjs +141 -328
- package/fesm2022/ngneers-controls-splitter.mjs.map +1 -1
- package/fesm2022/ngneers-controls-switch.mjs +3 -3
- package/fesm2022/ngneers-controls-switch.mjs.map +1 -1
- package/fesm2022/ngneers-controls-table.mjs +1456 -82
- package/fesm2022/ngneers-controls-table.mjs.map +1 -1
- package/fesm2022/ngneers-controls-tabs.mjs +41 -40
- package/fesm2022/ngneers-controls-tabs.mjs.map +1 -1
- package/fesm2022/ngneers-controls-tag.mjs +4 -4
- package/fesm2022/ngneers-controls-tag.mjs.map +1 -1
- package/fesm2022/ngneers-controls-toast.mjs +19 -19
- package/fesm2022/ngneers-controls-toast.mjs.map +1 -1
- package/fesm2022/ngneers-controls-toggle-button.mjs +10 -10
- package/fesm2022/ngneers-controls-toggle-button.mjs.map +1 -1
- package/fesm2022/ngneers-controls-tooltip.mjs +74 -38
- package/fesm2022/ngneers-controls-tooltip.mjs.map +1 -1
- package/fesm2022/ngneers-controls-utils-ng.mjs +9 -9
- package/fesm2022/ngneers-controls-utils-ng.mjs.map +1 -1
- package/fesm2022/ngneers-controls-utils.mjs +1 -1
- package/fesm2022/ngneers-controls-utils.mjs.map +1 -1
- package/package.json +34 -12
- package/types/ngneers-controls-accordion.d.ts +6 -4
- package/types/ngneers-controls-api-ng.d.ts +7 -2
- package/types/ngneers-controls-api-resize.d.ts +318 -0
- package/types/ngneers-controls-api.d.ts +2 -2
- package/types/ngneers-controls-base.d.ts +8 -0
- package/types/ngneers-controls-breadcrumb.d.ts +6 -4
- package/types/ngneers-controls-button.d.ts +13 -8
- package/types/ngneers-controls-calendar.d.ts +5 -1
- package/types/ngneers-controls-checkbox.d.ts +6 -4
- package/types/ngneers-controls-chip.d.ts +3 -1
- package/types/ngneers-controls-default-icons.d.ts +5 -0
- package/types/ngneers-controls-directives.d.ts +7 -1
- package/types/ngneers-controls-drawer.d.ts +7 -1
- package/types/ngneers-controls-edit-inplace.d.ts +4 -0
- package/types/ngneers-controls-filter.d.ts +52 -3
- package/types/ngneers-controls-i18n.d.ts +4 -0
- package/types/ngneers-controls-icon.d.ts +23 -40
- package/types/ngneers-controls-input-field.d.ts +7 -1
- package/types/ngneers-controls-item-view.d.ts +4 -2
- package/types/ngneers-controls-list-box.d.ts +5 -1
- package/types/ngneers-controls-menu.d.ts +4 -2
- package/types/ngneers-controls-message.d.ts +3 -1
- package/types/ngneers-controls-paginator.d.ts +4 -0
- package/types/ngneers-controls-popover.d.ts +2 -1
- package/types/ngneers-controls-scroll-shadow.d.ts +16 -0
- package/types/ngneers-controls-scroller.d.ts +12 -2
- package/types/ngneers-controls-select.d.ts +11 -12
- package/types/ngneers-controls-spinner.d.ts +1 -1
- package/types/ngneers-controls-splitter.d.ts +29 -59
- package/types/ngneers-controls-table.d.ts +380 -24
- package/types/ngneers-controls-tabs.d.ts +4 -2
- package/types/ngneers-controls-tag.d.ts +3 -1
- package/types/ngneers-controls-toast.d.ts +5 -3
- package/types/ngneers-controls-toggle-button.d.ts +5 -3
- package/types/ngneers-controls-tooltip.d.ts +7 -1
- package/fesm2022/ngneers-controls-i18n-de-CdTPeBiR.mjs.map +0 -1
- package/fesm2022/ngneers-controls-i18n-en-Cfp2pOLY.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-calendar-z5xA9wTT.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-calendar-z5xA9wTT.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-check-DdAQ9k-T.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-check-DdAQ9k-T.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-chevron_down-HO-z-xOr.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-chevron_down-HO-z-xOr.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-chevron_left-CC5psi16.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-chevron_left-CC5psi16.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-chevron_right-BRxlzx4G.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-chevron_right-BRxlzx4G.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-chevron_up-cqhPO7g2.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-chevron_up-cqhPO7g2.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-ellipsis-DXIGA1sk.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-ellipsis-DXIGA1sk.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-filter-oU7E6Xgr.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-filter-oU7E6Xgr.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-filter_solid-CqIKuR4N.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-filter_solid-CqIKuR4N.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-magnifying_glass-T4Hzbkig.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-magnifying_glass-T4Hzbkig.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-minus-oGDEFO4E.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-minus-oGDEFO4E.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-sort-CRD4tafz.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-sort-CRD4tafz.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-sort_down-DiFB1P6R.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-sort_down-DiFB1P6R.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-sort_up-Bq_q3hIi.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-sort_up-Bq_q3hIi.mjs.map +0 -1
- package/fesm2022/ngneers-controls-icon-xmark-BZKZORiu.mjs +0 -4
- package/fesm2022/ngneers-controls-icon-xmark-BZKZORiu.mjs.map +0 -1
|
@@ -1,15 +1,13 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { signal, Injectable, inject, input,
|
|
2
|
+
import { signal, Injectable, InjectionToken, inject, input, computed, afterRenderEffect, ChangeDetectionStrategy, Component } from '@angular/core';
|
|
3
3
|
import { NgTemplateOutlet } from '@angular/common';
|
|
4
4
|
import { DomSanitizer } from '@angular/platform-browser';
|
|
5
|
-
import { templateTypesFn, NgnTemplate } from '@ngneers/controls/api/ng';
|
|
6
5
|
import { NgnBase, NgnPt, provideSelf } from '@ngneers/controls/base';
|
|
7
6
|
import { NgnError } from '@ngneers/controls/utils';
|
|
8
|
-
import { asyncComputed } from '@ngneers/controls/utils-ng';
|
|
9
7
|
import { iconControlTemplate } from '@ngneers/controls-themes/templates/icon';
|
|
10
8
|
|
|
11
9
|
class GlobalIconTemplate {
|
|
12
|
-
_globalIconTemplate = signal(null, ...(ngDevMode ? [{ debugName: "_globalIconTemplate" }] : []));
|
|
10
|
+
_globalIconTemplate = signal(null, ...(ngDevMode ? [{ debugName: "_globalIconTemplate" }] : /* istanbul ignore next */ []));
|
|
13
11
|
globalIconTemplate = this._globalIconTemplate.asReadonly();
|
|
14
12
|
setGlobalIconTemplate(template) {
|
|
15
13
|
this._globalIconTemplate.set(template);
|
|
@@ -17,32 +15,67 @@ class GlobalIconTemplate {
|
|
|
17
15
|
ngOnDestroy() {
|
|
18
16
|
this._globalIconTemplate.set(null);
|
|
19
17
|
}
|
|
20
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
21
|
-
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.
|
|
18
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: GlobalIconTemplate, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
|
|
19
|
+
static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: GlobalIconTemplate, providedIn: 'root' });
|
|
22
20
|
}
|
|
23
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
21
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: GlobalIconTemplate, decorators: [{
|
|
24
22
|
type: Injectable,
|
|
25
23
|
args: [{ providedIn: 'root' }]
|
|
26
24
|
}] });
|
|
27
25
|
|
|
28
|
-
const
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
26
|
+
const NGN_ICON_KEYS = [
|
|
27
|
+
'accordion-collapse',
|
|
28
|
+
'accordion-expand',
|
|
29
|
+
'breadcrumb-separator',
|
|
30
|
+
'breadcrumb-overflow',
|
|
31
|
+
'calendar-trigger',
|
|
32
|
+
'calendar-previous-month',
|
|
33
|
+
'calendar-next-month',
|
|
34
|
+
'checkbox-checked',
|
|
35
|
+
'checkbox-indeterminate',
|
|
36
|
+
'chip-remove',
|
|
37
|
+
'dialog-close',
|
|
38
|
+
'drawer-close',
|
|
39
|
+
'dropdown-toggle',
|
|
40
|
+
'edit-confirm',
|
|
41
|
+
'filter-active',
|
|
42
|
+
'filter-inactive',
|
|
43
|
+
'filter-remove',
|
|
44
|
+
'input-clear',
|
|
45
|
+
'menu-submenu',
|
|
46
|
+
'paginator-previous',
|
|
47
|
+
'paginator-next',
|
|
48
|
+
'search',
|
|
49
|
+
'sort-neutral',
|
|
50
|
+
'sort-ascending',
|
|
51
|
+
'sort-descending',
|
|
52
|
+
'table-group-toggle',
|
|
53
|
+
'tabs-scroll-left',
|
|
54
|
+
'tabs-scroll-right',
|
|
55
|
+
'toast-close',
|
|
56
|
+
];
|
|
57
|
+
const NGN_ICON_REGISTRY = new InjectionToken('NGN_ICON_REGISTRY');
|
|
58
|
+
const NGN_CUSTOM_ICONS = new InjectionToken('NGN_CUSTOM_ICONS');
|
|
59
|
+
function provideNgnCustomIcons(registry) {
|
|
60
|
+
return [
|
|
61
|
+
{ provide: NGN_ICON_REGISTRY, useValue: registry },
|
|
62
|
+
{ provide: NGN_CUSTOM_ICONS, useValue: true },
|
|
63
|
+
];
|
|
64
|
+
}
|
|
45
65
|
|
|
66
|
+
function generateIconSvg(sanitizer, iconData, scale) {
|
|
67
|
+
// Note: @iconify/types documents default as 16, but we default to 24 to match Tabler.
|
|
68
|
+
// All Tabler icons provide explicit dimensions, so this fallback rarely triggers.
|
|
69
|
+
const width = iconData.width ?? 24;
|
|
70
|
+
const height = iconData.height ?? 24;
|
|
71
|
+
const insetX = scale === 1 ? 0 : ((scale - 1) / scale) * (width / 2);
|
|
72
|
+
const insetY = scale === 1 ? 0 : ((scale - 1) / scale) * (height / 2);
|
|
73
|
+
const vbX = insetX;
|
|
74
|
+
const vbY = insetY;
|
|
75
|
+
const vbW = width - insetX * 2;
|
|
76
|
+
const vbH = height - insetY * 2;
|
|
77
|
+
return sanitizer.bypassSecurityTrustHtml(`<svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" viewBox="${vbX} ${vbY} ${vbW} ${vbH}">${iconData.body}</svg>`);
|
|
78
|
+
}
|
|
46
79
|
/**
|
|
47
80
|
* @category control
|
|
48
81
|
*/
|
|
@@ -50,25 +83,56 @@ class NgnIcon extends NgnBase {
|
|
|
50
83
|
theme = this.injectThemeTemplate(iconControlTemplate, 'root');
|
|
51
84
|
_globalIconTemplate = inject(GlobalIconTemplate).globalIconTemplate;
|
|
52
85
|
_sanitizer = inject(DomSanitizer);
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
86
|
+
_registry = inject(NGN_ICON_REGISTRY, { optional: true });
|
|
87
|
+
_isCustom = inject(NGN_CUSTOM_ICONS, { optional: true }) ?? false;
|
|
88
|
+
defaultIcon = input(...(ngDevMode ? [undefined, { debugName: "defaultIcon" }] : /* istanbul ignore next */ []));
|
|
89
|
+
icon = input(...(ngDevMode ? [undefined, { debugName: "icon" }] : /* istanbul ignore next */ []));
|
|
90
|
+
iconSvg = computed(() => {
|
|
91
|
+
const value = this.icon();
|
|
92
|
+
if (!value || typeof value !== 'object')
|
|
93
|
+
return null;
|
|
94
|
+
let iconData;
|
|
95
|
+
let scale = 1;
|
|
96
|
+
if ('body' in value) {
|
|
97
|
+
iconData = value;
|
|
98
|
+
}
|
|
99
|
+
else if ('icon' in value && typeof value.icon === 'object' && 'body' in value.icon) {
|
|
100
|
+
const entry = value;
|
|
101
|
+
iconData = entry.icon;
|
|
102
|
+
scale = entry.scale ?? 1;
|
|
103
|
+
}
|
|
104
|
+
else {
|
|
105
|
+
return null;
|
|
106
|
+
}
|
|
107
|
+
return generateIconSvg(this._sanitizer, iconData, scale);
|
|
108
|
+
}, ...(ngDevMode ? [{ debugName: "iconSvg" }] : /* istanbul ignore next */ []));
|
|
109
|
+
defaultIconSvg = computed(() => {
|
|
110
|
+
const key = this.defaultIcon();
|
|
111
|
+
if (!key || this._isCustom)
|
|
112
|
+
return null;
|
|
113
|
+
if (!this._registry) {
|
|
114
|
+
throw new NgnError('icon', 'No icon registry provided. Call provideNgnDefaultIcons() or provideNgnCustomIcons() in your application providers.');
|
|
115
|
+
}
|
|
116
|
+
const raw = this._registry[key];
|
|
117
|
+
const entry = 'body' in raw ? { icon: raw, scale: 1 } : raw;
|
|
118
|
+
return generateIconSvg(this._sanitizer, entry.icon, entry.scale ?? 1);
|
|
119
|
+
}, ...(ngDevMode ? [{ debugName: "defaultIconSvg" }] : /* istanbul ignore next */ []));
|
|
120
|
+
customDefaultIcon = computed(() => {
|
|
121
|
+
const key = this.defaultIcon();
|
|
122
|
+
if (!key || !this._isCustom)
|
|
59
123
|
return null;
|
|
124
|
+
if (!this._registry) {
|
|
125
|
+
throw new NgnError('icon', 'No icon registry provided. Call provideNgnDefaultIcons() or provideNgnCustomIcons() in your application providers.');
|
|
60
126
|
}
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
if (globalTemplate) {
|
|
68
|
-
return globalTemplate;
|
|
127
|
+
return this._registry[key];
|
|
128
|
+
}, ...(ngDevMode ? [{ debugName: "customDefaultIcon" }] : /* istanbul ignore next */ []));
|
|
129
|
+
iconTemplate = computed(() => {
|
|
130
|
+
const template = this._globalIconTemplate();
|
|
131
|
+
if (!template) {
|
|
132
|
+
throw new NgnError('icon', 'No GlobalIconTemplate registered. Required when using [icon] with non-Iconify values or provideNgnCustomIcons() with [defaultIcon]. If using Iconify, pass an IconifyIcon data object (e.g., import tablerUser from "@iconify/icons-tabler/user").');
|
|
69
133
|
}
|
|
70
|
-
return
|
|
71
|
-
}, ...(ngDevMode ? [{ debugName: "
|
|
134
|
+
return template;
|
|
135
|
+
}, ...(ngDevMode ? [{ debugName: "iconTemplate" }] : /* istanbul ignore next */ []));
|
|
72
136
|
constructor() {
|
|
73
137
|
super();
|
|
74
138
|
afterRenderEffect(() => {
|
|
@@ -77,19 +141,19 @@ class NgnIcon extends NgnBase {
|
|
|
77
141
|
}
|
|
78
142
|
});
|
|
79
143
|
}
|
|
80
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
81
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
144
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnIcon, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
145
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: NgnIcon, isStandalone: true, selector: "ngn-icon", inputs: { defaultIcon: { classPropertyName: "defaultIcon", publicName: "defaultIcon", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "ngSkipHydration": "true" } }, providers: [provideSelf(NgnIcon)], usesInheritance: true, ngImport: i0, template: "@if (iconSvg(); as svg) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'default'\" [innerHtml]=\"svg\"></div>\r\n} @else if (icon()) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n iconTemplate();\r\n context: {\r\n $implicit: {\r\n icon: icon(),\r\n },\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n} @else if (customDefaultIcon(); as customIcon) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n iconTemplate();\r\n context: {\r\n $implicit: {\r\n icon: customIcon,\r\n },\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n} @else {\r\n @if (defaultIconSvg(); as defaultIcon) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'default'\" [innerHtml]=\"defaultIcon\"></div>\r\n }\r\n}\r\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
82
146
|
}
|
|
83
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
147
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnIcon, decorators: [{
|
|
84
148
|
type: Component,
|
|
85
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ngn-icon', imports: [NgnPt, NgTemplateOutlet
|
|
149
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ngn-icon', imports: [NgnPt, NgTemplateOutlet], providers: [provideSelf(NgnIcon)], host: {
|
|
86
150
|
ngSkipHydration: 'true',
|
|
87
|
-
}, template: "@if (icon()) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n
|
|
88
|
-
}], ctorParameters: () => [], propDecorators: { defaultIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultIcon", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }]
|
|
151
|
+
}, template: "@if (iconSvg(); as svg) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'default'\" [innerHtml]=\"svg\"></div>\r\n} @else if (icon()) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n iconTemplate();\r\n context: {\r\n $implicit: {\r\n icon: icon(),\r\n },\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n} @else if (customDefaultIcon(); as customIcon) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n iconTemplate();\r\n context: {\r\n $implicit: {\r\n icon: customIcon,\r\n },\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n} @else {\r\n @if (defaultIconSvg(); as defaultIcon) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'default'\" [innerHtml]=\"defaultIcon\"></div>\r\n }\r\n}\r\n" }]
|
|
152
|
+
}], ctorParameters: () => [], propDecorators: { defaultIcon: [{ type: i0.Input, args: [{ isSignal: true, alias: "defaultIcon", required: false }] }], icon: [{ type: i0.Input, args: [{ isSignal: true, alias: "icon", required: false }] }] } });
|
|
89
153
|
|
|
90
154
|
/**
|
|
91
155
|
* Generated bundle index. Do not edit.
|
|
92
156
|
*/
|
|
93
157
|
|
|
94
|
-
export { GlobalIconTemplate, NgnIcon };
|
|
158
|
+
export { GlobalIconTemplate, NGN_CUSTOM_ICONS, NGN_ICON_KEYS, NGN_ICON_REGISTRY, NgnIcon, provideNgnCustomIcons };
|
|
95
159
|
//# sourceMappingURL=ngneers-controls-icon.mjs.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngneers-controls-icon.mjs","sources":["../../src/icon/global-icon-template.ts","../../src/icon/default-icons/ts/index.ts","../../src/icon/icon.ts","../../src/icon/icon.html","../../src/icon/ngneers-controls-icon.ts"],"sourcesContent":["import { Injectable, signal, TemplateRef, type OnDestroy } from '@angular/core';\r\n\r\nimport type { IconTemplateContext } from './types';\r\n\r\nexport type IconTemplateType = TemplateRef<IconTemplateContext>;\r\n\r\n@Injectable({ providedIn: 'root' })\r\nexport class GlobalIconTemplate implements OnDestroy {\r\n private readonly _globalIconTemplate = signal<IconTemplateType | null>(null);\r\n\r\n public readonly globalIconTemplate = this._globalIconTemplate.asReadonly();\r\n\r\n public setGlobalIconTemplate(template: IconTemplateType) {\r\n this._globalIconTemplate.set(template);\r\n }\r\n\r\n public ngOnDestroy() {\r\n this._globalIconTemplate.set(null);\r\n }\r\n}\r\n","export const DEFAULT_ICONS = {\n calendar: () => import('./calendar').then(module => module.default),\n check: () => import('./check').then(module => module.default),\n chevron_down: () => import('./chevron_down').then(module => module.default),\n chevron_left: () => import('./chevron_left').then(module => module.default),\n chevron_right: () => import('./chevron_right').then(module => module.default),\n chevron_up: () => import('./chevron_up').then(module => module.default),\n ellipsis: () => import('./ellipsis').then(module => module.default),\n filter: () => import('./filter').then(module => module.default),\n filter_solid: () => import('./filter_solid').then(module => module.default),\n magnifying_glass: () => import('./magnifying_glass').then(module => module.default),\n minus: () => import('./minus').then(module => module.default),\n sort: () => import('./sort').then(module => module.default),\n sort_down: () => import('./sort_down').then(module => module.default),\n sort_up: () => import('./sort_up').then(module => module.default),\n xmark: () => import('./xmark').then(module => module.default),\n};\n","import { NgTemplateOutlet } from '@angular/common';\r\nimport {\r\n afterRenderEffect,\r\n Component,\r\n computed,\r\n inject,\r\n input,\r\n TemplateRef,\r\n viewChild,\r\n ChangeDetectionStrategy,\r\n} from '@angular/core';\r\nimport { DomSanitizer } from '@angular/platform-browser';\r\nimport { NgnTemplate, templateTypesFn } from '@ngneers/controls/api/ng';\r\nimport { NgnBase, provideSelf, NgnPt } from '@ngneers/controls/base';\r\nimport { NgnError } from '@ngneers/controls/utils';\r\nimport { asyncComputed } from '@ngneers/controls/utils-ng';\r\nimport { iconControlTemplate } from '@ngneers/controls-themes/templates/icon';\r\n\r\nimport { DEFAULT_ICONS } from './default-icons/ts';\r\nimport { GlobalIconTemplate } from './global-icon-template';\r\n\r\nimport type { DefaultIcon, IconTemplateContext } from './types';\r\nimport type { IconType } from '@ngneers/controls-custom-types';\r\n\r\n/**\r\n * @category control\r\n */\r\n@Component({\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n selector: 'ngn-icon',\r\n templateUrl: './icon.html',\r\n imports: [NgnPt, NgTemplateOutlet, NgnTemplate],\r\n providers: [provideSelf(NgnIcon)],\r\n host: {\r\n ngSkipHydration: 'true',\r\n },\r\n})\r\nexport class NgnIcon extends NgnBase<'icon'> {\r\n protected readonly theme = this.injectThemeTemplate(iconControlTemplate, 'root');\r\n private readonly _globalIconTemplate = inject(GlobalIconTemplate).globalIconTemplate;\r\n private readonly _sanitizer = inject(DomSanitizer);\r\n\r\n public readonly defaultIcon = input<DefaultIcon>();\r\n public readonly icon = input<IconType>();\r\n\r\n protected readonly templateType = templateTypesFn<IconTemplateContext>();\r\n\r\n protected readonly defaultIconSvg = asyncComputed(async () => {\r\n const defaultIconKey = this.defaultIcon();\r\n if (!defaultIconKey) {\r\n return null;\r\n }\r\n const svg = DEFAULT_ICONS[defaultIconKey];\r\n return this._sanitizer.bypassSecurityTrustHtml(await svg()); // This is safe as we control the SVG content\r\n }, null);\r\n\r\n private readonly _defaultIconTemplate =\r\n viewChild.required<TemplateRef<IconTemplateContext>>('defaultIconTemplate');\r\n\r\n protected readonly usedIconTemplate = computed(() => {\r\n const globalTemplate = this._globalIconTemplate();\r\n if (globalTemplate) {\r\n return globalTemplate;\r\n }\r\n return this._defaultIconTemplate();\r\n });\r\n\r\n constructor() {\r\n super();\r\n afterRenderEffect(() => {\r\n if (!this.icon() && !this.defaultIcon()) {\r\n throw new NgnError(\r\n 'icon',\r\n 'Icon component requires either an icon or a default icon to be set.'\r\n );\r\n }\r\n });\r\n }\r\n}\r\n","@if (icon()) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n usedIconTemplate();\r\n context: {\r\n $implicit: {\r\n icon: icon(),\r\n },\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n\r\n <ng-template #defaultIconTemplate [ngnTemplate]=\"templateType\" let-icon\r\n ><i [style.--fa-display]=\"'block'\" class=\"{{ icon.icon }}\"></i\r\n ></ng-template>\r\n} @else {\r\n <!-- imported svg icon -->\r\n @if (defaultIconSvg(); as defaultIcon) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'default'\" [innerHtml]=\"defaultIcon\"></div>\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
1
|
+
{"version":3,"file":"ngneers-controls-icon.mjs","sources":["../../src/icon/global-icon-template.ts","../../src/icon/icon-registry.ts","../../src/icon/icon.ts","../../src/icon/icon.html","../../src/icon/ngneers-controls-icon.ts"],"sourcesContent":["import { Injectable, signal, TemplateRef, type OnDestroy } from '@angular/core';\r\n\r\nimport type { IconTemplateContext } from './types';\r\n\r\nexport type IconTemplateType = TemplateRef<IconTemplateContext>;\r\n\r\n@Injectable({ providedIn: 'root' })\r\nexport class GlobalIconTemplate implements OnDestroy {\r\n private readonly _globalIconTemplate = signal<IconTemplateType | null>(null);\r\n\r\n public readonly globalIconTemplate = this._globalIconTemplate.asReadonly();\r\n\r\n public setGlobalIconTemplate(template: IconTemplateType) {\r\n this._globalIconTemplate.set(template);\r\n }\r\n\r\n public ngOnDestroy() {\r\n this._globalIconTemplate.set(null);\r\n }\r\n}\r\n","import { InjectionToken, type Provider } from '@angular/core';\r\n\r\nimport type { IconifyIcon } from '@iconify/types';\r\nimport type { IconType, NgnIconEntry } from '@ngneers/controls-custom-types';\r\n\r\nexport type { NgnIconEntry } from '@ngneers/controls-custom-types';\r\n\r\nexport const NGN_ICON_KEYS = [\r\n 'accordion-collapse',\r\n 'accordion-expand',\r\n 'breadcrumb-separator',\r\n 'breadcrumb-overflow',\r\n 'calendar-trigger',\r\n 'calendar-previous-month',\r\n 'calendar-next-month',\r\n 'checkbox-checked',\r\n 'checkbox-indeterminate',\r\n 'chip-remove',\r\n 'dialog-close',\r\n 'drawer-close',\r\n 'dropdown-toggle',\r\n 'edit-confirm',\r\n 'filter-active',\r\n 'filter-inactive',\r\n 'filter-remove',\r\n 'input-clear',\r\n 'menu-submenu',\r\n 'paginator-previous',\r\n 'paginator-next',\r\n 'search',\r\n 'sort-neutral',\r\n 'sort-ascending',\r\n 'sort-descending',\r\n 'table-group-toggle',\r\n 'tabs-scroll-left',\r\n 'tabs-scroll-right',\r\n 'toast-close',\r\n] as const;\r\n\r\nexport type NgnIconKey = (typeof NGN_ICON_KEYS)[number];\r\n\r\nexport type NgnIconRegistry = Record<NgnIconKey, IconifyIcon | NgnIconEntry>;\r\n\r\nexport type NgnCustomIconRegistry = Record<NgnIconKey, IconType>;\r\n\r\nexport const NGN_ICON_REGISTRY = new InjectionToken<NgnIconRegistry | NgnCustomIconRegistry>(\r\n 'NGN_ICON_REGISTRY'\r\n);\r\n\r\nexport const NGN_CUSTOM_ICONS = new InjectionToken<boolean>('NGN_CUSTOM_ICONS');\r\n\r\nexport function provideNgnCustomIcons(registry: NgnCustomIconRegistry): Provider[] {\r\n return [\r\n { provide: NGN_ICON_REGISTRY, useValue: registry },\r\n { provide: NGN_CUSTOM_ICONS, useValue: true },\r\n ];\r\n}\r\n","import { NgTemplateOutlet } from '@angular/common';\r\nimport {\r\n afterRenderEffect,\r\n Component,\r\n computed,\r\n inject,\r\n input,\r\n ChangeDetectionStrategy,\r\n} from '@angular/core';\r\nimport { DomSanitizer, type SafeHtml } from '@angular/platform-browser';\r\nimport { NgnBase, provideSelf, NgnPt } from '@ngneers/controls/base';\r\nimport { NgnError } from '@ngneers/controls/utils';\r\nimport { iconControlTemplate } from '@ngneers/controls-themes/templates/icon';\r\n\r\nimport { GlobalIconTemplate } from './global-icon-template';\r\nimport { NGN_CUSTOM_ICONS, NGN_ICON_REGISTRY } from './icon-registry';\r\n\r\nimport type { NgnIconEntry, NgnIconKey, NgnIconRegistry } from './icon-registry';\r\nimport type { IconifyIcon } from '@iconify/types';\r\nimport type { IconType } from '@ngneers/controls-custom-types';\r\n\r\nfunction generateIconSvg(sanitizer: DomSanitizer, iconData: IconifyIcon, scale: number): SafeHtml {\r\n // Note: @iconify/types documents default as 16, but we default to 24 to match Tabler.\r\n // All Tabler icons provide explicit dimensions, so this fallback rarely triggers.\r\n const width = iconData.width ?? 24;\r\n const height = iconData.height ?? 24;\r\n\r\n const insetX = scale === 1 ? 0 : ((scale - 1) / scale) * (width / 2);\r\n const insetY = scale === 1 ? 0 : ((scale - 1) / scale) * (height / 2);\r\n const vbX = insetX;\r\n const vbY = insetY;\r\n const vbW = width - insetX * 2;\r\n const vbH = height - insetY * 2;\r\n\r\n return sanitizer.bypassSecurityTrustHtml(\r\n `<svg xmlns=\"http://www.w3.org/2000/svg\" aria-hidden=\"true\" viewBox=\"${vbX} ${vbY} ${vbW} ${vbH}\">${iconData.body}</svg>`\r\n );\r\n}\r\n\r\n/**\r\n * @category control\r\n */\r\n@Component({\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n selector: 'ngn-icon',\r\n templateUrl: './icon.html',\r\n imports: [NgnPt, NgTemplateOutlet],\r\n providers: [provideSelf(NgnIcon)],\r\n host: {\r\n ngSkipHydration: 'true',\r\n },\r\n})\r\nexport class NgnIcon extends NgnBase<'icon'> {\r\n protected readonly theme = this.injectThemeTemplate(iconControlTemplate, 'root');\r\n private readonly _globalIconTemplate = inject(GlobalIconTemplate).globalIconTemplate;\r\n private readonly _sanitizer = inject(DomSanitizer);\r\n private readonly _registry = inject(NGN_ICON_REGISTRY, { optional: true });\r\n private readonly _isCustom = inject(NGN_CUSTOM_ICONS, { optional: true }) ?? false;\r\n\r\n public readonly defaultIcon = input<NgnIconKey>();\r\n public readonly icon = input<IconType>();\r\n\r\n protected readonly iconSvg = computed(() => {\r\n const value = this.icon();\r\n if (!value || typeof value !== 'object') return null;\r\n\r\n let iconData: IconifyIcon;\r\n let scale = 1;\r\n\r\n if ('body' in value) {\r\n iconData = value as IconifyIcon;\r\n } else if ('icon' in value && typeof value.icon === 'object' && 'body' in value.icon) {\r\n const entry = value as NgnIconEntry;\r\n iconData = entry.icon;\r\n scale = entry.scale ?? 1;\r\n } else {\r\n return null;\r\n }\r\n\r\n return generateIconSvg(this._sanitizer, iconData, scale);\r\n });\r\n\r\n protected readonly defaultIconSvg = computed(() => {\r\n const key = this.defaultIcon();\r\n if (!key || this._isCustom) return null;\r\n if (!this._registry) {\r\n throw new NgnError(\r\n 'icon',\r\n 'No icon registry provided. Call provideNgnDefaultIcons() or provideNgnCustomIcons() in your application providers.'\r\n );\r\n }\r\n const raw = (this._registry as NgnIconRegistry)[key];\r\n const entry: NgnIconEntry =\r\n 'body' in raw ? { icon: raw as IconifyIcon, scale: 1 } : (raw as NgnIconEntry);\r\n\r\n return generateIconSvg(this._sanitizer, entry.icon, entry.scale ?? 1);\r\n });\r\n\r\n protected readonly customDefaultIcon = computed(() => {\r\n const key = this.defaultIcon();\r\n if (!key || !this._isCustom) return null;\r\n if (!this._registry) {\r\n throw new NgnError(\r\n 'icon',\r\n 'No icon registry provided. Call provideNgnDefaultIcons() or provideNgnCustomIcons() in your application providers.'\r\n );\r\n }\r\n return this._registry[key] as IconType;\r\n });\r\n\r\n protected readonly iconTemplate = computed(() => {\r\n const template = this._globalIconTemplate();\r\n if (!template) {\r\n throw new NgnError(\r\n 'icon',\r\n 'No GlobalIconTemplate registered. Required when using [icon] with non-Iconify values or provideNgnCustomIcons() with [defaultIcon]. If using Iconify, pass an IconifyIcon data object (e.g., import tablerUser from \"@iconify/icons-tabler/user\").'\r\n );\r\n }\r\n return template;\r\n });\r\n\r\n constructor() {\r\n super();\r\n afterRenderEffect(() => {\r\n if (!this.icon() && !this.defaultIcon()) {\r\n throw new NgnError(\r\n 'icon',\r\n 'Icon component requires either an icon or a default icon to be set.'\r\n );\r\n }\r\n });\r\n }\r\n}\r\n","@if (iconSvg(); as svg) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'default'\" [innerHtml]=\"svg\"></div>\r\n} @else if (icon()) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n iconTemplate();\r\n context: {\r\n $implicit: {\r\n icon: icon(),\r\n },\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n} @else if (customDefaultIcon(); as customIcon) {\r\n <ng-container\r\n *ngTemplateOutlet=\"\r\n iconTemplate();\r\n context: {\r\n $implicit: {\r\n icon: customIcon,\r\n },\r\n }\r\n \"\r\n >\r\n </ng-container>\r\n} @else {\r\n @if (defaultIconSvg(); as defaultIcon) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'default'\" [innerHtml]=\"defaultIcon\"></div>\r\n }\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -8,37 +8,37 @@ import { templateTypesFn } from '@ngneers/controls/api/ng';
|
|
|
8
8
|
|
|
9
9
|
class InplaceTemplates extends NgnBase {
|
|
10
10
|
// Display template
|
|
11
|
-
_userDisplayTemplate = contentChild('display', ...(ngDevMode ? [{ debugName: "_userDisplayTemplate" }] : []));
|
|
11
|
+
_userDisplayTemplate = contentChild('display', ...(ngDevMode ? [{ debugName: "_userDisplayTemplate" }] : /* istanbul ignore next */ []));
|
|
12
12
|
/**
|
|
13
13
|
* Set a custom template for the display.
|
|
14
14
|
* Can also be set using an `<ng-template>` element with `#display` template reference variable.
|
|
15
15
|
*/
|
|
16
|
-
templateDisplay = input(null, ...(ngDevMode ? [{ debugName: "templateDisplay" }] : []));
|
|
17
|
-
displayTemplate = computed(() => this._userDisplayTemplate() ?? this.templateDisplay(), ...(ngDevMode ? [{ debugName: "displayTemplate" }] : []));
|
|
16
|
+
templateDisplay = input(null, ...(ngDevMode ? [{ debugName: "templateDisplay" }] : /* istanbul ignore next */ []));
|
|
17
|
+
displayTemplate = computed(() => this._userDisplayTemplate() ?? this.templateDisplay(), ...(ngDevMode ? [{ debugName: "displayTemplate" }] : /* istanbul ignore next */ []));
|
|
18
18
|
/**
|
|
19
19
|
* Context for the display template.
|
|
20
20
|
*/
|
|
21
|
-
templateDisplayContext = input(...(ngDevMode ? [undefined, { debugName: "templateDisplayContext" }] : []));
|
|
21
|
+
templateDisplayContext = input(...(ngDevMode ? [undefined, { debugName: "templateDisplayContext" }] : /* istanbul ignore next */ []));
|
|
22
22
|
// Content template
|
|
23
|
-
_userContentTemplate = contentChild('content', ...(ngDevMode ? [{ debugName: "_userContentTemplate" }] : []));
|
|
23
|
+
_userContentTemplate = contentChild('content', ...(ngDevMode ? [{ debugName: "_userContentTemplate" }] : /* istanbul ignore next */ []));
|
|
24
24
|
/**
|
|
25
25
|
* Set a custom template for the content.
|
|
26
26
|
* Can also be set using an `<ng-template>` element with `#content` template reference variable.
|
|
27
27
|
*/
|
|
28
|
-
templateContent = input(null, ...(ngDevMode ? [{ debugName: "templateContent" }] : []));
|
|
29
|
-
contentTemplate = computed(() => this._userContentTemplate() ?? this.templateContent(), ...(ngDevMode ? [{ debugName: "contentTemplate" }] : []));
|
|
28
|
+
templateContent = input(null, ...(ngDevMode ? [{ debugName: "templateContent" }] : /* istanbul ignore next */ []));
|
|
29
|
+
contentTemplate = computed(() => this._userContentTemplate() ?? this.templateContent(), ...(ngDevMode ? [{ debugName: "contentTemplate" }] : /* istanbul ignore next */ []));
|
|
30
30
|
/**
|
|
31
31
|
* Context for the content template.
|
|
32
32
|
*/
|
|
33
|
-
templateContentContext = input(...(ngDevMode ? [undefined, { debugName: "templateContentContext" }] : []));
|
|
33
|
+
templateContentContext = input(...(ngDevMode ? [undefined, { debugName: "templateContentContext" }] : /* istanbul ignore next */ []));
|
|
34
34
|
/**
|
|
35
35
|
* Types for the drawer templates.
|
|
36
36
|
*/
|
|
37
37
|
templateTypes = templateTypesFn();
|
|
38
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
39
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.
|
|
38
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: InplaceTemplates, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
39
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "17.2.0", version: "21.2.10", type: InplaceTemplates, isStandalone: true, inputs: { templateDisplay: { classPropertyName: "templateDisplay", publicName: "templateDisplay", isSignal: true, isRequired: false, transformFunction: null }, templateDisplayContext: { classPropertyName: "templateDisplayContext", publicName: "templateDisplayContext", isSignal: true, isRequired: false, transformFunction: null }, templateContent: { classPropertyName: "templateContent", publicName: "templateContent", isSignal: true, isRequired: false, transformFunction: null }, templateContentContext: { classPropertyName: "templateContentContext", publicName: "templateContentContext", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "_userDisplayTemplate", first: true, predicate: ["display"], descendants: true, isSignal: true }, { propertyName: "_userContentTemplate", first: true, predicate: ["content"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0 });
|
|
40
40
|
}
|
|
41
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
41
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: InplaceTemplates, decorators: [{
|
|
42
42
|
type: Directive
|
|
43
43
|
}], propDecorators: { _userDisplayTemplate: [{ type: i0.ContentChild, args: ['display', { isSignal: true }] }], templateDisplay: [{ type: i0.Input, args: [{ isSignal: true, alias: "templateDisplay", required: false }] }], templateDisplayContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "templateDisplayContext", required: false }] }], _userContentTemplate: [{ type: i0.ContentChild, args: ['content', { isSignal: true }] }], templateContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "templateContent", required: false }] }], templateContentContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "templateContentContext", required: false }] }] } });
|
|
44
44
|
|
|
@@ -54,22 +54,22 @@ class NgnInplace extends InplaceTemplates {
|
|
|
54
54
|
/**
|
|
55
55
|
* Controls the visibility of the content.
|
|
56
56
|
*/
|
|
57
|
-
contentVisible = model(false, ...(ngDevMode ? [{ debugName: "contentVisible" }] : []));
|
|
57
|
+
contentVisible = model(false, ...(ngDevMode ? [{ debugName: "contentVisible" }] : /* istanbul ignore next */ []));
|
|
58
58
|
/**
|
|
59
59
|
* Whether the content is loaded lazily.
|
|
60
60
|
* @default true
|
|
61
61
|
*/
|
|
62
|
-
lazy = input(true, { ...(ngDevMode ? { debugName: "lazy" } : {}), transform: booleanAttribute });
|
|
62
|
+
lazy = input(true, { ...(ngDevMode ? { debugName: "lazy" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
63
63
|
/**
|
|
64
64
|
* Whether the content is cached when closed.
|
|
65
65
|
* @default false
|
|
66
66
|
*/
|
|
67
|
-
cache = input(false, { ...(ngDevMode ? { debugName: "cache" } : {}), transform: booleanAttribute });
|
|
67
|
+
cache = input(false, { ...(ngDevMode ? { debugName: "cache" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
68
68
|
/**
|
|
69
69
|
* Explicitly apply disabled state styling
|
|
70
70
|
* @default false
|
|
71
71
|
*/
|
|
72
|
-
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
|
|
72
|
+
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
73
73
|
/**
|
|
74
74
|
* Switches to the content view.
|
|
75
75
|
*/
|
|
@@ -91,10 +91,10 @@ class NgnInplace extends InplaceTemplates {
|
|
|
91
91
|
toggle() {
|
|
92
92
|
this.contentVisible.update(v => !v);
|
|
93
93
|
}
|
|
94
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
95
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
94
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnInplace, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
95
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: NgnInplace, isStandalone: true, selector: "ngn-inplace", inputs: { contentVisible: { classPropertyName: "contentVisible", publicName: "contentVisible", isSignal: true, isRequired: false, transformFunction: null }, lazy: { classPropertyName: "lazy", publicName: "lazy", isSignal: true, isRequired: false, transformFunction: null }, cache: { classPropertyName: "cache", publicName: "cache", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { contentVisible: "contentVisibleChange" }, providers: [provideSelf(NgnInplace)], usesInheritance: true, ngImport: i0, template: "@if (contentVisible()) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'content'\">\r\n <ngn-defer\r\n [open]=\"contentVisible()\"\r\n [lazyContent]=\"contentTemplate()\"\r\n [lazyContentContext]=\"templateContentContext() ?? { $implicit: { close: closeContent } }\"\r\n [lazy]=\"lazy()\"\r\n [cache]=\"cache()\"\r\n />\r\n </div>\r\n} @else {\r\n <button [ptInt]=\"this\" [ptClass]=\"'display'\" role=\"button\" (click)=\"switchToContent()\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"displayTemplate()\"\r\n [ngTemplateOutletContext]=\"templateDisplayContext()\"\r\n />\r\n </button>\r\n}\r\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: NgnDefer, selector: "ngn-defer", inputs: ["lazyContent", "lazyContentContext", "open", "lazy", "cache", "hiddenOnClosed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
96
96
|
}
|
|
97
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
97
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnInplace, decorators: [{
|
|
98
98
|
type: Component,
|
|
99
99
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'ngn-inplace', imports: [NgnPt, NgTemplateOutlet, NgnDefer], providers: [provideSelf(NgnInplace)], template: "@if (contentVisible()) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'content'\">\r\n <ngn-defer\r\n [open]=\"contentVisible()\"\r\n [lazyContent]=\"contentTemplate()\"\r\n [lazyContentContext]=\"templateContentContext() ?? { $implicit: { close: closeContent } }\"\r\n [lazy]=\"lazy()\"\r\n [cache]=\"cache()\"\r\n />\r\n </div>\r\n} @else {\r\n <button [ptInt]=\"this\" [ptClass]=\"'display'\" role=\"button\" (click)=\"switchToContent()\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"displayTemplate()\"\r\n [ngTemplateOutletContext]=\"templateDisplayContext()\"\r\n />\r\n </button>\r\n}\r\n" }]
|
|
100
100
|
}], propDecorators: { contentVisible: [{ type: i0.Input, args: [{ isSignal: true, alias: "contentVisible", required: false }] }, { type: i0.Output, args: ["contentVisibleChange"] }], lazy: [{ type: i0.Input, args: [{ isSignal: true, alias: "lazy", required: false }] }], cache: [{ type: i0.Input, args: [{ isSignal: true, alias: "cache", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ngneers-controls-inplace.mjs","sources":["../../src/inplace/inplace-templates.ts","../../src/inplace/inplace.ts","../../src/inplace/inplace.html","../../src/inplace/ngneers-controls-inplace.ts"],"sourcesContent":["import { computed, contentChild, Directive, input, TemplateRef } from '@angular/core';\r\nimport { templateTypesFn } from '@ngneers/controls/api/ng';\r\nimport { NgnBase } from '@ngneers/controls/base';\r\n\r\nimport type { ContentTemplateType } from './types';\r\n\r\n@Directive()\r\nexport abstract class InplaceTemplates extends NgnBase<'inplace'> {\r\n // Display template\r\n private readonly _userDisplayTemplate = contentChild<TemplateRef<unknown>>('display');\r\n /**\r\n * Set a custom template for the display.\r\n * Can also be set using an `<ng-template>` element with `#display` template reference variable.\r\n */\r\n public readonly templateDisplay = input<TemplateRef<unknown> | null>(null);\r\n protected readonly displayTemplate = computed(\r\n () => this._userDisplayTemplate() ?? this.templateDisplay()\r\n );\r\n /**\r\n * Context for the display template.\r\n */\r\n public readonly templateDisplayContext = input<unknown>();\r\n\r\n // Content template\r\n private readonly _userContentTemplate =\r\n contentChild<TemplateRef<typeof this.templateTypes.content>>('content');\r\n /**\r\n * Set a custom template for the content.\r\n * Can also be set using an `<ng-template>` element with `#content` template reference variable.\r\n */\r\n public readonly templateContent = input<TemplateRef<typeof this.templateTypes.content> | null>(\r\n null\r\n );\r\n protected readonly contentTemplate = computed(\r\n () => this._userContentTemplate() ?? this.templateContent()\r\n );\r\n /**\r\n * Context for the content template.\r\n */\r\n public readonly templateContentContext = input<unknown>();\r\n\r\n /**\r\n * Types for the drawer templates.\r\n */\r\n public readonly templateTypes = templateTypesFn<{\r\n /**\r\n * Type of the template variable for the display template.\r\n */\r\n content: ContentTemplateType;\r\n }>();\r\n}\r\n","import { NgTemplateOutlet } from '@angular/common';\r\nimport { booleanAttribute, Component, input, model, ChangeDetectionStrategy } from '@angular/core';\r\nimport { NgnPt, provideSelf } from '@ngneers/controls/base';\r\nimport { NgnDefer } from '@ngneers/controls/defer';\r\nimport { inplaceControlTemplate } from '@ngneers/controls-themes/templates/inplace';\r\n\r\nimport { InplaceTemplates } from './inplace-templates';\r\n\r\n/**\r\n * @category control\r\n */\r\n@Component({\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n selector: 'ngn-inplace',\r\n templateUrl: './inplace.html',\r\n imports: [NgnPt, NgTemplateOutlet, NgnDefer],\r\n providers: [provideSelf(NgnInplace)],\r\n})\r\nexport class NgnInplace extends InplaceTemplates {\r\n protected readonly theme = this.injectThemeTemplate(inplaceControlTemplate, {\r\n root: true,\r\n disabled: () => this.disabled(),\r\n });\r\n\r\n protected readonly closeContent = this.switchToDisplay.bind(this);\r\n\r\n /**\r\n * Controls the visibility of the content.\r\n */\r\n public readonly contentVisible = model<boolean>(false);\r\n /**\r\n * Whether the content is loaded lazily.\r\n * @default true\r\n */\r\n public readonly lazy = input(true, { transform: booleanAttribute });\r\n /**\r\n * Whether the content is cached when closed.\r\n * @default false\r\n */\r\n public readonly cache = input(false, { transform: booleanAttribute });\r\n /**\r\n * Explicitly apply disabled state styling\r\n * @default false\r\n */\r\n public readonly disabled = input(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Switches to the content view.\r\n */\r\n public switchToContent() {\r\n if (this.disabled()) {\r\n return;\r\n }\r\n this.contentVisible.set(true);\r\n }\r\n\r\n /**\r\n * Switches to the display view.\r\n */\r\n public switchToDisplay() {\r\n this.contentVisible.set(false);\r\n }\r\n\r\n /**\r\n * Toggles between the display and content views.\r\n */\r\n public toggle() {\r\n this.contentVisible.update(v => !v);\r\n }\r\n}\r\n","@if (contentVisible()) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'content'\">\r\n <ngn-defer\r\n [open]=\"contentVisible()\"\r\n [lazyContent]=\"contentTemplate()\"\r\n [lazyContentContext]=\"templateContentContext() ?? { $implicit: { close: closeContent } }\"\r\n [lazy]=\"lazy()\"\r\n [cache]=\"cache()\"\r\n />\r\n </div>\r\n} @else {\r\n <button [ptInt]=\"this\" [ptClass]=\"'display'\" role=\"button\" (click)=\"switchToContent()\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"displayTemplate()\"\r\n [ngTemplateOutletContext]=\"templateDisplayContext()\"\r\n />\r\n </button>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":";;;;;;;;AAOM,MAAgB,gBAAiB,SAAQ,OAAkB,CAAA;;AAE9C,IAAA,oBAAoB,GAAG,YAAY,CAAuB,SAAS,
|
|
1
|
+
{"version":3,"file":"ngneers-controls-inplace.mjs","sources":["../../src/inplace/inplace-templates.ts","../../src/inplace/inplace.ts","../../src/inplace/inplace.html","../../src/inplace/ngneers-controls-inplace.ts"],"sourcesContent":["import { computed, contentChild, Directive, input, TemplateRef } from '@angular/core';\r\nimport { templateTypesFn } from '@ngneers/controls/api/ng';\r\nimport { NgnBase } from '@ngneers/controls/base';\r\n\r\nimport type { ContentTemplateType } from './types';\r\n\r\n@Directive()\r\nexport abstract class InplaceTemplates extends NgnBase<'inplace'> {\r\n // Display template\r\n private readonly _userDisplayTemplate = contentChild<TemplateRef<unknown>>('display');\r\n /**\r\n * Set a custom template for the display.\r\n * Can also be set using an `<ng-template>` element with `#display` template reference variable.\r\n */\r\n public readonly templateDisplay = input<TemplateRef<unknown> | null>(null);\r\n protected readonly displayTemplate = computed(\r\n () => this._userDisplayTemplate() ?? this.templateDisplay()\r\n );\r\n /**\r\n * Context for the display template.\r\n */\r\n public readonly templateDisplayContext = input<unknown>();\r\n\r\n // Content template\r\n private readonly _userContentTemplate =\r\n contentChild<TemplateRef<typeof this.templateTypes.content>>('content');\r\n /**\r\n * Set a custom template for the content.\r\n * Can also be set using an `<ng-template>` element with `#content` template reference variable.\r\n */\r\n public readonly templateContent = input<TemplateRef<typeof this.templateTypes.content> | null>(\r\n null\r\n );\r\n protected readonly contentTemplate = computed(\r\n () => this._userContentTemplate() ?? this.templateContent()\r\n );\r\n /**\r\n * Context for the content template.\r\n */\r\n public readonly templateContentContext = input<unknown>();\r\n\r\n /**\r\n * Types for the drawer templates.\r\n */\r\n public readonly templateTypes = templateTypesFn<{\r\n /**\r\n * Type of the template variable for the display template.\r\n */\r\n content: ContentTemplateType;\r\n }>();\r\n}\r\n","import { NgTemplateOutlet } from '@angular/common';\r\nimport { booleanAttribute, Component, input, model, ChangeDetectionStrategy } from '@angular/core';\r\nimport { NgnPt, provideSelf } from '@ngneers/controls/base';\r\nimport { NgnDefer } from '@ngneers/controls/defer';\r\nimport { inplaceControlTemplate } from '@ngneers/controls-themes/templates/inplace';\r\n\r\nimport { InplaceTemplates } from './inplace-templates';\r\n\r\n/**\r\n * @category control\r\n */\r\n@Component({\r\n changeDetection: ChangeDetectionStrategy.OnPush,\r\n selector: 'ngn-inplace',\r\n templateUrl: './inplace.html',\r\n imports: [NgnPt, NgTemplateOutlet, NgnDefer],\r\n providers: [provideSelf(NgnInplace)],\r\n})\r\nexport class NgnInplace extends InplaceTemplates {\r\n protected readonly theme = this.injectThemeTemplate(inplaceControlTemplate, {\r\n root: true,\r\n disabled: () => this.disabled(),\r\n });\r\n\r\n protected readonly closeContent = this.switchToDisplay.bind(this);\r\n\r\n /**\r\n * Controls the visibility of the content.\r\n */\r\n public readonly contentVisible = model<boolean>(false);\r\n /**\r\n * Whether the content is loaded lazily.\r\n * @default true\r\n */\r\n public readonly lazy = input(true, { transform: booleanAttribute });\r\n /**\r\n * Whether the content is cached when closed.\r\n * @default false\r\n */\r\n public readonly cache = input(false, { transform: booleanAttribute });\r\n /**\r\n * Explicitly apply disabled state styling\r\n * @default false\r\n */\r\n public readonly disabled = input(false, { transform: booleanAttribute });\r\n\r\n /**\r\n * Switches to the content view.\r\n */\r\n public switchToContent() {\r\n if (this.disabled()) {\r\n return;\r\n }\r\n this.contentVisible.set(true);\r\n }\r\n\r\n /**\r\n * Switches to the display view.\r\n */\r\n public switchToDisplay() {\r\n this.contentVisible.set(false);\r\n }\r\n\r\n /**\r\n * Toggles between the display and content views.\r\n */\r\n public toggle() {\r\n this.contentVisible.update(v => !v);\r\n }\r\n}\r\n","@if (contentVisible()) {\r\n <div [ptInt]=\"this\" [ptClass]=\"'content'\">\r\n <ngn-defer\r\n [open]=\"contentVisible()\"\r\n [lazyContent]=\"contentTemplate()\"\r\n [lazyContentContext]=\"templateContentContext() ?? { $implicit: { close: closeContent } }\"\r\n [lazy]=\"lazy()\"\r\n [cache]=\"cache()\"\r\n />\r\n </div>\r\n} @else {\r\n <button [ptInt]=\"this\" [ptClass]=\"'display'\" role=\"button\" (click)=\"switchToContent()\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"displayTemplate()\"\r\n [ngTemplateOutletContext]=\"templateDisplayContext()\"\r\n />\r\n </button>\r\n}\r\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -22,53 +22,53 @@ class NgnInputField extends NgnBase {
|
|
|
22
22
|
* Label for the input field
|
|
23
23
|
* @default null
|
|
24
24
|
*/
|
|
25
|
-
label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : []));
|
|
25
|
+
label = input(null, ...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
26
26
|
/**
|
|
27
27
|
* Sets the `aria-labelledby` attribute on the input element
|
|
28
28
|
* @default null
|
|
29
29
|
*/
|
|
30
|
-
labelledBy = input(null, ...(ngDevMode ? [{ debugName: "labelledBy" }] : []));
|
|
30
|
+
labelledBy = input(null, ...(ngDevMode ? [{ debugName: "labelledBy" }] : /* istanbul ignore next */ []));
|
|
31
31
|
/**
|
|
32
32
|
* The kind of label presentation
|
|
33
33
|
* @todo add link to custom kind documentation subsection label
|
|
34
34
|
* @default undefined
|
|
35
35
|
*/
|
|
36
|
-
labelKind = input(undefined, ...(ngDevMode ? [{ debugName: "labelKind" }] : []));
|
|
36
|
+
labelKind = input(undefined, ...(ngDevMode ? [{ debugName: "labelKind" }] : /* istanbul ignore next */ []));
|
|
37
37
|
/**
|
|
38
38
|
* ID for the input element
|
|
39
39
|
*/
|
|
40
|
-
inputId = input(generateElementId(), ...(ngDevMode ? [{ debugName: "inputId" }] : []));
|
|
40
|
+
inputId = input(generateElementId(), ...(ngDevMode ? [{ debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
41
41
|
/**
|
|
42
42
|
* Show clear button
|
|
43
43
|
* @default false
|
|
44
44
|
*/
|
|
45
|
-
showClearButton = input(false, { ...(ngDevMode ? { debugName: "showClearButton" } : {}), transform: booleanAttribute });
|
|
45
|
+
showClearButton = input(false, { ...(ngDevMode ? { debugName: "showClearButton" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
46
46
|
/**
|
|
47
47
|
* Custom icon for the clear button. Use with `showClearButton`.
|
|
48
48
|
*/
|
|
49
|
-
iconClearButton = input(...(ngDevMode ? [undefined, { debugName: "iconClearButton" }] : []));
|
|
49
|
+
iconClearButton = input(...(ngDevMode ? [undefined, { debugName: "iconClearButton" }] : /* istanbul ignore next */ []));
|
|
50
50
|
/**
|
|
51
51
|
* Tabindex for the input field itself.
|
|
52
52
|
* When another focusable (input) element is present inside the input field, this should be set to -1.
|
|
53
53
|
* @default -1
|
|
54
54
|
*/
|
|
55
|
-
tabindex = input(-1, ...(ngDevMode ? [{ debugName: "tabindex" }] : []));
|
|
55
|
+
tabindex = input(-1, ...(ngDevMode ? [{ debugName: "tabindex" }] : /* istanbul ignore next */ []));
|
|
56
56
|
/**
|
|
57
57
|
* Explicitly apply invalid state styling
|
|
58
58
|
* @default false
|
|
59
59
|
*/
|
|
60
|
-
invalid = input(false, { ...(ngDevMode ? { debugName: "invalid" } : {}), transform: booleanAttribute });
|
|
60
|
+
invalid = input(false, { ...(ngDevMode ? { debugName: "invalid" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
61
61
|
/**
|
|
62
62
|
* Explicitly apply readonly state styling
|
|
63
63
|
* @default false
|
|
64
64
|
*/
|
|
65
|
-
readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : {}), transform: booleanAttribute });
|
|
65
|
+
readonly = input(false, { ...(ngDevMode ? { debugName: "readonly" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
66
66
|
/**
|
|
67
67
|
* Explicitly apply disabled state styling
|
|
68
68
|
* @default false
|
|
69
69
|
*/
|
|
70
|
-
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : {}), transform: booleanAttribute });
|
|
71
|
-
_ngnInput = contentChild(NgnInput, ...(ngDevMode ? [{ debugName: "_ngnInput" }] : []));
|
|
70
|
+
disabled = input(false, { ...(ngDevMode ? { debugName: "disabled" } : /* istanbul ignore next */ {}), transform: booleanAttribute });
|
|
71
|
+
_ngnInput = contentChild(NgnInput, ...(ngDevMode ? [{ debugName: "_ngnInput" }] : /* istanbul ignore next */ []));
|
|
72
72
|
constructor() {
|
|
73
73
|
super();
|
|
74
74
|
this.initializeAutoThemeClasses('labelKind', this.labelKind);
|
|
@@ -111,16 +111,16 @@ class NgnInputField extends NgnBase {
|
|
|
111
111
|
inputElement.focus();
|
|
112
112
|
}
|
|
113
113
|
}
|
|
114
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.
|
|
115
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.
|
|
114
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnInputField, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
115
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.10", type: NgnInputField, isStandalone: true, selector: "ngn-input-field", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, labelledBy: { classPropertyName: "labelledBy", publicName: "labelledBy", isSignal: true, isRequired: false, transformFunction: null }, labelKind: { classPropertyName: "labelKind", publicName: "labelKind", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, showClearButton: { classPropertyName: "showClearButton", publicName: "showClearButton", isSignal: true, isRequired: false, transformFunction: null }, iconClearButton: { classPropertyName: "iconClearButton", publicName: "iconClearButton", isSignal: true, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, readonly: { classPropertyName: "readonly", publicName: "readonly", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "inert": "disabled()" } }, providers: [
|
|
116
116
|
{
|
|
117
117
|
provide: INPUT_FIELD,
|
|
118
118
|
useExisting: forwardRef(() => NgnInputField),
|
|
119
119
|
},
|
|
120
120
|
provideSelf(NgnInputField),
|
|
121
|
-
], queries: [{ propertyName: "_ngnInput", first: true, predicate: NgnInput, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (label(); as label) {\r\n <label [ptInt]=\"this\" [ptClass]=\"'label'\" [for]=\"inputId()\">{{ label }}</label>\r\n}\r\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events -->\r\n<div\r\n [ptInt]=\"this\"\r\n [ptClass]=\"{\r\n root: !hasParentInputfield,\r\n invalid: invalid(),\r\n readonly: readonly(),\r\n disabled: disabled(),\r\n }\"\r\n (click)=\"clicked($event)\"\r\n [tabindex]=\"tabindex()\"\r\n>\r\n <ng-content select=\"input, textarea\" />\r\n @if (showClearButton()) {\r\n <button\r\n tabindex=\"-1\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'clear-button'\"\r\n ngnButton\r\n type=\"button\"\r\n [kind]=\"'icon'\"\r\n inline\r\n (click)=\"clearButtonClicked($event)\"\r\n [attr.aria-label]=\"i18n['inputField_clearInput']()\"\r\n >\r\n <ngn-icon defaultIcon=\"
|
|
121
|
+
], queries: [{ propertyName: "_ngnInput", first: true, predicate: NgnInput, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@if (label(); as label) {\r\n <label [ptInt]=\"this\" [ptClass]=\"'label'\" [for]=\"inputId()\">{{ label }}</label>\r\n}\r\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events -->\r\n<div\r\n [ptInt]=\"this\"\r\n [ptClass]=\"{\r\n root: !hasParentInputfield,\r\n invalid: invalid(),\r\n readonly: readonly(),\r\n disabled: disabled(),\r\n }\"\r\n (click)=\"clicked($event)\"\r\n [tabindex]=\"tabindex()\"\r\n>\r\n <ng-content select=\"input, textarea\" />\r\n @if (showClearButton()) {\r\n <button\r\n tabindex=\"-1\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'clear-button'\"\r\n ngnButton\r\n type=\"button\"\r\n [kind]=\"'icon'\"\r\n inline\r\n (click)=\"clearButtonClicked($event)\"\r\n [attr.aria-label]=\"i18n['inputField_clearInput']()\"\r\n >\r\n <ngn-icon defaultIcon=\"input-clear\" [icon]=\"iconClearButton()\" />\r\n </button>\r\n }\r\n <ng-content />\r\n</div>\r\n", dependencies: [{ kind: "directive", type: NgnPt, selector: "[ptInt]", inputs: ["ptInt", "ptClass"] }, { kind: "component", type: NgnIcon, selector: "ngn-icon", inputs: ["defaultIcon", "icon"] }, { kind: "directive", type: NgnButton, selector: "button[ngnButton], a[ngnButton]", inputs: ["inline"], exportAs: ["ngnButton"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
122
122
|
}
|
|
123
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.
|
|
123
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.10", ngImport: i0, type: NgnInputField, decorators: [{
|
|
124
124
|
type: Component,
|
|
125
125
|
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgnPt, NgnIcon, NgnButton], selector: 'ngn-input-field', host: {
|
|
126
126
|
'[inert]': 'disabled()',
|
|
@@ -130,7 +130,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
130
130
|
useExisting: forwardRef(() => NgnInputField),
|
|
131
131
|
},
|
|
132
132
|
provideSelf(NgnInputField),
|
|
133
|
-
], template: "@if (label(); as label) {\r\n <label [ptInt]=\"this\" [ptClass]=\"'label'\" [for]=\"inputId()\">{{ label }}</label>\r\n}\r\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events -->\r\n<div\r\n [ptInt]=\"this\"\r\n [ptClass]=\"{\r\n root: !hasParentInputfield,\r\n invalid: invalid(),\r\n readonly: readonly(),\r\n disabled: disabled(),\r\n }\"\r\n (click)=\"clicked($event)\"\r\n [tabindex]=\"tabindex()\"\r\n>\r\n <ng-content select=\"input, textarea\" />\r\n @if (showClearButton()) {\r\n <button\r\n tabindex=\"-1\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'clear-button'\"\r\n ngnButton\r\n type=\"button\"\r\n [kind]=\"'icon'\"\r\n inline\r\n (click)=\"clearButtonClicked($event)\"\r\n [attr.aria-label]=\"i18n['inputField_clearInput']()\"\r\n >\r\n <ngn-icon defaultIcon=\"
|
|
133
|
+
], template: "@if (label(); as label) {\r\n <label [ptInt]=\"this\" [ptClass]=\"'label'\" [for]=\"inputId()\">{{ label }}</label>\r\n}\r\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events -->\r\n<div\r\n [ptInt]=\"this\"\r\n [ptClass]=\"{\r\n root: !hasParentInputfield,\r\n invalid: invalid(),\r\n readonly: readonly(),\r\n disabled: disabled(),\r\n }\"\r\n (click)=\"clicked($event)\"\r\n [tabindex]=\"tabindex()\"\r\n>\r\n <ng-content select=\"input, textarea\" />\r\n @if (showClearButton()) {\r\n <button\r\n tabindex=\"-1\"\r\n [ptInt]=\"this\"\r\n [ptClass]=\"'clear-button'\"\r\n ngnButton\r\n type=\"button\"\r\n [kind]=\"'icon'\"\r\n inline\r\n (click)=\"clearButtonClicked($event)\"\r\n [attr.aria-label]=\"i18n['inputField_clearInput']()\"\r\n >\r\n <ngn-icon defaultIcon=\"input-clear\" [icon]=\"iconClearButton()\" />\r\n </button>\r\n }\r\n <ng-content />\r\n</div>\r\n" }]
|
|
134
134
|
}], ctorParameters: () => [], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], labelledBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelledBy", required: false }] }], labelKind: [{ type: i0.Input, args: [{ isSignal: true, alias: "labelKind", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], showClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "showClearButton", required: false }] }], iconClearButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconClearButton", required: false }] }], tabindex: [{ type: i0.Input, args: [{ isSignal: true, alias: "tabindex", required: false }] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], readonly: [{ type: i0.Input, args: [{ isSignal: true, alias: "readonly", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], _ngnInput: [{ type: i0.ContentChild, args: [i0.forwardRef(() => NgnInput), { isSignal: true }] }] } });
|
|
135
135
|
|
|
136
136
|
/**
|