@elderbyte/ngx-starter 20.4.6 → 20.4.8
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.
|
@@ -2036,54 +2036,54 @@ class PhoneFormatService {
|
|
|
2036
2036
|
* Public API *
|
|
2037
2037
|
* *
|
|
2038
2038
|
**************************************************************************/
|
|
2039
|
-
formatPhoneNumber(
|
|
2040
|
-
if (!config
|
|
2041
|
-
return
|
|
2042
|
-
}
|
|
2043
|
-
else {
|
|
2044
|
-
return this.applyFormattingPerConfig(number, config);
|
|
2039
|
+
formatPhoneNumber(nr, config) {
|
|
2040
|
+
if (!config?.countryCode) {
|
|
2041
|
+
return nr;
|
|
2045
2042
|
}
|
|
2043
|
+
const phoneNrBody = this.preparePhoneNumberBody(nr, config);
|
|
2044
|
+
const transformedBody = this.applyRegexTransform(phoneNrBody, config);
|
|
2045
|
+
return this.addPrefix(transformedBody, config);
|
|
2046
2046
|
}
|
|
2047
2047
|
/***************************************************************************
|
|
2048
2048
|
* *
|
|
2049
2049
|
* Private Methods *
|
|
2050
2050
|
* *
|
|
2051
2051
|
**************************************************************************/
|
|
2052
|
-
|
|
2053
|
-
let
|
|
2054
|
-
if (config.
|
|
2055
|
-
|
|
2056
|
-
|
|
2052
|
+
addPrefix(body, config) {
|
|
2053
|
+
let prefix = '';
|
|
2054
|
+
if (config.customPrefix !== undefined && config.customPrefix !== null) {
|
|
2055
|
+
prefix = config.customPrefix;
|
|
2056
|
+
}
|
|
2057
|
+
else {
|
|
2058
|
+
prefix = config.countryCode + ' ';
|
|
2057
2059
|
}
|
|
2058
|
-
|
|
2059
|
-
return `${prefix}${phoneNrBody}`;
|
|
2060
|
+
return `${prefix}${body}`;
|
|
2060
2061
|
}
|
|
2061
2062
|
preparePhoneNumberBody(number, config) {
|
|
2062
2063
|
const clean = this.cleanNumberString(number);
|
|
2063
|
-
const withoutDialingCode = this.removeDialingCode(clean, config.
|
|
2064
|
-
|
|
2064
|
+
const withoutDialingCode = this.removeDialingCode(clean, config.countryCode);
|
|
2065
|
+
const withoutLeadingZeros = withoutDialingCode.replace(/^0+/, '');
|
|
2066
|
+
return withoutLeadingZeros;
|
|
2065
2067
|
}
|
|
2066
2068
|
cleanNumberString(number) {
|
|
2067
|
-
|
|
2068
|
-
return number.replace(regex, '');
|
|
2069
|
-
}
|
|
2070
|
-
handleWithoutConfig(number, countryCode) {
|
|
2071
|
-
if (!countryCode) {
|
|
2072
|
-
return number;
|
|
2073
|
-
}
|
|
2074
|
-
else {
|
|
2075
|
-
return countryCode + ' ' + number;
|
|
2076
|
-
}
|
|
2069
|
+
return number.replace(/[^0-9+]/g, '');
|
|
2077
2070
|
}
|
|
2078
|
-
removeDialingCode(phoneNr,
|
|
2079
|
-
const dialingCodeWithDoubleZero =
|
|
2080
|
-
for (const prefix of [
|
|
2071
|
+
removeDialingCode(phoneNr, countryCode) {
|
|
2072
|
+
const dialingCodeWithDoubleZero = countryCode.replace('+', '00');
|
|
2073
|
+
for (const prefix of [countryCode, dialingCodeWithDoubleZero]) {
|
|
2081
2074
|
if (phoneNr.startsWith(prefix)) {
|
|
2082
2075
|
return phoneNr.slice(prefix.length);
|
|
2083
2076
|
}
|
|
2084
2077
|
}
|
|
2085
2078
|
return phoneNr;
|
|
2086
2079
|
}
|
|
2080
|
+
applyRegexTransform(phoneNrBody, config) {
|
|
2081
|
+
if (!config?.bodyFormat) {
|
|
2082
|
+
return phoneNrBody;
|
|
2083
|
+
}
|
|
2084
|
+
const [regex, format] = config.bodyFormat;
|
|
2085
|
+
return phoneNrBody.replace(regex, format);
|
|
2086
|
+
}
|
|
2087
2087
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PhoneFormatService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
2088
2088
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PhoneFormatService, providedIn: 'root' }); }
|
|
2089
2089
|
}
|
|
@@ -2099,48 +2099,59 @@ class CountryPhoneFormatService {
|
|
|
2099
2099
|
this.countryPhoneFormats = {
|
|
2100
2100
|
'+41': {
|
|
2101
2101
|
country: 'CH',
|
|
2102
|
-
|
|
2103
|
-
bodyFormat: [/^(\d{2})(\d{3})(\d{2})(\d{2})$/, '$1 $2 $3 $4'],
|
|
2104
|
-
customPrefix: '0',
|
|
2105
|
-
},
|
|
2106
|
-
'0041': {
|
|
2107
|
-
country: 'CH',
|
|
2108
|
-
dialingCode: '+41',
|
|
2102
|
+
countryCode: '+41',
|
|
2109
2103
|
bodyFormat: [/^(\d{2})(\d{3})(\d{2})(\d{2})$/, '$1 $2 $3 $4'],
|
|
2110
2104
|
customPrefix: '0',
|
|
2111
2105
|
},
|
|
2112
2106
|
'+423': {
|
|
2113
2107
|
country: 'LI',
|
|
2114
|
-
|
|
2108
|
+
countryCode: '+423',
|
|
2115
2109
|
bodyFormat: [/^(\d{3})(\d{4})$/, '$1 $2'],
|
|
2116
2110
|
},
|
|
2117
2111
|
'+49': {
|
|
2118
2112
|
country: 'DE',
|
|
2119
|
-
|
|
2113
|
+
countryCode: '+49',
|
|
2120
2114
|
},
|
|
2121
2115
|
'+43': {
|
|
2122
2116
|
country: 'AT',
|
|
2123
|
-
|
|
2117
|
+
countryCode: '+43',
|
|
2124
2118
|
},
|
|
2125
2119
|
'+33': {
|
|
2126
2120
|
country: 'FR',
|
|
2127
|
-
|
|
2121
|
+
countryCode: '+33',
|
|
2128
2122
|
},
|
|
2129
2123
|
'+44': {
|
|
2130
2124
|
country: 'GB',
|
|
2131
|
-
|
|
2125
|
+
countryCode: '+44',
|
|
2132
2126
|
},
|
|
2133
2127
|
'+1': {
|
|
2134
2128
|
country: 'US',
|
|
2135
|
-
|
|
2129
|
+
countryCode: '+1',
|
|
2136
2130
|
},
|
|
2137
2131
|
};
|
|
2138
2132
|
}
|
|
2139
|
-
|
|
2140
|
-
|
|
2133
|
+
/***************************************************************************
|
|
2134
|
+
* *
|
|
2135
|
+
* Public API *
|
|
2136
|
+
* *
|
|
2137
|
+
**************************************************************************/
|
|
2138
|
+
getCountryPhoneFormat(countryCode) {
|
|
2139
|
+
if (!countryCode) {
|
|
2140
|
+
return null;
|
|
2141
|
+
}
|
|
2142
|
+
const cleanedCode = countryCode.replace(/^00/, '+');
|
|
2143
|
+
if (this.countryPhoneFormats[cleanedCode]) {
|
|
2144
|
+
return this.countryPhoneFormats[cleanedCode];
|
|
2145
|
+
}
|
|
2146
|
+
return {
|
|
2147
|
+
country: null,
|
|
2148
|
+
countryCode: cleanedCode,
|
|
2149
|
+
bodyFormat: null,
|
|
2150
|
+
};
|
|
2141
2151
|
}
|
|
2142
|
-
getCountry(
|
|
2143
|
-
|
|
2152
|
+
getCountry(countryCode) {
|
|
2153
|
+
const countryFormat = this.countryPhoneFormats[countryCode];
|
|
2154
|
+
return countryFormat?.country || null;
|
|
2144
2155
|
}
|
|
2145
2156
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: CountryPhoneFormatService, deps: [], target: i0.ɵɵFactoryTarget.Injectable }); }
|
|
2146
2157
|
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: CountryPhoneFormatService, providedIn: 'root' }); }
|
|
@@ -2159,7 +2170,7 @@ class PhonePipe {
|
|
|
2159
2170
|
}
|
|
2160
2171
|
transform(phoneNumber) {
|
|
2161
2172
|
const countryPhoneFormat = this.countryPhoneFormats.getCountryPhoneFormat(phoneNumber.countryCode);
|
|
2162
|
-
return this.phoneFormat.formatPhoneNumber(phoneNumber.number,
|
|
2173
|
+
return this.phoneFormat.formatPhoneNumber(phoneNumber.number, countryPhoneFormat);
|
|
2163
2174
|
}
|
|
2164
2175
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: PhonePipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
2165
2176
|
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "20.1.3", ngImport: i0, type: PhonePipe, isStandalone: true, name: "phone" }); }
|
|
@@ -10635,11 +10646,11 @@ class ElderExpandToggleButtonComponent {
|
|
|
10635
10646
|
this.expanded = !this.expanded;
|
|
10636
10647
|
}
|
|
10637
10648
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderExpandToggleButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10638
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: ElderExpandToggleButtonComponent, isStandalone: true, selector: "elder-expand-toggle-button", inputs: { expanded: "expanded" }, outputs: { expandedChange: "expandedChange" }, ngImport: i0, template: "<a\n matRipple\n class=\"layout-row place-start-center full toggle-button\"\n (click)=\"onToggleExpand($event)\"\n>\n <div class=\"layout-row place-start-center flex\">\n <ng-content></ng-content>\n\n <span class=\"flex\"></span>\n\n <div class=\"layout-col place-center-center\">\n <mat-icon>{{\n (expandedChange | async) ? 'keyboard_arrow_up' : 'keyboard_arrow_down'\n }}</mat-icon>\n </div>\n </div>\n</a>\n", styles: [".toggle-button{text-decoration:none;padding-left:16px;padding-right:16px;min-height:48px;border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s}.toggle-button:hover{background-color:var(--md-sys-color-ternary-fixed);cursor:pointer}\n"], dependencies: [{ kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
10649
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: ElderExpandToggleButtonComponent, isStandalone: true, selector: "elder-expand-toggle-button", inputs: { expanded: "expanded" }, outputs: { expandedChange: "expandedChange" }, ngImport: i0, template: "<a\n matRipple\n class=\"layout-row place-start-center full toggle-button\"\n (click)=\"onToggleExpand($event)\"\n tabindex=\"0\"\n>\n <div class=\"layout-row place-start-center flex\">\n <ng-content></ng-content>\n\n <span class=\"flex\"></span>\n\n <div class=\"layout-col place-center-center\">\n <mat-icon>{{\n (expandedChange | async) ? 'keyboard_arrow_up' : 'keyboard_arrow_down'\n }}</mat-icon>\n </div>\n </div>\n</a>\n", styles: [".toggle-button{text-decoration:none;padding-left:16px;padding-right:16px;min-height:48px;border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s}.toggle-button:hover{background-color:var(--md-sys-color-ternary-fixed);cursor:pointer}\n"], dependencies: [{ kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "pipe", type: AsyncPipe, name: "async" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
10639
10650
|
}
|
|
10640
10651
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderExpandToggleButtonComponent, decorators: [{
|
|
10641
10652
|
type: Component,
|
|
10642
|
-
args: [{ selector: 'elder-expand-toggle-button', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatRipple, MatIcon, AsyncPipe], template: "<a\n matRipple\n class=\"layout-row place-start-center full toggle-button\"\n (click)=\"onToggleExpand($event)\"\n>\n <div class=\"layout-row place-start-center flex\">\n <ng-content></ng-content>\n\n <span class=\"flex\"></span>\n\n <div class=\"layout-col place-center-center\">\n <mat-icon>{{\n (expandedChange | async) ? 'keyboard_arrow_up' : 'keyboard_arrow_down'\n }}</mat-icon>\n </div>\n </div>\n</a>\n", styles: [".toggle-button{text-decoration:none;padding-left:16px;padding-right:16px;min-height:48px;border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s}.toggle-button:hover{background-color:var(--md-sys-color-ternary-fixed);cursor:pointer}\n"] }]
|
|
10653
|
+
args: [{ selector: 'elder-expand-toggle-button', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatRipple, MatIcon, AsyncPipe], template: "<a\n matRipple\n class=\"layout-row place-start-center full toggle-button\"\n (click)=\"onToggleExpand($event)\"\n tabindex=\"0\"\n>\n <div class=\"layout-row place-start-center flex\">\n <ng-content></ng-content>\n\n <span class=\"flex\"></span>\n\n <div class=\"layout-col place-center-center\">\n <mat-icon>{{\n (expandedChange | async) ? 'keyboard_arrow_up' : 'keyboard_arrow_down'\n }}</mat-icon>\n </div>\n </div>\n</a>\n", styles: [".toggle-button{text-decoration:none;padding-left:16px;padding-right:16px;min-height:48px;border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s}.toggle-button:hover{background-color:var(--md-sys-color-ternary-fixed);cursor:pointer}\n"] }]
|
|
10643
10654
|
}], propDecorators: { expandedChange: [{
|
|
10644
10655
|
type: Output
|
|
10645
10656
|
}], expanded: [{
|
|
@@ -11051,6 +11062,16 @@ class ElderTogglePanelTriggerDirective {
|
|
|
11051
11062
|
this.handleTrigger();
|
|
11052
11063
|
}
|
|
11053
11064
|
}
|
|
11065
|
+
handleKeyDown(event) {
|
|
11066
|
+
// on click type handle also keydown events
|
|
11067
|
+
if (this.type === 'click') {
|
|
11068
|
+
if (event.key === 'Enter' || event.key === ' ') {
|
|
11069
|
+
event.preventDefault();
|
|
11070
|
+
event.stopPropagation();
|
|
11071
|
+
this.handleTrigger();
|
|
11072
|
+
}
|
|
11073
|
+
}
|
|
11074
|
+
}
|
|
11054
11075
|
/***************************************************************************
|
|
11055
11076
|
* *
|
|
11056
11077
|
* Private methods *
|
|
@@ -11062,7 +11083,7 @@ class ElderTogglePanelTriggerDirective {
|
|
|
11062
11083
|
}
|
|
11063
11084
|
}
|
|
11064
11085
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderTogglePanelTriggerDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
11065
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.3", type: ElderTogglePanelTriggerDirective, isStandalone: true, selector: "[elderTogglePanelTrigger]", inputs: { panel: ["elderTogglePanelTrigger", "panel"], type: ["elderTogglePanelTriggerType", "type"], enabled: ["elderTogglePanelTriggerEnabled", "enabled"] }, host: { listeners: { "click": "handleClick($event)", "focus": "handleFocus($event)" } }, ngImport: i0 }); }
|
|
11086
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.1.3", type: ElderTogglePanelTriggerDirective, isStandalone: true, selector: "[elderTogglePanelTrigger]", inputs: { panel: ["elderTogglePanelTrigger", "panel"], type: ["elderTogglePanelTriggerType", "type"], enabled: ["elderTogglePanelTriggerEnabled", "enabled"] }, host: { listeners: { "click": "handleClick($event)", "focus": "handleFocus($event)", "keydown": "handleKeyDown($event)" } }, ngImport: i0 }); }
|
|
11066
11087
|
}
|
|
11067
11088
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderTogglePanelTriggerDirective, decorators: [{
|
|
11068
11089
|
type: Directive,
|
|
@@ -11085,6 +11106,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
|
|
|
11085
11106
|
}], handleFocus: [{
|
|
11086
11107
|
type: HostListener,
|
|
11087
11108
|
args: ['focus', ['$event']]
|
|
11109
|
+
}], handleKeyDown: [{
|
|
11110
|
+
type: HostListener,
|
|
11111
|
+
args: ['keydown', ['$event']]
|
|
11088
11112
|
}] } });
|
|
11089
11113
|
|
|
11090
11114
|
class ElderPanelModule {
|
|
@@ -25924,8 +25948,10 @@ class ElderMultiSelectBase extends ElderSelectBase {
|
|
|
25924
25948
|
return valueLoadRequest$.pipe(map((loaded) => {
|
|
25925
25949
|
loaded.forEach((v, k) => existing.set(k, v));
|
|
25926
25950
|
return existing;
|
|
25927
|
-
}), map((allValuesMap) =>
|
|
25928
|
-
|
|
25951
|
+
}), map((allValuesMap) => {
|
|
25952
|
+
// Sort entities by id order
|
|
25953
|
+
return ids.map((id) => allValuesMap.get(id)).filter((entity) => !!entity);
|
|
25954
|
+
}));
|
|
25929
25955
|
}
|
|
25930
25956
|
else {
|
|
25931
25957
|
this.logger.warn('Failed to select value by Ids: ' + ids + ' - DataContext not available.');
|
|
@@ -28697,11 +28723,11 @@ class ElderNavListComponent {
|
|
|
28697
28723
|
}
|
|
28698
28724
|
}
|
|
28699
28725
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderNavListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
28700
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: ElderNavListComponent, isStandalone: true, selector: "elder-nav-list", inputs: { compareWith: "compareWith", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"layout-col full elder-nav-list-full\"
|
|
28726
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.1.3", type: ElderNavListComponent, isStandalone: true, selector: "elder-nav-list", inputs: { compareWith: "compareWith", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"layout-col full elder-nav-list-full\">\n <div\n class=\"layout-col p-sm flex scrollable\"\n style=\"overflow-y: scroll\"\n >\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{min-width:0;min-height:0}.elder-nav-list-full{min-width:120px}.elder-nav-list-full:focus{outline:none}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
28701
28727
|
}
|
|
28702
28728
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderNavListComponent, decorators: [{
|
|
28703
28729
|
type: Component,
|
|
28704
|
-
args: [{ selector: 'elder-nav-list', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"layout-col full elder-nav-list-full\"
|
|
28730
|
+
args: [{ selector: 'elder-nav-list', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, template: "<div class=\"layout-col full elder-nav-list-full\">\n <div\n class=\"layout-col p-sm flex scrollable\"\n style=\"overflow-y: scroll\"\n >\n <ng-content></ng-content>\n </div>\n</div>\n", styles: [":host{min-width:0;min-height:0}.elder-nav-list-full{min-width:120px}.elder-nav-list-full:focus{outline:none}\n"] }]
|
|
28705
28731
|
}], ctorParameters: () => [], propDecorators: { compareWith: [{
|
|
28706
28732
|
type: Input
|
|
28707
28733
|
}], valueChange: [{
|
|
@@ -28717,7 +28743,7 @@ class NavItemModel {
|
|
|
28717
28743
|
this.hrefTarget = hrefTarget;
|
|
28718
28744
|
}
|
|
28719
28745
|
}
|
|
28720
|
-
class
|
|
28746
|
+
class NavItemActivated {
|
|
28721
28747
|
constructor(event, value) {
|
|
28722
28748
|
this.event = event;
|
|
28723
28749
|
this.value = value;
|
|
@@ -28738,7 +28764,7 @@ class ElderNavLinkComponent {
|
|
|
28738
28764
|
**************************************************************************/
|
|
28739
28765
|
this.tabIndex = -1;
|
|
28740
28766
|
this.queryParams = {};
|
|
28741
|
-
this.
|
|
28767
|
+
this.activated = new Subject();
|
|
28742
28768
|
this._disabled = false;
|
|
28743
28769
|
this._routerLink$ = new BehaviorSubject('');
|
|
28744
28770
|
this._href$ = new BehaviorSubject('');
|
|
@@ -28807,14 +28833,24 @@ class ElderNavLinkComponent {
|
|
|
28807
28833
|
* Public API *
|
|
28808
28834
|
* *
|
|
28809
28835
|
**************************************************************************/
|
|
28810
|
-
|
|
28836
|
+
itemActivated(event) {
|
|
28811
28837
|
if (!this._disabled) {
|
|
28812
|
-
this.
|
|
28813
|
-
if (this.value
|
|
28838
|
+
this.activated.next(new NavItemActivated(event, this.value));
|
|
28839
|
+
if (this.value !== null) {
|
|
28814
28840
|
this.navList.value = this.value;
|
|
28815
28841
|
}
|
|
28816
28842
|
}
|
|
28817
28843
|
}
|
|
28844
|
+
itemClick(event) {
|
|
28845
|
+
this.itemActivated(event);
|
|
28846
|
+
}
|
|
28847
|
+
itemKeyDown(event) {
|
|
28848
|
+
event.preventDefault();
|
|
28849
|
+
event.stopPropagation();
|
|
28850
|
+
if (event.key === 'Enter' || event.key === ' ') {
|
|
28851
|
+
this.itemActivated(event);
|
|
28852
|
+
}
|
|
28853
|
+
}
|
|
28818
28854
|
/***************************************************************************
|
|
28819
28855
|
* *
|
|
28820
28856
|
* Private methods *
|
|
@@ -28824,7 +28860,7 @@ class ElderNavLinkComponent {
|
|
|
28824
28860
|
return this.navList.isActive(this.value);
|
|
28825
28861
|
}
|
|
28826
28862
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderNavLinkComponent, deps: [{ token: ElderNavListComponent }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
28827
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: ElderNavLinkComponent, isStandalone: true, selector: "elder-nav-link", inputs: { title: "title", queryParamsHandling: "queryParamsHandling", queryParams: "queryParams", icon: "icon", fontIcon: "fontIcon", fontSet: "fontSet", svgIcon: "svgIcon", routerLink: "routerLink", href: "href", target: "target", value: "value", disabled: "disabled" }, outputs: { clicked: "clicked" }, host: { properties: { "attr.tabindex": "this.tabIndex" } }, viewQueries: [{ propertyName: "routerLinkActive", first: true, predicate: RouterLinkActive, descendants: true }], ngImport: i0, template: "<!-- Router Link -->\n@if (model$ | async; as model) {\n @if (model.routerLink; as routerLink) {\n <a\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link
|
|
28863
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: ElderNavLinkComponent, isStandalone: true, selector: "elder-nav-link", inputs: { title: "title", queryParamsHandling: "queryParamsHandling", queryParams: "queryParams", icon: "icon", fontIcon: "fontIcon", fontSet: "fontSet", svgIcon: "svgIcon", routerLink: "routerLink", href: "href", target: "target", value: "value", disabled: "disabled" }, outputs: { clicked: "clicked", activated: "activated" }, host: { properties: { "attr.tabindex": "this.tabIndex" } }, viewQueries: [{ propertyName: "routerLinkActive", first: true, predicate: RouterLinkActive, descendants: true }], ngImport: i0, template: "<!-- Router Link -->\n@if (model$ | async; as model) {\n @if (model.routerLink; as routerLink) {\n <a\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link\"\n [routerLink]=\"routerLink\"\n [queryParamsHandling]=\"queryParamsHandling\"\n [queryParams]=\"queryParams\"\n routerLinkActive=\"dummy\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n }\n <!-- Href Link -->\n @if (model.href; as href) {\n <a\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link\"\n [href]=\"href\"\n [target]=\"model.hrefTarget\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n }\n <!-- Simple Button -->\n @if (!model.href && !model.routerLink) {\n <a\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link\"\n (click)=\"itemClick($event)\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n }\n}\n\n<ng-template #defaultLinkTemplate>\n <div class=\"layout-row place-start-center flex gap-md noselect\">\n @if (!(!icon && !title)) {\n <mat-icon [fontIcon]=\"fontIcon\" [fontSet]=\"fontSet\">\n {{ icon }}\n </mat-icon>\n }\n @if (svgIcon) {\n <mat-icon [svgIcon]=\"svgIcon\"></mat-icon>\n }\n @if (title) {\n <span class=\"noselect\">\n {{ title | translate }}\n </span>\n }\n <ng-content></ng-content>\n </div>\n</ng-template>\n", styles: [".nav-link{text-decoration:none;padding-left:16px;padding-right:16px;min-height:var(--elder-nav-item-height);border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s,color .5s}.nav-link .mat-icon{height:32px;width:32px;font-size:24px;padding:4px}.nav-link.nav-link-clickable{cursor:pointer}.nav-link.nav-link-clickable:hover{background-color:var(--elder-nav-link-hover-color)!important}.nav-link.nav-link-disabled{cursor:default}.nav-link.nav-link-active{background-color:var(--elder-nav-link-active-color);color:var(--md-sys-color-primary)}.nav-link.nav-link-active .mat-icon{color:var(--md-sys-color-on-teriary)}.nav-link.nav-link-inactive,.nav-link.nav-link-inactive .mat-icon{color:var(--md-sys-color-on-surface)}\n"], dependencies: [{ kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "directive", type: RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
28828
28864
|
}
|
|
28829
28865
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderNavLinkComponent, decorators: [{
|
|
28830
28866
|
type: Component,
|
|
@@ -28836,7 +28872,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
|
|
|
28836
28872
|
MatIcon,
|
|
28837
28873
|
AsyncPipe,
|
|
28838
28874
|
TranslateModule,
|
|
28839
|
-
], template: "<!-- Router Link -->\n@if (model$ | async; as model) {\n @if (model.routerLink; as routerLink) {\n <a\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link
|
|
28875
|
+
], template: "<!-- Router Link -->\n@if (model$ | async; as model) {\n @if (model.routerLink; as routerLink) {\n <a\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link\"\n [routerLink]=\"routerLink\"\n [queryParamsHandling]=\"queryParamsHandling\"\n [queryParams]=\"queryParams\"\n routerLinkActive=\"dummy\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n }\n <!-- Href Link -->\n @if (model.href; as href) {\n <a\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link\"\n [href]=\"href\"\n [target]=\"model.hrefTarget\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n }\n <!-- Simple Button -->\n @if (!model.href && !model.routerLink) {\n <a\n matRipple\n [matRippleDisabled]=\"disabled\"\n class=\"layout-row place-start-center nav-link\"\n (click)=\"itemClick($event)\"\n [class.nav-link-clickable]=\"!disabled\"\n [class.nav-link-disabled]=\"disabled\"\n [class.nav-link-active]=\"active$ | async\"\n [class.nav-link-inactive]=\"(active$ | async) === false\"\n >\n <ng-container [ngTemplateOutlet]=\"defaultLinkTemplate\"></ng-container>\n </a>\n }\n}\n\n<ng-template #defaultLinkTemplate>\n <div class=\"layout-row place-start-center flex gap-md noselect\">\n @if (!(!icon && !title)) {\n <mat-icon [fontIcon]=\"fontIcon\" [fontSet]=\"fontSet\">\n {{ icon }}\n </mat-icon>\n }\n @if (svgIcon) {\n <mat-icon [svgIcon]=\"svgIcon\"></mat-icon>\n }\n @if (title) {\n <span class=\"noselect\">\n {{ title | translate }}\n </span>\n }\n <ng-content></ng-content>\n </div>\n</ng-template>\n", styles: [".nav-link{text-decoration:none;padding-left:16px;padding-right:16px;min-height:var(--elder-nav-item-height);border-radius:var(--elder-border-radius-sm);overflow:hidden;transition:background-color .5s,color .5s}.nav-link .mat-icon{height:32px;width:32px;font-size:24px;padding:4px}.nav-link.nav-link-clickable{cursor:pointer}.nav-link.nav-link-clickable:hover{background-color:var(--elder-nav-link-hover-color)!important}.nav-link.nav-link-disabled{cursor:default}.nav-link.nav-link-active{background-color:var(--elder-nav-link-active-color);color:var(--md-sys-color-primary)}.nav-link.nav-link-active .mat-icon{color:var(--md-sys-color-on-teriary)}.nav-link.nav-link-inactive,.nav-link.nav-link-inactive .mat-icon{color:var(--md-sys-color-on-surface)}\n"] }]
|
|
28840
28876
|
}], ctorParameters: () => [{ type: ElderNavListComponent }], propDecorators: { tabIndex: [{
|
|
28841
28877
|
type: HostBinding,
|
|
28842
28878
|
args: ['attr.tabindex']
|
|
@@ -28856,6 +28892,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImpor
|
|
|
28856
28892
|
type: Input
|
|
28857
28893
|
}], clicked: [{
|
|
28858
28894
|
type: Output
|
|
28895
|
+
}], activated: [{
|
|
28896
|
+
type: Output
|
|
28859
28897
|
}], routerLinkActive: [{
|
|
28860
28898
|
type: ViewChild,
|
|
28861
28899
|
args: [RouterLinkActive, { static: false }]
|
|
@@ -28947,18 +28985,25 @@ class ElderNavGroupComponent {
|
|
|
28947
28985
|
* *
|
|
28948
28986
|
**************************************************************************/
|
|
28949
28987
|
itemClick(event) {
|
|
28950
|
-
this.clicked.emit(new
|
|
28988
|
+
this.clicked.emit(new NavItemActivated(event, undefined));
|
|
28951
28989
|
this.toggle();
|
|
28952
28990
|
}
|
|
28953
28991
|
toggle() {
|
|
28954
28992
|
this.isOpen.set(!this.isOpen());
|
|
28955
28993
|
}
|
|
28994
|
+
itemKeyDown(event) {
|
|
28995
|
+
if (event.key === 'Enter' || event.key === ' ') {
|
|
28996
|
+
event.preventDefault();
|
|
28997
|
+
event.stopPropagation();
|
|
28998
|
+
this.itemClick(event);
|
|
28999
|
+
}
|
|
29000
|
+
}
|
|
28956
29001
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderNavGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
28957
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.1.3", type: ElderNavGroupComponent, isStandalone: true, selector: "elder-nav-group", outputs: { clicked: "clicked" }, queries: [{ propertyName: "children", predicate: ElderNavLinkComponent, isSignal: true }], ngImport: i0, template: "<div class=\"layout-col nav-group\">\n <a\n matRipple\n class=\"layout-row place-start-center nav-group-button
|
|
29002
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "20.1.3", type: ElderNavGroupComponent, isStandalone: true, selector: "elder-nav-group", outputs: { clicked: "clicked" }, queries: [{ propertyName: "children", predicate: ElderNavLinkComponent, isSignal: true }], ngImport: i0, template: "<div class=\"layout-col nav-group\">\n <a\n matRipple\n tabindex=\"0\"\n class=\"layout-row place-start-center nav-group-button\"\n [class.nav-group-button-open]=\"isOpen()\"\n [class.nav-group-button-closed]=\"!isOpen()\"\n [class.nav-group-button-active]=\"active()\"\n (click)=\"itemClick($event)\"\n (keydown)=\"itemKeyDown($event)\"\n >\n <div class=\"layout-row place-start-center gap-lg full noselect\">\n <ng-content></ng-content>\n <span class=\"flex\"></span>\n <mat-icon>{{ isOpen() ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n </a>\n <!-- Nested Items projection -->\n <div\n class=\"layout-col nav-group-items-container p-sm\"\n [@openClose]=\"isOpen() ? 'open' : 'closed'\"\n [inert]=\"!isOpen()\"\n >\n <ng-content select=\"elder-nav-link\"></ng-content>\n </div>\n</div>\n", styles: [".nav-group-button-closed{padding-left:16px}.nav-group{min-height:var(--elder-nav-item-height)}.nav-group-button{padding-right:16px;min-height:var(--elder-nav-item-height);font-size:16px;font-weight:400;border-radius:var(--elder-border-radius-sm);cursor:pointer}.nav-group-button .mat-icon{height:24px;width:24px;font-size:24px;padding:4px}.nav-group-items-container{overflow:hidden}.nav-group-button:hover{background-color:var(--elder-nav-link-hover-color);transition:background-color .5s}.nav-group-button-open{padding-left:11px!important}.nav-group-button-active:not(.nav-group-button-open){background-color:var(--elder-nav-link-hover-color);color:var(--md-sys-color-primary)}\n"], dependencies: [{ kind: "directive", type: MatRipple, selector: "[mat-ripple], [matRipple]", inputs: ["matRippleColor", "matRippleUnbounded", "matRippleCentered", "matRippleRadius", "matRippleAnimation", "matRippleDisabled", "matRippleTrigger"], exportAs: ["matRipple"] }, { kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }], animations: animations, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
28958
29003
|
}
|
|
28959
29004
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderNavGroupComponent, decorators: [{
|
|
28960
29005
|
type: Component,
|
|
28961
|
-
args: [{ selector: 'elder-nav-group', animations: animations, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatRipple, MatIcon], template: "<div class=\"layout-col nav-group\">\n <a\n matRipple\n class=\"layout-row place-start-center nav-group-button
|
|
29006
|
+
args: [{ selector: 'elder-nav-group', animations: animations, changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatRipple, MatIcon], template: "<div class=\"layout-col nav-group\">\n <a\n matRipple\n tabindex=\"0\"\n class=\"layout-row place-start-center nav-group-button\"\n [class.nav-group-button-open]=\"isOpen()\"\n [class.nav-group-button-closed]=\"!isOpen()\"\n [class.nav-group-button-active]=\"active()\"\n (click)=\"itemClick($event)\"\n (keydown)=\"itemKeyDown($event)\"\n >\n <div class=\"layout-row place-start-center gap-lg full noselect\">\n <ng-content></ng-content>\n <span class=\"flex\"></span>\n <mat-icon>{{ isOpen() ? 'keyboard_arrow_up' : 'keyboard_arrow_down' }}</mat-icon>\n </div>\n </a>\n <!-- Nested Items projection -->\n <div\n class=\"layout-col nav-group-items-container p-sm\"\n [@openClose]=\"isOpen() ? 'open' : 'closed'\"\n [inert]=\"!isOpen()\"\n >\n <ng-content select=\"elder-nav-link\"></ng-content>\n </div>\n</div>\n", styles: [".nav-group-button-closed{padding-left:16px}.nav-group{min-height:var(--elder-nav-item-height)}.nav-group-button{padding-right:16px;min-height:var(--elder-nav-item-height);font-size:16px;font-weight:400;border-radius:var(--elder-border-radius-sm);cursor:pointer}.nav-group-button .mat-icon{height:24px;width:24px;font-size:24px;padding:4px}.nav-group-items-container{overflow:hidden}.nav-group-button:hover{background-color:var(--elder-nav-link-hover-color);transition:background-color .5s}.nav-group-button-open{padding-left:11px!important}.nav-group-button-active:not(.nav-group-button-open){background-color:var(--elder-nav-link-hover-color);color:var(--md-sys-color-primary)}\n"] }]
|
|
28962
29007
|
}], ctorParameters: () => [] });
|
|
28963
29008
|
|
|
28964
29009
|
class ElderNavModule {
|
|
@@ -29987,11 +30032,11 @@ class ElderAppHeaderComponent {
|
|
|
29987
30032
|
this.version = input(undefined, ...(ngDevMode ? [{ debugName: "version" }] : []));
|
|
29988
30033
|
}
|
|
29989
30034
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderAppHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
29990
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: ElderAppHeaderComponent, isStandalone: true, selector: "elder-app-header", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, svgIcon: { classPropertyName: "svgIcon", publicName: "svgIcon", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, subTitleLink: { classPropertyName: "subTitleLink", publicName: "subTitleLink", isSignal: true, isRequired: false, transformFunction: null }, version: { classPropertyName: "version", publicName: "version", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"elder-panel mat-primary layout-col full light\">\n <div class=\"layout-row flex-none p-lg pb-sm\">\n <div class=\"layout-row place-center-center\">\n <a routerLink=\"/\" class=\"link-unstyled\">\n <mat-icon class=\"service-icon noselect svg-icon-inherit-color\" [svgIcon]=\"svgIcon()\">{{\n icon()\n }}</mat-icon>\n </a>\n </div>\n <div class=\"layout-col place-center-start\">\n <div class=\"layout-col place-center-center\" style=\"width: 100%\">\n <div class=\"layout-row place-start-end gap-xs\">\n <a
|
|
30035
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.3", type: ElderAppHeaderComponent, isStandalone: true, selector: "elder-app-header", inputs: { icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, svgIcon: { classPropertyName: "svgIcon", publicName: "svgIcon", isSignal: true, isRequired: false, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, subTitle: { classPropertyName: "subTitle", publicName: "subTitle", isSignal: true, isRequired: false, transformFunction: null }, subTitleLink: { classPropertyName: "subTitleLink", publicName: "subTitleLink", isSignal: true, isRequired: false, transformFunction: null }, version: { classPropertyName: "version", publicName: "version", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div class=\"elder-panel mat-primary layout-col full light\">\n <div class=\"layout-row flex-none p-lg pb-sm\">\n <div class=\"layout-row place-center-center\">\n <a routerLink=\"/\" class=\"link-unstyled\">\n <mat-icon class=\"service-icon noselect svg-icon-inherit-color\" [svgIcon]=\"svgIcon()\">{{\n icon()\n }}</mat-icon>\n </a>\n </div>\n <div class=\"layout-col place-center-start\">\n <div class=\"layout-col place-center-center\" style=\"width: 100%\">\n <div class=\"layout-row place-start-end gap-xs\">\n <a\n routerLink=\"/\"\n id=\"title\"\n class=\"noselect link-unstyled\"\n style=\"font-size: 28px\"\n tabindex=\"-1\"\n >{{ title() }}</a\n >\n <span class=\"mat-caption noselect\">\n <small>{{ version() }}</small>\n </span>\n </div>\n </div>\n <div class=\"layout-row place-start-center\">\n <span class=\"mat-caption noselect\">\n @if (subTitleLink()) {\n <a\n [href]=\"subTitleLink()\"\n target=\"_blank\"\n style=\"text-decoration: none; color: inherit\"\n tabindex=\"-1\"\n >{{ subTitle() }}</a\n >\n } @else {\n <span>{{ subTitle() }}</span>\n }\n </span>\n </div>\n </div>\n </div>\n\n <!-- Project child content here -->\n <ng-content></ng-content>\n</div>\n", styles: [".link-unstyled{text-decoration:none;color:inherit}.elder-app-header-panel{background-color:var(--md-sys-color-primary)}.service-icon{font-size:42px;width:82px;height:82px;padding:20px;color:var(--md-sys-color-on-primary)}:host-context(.elder-dark-theme) .service-icon{color:var(--md-sys-color-tertiary)}\n"], dependencies: [{ kind: "component", type: MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
29991
30036
|
}
|
|
29992
30037
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.3", ngImport: i0, type: ElderAppHeaderComponent, decorators: [{
|
|
29993
30038
|
type: Component,
|
|
29994
|
-
args: [{ selector: 'elder-app-header', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatIcon, RouterLink], standalone: true, template: "<div class=\"elder-panel mat-primary layout-col full light\">\n <div class=\"layout-row flex-none p-lg pb-sm\">\n <div class=\"layout-row place-center-center\">\n <a routerLink=\"/\" class=\"link-unstyled\">\n <mat-icon class=\"service-icon noselect svg-icon-inherit-color\" [svgIcon]=\"svgIcon()\">{{\n icon()\n }}</mat-icon>\n </a>\n </div>\n <div class=\"layout-col place-center-start\">\n <div class=\"layout-col place-center-center\" style=\"width: 100%\">\n <div class=\"layout-row place-start-end gap-xs\">\n <a
|
|
30039
|
+
args: [{ selector: 'elder-app-header', changeDetection: ChangeDetectionStrategy.OnPush, imports: [MatIcon, RouterLink], standalone: true, template: "<div class=\"elder-panel mat-primary layout-col full light\">\n <div class=\"layout-row flex-none p-lg pb-sm\">\n <div class=\"layout-row place-center-center\">\n <a routerLink=\"/\" class=\"link-unstyled\">\n <mat-icon class=\"service-icon noselect svg-icon-inherit-color\" [svgIcon]=\"svgIcon()\">{{\n icon()\n }}</mat-icon>\n </a>\n </div>\n <div class=\"layout-col place-center-start\">\n <div class=\"layout-col place-center-center\" style=\"width: 100%\">\n <div class=\"layout-row place-start-end gap-xs\">\n <a\n routerLink=\"/\"\n id=\"title\"\n class=\"noselect link-unstyled\"\n style=\"font-size: 28px\"\n tabindex=\"-1\"\n >{{ title() }}</a\n >\n <span class=\"mat-caption noselect\">\n <small>{{ version() }}</small>\n </span>\n </div>\n </div>\n <div class=\"layout-row place-start-center\">\n <span class=\"mat-caption noselect\">\n @if (subTitleLink()) {\n <a\n [href]=\"subTitleLink()\"\n target=\"_blank\"\n style=\"text-decoration: none; color: inherit\"\n tabindex=\"-1\"\n >{{ subTitle() }}</a\n >\n } @else {\n <span>{{ subTitle() }}</span>\n }\n </span>\n </div>\n </div>\n </div>\n\n <!-- Project child content here -->\n <ng-content></ng-content>\n</div>\n", styles: [".link-unstyled{text-decoration:none;color:inherit}.elder-app-header-panel{background-color:var(--md-sys-color-primary)}.service-icon{font-size:42px;width:82px;height:82px;padding:20px;color:var(--md-sys-color-on-primary)}:host-context(.elder-dark-theme) .service-icon{color:var(--md-sys-color-tertiary)}\n"] }]
|
|
29995
30040
|
}] });
|
|
29996
30041
|
|
|
29997
30042
|
class DrawerOutletBinding {
|