@uni-design-system/uni-angular 5.2.0 → 6.0.1
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.
|
@@ -958,7 +958,7 @@ class UniAppBarComponent extends BaseComponent {
|
|
|
958
958
|
});
|
|
959
959
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
960
960
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniAppBarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
961
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniAppBarComponent, isStandalone: true, selector: "uni-app-bar
|
|
961
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniAppBarComponent, isStandalone: true, selector: "uni-app-bar", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, sticky: { classPropertyName: "sticky", publicName: "sticky", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'appBar' }], usesInheritance: true, ngImport: i0, template: `
|
|
962
962
|
<ng-content select="[leading]" />
|
|
963
963
|
@if (title()) {
|
|
964
964
|
<span class="uni-app-bar-title">{{ title() }}</span>
|
|
@@ -972,7 +972,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
972
972
|
type: Component,
|
|
973
973
|
args: [{
|
|
974
974
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
975
|
-
selector: 'uni-app-bar
|
|
975
|
+
selector: 'uni-app-bar',
|
|
976
976
|
providers: [{ provide: COMPONENT_NAME, useValue: 'appBar' }],
|
|
977
977
|
host: { '[class]': 'className()' },
|
|
978
978
|
template: `
|
|
@@ -1005,12 +1005,12 @@ class UniSymbolComponent extends BaseComponent {
|
|
|
1005
1005
|
}));
|
|
1006
1006
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1007
1007
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSymbolComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1008
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniSymbolComponent, isStandalone: true, selector: "uni-symbol
|
|
1008
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniSymbolComponent, isStandalone: true, selector: "uni-symbol", inputs: { name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, weight: { classPropertyName: "weight", publicName: "weight", isSignal: true, isRequired: false, transformFunction: null }, grade: { classPropertyName: "grade", publicName: "grade", isSignal: true, isRequired: false, transformFunction: null }, opticalSize: { classPropertyName: "opticalSize", publicName: "opticalSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-hidden": "true" }, properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'symbol' }], usesInheritance: true, ngImport: i0, template: `{{ name() }}`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1009
1009
|
}
|
|
1010
1010
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSymbolComponent, decorators: [{
|
|
1011
1011
|
type: Component,
|
|
1012
1012
|
args: [{
|
|
1013
|
-
selector: 'uni-symbol
|
|
1013
|
+
selector: 'uni-symbol',
|
|
1014
1014
|
imports: [],
|
|
1015
1015
|
template: `{{ name() }}`,
|
|
1016
1016
|
providers: [{ provide: COMPONENT_NAME, useValue: 'symbol' }],
|
|
@@ -1069,7 +1069,7 @@ class UniAvatarComponent extends BaseComponent {
|
|
|
1069
1069
|
},
|
|
1070
1070
|
]), ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1071
1071
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniAvatarComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1072
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniAvatarComponent, isStandalone: true, selector: "uni-avatar
|
|
1072
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniAvatarComponent, isStandalone: true, selector: "uni-avatar", inputs: { src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null }, text: { classPropertyName: "text", publicName: "text", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()", "attr.role": "label() ? 'img' : null", "attr.aria-label": "label() || null", "attr.aria-hidden": "label() ? null : 'true'" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'avatar' }], usesInheritance: true, ngImport: i0, template: `
|
|
1073
1073
|
@if (showImage()) {
|
|
1074
1074
|
<img [src]="src()" alt="" (error)="imageFailed.set(true)" />
|
|
1075
1075
|
} @else if (text()) {
|
|
@@ -1077,15 +1077,15 @@ class UniAvatarComponent extends BaseComponent {
|
|
|
1077
1077
|
} @else if (initials()) {
|
|
1078
1078
|
<span>{{ initials() }}</span>
|
|
1079
1079
|
} @else {
|
|
1080
|
-
<
|
|
1080
|
+
<uni-symbol [name]="componentOptions().fallbackSymbol ?? 'person'" />
|
|
1081
1081
|
}
|
|
1082
|
-
`, isInline: true, dependencies: [{ kind: "component", type: UniSymbolComponent, selector: "uni-symbol
|
|
1082
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1083
1083
|
}
|
|
1084
1084
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniAvatarComponent, decorators: [{
|
|
1085
1085
|
type: Component,
|
|
1086
1086
|
args: [{
|
|
1087
1087
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1088
|
-
selector: 'uni-avatar
|
|
1088
|
+
selector: 'uni-avatar',
|
|
1089
1089
|
imports: [UniSymbolComponent],
|
|
1090
1090
|
providers: [{ provide: COMPONENT_NAME, useValue: 'avatar' }],
|
|
1091
1091
|
host: {
|
|
@@ -1102,7 +1102,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
1102
1102
|
} @else if (initials()) {
|
|
1103
1103
|
<span>{{ initials() }}</span>
|
|
1104
1104
|
} @else {
|
|
1105
|
-
<
|
|
1105
|
+
<uni-symbol [name]="componentOptions().fallbackSymbol ?? 'person'" />
|
|
1106
1106
|
}
|
|
1107
1107
|
`,
|
|
1108
1108
|
}]
|
|
@@ -1144,7 +1144,7 @@ class UniAvatarGroupComponent extends BaseComponent {
|
|
|
1144
1144
|
});
|
|
1145
1145
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1146
1146
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniAvatarGroupComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1147
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniAvatarGroupComponent, isStandalone: true, selector: "uni-avatar-group
|
|
1147
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniAvatarGroupComponent, isStandalone: true, selector: "uni-avatar-group", inputs: { max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "group" }, properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'avatarGroup' }], queries: [{ propertyName: "avatars", predicate: UniAvatarComponent, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
|
|
1148
1148
|
<ng-content />
|
|
1149
1149
|
@if (surplus() > 0) {
|
|
1150
1150
|
<uni-avatar
|
|
@@ -1154,13 +1154,13 @@ class UniAvatarGroupComponent extends BaseComponent {
|
|
|
1154
1154
|
[size]="size()"
|
|
1155
1155
|
/>
|
|
1156
1156
|
}
|
|
1157
|
-
`, isInline: true, dependencies: [{ kind: "component", type: UniAvatarComponent, selector: "uni-avatar
|
|
1157
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UniAvatarComponent, selector: "uni-avatar", inputs: ["src", "name", "text"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1158
1158
|
}
|
|
1159
1159
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniAvatarGroupComponent, decorators: [{
|
|
1160
1160
|
type: Component,
|
|
1161
1161
|
args: [{
|
|
1162
1162
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1163
|
-
selector: 'uni-avatar-group
|
|
1163
|
+
selector: 'uni-avatar-group',
|
|
1164
1164
|
imports: [UniAvatarComponent],
|
|
1165
1165
|
providers: [{ provide: COMPONENT_NAME, useValue: 'avatarGroup' }],
|
|
1166
1166
|
host: { '[class]': 'className()', role: 'group' },
|
|
@@ -1199,12 +1199,12 @@ class UniBackgroundComponent {
|
|
|
1199
1199
|
]);
|
|
1200
1200
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1201
1201
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniBackgroundComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1202
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniBackgroundComponent, isStandalone: true, selector: "uni-background
|
|
1202
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniBackgroundComponent, isStandalone: true, selector: "uni-background", inputs: { image: { classPropertyName: "image", publicName: "image", isSignal: true, isRequired: false, transformFunction: null }, imagePosition: { classPropertyName: "imagePosition", publicName: "imagePosition", isSignal: true, isRequired: false, transformFunction: null }, imageSize: { classPropertyName: "imageSize", publicName: "imageSize", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1203
1203
|
}
|
|
1204
1204
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniBackgroundComponent, decorators: [{
|
|
1205
1205
|
type: Component,
|
|
1206
1206
|
args: [{
|
|
1207
|
-
selector: 'uni-background
|
|
1207
|
+
selector: 'uni-background',
|
|
1208
1208
|
imports: [],
|
|
1209
1209
|
template: `<ng-content></ng-content>`,
|
|
1210
1210
|
host: { '[class]': 'className()' },
|
|
@@ -1240,12 +1240,12 @@ class UniBadgeComponent extends BaseComponent {
|
|
|
1240
1240
|
]);
|
|
1241
1241
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1242
1242
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniBadgeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1243
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniBadgeComponent, isStandalone: true, selector: "
|
|
1243
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniBadgeComponent, isStandalone: true, selector: "[uni-badge]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, useVariant: { classPropertyName: "useVariant", publicName: "useVariant", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'badge' }], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1244
1244
|
}
|
|
1245
1245
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniBadgeComponent, decorators: [{
|
|
1246
1246
|
type: Component,
|
|
1247
1247
|
args: [{
|
|
1248
|
-
selector: '
|
|
1248
|
+
selector: '[uni-badge]',
|
|
1249
1249
|
imports: [],
|
|
1250
1250
|
template: `<ng-content></ng-content>`,
|
|
1251
1251
|
providers: [{ provide: COMPONENT_NAME, useValue: 'badge' }],
|
|
@@ -1307,7 +1307,7 @@ class UniBreadcrumbComponent extends BaseComponent {
|
|
|
1307
1307
|
});
|
|
1308
1308
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1309
1309
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniBreadcrumbComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1310
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniBreadcrumbComponent, isStandalone: true, selector: "uni-breadcrumb
|
|
1310
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniBreadcrumbComponent, isStandalone: true, selector: "uni-breadcrumb", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: true, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClicked: "itemClicked" }, providers: [{ provide: COMPONENT_NAME, useValue: 'breadcrumb' }], usesInheritance: true, ngImport: i0, template: `
|
|
1311
1311
|
<nav [attr.aria-label]="ariaLabel()" [class]="className()">
|
|
1312
1312
|
<ol>
|
|
1313
1313
|
@for (item of items(); track item.label; let last = $last; let i = $index) {
|
|
@@ -1320,7 +1320,7 @@ class UniBreadcrumbComponent extends BaseComponent {
|
|
|
1320
1320
|
<button type="button" (click)="itemClicked.emit(item)">{{ item.label }}</button>
|
|
1321
1321
|
}
|
|
1322
1322
|
@if (!last) {
|
|
1323
|
-
<
|
|
1323
|
+
<uni-symbol
|
|
1324
1324
|
aria-hidden="true"
|
|
1325
1325
|
[name]="componentOptions().separatorSymbol ?? 'chevron_right'"
|
|
1326
1326
|
/>
|
|
@@ -1329,13 +1329,13 @@ class UniBreadcrumbComponent extends BaseComponent {
|
|
|
1329
1329
|
}
|
|
1330
1330
|
</ol>
|
|
1331
1331
|
</nav>
|
|
1332
|
-
`, isInline: true, dependencies: [{ kind: "component", type: UniSymbolComponent, selector: "uni-symbol
|
|
1332
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1333
1333
|
}
|
|
1334
1334
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniBreadcrumbComponent, decorators: [{
|
|
1335
1335
|
type: Component,
|
|
1336
1336
|
args: [{
|
|
1337
1337
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1338
|
-
selector: 'uni-breadcrumb
|
|
1338
|
+
selector: 'uni-breadcrumb',
|
|
1339
1339
|
imports: [UniSymbolComponent],
|
|
1340
1340
|
providers: [{ provide: COMPONENT_NAME, useValue: 'breadcrumb' }],
|
|
1341
1341
|
template: `
|
|
@@ -1351,7 +1351,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
1351
1351
|
<button type="button" (click)="itemClicked.emit(item)">{{ item.label }}</button>
|
|
1352
1352
|
}
|
|
1353
1353
|
@if (!last) {
|
|
1354
|
-
<
|
|
1354
|
+
<uni-symbol
|
|
1355
1355
|
aria-hidden="true"
|
|
1356
1356
|
[name]="componentOptions().separatorSymbol ?? 'chevron_right'"
|
|
1357
1357
|
/>
|
|
@@ -1368,20 +1368,35 @@ class UniIconComponent {
|
|
|
1368
1368
|
themeService = inject(ThemeService);
|
|
1369
1369
|
color = input(...(ngDevMode ? [undefined, { debugName: "color" }] : /* istanbul ignore next */ []));
|
|
1370
1370
|
name = input.required(...(ngDevMode ? [{ debugName: "name" }] : /* istanbul ignore next */ []));
|
|
1371
|
-
|
|
1371
|
+
/** Resolved from the theme's icon primitives; unknown names render nothing. */
|
|
1372
|
+
path = computed(() => {
|
|
1373
|
+
const icon = this.themeService.theme().icons[this.name()];
|
|
1374
|
+
return icon ? `url("${icon}")` : 'none';
|
|
1375
|
+
}, ...(ngDevMode ? [{ debugName: "path" }] : /* istanbul ignore next */ []));
|
|
1372
1376
|
className = computed(() => css([{ ...this.themeService.color(this.color()) }]), ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1373
1377
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniIconComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1374
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniIconComponent, isStandalone: true, selector: "uni-icon
|
|
1378
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniIconComponent, isStandalone: true, selector: "uni-icon", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: true, transformFunction: null } }, host: { attributes: { "aria-hidden": "true" }, properties: { "class": "className()", "style.mask-image": "path()", "style.-webkit-mask-image": "path()" } }, ngImport: i0, template: '', isInline: true, styles: [":host{display:block;height:100%;width:100%;background-color:currentColor;mask-size:contain;mask-position:center;mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1375
1379
|
}
|
|
1376
1380
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniIconComponent, decorators: [{
|
|
1377
1381
|
type: Component,
|
|
1378
|
-
args: [{ selector: 'uni-icon
|
|
1382
|
+
args: [{ selector: 'uni-icon', imports: [], template: '', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
1379
1383
|
'aria-hidden': 'true',
|
|
1380
1384
|
'[class]': 'className()',
|
|
1385
|
+
'[style.mask-image]': 'path()',
|
|
1381
1386
|
'[style.-webkit-mask-image]': 'path()',
|
|
1382
|
-
}, styles: [":host{display:block;height:100%;width:100%;background-color:currentColor;-webkit-mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat}\n"] }]
|
|
1387
|
+
}, styles: [":host{display:block;height:100%;width:100%;background-color:currentColor;mask-size:contain;mask-position:center;mask-repeat:no-repeat;-webkit-mask-size:contain;-webkit-mask-position:center;-webkit-mask-repeat:no-repeat}\n"] }]
|
|
1383
1388
|
}], propDecorators: { color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: true }] }] } });
|
|
1384
1389
|
|
|
1390
|
+
/**
|
|
1391
|
+
* The base layout primitive, applied as an attribute to any element so
|
|
1392
|
+
* semantics stay yours: `<main box-layout [grow]="1" padding="md">`.
|
|
1393
|
+
* Exception: other components' host elements (`<uni-card box-layout>` would
|
|
1394
|
+
* put two components on one element) — wrap those in a `<div box-layout>`.
|
|
1395
|
+
*
|
|
1396
|
+
* Sizing convention (height/width/min/max/inset): a **number is px and needs
|
|
1397
|
+
* a binding** — `[height]="420"`; a **plain attribute is a CSS length
|
|
1398
|
+
* string** — `height="420px"`. Spacing/radius/color inputs take theme tokens.
|
|
1399
|
+
*/
|
|
1385
1400
|
class UniBoxComponent {
|
|
1386
1401
|
theme = inject(ThemeService);
|
|
1387
1402
|
color = input(...(ngDevMode ? [undefined, { debugName: "color" }] : /* istanbul ignore next */ []));
|
|
@@ -1412,9 +1427,11 @@ class UniBoxComponent {
|
|
|
1412
1427
|
display = input(...(ngDevMode ? [undefined, { debugName: "display" }] : /* istanbul ignore next */ []));
|
|
1413
1428
|
position = input(...(ngDevMode ? [undefined, { debugName: "position" }] : /* istanbul ignore next */ []));
|
|
1414
1429
|
inset = input(...(ngDevMode ? [undefined, { debugName: "inset" }] : /* istanbul ignore next */ []));
|
|
1430
|
+
/** Number = px via binding (`[height]="420"`); string = CSS length (`height="420px"`). */
|
|
1415
1431
|
height = input(...(ngDevMode ? [undefined, { debugName: "height" }] : /* istanbul ignore next */ []));
|
|
1416
1432
|
minHeight = input(...(ngDevMode ? [undefined, { debugName: "minHeight" }] : /* istanbul ignore next */ []));
|
|
1417
1433
|
maxHeight = input(...(ngDevMode ? [undefined, { debugName: "maxHeight" }] : /* istanbul ignore next */ []));
|
|
1434
|
+
/** Number = px via binding (`[width]="420"`); string = CSS length (`width="50%"`). */
|
|
1418
1435
|
width = input(...(ngDevMode ? [undefined, { debugName: "width" }] : /* istanbul ignore next */ []));
|
|
1419
1436
|
minWidth = input(...(ngDevMode ? [undefined, { debugName: "minWidth" }] : /* istanbul ignore next */ []));
|
|
1420
1437
|
maxWidth = input(...(ngDevMode ? [undefined, { debugName: "maxWidth" }] : /* istanbul ignore next */ []));
|
|
@@ -1510,12 +1527,12 @@ class UniBoxComponent {
|
|
|
1510
1527
|
]);
|
|
1511
1528
|
}, ...(ngDevMode ? [{ debugName: "boxClassName" }] : /* istanbul ignore next */ []));
|
|
1512
1529
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniBoxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1513
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniBoxComponent, isStandalone: true, selector: "
|
|
1530
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniBoxComponent, isStandalone: true, selector: "[uni-box-layout], [box-layout]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, backgroundColor: { classPropertyName: "backgroundColor", publicName: "backgroundColor", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, borderRadiusLeft: { classPropertyName: "borderRadiusLeft", publicName: "borderRadiusLeft", isSignal: true, isRequired: false, transformFunction: null }, borderRadiusRight: { classPropertyName: "borderRadiusRight", publicName: "borderRadiusRight", isSignal: true, isRequired: false, transformFunction: null }, borderRadiusTop: { classPropertyName: "borderRadiusTop", publicName: "borderRadiusTop", isSignal: true, isRequired: false, transformFunction: null }, borderRadiusBottom: { classPropertyName: "borderRadiusBottom", publicName: "borderRadiusBottom", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, paddingHorizontal: { classPropertyName: "paddingHorizontal", publicName: "paddingHorizontal", isSignal: true, isRequired: false, transformFunction: null }, paddingVertical: { classPropertyName: "paddingVertical", publicName: "paddingVertical", isSignal: true, isRequired: false, transformFunction: null }, paddingLeft: { classPropertyName: "paddingLeft", publicName: "paddingLeft", isSignal: true, isRequired: false, transformFunction: null }, paddingRight: { classPropertyName: "paddingRight", publicName: "paddingRight", isSignal: true, isRequired: false, transformFunction: null }, paddingTop: { classPropertyName: "paddingTop", publicName: "paddingTop", isSignal: true, isRequired: false, transformFunction: null }, paddingBottom: { classPropertyName: "paddingBottom", publicName: "paddingBottom", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, borderTop: { classPropertyName: "borderTop", publicName: "borderTop", isSignal: true, isRequired: false, transformFunction: null }, borderBottom: { classPropertyName: "borderBottom", publicName: "borderBottom", isSignal: true, isRequired: false, transformFunction: null }, borderLeft: { classPropertyName: "borderLeft", publicName: "borderLeft", isSignal: true, isRequired: false, transformFunction: null }, borderRight: { classPropertyName: "borderRight", publicName: "borderRight", isSignal: true, isRequired: false, transformFunction: null }, dashBorder: { classPropertyName: "dashBorder", publicName: "dashBorder", isSignal: true, isRequired: false, transformFunction: null }, alignSelf: { classPropertyName: "alignSelf", publicName: "alignSelf", isSignal: true, isRequired: false, transformFunction: null }, alignItems: { classPropertyName: "alignItems", publicName: "alignItems", isSignal: true, isRequired: false, transformFunction: null }, alignContent: { classPropertyName: "alignContent", publicName: "alignContent", isSignal: true, isRequired: false, transformFunction: null }, justifyContent: { classPropertyName: "justifyContent", publicName: "justifyContent", isSignal: true, isRequired: false, transformFunction: null }, grow: { classPropertyName: "grow", publicName: "grow", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, inset: { classPropertyName: "inset", publicName: "inset", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, maxHeight: { classPropertyName: "maxHeight", publicName: "maxHeight", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, ignoreDir: { classPropertyName: "ignoreDir", publicName: "ignoreDir", isSignal: true, isRequired: false, transformFunction: null }, gridArea: { classPropertyName: "gridArea", publicName: "gridArea", isSignal: true, isRequired: false, transformFunction: null }, gridColumn: { classPropertyName: "gridColumn", publicName: "gridColumn", isSignal: true, isRequired: false, transformFunction: null }, gridRow: { classPropertyName: "gridRow", publicName: "gridRow", isSignal: true, isRequired: false, transformFunction: null }, overflow: { classPropertyName: "overflow", publicName: "overflow", isSignal: true, isRequired: false, transformFunction: null }, elevation: { classPropertyName: "elevation", publicName: "elevation", isSignal: true, isRequired: false, transformFunction: null }, shadow: { classPropertyName: "shadow", publicName: "shadow", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, fullHeight: { classPropertyName: "fullHeight", publicName: "fullHeight", isSignal: true, isRequired: false, transformFunction: null }, flexDirection: { classPropertyName: "flexDirection", publicName: "flexDirection", isSignal: true, isRequired: false, transformFunction: null }, textAlign: { classPropertyName: "textAlign", publicName: "textAlign", isSignal: true, isRequired: false, transformFunction: null }, wrapItems: { classPropertyName: "wrapItems", publicName: "wrapItems", isSignal: true, isRequired: false, transformFunction: null }, zIndex: { classPropertyName: "zIndex", publicName: "zIndex", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "boxClassName()" } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1514
1531
|
}
|
|
1515
1532
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniBoxComponent, decorators: [{
|
|
1516
1533
|
type: Component,
|
|
1517
1534
|
args: [{
|
|
1518
|
-
selector: '
|
|
1535
|
+
selector: '[uni-box-layout], [box-layout]',
|
|
1519
1536
|
imports: [],
|
|
1520
1537
|
template: `<ng-content></ng-content>`,
|
|
1521
1538
|
host: { '[class]': 'boxClassName()' },
|
|
@@ -1531,13 +1548,13 @@ class UniCenterComponent extends UniBoxComponent {
|
|
|
1531
1548
|
super();
|
|
1532
1549
|
}
|
|
1533
1550
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCenterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1534
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniCenterComponent, isStandalone: true, selector: "
|
|
1551
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniCenterComponent, isStandalone: true, selector: "[uni-center-layout], [center-layout]", inputs: { display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, justifyContent: { classPropertyName: "justifyContent", publicName: "justifyContent", isSignal: true, isRequired: false, transformFunction: null }, alignItems: { classPropertyName: "alignItems", publicName: "alignItems", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1535
1552
|
}
|
|
1536
1553
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCenterComponent, decorators: [{
|
|
1537
1554
|
type: Component,
|
|
1538
1555
|
args: [{
|
|
1539
1556
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1540
|
-
selector: '
|
|
1557
|
+
selector: '[uni-center-layout], [center-layout]',
|
|
1541
1558
|
imports: [],
|
|
1542
1559
|
template: `<ng-content></ng-content>`,
|
|
1543
1560
|
}]
|
|
@@ -1547,12 +1564,12 @@ class UniGridAreaComponent {
|
|
|
1547
1564
|
area = input.required(...(ngDevMode ? [{ debugName: "area" }] : /* istanbul ignore next */ []));
|
|
1548
1565
|
className = computed(() => css({ gridArea: this.area() }), ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1549
1566
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniGridAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1550
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniGridAreaComponent, isStandalone: true, selector: "
|
|
1567
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniGridAreaComponent, isStandalone: true, selector: "[uni-grid-area-layout], [grid-area-layout]", inputs: { area: { classPropertyName: "area", publicName: "area", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class": "className()" } }, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1551
1568
|
}
|
|
1552
1569
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniGridAreaComponent, decorators: [{
|
|
1553
1570
|
type: Component,
|
|
1554
1571
|
args: [{
|
|
1555
|
-
selector: '
|
|
1572
|
+
selector: '[uni-grid-area-layout], [grid-area-layout]',
|
|
1556
1573
|
imports: [],
|
|
1557
1574
|
template: `<ng-content></ng-content>`,
|
|
1558
1575
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
@@ -1585,12 +1602,12 @@ class UniGridComponent extends UniBoxComponent {
|
|
|
1585
1602
|
},
|
|
1586
1603
|
]), ...(ngDevMode ? [{ debugName: "gridClassName" }] : /* istanbul ignore next */ []));
|
|
1587
1604
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniGridComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1588
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniGridComponent, isStandalone: true, selector: "
|
|
1605
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniGridComponent, isStandalone: true, selector: "[uni-grid-layout], [grid-layout]", inputs: { display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, templateAreas: { classPropertyName: "templateAreas", publicName: "templateAreas", isSignal: true, isRequired: false, transformFunction: null }, templateColumns: { classPropertyName: "templateColumns", publicName: "templateColumns", isSignal: true, isRequired: false, transformFunction: null }, templateRows: { classPropertyName: "templateRows", publicName: "templateRows", isSignal: true, isRequired: false, transformFunction: null }, outline: { classPropertyName: "outline", publicName: "outline", isSignal: true, isRequired: false, transformFunction: null }, outlineColor: { classPropertyName: "outlineColor", publicName: "outlineColor", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "gridClassName()" } }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1589
1606
|
}
|
|
1590
1607
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniGridComponent, decorators: [{
|
|
1591
1608
|
type: Component,
|
|
1592
1609
|
args: [{
|
|
1593
|
-
selector: '
|
|
1610
|
+
selector: '[uni-grid-layout], [grid-layout]',
|
|
1594
1611
|
imports: [],
|
|
1595
1612
|
template: `<ng-content></ng-content>`,
|
|
1596
1613
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
@@ -1601,18 +1618,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
1601
1618
|
class UniRowComponent extends UniBoxComponent {
|
|
1602
1619
|
display = input('flex', ...(ngDevMode ? [{ debugName: "display" }] : /* istanbul ignore next */ []));
|
|
1603
1620
|
flexDirection = input('row', ...(ngDevMode ? [{ debugName: "flexDirection" }] : /* istanbul ignore next */ []));
|
|
1621
|
+
/**
|
|
1622
|
+
* Defaults to `fit-content` (guards content collapse). Set `[minWidth]="0"`
|
|
1623
|
+
* when the row must shrink inside a constrained flex parent (scroll or
|
|
1624
|
+
* text truncation containment).
|
|
1625
|
+
*/
|
|
1604
1626
|
minWidth = input('fit-content', ...(ngDevMode ? [{ debugName: "minWidth" }] : /* istanbul ignore next */ []));
|
|
1605
1627
|
constructor() {
|
|
1606
1628
|
super();
|
|
1607
1629
|
}
|
|
1608
1630
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniRowComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1609
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniRowComponent, isStandalone: true, selector: "
|
|
1631
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniRowComponent, isStandalone: true, selector: "[uni-row-layout], [row-layout]", inputs: { display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, flexDirection: { classPropertyName: "flexDirection", publicName: "flexDirection", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1610
1632
|
}
|
|
1611
1633
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniRowComponent, decorators: [{
|
|
1612
1634
|
type: Component,
|
|
1613
1635
|
args: [{
|
|
1614
1636
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1615
|
-
selector: '
|
|
1637
|
+
selector: '[uni-row-layout], [row-layout]',
|
|
1616
1638
|
template: `<ng-content></ng-content>`,
|
|
1617
1639
|
}]
|
|
1618
1640
|
}], ctorParameters: () => [], propDecorators: { display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], flexDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "flexDirection", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }] } });
|
|
@@ -1620,18 +1642,23 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
1620
1642
|
class UniStackComponent extends UniBoxComponent {
|
|
1621
1643
|
display = input('flex', ...(ngDevMode ? [{ debugName: "display" }] : /* istanbul ignore next */ []));
|
|
1622
1644
|
flexDirection = input('column', ...(ngDevMode ? [{ debugName: "flexDirection" }] : /* istanbul ignore next */ []));
|
|
1645
|
+
/**
|
|
1646
|
+
* Defaults to `fit-content` (guards content collapse). Set `[minHeight]="0"`
|
|
1647
|
+
* when the stack must shrink inside a constrained flex parent (scroll
|
|
1648
|
+
* containment).
|
|
1649
|
+
*/
|
|
1623
1650
|
minHeight = input('fit-content', ...(ngDevMode ? [{ debugName: "minHeight" }] : /* istanbul ignore next */ []));
|
|
1624
1651
|
constructor() {
|
|
1625
1652
|
super();
|
|
1626
1653
|
}
|
|
1627
1654
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniStackComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1628
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniStackComponent, isStandalone: true, selector: "
|
|
1655
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniStackComponent, isStandalone: true, selector: "[uni-stack-layout], [stack-layout]", inputs: { display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, flexDirection: { classPropertyName: "flexDirection", publicName: "flexDirection", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1629
1656
|
}
|
|
1630
1657
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniStackComponent, decorators: [{
|
|
1631
1658
|
type: Component,
|
|
1632
1659
|
args: [{
|
|
1633
1660
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1634
|
-
selector: '
|
|
1661
|
+
selector: '[uni-stack-layout], [stack-layout]',
|
|
1635
1662
|
template: `<ng-content></ng-content>`,
|
|
1636
1663
|
}]
|
|
1637
1664
|
}], ctorParameters: () => [], propDecorators: { display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], flexDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "flexDirection", required: false }] }], minHeight: [{ type: i0.Input, args: [{ isSignal: true, alias: "minHeight", required: false }] }] } });
|
|
@@ -1643,13 +1670,13 @@ class UniWrapComponent extends UniBoxComponent {
|
|
|
1643
1670
|
super();
|
|
1644
1671
|
}
|
|
1645
1672
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniWrapComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1646
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniWrapComponent, isStandalone: true, selector: "
|
|
1673
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniWrapComponent, isStandalone: true, selector: "[uni-wrap-layout], [wrap-layout]", inputs: { display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, wrapItems: { classPropertyName: "wrapItems", publicName: "wrapItems", isSignal: true, isRequired: false, transformFunction: null } }, usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1647
1674
|
}
|
|
1648
1675
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniWrapComponent, decorators: [{
|
|
1649
1676
|
type: Component,
|
|
1650
1677
|
args: [{
|
|
1651
1678
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1652
|
-
selector: '
|
|
1679
|
+
selector: '[uni-wrap-layout], [wrap-layout]',
|
|
1653
1680
|
imports: [],
|
|
1654
1681
|
template: `<ng-content></ng-content>`,
|
|
1655
1682
|
}]
|
|
@@ -1798,31 +1825,31 @@ class UniButtonComponent extends BaseComponent {
|
|
|
1798
1825
|
return (Number.isNaN(fontSize) ? 16 : fontSize) + 4;
|
|
1799
1826
|
}, ...(ngDevMode ? [{ debugName: "symbolSize" }] : /* istanbul ignore next */ []));
|
|
1800
1827
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniButtonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1801
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniButtonComponent, isStandalone: true, selector: "button[uni-text-button],
|
|
1802
|
-
<
|
|
1828
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniButtonComponent, isStandalone: true, selector: "button[uni-text-button], button[text-button]", inputs: { disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, fullWidth: { classPropertyName: "fullWidth", publicName: "fullWidth", isSignal: true, isRequired: false, transformFunction: null }, symbolLeft: { classPropertyName: "symbolLeft", publicName: "symbolLeft", isSignal: true, isRequired: false, transformFunction: null }, symbolRight: { classPropertyName: "symbolRight", publicName: "symbolRight", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.disabled": "disable() || loading() || null", "attr.aria-busy": "loading() ? 'true' : null", "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'button' }], usesInheritance: true, hostDirectives: [{ directive: RippleDirective }], ngImport: i0, template: `@if (loading()) {
|
|
1829
|
+
<div box-layout [class]="spinnerBox"><uni-icon name="spinner" /></div>
|
|
1803
1830
|
}
|
|
1804
1831
|
@if (symbolLeft()) {
|
|
1805
|
-
<
|
|
1832
|
+
<uni-symbol [name]="symbolLeft()!" class="symbolLeft" />
|
|
1806
1833
|
}
|
|
1807
1834
|
<span><ng-content></ng-content></span>
|
|
1808
1835
|
@if (symbolRight()) {
|
|
1809
|
-
<
|
|
1836
|
+
<uni-symbol [name]="symbolRight()!" class="symbolRight" />
|
|
1810
1837
|
} `, isInline: true, dependencies: [{ kind: "component", type: // Keep this import
|
|
1811
|
-
UniIconComponent, selector: "uni-icon
|
|
1838
|
+
UniIconComponent, selector: "uni-icon", inputs: ["color", "name"] }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1812
1839
|
}
|
|
1813
1840
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniButtonComponent, decorators: [{
|
|
1814
1841
|
type: Component,
|
|
1815
1842
|
args: [{
|
|
1816
|
-
selector: 'button[uni-text-button],
|
|
1843
|
+
selector: 'button[uni-text-button], button[text-button]',
|
|
1817
1844
|
template: `@if (loading()) {
|
|
1818
|
-
<
|
|
1845
|
+
<div box-layout [class]="spinnerBox"><uni-icon name="spinner" /></div>
|
|
1819
1846
|
}
|
|
1820
1847
|
@if (symbolLeft()) {
|
|
1821
|
-
<
|
|
1848
|
+
<uni-symbol [name]="symbolLeft()!" class="symbolLeft" />
|
|
1822
1849
|
}
|
|
1823
1850
|
<span><ng-content></ng-content></span>
|
|
1824
1851
|
@if (symbolRight()) {
|
|
1825
|
-
<
|
|
1852
|
+
<uni-symbol [name]="symbolRight()!" class="symbolRight" />
|
|
1826
1853
|
} `,
|
|
1827
1854
|
providers: [{ provide: COMPONENT_NAME, useValue: 'button' }],
|
|
1828
1855
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
@@ -1872,12 +1899,12 @@ class UniButtonGroupComponent {
|
|
|
1872
1899
|
});
|
|
1873
1900
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1874
1901
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniButtonGroupComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1875
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: UniButtonGroupComponent, isStandalone: true, selector: "uni-button-group
|
|
1902
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: UniButtonGroupComponent, isStandalone: true, selector: "uni-button-group", host: { properties: { "class": "className()" } }, ngImport: i0, template: ` <ng-content></ng-content>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1876
1903
|
}
|
|
1877
1904
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniButtonGroupComponent, decorators: [{
|
|
1878
1905
|
type: Component,
|
|
1879
1906
|
args: [{
|
|
1880
|
-
selector: 'uni-button-group
|
|
1907
|
+
selector: 'uni-button-group',
|
|
1881
1908
|
imports: [],
|
|
1882
1909
|
template: ` <ng-content></ng-content>`,
|
|
1883
1910
|
host: { '[class]': 'className()' },
|
|
@@ -1893,26 +1920,56 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
1893
1920
|
|
|
1894
1921
|
class UniCardContentComponent extends BaseComponent {
|
|
1895
1922
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCardContentComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1896
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: UniCardContentComponent, isStandalone: true, selector: "uni-card-content
|
|
1923
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: UniCardContentComponent, isStandalone: true, selector: "uni-card-content", providers: [{ provide: COMPONENT_NAME, useValue: 'cardContent' }], usesInheritance: true, ngImport: i0, template: "<div [style]=\"style()\">\n <ng-content></ng-content>\n</div>\n", styles: [""], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1897
1924
|
}
|
|
1898
1925
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCardContentComponent, decorators: [{
|
|
1899
1926
|
type: Component,
|
|
1900
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-card-content
|
|
1927
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-card-content', imports: [], providers: [{ provide: COMPONENT_NAME, useValue: 'cardContent' }], template: "<div [style]=\"style()\">\n <ng-content></ng-content>\n</div>\n" }]
|
|
1901
1928
|
}] });
|
|
1902
1929
|
|
|
1930
|
+
/**
|
|
1931
|
+
* Typeface defaults by host element, so semantic HTML and the type scale
|
|
1932
|
+
* reinforce each other: `<h1 uni-text>` is already headline-large.
|
|
1933
|
+
*/
|
|
1934
|
+
const TagTypefaces = {
|
|
1935
|
+
h1: 'headline-large',
|
|
1936
|
+
h2: 'headline-medium',
|
|
1937
|
+
h3: 'headline-small',
|
|
1938
|
+
h4: 'title-large',
|
|
1939
|
+
h5: 'title-medium',
|
|
1940
|
+
h6: 'title-small',
|
|
1941
|
+
p: 'body-1-long',
|
|
1942
|
+
small: 'caption',
|
|
1943
|
+
figcaption: 'caption',
|
|
1944
|
+
blockquote: 'quote',
|
|
1945
|
+
label: 'label',
|
|
1946
|
+
};
|
|
1947
|
+
/**
|
|
1948
|
+
* The typography primitive, applied as an attribute to any element so
|
|
1949
|
+
* semantics stay yours. The attribute value is the typeface:
|
|
1950
|
+
* `<h1 uni-text="display-small">`, `<span uni-text="caption">`, dynamic via
|
|
1951
|
+
* `[uni-text]="role()"`. With no value, the typeface is inferred from the
|
|
1952
|
+
* host element (h1 → headline-large, p → body-1-long, …), falling back to
|
|
1953
|
+
* `title-small`; the `typeface` input remains as an explicit override.
|
|
1954
|
+
*/
|
|
1903
1955
|
class UniTextComponent {
|
|
1904
1956
|
theme = inject(ThemeService);
|
|
1905
|
-
|
|
1957
|
+
tag = inject(ElementRef).nativeElement.tagName.toLowerCase();
|
|
1958
|
+
/** Typeface via the selector attribute: `uni-text="headline-large"`. */
|
|
1959
|
+
uniText = input('', { ...(ngDevMode ? { debugName: "uniText" } : /* istanbul ignore next */ {}), alias: 'uni-text' });
|
|
1960
|
+
/** Explicit typeface; the attribute value wins when both are set. */
|
|
1961
|
+
typeface = input(undefined, ...(ngDevMode ? [{ debugName: "typeface" }] : /* istanbul ignore next */ []));
|
|
1906
1962
|
color = input(...(ngDevMode ? [undefined, { debugName: "color" }] : /* istanbul ignore next */ []));
|
|
1907
1963
|
display = input(...(ngDevMode ? [undefined, { debugName: "display" }] : /* istanbul ignore next */ []));
|
|
1908
1964
|
align = input(...(ngDevMode ? [undefined, { debugName: "align" }] : /* istanbul ignore next */ []));
|
|
1909
1965
|
nowrap = input(...(ngDevMode ? [undefined, { debugName: "nowrap" }] : /* istanbul ignore next */ []));
|
|
1910
1966
|
maxWidth = input(...(ngDevMode ? [undefined, { debugName: "maxWidth" }] : /* istanbul ignore next */ []));
|
|
1911
1967
|
ellipsis = input(false, ...(ngDevMode ? [{ debugName: "ellipsis" }] : /* istanbul ignore next */ []));
|
|
1968
|
+
resolvedTypeface = computed(() => this.uniText() || this.typeface() || TagTypefaces[this.tag] || 'title-small', ...(ngDevMode ? [{ debugName: "resolvedTypeface" }] : /* istanbul ignore next */ []));
|
|
1912
1969
|
className = computed(() => {
|
|
1913
1970
|
return css([
|
|
1914
1971
|
{
|
|
1915
|
-
...this.theme.typeface(this.
|
|
1972
|
+
...this.theme.typeface(this.resolvedTypeface()),
|
|
1916
1973
|
...this.theme.color(this.color()),
|
|
1917
1974
|
display: this.display(),
|
|
1918
1975
|
},
|
|
@@ -1938,18 +1995,18 @@ class UniTextComponent {
|
|
|
1938
1995
|
]);
|
|
1939
1996
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
1940
1997
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTextComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1941
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniTextComponent, isStandalone: true, selector: "uni-text
|
|
1998
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniTextComponent, isStandalone: true, selector: "[uni-text]", inputs: { uniText: { classPropertyName: "uniText", publicName: "uni-text", isSignal: true, isRequired: false, transformFunction: null }, typeface: { classPropertyName: "typeface", publicName: "typeface", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, align: { classPropertyName: "align", publicName: "align", isSignal: true, isRequired: false, transformFunction: null }, nowrap: { classPropertyName: "nowrap", publicName: "nowrap", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, ellipsis: { classPropertyName: "ellipsis", publicName: "ellipsis", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, ngImport: i0, template: '<ng-content></ng-content>', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1942
1999
|
}
|
|
1943
2000
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTextComponent, decorators: [{
|
|
1944
2001
|
type: Component,
|
|
1945
2002
|
args: [{
|
|
1946
|
-
selector: 'uni-text
|
|
2003
|
+
selector: '[uni-text]',
|
|
1947
2004
|
imports: [],
|
|
1948
2005
|
template: '<ng-content></ng-content>',
|
|
1949
2006
|
host: { '[class]': 'className()' },
|
|
1950
2007
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1951
2008
|
}]
|
|
1952
|
-
}], propDecorators: { typeface: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeface", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], nowrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "nowrap", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], ellipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "ellipsis", required: false }] }] } });
|
|
2009
|
+
}], propDecorators: { uniText: [{ type: i0.Input, args: [{ isSignal: true, alias: "uni-text", required: false }] }], typeface: [{ type: i0.Input, args: [{ isSignal: true, alias: "typeface", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], align: [{ type: i0.Input, args: [{ isSignal: true, alias: "align", required: false }] }], nowrap: [{ type: i0.Input, args: [{ isSignal: true, alias: "nowrap", required: false }] }], maxWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxWidth", required: false }] }], ellipsis: [{ type: i0.Input, args: [{ isSignal: true, alias: "ellipsis", required: false }] }] } });
|
|
1953
2010
|
|
|
1954
2011
|
class UniCardComponent extends BaseComponent {
|
|
1955
2012
|
/**
|
|
@@ -1964,11 +2021,11 @@ class UniCardComponent extends BaseComponent {
|
|
|
1964
2021
|
...this.style(),
|
|
1965
2022
|
}), ...(ngDevMode ? [{ debugName: "cardStyle" }] : /* istanbul ignore next */ []));
|
|
1966
2023
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCardComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1967
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: UniCardComponent, isStandalone: true, selector: "uni-card
|
|
2024
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: UniCardComponent, isStandalone: true, selector: "uni-card", providers: [{ provide: COMPONENT_NAME, useValue: 'card' }], usesInheritance: true, ngImport: i0, template: "<div [style]=\"cardStyle()\">\n <ng-content></ng-content>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1968
2025
|
}
|
|
1969
2026
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCardComponent, decorators: [{
|
|
1970
2027
|
type: Component,
|
|
1971
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-card
|
|
2028
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-card', imports: [], providers: [{ provide: COMPONENT_NAME, useValue: 'card' }], template: "<div [style]=\"cardStyle()\">\n <ng-content></ng-content>\n</div>\n" }]
|
|
1972
2029
|
}] });
|
|
1973
2030
|
|
|
1974
2031
|
class UniCardHeaderComponent extends BaseComponent {
|
|
@@ -1989,11 +2046,11 @@ class UniCardHeaderComponent extends BaseComponent {
|
|
|
1989
2046
|
alignItems: 'center',
|
|
1990
2047
|
});
|
|
1991
2048
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCardHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1992
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniCardHeaderComponent, isStandalone: true, selector: "uni-card-header
|
|
2049
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniCardHeaderComponent, isStandalone: true, selector: "uni-card-header", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, titleTextRole: { classPropertyName: "titleTextRole", publicName: "titleTextRole", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: COMPONENT_NAME, useValue: 'cardHeader' }], usesInheritance: true, ngImport: i0, template: "<div [style]=\"style()\" [ngClass]=\"className\">\n <span uni-text [typeface]=\"titleTextRole()\">{{ title() }}</span>\n <ng-content></ng-content>\n</div>\n", styles: [""], dependencies: [{ kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1993
2050
|
}
|
|
1994
2051
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCardHeaderComponent, decorators: [{
|
|
1995
2052
|
type: Component,
|
|
1996
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-card-header
|
|
2053
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-card-header', imports: [UniTextComponent, NgClass], providers: [{ provide: COMPONENT_NAME, useValue: 'cardHeader' }], template: "<div [style]=\"style()\" [ngClass]=\"className\">\n <span uni-text [typeface]=\"titleTextRole()\">{{ title() }}</span>\n <ng-content></ng-content>\n</div>\n" }]
|
|
1997
2054
|
}], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], titleTextRole: [{ type: i0.Input, args: [{ isSignal: true, alias: "titleTextRole", required: false }] }] } });
|
|
1998
2055
|
|
|
1999
2056
|
class UniCheckboxComponent extends BaseComponent {
|
|
@@ -2048,16 +2105,17 @@ class UniCheckboxComponent extends BaseComponent {
|
|
|
2048
2105
|
display: 'block',
|
|
2049
2106
|
},
|
|
2050
2107
|
'& .checkbox svg .checkbox-box': {
|
|
2051
|
-
fill: '
|
|
2108
|
+
fill: this.getThemeColor(this.componentOptions().boxColor ?? 'surface'),
|
|
2052
2109
|
stroke: this.getThemeColor(this.variant()),
|
|
2053
2110
|
strokeWidth: 2,
|
|
2054
2111
|
rx: this.componentOptions().borderRadius || 2,
|
|
2055
2112
|
ry: this.componentOptions().borderRadius || 2,
|
|
2056
2113
|
transition: 'all 0.2s ease',
|
|
2057
2114
|
},
|
|
2115
|
+
// Check/dash draw on the variant-filled box, so they wear its on-color.
|
|
2058
2116
|
'& .checkbox svg .checkbox-check': {
|
|
2059
2117
|
fill: 'none',
|
|
2060
|
-
stroke:
|
|
2118
|
+
stroke: this.getOnColor(this.variant()),
|
|
2061
2119
|
strokeWidth: 2,
|
|
2062
2120
|
strokeLinecap: 'round',
|
|
2063
2121
|
strokeLinejoin: 'round',
|
|
@@ -2066,7 +2124,7 @@ class UniCheckboxComponent extends BaseComponent {
|
|
|
2066
2124
|
transition: 'all 0.5s ease',
|
|
2067
2125
|
},
|
|
2068
2126
|
'& .checkbox svg .checkbox-dash': {
|
|
2069
|
-
stroke:
|
|
2127
|
+
stroke: this.getOnColor(this.variant()),
|
|
2070
2128
|
strokeWidth: 2,
|
|
2071
2129
|
strokeLinecap: 'round',
|
|
2072
2130
|
opacity: 0,
|
|
@@ -2116,12 +2174,17 @@ class UniCheckboxComponent extends BaseComponent {
|
|
|
2116
2174
|
const colors = this.theme.colors();
|
|
2117
2175
|
return colors[token] ? colors[token] : colors['primary'];
|
|
2118
2176
|
}
|
|
2177
|
+
/** The content color paired with a variant fill (on-primary, on-warn, …). */
|
|
2178
|
+
getOnColor(variant) {
|
|
2179
|
+
const colors = this.theme.colors();
|
|
2180
|
+
return colors[`on-${variant}`] ?? colors['on-primary'];
|
|
2181
|
+
}
|
|
2119
2182
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCheckboxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2120
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniCheckboxComponent, isStandalone: true, selector: "uni-checkbox
|
|
2183
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniCheckboxComponent, isStandalone: true, selector: "uni-checkbox", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, dirty: { classPropertyName: "dirty", publicName: "dirty", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", touched: "touchedChange", indeterminate: "indeterminateChange" }, providers: [{ provide: COMPONENT_NAME, useValue: 'checkbox' }], usesInheritance: true, ngImport: i0, template: "<label [class]=\"checkboxLabel()\">\n <input\n type=\"checkbox\"\n [class]=\"checkboxInput()\"\n [checked]=\"checked()\"\n [indeterminate]=\"indeterminate()\"\n (change)=\"handleChange($event)\"\n [disabled]=\"disabled()\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n />\n <div class=\"checkbox\">\n <svg viewBox=\"0 0 20 20\" aria-hidden=\"true\">\n <rect class=\"checkbox-box\" x=\"1\" y=\"1\" width=\"18\" height=\"18\"></rect>\n <polyline class=\"checkbox-check\" points=\"4 11 8 15 16 6\"></polyline>\n <line class=\"checkbox-dash\" x1=\"5\" y1=\"10\" x2=\"15\" y2=\"10\"></line>\n </svg>\n </div>\n @if (label()) {\n <span uni-text=\"label\">{{ label() }}</span>\n }\n</label>\n", dependencies: [{ kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2121
2184
|
}
|
|
2122
2185
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniCheckboxComponent, decorators: [{
|
|
2123
2186
|
type: Component,
|
|
2124
|
-
args: [{ selector: 'uni-checkbox
|
|
2187
|
+
args: [{ selector: 'uni-checkbox', imports: [UniTextComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'checkbox' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [class]=\"checkboxLabel()\">\n <input\n type=\"checkbox\"\n [class]=\"checkboxInput()\"\n [checked]=\"checked()\"\n [indeterminate]=\"indeterminate()\"\n (change)=\"handleChange($event)\"\n [disabled]=\"disabled()\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n />\n <div class=\"checkbox\">\n <svg viewBox=\"0 0 20 20\" aria-hidden=\"true\">\n <rect class=\"checkbox-box\" x=\"1\" y=\"1\" width=\"18\" height=\"18\"></rect>\n <polyline class=\"checkbox-check\" points=\"4 11 8 15 16 6\"></polyline>\n <line class=\"checkbox-dash\" x1=\"5\" y1=\"10\" x2=\"15\" y2=\"10\"></line>\n </svg>\n </div>\n @if (label()) {\n <span uni-text=\"label\">{{ label() }}</span>\n }\n</label>\n" }]
|
|
2125
2188
|
}], propDecorators: { checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], dirty: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirty", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], ariaDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedBy", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], indeterminate: [{ type: i0.Input, args: [{ isSignal: true, alias: "indeterminate", required: false }] }, { type: i0.Output, args: ["indeterminateChange"] }] } });
|
|
2126
2189
|
|
|
2127
2190
|
class BodyRenderDirective {
|
|
@@ -2255,15 +2318,15 @@ class UniIconButtonComponent {
|
|
|
2255
2318
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniIconButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2256
2319
|
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniIconButtonComponent, isStandalone: true, selector: "button[uni-icon-button], button[icon-button]", inputs: { ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, iconName: { classPropertyName: "iconName", publicName: "iconName", isSignal: true, isRequired: false, transformFunction: null }, symbolName: { classPropertyName: "symbolName", publicName: "symbolName", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, disable: { classPropertyName: "disable", publicName: "disable", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, opticalSize: { classPropertyName: "opticalSize", publicName: "opticalSize", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.disabled": "disable() || loading() || null", "attr.aria-busy": "loading() ? 'true' : null", "attr.aria-label": "ariaLabel() || null", "class": "className()" } }, hostDirectives: [{ directive: RippleDirective }], ngImport: i0, template: `
|
|
2257
2320
|
@if (loading()) {
|
|
2258
|
-
<
|
|
2321
|
+
<uni-icon name="spinner" />
|
|
2259
2322
|
} @else if (symbolName()) {
|
|
2260
|
-
<
|
|
2323
|
+
<uni-symbol [name]="symbolName()!" [opticalSize]="opticalSize()" />
|
|
2261
2324
|
} @else if (iconName()) {
|
|
2262
|
-
<
|
|
2325
|
+
<uni-icon [name]="iconName()!" />
|
|
2263
2326
|
}
|
|
2264
2327
|
<!-- Projected text is the button's accessible name (visually hidden) -->
|
|
2265
2328
|
<span [class]="srOnlyClass"><ng-content /></span>
|
|
2266
|
-
`, isInline: true, dependencies: [{ kind: "component", type: UniSymbolComponent, selector: "uni-symbol
|
|
2329
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }, { kind: "component", type: UniIconComponent, selector: "uni-icon", inputs: ["color", "name"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2267
2330
|
}
|
|
2268
2331
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniIconButtonComponent, decorators: [{
|
|
2269
2332
|
type: Component,
|
|
@@ -2272,11 +2335,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
2272
2335
|
imports: [UniSymbolComponent, UniIconComponent],
|
|
2273
2336
|
template: `
|
|
2274
2337
|
@if (loading()) {
|
|
2275
|
-
<
|
|
2338
|
+
<uni-icon name="spinner" />
|
|
2276
2339
|
} @else if (symbolName()) {
|
|
2277
|
-
<
|
|
2340
|
+
<uni-symbol [name]="symbolName()!" [opticalSize]="opticalSize()" />
|
|
2278
2341
|
} @else if (iconName()) {
|
|
2279
|
-
<
|
|
2342
|
+
<uni-icon [name]="iconName()!" />
|
|
2280
2343
|
}
|
|
2281
2344
|
<!-- Projected text is the button's accessible name (visually hidden) -->
|
|
2282
2345
|
<span [class]="srOnlyClass"><ng-content /></span>
|
|
@@ -2368,7 +2431,7 @@ class UniDataSearchComponent extends BaseComponent {
|
|
|
2368
2431
|
this.searchValue.set('');
|
|
2369
2432
|
}
|
|
2370
2433
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDataSearchComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2371
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniDataSearchComponent, isStandalone: true, selector: "uni-data-search", inputs: { datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: COMPONENT_NAME, useValue: 'dataSearch' }], usesInheritance: true, ngImport: i0, template: "<div\n row-layout\n alignItems=\"center\"\n [border]=\"componentOptions().border\"\n [height]=\"26\"\n [borderRadius]=\"componentOptions().borderRadius\"\n paddingLeft=\"xs\"\n>\n <div center-layout [height]=\"18\" [width]=\"18\" paddingRight=\"xs\">\n <uni-icon name=\"search\" />\n </div>\n <input\n type=\"text\"\n (input)=\"onInput($event)\"\n [class]=\"inputClassName\"\n [placeholder]=\"placeholder()\"\n [value]=\"searchValue()\"\n />\n <div row-layout alignItems=\"center\" [width]=\"22\">\n @if (!!searchValue()) {\n <button icon-button (click)=\"clearFilter()\" symbolName=\"close\" size=\"sm\">Clear Search</button>\n }\n </div>\n</div>\n", dependencies: [{ kind: "component", type: UniRowComponent, selector: "
|
|
2434
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniDataSearchComponent, isStandalone: true, selector: "uni-data-search", inputs: { datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, fields: { classPropertyName: "fields", publicName: "fields", isSignal: true, isRequired: false, transformFunction: null } }, providers: [{ provide: COMPONENT_NAME, useValue: 'dataSearch' }], usesInheritance: true, ngImport: i0, template: "<div\n row-layout\n alignItems=\"center\"\n [border]=\"componentOptions().border\"\n [height]=\"26\"\n [borderRadius]=\"componentOptions().borderRadius\"\n paddingLeft=\"xs\"\n>\n <div center-layout [height]=\"18\" [width]=\"18\" paddingRight=\"xs\">\n <uni-icon name=\"search\" />\n </div>\n <input\n type=\"text\"\n (input)=\"onInput($event)\"\n [class]=\"inputClassName\"\n [placeholder]=\"placeholder()\"\n [value]=\"searchValue()\"\n />\n <div row-layout alignItems=\"center\" [width]=\"22\">\n @if (!!searchValue()) {\n <button icon-button (click)=\"clearFilter()\" symbolName=\"close\" size=\"sm\">Clear Search</button>\n }\n </div>\n</div>\n", dependencies: [{ kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }, { kind: "component", type: UniIconButtonComponent, selector: "button[uni-icon-button], button[icon-button]", inputs: ["ariaLabel", "iconName", "symbolName", "variant", "size", "disable", "loading", "opticalSize"] }, { kind: "component", type: UniIconComponent, selector: "uni-icon", inputs: ["color", "name"] }, { kind: "component", type: UniCenterComponent, selector: "[uni-center-layout], [center-layout]", inputs: ["display", "justifyContent", "alignItems"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2372
2435
|
}
|
|
2373
2436
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDataSearchComponent, decorators: [{
|
|
2374
2437
|
type: Component,
|
|
@@ -2507,7 +2570,7 @@ class UniScrollAreaComponent {
|
|
|
2507
2570
|
});
|
|
2508
2571
|
}
|
|
2509
2572
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniScrollAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2510
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniScrollAreaComponent, isStandalone: true, selector: "
|
|
2573
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniScrollAreaComponent, isStandalone: true, selector: "[uni-scroll-area], [scroll-area]", inputs: { color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, paddingHorizontal: { classPropertyName: "paddingHorizontal", publicName: "paddingHorizontal", isSignal: true, isRequired: false, transformFunction: null }, paddingVertical: { classPropertyName: "paddingVertical", publicName: "paddingVertical", isSignal: true, isRequired: false, transformFunction: null }, paddingLeft: { classPropertyName: "paddingLeft", publicName: "paddingLeft", isSignal: true, isRequired: false, transformFunction: null }, paddingRight: { classPropertyName: "paddingRight", publicName: "paddingRight", isSignal: true, isRequired: false, transformFunction: null }, paddingTop: { classPropertyName: "paddingTop", publicName: "paddingTop", isSignal: true, isRequired: false, transformFunction: null }, paddingBottom: { classPropertyName: "paddingBottom", publicName: "paddingBottom", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, appearance: { classPropertyName: "appearance", publicName: "appearance", isSignal: true, isRequired: false, transformFunction: null }, autoHeightDisabled: { classPropertyName: "autoHeightDisabled", publicName: "autoHeightDisabled", isSignal: true, isRequired: false, transformFunction: null }, verticalScrollPadding: { classPropertyName: "verticalScrollPadding", publicName: "verticalScrollPadding", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { scrollable: "scrollable" }, host: { properties: { "class": "className()" } }, viewQueries: [{ propertyName: "viewport", first: true, predicate: ["viewport"], descendants: true, isSignal: true }, { propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }], ngImport: i0, template: `<div #viewport [class]="viewportClassName()">
|
|
2511
2574
|
<div
|
|
2512
2575
|
#content
|
|
2513
2576
|
[class]="contentClassName()"
|
|
@@ -2520,7 +2583,7 @@ class UniScrollAreaComponent {
|
|
|
2520
2583
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniScrollAreaComponent, decorators: [{
|
|
2521
2584
|
type: Component,
|
|
2522
2585
|
args: [{
|
|
2523
|
-
selector: '
|
|
2586
|
+
selector: '[uni-scroll-area], [scroll-area]',
|
|
2524
2587
|
imports: [],
|
|
2525
2588
|
template: `<div #viewport [class]="viewportClassName()">
|
|
2526
2589
|
<div
|
|
@@ -2589,7 +2652,7 @@ class UniSortHeaderComponent {
|
|
|
2589
2652
|
});
|
|
2590
2653
|
}
|
|
2591
2654
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSortHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2592
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniSortHeaderComponent, isStandalone: true, selector: "uni-sort-header", inputs: { column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: false, transformFunction: null }, datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, ngImport: i0, template: "<button type=\"button\" [class]=\"buttonClass\" (click)=\"cycleSort()\">\n <ng-content></ng-content>\n <div class=\"sort-icon\" [class]=\"direction()\">\n <uni-symbol name=\"arrow_upward\" />\n </div>\n</button>\n", dependencies: [{ kind: "component", type: UniSymbolComponent, selector: "uni-symbol
|
|
2655
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniSortHeaderComponent, isStandalone: true, selector: "uni-sort-header", inputs: { column: { classPropertyName: "column", publicName: "column", isSignal: true, isRequired: false, transformFunction: null }, datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, ngImport: i0, template: "<button type=\"button\" [class]=\"buttonClass\" (click)=\"cycleSort()\">\n <ng-content></ng-content>\n <div class=\"sort-icon\" [class]=\"direction()\">\n <uni-symbol name=\"arrow_upward\" />\n </div>\n</button>\n", dependencies: [{ kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2593
2656
|
}
|
|
2594
2657
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSortHeaderComponent, decorators: [{
|
|
2595
2658
|
type: Component,
|
|
@@ -2750,11 +2813,11 @@ class UniDataTableComponent extends BaseComponent {
|
|
|
2750
2813
|
return name ? this.theme.theme().borders[name] : undefined;
|
|
2751
2814
|
}
|
|
2752
2815
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDataTableComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
2753
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniDataTableComponent, isStandalone: true, selector: "uni-data-table
|
|
2816
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniDataTableComponent, isStandalone: true, selector: "uni-data-table", inputs: { datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: true, transformFunction: null }, columns: { classPropertyName: "columns", publicName: "columns", isSignal: true, isRequired: true, transformFunction: null }, detailRowTemplate: { classPropertyName: "detailRowTemplate", publicName: "detailRowTemplate", isSignal: true, isRequired: false, transformFunction: null }, useMultiSelect: { classPropertyName: "useMultiSelect", publicName: "useMultiSelect", isSignal: true, isRequired: false, transformFunction: null }, useRowClick: { classPropertyName: "useRowClick", publicName: "useRowClick", isSignal: true, isRequired: false, transformFunction: null }, highlight: { classPropertyName: "highlight", publicName: "highlight", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { rowSelect: "rowSelect", rowClick: "rowClick" }, providers: [{ provide: COMPONENT_NAME, useValue: 'dataTable' }], usesInheritance: true, ngImport: i0, template: "@let ds = datasource();\n@if (ds) {\n <div\n box-layout\n [color]=\"componentOptions().color\"\n [border]=\"componentOptions().border\"\n [borderRadius]=\"componentOptions().borderRadius\"\n [elevation]=\"componentOptions().elevation\"\n overflow=\"hidden\"\n >\n <div\n box-layout\n [padding]=\"componentOptions().headerPadding\"\n [color]=\"componentOptions().headerColor\"\n [class]=\"headerClass()\"\n >\n <ng-content select=\"data-table-header\"></ng-content>\n </div>\n\n <div box-layout [height]=\"height()\" position=\"relative\" [attr.aria-busy]=\"isLoading()\">\n <div scroll-area [verticalScrollPadding]=\"0\" (scrollable)=\"handleScrollable($event)\">\n <table [class]=\"tableClass()\">\n <thead>\n <tr>\n @for (column of columns(); track column) {\n <th\n scope=\"col\"\n [attr.aria-sort]=\"ariaSort(column)\"\n [class]=\"thClass()\"\n [class.scrollable]=\"scrollable()\"\n [class.sticky]=\"column.isSticky\"\n [style.text-align]=\"column.textAlign\"\n >\n <uni-sort-header [datasource]=\"datasource()\" [column]=\"column.columnDef\">\n <span uni-text [typeface]=\"componentOptions().thTextRole\">{{ column.header }}</span>\n </uni-sort-header>\n </th>\n }\n </tr>\n </thead>\n <tbody>\n @for (record of ds.records(); track record; let i = $index) {\n <tr\n [class]=\"trClass()\"\n [attr.tabindex]=\"useRowClick() ? 0 : null\"\n (click)=\"handleRowClick(record, $index)\"\n (keydown.enter)=\"useRowClick() && handleRowClick(record, $index)\"\n (keydown.space)=\"\n useRowClick() && handleRowClick(record, $index);\n useRowClick() && $event.preventDefault()\n \"\n >\n @for (column of columns(); track column) {\n <td\n [class]=\"tdClass()\"\n [class.scrollable]=\"scrollable()\"\n [class.sticky]=\"column.isSticky\"\n [class.template]=\"!!column.template\"\n [style.text-align]=\"column.textAlign\"\n >\n @if (column.template) {\n <ng-container\n [ngTemplateOutlet]=\"column.template\"\n [ngTemplateOutletContext]=\"record\"\n ></ng-container>\n } @else {\n <span uni-text [typeface]=\"componentOptions().tdTextRole\">\n @if (!column.cell) {\n {{ record[column.columnDef] }}\n } @else {\n {{ column.cell(record) }}\n }\n </span>\n }\n </td>\n }\n </tr>\n @if (detailRowTemplate()) {\n <!-- Collapsed detail rows are inert: invisible to screen\n readers and unreachable by keyboard until expanded -->\n <tr\n [class]=\"detailRowClass()\"\n [class.expanded]=\"expandedIndex() === $index\"\n [attr.inert]=\"expandedIndex() === $index ? null : ''\"\n >\n <td [attr.colspan]=\"columns().length\">\n <div class=\"detail-content-wrapper\">\n <div class=\"detail-inner\">\n <ng-container\n [ngTemplateOutlet]=\"detailRowTemplate()\"\n [ngTemplateOutletContext]=\"{\n $implicit: record,\n index: i,\n }\"\n ></ng-container>\n </div>\n </div>\n </td>\n </tr>\n }\n }\n </tbody>\n </table>\n </div>\n\n <!-- Loading Overlay -->\n @if (isLoading()) {\n <div\n uni-center-layout\n role=\"status\"\n aria-label=\"Loading\"\n position=\"absolute\"\n [inset]=\"0\"\n [backgroundColor]=\"componentOptions().loadingOverlayColor\"\n [class]=\"loadingOverlayClass\"\n zIndex=\"overlay\"\n >\n <!-- Loading Spinner -->\n <div\n uni-box-layout\n [height]=\"componentOptions().loadingSpinnerSize\"\n [width]=\"componentOptions().loadingSpinnerSize\"\n >\n <uni-icon name=\"spinner\" [color]=\"componentOptions().loadingSpinnerColor\" />\n </div>\n </div>\n }\n </div>\n\n <div\n box-layout\n [padding]=\"componentOptions().footerPadding\"\n [color]=\"componentOptions().footerColor\"\n [class]=\"footerClass()\"\n >\n <ng-content select=\"data-table-footer\"></ng-content>\n </div>\n </div>\n}\n", dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniScrollAreaComponent, selector: "[uni-scroll-area], [scroll-area]", inputs: ["color", "borderRadius", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "height", "width", "appearance", "autoHeightDisabled", "verticalScrollPadding"], outputs: ["scrollable"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniSortHeaderComponent, selector: "uni-sort-header", inputs: ["column", "datasource"] }, { kind: "component", type: UniIconComponent, selector: "uni-icon", inputs: ["color", "name"] }, { kind: "component", type: UniCenterComponent, selector: "[uni-center-layout], [center-layout]", inputs: ["display", "justifyContent", "alignItems"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2754
2817
|
}
|
|
2755
2818
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDataTableComponent, decorators: [{
|
|
2756
2819
|
type: Component,
|
|
2757
|
-
args: [{ selector: 'uni-data-table
|
|
2820
|
+
args: [{ selector: 'uni-data-table', imports: [
|
|
2758
2821
|
NgTemplateOutlet,
|
|
2759
2822
|
UniBoxComponent,
|
|
2760
2823
|
UniScrollAreaComponent,
|
|
@@ -2762,7 +2825,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
2762
2825
|
UniSortHeaderComponent,
|
|
2763
2826
|
UniIconComponent,
|
|
2764
2827
|
UniCenterComponent,
|
|
2765
|
-
], providers: [{ provide: COMPONENT_NAME, useValue: 'dataTable' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let ds = datasource();\n@if (ds) {\n <div\n box-layout\n [color]=\"componentOptions().color\"\n [border]=\"componentOptions().border\"\n [borderRadius]=\"componentOptions().borderRadius\"\n [elevation]=\"componentOptions().elevation\"\n overflow=\"hidden\"\n >\n <div\n box-layout\n [padding]=\"componentOptions().headerPadding\"\n [color]=\"componentOptions().headerColor\"\n [class]=\"headerClass()\"\n >\n <ng-content select=\"data-table-header\"></ng-content>\n </div>\n\n <div box-layout [height]=\"height()\" position=\"relative\" [attr.aria-busy]=\"isLoading()\">\n <
|
|
2828
|
+
], providers: [{ provide: COMPONENT_NAME, useValue: 'dataTable' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let ds = datasource();\n@if (ds) {\n <div\n box-layout\n [color]=\"componentOptions().color\"\n [border]=\"componentOptions().border\"\n [borderRadius]=\"componentOptions().borderRadius\"\n [elevation]=\"componentOptions().elevation\"\n overflow=\"hidden\"\n >\n <div\n box-layout\n [padding]=\"componentOptions().headerPadding\"\n [color]=\"componentOptions().headerColor\"\n [class]=\"headerClass()\"\n >\n <ng-content select=\"data-table-header\"></ng-content>\n </div>\n\n <div box-layout [height]=\"height()\" position=\"relative\" [attr.aria-busy]=\"isLoading()\">\n <div scroll-area [verticalScrollPadding]=\"0\" (scrollable)=\"handleScrollable($event)\">\n <table [class]=\"tableClass()\">\n <thead>\n <tr>\n @for (column of columns(); track column) {\n <th\n scope=\"col\"\n [attr.aria-sort]=\"ariaSort(column)\"\n [class]=\"thClass()\"\n [class.scrollable]=\"scrollable()\"\n [class.sticky]=\"column.isSticky\"\n [style.text-align]=\"column.textAlign\"\n >\n <uni-sort-header [datasource]=\"datasource()\" [column]=\"column.columnDef\">\n <span uni-text [typeface]=\"componentOptions().thTextRole\">{{ column.header }}</span>\n </uni-sort-header>\n </th>\n }\n </tr>\n </thead>\n <tbody>\n @for (record of ds.records(); track record; let i = $index) {\n <tr\n [class]=\"trClass()\"\n [attr.tabindex]=\"useRowClick() ? 0 : null\"\n (click)=\"handleRowClick(record, $index)\"\n (keydown.enter)=\"useRowClick() && handleRowClick(record, $index)\"\n (keydown.space)=\"\n useRowClick() && handleRowClick(record, $index);\n useRowClick() && $event.preventDefault()\n \"\n >\n @for (column of columns(); track column) {\n <td\n [class]=\"tdClass()\"\n [class.scrollable]=\"scrollable()\"\n [class.sticky]=\"column.isSticky\"\n [class.template]=\"!!column.template\"\n [style.text-align]=\"column.textAlign\"\n >\n @if (column.template) {\n <ng-container\n [ngTemplateOutlet]=\"column.template\"\n [ngTemplateOutletContext]=\"record\"\n ></ng-container>\n } @else {\n <span uni-text [typeface]=\"componentOptions().tdTextRole\">\n @if (!column.cell) {\n {{ record[column.columnDef] }}\n } @else {\n {{ column.cell(record) }}\n }\n </span>\n }\n </td>\n }\n </tr>\n @if (detailRowTemplate()) {\n <!-- Collapsed detail rows are inert: invisible to screen\n readers and unreachable by keyboard until expanded -->\n <tr\n [class]=\"detailRowClass()\"\n [class.expanded]=\"expandedIndex() === $index\"\n [attr.inert]=\"expandedIndex() === $index ? null : ''\"\n >\n <td [attr.colspan]=\"columns().length\">\n <div class=\"detail-content-wrapper\">\n <div class=\"detail-inner\">\n <ng-container\n [ngTemplateOutlet]=\"detailRowTemplate()\"\n [ngTemplateOutletContext]=\"{\n $implicit: record,\n index: i,\n }\"\n ></ng-container>\n </div>\n </div>\n </td>\n </tr>\n }\n }\n </tbody>\n </table>\n </div>\n\n <!-- Loading Overlay -->\n @if (isLoading()) {\n <div\n uni-center-layout\n role=\"status\"\n aria-label=\"Loading\"\n position=\"absolute\"\n [inset]=\"0\"\n [backgroundColor]=\"componentOptions().loadingOverlayColor\"\n [class]=\"loadingOverlayClass\"\n zIndex=\"overlay\"\n >\n <!-- Loading Spinner -->\n <div\n uni-box-layout\n [height]=\"componentOptions().loadingSpinnerSize\"\n [width]=\"componentOptions().loadingSpinnerSize\"\n >\n <uni-icon name=\"spinner\" [color]=\"componentOptions().loadingSpinnerColor\" />\n </div>\n </div>\n }\n </div>\n\n <div\n box-layout\n [padding]=\"componentOptions().footerPadding\"\n [color]=\"componentOptions().footerColor\"\n [class]=\"footerClass()\"\n >\n <ng-content select=\"data-table-footer\"></ng-content>\n </div>\n </div>\n}\n" }]
|
|
2766
2829
|
}], propDecorators: { datasource: [{ type: i0.Input, args: [{ isSignal: true, alias: "datasource", required: true }] }], columns: [{ type: i0.Input, args: [{ isSignal: true, alias: "columns", required: true }] }], detailRowTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "detailRowTemplate", required: false }] }], useMultiSelect: [{ type: i0.Input, args: [{ isSignal: true, alias: "useMultiSelect", required: false }] }], useRowClick: [{ type: i0.Input, args: [{ isSignal: true, alias: "useRowClick", required: false }] }], highlight: [{ type: i0.Input, args: [{ isSignal: true, alias: "highlight", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], rowSelect: [{ type: i0.Output, args: ["rowSelect"] }], rowClick: [{ type: i0.Output, args: ["rowClick"] }] } });
|
|
2767
2830
|
|
|
2768
2831
|
/**
|
|
@@ -2869,7 +2932,7 @@ class UniDialogComponent extends BaseComponent {
|
|
|
2869
2932
|
this.show.set(false);
|
|
2870
2933
|
}
|
|
2871
2934
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2872
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniDialogComponent, isStandalone: true, selector: "dialog[uni-dialog]
|
|
2935
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniDialogComponent, isStandalone: true, selector: "dialog[uni-dialog]", inputs: { show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null }, initialFocus: { classPropertyName: "initialFocus", publicName: "initialFocus", isSignal: true, isRequired: false, transformFunction: null }, defaultCloseButton: { classPropertyName: "defaultCloseButton", publicName: "defaultCloseButton", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { show: "showChange", showing: "showing" }, host: { listeners: { "click": "backdropClick($event)", "cancel": "escapeCancel($event)", "animationend": "closingAnimation($event)" }, properties: { "attr.aria-labelledby": "hasTitle() ? titleId : null", "attr.aria-label": "ariaLabel() ?? null", "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'dialog' }], usesInheritance: true, ngImport: i0, template: `
|
|
2873
2936
|
@if (defaultCloseButton()) {
|
|
2874
2937
|
<button
|
|
2875
2938
|
icon-button
|
|
@@ -2888,7 +2951,7 @@ class UniDialogComponent extends BaseComponent {
|
|
|
2888
2951
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDialogComponent, decorators: [{
|
|
2889
2952
|
type: Component,
|
|
2890
2953
|
args: [{
|
|
2891
|
-
selector: 'dialog[uni-dialog]
|
|
2954
|
+
selector: 'dialog[uni-dialog]',
|
|
2892
2955
|
imports: [UniIconButtonComponent, CommonModule],
|
|
2893
2956
|
template: `
|
|
2894
2957
|
@if (defaultCloseButton()) {
|
|
@@ -2936,11 +2999,11 @@ class UniDialogButtonsComponent {
|
|
|
2936
2999
|
this.dialog?.close();
|
|
2937
3000
|
}
|
|
2938
3001
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDialogButtonsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2939
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniDialogButtonsComponent, isStandalone: true, selector: "uni-dialog-buttons,
|
|
3002
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniDialogButtonsComponent, isStandalone: true, selector: "[uni-dialog-buttons], [dialog-buttons]", inputs: { confirmButtonText: { classPropertyName: "confirmButtonText", publicName: "confirmButtonText", isSignal: true, isRequired: false, transformFunction: null }, confirmButtonVariant: { classPropertyName: "confirmButtonVariant", publicName: "confirmButtonVariant", isSignal: true, isRequired: false, transformFunction: null }, cancelButtonText: { classPropertyName: "cancelButtonText", publicName: "cancelButtonText", isSignal: true, isRequired: false, transformFunction: null }, disableConfirm: { classPropertyName: "disableConfirm", publicName: "disableConfirm", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, paddingBottom: { classPropertyName: "paddingBottom", publicName: "paddingBottom", isSignal: true, isRequired: false, transformFunction: null }, justifyContent: { classPropertyName: "justifyContent", publicName: "justifyContent", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { confirmed: "confirmed" }, ngImport: i0, template: "<div\n row-layout\n gap=\"md\"\n [padding]=\"padding()\"\n [paddingBottom]=\"paddingBottom()\"\n [justifyContent]=\"justifyContent()\"\n>\n <button\n text-button\n [variant]=\"confirmButtonVariant()\"\n (click)=\"confirmed.emit(); closeDialog()\"\n [disable]=\"disableConfirm()\"\n >\n {{ confirmButtonText() || 'Confirm' }}\n </button>\n <button text-button variant=\"warn\" (click)=\"closeDialog()\">\n {{ cancelButtonText() || 'Cancel' }}\n </button>\n</div>\n", dependencies: [{ kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }, { kind: "component", type: UniButtonComponent, selector: "button[uni-text-button], button[text-button]", inputs: ["disable", "loading", "fullWidth", "symbolLeft", "symbolRight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2940
3003
|
}
|
|
2941
3004
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDialogButtonsComponent, decorators: [{
|
|
2942
3005
|
type: Component,
|
|
2943
|
-
args: [{ selector: 'uni-dialog-buttons,
|
|
3006
|
+
args: [{ selector: '[uni-dialog-buttons], [dialog-buttons]', imports: [UniRowComponent, UniButtonComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n row-layout\n gap=\"md\"\n [padding]=\"padding()\"\n [paddingBottom]=\"paddingBottom()\"\n [justifyContent]=\"justifyContent()\"\n>\n <button\n text-button\n [variant]=\"confirmButtonVariant()\"\n (click)=\"confirmed.emit(); closeDialog()\"\n [disable]=\"disableConfirm()\"\n >\n {{ confirmButtonText() || 'Confirm' }}\n </button>\n <button text-button variant=\"warn\" (click)=\"closeDialog()\">\n {{ cancelButtonText() || 'Cancel' }}\n </button>\n</div>\n" }]
|
|
2944
3007
|
}], propDecorators: { confirmButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmButtonText", required: false }] }], confirmButtonVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmButtonVariant", required: false }] }], cancelButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "cancelButtonText", required: false }] }], disableConfirm: [{ type: i0.Input, args: [{ isSignal: true, alias: "disableConfirm", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], paddingBottom: [{ type: i0.Input, args: [{ isSignal: true, alias: "paddingBottom", required: false }] }], justifyContent: [{ type: i0.Input, args: [{ isSignal: true, alias: "justifyContent", required: false }] }], confirmed: [{ type: i0.Output, args: ["confirmed"] }] } });
|
|
2945
3008
|
|
|
2946
3009
|
class UniDialogHeaderComponent extends BaseComponent {
|
|
@@ -2959,11 +3022,11 @@ class UniDialogHeaderComponent extends BaseComponent {
|
|
|
2959
3022
|
this.dialog?.close();
|
|
2960
3023
|
}
|
|
2961
3024
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDialogHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2962
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: UniDialogHeaderComponent, isStandalone: true, selector: "
|
|
3025
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: UniDialogHeaderComponent, isStandalone: true, selector: "[uni-dialog-header]", providers: [{ provide: COMPONENT_NAME, useValue: 'dialogHeader' }], usesInheritance: true, ngImport: i0, template: "<div\n row-layout\n [color]=\"componentOptions().color\"\n [borderRadius]=\"componentOptions().borderRadius\"\n [height]=\"componentOptions().height\"\n alignItems=\"center\"\n paddingHorizontal=\"sm\"\n>\n <div box-layout [width]=\"26\"></div>\n <div box-layout [grow]=\"1\" [attr.id]=\"titleId\">\n <span uni-text\n [typeface]=\"componentOptions().textRole\"\n [color]=\"componentOptions().textColor\"\n display=\"block\"\n [align]=\"componentOptions().textAlign || 'center'\"\n ><ng-content></ng-content\n ></span>\n </div>\n <button\n icon-button\n [iconName]=\"componentOptions().closeButtonIcon\"\n [symbolName]=\"componentOptions().closeButtonSymbol\"\n variant=\"ghost\"\n (click)=\"closeDialog()\"\n [size]=\"componentOptions().closeButtonSize || 'md'\"\n >\n Close\n </button>\n</div>\n", dependencies: [{ kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniIconButtonComponent, selector: "button[uni-icon-button], button[icon-button]", inputs: ["ariaLabel", "iconName", "symbolName", "variant", "size", "disable", "loading", "opticalSize"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2963
3026
|
}
|
|
2964
3027
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDialogHeaderComponent, decorators: [{
|
|
2965
3028
|
type: Component,
|
|
2966
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: '
|
|
3029
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: '[uni-dialog-header]', imports: [UniBoxComponent, UniIconButtonComponent, UniTextComponent, UniRowComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'dialogHeader' }], template: "<div\n row-layout\n [color]=\"componentOptions().color\"\n [borderRadius]=\"componentOptions().borderRadius\"\n [height]=\"componentOptions().height\"\n alignItems=\"center\"\n paddingHorizontal=\"sm\"\n>\n <div box-layout [width]=\"26\"></div>\n <div box-layout [grow]=\"1\" [attr.id]=\"titleId\">\n <span uni-text\n [typeface]=\"componentOptions().textRole\"\n [color]=\"componentOptions().textColor\"\n display=\"block\"\n [align]=\"componentOptions().textAlign || 'center'\"\n ><ng-content></ng-content\n ></span>\n </div>\n <button\n icon-button\n [iconName]=\"componentOptions().closeButtonIcon\"\n [symbolName]=\"componentOptions().closeButtonSymbol\"\n variant=\"ghost\"\n (click)=\"closeDialog()\"\n [size]=\"componentOptions().closeButtonSize || 'md'\"\n >\n Close\n </button>\n</div>\n" }]
|
|
2967
3030
|
}], ctorParameters: () => [] });
|
|
2968
3031
|
|
|
2969
3032
|
class UniDividerComponent {
|
|
@@ -2986,12 +3049,12 @@ class UniDividerComponent {
|
|
|
2986
3049
|
]);
|
|
2987
3050
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
2988
3051
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDividerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
2989
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniDividerComponent, isStandalone: true, selector: "uni-divider
|
|
3052
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniDividerComponent, isStandalone: true, selector: "uni-divider", inputs: { orientation: { classPropertyName: "orientation", publicName: "orientation", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, ngImport: i0, template: ``, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2990
3053
|
}
|
|
2991
3054
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDividerComponent, decorators: [{
|
|
2992
3055
|
type: Component,
|
|
2993
3056
|
args: [{
|
|
2994
|
-
selector: 'uni-divider
|
|
3057
|
+
selector: 'uni-divider',
|
|
2995
3058
|
imports: [],
|
|
2996
3059
|
template: ``,
|
|
2997
3060
|
host: { '[class]': 'className()' },
|
|
@@ -3102,13 +3165,17 @@ class UniDrawerComponent extends BaseComponent {
|
|
|
3102
3165
|
});
|
|
3103
3166
|
}, ...(ngDevMode ? [{ debugName: "overClass" }] : /* istanbul ignore next */ []));
|
|
3104
3167
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDrawerComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3105
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniDrawerComponent, isStandalone: true, selector: "uni-drawer
|
|
3168
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniDrawerComponent, isStandalone: true, selector: "uni-drawer", inputs: { open: { classPropertyName: "open", publicName: "open", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { open: "openChange" }, providers: [{ provide: COMPONENT_NAME, useValue: 'drawer' }], viewQueries: [{ propertyName: "contentTemplate", first: true, predicate: ["content"], descendants: true, isSignal: true }, { propertyName: "overlay", first: true, predicate: ["overlay"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
|
|
3106
3169
|
<ng-template #content><ng-content /></ng-template>
|
|
3107
3170
|
@if (mode() === 'side') {
|
|
3108
3171
|
<aside [class]="sideClass()" [attr.aria-hidden]="open() ? null : 'true'">
|
|
3109
3172
|
<ng-container [ngTemplateOutlet]="contentTemplate()" />
|
|
3110
3173
|
</aside>
|
|
3111
3174
|
} @else {
|
|
3175
|
+
<!-- Click handles the ::backdrop only (target check); keyboard closing
|
|
3176
|
+
is the native dialog cancel event, and focus is trapped by
|
|
3177
|
+
showModal — the element needs no tabindex of its own. -->
|
|
3178
|
+
<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->
|
|
3112
3179
|
<dialog
|
|
3113
3180
|
#overlay
|
|
3114
3181
|
[class]="overClass()"
|
|
@@ -3126,7 +3193,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
3126
3193
|
type: Component,
|
|
3127
3194
|
args: [{
|
|
3128
3195
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3129
|
-
selector: 'uni-drawer
|
|
3196
|
+
selector: 'uni-drawer',
|
|
3130
3197
|
imports: [NgTemplateOutlet],
|
|
3131
3198
|
providers: [{ provide: COMPONENT_NAME, useValue: 'drawer' }],
|
|
3132
3199
|
template: `
|
|
@@ -3136,6 +3203,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
3136
3203
|
<ng-container [ngTemplateOutlet]="contentTemplate()" />
|
|
3137
3204
|
</aside>
|
|
3138
3205
|
} @else {
|
|
3206
|
+
<!-- Click handles the ::backdrop only (target check); keyboard closing
|
|
3207
|
+
is the native dialog cancel event, and focus is trapped by
|
|
3208
|
+
showModal — the element needs no tabindex of its own. -->
|
|
3209
|
+
<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->
|
|
3139
3210
|
<dialog
|
|
3140
3211
|
#overlay
|
|
3141
3212
|
[class]="overClass()"
|
|
@@ -3295,7 +3366,7 @@ class UniDropdownComponent extends BaseComponent {
|
|
|
3295
3366
|
}
|
|
3296
3367
|
}
|
|
3297
3368
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3298
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniDropdownComponent, isStandalone: true, selector: "uni-dropdown
|
|
3369
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniDropdownComponent, isStandalone: true, selector: "uni-dropdown", inputs: { trigger: { classPropertyName: "trigger", publicName: "trigger", isSignal: true, isRequired: true, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, offset: { classPropertyName: "offset", publicName: "offset", isSignal: true, isRequired: false, transformFunction: null }, ariaHasPopup: { classPropertyName: "ariaHasPopup", publicName: "ariaHasPopup", isSignal: true, isRequired: false, transformFunction: null }, paddingVertical: { classPropertyName: "paddingVertical", publicName: "paddingVertical", isSignal: true, isRequired: false, transformFunction: null }, paddingHorizontal: { classPropertyName: "paddingHorizontal", publicName: "paddingHorizontal", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { dropdownShowing: "dropdownShowing", dropdownHiding: "dropdownHiding" }, providers: [{ provide: COMPONENT_NAME, useValue: 'dropdown' }], viewQueries: [{ propertyName: "dropdownRef", first: true, predicate: ["dropdown"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: `
|
|
3299
3370
|
<!-- 1. The native 'popover' attribute brings it to the top layer with native light-dismiss -->
|
|
3300
3371
|
<div #dropdown popover="auto" [id]="popoverId" [class]="dropdownClass()">
|
|
3301
3372
|
<div
|
|
@@ -3310,13 +3381,13 @@ class UniDropdownComponent extends BaseComponent {
|
|
|
3310
3381
|
<ng-content></ng-content>
|
|
3311
3382
|
</div>
|
|
3312
3383
|
</div>
|
|
3313
|
-
`, isInline: true, dependencies: [{ kind: "component", type: UniBoxComponent, selector: "
|
|
3384
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3314
3385
|
}
|
|
3315
3386
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDropdownComponent, decorators: [{
|
|
3316
3387
|
type: Component,
|
|
3317
3388
|
args: [{
|
|
3318
3389
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3319
|
-
selector: 'uni-dropdown
|
|
3390
|
+
selector: 'uni-dropdown',
|
|
3320
3391
|
imports: [UniBoxComponent],
|
|
3321
3392
|
template: `
|
|
3322
3393
|
<!-- 1. The native 'popover' attribute brings it to the top layer with native light-dismiss -->
|
|
@@ -3365,7 +3436,7 @@ class UniExpandComponent {
|
|
|
3365
3436
|
animation: `${this.collapse} ease-in 350ms`,
|
|
3366
3437
|
});
|
|
3367
3438
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniExpandComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3368
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniExpandComponent, isStandalone: true, selector: "uni-expand
|
|
3439
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniExpandComponent, isStandalone: true, selector: "uni-expand", inputs: { collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange" }, host: { properties: { "attr.id": "regionId" } }, ngImport: i0, template: `@if (!collapsed()) {
|
|
3369
3440
|
<div
|
|
3370
3441
|
[animate.enter]="expandAnimation"
|
|
3371
3442
|
[animate.leave]="collapseAnimation"
|
|
@@ -3381,7 +3452,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
3381
3452
|
type: Component,
|
|
3382
3453
|
args: [{
|
|
3383
3454
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3384
|
-
selector: 'uni-expand
|
|
3455
|
+
selector: 'uni-expand',
|
|
3385
3456
|
imports: [],
|
|
3386
3457
|
template: `@if (!collapsed()) {
|
|
3387
3458
|
<div
|
|
@@ -3535,7 +3606,7 @@ class UniTooltipComponent extends BaseComponent {
|
|
|
3535
3606
|
...anchorArrowStyles(this.placement()),
|
|
3536
3607
|
}), ...(ngDevMode ? [{ debugName: "arrowClassName" }] : /* istanbul ignore next */ []));
|
|
3537
3608
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTooltipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3538
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniTooltipComponent, isStandalone: true, selector: "uni-tooltip
|
|
3609
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniTooltipComponent, isStandalone: true, selector: "uni-tooltip", inputs: { hoverDelay: { classPropertyName: "hoverDelay", publicName: "hoverDelay", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, inlineText: { classPropertyName: "inlineText", publicName: "inlineText", isSignal: true, isRequired: false, transformFunction: null }, appendToBody: { classPropertyName: "appendToBody", publicName: "appendToBody", isSignal: true, isRequired: false, transformFunction: null } }, host: { listeners: { "click": "toggleTooltip()", "mouseenter": "mouseenter()", "mouseleave": "mouseleave()", "focusin": "onFocusIn($event)", "focusout": "onFocusOut()", "keydown.escape": "onEscape($event)" }, properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'tooltip' }], viewQueries: [{ propertyName: "tipRef", first: true, predicate: ["tip"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `<ng-content></ng-content
|
|
3539
3610
|
><span
|
|
3540
3611
|
#tip
|
|
3541
3612
|
popover="manual"
|
|
@@ -3551,7 +3622,7 @@ class UniTooltipComponent extends BaseComponent {
|
|
|
3551
3622
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTooltipComponent, decorators: [{
|
|
3552
3623
|
type: Component,
|
|
3553
3624
|
args: [{
|
|
3554
|
-
selector: 'uni-tooltip
|
|
3625
|
+
selector: 'uni-tooltip',
|
|
3555
3626
|
imports: [],
|
|
3556
3627
|
// The bubble lives declaratively in the template as a manual popover: the
|
|
3557
3628
|
// top layer escapes any overflow context (which made appendToBody obsolete)
|
|
@@ -3601,7 +3672,7 @@ class UniExpandToggleComponent {
|
|
|
3601
3672
|
this.collapsed.update((collapsed) => !collapsed);
|
|
3602
3673
|
}
|
|
3603
3674
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniExpandToggleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3604
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniExpandToggleComponent, isStandalone: true, selector: "uni-expand-toggle
|
|
3675
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniExpandToggleComponent, isStandalone: true, selector: "uni-expand-toggle", inputs: { collapsed: { classPropertyName: "collapsed", publicName: "collapsed", isSignal: true, isRequired: false, transformFunction: null }, ariaControls: { classPropertyName: "ariaControls", publicName: "ariaControls", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsedChange" }, host: { properties: { "class": "className()", "attr.toggled": "collapsed() || null" } }, ngImport: i0, template: `<uni-tooltip
|
|
3605
3676
|
[label]="collapsed() ? 'Expand' : 'Collapse'"
|
|
3606
3677
|
placement="right"
|
|
3607
3678
|
>
|
|
@@ -3614,14 +3685,14 @@ class UniExpandToggleComponent {
|
|
|
3614
3685
|
>
|
|
3615
3686
|
{{ collapsed() ? 'Expand' : 'Collapse' }}
|
|
3616
3687
|
</button>
|
|
3617
|
-
</
|
|
3688
|
+
</uni-tooltip>`, isInline: true, dependencies: [{ kind: "component", type: UniIconButtonComponent, selector: "button[uni-icon-button], button[icon-button]", inputs: ["ariaLabel", "iconName", "symbolName", "variant", "size", "disable", "loading", "opticalSize"] }, { kind: "component", type: UniTooltipComponent, selector: "uni-tooltip", inputs: ["hoverDelay", "label", "placement", "inlineText", "appendToBody"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3618
3689
|
}
|
|
3619
3690
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniExpandToggleComponent, decorators: [{
|
|
3620
3691
|
type: Component,
|
|
3621
3692
|
args: [{
|
|
3622
|
-
selector: 'uni-expand-toggle
|
|
3693
|
+
selector: 'uni-expand-toggle',
|
|
3623
3694
|
imports: [UniIconButtonComponent, UniTooltipComponent],
|
|
3624
|
-
template: `<
|
|
3695
|
+
template: `<uni-tooltip
|
|
3625
3696
|
[label]="collapsed() ? 'Expand' : 'Collapse'"
|
|
3626
3697
|
placement="right"
|
|
3627
3698
|
>
|
|
@@ -3634,7 +3705,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
3634
3705
|
>
|
|
3635
3706
|
{{ collapsed() ? 'Expand' : 'Collapse' }}
|
|
3636
3707
|
</button>
|
|
3637
|
-
</
|
|
3708
|
+
</uni-tooltip>`,
|
|
3638
3709
|
host: {
|
|
3639
3710
|
'[class]': 'className()',
|
|
3640
3711
|
'[attr.toggled]': 'collapsed() || null',
|
|
@@ -3653,9 +3724,9 @@ class UniExpandAreaComponent {
|
|
|
3653
3724
|
this.toggleRef().toggle();
|
|
3654
3725
|
}
|
|
3655
3726
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniExpandAreaComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3656
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniExpandAreaComponent, isStandalone: true, selector: "uni-expand-area
|
|
3657
|
-
<
|
|
3658
|
-
<
|
|
3727
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniExpandAreaComponent, isStandalone: true, selector: "uni-expand-area", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, initCollapsed: { classPropertyName: "initCollapsed", publicName: "initCollapsed", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { collapsed: "collapsed" }, viewQueries: [{ propertyName: "toggleRef", first: true, predicate: ["toggle"], descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
3728
|
+
<div box-layout color="tertiary-surface" borderRadius="sm" border="quaternary" overflow="hidden">
|
|
3729
|
+
<div box-layout
|
|
3659
3730
|
border="quaternary"
|
|
3660
3731
|
borderRadius="sm"
|
|
3661
3732
|
color="primary-surface"
|
|
@@ -3665,38 +3736,38 @@ class UniExpandAreaComponent {
|
|
|
3665
3736
|
display="flex"
|
|
3666
3737
|
alignItems="center"
|
|
3667
3738
|
>
|
|
3668
|
-
<
|
|
3669
|
-
<
|
|
3670
|
-
<
|
|
3739
|
+
<div box-layout [width]="36"></div>
|
|
3740
|
+
<div box-layout paddingHorizontal="md">
|
|
3741
|
+
<span uni-text="title-small" display="block">
|
|
3671
3742
|
{{ title() }}
|
|
3672
|
-
</
|
|
3673
|
-
</
|
|
3743
|
+
</span>
|
|
3744
|
+
</div>
|
|
3674
3745
|
|
|
3675
|
-
<
|
|
3746
|
+
<uni-expand-toggle
|
|
3676
3747
|
#toggle
|
|
3677
3748
|
style="display: inline-flex; margin: -2px"
|
|
3678
3749
|
[collapsed]="initCollapsed()"
|
|
3679
3750
|
[ariaControls]="expand.regionId"
|
|
3680
3751
|
/>
|
|
3681
|
-
</
|
|
3752
|
+
</div>
|
|
3682
3753
|
|
|
3683
|
-
<
|
|
3684
|
-
<
|
|
3754
|
+
<uni-expand #expand [collapsed]="toggle.collapsed()">
|
|
3755
|
+
<div box-layout [padding]="padding()">
|
|
3685
3756
|
<ng-content></ng-content>
|
|
3686
|
-
</
|
|
3687
|
-
</
|
|
3688
|
-
</
|
|
3689
|
-
`, isInline: true, dependencies: [{ kind: "component", type: UniBoxComponent, selector: "
|
|
3757
|
+
</div>
|
|
3758
|
+
</uni-expand>
|
|
3759
|
+
</div>
|
|
3760
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniExpandToggleComponent, selector: "uni-expand-toggle", inputs: ["collapsed", "ariaControls"], outputs: ["collapsedChange"] }, { kind: "component", type: UniExpandComponent, selector: "uni-expand", inputs: ["collapsed"], outputs: ["collapsedChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3690
3761
|
}
|
|
3691
3762
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniExpandAreaComponent, decorators: [{
|
|
3692
3763
|
type: Component,
|
|
3693
3764
|
args: [{
|
|
3694
3765
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3695
|
-
selector: 'uni-expand-area
|
|
3766
|
+
selector: 'uni-expand-area',
|
|
3696
3767
|
imports: [UniBoxComponent, UniTextComponent, UniExpandToggleComponent, UniExpandComponent],
|
|
3697
3768
|
template: `
|
|
3698
|
-
<
|
|
3699
|
-
<
|
|
3769
|
+
<div box-layout color="tertiary-surface" borderRadius="sm" border="quaternary" overflow="hidden">
|
|
3770
|
+
<div box-layout
|
|
3700
3771
|
border="quaternary"
|
|
3701
3772
|
borderRadius="sm"
|
|
3702
3773
|
color="primary-surface"
|
|
@@ -3706,27 +3777,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
3706
3777
|
display="flex"
|
|
3707
3778
|
alignItems="center"
|
|
3708
3779
|
>
|
|
3709
|
-
<
|
|
3710
|
-
<
|
|
3711
|
-
<
|
|
3780
|
+
<div box-layout [width]="36"></div>
|
|
3781
|
+
<div box-layout paddingHorizontal="md">
|
|
3782
|
+
<span uni-text="title-small" display="block">
|
|
3712
3783
|
{{ title() }}
|
|
3713
|
-
</
|
|
3714
|
-
</
|
|
3784
|
+
</span>
|
|
3785
|
+
</div>
|
|
3715
3786
|
|
|
3716
|
-
<
|
|
3787
|
+
<uni-expand-toggle
|
|
3717
3788
|
#toggle
|
|
3718
3789
|
style="display: inline-flex; margin: -2px"
|
|
3719
3790
|
[collapsed]="initCollapsed()"
|
|
3720
3791
|
[ariaControls]="expand.regionId"
|
|
3721
3792
|
/>
|
|
3722
|
-
</
|
|
3793
|
+
</div>
|
|
3723
3794
|
|
|
3724
|
-
<
|
|
3725
|
-
<
|
|
3795
|
+
<uni-expand #expand [collapsed]="toggle.collapsed()">
|
|
3796
|
+
<div box-layout [padding]="padding()">
|
|
3726
3797
|
<ng-content></ng-content>
|
|
3727
|
-
</
|
|
3728
|
-
</
|
|
3729
|
-
</
|
|
3798
|
+
</div>
|
|
3799
|
+
</uni-expand>
|
|
3800
|
+
</div>
|
|
3730
3801
|
`,
|
|
3731
3802
|
}]
|
|
3732
3803
|
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], initCollapsed: [{ type: i0.Input, args: [{ isSignal: true, alias: "initCollapsed", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], collapsed: [{ type: i0.Output, args: ["collapsed"] }], toggleRef: [{ type: i0.ViewChild, args: ['toggle', { isSignal: true }] }] } });
|
|
@@ -3816,7 +3887,7 @@ class UniFileDropZoneComponent {
|
|
|
3816
3887
|
this.selectedFile.set(undefined);
|
|
3817
3888
|
}
|
|
3818
3889
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniFileDropZoneComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3819
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniFileDropZoneComponent, isStandalone: true, selector: "uni-file-drop-zone", inputs: { height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, useBrowseButton: { classPropertyName: "useBrowseButton", publicName: "useBrowseButton", isSignal: true, isRequired: false, transformFunction: null }, browseButtonText: { classPropertyName: "browseButtonText", publicName: "browseButtonText", isSignal: true, isRequired: false, transformFunction: null }, allowedFileExtensions: { classPropertyName: "allowedFileExtensions", publicName: "allowedFileExtensions", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helpTemplate: { classPropertyName: "helpTemplate", publicName: "helpTemplate", isSignal: true, isRequired: false, transformFunction: null }, helpTemplateContext: { classPropertyName: "helpTemplateContext", publicName: "helpTemplateContext", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileAttached: "fileAttached", fileRemoved: "fileRemoved" }, viewQueries: [{ propertyName: "fileSelectorRef", first: true, predicate: ["fileSelector"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Without a browse button the zone itself is the keyboard path to the\n native file picker; with one, the button already provides it -->\n<div\n box-layout\n [border]=\"border()\"\n [borderRadius]=\"borderRadius()\"\n [dashBorder]=\"[undefined, 'replace'].includes(attachmentState())\"\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n [padding]=\"padding()\"\n dragAndDrop\n (onFileDropped)=\"selectFiles($event)\"\n [height]=\"height()\"\n [attr.role]=\"zoneIsInteractive() ? 'button' : null\"\n [attr.tabindex]=\"zoneIsInteractive() ? 0 : null\"\n [attr.aria-label]=\"zoneIsInteractive() ? label() || 'Choose a file' : null\"\n (keydown.enter)=\"zoneIsInteractive() && openFileSelector()\"\n (keydown.space)=\"\n zoneIsInteractive() && openFileSelector(); zoneIsInteractive() && $event.preventDefault()\n \"\n>\n <div stack-layout gap=\"md\" alignItems=\"center\">\n @switch (attachmentState()) {\n @case ('upload') {\n <div stack-layout alignItems=\"center\">\n <
|
|
3890
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniFileDropZoneComponent, isStandalone: true, selector: "uni-file-drop-zone", inputs: { height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, borderRadius: { classPropertyName: "borderRadius", publicName: "borderRadius", isSignal: true, isRequired: false, transformFunction: null }, border: { classPropertyName: "border", publicName: "border", isSignal: true, isRequired: false, transformFunction: null }, padding: { classPropertyName: "padding", publicName: "padding", isSignal: true, isRequired: false, transformFunction: null }, useBrowseButton: { classPropertyName: "useBrowseButton", publicName: "useBrowseButton", isSignal: true, isRequired: false, transformFunction: null }, browseButtonText: { classPropertyName: "browseButtonText", publicName: "browseButtonText", isSignal: true, isRequired: false, transformFunction: null }, allowedFileExtensions: { classPropertyName: "allowedFileExtensions", publicName: "allowedFileExtensions", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, helpTemplate: { classPropertyName: "helpTemplate", publicName: "helpTemplate", isSignal: true, isRequired: false, transformFunction: null }, helpTemplateContext: { classPropertyName: "helpTemplateContext", publicName: "helpTemplateContext", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { fileAttached: "fileAttached", fileRemoved: "fileRemoved" }, viewQueries: [{ propertyName: "fileSelectorRef", first: true, predicate: ["fileSelector"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Without a browse button the zone itself is the keyboard path to the\n native file picker; with one, the button already provides it -->\n<div\n box-layout\n [border]=\"border()\"\n [borderRadius]=\"borderRadius()\"\n [dashBorder]=\"[undefined, 'replace'].includes(attachmentState())\"\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n [padding]=\"padding()\"\n dragAndDrop\n (onFileDropped)=\"selectFiles($event)\"\n [height]=\"height()\"\n [attr.role]=\"zoneIsInteractive() ? 'button' : null\"\n [attr.tabindex]=\"zoneIsInteractive() ? 0 : null\"\n [attr.aria-label]=\"zoneIsInteractive() ? label() || 'Choose a file' : null\"\n (keydown.enter)=\"zoneIsInteractive() && openFileSelector()\"\n (keydown.space)=\"\n zoneIsInteractive() && openFileSelector(); zoneIsInteractive() && $event.preventDefault()\n \"\n>\n <div stack-layout gap=\"md\" alignItems=\"center\">\n @switch (attachmentState()) {\n @case ('upload') {\n <div stack-layout alignItems=\"center\">\n <span uni-text=\"headline-small\">{{ label() }}</span>\n <span uni-text=\"title-small\">{{ selectedFileName() }}</span>\n </div>\n <button text-button (click)=\"removeAttachment()\" variant=\"warn\">Cancel</button>\n }\n\n @default {\n @if (useBrowseButton()) {\n <button text-button (click)=\"openFileSelector()\">\n {{ browseButtonText() }}\n </button>\n <span uni-text>OR</span>\n }\n\n @if (!helpTemplate()) {\n <div stack-layout alignItems=\"center\">\n <span uni-text=\"headline-small\">Drag and drop the file here</span>\n @if (helpText()) {\n <span uni-text=\"title-small\">{{ helpText() }}</span>\n }\n </div>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"helpTemplate()\"\n [ngTemplateOutletContext]=\"helpTemplateContext()\"\n ></ng-container>\n }\n }\n }\n </div>\n\n <input\n #fileSelector\n type=\"file\"\n style=\"display: none\"\n (change)=\"onFileInputChange()\"\n [accept]=\"sanitizedFileExtensions().join(',')\"\n [multiple]=\"false\"\n />\n</div>\n", dependencies: [{ kind: "directive", type: DragAndDropDirective, selector: "[uni-drag-n-drop], [dragAndDrop]", outputs: ["onFileDropped"] }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniButtonComponent, selector: "button[uni-text-button], button[text-button]", inputs: ["disable", "loading", "fullWidth", "symbolLeft", "symbolRight"] }, { kind: "component", type: UniStackComponent, selector: "[uni-stack-layout], [stack-layout]", inputs: ["display", "flexDirection", "minHeight"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3820
3891
|
}
|
|
3821
3892
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniFileDropZoneComponent, decorators: [{
|
|
3822
3893
|
type: Component,
|
|
@@ -3827,7 +3898,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
3827
3898
|
UniStackComponent,
|
|
3828
3899
|
UniTextComponent,
|
|
3829
3900
|
NgTemplateOutlet,
|
|
3830
|
-
], template: "<!-- Without a browse button the zone itself is the keyboard path to the\n native file picker; with one, the button already provides it -->\n<div\n box-layout\n [border]=\"border()\"\n [borderRadius]=\"borderRadius()\"\n [dashBorder]=\"[undefined, 'replace'].includes(attachmentState())\"\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n [padding]=\"padding()\"\n dragAndDrop\n (onFileDropped)=\"selectFiles($event)\"\n [height]=\"height()\"\n [attr.role]=\"zoneIsInteractive() ? 'button' : null\"\n [attr.tabindex]=\"zoneIsInteractive() ? 0 : null\"\n [attr.aria-label]=\"zoneIsInteractive() ? label() || 'Choose a file' : null\"\n (keydown.enter)=\"zoneIsInteractive() && openFileSelector()\"\n (keydown.space)=\"\n zoneIsInteractive() && openFileSelector(); zoneIsInteractive() && $event.preventDefault()\n \"\n>\n <div stack-layout gap=\"md\" alignItems=\"center\">\n @switch (attachmentState()) {\n @case ('upload') {\n <div stack-layout alignItems=\"center\">\n <
|
|
3901
|
+
], template: "<!-- Without a browse button the zone itself is the keyboard path to the\n native file picker; with one, the button already provides it -->\n<div\n box-layout\n [border]=\"border()\"\n [borderRadius]=\"borderRadius()\"\n [dashBorder]=\"[undefined, 'replace'].includes(attachmentState())\"\n display=\"flex\"\n alignItems=\"center\"\n justifyContent=\"center\"\n [padding]=\"padding()\"\n dragAndDrop\n (onFileDropped)=\"selectFiles($event)\"\n [height]=\"height()\"\n [attr.role]=\"zoneIsInteractive() ? 'button' : null\"\n [attr.tabindex]=\"zoneIsInteractive() ? 0 : null\"\n [attr.aria-label]=\"zoneIsInteractive() ? label() || 'Choose a file' : null\"\n (keydown.enter)=\"zoneIsInteractive() && openFileSelector()\"\n (keydown.space)=\"\n zoneIsInteractive() && openFileSelector(); zoneIsInteractive() && $event.preventDefault()\n \"\n>\n <div stack-layout gap=\"md\" alignItems=\"center\">\n @switch (attachmentState()) {\n @case ('upload') {\n <div stack-layout alignItems=\"center\">\n <span uni-text=\"headline-small\">{{ label() }}</span>\n <span uni-text=\"title-small\">{{ selectedFileName() }}</span>\n </div>\n <button text-button (click)=\"removeAttachment()\" variant=\"warn\">Cancel</button>\n }\n\n @default {\n @if (useBrowseButton()) {\n <button text-button (click)=\"openFileSelector()\">\n {{ browseButtonText() }}\n </button>\n <span uni-text>OR</span>\n }\n\n @if (!helpTemplate()) {\n <div stack-layout alignItems=\"center\">\n <span uni-text=\"headline-small\">Drag and drop the file here</span>\n @if (helpText()) {\n <span uni-text=\"title-small\">{{ helpText() }}</span>\n }\n </div>\n } @else {\n <ng-container\n [ngTemplateOutlet]=\"helpTemplate()\"\n [ngTemplateOutletContext]=\"helpTemplateContext()\"\n ></ng-container>\n }\n }\n }\n </div>\n\n <input\n #fileSelector\n type=\"file\"\n style=\"display: none\"\n (change)=\"onFileInputChange()\"\n [accept]=\"sanitizedFileExtensions().join(',')\"\n [multiple]=\"false\"\n />\n</div>\n" }]
|
|
3831
3902
|
}], ctorParameters: () => [], propDecorators: { fileSelectorRef: [{ type: i0.ViewChild, args: ['fileSelector', { isSignal: true }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], borderRadius: [{ type: i0.Input, args: [{ isSignal: true, alias: "borderRadius", required: false }] }], border: [{ type: i0.Input, args: [{ isSignal: true, alias: "border", required: false }] }], padding: [{ type: i0.Input, args: [{ isSignal: true, alias: "padding", required: false }] }], useBrowseButton: [{ type: i0.Input, args: [{ isSignal: true, alias: "useBrowseButton", required: false }] }], browseButtonText: [{ type: i0.Input, args: [{ isSignal: true, alias: "browseButtonText", required: false }] }], allowedFileExtensions: [{ type: i0.Input, args: [{ isSignal: true, alias: "allowedFileExtensions", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], helpTemplate: [{ type: i0.Input, args: [{ isSignal: true, alias: "helpTemplate", required: false }] }], helpTemplateContext: [{ type: i0.Input, args: [{ isSignal: true, alias: "helpTemplateContext", required: false }] }], fileAttached: [{ type: i0.Output, args: ["fileAttached"] }], fileRemoved: [{ type: i0.Output, args: ["fileRemoved"] }] } });
|
|
3832
3903
|
|
|
3833
3904
|
/**
|
|
@@ -3836,51 +3907,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
3836
3907
|
* This file exports all public-facing elements of the file-drop-zone component.
|
|
3837
3908
|
*/
|
|
3838
3909
|
|
|
3839
|
-
class UniDebounceInputComponent {
|
|
3840
|
-
inputName = input(...(ngDevMode ? [undefined, { debugName: "inputName" }] : /* istanbul ignore next */ []));
|
|
3841
|
-
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
3842
|
-
debounceTime = input(400, ...(ngDevMode ? [{ debugName: "debounceTime" }] : /* istanbul ignore next */ []));
|
|
3843
|
-
// TODO(v4): rename to valueChange — renaming is breaking
|
|
3844
|
-
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
3845
|
-
change = output();
|
|
3846
|
-
value = signal(undefined, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
3847
|
-
timeoutId = null;
|
|
3848
|
-
lastEmitted;
|
|
3849
|
-
constructor() {
|
|
3850
|
-
inject(DestroyRef).onDestroy(() => {
|
|
3851
|
-
if (this.timeoutId)
|
|
3852
|
-
clearTimeout(this.timeoutId);
|
|
3853
|
-
});
|
|
3854
|
-
}
|
|
3855
|
-
handleInput(event) {
|
|
3856
|
-
const value = event.target.value;
|
|
3857
|
-
this.value.set(value);
|
|
3858
|
-
// Debounce, emitting only when the value actually changed.
|
|
3859
|
-
if (this.timeoutId)
|
|
3860
|
-
clearTimeout(this.timeoutId);
|
|
3861
|
-
this.timeoutId = setTimeout(() => {
|
|
3862
|
-
if (value !== this.lastEmitted) {
|
|
3863
|
-
this.lastEmitted = value;
|
|
3864
|
-
this.change.emit(value);
|
|
3865
|
-
}
|
|
3866
|
-
}, this.debounceTime());
|
|
3867
|
-
}
|
|
3868
|
-
inputClass = css({
|
|
3869
|
-
border: 'none',
|
|
3870
|
-
fontSize: 18,
|
|
3871
|
-
width: '100%',
|
|
3872
|
-
'&:focus-visible': {
|
|
3873
|
-
outline: 'none',
|
|
3874
|
-
},
|
|
3875
|
-
});
|
|
3876
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDebounceInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
3877
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniDebounceInputComponent, isStandalone: true, selector: "DebounceInput, uni-debounce-input", inputs: { inputName: { classPropertyName: "inputName", publicName: "inputName", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { change: "change" }, ngImport: i0, template: "<input\n [class]=\"inputClass\"\n type=\"text\"\n [name]=\"inputName()\"\n [id]=\"inputId()\"\n [value]=\"value() ?? ''\"\n (input)=\"handleInput($event)\"\n/>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3878
|
-
}
|
|
3879
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDebounceInputComponent, decorators: [{
|
|
3880
|
-
type: Component,
|
|
3881
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'DebounceInput, uni-debounce-input', imports: [], template: "<input\n [class]=\"inputClass\"\n type=\"text\"\n [name]=\"inputName()\"\n [id]=\"inputId()\"\n [value]=\"value() ?? ''\"\n (input)=\"handleInput($event)\"\n/>\n" }]
|
|
3882
|
-
}], ctorParameters: () => [], propDecorators: { inputName: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputName", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], debounceTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounceTime", required: false }] }], change: [{ type: i0.Output, args: ["change"] }] } });
|
|
3883
|
-
|
|
3884
3910
|
class UniInputBoxComponent extends BaseComponent {
|
|
3885
3911
|
className = css({ display: 'contents' });
|
|
3886
3912
|
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
@@ -3925,13 +3951,86 @@ class UniInputBoxComponent extends BaseComponent {
|
|
|
3925
3951
|
},
|
|
3926
3952
|
]), ...(ngDevMode ? [{ debugName: "inputBoxClass" }] : /* istanbul ignore next */ []));
|
|
3927
3953
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniInputBoxComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
3928
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniInputBoxComponent, isStandalone: true, selector: "uni-input-box", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'input' }], usesInheritance: true, ngImport: i0, template: "<div\n row-layout\n alignItems=\"center\"\n [height]=\"height() ?? componentOptions().height\"\n [color]=\"color()\"\n [border]=\"border()\"\n [borderRadius]=\"componentOptions().borderRadius\"\n [shadow]=\"shadow()\"\n [minWidth]=\"minWidth()\"\n [class]=\"inputBoxClass()\"\n position=\"relative\"\n>\n <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "component", type: UniRowComponent, selector: "
|
|
3954
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniInputBoxComponent, isStandalone: true, selector: "uni-input-box", inputs: { disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, error: { classPropertyName: "error", publicName: "error", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'input' }], usesInheritance: true, ngImport: i0, template: "<div\n row-layout\n alignItems=\"center\"\n [height]=\"height() ?? componentOptions().height\"\n [color]=\"color()\"\n [border]=\"border()\"\n [borderRadius]=\"componentOptions().borderRadius\"\n [shadow]=\"shadow()\"\n [minWidth]=\"minWidth()\"\n [class]=\"inputBoxClass()\"\n position=\"relative\"\n>\n <ng-content></ng-content>\n</div>\n", dependencies: [{ kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3929
3955
|
}
|
|
3930
3956
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniInputBoxComponent, decorators: [{
|
|
3931
3957
|
type: Component,
|
|
3932
3958
|
args: [{ selector: 'uni-input-box', imports: [UniRowComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'input' }], host: { '[class]': 'className' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n row-layout\n alignItems=\"center\"\n [height]=\"height() ?? componentOptions().height\"\n [color]=\"color()\"\n [border]=\"border()\"\n [borderRadius]=\"componentOptions().borderRadius\"\n [shadow]=\"shadow()\"\n [minWidth]=\"minWidth()\"\n [class]=\"inputBoxClass()\"\n position=\"relative\"\n>\n <ng-content></ng-content>\n</div>\n" }]
|
|
3933
3959
|
}], propDecorators: { disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], error: [{ type: i0.Input, args: [{ isSignal: true, alias: "error", required: false }] }], minWidth: [{ type: i0.Input, args: [{ isSignal: true, alias: "minWidth", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }] } });
|
|
3934
3960
|
|
|
3961
|
+
/**
|
|
3962
|
+
* Text input that emits `change` only after the user pauses typing. Wears the
|
|
3963
|
+
* shared input chrome (themed color, border, typeface, focus ring) via
|
|
3964
|
+
* `uni-input-box`; project adornments with the `pre-input` / `post-input`
|
|
3965
|
+
* slots, matching `uni-input`'s convention. The ARIA passthrough inputs let a
|
|
3966
|
+
* wrapping composite (e.g. SearchInput's combobox) annotate the real input
|
|
3967
|
+
* element.
|
|
3968
|
+
*/
|
|
3969
|
+
class UniDebounceInputComponent {
|
|
3970
|
+
inputName = input(...(ngDevMode ? [undefined, { debugName: "inputName" }] : /* istanbul ignore next */ []));
|
|
3971
|
+
inputId = input(...(ngDevMode ? [undefined, { debugName: "inputId" }] : /* istanbul ignore next */ []));
|
|
3972
|
+
debounceTime = input(400, ...(ngDevMode ? [{ debugName: "debounceTime" }] : /* istanbul ignore next */ []));
|
|
3973
|
+
/** Accessible name for the input. */
|
|
3974
|
+
label = input(...(ngDevMode ? [undefined, { debugName: "label" }] : /* istanbul ignore next */ []));
|
|
3975
|
+
placeholder = input('', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
3976
|
+
disabled = input(false, ...(ngDevMode ? [{ debugName: "disabled" }] : /* istanbul ignore next */ []));
|
|
3977
|
+
// ARIA passthroughs for composite widgets (combobox etc.).
|
|
3978
|
+
role = input(...(ngDevMode ? [undefined, { debugName: "role" }] : /* istanbul ignore next */ []));
|
|
3979
|
+
ariaExpanded = input(undefined, ...(ngDevMode ? [{ debugName: "ariaExpanded" }] : /* istanbul ignore next */ []));
|
|
3980
|
+
ariaControls = input(...(ngDevMode ? [undefined, { debugName: "ariaControls" }] : /* istanbul ignore next */ []));
|
|
3981
|
+
ariaActivedescendant = input(...(ngDevMode ? [undefined, { debugName: "ariaActivedescendant" }] : /* istanbul ignore next */ []));
|
|
3982
|
+
// TODO(v4): rename to valueChange — renaming is breaking
|
|
3983
|
+
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
3984
|
+
change = output();
|
|
3985
|
+
value = signal(undefined, ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
3986
|
+
inputElement = viewChild.required('field');
|
|
3987
|
+
timeoutId = null;
|
|
3988
|
+
lastEmitted;
|
|
3989
|
+
constructor() {
|
|
3990
|
+
inject(DestroyRef).onDestroy(() => {
|
|
3991
|
+
if (this.timeoutId)
|
|
3992
|
+
clearTimeout(this.timeoutId);
|
|
3993
|
+
});
|
|
3994
|
+
}
|
|
3995
|
+
handleInput(event) {
|
|
3996
|
+
const value = event.target.value;
|
|
3997
|
+
this.value.set(value);
|
|
3998
|
+
// Debounce, emitting only when the value actually changed.
|
|
3999
|
+
if (this.timeoutId)
|
|
4000
|
+
clearTimeout(this.timeoutId);
|
|
4001
|
+
this.timeoutId = setTimeout(() => {
|
|
4002
|
+
if (value !== this.lastEmitted) {
|
|
4003
|
+
this.lastEmitted = value;
|
|
4004
|
+
this.change.emit(value);
|
|
4005
|
+
}
|
|
4006
|
+
}, this.debounceTime());
|
|
4007
|
+
}
|
|
4008
|
+
/** Empty the field immediately, cancelling any pending emit. */
|
|
4009
|
+
clear() {
|
|
4010
|
+
if (this.timeoutId)
|
|
4011
|
+
clearTimeout(this.timeoutId);
|
|
4012
|
+
this.value.set('');
|
|
4013
|
+
if (this.lastEmitted !== '') {
|
|
4014
|
+
this.lastEmitted = '';
|
|
4015
|
+
this.change.emit('');
|
|
4016
|
+
}
|
|
4017
|
+
}
|
|
4018
|
+
focus() {
|
|
4019
|
+
this.inputElement().nativeElement.focus();
|
|
4020
|
+
}
|
|
4021
|
+
inputClass = css({
|
|
4022
|
+
flexGrow: 1,
|
|
4023
|
+
width: '100%',
|
|
4024
|
+
minWidth: 0,
|
|
4025
|
+
});
|
|
4026
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDebounceInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4027
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniDebounceInputComponent, isStandalone: true, selector: "uni-debounce-input", inputs: { inputName: { classPropertyName: "inputName", publicName: "inputName", isSignal: true, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, role: { classPropertyName: "role", publicName: "role", isSignal: true, isRequired: false, transformFunction: null }, ariaExpanded: { classPropertyName: "ariaExpanded", publicName: "ariaExpanded", isSignal: true, isRequired: false, transformFunction: null }, ariaControls: { classPropertyName: "ariaControls", publicName: "ariaControls", isSignal: true, isRequired: false, transformFunction: null }, ariaActivedescendant: { classPropertyName: "ariaActivedescendant", publicName: "ariaActivedescendant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { change: "change" }, viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["field"], descendants: true, isSignal: true }], ngImport: i0, template: "<uni-input-box>\n <ng-content select=\"[pre-input]\" />\n <input\n #field\n [class]=\"inputClass\"\n type=\"text\"\n [name]=\"inputName()\"\n [id]=\"inputId()\"\n [value]=\"value() ?? ''\"\n (input)=\"handleInput($event)\"\n [placeholder]=\"placeholder()\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"label() || null\"\n [attr.role]=\"role() || null\"\n [attr.aria-expanded]=\"ariaExpanded() ?? null\"\n [attr.aria-controls]=\"ariaControls() || null\"\n [attr.aria-activedescendant]=\"ariaActivedescendant() || null\"\n [attr.aria-autocomplete]=\"role() === 'combobox' ? 'list' : null\"\n />\n <ng-content select=\"[post-input]\" />\n</uni-input-box>\n", dependencies: [{ kind: "component", type: UniInputBoxComponent, selector: "uni-input-box", inputs: ["disabled", "error", "minWidth", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4028
|
+
}
|
|
4029
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniDebounceInputComponent, decorators: [{
|
|
4030
|
+
type: Component,
|
|
4031
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-debounce-input', imports: [UniInputBoxComponent], template: "<uni-input-box>\n <ng-content select=\"[pre-input]\" />\n <input\n #field\n [class]=\"inputClass\"\n type=\"text\"\n [name]=\"inputName()\"\n [id]=\"inputId()\"\n [value]=\"value() ?? ''\"\n (input)=\"handleInput($event)\"\n [placeholder]=\"placeholder()\"\n [disabled]=\"disabled()\"\n [attr.aria-label]=\"label() || null\"\n [attr.role]=\"role() || null\"\n [attr.aria-expanded]=\"ariaExpanded() ?? null\"\n [attr.aria-controls]=\"ariaControls() || null\"\n [attr.aria-activedescendant]=\"ariaActivedescendant() || null\"\n [attr.aria-autocomplete]=\"role() === 'combobox' ? 'list' : null\"\n />\n <ng-content select=\"[post-input]\" />\n</uni-input-box>\n" }]
|
|
4032
|
+
}], ctorParameters: () => [], propDecorators: { inputName: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputName", required: false }] }], inputId: [{ type: i0.Input, args: [{ isSignal: true, alias: "inputId", required: false }] }], debounceTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounceTime", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], role: [{ type: i0.Input, args: [{ isSignal: true, alias: "role", required: false }] }], ariaExpanded: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaExpanded", required: false }] }], ariaControls: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaControls", required: false }] }], ariaActivedescendant: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaActivedescendant", required: false }] }], change: [{ type: i0.Output, args: ["change"] }], inputElement: [{ type: i0.ViewChild, args: ['field', { isSignal: true }] }] } });
|
|
4033
|
+
|
|
3935
4034
|
class UniInputComponent {
|
|
3936
4035
|
// --- REQUIRED SIGNALS (populated by FormValueControl) ---
|
|
3937
4036
|
value = model('', ...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
@@ -4030,17 +4129,17 @@ class UniMenuItemComponent extends UniBoxComponent {
|
|
|
4030
4129
|
this._elementRef.nativeElement.focus();
|
|
4031
4130
|
}
|
|
4032
4131
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniMenuItemComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4033
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniMenuItemComponent, isStandalone: true, selector: "
|
|
4132
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniMenuItemComponent, isStandalone: true, selector: "[uni-menu-item], [menu-item]", inputs: { display: { classPropertyName: "display", publicName: "display", isSignal: true, isRequired: false, transformFunction: null }, flexDirection: { classPropertyName: "flexDirection", publicName: "flexDirection", isSignal: true, isRequired: false, transformFunction: null }, alignItems: { classPropertyName: "alignItems", publicName: "alignItems", isSignal: true, isRequired: false, transformFunction: null }, paddingHorizontal: { classPropertyName: "paddingHorizontal", publicName: "paddingHorizontal", isSignal: true, isRequired: false, transformFunction: null }, gap: { classPropertyName: "gap", publicName: "gap", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, template: { classPropertyName: "template", publicName: "template", isSignal: true, isRequired: false, transformFunction: null }, context: { classPropertyName: "context", publicName: "context", isSignal: true, isRequired: false, transformFunction: null }, symbolName: { classPropertyName: "symbolName", publicName: "symbolName", isSignal: true, isRequired: false, transformFunction: null }, active: { classPropertyName: "active", publicName: "active", isSignal: true, isRequired: false, transformFunction: null }, hoverColor: { classPropertyName: "hoverColor", publicName: "hoverColor", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "menuitem", "tabindex": "-1" }, properties: { "attr.aria-disabled": "disabled() ? 'true' : null", "attr.aria-current": "active() ? 'true' : null", "class": "menuItemClassName()" } }, usesInheritance: true, ngImport: i0, template: "@let tpl = template();\n@let symbol = symbolName();\n@if (symbol) {\n <uni-symbol [name]=\"symbol\"></uni-symbol>\n}\n<div box-layout [grow]=\"1\">\n @if (tpl) {\n <ng-container [ngTemplateOutlet]=\"tpl\" [ngTemplateOutletContext]=\"context()\"></ng-container>\n } @else {\n <span uni-text=\"label\" display=\"block\" [nowrap]=\"true\">\n {{ label() }}\n </span>\n }\n</div>\n@if (active()) {\n <uni-symbol name=\"check\"></uni-symbol>\n}\n", styles: [":host.disabled{color:#ddd;pointer-events:none}\n"], dependencies: [{ kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4034
4133
|
}
|
|
4035
4134
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniMenuItemComponent, decorators: [{
|
|
4036
4135
|
type: Component,
|
|
4037
|
-
args: [{ selector: '
|
|
4136
|
+
args: [{ selector: '[uni-menu-item], [menu-item]', imports: [UniTextComponent, UniSymbolComponent, UniBoxComponent, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
4038
4137
|
role: 'menuitem',
|
|
4039
4138
|
tabindex: '-1',
|
|
4040
4139
|
'[attr.aria-disabled]': "disabled() ? 'true' : null",
|
|
4041
4140
|
'[attr.aria-current]': "active() ? 'true' : null",
|
|
4042
4141
|
'[class]': 'menuItemClassName()',
|
|
4043
|
-
}, template: "@let tpl = template();\n@let symbol = symbolName();\n@if (symbol) {\n <
|
|
4142
|
+
}, template: "@let tpl = template();\n@let symbol = symbolName();\n@if (symbol) {\n <uni-symbol [name]=\"symbol\"></uni-symbol>\n}\n<div box-layout [grow]=\"1\">\n @if (tpl) {\n <ng-container [ngTemplateOutlet]=\"tpl\" [ngTemplateOutletContext]=\"context()\"></ng-container>\n } @else {\n <span uni-text=\"label\" display=\"block\" [nowrap]=\"true\">\n {{ label() }}\n </span>\n }\n</div>\n@if (active()) {\n <uni-symbol name=\"check\"></uni-symbol>\n}\n", styles: [":host.disabled{color:#ddd;pointer-events:none}\n"] }]
|
|
4044
4143
|
}], propDecorators: { display: [{ type: i0.Input, args: [{ isSignal: true, alias: "display", required: false }] }], flexDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "flexDirection", required: false }] }], alignItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "alignItems", required: false }] }], paddingHorizontal: [{ type: i0.Input, args: [{ isSignal: true, alias: "paddingHorizontal", required: false }] }], gap: [{ type: i0.Input, args: [{ isSignal: true, alias: "gap", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], template: [{ type: i0.Input, args: [{ isSignal: true, alias: "template", required: false }] }], context: [{ type: i0.Input, args: [{ isSignal: true, alias: "context", required: false }] }], symbolName: [{ type: i0.Input, args: [{ isSignal: true, alias: "symbolName", required: false }] }], active: [{ type: i0.Input, args: [{ isSignal: true, alias: "active", required: false }] }], hoverColor: [{ type: i0.Input, args: [{ isSignal: true, alias: "hoverColor", required: false }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }] } });
|
|
4045
4144
|
|
|
4046
4145
|
class UniMenuComponent {
|
|
@@ -4146,7 +4245,7 @@ class UniMenuComponent {
|
|
|
4146
4245
|
}
|
|
4147
4246
|
}
|
|
4148
4247
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniMenuComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4149
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniMenuComponent, isStandalone: true, selector: "
|
|
4248
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniMenuComponent, isStandalone: true, selector: "uni-menu", inputs: { menuItems: { classPropertyName: "menuItems", publicName: "menuItems", isSignal: true, isRequired: true, transformFunction: null }, activeItem: { classPropertyName: "activeItem", publicName: "activeItem", isSignal: true, isRequired: false, transformFunction: null }, placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { menuItemClicked: "menuItemClicked" }, host: { properties: { "class": "className()" } }, viewQueries: [{ propertyName: "itemComponents", predicate: UniMenuItemComponent, descendants: true, isSignal: true }, { propertyName: "dropdownComponent", first: true, predicate: UniDropdownComponent, descendants: true, isSignal: true }], ngImport: i0, template: `
|
|
4150
4249
|
<!-- Keydown listens for arrow keys bubbling from the projected (focusable)
|
|
4151
4250
|
trigger; the wrapper itself must stay out of the tab order. -->
|
|
4152
4251
|
<!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->
|
|
@@ -4155,7 +4254,7 @@ class UniMenuComponent {
|
|
|
4155
4254
|
</div>
|
|
4156
4255
|
|
|
4157
4256
|
@if (menuItems()) {
|
|
4158
|
-
<
|
|
4257
|
+
<uni-dropdown
|
|
4159
4258
|
[trigger]="trigger"
|
|
4160
4259
|
[placement]="placement()"
|
|
4161
4260
|
ariaHasPopup="menu"
|
|
@@ -4181,14 +4280,14 @@ class UniMenuComponent {
|
|
|
4181
4280
|
></div>
|
|
4182
4281
|
}
|
|
4183
4282
|
</div>
|
|
4184
|
-
</
|
|
4283
|
+
</uni-dropdown>
|
|
4185
4284
|
}
|
|
4186
|
-
`, isInline: true, dependencies: [{ kind: "component", type: UniMenuItemComponent, selector: "
|
|
4285
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UniMenuItemComponent, selector: "[uni-menu-item], [menu-item]", inputs: ["display", "flexDirection", "alignItems", "paddingHorizontal", "gap", "label", "template", "context", "symbolName", "active", "hoverColor", "disabled"] }, { kind: "component", type: UniDropdownComponent, selector: "uni-dropdown", inputs: ["trigger", "placement", "offset", "ariaHasPopup", "paddingVertical", "paddingHorizontal"], outputs: ["dropdownShowing", "dropdownHiding"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4187
4286
|
}
|
|
4188
4287
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniMenuComponent, decorators: [{
|
|
4189
4288
|
type: Component,
|
|
4190
4289
|
args: [{
|
|
4191
|
-
selector: '
|
|
4290
|
+
selector: 'uni-menu',
|
|
4192
4291
|
imports: [UniMenuItemComponent, UniDropdownComponent],
|
|
4193
4292
|
changeDetection: ChangeDetectionStrategy.OnPush, // Crucial for zoneless
|
|
4194
4293
|
template: `
|
|
@@ -4200,7 +4299,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
4200
4299
|
</div>
|
|
4201
4300
|
|
|
4202
4301
|
@if (menuItems()) {
|
|
4203
|
-
<
|
|
4302
|
+
<uni-dropdown
|
|
4204
4303
|
[trigger]="trigger"
|
|
4205
4304
|
[placement]="placement()"
|
|
4206
4305
|
ariaHasPopup="menu"
|
|
@@ -4226,7 +4325,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
4226
4325
|
></div>
|
|
4227
4326
|
}
|
|
4228
4327
|
</div>
|
|
4229
|
-
</
|
|
4328
|
+
</uni-dropdown>
|
|
4230
4329
|
}
|
|
4231
4330
|
`,
|
|
4232
4331
|
host: { '[class]': 'className()' },
|
|
@@ -4275,11 +4374,11 @@ class UniMultiSelectComponent {
|
|
|
4275
4374
|
width: '100%',
|
|
4276
4375
|
});
|
|
4277
4376
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniMultiSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4278
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniMultiSelectComponent, isStandalone: true, selector: "uni-multi-select
|
|
4377
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniMultiSelectComponent, isStandalone: true, selector: "uni-multi-select", inputs: { options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, selections: { classPropertyName: "selections", publicName: "selections", isSignal: true, isRequired: false, transformFunction: null }, flexDirection: { classPropertyName: "flexDirection", publicName: "flexDirection", isSignal: true, isRequired: false, transformFunction: null }, checkboxGap: { classPropertyName: "checkboxGap", publicName: "checkboxGap", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { updates: "updates" }, host: { properties: { "class": "className" } }, ngImport: i0, template: "<div box-layout display=\"flex\" [flexDirection]=\"flexDirection()\" [gap]=\"checkboxGap()\">\n @for (option of options(); track option) {\n <div [class]=\"optionWrapper\">\n <uni-checkbox\n [label]=\"option.label\"\n [checked]=\"values().indexOf(option.value) > -1\"\n (checkedChange)=\"handleCheck($event, option.value)\"\n variant=\"primary\"\n >\n </uni-checkbox>\n </div>\n }\n</div>\n", dependencies: [{ kind: "component", type: UniCheckboxComponent, selector: "uni-checkbox", inputs: ["checked", "disabled", "touched", "invalid", "dirty", "required", "ariaDescribedBy", "label", "indeterminate"], outputs: ["checkedChange", "touchedChange", "indeterminateChange"] }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4279
4378
|
}
|
|
4280
4379
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniMultiSelectComponent, decorators: [{
|
|
4281
4380
|
type: Component,
|
|
4282
|
-
args: [{ selector: 'uni-multi-select
|
|
4381
|
+
args: [{ selector: 'uni-multi-select', imports: [UniCheckboxComponent, UniBoxComponent], host: { '[class]': 'className' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div box-layout display=\"flex\" [flexDirection]=\"flexDirection()\" [gap]=\"checkboxGap()\">\n @for (option of options(); track option) {\n <div [class]=\"optionWrapper\">\n <uni-checkbox\n [label]=\"option.label\"\n [checked]=\"values().indexOf(option.value) > -1\"\n (checkedChange)=\"handleCheck($event, option.value)\"\n variant=\"primary\"\n >\n </uni-checkbox>\n </div>\n }\n</div>\n" }]
|
|
4283
4382
|
}], propDecorators: { options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], selections: [{ type: i0.Input, args: [{ isSignal: true, alias: "selections", required: false }] }], updates: [{ type: i0.Output, args: ["updates"] }], flexDirection: [{ type: i0.Input, args: [{ isSignal: true, alias: "flexDirection", required: false }] }], checkboxGap: [{ type: i0.Input, args: [{ isSignal: true, alias: "checkboxGap", required: false }] }] } });
|
|
4284
4383
|
|
|
4285
4384
|
class UniMultiSelectDropdownComponent extends BaseComponent {
|
|
@@ -4379,11 +4478,11 @@ class UniMultiSelectDropdownComponent extends BaseComponent {
|
|
|
4379
4478
|
});
|
|
4380
4479
|
}
|
|
4381
4480
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniMultiSelectDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4382
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniMultiSelectDropdownComponent, isStandalone: true, selector: "uni-multi-select-dropdown
|
|
4481
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniMultiSelectDropdownComponent, isStandalone: true, selector: "uni-multi-select-dropdown", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, dirty: { classPropertyName: "dirty", publicName: "dirty", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, host: { properties: { "class": "className" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'multiSelectDropdown' }], usesInheritance: true, ngImport: i0, template: "<button\n [class]=\"triggerClass\"\n #trigger\n [style.cursor]=\"disabled() ? 'default' : 'pointer'\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n (click)=\"!disabled() && touched.set(true)\"\n>\n <uni-input-box [error]=\"showError()\" [disabled]=\"disabled()\">\n <div\n row-layout\n alignItems=\"center\"\n justifyContent=\"space-between\"\n [fullWidth]=\"true\"\n [minWidth]=\"0\"\n paddingLeft=\"sm\"\n >\n <span uni-text\n display=\"block\"\n [typeface]=\"componentOptions().textRole\"\n [color]=\"textColor()\"\n [ellipsis]=\"true\"\n [style.flex-grow]=\"1\"\n >{{ selectedLabelsText() }}</span>\n <uni-symbol name=\"keyboard_arrow_down\" [style.flex-shrink]=\"0\"></uni-symbol>\n </div>\n </uni-input-box>\n</button>\n<uni-dropdown\n #dropdown\n [trigger]=\"trigger\"\n ariaHasPopup=\"dialog\"\n (dropdownShowing)=\"$event && searchInput.focus()\"\n (dropdownHiding)=\"$event && trigger.focus()\"\n>\n <div box-layout gap=\"xs\" padding=\"xs\">\n <input\n #searchInput\n type=\"text\"\n [class]=\"searchInputClass()\"\n [value]=\"query()\"\n (input)=\"handleQueryInput($event)\"\n placeholder=\"Search...\"\n aria-label=\"Filter options\"\n (click)=\"$event.stopPropagation()\"\n [disabled]=\"disabled()\"\n />\n </div>\n\n <uni-divider [border]=\"componentOptions().dividerBorder\" />\n\n <div stack-layout gap=\"xs\" padding=\"xs\">\n @for (option of filteredOptions(); track option.value) {\n <uni-checkbox\n [label]=\"option.label\"\n [checked]=\"isOptionSelected(option)()\"\n (checkedChange)=\"toggleOption(option, $event)\"\n variant=\"primary\"\n [disabled]=\"disabled()\"\n >\n </uni-checkbox>\n }\n </div>\n\n <uni-divider [border]=\"componentOptions().dividerBorder\" />\n\n <div row-layout gap=\"xs\" justifyContent=\"space-around\" padding=\"xs\">\n <button text-button (click)=\"dropdown.hideDropdown()\" size=\"sm\" variant=\"ghost\">Done</button>\n </div>\n</uni-dropdown>\n", dependencies: [{ kind: "component", type: UniCheckboxComponent, selector: "uni-checkbox", inputs: ["checked", "disabled", "touched", "invalid", "dirty", "required", "ariaDescribedBy", "label", "indeterminate"], outputs: ["checkedChange", "touchedChange", "indeterminateChange"] }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniDropdownComponent, selector: "uni-dropdown", inputs: ["trigger", "placement", "offset", "ariaHasPopup", "paddingVertical", "paddingHorizontal"], outputs: ["dropdownShowing", "dropdownHiding"] }, { kind: "component", type: UniStackComponent, selector: "[uni-stack-layout], [stack-layout]", inputs: ["display", "flexDirection", "minHeight"] }, { kind: "component", type: UniDividerComponent, selector: "uni-divider", inputs: ["orientation", "border"] }, { kind: "component", type: UniButtonComponent, selector: "button[uni-text-button], button[text-button]", inputs: ["disable", "loading", "fullWidth", "symbolLeft", "symbolRight"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }, { kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }, { kind: "component", type: UniInputBoxComponent, selector: "uni-input-box", inputs: ["disabled", "error", "minWidth", "height"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4383
4482
|
}
|
|
4384
4483
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniMultiSelectDropdownComponent, decorators: [{
|
|
4385
4484
|
type: Component,
|
|
4386
|
-
args: [{ selector: 'uni-multi-select-dropdown
|
|
4485
|
+
args: [{ selector: 'uni-multi-select-dropdown', imports: [
|
|
4387
4486
|
UniCheckboxComponent,
|
|
4388
4487
|
UniBoxComponent,
|
|
4389
4488
|
UniDropdownComponent,
|
|
@@ -4394,7 +4493,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
4394
4493
|
UniSymbolComponent,
|
|
4395
4494
|
UniRowComponent,
|
|
4396
4495
|
UniInputBoxComponent,
|
|
4397
|
-
], providers: [{ provide: COMPONENT_NAME, useValue: 'multiSelectDropdown' }], host: { '[class]': 'className' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n [class]=\"triggerClass\"\n #trigger\n [style.cursor]=\"disabled() ? 'default' : 'pointer'\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n (click)=\"!disabled() && touched.set(true)\"\n>\n <uni-input-box [error]=\"showError()\" [disabled]=\"disabled()\">\n <div\n row-layout\n alignItems=\"center\"\n justifyContent=\"space-between\"\n [fullWidth]=\"true\"\n [minWidth]=\"0\"\n paddingLeft=\"sm\"\n >\n <
|
|
4496
|
+
], providers: [{ provide: COMPONENT_NAME, useValue: 'multiSelectDropdown' }], host: { '[class]': 'className' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<button\n [class]=\"triggerClass\"\n #trigger\n [style.cursor]=\"disabled() ? 'default' : 'pointer'\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n (click)=\"!disabled() && touched.set(true)\"\n>\n <uni-input-box [error]=\"showError()\" [disabled]=\"disabled()\">\n <div\n row-layout\n alignItems=\"center\"\n justifyContent=\"space-between\"\n [fullWidth]=\"true\"\n [minWidth]=\"0\"\n paddingLeft=\"sm\"\n >\n <span uni-text\n display=\"block\"\n [typeface]=\"componentOptions().textRole\"\n [color]=\"textColor()\"\n [ellipsis]=\"true\"\n [style.flex-grow]=\"1\"\n >{{ selectedLabelsText() }}</span>\n <uni-symbol name=\"keyboard_arrow_down\" [style.flex-shrink]=\"0\"></uni-symbol>\n </div>\n </uni-input-box>\n</button>\n<uni-dropdown\n #dropdown\n [trigger]=\"trigger\"\n ariaHasPopup=\"dialog\"\n (dropdownShowing)=\"$event && searchInput.focus()\"\n (dropdownHiding)=\"$event && trigger.focus()\"\n>\n <div box-layout gap=\"xs\" padding=\"xs\">\n <input\n #searchInput\n type=\"text\"\n [class]=\"searchInputClass()\"\n [value]=\"query()\"\n (input)=\"handleQueryInput($event)\"\n placeholder=\"Search...\"\n aria-label=\"Filter options\"\n (click)=\"$event.stopPropagation()\"\n [disabled]=\"disabled()\"\n />\n </div>\n\n <uni-divider [border]=\"componentOptions().dividerBorder\" />\n\n <div stack-layout gap=\"xs\" padding=\"xs\">\n @for (option of filteredOptions(); track option.value) {\n <uni-checkbox\n [label]=\"option.label\"\n [checked]=\"isOptionSelected(option)()\"\n (checkedChange)=\"toggleOption(option, $event)\"\n variant=\"primary\"\n [disabled]=\"disabled()\"\n >\n </uni-checkbox>\n }\n </div>\n\n <uni-divider [border]=\"componentOptions().dividerBorder\" />\n\n <div row-layout gap=\"xs\" justifyContent=\"space-around\" padding=\"xs\">\n <button text-button (click)=\"dropdown.hideDropdown()\" size=\"sm\" variant=\"ghost\">Done</button>\n </div>\n</uni-dropdown>\n" }]
|
|
4398
4497
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], dirty: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirty", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], ariaDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedBy", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }] } });
|
|
4399
4498
|
|
|
4400
4499
|
class UniNotificationBadgeComponent extends BaseComponent {
|
|
@@ -4489,11 +4588,11 @@ class UniNotificationBadgeComponent extends BaseComponent {
|
|
|
4489
4588
|
});
|
|
4490
4589
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
4491
4590
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniNotificationBadgeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4492
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniNotificationBadgeComponent, isStandalone: true, selector: "uni-notification-badge", inputs: { count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, maxCount: { classPropertyName: "maxCount", publicName: "maxCount", isSignal: true, isRequired: false, transformFunction: null }, badgeVariant: { classPropertyName: "badgeVariant", publicName: "badgeVariant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'notificationBadge' }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n@if (shouldShow()) {\n<div class=\"notification-badge-indicator\" aria-hidden=\"true\">\n <uni-text\n typeface=\"overline\"\n align=\"center\"\n [style.max-width]=\"badgeVariant() !== 'pill' ? (displayValue().length * 5 + 'px') : ''\"\n >{{ displayValue() }}</
|
|
4591
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniNotificationBadgeComponent, isStandalone: true, selector: "uni-notification-badge", inputs: { count: { classPropertyName: "count", publicName: "count", isSignal: true, isRequired: false, transformFunction: null }, maxCount: { classPropertyName: "maxCount", publicName: "maxCount", isSignal: true, isRequired: false, transformFunction: null }, badgeVariant: { classPropertyName: "badgeVariant", publicName: "badgeVariant", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: false, transformFunction: null }, show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'notificationBadge' }], usesInheritance: true, ngImport: i0, template: "<ng-content></ng-content>\n@if (shouldShow()) {\n<div class=\"notification-badge-indicator\" aria-hidden=\"true\">\n <span uni-text\n typeface=\"overline\"\n align=\"center\"\n [style.max-width]=\"badgeVariant() !== 'pill' ? (displayValue().length * 5 + 'px') : ''\"\n >{{ displayValue() }}</span>\n</div>\n<span [class]=\"srOnlyClass\">{{ announcement() }}</span>\n}\n", dependencies: [{ kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4493
4592
|
}
|
|
4494
4593
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniNotificationBadgeComponent, decorators: [{
|
|
4495
4594
|
type: Component,
|
|
4496
|
-
args: [{ selector: 'uni-notification-badge', imports: [UniTextComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'notificationBadge' }], host: { '[class]': 'className()' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n@if (shouldShow()) {\n<div class=\"notification-badge-indicator\" aria-hidden=\"true\">\n <uni-text\n typeface=\"overline\"\n align=\"center\"\n [style.max-width]=\"badgeVariant() !== 'pill' ? (displayValue().length * 5 + 'px') : ''\"\n >{{ displayValue() }}</
|
|
4595
|
+
args: [{ selector: 'uni-notification-badge', imports: [UniTextComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'notificationBadge' }], host: { '[class]': 'className()' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>\n@if (shouldShow()) {\n<div class=\"notification-badge-indicator\" aria-hidden=\"true\">\n <span uni-text\n typeface=\"overline\"\n align=\"center\"\n [style.max-width]=\"badgeVariant() !== 'pill' ? (displayValue().length * 5 + 'px') : ''\"\n >{{ displayValue() }}</span>\n</div>\n<span [class]=\"srOnlyClass\">{{ announcement() }}</span>\n}\n" }]
|
|
4497
4596
|
}], propDecorators: { count: [{ type: i0.Input, args: [{ isSignal: true, alias: "count", required: false }] }], maxCount: [{ type: i0.Input, args: [{ isSignal: true, alias: "maxCount", required: false }] }], badgeVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "badgeVariant", required: false }] }], color: [{ type: i0.Input, args: [{ isSignal: true, alias: "color", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
4498
4597
|
|
|
4499
4598
|
class UniAlertComponent extends BaseComponent {
|
|
@@ -4562,18 +4661,18 @@ class UniAlertComponent extends BaseComponent {
|
|
|
4562
4661
|
}
|
|
4563
4662
|
effectiveIconName = computed(() => this.iconName(), ...(ngDevMode ? [{ debugName: "effectiveIconName" }] : /* istanbul ignore next */ []));
|
|
4564
4663
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4565
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniAlertComponent, isStandalone: true, selector: "uni-alert
|
|
4664
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniAlertComponent, isStandalone: true, selector: "uni-alert", inputs: { show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, iconName: { classPropertyName: "iconName", publicName: "iconName", isSignal: true, isRequired: false, transformFunction: null }, symbolName: { classPropertyName: "symbolName", publicName: "symbolName", isSignal: true, isRequired: false, transformFunction: null }, useVariant: { classPropertyName: "useVariant", publicName: "useVariant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { show: "showChange", showing: "showing" }, providers: [{ provide: COMPONENT_NAME, useValue: 'alert' }], viewQueries: [{ propertyName: "alertRef", first: true, predicate: ["alert"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<!-- role=\"alert\" makes the message announce immediately when shown -->\n<dialog #alert [class]=\"alertClass()\" role=\"alert\">\n <div row-layout gap=\"md\">\n @if (iconName() || symbolName()) {\n <div box-layout [height]=\"26\" [width]=\"26\">\n @if (effectiveIconName()) {\n <uni-icon [name]=\"effectiveIconName()!\" />\n } @else {\n <uni-symbol [name]=\"symbolName()!\" [opticalSize]=\"26\" />\n }\n </div>\n }\n <span uni-text>\n <ng-content></ng-content>\n </span>\n <button icon-button (click)=\"close()\" iconName=\"close\" size=\"md\">close</button>\n </div>\n</dialog>\n", dependencies: [{ kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }, { kind: "component", type: UniIconButtonComponent, selector: "button[uni-icon-button], button[icon-button]", inputs: ["ariaLabel", "iconName", "symbolName", "variant", "size", "disable", "loading", "opticalSize"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniIconComponent, selector: "uni-icon", inputs: ["color", "name"] }, { kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4566
4665
|
}
|
|
4567
4666
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniAlertComponent, decorators: [{
|
|
4568
4667
|
type: Component,
|
|
4569
|
-
args: [{ selector: 'uni-alert
|
|
4668
|
+
args: [{ selector: 'uni-alert', imports: [
|
|
4570
4669
|
UniRowComponent,
|
|
4571
4670
|
UniIconButtonComponent,
|
|
4572
4671
|
UniTextComponent,
|
|
4573
4672
|
UniBoxComponent,
|
|
4574
4673
|
UniIconComponent,
|
|
4575
4674
|
UniSymbolComponent,
|
|
4576
|
-
], providers: [{ provide: COMPONENT_NAME, useValue: 'alert' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- role=\"alert\" makes the message announce immediately when shown -->\n<dialog #alert [class]=\"alertClass()\" role=\"alert\">\n <div row-layout gap=\"md\">\n @if (iconName() || symbolName()) {\n <div box-layout [height]=\"26\" [width]=\"26\">\n @if (effectiveIconName()) {\n <
|
|
4675
|
+
], providers: [{ provide: COMPONENT_NAME, useValue: 'alert' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- role=\"alert\" makes the message announce immediately when shown -->\n<dialog #alert [class]=\"alertClass()\" role=\"alert\">\n <div row-layout gap=\"md\">\n @if (iconName() || symbolName()) {\n <div box-layout [height]=\"26\" [width]=\"26\">\n @if (effectiveIconName()) {\n <uni-icon [name]=\"effectiveIconName()!\" />\n } @else {\n <uni-symbol [name]=\"symbolName()!\" [opticalSize]=\"26\" />\n }\n </div>\n }\n <span uni-text>\n <ng-content></ng-content>\n </span>\n <button icon-button (click)=\"close()\" iconName=\"close\" size=\"md\">close</button>\n </div>\n</dialog>\n" }]
|
|
4577
4676
|
}], ctorParameters: () => [], propDecorators: { show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }, { type: i0.Output, args: ["showChange"] }], iconName: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconName", required: false }] }], symbolName: [{ type: i0.Input, args: [{ isSignal: true, alias: "symbolName", required: false }] }], useVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "useVariant", required: false }] }], showing: [{ type: i0.Output, args: ["showing"] }], alertRef: [{
|
|
4578
4677
|
type: ViewChild,
|
|
4579
4678
|
args: ['alert']
|
|
@@ -4584,17 +4683,17 @@ class ConfirmationDialogComponent {
|
|
|
4584
4683
|
confirmation = input(...(ngDevMode ? [undefined, { debugName: "confirmation" }] : /* istanbul ignore next */ []));
|
|
4585
4684
|
showing = output();
|
|
4586
4685
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ConfirmationDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4587
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: ConfirmationDialogComponent, isStandalone: true, selector: "uni-confirmation-dialog
|
|
4686
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: ConfirmationDialogComponent, isStandalone: true, selector: "uni-confirmation-dialog", inputs: { show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, confirmation: { classPropertyName: "confirmation", publicName: "confirmation", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { showing: "showing" }, ngImport: i0, template: "<dialog uni-dialog [show]=\"show()\" (showing)=\"showing.emit($event)\">\n <div uni-dialog-header>\n {{ confirmation()?.title }}\n </div>\n <div box-layout padding=\"md\">\n <span uni-text>\n {{ confirmation()?.message }}\n </span>\n </div>\n <div\n dialog-buttons\n [confirmButtonText]=\"confirmation()?.actionLabel\"\n (confirmed)=\"confirmation()?.action()\"\n [cancelButtonText]=\"confirmation()?.dismissLabel\"\n ></div>\n</dialog>\n", dependencies: [{ kind: "component", type: UniDialogComponent, selector: "dialog[uni-dialog]", inputs: ["show", "ariaLabel", "initialFocus", "defaultCloseButton"], outputs: ["showChange", "showing"] }, { kind: "component", type: UniDialogHeaderComponent, selector: "[uni-dialog-header]" }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniDialogButtonsComponent, selector: "[uni-dialog-buttons], [dialog-buttons]", inputs: ["confirmButtonText", "confirmButtonVariant", "cancelButtonText", "disableConfirm", "padding", "paddingBottom", "justifyContent"], outputs: ["confirmed"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4588
4687
|
}
|
|
4589
4688
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: ConfirmationDialogComponent, decorators: [{
|
|
4590
4689
|
type: Component,
|
|
4591
|
-
args: [{ selector: 'uni-confirmation-dialog
|
|
4690
|
+
args: [{ selector: 'uni-confirmation-dialog', changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
4592
4691
|
UniDialogComponent,
|
|
4593
4692
|
UniDialogHeaderComponent,
|
|
4594
4693
|
UniBoxComponent,
|
|
4595
4694
|
UniTextComponent,
|
|
4596
4695
|
UniDialogButtonsComponent,
|
|
4597
|
-
], template: "<dialog uni-dialog [show]=\"show()\" (showing)=\"showing.emit($event)\">\n <div uni-dialog-header>\n {{ confirmation()?.title }}\n </div>\n <div box-layout padding=\"md\">\n <
|
|
4696
|
+
], template: "<dialog uni-dialog [show]=\"show()\" (showing)=\"showing.emit($event)\">\n <div uni-dialog-header>\n {{ confirmation()?.title }}\n </div>\n <div box-layout padding=\"md\">\n <span uni-text>\n {{ confirmation()?.message }}\n </span>\n </div>\n <div\n dialog-buttons\n [confirmButtonText]=\"confirmation()?.actionLabel\"\n (confirmed)=\"confirmation()?.action()\"\n [cancelButtonText]=\"confirmation()?.dismissLabel\"\n ></div>\n</dialog>\n" }]
|
|
4598
4697
|
}], propDecorators: { show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }], confirmation: [{ type: i0.Input, args: [{ isSignal: true, alias: "confirmation", required: false }] }], showing: [{ type: i0.Output, args: ["showing"] }] } });
|
|
4599
4698
|
|
|
4600
4699
|
class UniSnackbarComponent extends BaseComponent {
|
|
@@ -4681,11 +4780,11 @@ class UniSnackbarComponent extends BaseComponent {
|
|
|
4681
4780
|
this.timer.resume();
|
|
4682
4781
|
}
|
|
4683
4782
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSnackbarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4684
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniSnackbarComponent, isStandalone: true, selector: "uni-snackbar
|
|
4783
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniSnackbarComponent, isStandalone: true, selector: "uni-snackbar", inputs: { show: { classPropertyName: "show", publicName: "show", isSignal: true, isRequired: false, transformFunction: null }, iconName: { classPropertyName: "iconName", publicName: "iconName", isSignal: true, isRequired: false, transformFunction: null }, symbolName: { classPropertyName: "symbolName", publicName: "symbolName", isSignal: true, isRequired: false, transformFunction: null }, timeout: { classPropertyName: "timeout", publicName: "timeout", isSignal: true, isRequired: false, transformFunction: null }, actionLabel: { classPropertyName: "actionLabel", publicName: "actionLabel", isSignal: true, isRequired: false, transformFunction: null }, useVariant: { classPropertyName: "useVariant", publicName: "useVariant", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { show: "showChange", action: "action", showing: "showing" }, providers: [{ provide: COMPONENT_NAME, useValue: 'snackbar' }], viewQueries: [{ propertyName: "snackbarRef", first: true, predicate: ["snackbar"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "@let icon = iconName();\n@let symbol = symbolName();\n<!-- role=\"status\" announces the message politely without stealing focus -->\n<dialog\n #snackbar\n [class]=\"snackbarClass()\"\n role=\"status\"\n (mouseenter)=\"pauseTimer()\"\n (mouseleave)=\"resumeTimer()\"\n (focusin)=\"pauseTimer()\"\n (focusout)=\"resumeTimer()\"\n>\n <div row-layout alignItems=\"center\">\n @if (icon || symbol) {\n <div box-layout [height]=\"26\" [width]=\"26\" paddingLeft=\"sm\">\n @if (icon) {\n <uni-icon [name]=\"icon\"></uni-icon>\n } @else if (symbol) {\n <uni-symbol [name]=\"symbol\" [opticalSize]=\"26\"></uni-symbol>\n }\n </div>\n }\n <div box-layout padding=\"sm\">\n <span uni-text>\n <ng-content></ng-content>\n </span>\n </div>\n <div box-layout paddingRight=\"sm\">\n @if (!actionLabel()) {\n <button icon-button (click)=\"close()\" iconName=\"close\" size=\"md\">Close</button>\n } @else {\n <button text-button variant=\"ghost\" (click)=\"this.action.emit(); close()\">\n {{ actionLabel() }}\n </button>\n }\n </div>\n </div>\n</dialog>\n", dependencies: [{ kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }, { kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniIconButtonComponent, selector: "button[uni-icon-button], button[icon-button]", inputs: ["ariaLabel", "iconName", "symbolName", "variant", "size", "disable", "loading", "opticalSize"] }, { kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }, { kind: "component", type: UniIconComponent, selector: "uni-icon", inputs: ["color", "name"] }, { kind: "component", type: UniButtonComponent, selector: "button[uni-text-button], button[text-button]", inputs: ["disable", "loading", "fullWidth", "symbolLeft", "symbolRight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4685
4784
|
}
|
|
4686
4785
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSnackbarComponent, decorators: [{
|
|
4687
4786
|
type: Component,
|
|
4688
|
-
args: [{ selector: 'uni-snackbar
|
|
4787
|
+
args: [{ selector: 'uni-snackbar', imports: [
|
|
4689
4788
|
UniRowComponent,
|
|
4690
4789
|
UniBoxComponent,
|
|
4691
4790
|
UniTextComponent,
|
|
@@ -4693,7 +4792,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
4693
4792
|
UniSymbolComponent,
|
|
4694
4793
|
UniIconComponent,
|
|
4695
4794
|
UniButtonComponent,
|
|
4696
|
-
], providers: [{ provide: COMPONENT_NAME, useValue: 'snackbar' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let icon = iconName();\n@let symbol = symbolName();\n<!-- role=\"status\" announces the message politely without stealing focus -->\n<dialog\n #snackbar\n [class]=\"snackbarClass()\"\n role=\"status\"\n (mouseenter)=\"pauseTimer()\"\n (mouseleave)=\"resumeTimer()\"\n (focusin)=\"pauseTimer()\"\n (focusout)=\"resumeTimer()\"\n>\n <
|
|
4795
|
+
], providers: [{ provide: COMPONENT_NAME, useValue: 'snackbar' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "@let icon = iconName();\n@let symbol = symbolName();\n<!-- role=\"status\" announces the message politely without stealing focus -->\n<dialog\n #snackbar\n [class]=\"snackbarClass()\"\n role=\"status\"\n (mouseenter)=\"pauseTimer()\"\n (mouseleave)=\"resumeTimer()\"\n (focusin)=\"pauseTimer()\"\n (focusout)=\"resumeTimer()\"\n>\n <div row-layout alignItems=\"center\">\n @if (icon || symbol) {\n <div box-layout [height]=\"26\" [width]=\"26\" paddingLeft=\"sm\">\n @if (icon) {\n <uni-icon [name]=\"icon\"></uni-icon>\n } @else if (symbol) {\n <uni-symbol [name]=\"symbol\" [opticalSize]=\"26\"></uni-symbol>\n }\n </div>\n }\n <div box-layout padding=\"sm\">\n <span uni-text>\n <ng-content></ng-content>\n </span>\n </div>\n <div box-layout paddingRight=\"sm\">\n @if (!actionLabel()) {\n <button icon-button (click)=\"close()\" iconName=\"close\" size=\"md\">Close</button>\n } @else {\n <button text-button variant=\"ghost\" (click)=\"this.action.emit(); close()\">\n {{ actionLabel() }}\n </button>\n }\n </div>\n </div>\n</dialog>\n" }]
|
|
4697
4796
|
}], ctorParameters: () => [], propDecorators: { show: [{ type: i0.Input, args: [{ isSignal: true, alias: "show", required: false }] }, { type: i0.Output, args: ["showChange"] }], iconName: [{ type: i0.Input, args: [{ isSignal: true, alias: "iconName", required: false }] }], symbolName: [{ type: i0.Input, args: [{ isSignal: true, alias: "symbolName", required: false }] }], timeout: [{ type: i0.Input, args: [{ isSignal: true, alias: "timeout", required: false }] }], actionLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "actionLabel", required: false }] }], useVariant: [{ type: i0.Input, args: [{ isSignal: true, alias: "useVariant", required: false }] }], action: [{ type: i0.Output, args: ["action"] }], showing: [{ type: i0.Output, args: ["showing"] }], snackbarRef: [{ type: i0.ViewChild, args: ['snackbar', { isSignal: true }] }] } });
|
|
4698
4797
|
|
|
4699
4798
|
class NotificationsComponent {
|
|
@@ -4733,11 +4832,11 @@ class NotificationsComponent {
|
|
|
4733
4832
|
this.notifications.hideAlert();
|
|
4734
4833
|
}
|
|
4735
4834
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: NotificationsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4736
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: NotificationsComponent, isStandalone: true, selector: "uni-notifications
|
|
4835
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.12", type: NotificationsComponent, isStandalone: true, selector: "uni-notifications", ngImport: i0, template: "<uni-alert\n [show]=\"showAlert()\"\n (showing)=\"handleAlertShowingEvent($event)\"\n [variant]=\"alert()?.variant || 'primary'\"\n [iconName]=\"alert()?.iconName\"\n [symbolName]=\"alert()?.symbolName\"\n >{{ alert()?.message }}</uni-alert>\n\n<uni-snackbar\n [show]=\"showSnackbar()\"\n (showing)=\"handleSnackbarShowingEvent($event)\"\n [variant]=\"snackbar()?.variant || 'primary'\"\n [actionLabel]=\"snackbar()?.actionLabel\"\n (action)=\"snackbar()?.action?.()\"\n [timeout]=\"snackbar()?.timeout\"\n [iconName]=\"snackbar()?.iconName\"\n [symbolName]=\"snackbar()?.symbolName\"\n >{{ snackbar()?.message }}</uni-snackbar>\n\n<uni-confirmation-dialog\n [show]=\"showConfirmation()\"\n (showing)=\"handleConfirmationShowingEvent($event)\"\n [confirmation]=\"confirmation()\"\n></uni-confirmation-dialog>\n", dependencies: [{ kind: "component", type: UniAlertComponent, selector: "uni-alert", inputs: ["show", "iconName", "symbolName", "useVariant"], outputs: ["showChange", "showing"] }, { kind: "component", type: UniSnackbarComponent, selector: "uni-snackbar", inputs: ["show", "iconName", "symbolName", "timeout", "actionLabel", "useVariant"], outputs: ["showChange", "action", "showing"] }, { kind: "component", type: ConfirmationDialogComponent, selector: "uni-confirmation-dialog", inputs: ["show", "confirmation"], outputs: ["showing"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4737
4836
|
}
|
|
4738
4837
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: NotificationsComponent, decorators: [{
|
|
4739
4838
|
type: Component,
|
|
4740
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-notifications
|
|
4839
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-notifications', imports: [UniAlertComponent, UniSnackbarComponent, ConfirmationDialogComponent], template: "<uni-alert\n [show]=\"showAlert()\"\n (showing)=\"handleAlertShowingEvent($event)\"\n [variant]=\"alert()?.variant || 'primary'\"\n [iconName]=\"alert()?.iconName\"\n [symbolName]=\"alert()?.symbolName\"\n >{{ alert()?.message }}</uni-alert>\n\n<uni-snackbar\n [show]=\"showSnackbar()\"\n (showing)=\"handleSnackbarShowingEvent($event)\"\n [variant]=\"snackbar()?.variant || 'primary'\"\n [actionLabel]=\"snackbar()?.actionLabel\"\n (action)=\"snackbar()?.action?.()\"\n [timeout]=\"snackbar()?.timeout\"\n [iconName]=\"snackbar()?.iconName\"\n [symbolName]=\"snackbar()?.symbolName\"\n >{{ snackbar()?.message }}</uni-snackbar>\n\n<uni-confirmation-dialog\n [show]=\"showConfirmation()\"\n (showing)=\"handleConfirmationShowingEvent($event)\"\n [confirmation]=\"confirmation()\"\n></uni-confirmation-dialog>\n" }]
|
|
4741
4840
|
}], ctorParameters: () => [] });
|
|
4742
4841
|
|
|
4743
4842
|
class UniPaginatorComponent extends BaseComponent {
|
|
@@ -4808,14 +4907,14 @@ class UniPaginatorComponent extends BaseComponent {
|
|
|
4808
4907
|
return typeof page === 'number';
|
|
4809
4908
|
}
|
|
4810
4909
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniPaginatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4811
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniPaginatorComponent, isStandalone: true, selector: "uni-paginator
|
|
4910
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniPaginatorComponent, isStandalone: true, selector: "uni-paginator", inputs: { datasource: { classPropertyName: "datasource", publicName: "datasource", isSignal: true, isRequired: false, transformFunction: null }, initPageSize: { classPropertyName: "initPageSize", publicName: "initPageSize", isSignal: true, isRequired: false, transformFunction: null }, showPageSize: { classPropertyName: "showPageSize", publicName: "showPageSize", isSignal: true, isRequired: false, transformFunction: null }, showPageJumper: { classPropertyName: "showPageJumper", publicName: "showPageJumper", isSignal: true, isRequired: false, transformFunction: null }, showPageNumbers: { classPropertyName: "showPageNumbers", publicName: "showPageNumbers", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "navigation", "aria-label": "Pagination" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'paginator' }], usesInheritance: true, ngImport: i0, template: "@let ds = datasource();\n@if (ds) {\n <div row-layout alignItems=\"center\" [gap]=\"componentOptions().gap\">\n @if (showPageSize()) {\n <div row-layout alignItems=\"center\" gap=\"sm\" paddingRight=\"sm\">\n <span uni-text [typeface]=\"componentOptions().textRole\">Show</span>\n <input\n type=\"number\"\n aria-label=\"Items per page\"\n [class]=\"inputClass()\"\n (change)=\"updatePageSize($event)\"\n min=\"1\"\n [max]=\"ds.recordCount()\"\n [value]=\"ds.pageSize()\"\n />\n </div>\n }\n\n @if (showPageNumbers()) {\n <button\n icon-button\n variant=\"ghost\"\n size=\"md\"\n symbolName=\"keyboard_double_arrow_left\"\n (click)=\"ds.firstPage()\"\n [disable]=\"ds.disablePrevious()\"\n >\n First Page\n </button>\n\n <button\n icon-button\n variant=\"ghost\"\n size=\"md\"\n symbolName=\"chevron_left\"\n (click)=\"ds.previousPage()\"\n [disable]=\"ds.disablePrevious()\"\n >\n Previous Page\n </button>\n\n @for (page of ds.truncatedPages(); track page) {\n @if (isNumber(page)) {\n <button\n type=\"button\"\n [class]=\"pageClass()\"\n [class.current]=\"page === ds.pageIndex() + 1\"\n [attr.aria-label]=\"'Page ' + page\"\n [attr.aria-current]=\"page === ds.pageIndex() + 1 ? 'page' : null\"\n (click)=\"ds.jumpToPage(page)\"\n >\n <span uni-text [typeface]=\"componentOptions().textRole\" display=\"block\">\n {{ page }}\n </span>\n </button>\n } @else {\n <div>\n <span uni-text [typeface]=\"componentOptions().textRole\" display=\"block\">\n {{ page }}\n </span>\n </div>\n }\n }\n\n <button\n icon-button\n variant=\"ghost\"\n size=\"md\"\n symbolName=\"chevron_right\"\n (click)=\"ds.nextPage()\"\n [disable]=\"ds.disableNext()\"\n >\n Next Page\n </button>\n\n <button\n icon-button\n variant=\"ghost\"\n size=\"md\"\n symbolName=\"keyboard_double_arrow_right\"\n (click)=\"ds.lastPage()\"\n [disable]=\"ds.disableNext()\"\n >\n Last Page\n </button>\n }\n\n @if (showPageJumper()) {\n <div row-layout alignItems=\"center\" gap=\"sm\" paddingLeft=\"sm\">\n <span uni-text [typeface]=\"componentOptions().textRole\">Jump to</span>\n <input\n type=\"number\"\n aria-label=\"Jump to page\"\n [class]=\"inputClass()\"\n (change)=\"jumpToPage($event)\"\n min=\"1\"\n [max]=\"ds.pageCount()\"\n [value]=\"ds.pageIndex() + 1\"\n />\n </div>\n }\n </div>\n}\n", dependencies: [{ kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }, { kind: "component", type: UniIconButtonComponent, selector: "button[uni-icon-button], button[icon-button]", inputs: ["ariaLabel", "iconName", "symbolName", "variant", "size", "disable", "loading", "opticalSize"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4812
4911
|
}
|
|
4813
4912
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniPaginatorComponent, decorators: [{
|
|
4814
4913
|
type: Component,
|
|
4815
|
-
args: [{ selector: 'uni-paginator
|
|
4914
|
+
args: [{ selector: 'uni-paginator', imports: [UniRowComponent, UniIconButtonComponent, UniTextComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'paginator' }], changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
4816
4915
|
role: 'navigation',
|
|
4817
4916
|
'aria-label': 'Pagination',
|
|
4818
|
-
}, template: "@let ds = datasource();\n@if (ds) {\n <div row-layout alignItems=\"center\" [gap]=\"componentOptions().gap\">\n @if (showPageSize()) {\n <div row-layout alignItems=\"center\" gap=\"sm\" paddingRight=\"sm\">\n <
|
|
4917
|
+
}, template: "@let ds = datasource();\n@if (ds) {\n <div row-layout alignItems=\"center\" [gap]=\"componentOptions().gap\">\n @if (showPageSize()) {\n <div row-layout alignItems=\"center\" gap=\"sm\" paddingRight=\"sm\">\n <span uni-text [typeface]=\"componentOptions().textRole\">Show</span>\n <input\n type=\"number\"\n aria-label=\"Items per page\"\n [class]=\"inputClass()\"\n (change)=\"updatePageSize($event)\"\n min=\"1\"\n [max]=\"ds.recordCount()\"\n [value]=\"ds.pageSize()\"\n />\n </div>\n }\n\n @if (showPageNumbers()) {\n <button\n icon-button\n variant=\"ghost\"\n size=\"md\"\n symbolName=\"keyboard_double_arrow_left\"\n (click)=\"ds.firstPage()\"\n [disable]=\"ds.disablePrevious()\"\n >\n First Page\n </button>\n\n <button\n icon-button\n variant=\"ghost\"\n size=\"md\"\n symbolName=\"chevron_left\"\n (click)=\"ds.previousPage()\"\n [disable]=\"ds.disablePrevious()\"\n >\n Previous Page\n </button>\n\n @for (page of ds.truncatedPages(); track page) {\n @if (isNumber(page)) {\n <button\n type=\"button\"\n [class]=\"pageClass()\"\n [class.current]=\"page === ds.pageIndex() + 1\"\n [attr.aria-label]=\"'Page ' + page\"\n [attr.aria-current]=\"page === ds.pageIndex() + 1 ? 'page' : null\"\n (click)=\"ds.jumpToPage(page)\"\n >\n <span uni-text [typeface]=\"componentOptions().textRole\" display=\"block\">\n {{ page }}\n </span>\n </button>\n } @else {\n <div>\n <span uni-text [typeface]=\"componentOptions().textRole\" display=\"block\">\n {{ page }}\n </span>\n </div>\n }\n }\n\n <button\n icon-button\n variant=\"ghost\"\n size=\"md\"\n symbolName=\"chevron_right\"\n (click)=\"ds.nextPage()\"\n [disable]=\"ds.disableNext()\"\n >\n Next Page\n </button>\n\n <button\n icon-button\n variant=\"ghost\"\n size=\"md\"\n symbolName=\"keyboard_double_arrow_right\"\n (click)=\"ds.lastPage()\"\n [disable]=\"ds.disableNext()\"\n >\n Last Page\n </button>\n }\n\n @if (showPageJumper()) {\n <div row-layout alignItems=\"center\" gap=\"sm\" paddingLeft=\"sm\">\n <span uni-text [typeface]=\"componentOptions().textRole\">Jump to</span>\n <input\n type=\"number\"\n aria-label=\"Jump to page\"\n [class]=\"inputClass()\"\n (change)=\"jumpToPage($event)\"\n min=\"1\"\n [max]=\"ds.pageCount()\"\n [value]=\"ds.pageIndex() + 1\"\n />\n </div>\n }\n </div>\n}\n" }]
|
|
4819
4918
|
}], ctorParameters: () => [], propDecorators: { datasource: [{ type: i0.Input, args: [{ isSignal: true, alias: "datasource", required: false }] }], initPageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "initPageSize", required: false }] }], showPageSize: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageSize", required: false }] }], showPageJumper: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageJumper", required: false }] }], showPageNumbers: [{ type: i0.Input, args: [{ isSignal: true, alias: "showPageNumbers", required: false }] }] } });
|
|
4820
4919
|
|
|
4821
4920
|
/**
|
|
@@ -4909,11 +5008,11 @@ class UniPopoverComponent {
|
|
|
4909
5008
|
});
|
|
4910
5009
|
}, ...(ngDevMode ? [{ debugName: "arrowClassName" }] : /* istanbul ignore next */ []));
|
|
4911
5010
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniPopoverComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4912
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniPopoverComponent, isStandalone: true, selector: "uni-popover
|
|
5011
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniPopoverComponent, isStandalone: true, selector: "uni-popover", inputs: { placement: { classPropertyName: "placement", publicName: "placement", isSignal: true, isRequired: false, transformFunction: null }, autoClose: { classPropertyName: "autoClose", publicName: "autoClose", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["trigger"], descendants: true, isSignal: true }, { propertyName: "panelRef", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "<!-- Click bubbles up from the projected [trigger] content, which is expected\n to be focusable (a button); keyboard activation arrives as a click. -->\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n<span #trigger (click)=\"togglePopover($event)\" [class]=\"triggerClassName\">\n <ng-content select=\"[trigger]\"></ng-content>\n</span>\n<div\n #panel\n [id]=\"panelId\"\n [attr.popover]=\"autoClose() ? 'auto' : 'manual'\"\n [class]=\"popoverClassName()\"\n (toggle)=\"onToggle($event)\"\n>\n <ng-content></ng-content>\n <span [class]=\"arrowClassName()\"></span>\n</div>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4913
5012
|
}
|
|
4914
5013
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniPopoverComponent, decorators: [{
|
|
4915
5014
|
type: Component,
|
|
4916
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-popover
|
|
5015
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-popover', imports: [], template: "<!-- Click bubbles up from the projected [trigger] content, which is expected\n to be focusable (a button); keyboard activation arrives as a click. -->\n<!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n<span #trigger (click)=\"togglePopover($event)\" [class]=\"triggerClassName\">\n <ng-content select=\"[trigger]\"></ng-content>\n</span>\n<div\n #panel\n [id]=\"panelId\"\n [attr.popover]=\"autoClose() ? 'auto' : 'manual'\"\n [class]=\"popoverClassName()\"\n (toggle)=\"onToggle($event)\"\n>\n <ng-content></ng-content>\n <span [class]=\"arrowClassName()\"></span>\n</div>\n" }]
|
|
4917
5016
|
}], ctorParameters: () => [], propDecorators: { placement: [{ type: i0.Input, args: [{ isSignal: true, alias: "placement", required: false }] }], autoClose: [{ type: i0.Input, args: [{ isSignal: true, alias: "autoClose", required: false }] }], triggerRef: [{ type: i0.ViewChild, args: ['trigger', { isSignal: true }] }], panelRef: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });
|
|
4918
5017
|
|
|
4919
5018
|
/**
|
|
@@ -4936,11 +5035,11 @@ class UniProgressBarComponent {
|
|
|
4936
5035
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
4937
5036
|
Math = Math;
|
|
4938
5037
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniProgressBarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4939
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniProgressBarComponent, isStandalone: true, selector: "uni-progress-bar
|
|
5038
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniProgressBarComponent, isStandalone: true, selector: "uni-progress-bar", inputs: { width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, percent: { classPropertyName: "percent", publicName: "percent", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar", "aria-valuemin": "0", "aria-valuemax": "100" }, properties: { "class": "className()", "attr.aria-valuenow": "percent()", "attr.aria-label": "ariaLabel() || 'Progress'" } }, ngImport: i0, template: "<svg aria-hidden=\"true\" [attr.width]=\"width()\" [attr.height]=\"height()\">\n <rect\n [attr.x]=\"stroke\"\n [attr.y]=\"stroke\"\n [attr.width]=\"width() - stroke * 2\"\n [attr.height]=\"height() - stroke * 2\"\n [attr.fill]=\"palette()['primary-surface']\"\n [attr.stroke]=\"palette()['on-background-variant']\"\n [attr.stroke-width]=\"stroke\"\n [attr.ry]=\"height() / 2 - stroke\"\n [attr.rx]=\"height() / 2 - stroke\"\n />\n\n <rect\n [attr.x]=\"stroke\"\n [attr.y]=\"stroke\"\n [attr.width]=\"Math.max(height() - stroke * 2, (percent() / 100) * width() - stroke * 2)\"\n [attr.height]=\"height() - stroke * 2\"\n [attr.fill]=\"percent() === 100 ? palette()['secondary'] : palette()['secondary-surface']\"\n [attr.stroke]=\"palette()['on-background-variant']\"\n [attr.stroke-width]=\"stroke\"\n [attr.ry]=\"height() / 2 - stroke\"\n [attr.rx]=\"height() / 2 - stroke\"\n />\n</svg>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4940
5039
|
}
|
|
4941
5040
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniProgressBarComponent, decorators: [{
|
|
4942
5041
|
type: Component,
|
|
4943
|
-
args: [{ selector: 'uni-progress-bar
|
|
5042
|
+
args: [{ selector: 'uni-progress-bar', imports: [], host: {
|
|
4944
5043
|
'[class]': 'className()',
|
|
4945
5044
|
role: 'progressbar',
|
|
4946
5045
|
'aria-valuemin': '0',
|
|
@@ -4990,11 +5089,11 @@ class UniProgressGaugeComponent extends BaseComponent {
|
|
|
4990
5089
|
});
|
|
4991
5090
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
4992
5091
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniProgressGaugeComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
4993
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniProgressGaugeComponent, isStandalone: true, selector: "uni-progress-gauge
|
|
5092
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniProgressGaugeComponent, isStandalone: true, selector: "uni-progress-gauge", inputs: { percent: { classPropertyName: "percent", publicName: "percent", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "role": "progressbar", "aria-valuemin": "0", "aria-valuemax": "100" }, properties: { "class": "className()", "attr.aria-valuenow": "percent()", "attr.aria-label": "ariaLabel() || 'Progress'" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'progressGauge' }], usesInheritance: true, ngImport: i0, template: "<svg\n viewBox=\"0 0 36 36\"\n class=\"circular-chart\"\n aria-hidden=\"true\"\n [style.height]=\"style()['height']\"\n>\n <path\n class=\"circle-bg\"\n [attr.stroke]=\"style()['backgroundColor']\"\n d=\"M18 2.0845\n a 15.9155 15.9155 0 0 1 0 31.831\n a 15.9155 15.9155 0 0 1 0 -31.831\"\n />\n <path\n class=\"circle\"\n [attr.stroke]=\"style()['color']\"\n [attr.stroke-dasharray]=\"percent() + ', 100'\"\n d=\"M18 2.0845\n a 15.9155 15.9155 0 0 1 0 31.831\n a 15.9155 15.9155 0 0 1 0 -31.831\"\n />\n <text x=\"18.5\" y=\"20.82\" class=\"percentage\" [style.fill]=\"textStyle()\">{{ percent() }}%</text>\n</svg>\n", changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
4994
5093
|
}
|
|
4995
5094
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniProgressGaugeComponent, decorators: [{
|
|
4996
5095
|
type: Component,
|
|
4997
|
-
args: [{ selector: 'uni-progress-gauge
|
|
5096
|
+
args: [{ selector: 'uni-progress-gauge', imports: [], providers: [{ provide: COMPONENT_NAME, useValue: 'progressGauge' }], host: {
|
|
4998
5097
|
'[class]': 'className()',
|
|
4999
5098
|
role: 'progressbar',
|
|
5000
5099
|
'aria-valuemin': '0',
|
|
@@ -5063,10 +5162,12 @@ class UniRadioComponent extends BaseComponent {
|
|
|
5063
5162
|
width: outerCircleSize,
|
|
5064
5163
|
height: outerCircleSize,
|
|
5065
5164
|
borderRadius: '50%',
|
|
5066
|
-
border: `2px solid ${this.disabled()
|
|
5165
|
+
border: `2px solid ${this.disabled()
|
|
5166
|
+
? this.getThemeColor('on-disabled')
|
|
5167
|
+
: this.getThemeColor(this.componentOptions().ringColor ?? 'outline')}`,
|
|
5067
5168
|
position: 'relative',
|
|
5068
5169
|
transition: 'all 0.3s ease',
|
|
5069
|
-
backgroundColor: '
|
|
5170
|
+
backgroundColor: this.getThemeColor(this.componentOptions().fillColor ?? 'surface'),
|
|
5070
5171
|
flexShrink: 0,
|
|
5071
5172
|
},
|
|
5072
5173
|
'& .radio-inner': {
|
|
@@ -5089,7 +5190,7 @@ class UniRadioComponent extends BaseComponent {
|
|
|
5089
5190
|
cursor: 'not-allowed',
|
|
5090
5191
|
opacity: 0.6,
|
|
5091
5192
|
'& .radio-button': {
|
|
5092
|
-
borderColor: '
|
|
5193
|
+
borderColor: this.getThemeColor('on-disabled'),
|
|
5093
5194
|
},
|
|
5094
5195
|
},
|
|
5095
5196
|
});
|
|
@@ -5120,11 +5221,11 @@ class UniRadioComponent extends BaseComponent {
|
|
|
5120
5221
|
return colors[token] ? colors[token] : colors['primary'];
|
|
5121
5222
|
}
|
|
5122
5223
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniRadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
5123
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniRadioComponent, isStandalone: true, selector: "uni-radio
|
|
5224
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniRadioComponent, isStandalone: true, selector: "uni-radio", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, dirty: { classPropertyName: "dirty", publicName: "dirty", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, name: { classPropertyName: "name", publicName: "name", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, providers: [{ provide: COMPONENT_NAME, useValue: 'radio' }], usesInheritance: true, ngImport: i0, template: "<div\n [class]=\"radioGroupClass\"\n role=\"radiogroup\"\n [attr.aria-labelledby]=\"label() ? groupLabelId : null\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n>\n @if (label()) {\n <span uni-text=\"label\" [attr.id]=\"groupLabelId\">{{ label() }}</span>\n }\n\n @for (option of options(); track option.value) {\n <label [class]=\"radioOptionClass()\" [class.disabled]=\"disabled() || option.disabled\">\n <input\n type=\"radio\"\n [class]=\"radioInputClass()\"\n [value]=\"option.value\"\n [name]=\"name()\"\n [checked]=\"value() === option.value\"\n [disabled]=\"disabled() || option.disabled\"\n (change)=\"handleRadioChange(option.value)\"\n />\n <div class=\"radio-button\">\n <div class=\"radio-inner\"></div>\n </div>\n <span uni-text=\"label\">{{ option.label }}</span>\n </label>\n }\n</div>\n", dependencies: [{ kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5124
5225
|
}
|
|
5125
5226
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniRadioComponent, decorators: [{
|
|
5126
5227
|
type: Component,
|
|
5127
|
-
args: [{ selector: 'uni-radio
|
|
5228
|
+
args: [{ selector: 'uni-radio', imports: [UniTextComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'radio' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n [class]=\"radioGroupClass\"\n role=\"radiogroup\"\n [attr.aria-labelledby]=\"label() ? groupLabelId : null\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n>\n @if (label()) {\n <span uni-text=\"label\" [attr.id]=\"groupLabelId\">{{ label() }}</span>\n }\n\n @for (option of options(); track option.value) {\n <label [class]=\"radioOptionClass()\" [class.disabled]=\"disabled() || option.disabled\">\n <input\n type=\"radio\"\n [class]=\"radioInputClass()\"\n [value]=\"option.value\"\n [name]=\"name()\"\n [checked]=\"value() === option.value\"\n [disabled]=\"disabled() || option.disabled\"\n (change)=\"handleRadioChange(option.value)\"\n />\n <div class=\"radio-button\">\n <div class=\"radio-inner\"></div>\n </div>\n <span uni-text=\"label\">{{ option.label }}</span>\n </label>\n }\n</div>\n" }]
|
|
5128
5229
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], dirty: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirty", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], ariaDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedBy", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], name: [{ type: i0.Input, args: [{ isSignal: true, alias: "name", required: false }] }] } });
|
|
5129
5230
|
|
|
5130
5231
|
/**
|
|
@@ -5133,35 +5234,143 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
5133
5234
|
* This file exports all public-facing elements of the scroll-area component.
|
|
5134
5235
|
*/
|
|
5135
5236
|
|
|
5136
|
-
|
|
5237
|
+
/**
|
|
5238
|
+
* Generic search field: shared input chrome with a leading magnifier, a clear
|
|
5239
|
+
* button while there's a query, Enter to submit, and optional type-ahead —
|
|
5240
|
+
* pass `suggestions` (refresh them from `change`) and the field becomes an
|
|
5241
|
+
* ARIA combobox with a keyboard-navigable listbox. Escape closes the list
|
|
5242
|
+
* first, then clears the query.
|
|
5243
|
+
*/
|
|
5244
|
+
class UniSearchInputComponent extends BaseComponent {
|
|
5245
|
+
/** Accessible name for the field, also the placeholder fallback. */
|
|
5137
5246
|
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
5247
|
+
placeholder = input(...(ngDevMode ? [undefined, { debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
5138
5248
|
width = input('100%', ...(ngDevMode ? [{ debugName: "width" }] : /* istanbul ignore next */ []));
|
|
5249
|
+
debounceTime = input(400, ...(ngDevMode ? [{ debugName: "debounceTime" }] : /* istanbul ignore next */ []));
|
|
5250
|
+
/**
|
|
5251
|
+
* Type-ahead entries. Keep them fresh from `change` emissions; the list
|
|
5252
|
+
* shows while the field has focus and entries exist.
|
|
5253
|
+
*/
|
|
5254
|
+
suggestions = input([], ...(ngDevMode ? [{ debugName: "suggestions" }] : /* istanbul ignore next */ []));
|
|
5139
5255
|
// TODO(v4): rename to searchChange/searchSubmit — renaming is breaking
|
|
5140
5256
|
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
5141
5257
|
change = output();
|
|
5142
5258
|
// eslint-disable-next-line @angular-eslint/no-output-native
|
|
5143
5259
|
search = output();
|
|
5144
|
-
|
|
5145
|
-
|
|
5146
|
-
|
|
5147
|
-
|
|
5148
|
-
|
|
5149
|
-
|
|
5150
|
-
|
|
5151
|
-
}, ...(ngDevMode ? [{ debugName: "
|
|
5152
|
-
|
|
5153
|
-
|
|
5260
|
+
suggestionSelected = output();
|
|
5261
|
+
field = viewChild.required(UniDebounceInputComponent);
|
|
5262
|
+
listboxId = uniqueId('uni-search-listbox');
|
|
5263
|
+
listOpen = signal(false, ...(ngDevMode ? [{ debugName: "listOpen" }] : /* istanbul ignore next */ []));
|
|
5264
|
+
activeIndex = signal(-1, ...(ngDevMode ? [{ debugName: "activeIndex" }] : /* istanbul ignore next */ []));
|
|
5265
|
+
visibleSuggestions = computed(() => this.suggestions().slice(0, this.componentOptions().maxSuggestions ?? 8), ...(ngDevMode ? [{ debugName: "visibleSuggestions" }] : /* istanbul ignore next */ []));
|
|
5266
|
+
showList = computed(() => this.listOpen() && this.visibleSuggestions().length > 0, ...(ngDevMode ? [{ debugName: "showList" }] : /* istanbul ignore next */ []));
|
|
5267
|
+
activeOptionId = computed(() => this.activeIndex() >= 0 ? `${this.listboxId}-${this.activeIndex()}` : undefined, ...(ngDevMode ? [{ debugName: "activeOptionId" }] : /* istanbul ignore next */ []));
|
|
5268
|
+
hasQuery = computed(() => !!this.field()?.value(), ...(ngDevMode ? [{ debugName: "hasQuery" }] : /* istanbul ignore next */ []));
|
|
5269
|
+
handleChange(value) {
|
|
5270
|
+
this.listOpen.set(true);
|
|
5271
|
+
this.activeIndex.set(-1);
|
|
5272
|
+
this.change.emit(value);
|
|
5273
|
+
}
|
|
5274
|
+
submit() {
|
|
5275
|
+
const active = this.activeIndex();
|
|
5276
|
+
if (this.showList() && active >= 0) {
|
|
5277
|
+
this.select(this.visibleSuggestions()[active]);
|
|
5278
|
+
return;
|
|
5279
|
+
}
|
|
5280
|
+
this.listOpen.set(false);
|
|
5281
|
+
this.search.emit(this.field().value() ?? '');
|
|
5282
|
+
}
|
|
5283
|
+
select(suggestion) {
|
|
5284
|
+
this.field().value.set(suggestion);
|
|
5285
|
+
this.listOpen.set(false);
|
|
5286
|
+
this.activeIndex.set(-1);
|
|
5287
|
+
this.suggestionSelected.emit(suggestion);
|
|
5288
|
+
this.search.emit(suggestion);
|
|
5154
5289
|
}
|
|
5155
|
-
|
|
5156
|
-
this.
|
|
5290
|
+
clear() {
|
|
5291
|
+
this.field().clear();
|
|
5292
|
+
this.listOpen.set(false);
|
|
5293
|
+
this.activeIndex.set(-1);
|
|
5294
|
+
this.field().focus();
|
|
5157
5295
|
}
|
|
5158
|
-
|
|
5159
|
-
|
|
5296
|
+
onKeydown(event) {
|
|
5297
|
+
switch (event.key) {
|
|
5298
|
+
case 'Enter':
|
|
5299
|
+
event.preventDefault();
|
|
5300
|
+
this.submit();
|
|
5301
|
+
break;
|
|
5302
|
+
case 'ArrowDown':
|
|
5303
|
+
case 'ArrowUp': {
|
|
5304
|
+
const count = this.visibleSuggestions().length;
|
|
5305
|
+
if (count === 0)
|
|
5306
|
+
return;
|
|
5307
|
+
event.preventDefault();
|
|
5308
|
+
this.listOpen.set(true);
|
|
5309
|
+
const delta = event.key === 'ArrowDown' ? 1 : -1;
|
|
5310
|
+
this.activeIndex.set((this.activeIndex() + delta + count) % count);
|
|
5311
|
+
break;
|
|
5312
|
+
}
|
|
5313
|
+
case 'Escape':
|
|
5314
|
+
if (this.showList())
|
|
5315
|
+
this.listOpen.set(false);
|
|
5316
|
+
else if (this.hasQuery())
|
|
5317
|
+
this.clear();
|
|
5318
|
+
break;
|
|
5319
|
+
}
|
|
5320
|
+
}
|
|
5321
|
+
onFocusOut(event) {
|
|
5322
|
+
// Close unless focus moved somewhere inside the component.
|
|
5323
|
+
const next = event.relatedTarget;
|
|
5324
|
+
if (!next || !event.currentTarget.contains(next)) {
|
|
5325
|
+
this.listOpen.set(false);
|
|
5326
|
+
}
|
|
5327
|
+
}
|
|
5328
|
+
className = computed(() => css({
|
|
5329
|
+
display: 'block',
|
|
5330
|
+
position: 'relative',
|
|
5331
|
+
width: this.width(),
|
|
5332
|
+
'& .uni-search-lead': {
|
|
5333
|
+
fontSize: 20,
|
|
5334
|
+
...this.theme.color('on-background-variant'),
|
|
5335
|
+
...this.theme.paddingLeft('sm'),
|
|
5336
|
+
},
|
|
5337
|
+
}), ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
5338
|
+
listClass = computed(() => {
|
|
5339
|
+
const options = this.componentOptions();
|
|
5340
|
+
return css({
|
|
5341
|
+
position: 'absolute',
|
|
5342
|
+
top: '100%',
|
|
5343
|
+
left: 0,
|
|
5344
|
+
right: 0,
|
|
5345
|
+
zIndex: 20,
|
|
5346
|
+
margin: '4px 0 0',
|
|
5347
|
+
padding: 4,
|
|
5348
|
+
listStyle: 'none',
|
|
5349
|
+
maxHeight: 280,
|
|
5350
|
+
overflowY: 'auto',
|
|
5351
|
+
...this.theme.backgroundColor(options.listColor ?? 'primary-surface'),
|
|
5352
|
+
...this.theme.boxShadow(options.listShadow ?? 'menu'),
|
|
5353
|
+
...this.theme.radius(options.listBorderRadius ?? 'xs'),
|
|
5354
|
+
'& [role="option"]': {
|
|
5355
|
+
padding: '8px 12px',
|
|
5356
|
+
cursor: 'pointer',
|
|
5357
|
+
...this.theme.typeface('label'),
|
|
5358
|
+
...this.theme.color('on-primary-surface'),
|
|
5359
|
+
...this.theme.radius('xxs'),
|
|
5360
|
+
'&.active, &:hover': {
|
|
5361
|
+
...this.theme.backgroundColor('primary-container'),
|
|
5362
|
+
...this.theme.color('on-primary-container'),
|
|
5363
|
+
},
|
|
5364
|
+
},
|
|
5365
|
+
});
|
|
5366
|
+
}, ...(ngDevMode ? [{ debugName: "listClass" }] : /* istanbul ignore next */ []));
|
|
5367
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSearchInputComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
5368
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniSearchInputComponent, isStandalone: true, selector: "uni-search-input", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, debounceTime: { classPropertyName: "debounceTime", publicName: "debounceTime", isSignal: true, isRequired: false, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { change: "change", search: "search", suggestionSelected: "suggestionSelected" }, host: { properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'searchInput' }], viewQueries: [{ propertyName: "field", first: true, predicate: UniDebounceInputComponent, descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: "<!-- Keydown/focusout ride the bubbling events from the inner input; the\n wrapper itself stays out of the tab order. -->\n<!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->\n<div (keydown)=\"onKeydown($event)\" (focusout)=\"onFocusOut($event)\">\n <uni-debounce-input\n #searchField\n [label]=\"label()\"\n [placeholder]=\"placeholder() ?? label()\"\n [debounceTime]=\"debounceTime()\"\n role=\"combobox\"\n [ariaExpanded]=\"showList()\"\n [ariaControls]=\"listboxId\"\n [ariaActivedescendant]=\"activeOptionId()\"\n (change)=\"handleChange($event)\"\n >\n <uni-symbol pre-input class=\"uni-search-lead\" name=\"{{ componentOptions().searchSymbol ?? 'search' }}\" aria-hidden=\"true\" />\n @if (hasQuery()) {\n <button\n post-input\n icon-button\n [iconName]=\"componentOptions().clearSymbol ?? 'close'\"\n variant=\"ghost\"\n size=\"sm\"\n (click)=\"clear()\"\n >\n Clear search\n </button>\n }\n </uni-debounce-input>\n\n @if (showList()) {\n <ul [id]=\"listboxId\" role=\"listbox\" [attr.aria-label]=\"label()\" [class]=\"listClass()\">\n @for (suggestion of visibleSuggestions(); track suggestion; let i = $index) {\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n <li\n role=\"option\"\n [id]=\"listboxId + '-' + i\"\n [class.active]=\"i === activeIndex()\"\n [attr.aria-selected]=\"i === activeIndex()\"\n (mousedown)=\"$event.preventDefault()\"\n (click)=\"select(suggestion)\"\n >\n {{ suggestion }}\n </li>\n }\n </ul>\n }\n</div>\n", dependencies: [{ kind: "component", type: UniDebounceInputComponent, selector: "uni-debounce-input", inputs: ["inputName", "inputId", "debounceTime", "label", "placeholder", "disabled", "role", "ariaExpanded", "ariaControls", "ariaActivedescendant"], outputs: ["change"] }, { kind: "component", type: UniIconButtonComponent, selector: "button[uni-icon-button], button[icon-button]", inputs: ["ariaLabel", "iconName", "symbolName", "variant", "size", "disable", "loading", "opticalSize"] }, { kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5160
5369
|
}
|
|
5161
5370
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSearchInputComponent, decorators: [{
|
|
5162
5371
|
type: Component,
|
|
5163
|
-
args: [{ selector: '
|
|
5164
|
-
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], change: [{ type: i0.Output, args: ["change"] }], search: [{ type: i0.Output, args: ["search"] }] } });
|
|
5372
|
+
args: [{ selector: 'uni-search-input', imports: [UniDebounceInputComponent, UniIconButtonComponent, UniSymbolComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'searchInput' }], host: { '[class]': 'className()' }, changeDetection: ChangeDetectionStrategy.OnPush, template: "<!-- Keydown/focusout ride the bubbling events from the inner input; the\n wrapper itself stays out of the tab order. -->\n<!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->\n<div (keydown)=\"onKeydown($event)\" (focusout)=\"onFocusOut($event)\">\n <uni-debounce-input\n #searchField\n [label]=\"label()\"\n [placeholder]=\"placeholder() ?? label()\"\n [debounceTime]=\"debounceTime()\"\n role=\"combobox\"\n [ariaExpanded]=\"showList()\"\n [ariaControls]=\"listboxId\"\n [ariaActivedescendant]=\"activeOptionId()\"\n (change)=\"handleChange($event)\"\n >\n <uni-symbol pre-input class=\"uni-search-lead\" name=\"{{ componentOptions().searchSymbol ?? 'search' }}\" aria-hidden=\"true\" />\n @if (hasQuery()) {\n <button\n post-input\n icon-button\n [iconName]=\"componentOptions().clearSymbol ?? 'close'\"\n variant=\"ghost\"\n size=\"sm\"\n (click)=\"clear()\"\n >\n Clear search\n </button>\n }\n </uni-debounce-input>\n\n @if (showList()) {\n <ul [id]=\"listboxId\" role=\"listbox\" [attr.aria-label]=\"label()\" [class]=\"listClass()\">\n @for (suggestion of visibleSuggestions(); track suggestion; let i = $index) {\n <!-- eslint-disable-next-line @angular-eslint/template/click-events-have-key-events, @angular-eslint/template/interactive-supports-focus -->\n <li\n role=\"option\"\n [id]=\"listboxId + '-' + i\"\n [class.active]=\"i === activeIndex()\"\n [attr.aria-selected]=\"i === activeIndex()\"\n (mousedown)=\"$event.preventDefault()\"\n (click)=\"select(suggestion)\"\n >\n {{ suggestion }}\n </li>\n }\n </ul>\n }\n</div>\n" }]
|
|
5373
|
+
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }], debounceTime: [{ type: i0.Input, args: [{ isSignal: true, alias: "debounceTime", required: false }] }], suggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggestions", required: false }] }], change: [{ type: i0.Output, args: ["change"] }], search: [{ type: i0.Output, args: ["search"] }], suggestionSelected: [{ type: i0.Output, args: ["suggestionSelected"] }], field: [{ type: i0.ViewChild, args: [i0.forwardRef(() => UniDebounceInputComponent), { isSignal: true }] }] } });
|
|
5165
5374
|
|
|
5166
5375
|
/**
|
|
5167
5376
|
* UniSearchInputComponent Barrel File
|
|
@@ -5230,11 +5439,11 @@ class UniSelectComponent {
|
|
|
5230
5439
|
pointerEvents: 'none' /* Crucial for clicking through */,
|
|
5231
5440
|
});
|
|
5232
5441
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSelectComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5233
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniSelectComponent, isStandalone: true, selector: "uni-select
|
|
5442
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniSelectComponent, isStandalone: true, selector: "uni-select", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, dirty: { classPropertyName: "dirty", publicName: "dirty", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: true, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, ngImport: i0, template: "<uni-input-box [error]=\"showError()\" [class]=\"selectClass\">\n <select\n [disabled]=\"disabled()\"\n [value]=\"currentSelectedIndex()\"\n (change)=\"handleSelectChange($event)\"\n (blur)=\"touched.set(true)\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n >\n @if (placeholder()) {\n <option [value]=\"UNSELECTED\" disabled selected>\n {{ placeholder() }}\n </option>\n }\n\n @for (opt of options(); track opt.label; let i = $index) {\n <option [value]=\"i\">\n {{ opt.label }}\n </option>\n }\n </select>\n <uni-symbol name=\"keyboard_arrow_down\" [class]=\"arrowClass\" />\n</uni-input-box>\n", dependencies: [{ kind: "component", type: UniInputBoxComponent, selector: "uni-input-box", inputs: ["disabled", "error", "minWidth", "height"] }, { kind: "component", type: UniSymbolComponent, selector: "uni-symbol", inputs: ["name", "fill", "weight", "grade", "opticalSize"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5234
5443
|
}
|
|
5235
5444
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSelectComponent, decorators: [{
|
|
5236
5445
|
type: Component,
|
|
5237
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-select
|
|
5446
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-select', imports: [UniInputBoxComponent, UniSymbolComponent], template: "<uni-input-box [error]=\"showError()\" [class]=\"selectClass\">\n <select\n [disabled]=\"disabled()\"\n [value]=\"currentSelectedIndex()\"\n (change)=\"handleSelectChange($event)\"\n (blur)=\"touched.set(true)\"\n [attr.aria-label]=\"ariaLabel()\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n >\n @if (placeholder()) {\n <option [value]=\"UNSELECTED\" disabled selected>\n {{ placeholder() }}\n </option>\n }\n\n @for (opt of options(); track opt.label; let i = $index) {\n <option [value]=\"i\">\n {{ opt.label }}\n </option>\n }\n </select>\n <uni-symbol name=\"keyboard_arrow_down\" [class]=\"arrowClass\" />\n</uni-input-box>\n" }]
|
|
5238
5447
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], dirty: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirty", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], ariaDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedBy", required: false }] }], options: [{ type: i0.Input, args: [{ isSignal: true, alias: "options", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], ariaLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaLabel", required: false }] }] } });
|
|
5239
5448
|
|
|
5240
5449
|
/**
|
|
@@ -5297,7 +5506,7 @@ class UniSkeletonComponent extends BaseComponent {
|
|
|
5297
5506
|
});
|
|
5298
5507
|
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
5299
5508
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSkeletonComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
5300
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniSkeletonComponent, isStandalone: true, selector: "uni-skeleton
|
|
5509
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniSkeletonComponent, isStandalone: true, selector: "uni-skeleton", inputs: { shape: { classPropertyName: "shape", publicName: "shape", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, lines: { classPropertyName: "lines", publicName: "lines", isSignal: true, isRequired: false, transformFunction: null } }, host: { attributes: { "aria-hidden": "true" }, properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'skeleton' }], usesInheritance: true, ngImport: i0, template: `
|
|
5301
5510
|
@for (line of lineWidths(); track $index) {
|
|
5302
5511
|
<div class="uni-skeleton-block" [style.width]="line"></div>
|
|
5303
5512
|
}
|
|
@@ -5307,7 +5516,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
5307
5516
|
type: Component,
|
|
5308
5517
|
args: [{
|
|
5309
5518
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
5310
|
-
selector: 'uni-skeleton
|
|
5519
|
+
selector: 'uni-skeleton',
|
|
5311
5520
|
providers: [{ provide: COMPONENT_NAME, useValue: 'skeleton' }],
|
|
5312
5521
|
host: { '[class]': 'className()', 'aria-hidden': 'true' },
|
|
5313
5522
|
template: `
|
|
@@ -5409,7 +5618,7 @@ class UniSliderComponent extends BaseComponent {
|
|
|
5409
5618
|
});
|
|
5410
5619
|
}, ...(ngDevMode ? [{ debugName: "inputClass" }] : /* istanbul ignore next */ []));
|
|
5411
5620
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniSliderComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
5412
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniSliderComponent, isStandalone: true, selector: "uni-slider
|
|
5621
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniSliderComponent, isStandalone: true, selector: "uni-slider", inputs: { value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, dirty: { classPropertyName: "dirty", publicName: "dirty", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, min: { classPropertyName: "min", publicName: "min", isSignal: true, isRequired: false, transformFunction: null }, max: { classPropertyName: "max", publicName: "max", isSignal: true, isRequired: false, transformFunction: null }, step: { classPropertyName: "step", publicName: "step", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { value: "valueChange", touched: "touchedChange" }, providers: [{ provide: COMPONENT_NAME, useValue: 'slider' }], usesInheritance: true, ngImport: i0, template: `
|
|
5413
5622
|
<input
|
|
5414
5623
|
type="range"
|
|
5415
5624
|
[class]="inputClass()"
|
|
@@ -5430,7 +5639,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
5430
5639
|
type: Component,
|
|
5431
5640
|
args: [{
|
|
5432
5641
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
5433
|
-
selector: 'uni-slider
|
|
5642
|
+
selector: 'uni-slider',
|
|
5434
5643
|
providers: [{ provide: COMPONENT_NAME, useValue: 'slider' }],
|
|
5435
5644
|
template: `
|
|
5436
5645
|
<input
|
|
@@ -5451,6 +5660,186 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
5451
5660
|
}]
|
|
5452
5661
|
}], propDecorators: { value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], dirty: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirty", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], ariaDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedBy", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], min: [{ type: i0.Input, args: [{ isSignal: true, alias: "min", required: false }] }], max: [{ type: i0.Input, args: [{ isSignal: true, alias: "max", required: false }] }], step: [{ type: i0.Input, args: [{ isSignal: true, alias: "step", required: false }] }] } });
|
|
5453
5662
|
|
|
5663
|
+
const SPARK_WIDTH = 96;
|
|
5664
|
+
const SPARK_HEIGHT = 28;
|
|
5665
|
+
/**
|
|
5666
|
+
* KPI stat tile: muted label, large value (numbers auto-compact: 48234 →
|
|
5667
|
+
* "48.2K"), an optional delta whose ink is decided by *direction × whether up
|
|
5668
|
+
* is good* (never direction alone — churn going down is good news), and an
|
|
5669
|
+
* optional decorative sparkline. Frame, typography and inks are all `stat`
|
|
5670
|
+
* theme tokens.
|
|
5671
|
+
*/
|
|
5672
|
+
class UniStatComponent extends BaseComponent {
|
|
5673
|
+
/** What is being measured, sentence case. */
|
|
5674
|
+
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : /* istanbul ignore next */ []));
|
|
5675
|
+
/** The headline number: strings render verbatim, numbers auto-compact. */
|
|
5676
|
+
value = input.required(...(ngDevMode ? [{ debugName: "value" }] : /* istanbul ignore next */ []));
|
|
5677
|
+
/** Signed change, e.g. "+12.4%" or "-0.4%". The sign drives the arrow. */
|
|
5678
|
+
delta = input(...(ngDevMode ? [undefined, { debugName: "delta" }] : /* istanbul ignore next */ []));
|
|
5679
|
+
/** Whether an upward movement is good news. Flip for churn, errors, cost. */
|
|
5680
|
+
upIsGood = input(true, ...(ngDevMode ? [{ debugName: "upIsGood" }] : /* istanbul ignore next */ []));
|
|
5681
|
+
/** Names the comparison period, e.g. "vs last month". */
|
|
5682
|
+
caption = input(...(ngDevMode ? [undefined, { debugName: "caption" }] : /* istanbul ignore next */ []));
|
|
5683
|
+
/** Recent values for the decorative sparkline (12 points reads best). */
|
|
5684
|
+
trend = input(undefined, ...(ngDevMode ? [{ debugName: "trend" }] : /* istanbul ignore next */ []));
|
|
5685
|
+
srOnly = css(visuallyHidden);
|
|
5686
|
+
displayValue = computed(() => {
|
|
5687
|
+
const value = this.value();
|
|
5688
|
+
if (typeof value !== 'number')
|
|
5689
|
+
return value;
|
|
5690
|
+
return new Intl.NumberFormat(undefined, {
|
|
5691
|
+
notation: 'compact',
|
|
5692
|
+
maximumFractionDigits: 1,
|
|
5693
|
+
}).format(value);
|
|
5694
|
+
}, ...(ngDevMode ? [{ debugName: "displayValue" }] : /* istanbul ignore next */ []));
|
|
5695
|
+
deltaIsUp = computed(() => !this.delta()?.trim().startsWith('-'), ...(ngDevMode ? [{ debugName: "deltaIsUp" }] : /* istanbul ignore next */ []));
|
|
5696
|
+
deltaIsGood = computed(() => this.deltaIsUp() === this.upIsGood(), ...(ngDevMode ? [{ debugName: "deltaIsGood" }] : /* istanbul ignore next */ []));
|
|
5697
|
+
deltaMagnitude = computed(() => this.delta()?.trim().replace(/^[-+]/, '') ?? '', ...(ngDevMode ? [{ debugName: "deltaMagnitude" }] : /* istanbul ignore next */ []));
|
|
5698
|
+
sparkline = computed(() => {
|
|
5699
|
+
const points = this.trend();
|
|
5700
|
+
if (!points || points.length < 2)
|
|
5701
|
+
return undefined;
|
|
5702
|
+
const min = Math.min(...points);
|
|
5703
|
+
const range = Math.max(...points) - min || 1;
|
|
5704
|
+
const step = SPARK_WIDTH / (points.length - 1);
|
|
5705
|
+
const xy = points.map((p, i) => [
|
|
5706
|
+
i * step,
|
|
5707
|
+
SPARK_HEIGHT - 3 - ((p - min) / range) * (SPARK_HEIGHT - 6),
|
|
5708
|
+
]);
|
|
5709
|
+
const [endX, endY] = xy[xy.length - 1];
|
|
5710
|
+
return {
|
|
5711
|
+
width: SPARK_WIDTH,
|
|
5712
|
+
height: SPARK_HEIGHT,
|
|
5713
|
+
path: xy.map(([x, y], i) => `${i ? 'L' : 'M'}${x.toFixed(1)},${y.toFixed(1)}`).join(' '),
|
|
5714
|
+
endX: endX.toFixed(1),
|
|
5715
|
+
endY: endY.toFixed(1),
|
|
5716
|
+
};
|
|
5717
|
+
}, ...(ngDevMode ? [{ debugName: "sparkline" }] : /* istanbul ignore next */ []));
|
|
5718
|
+
className = computed(() => {
|
|
5719
|
+
const options = this.componentOptions();
|
|
5720
|
+
return css({
|
|
5721
|
+
position: 'relative',
|
|
5722
|
+
display: 'flex',
|
|
5723
|
+
flexDirection: 'column',
|
|
5724
|
+
boxSizing: 'border-box',
|
|
5725
|
+
...this.theme.gap(options.gap),
|
|
5726
|
+
...this.theme.colorPair(options.color),
|
|
5727
|
+
...this.theme.border(options.border),
|
|
5728
|
+
...this.theme.radius(options.borderRadius),
|
|
5729
|
+
...this.theme.padding(options.padding),
|
|
5730
|
+
'& .uni-stat-label': {
|
|
5731
|
+
...this.theme.typeface(options.labelTypeface),
|
|
5732
|
+
...this.theme.color('on-background-variant'),
|
|
5733
|
+
},
|
|
5734
|
+
'& .uni-stat-value': {
|
|
5735
|
+
...this.theme.typeface(options.valueTypeface),
|
|
5736
|
+
...this.theme.color('on-background'),
|
|
5737
|
+
},
|
|
5738
|
+
'& .uni-stat-meta': {
|
|
5739
|
+
display: 'flex',
|
|
5740
|
+
alignItems: 'baseline',
|
|
5741
|
+
flexWrap: 'wrap',
|
|
5742
|
+
columnGap: 8,
|
|
5743
|
+
},
|
|
5744
|
+
'& .uni-stat-delta': {
|
|
5745
|
+
fontSize: 13,
|
|
5746
|
+
fontWeight: 600,
|
|
5747
|
+
...this.theme.color(options.negativeColor),
|
|
5748
|
+
'&.good': this.theme.color(options.positiveColor),
|
|
5749
|
+
},
|
|
5750
|
+
'& .uni-stat-caption': {
|
|
5751
|
+
fontSize: 11.5,
|
|
5752
|
+
...this.theme.color('on-background-variant'),
|
|
5753
|
+
},
|
|
5754
|
+
'& .uni-stat-trend': {
|
|
5755
|
+
position: 'absolute',
|
|
5756
|
+
right: 16,
|
|
5757
|
+
bottom: 14,
|
|
5758
|
+
'& path': { stroke: this.theme.colors()[options.trendColor ?? 'outline'] },
|
|
5759
|
+
'& circle': { fill: this.theme.colors()[options.trendAccent ?? 'primary'] },
|
|
5760
|
+
},
|
|
5761
|
+
});
|
|
5762
|
+
}, ...(ngDevMode ? [{ debugName: "className" }] : /* istanbul ignore next */ []));
|
|
5763
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniStatComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
5764
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniStatComponent, isStandalone: true, selector: "uni-stat", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: true, transformFunction: null }, delta: { classPropertyName: "delta", publicName: "delta", isSignal: true, isRequired: false, transformFunction: null }, upIsGood: { classPropertyName: "upIsGood", publicName: "upIsGood", isSignal: true, isRequired: false, transformFunction: null }, caption: { classPropertyName: "caption", publicName: "caption", isSignal: true, isRequired: false, transformFunction: null }, trend: { classPropertyName: "trend", publicName: "trend", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "class": "className()" } }, providers: [{ provide: COMPONENT_NAME, useValue: 'stat' }], usesInheritance: true, ngImport: i0, template: `
|
|
5765
|
+
<span class="uni-stat-label">{{ label() }}</span>
|
|
5766
|
+
<span class="uni-stat-value">{{ displayValue() }}</span>
|
|
5767
|
+
@if (delta()) {
|
|
5768
|
+
<span class="uni-stat-meta">
|
|
5769
|
+
<span class="uni-stat-delta" [class.good]="deltaIsGood()">
|
|
5770
|
+
<span aria-hidden="true">{{ deltaIsUp() ? '▴' : '▾' }}</span>
|
|
5771
|
+
<span [class]="srOnly">{{ deltaIsUp() ? 'up' : 'down' }}</span>
|
|
5772
|
+
{{ deltaMagnitude() }}
|
|
5773
|
+
</span>
|
|
5774
|
+
@if (caption()) {
|
|
5775
|
+
<span class="uni-stat-caption">{{ caption() }}</span>
|
|
5776
|
+
}
|
|
5777
|
+
</span>
|
|
5778
|
+
}
|
|
5779
|
+
@if (sparkline(); as spark) {
|
|
5780
|
+
<svg
|
|
5781
|
+
class="uni-stat-trend"
|
|
5782
|
+
aria-hidden="true"
|
|
5783
|
+
[attr.width]="spark.width"
|
|
5784
|
+
[attr.height]="spark.height"
|
|
5785
|
+
[attr.viewBox]="'0 0 ' + spark.width + ' ' + spark.height"
|
|
5786
|
+
>
|
|
5787
|
+
<path
|
|
5788
|
+
[attr.d]="spark.path"
|
|
5789
|
+
fill="none"
|
|
5790
|
+
stroke-width="2"
|
|
5791
|
+
stroke-linecap="round"
|
|
5792
|
+
stroke-linejoin="round"
|
|
5793
|
+
/>
|
|
5794
|
+
<circle [attr.cx]="spark.endX" [attr.cy]="spark.endY" r="3.5" />
|
|
5795
|
+
</svg>
|
|
5796
|
+
}
|
|
5797
|
+
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5798
|
+
}
|
|
5799
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniStatComponent, decorators: [{
|
|
5800
|
+
type: Component,
|
|
5801
|
+
args: [{
|
|
5802
|
+
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
5803
|
+
selector: 'uni-stat',
|
|
5804
|
+
providers: [{ provide: COMPONENT_NAME, useValue: 'stat' }],
|
|
5805
|
+
host: { '[class]': 'className()' },
|
|
5806
|
+
template: `
|
|
5807
|
+
<span class="uni-stat-label">{{ label() }}</span>
|
|
5808
|
+
<span class="uni-stat-value">{{ displayValue() }}</span>
|
|
5809
|
+
@if (delta()) {
|
|
5810
|
+
<span class="uni-stat-meta">
|
|
5811
|
+
<span class="uni-stat-delta" [class.good]="deltaIsGood()">
|
|
5812
|
+
<span aria-hidden="true">{{ deltaIsUp() ? '▴' : '▾' }}</span>
|
|
5813
|
+
<span [class]="srOnly">{{ deltaIsUp() ? 'up' : 'down' }}</span>
|
|
5814
|
+
{{ deltaMagnitude() }}
|
|
5815
|
+
</span>
|
|
5816
|
+
@if (caption()) {
|
|
5817
|
+
<span class="uni-stat-caption">{{ caption() }}</span>
|
|
5818
|
+
}
|
|
5819
|
+
</span>
|
|
5820
|
+
}
|
|
5821
|
+
@if (sparkline(); as spark) {
|
|
5822
|
+
<svg
|
|
5823
|
+
class="uni-stat-trend"
|
|
5824
|
+
aria-hidden="true"
|
|
5825
|
+
[attr.width]="spark.width"
|
|
5826
|
+
[attr.height]="spark.height"
|
|
5827
|
+
[attr.viewBox]="'0 0 ' + spark.width + ' ' + spark.height"
|
|
5828
|
+
>
|
|
5829
|
+
<path
|
|
5830
|
+
[attr.d]="spark.path"
|
|
5831
|
+
fill="none"
|
|
5832
|
+
stroke-width="2"
|
|
5833
|
+
stroke-linecap="round"
|
|
5834
|
+
stroke-linejoin="round"
|
|
5835
|
+
/>
|
|
5836
|
+
<circle [attr.cx]="spark.endX" [attr.cy]="spark.endY" r="3.5" />
|
|
5837
|
+
</svg>
|
|
5838
|
+
}
|
|
5839
|
+
`,
|
|
5840
|
+
}]
|
|
5841
|
+
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: true }] }], delta: [{ type: i0.Input, args: [{ isSignal: true, alias: "delta", required: false }] }], upIsGood: [{ type: i0.Input, args: [{ isSignal: true, alias: "upIsGood", required: false }] }], caption: [{ type: i0.Input, args: [{ isSignal: true, alias: "caption", required: false }] }], trend: [{ type: i0.Input, args: [{ isSignal: true, alias: "trend", required: false }] }] } });
|
|
5842
|
+
|
|
5454
5843
|
/**
|
|
5455
5844
|
* One tab inside `uni-tabs`: a label for the tablist plus projected panel
|
|
5456
5845
|
* content. Content is captured in a template and only instantiated while the
|
|
@@ -5464,13 +5853,13 @@ class UniTabComponent {
|
|
|
5464
5853
|
panelId = `${this.id}-panel`;
|
|
5465
5854
|
content = viewChild.required('content');
|
|
5466
5855
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5467
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniTabComponent, isStandalone: true, selector: "uni-tab
|
|
5856
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.2.0", version: "21.2.12", type: UniTabComponent, isStandalone: true, selector: "uni-tab", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: true, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "content", first: true, predicate: ["content"], descendants: true, isSignal: true }], ngImport: i0, template: `<ng-template #content><ng-content /></ng-template>`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5468
5857
|
}
|
|
5469
5858
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTabComponent, decorators: [{
|
|
5470
5859
|
type: Component,
|
|
5471
5860
|
args: [{
|
|
5472
5861
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
5473
|
-
selector: 'uni-tab
|
|
5862
|
+
selector: 'uni-tab',
|
|
5474
5863
|
template: `<ng-template #content><ng-content /></ng-template>`,
|
|
5475
5864
|
}]
|
|
5476
5865
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: true }] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], content: [{ type: i0.ViewChild, args: ['content', { isSignal: true }] }] } });
|
|
@@ -5582,7 +5971,10 @@ class UniTabsComponent extends BaseComponent {
|
|
|
5582
5971
|
},
|
|
5583
5972
|
}), ...(ngDevMode ? [{ debugName: "panelClass" }] : /* istanbul ignore next */ []));
|
|
5584
5973
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTabsComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
5585
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniTabsComponent, isStandalone: true, selector: "uni-tabs
|
|
5974
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniTabsComponent, isStandalone: true, selector: "uni-tabs", inputs: { selectedIndex: { classPropertyName: "selectedIndex", publicName: "selectedIndex", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectedIndex: "selectedIndexChange" }, providers: [{ provide: COMPONENT_NAME, useValue: 'tabs' }], queries: [{ propertyName: "tabs", predicate: UniTabComponent, isSignal: true }], viewQueries: [{ propertyName: "tabButtons", predicate: ["tabButton"], descendants: true, isSignal: true }], usesInheritance: true, ngImport: i0, template: `
|
|
5975
|
+
<!-- Roving-tabindex composite: focus lives on the tab buttons; keydown
|
|
5976
|
+
bubbles to the tablist, which itself must stay out of the tab order. -->
|
|
5977
|
+
<!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->
|
|
5586
5978
|
<div role="tablist" [class]="tablistClass()" (keydown)="onKeydown($event)">
|
|
5587
5979
|
@for (tab of tabs(); track tab.id; let i = $index) {
|
|
5588
5980
|
<button
|
|
@@ -5619,10 +6011,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImpo
|
|
|
5619
6011
|
type: Component,
|
|
5620
6012
|
args: [{
|
|
5621
6013
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
5622
|
-
selector: 'uni-tabs
|
|
6014
|
+
selector: 'uni-tabs',
|
|
5623
6015
|
imports: [NgTemplateOutlet],
|
|
5624
6016
|
providers: [{ provide: COMPONENT_NAME, useValue: 'tabs' }],
|
|
5625
6017
|
template: `
|
|
6018
|
+
<!-- Roving-tabindex composite: focus lives on the tab buttons; keydown
|
|
6019
|
+
bubbles to the tablist, which itself must stay out of the tab order. -->
|
|
6020
|
+
<!-- eslint-disable-next-line @angular-eslint/template/interactive-supports-focus -->
|
|
5626
6021
|
<div role="tablist" [class]="tablistClass()" (keydown)="onKeydown($event)">
|
|
5627
6022
|
@for (tab of tabs(); track tab.id; let i = $index) {
|
|
5628
6023
|
<button
|
|
@@ -5717,11 +6112,11 @@ class UniTagComponent {
|
|
|
5717
6112
|
this.close.emit(v);
|
|
5718
6113
|
}
|
|
5719
6114
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTagComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5720
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniTagComponent, isStandalone: true, selector: "
|
|
6115
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "21.2.12", type: UniTagComponent, isStandalone: true, selector: "uni-tag", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { close: "close" }, ngImport: i0, template: "<div box-layout color=\"primary\" borderRadius=\"max\" display=\"inline-block\">\n <div row-layout paddingLeft=\"sm\" gap=\"xs\">\n <span uni-text display=\"block\" typeface=\"tag\">{{ label() }}</span>\n <button icon-button symbolName=\"close\" size=\"sm\" (click)=\"handleClose()\">\n Remove {{ label() }}\n </button>\n </div>\n</div>\n", dependencies: [{ kind: "component", type: UniBoxComponent, selector: "[uni-box-layout], [box-layout]", inputs: ["color", "backgroundColor", "borderRadius", "borderRadiusLeft", "borderRadiusRight", "borderRadiusTop", "borderRadiusBottom", "padding", "paddingHorizontal", "paddingVertical", "paddingLeft", "paddingRight", "paddingTop", "paddingBottom", "border", "borderTop", "borderBottom", "borderLeft", "borderRight", "dashBorder", "alignSelf", "alignItems", "alignContent", "justifyContent", "grow", "display", "position", "inset", "height", "minHeight", "maxHeight", "width", "minWidth", "maxWidth", "ignoreDir", "gridArea", "gridColumn", "gridRow", "overflow", "elevation", "shadow", "gap", "fullWidth", "fullHeight", "flexDirection", "textAlign", "wrapItems", "zIndex"] }, { kind: "component", type: UniIconButtonComponent, selector: "button[uni-icon-button], button[icon-button]", inputs: ["ariaLabel", "iconName", "symbolName", "variant", "size", "disable", "loading", "opticalSize"] }, { kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }, { kind: "component", type: UniRowComponent, selector: "[uni-row-layout], [row-layout]", inputs: ["display", "flexDirection", "minWidth"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
5721
6116
|
}
|
|
5722
6117
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniTagComponent, decorators: [{
|
|
5723
6118
|
type: Component,
|
|
5724
|
-
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: '
|
|
6119
|
+
args: [{ changeDetection: ChangeDetectionStrategy.OnPush, selector: 'uni-tag', imports: [UniBoxComponent, UniIconButtonComponent, UniTextComponent, UniRowComponent], template: "<div box-layout color=\"primary\" borderRadius=\"max\" display=\"inline-block\">\n <div row-layout paddingLeft=\"sm\" gap=\"xs\">\n <span uni-text display=\"block\" typeface=\"tag\">{{ label() }}</span>\n <button icon-button symbolName=\"close\" size=\"sm\" (click)=\"handleClose()\">\n Remove {{ label() }}\n </button>\n </div>\n</div>\n" }]
|
|
5725
6120
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }], close: [{ type: i0.Output, args: ["close"] }] } });
|
|
5726
6121
|
|
|
5727
6122
|
/**
|
|
@@ -6419,7 +6814,7 @@ class UniThemeBuilderComponent {
|
|
|
6419
6814
|
|
|
6420
6815
|
<p class="tb-hint">Tip: browse to any component story in the sidebar — it's wearing your brand now.</p>
|
|
6421
6816
|
</section>
|
|
6422
|
-
`, isInline: true, dependencies: [{ kind: "component", type: UniButtonComponent, selector: "button[uni-text-button],
|
|
6817
|
+
`, isInline: true, dependencies: [{ kind: "component", type: UniButtonComponent, selector: "button[uni-text-button], button[text-button]", inputs: ["disable", "loading", "fullWidth", "symbolLeft", "symbolRight"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6423
6818
|
}
|
|
6424
6819
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniThemeBuilderComponent, decorators: [{
|
|
6425
6820
|
type: Component,
|
|
@@ -6678,7 +7073,9 @@ class UniToggleComponent extends BaseComponent {
|
|
|
6678
7073
|
'& .toggle-switch': {
|
|
6679
7074
|
width: toggleWidth,
|
|
6680
7075
|
height: toggleSize,
|
|
6681
|
-
backgroundColor: this.disabled()
|
|
7076
|
+
backgroundColor: this.disabled()
|
|
7077
|
+
? this.getThemeColor('disabled')
|
|
7078
|
+
: this.getThemeColor(this.componentOptions().trackColor ?? 'surface-variant'),
|
|
6682
7079
|
borderRadius: toggleSize / 2,
|
|
6683
7080
|
position: 'relative',
|
|
6684
7081
|
transition: 'all 0.3s ease',
|
|
@@ -6686,18 +7083,19 @@ class UniToggleComponent extends BaseComponent {
|
|
|
6686
7083
|
'& .toggle-slider': {
|
|
6687
7084
|
width: sliderSize,
|
|
6688
7085
|
height: sliderSize,
|
|
6689
|
-
backgroundColor: '
|
|
7086
|
+
backgroundColor: this.getThemeColor(this.componentOptions().knobColor ?? 'surface'),
|
|
6690
7087
|
borderRadius: '50%',
|
|
6691
7088
|
position: 'absolute',
|
|
6692
7089
|
top: sliderOffset,
|
|
6693
7090
|
left: sliderOffset,
|
|
6694
7091
|
transition: 'all 0.3s ease',
|
|
6695
|
-
boxShadow
|
|
7092
|
+
...this.theme.boxShadow('raised'),
|
|
6696
7093
|
},
|
|
7094
|
+
// Hover darkens whatever the token resolves to — the button convention.
|
|
6697
7095
|
'&:hover .toggle-switch': this.disabled()
|
|
6698
7096
|
? {}
|
|
6699
7097
|
: {
|
|
6700
|
-
|
|
7098
|
+
filter: 'brightness(0.95)',
|
|
6701
7099
|
},
|
|
6702
7100
|
});
|
|
6703
7101
|
}, ...(ngDevMode ? [{ debugName: "toggleLabel" }] : /* istanbul ignore next */ []));
|
|
@@ -6730,16 +7128,16 @@ class UniToggleComponent extends BaseComponent {
|
|
|
6730
7128
|
return colors[token] ? colors[token] : colors['primary'];
|
|
6731
7129
|
}
|
|
6732
7130
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniToggleComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
6733
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniToggleComponent, isStandalone: true, selector: "uni-toggle
|
|
7131
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.12", type: UniToggleComponent, isStandalone: true, selector: "uni-toggle", inputs: { checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, touched: { classPropertyName: "touched", publicName: "touched", isSignal: true, isRequired: false, transformFunction: null }, invalid: { classPropertyName: "invalid", publicName: "invalid", isSignal: true, isRequired: false, transformFunction: null }, dirty: { classPropertyName: "dirty", publicName: "dirty", isSignal: true, isRequired: false, transformFunction: null }, required: { classPropertyName: "required", publicName: "required", isSignal: true, isRequired: false, transformFunction: null }, ariaDescribedBy: { classPropertyName: "ariaDescribedBy", publicName: "ariaDescribedBy", isSignal: true, isRequired: false, transformFunction: null }, label: { classPropertyName: "label", publicName: "label", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", touched: "touchedChange" }, providers: [{ provide: COMPONENT_NAME, useValue: 'toggle' }], usesInheritance: true, ngImport: i0, template: "<label [class]=\"toggleLabel()\">\n <input\n type=\"checkbox\"\n role=\"switch\"\n [class]=\"toggleInput()\"\n [checked]=\"checked()\"\n (change)=\"handleChange($event)\"\n [disabled]=\"disabled()\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n />\n <div class=\"toggle-switch\">\n <div class=\"toggle-slider\"></div>\n </div>\n @if (label()) {\n <span uni-text=\"label\">{{ label() }}</span>\n }\n</label>\n", dependencies: [{ kind: "component", type: UniTextComponent, selector: "[uni-text]", inputs: ["uni-text", "typeface", "color", "display", "align", "nowrap", "maxWidth", "ellipsis"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
6734
7132
|
}
|
|
6735
7133
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.12", ngImport: i0, type: UniToggleComponent, decorators: [{
|
|
6736
7134
|
type: Component,
|
|
6737
|
-
args: [{ selector: 'uni-toggle
|
|
7135
|
+
args: [{ selector: 'uni-toggle', imports: [UniTextComponent], providers: [{ provide: COMPONENT_NAME, useValue: 'toggle' }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<label [class]=\"toggleLabel()\">\n <input\n type=\"checkbox\"\n role=\"switch\"\n [class]=\"toggleInput()\"\n [checked]=\"checked()\"\n (change)=\"handleChange($event)\"\n [disabled]=\"disabled()\"\n [attr.aria-invalid]=\"showError() ? true : null\"\n [attr.aria-required]=\"required() ? true : null\"\n [attr.aria-describedby]=\"ariaDescribedBy() || null\"\n />\n <div class=\"toggle-switch\">\n <div class=\"toggle-slider\"></div>\n </div>\n @if (label()) {\n <span uni-text=\"label\">{{ label() }}</span>\n }\n</label>\n" }]
|
|
6738
7136
|
}], propDecorators: { checked: [{ type: i0.Input, args: [{ isSignal: true, alias: "checked", required: false }] }, { type: i0.Output, args: ["checkedChange"] }], disabled: [{ type: i0.Input, args: [{ isSignal: true, alias: "disabled", required: false }] }], touched: [{ type: i0.Input, args: [{ isSignal: true, alias: "touched", required: false }] }, { type: i0.Output, args: ["touchedChange"] }], invalid: [{ type: i0.Input, args: [{ isSignal: true, alias: "invalid", required: false }] }], dirty: [{ type: i0.Input, args: [{ isSignal: true, alias: "dirty", required: false }] }], required: [{ type: i0.Input, args: [{ isSignal: true, alias: "required", required: false }] }], ariaDescribedBy: [{ type: i0.Input, args: [{ isSignal: true, alias: "ariaDescribedBy", required: false }] }], label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }] } });
|
|
6739
7137
|
|
|
6740
7138
|
/**
|
|
6741
7139
|
* Generated bundle index. Do not edit.
|
|
6742
7140
|
*/
|
|
6743
7141
|
|
|
6744
|
-
export { BodyRenderDirective, ConfirmationDialogComponent, DragAndDropDirective, FOCUSABLE_SELECTOR, LocalStorageService, NotificationService, NotificationsComponent, RippleDirective, ThemeService, UNI_THEMES, UniAlertComponent, UniAppBarComponent, UniAvatarComponent, UniAvatarGroupComponent, UniBackgroundComponent, UniBadgeComponent, UniBaseDatasource, UniBoxComponent, UniBreadcrumbComponent, UniButtonComponent, UniButtonGroupComponent, UniCardComponent, UniCardContentComponent, UniCardHeaderComponent, UniCenterComponent, UniCheckboxComponent, UniDataSearchComponent, UniDataTableComponent, UniDebounceInputComponent, UniDialogButtonsComponent, UniDialogComponent, UniDialogHeaderComponent, UniDividerComponent, UniDrawerComponent, UniDropdownComponent, UniExpandAreaComponent, UniExpandComponent, UniExpandToggleComponent, UniFileDropZoneComponent, UniGridAreaComponent, UniGridComponent, UniIconButtonComponent, UniIconComponent, UniInputBoxComponent, UniInputComponent, UniJsonViewComponent, UniMenuComponent, UniMultiSelectComponent, UniMultiSelectDropdownComponent, UniNotificationBadgeComponent, UniPaginatorComponent, UniPopoverComponent, UniProgressBarComponent, UniProgressGaugeComponent, UniRadioComponent, UniRecordDatasource, UniRowComponent, UniScrollAreaComponent, UniSearchInputComponent, UniSelectComponent, UniServerSideDatasource, UniSkeletonComponent, UniSliderComponent, UniSnackbarComponent, UniSortHeaderComponent, UniStackComponent, UniSymbolComponent, UniTabComponent, UniTabsComponent, UniTagComponent, UniTextComponent, UniTextareaComponent, UniThemeBuilderComponent, UniToggleComponent, UniTooltipComponent, UniWrapComponent, acceptableFile, anchorArrowStyles, anchorStyles, getFileExtension, motionSafe, newAnchorName, resolveFocusTarget, uniqueId, useTimer, visuallyHidden };
|
|
7142
|
+
export { BodyRenderDirective, ConfirmationDialogComponent, DragAndDropDirective, FOCUSABLE_SELECTOR, LocalStorageService, NotificationService, NotificationsComponent, RippleDirective, ThemeService, UNI_THEMES, UniAlertComponent, UniAppBarComponent, UniAvatarComponent, UniAvatarGroupComponent, UniBackgroundComponent, UniBadgeComponent, UniBaseDatasource, UniBoxComponent, UniBreadcrumbComponent, UniButtonComponent, UniButtonGroupComponent, UniCardComponent, UniCardContentComponent, UniCardHeaderComponent, UniCenterComponent, UniCheckboxComponent, UniDataSearchComponent, UniDataTableComponent, UniDebounceInputComponent, UniDialogButtonsComponent, UniDialogComponent, UniDialogHeaderComponent, UniDividerComponent, UniDrawerComponent, UniDropdownComponent, UniExpandAreaComponent, UniExpandComponent, UniExpandToggleComponent, UniFileDropZoneComponent, UniGridAreaComponent, UniGridComponent, UniIconButtonComponent, UniIconComponent, UniInputBoxComponent, UniInputComponent, UniJsonViewComponent, UniMenuComponent, UniMultiSelectComponent, UniMultiSelectDropdownComponent, UniNotificationBadgeComponent, UniPaginatorComponent, UniPopoverComponent, UniProgressBarComponent, UniProgressGaugeComponent, UniRadioComponent, UniRecordDatasource, UniRowComponent, UniScrollAreaComponent, UniSearchInputComponent, UniSelectComponent, UniServerSideDatasource, UniSkeletonComponent, UniSliderComponent, UniSnackbarComponent, UniSortHeaderComponent, UniStackComponent, UniStatComponent, UniSymbolComponent, UniTabComponent, UniTabsComponent, UniTagComponent, UniTextComponent, UniTextareaComponent, UniThemeBuilderComponent, UniToggleComponent, UniTooltipComponent, UniWrapComponent, acceptableFile, anchorArrowStyles, anchorStyles, getFileExtension, motionSafe, newAnchorName, resolveFocusTarget, uniqueId, useTimer, visuallyHidden };
|
|
6745
7143
|
//# sourceMappingURL=uni-design-system-uni-angular.mjs.map
|