@natec/mef-dev-ui-kit 20.0.2 → 20.0.164
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/fesm2022/natec-mef-dev-ui-kit.mjs +552 -73
- package/fesm2022/natec-mef-dev-ui-kit.mjs.map +1 -1
- package/index.d.ts +249 -20
- package/index.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/lib/styles/core.scss +229 -212
- package/src/lib/styles/fonts/main-img-font/icomoon.eot +0 -0
- package/src/lib/styles/fonts/main-img-font/icomoon.svg +16 -13
- package/src/lib/styles/fonts/main-img-font/icomoon.ttf +0 -0
- package/src/lib/styles/fonts/main-img-font/icomoon.woff +0 -0
|
@@ -4263,12 +4263,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
4263
4263
|
/** Projected description container inside the header (styling hook). */
|
|
4264
4264
|
class ExpansionPanelDescription {
|
|
4265
4265
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: ExpansionPanelDescription, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4266
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: ExpansionPanelDescription, isStandalone: true, selector: "panel-description", host: { classAttribute: "expansion-panel-header-description" }, ngImport: i0 });
|
|
4266
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: ExpansionPanelDescription, isStandalone: true, selector: "md-panel-description", host: { classAttribute: "expansion-panel-header-description" }, ngImport: i0 });
|
|
4267
4267
|
}
|
|
4268
4268
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: ExpansionPanelDescription, decorators: [{
|
|
4269
4269
|
type: Directive,
|
|
4270
4270
|
args: [{
|
|
4271
|
-
selector: 'panel-description',
|
|
4271
|
+
selector: 'md-panel-description',
|
|
4272
4272
|
host: {
|
|
4273
4273
|
class: 'expansion-panel-header-description',
|
|
4274
4274
|
},
|
|
@@ -4277,12 +4277,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
4277
4277
|
/** Projected title container inside the header (styling hook). */
|
|
4278
4278
|
class ExpansionPanelTitle {
|
|
4279
4279
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: ExpansionPanelTitle, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
4280
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: ExpansionPanelTitle, isStandalone: true, selector: "panel-title", host: { classAttribute: "expansion-panel-header-title" }, ngImport: i0 });
|
|
4280
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: ExpansionPanelTitle, isStandalone: true, selector: "md-panel-title", host: { classAttribute: "expansion-panel-header-title" }, ngImport: i0 });
|
|
4281
4281
|
}
|
|
4282
4282
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: ExpansionPanelTitle, decorators: [{
|
|
4283
4283
|
type: Directive,
|
|
4284
4284
|
args: [{
|
|
4285
|
-
selector: 'panel-title',
|
|
4285
|
+
selector: 'md-panel-title',
|
|
4286
4286
|
host: {
|
|
4287
4287
|
class: 'expansion-panel-header-title',
|
|
4288
4288
|
},
|
|
@@ -4295,7 +4295,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
4295
4295
|
* - Manages roving focus across panel headers with FocusKeyManager.
|
|
4296
4296
|
* - Filters projected headers so only this accordion’s own headers are managed.
|
|
4297
4297
|
*/
|
|
4298
|
-
class
|
|
4298
|
+
class MDAccordion extends CdkAccordion {
|
|
4299
4299
|
/** Keyboard manager for roving focus (Home/End/Arrow navigation). */
|
|
4300
4300
|
_keyManager;
|
|
4301
4301
|
/**
|
|
@@ -4338,15 +4338,15 @@ class Accordion extends CdkAccordion {
|
|
|
4338
4338
|
this._keyManager?.destroy();
|
|
4339
4339
|
this._ownHeaders.destroy();
|
|
4340
4340
|
}
|
|
4341
|
-
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
4342
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.6", type:
|
|
4341
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDAccordion, deps: null, target: i0.ɵɵFactoryTarget.Directive });
|
|
4342
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "16.1.0", version: "20.3.6", type: MDAccordion, isStandalone: true, selector: "md-accordion", inputs: { hideToggle: ["hideToggle", "hideToggle", booleanAttribute], displayMode: "displayMode", togglePosition: "togglePosition" }, host: { properties: { "class.accordion-multi": "this.multi" }, classAttribute: "accordion" }, providers: [
|
|
4343
4343
|
{
|
|
4344
4344
|
provide: ACCORDION,
|
|
4345
|
-
useExisting:
|
|
4345
|
+
useExisting: MDAccordion,
|
|
4346
4346
|
},
|
|
4347
4347
|
], queries: [{ propertyName: "_headers", predicate: MDExpansionPanelHeader, descendants: true }], exportAs: ["mdAccordion"], usesInheritance: true, ngImport: i0 });
|
|
4348
4348
|
}
|
|
4349
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type:
|
|
4349
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDAccordion, decorators: [{
|
|
4350
4350
|
type: Directive,
|
|
4351
4351
|
args: [{
|
|
4352
4352
|
selector: 'md-accordion',
|
|
@@ -4354,7 +4354,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
4354
4354
|
providers: [
|
|
4355
4355
|
{
|
|
4356
4356
|
provide: ACCORDION,
|
|
4357
|
-
useExisting:
|
|
4357
|
+
useExisting: MDAccordion,
|
|
4358
4358
|
},
|
|
4359
4359
|
],
|
|
4360
4360
|
host: {
|
|
@@ -4376,7 +4376,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
4376
4376
|
}] } });
|
|
4377
4377
|
|
|
4378
4378
|
const components = [
|
|
4379
|
-
|
|
4379
|
+
MDAccordion,
|
|
4380
4380
|
MDExpansionPanel,
|
|
4381
4381
|
ExpansionPanelActionRow,
|
|
4382
4382
|
MDExpansionPanelHeader,
|
|
@@ -4386,13 +4386,13 @@ const components = [
|
|
|
4386
4386
|
];
|
|
4387
4387
|
class MDCollapseModule {
|
|
4388
4388
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCollapseModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
4389
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.6", ngImport: i0, type: MDCollapseModule, imports: [CommonModule,
|
|
4389
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.6", ngImport: i0, type: MDCollapseModule, imports: [CommonModule, MDAccordion,
|
|
4390
4390
|
MDExpansionPanel,
|
|
4391
4391
|
ExpansionPanelActionRow,
|
|
4392
4392
|
MDExpansionPanelHeader,
|
|
4393
4393
|
ExpansionPanelTitle,
|
|
4394
4394
|
ExpansionPanelDescription,
|
|
4395
|
-
MDExpansionPanelContent], exports: [
|
|
4395
|
+
MDExpansionPanelContent], exports: [MDAccordion,
|
|
4396
4396
|
MDExpansionPanel,
|
|
4397
4397
|
ExpansionPanelActionRow,
|
|
4398
4398
|
MDExpansionPanelHeader,
|
|
@@ -4445,10 +4445,11 @@ class MDCard {
|
|
|
4445
4445
|
appearance;
|
|
4446
4446
|
constructor() {
|
|
4447
4447
|
const config = inject(CARD_CONFIG, { optional: true });
|
|
4448
|
-
|
|
4448
|
+
console.log(config);
|
|
4449
|
+
this.appearance = config?.appearance || 'outlined';
|
|
4449
4450
|
}
|
|
4450
4451
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCard, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4451
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: MDCard, isStandalone: true, selector: "md-card", inputs: { appearance: "appearance" }, host: { properties: { "class.mdc-card-outlined": "appearance === \"outlined\"", "class.mdc-card--outlined": "appearance === \"outlined\"", "class.mdc-card-filled": "appearance === \"filled\"", "class.mdc-card--filled": "appearance === \"filled\"" }, classAttribute: "mdc-card mdc-card" }, exportAs: ["mdCard"], ngImport: i0, template: "<ng-content></ng-content>", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.mdc-card{display:flex;flex-direction:column;box-sizing:border-box;position:relative;border-style:solid;border-width:0;background-color:#fdf1f2;border-color:#fdf1f2;border-radius:5px;box-shadow:none;font-family:Montserrat}.mdc-card:after{position:absolute;top:0;left:0;width:100%;height:100%;border:solid 1px transparent;content:\"\";display:block;pointer-events:none;box-sizing:border-box;border-radius:5px}.mdc-card-outlined{background-color:#eaeaea;border-radius:5px;border-width:1px;border-color:#f3f3f3}.mdc-card-outlined:after{border:none}.mdc-card-filled{background-color:#e3e2e6;border-radius:5px;box-shadow:none}.mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}.mdc-card__media:before{display:block;content:\"\"}.mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mdc-card-actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px
|
|
4452
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: MDCard, isStandalone: true, selector: "md-card", inputs: { appearance: "appearance" }, host: { properties: { "class.mdc-card-outlined": "appearance === \"outlined\"", "class.mdc-card--outlined": "appearance === \"outlined\"", "class.mdc-card-filled": "appearance === \"filled\"", "class.mdc-card--filled": "appearance === \"filled\"" }, classAttribute: "mdc-card mdc-card" }, exportAs: ["mdCard"], ngImport: i0, template: "<ng-content></ng-content>", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.mdc-card{display:flex;flex-direction:column;box-sizing:border-box;position:relative;border-style:solid;border-width:0;background-color:#fdf1f2;border-color:#fdf1f2;border-radius:5px;box-shadow:none;padding:16px;font-family:Montserrat}.mdc-card:after{position:absolute;top:0;left:0;width:100%;height:100%;border:solid 1px transparent;content:\"\";display:block;pointer-events:none;box-sizing:border-box;border-radius:5px}.mdc-card-outlined{background-color:#eaeaea;border-radius:5px;border-width:1px;border-color:#f3f3f3}.mdc-card-outlined:after{border:none}.mdc-card-filled{background-color:#e3e2e6;border-radius:5px;box-shadow:none}.mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}.mdc-card__media:before{display:block;content:\"\"}.mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mdc-card-actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px}.mdc-card-title{line-height:1.75rem;font-size:1.375rem;letter-spacing:0;font-weight:700}.mdc-card-subtitle{color:#201a1b;line-height:1.5rem;font-size:1rem;letter-spacing:.009rem;font-weight:500}.mdc-card-title,.mdc-card-subtitle{display:block;margin:0}.mdc-card-avatar~.mdc-card-header-text .mdc-card-title,.mdc-card-avatar~.mdc-card-header-text .mdc-card-subtitle{padding:16px 16px 0}.mdc-card-header{display:flex;min-height:64px}.mdc-card-content{display:block}.mdc-card-title-group{display:flex;justify-content:space-between;width:100%}.mdc-card-avatar{height:40px;width:40px;border-radius:50%;flex-shrink:0;margin-bottom:16px;object-fit:cover}.mdc-card-avatar~.mdc-card-header-text .mdc-card-subtitle,.mdc-card-avatar~.mdc-card-header-text .mdc-card-title{line-height:normal}.mdc-card-sm-image{width:80px;height:80px}.mdc-card-md-image{width:112px;height:112px}.mdc-card-lg-image{width:152px;height:152px}.mdc-card-xl-image{width:240px;height:240px}.mdc-card-subtitle~.mdc-card-title,.mdc-card-title~.mdc-card-subtitle,.mdc-card-header .mdc-card-header-text .mdc-card-title,.mdc-card-header .mdc-card-header-text .mdc-card-subtitle,.mdc-card-title-group .mdc-card-title,.mdc-card-title-group .mdc-card-subtitle{padding-top:0}.mdc-card-content>:last-child:not(.mdc-card-footer){margin-bottom:0}.mdc-card-actions-align-end{justify-content:flex-end}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4452
4453
|
}
|
|
4453
4454
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCard, decorators: [{
|
|
4454
4455
|
type: Component,
|
|
@@ -4458,7 +4459,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
4458
4459
|
'[class.mdc-card--outlined]': 'appearance === "outlined"',
|
|
4459
4460
|
'[class.mdc-card-filled]': 'appearance === "filled"',
|
|
4460
4461
|
'[class.mdc-card--filled]': 'appearance === "filled"',
|
|
4461
|
-
}, exportAs: 'mdCard', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.mdc-card{display:flex;flex-direction:column;box-sizing:border-box;position:relative;border-style:solid;border-width:0;background-color:#fdf1f2;border-color:#fdf1f2;border-radius:5px;box-shadow:none;font-family:Montserrat}.mdc-card:after{position:absolute;top:0;left:0;width:100%;height:100%;border:solid 1px transparent;content:\"\";display:block;pointer-events:none;box-sizing:border-box;border-radius:5px}.mdc-card-outlined{background-color:#eaeaea;border-radius:5px;border-width:1px;border-color:#f3f3f3}.mdc-card-outlined:after{border:none}.mdc-card-filled{background-color:#e3e2e6;border-radius:5px;box-shadow:none}.mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}.mdc-card__media:before{display:block;content:\"\"}.mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mdc-card-actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px
|
|
4462
|
+
}, exportAs: 'mdCard', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content></ng-content>", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.mdc-card{display:flex;flex-direction:column;box-sizing:border-box;position:relative;border-style:solid;border-width:0;background-color:#fdf1f2;border-color:#fdf1f2;border-radius:5px;box-shadow:none;padding:16px;font-family:Montserrat}.mdc-card:after{position:absolute;top:0;left:0;width:100%;height:100%;border:solid 1px transparent;content:\"\";display:block;pointer-events:none;box-sizing:border-box;border-radius:5px}.mdc-card-outlined{background-color:#eaeaea;border-radius:5px;border-width:1px;border-color:#f3f3f3}.mdc-card-outlined:after{border:none}.mdc-card-filled{background-color:#e3e2e6;border-radius:5px;box-shadow:none}.mdc-card__media{position:relative;box-sizing:border-box;background-repeat:no-repeat;background-position:center;background-size:cover}.mdc-card__media:before{display:block;content:\"\"}.mdc-card__media:first-child{border-top-left-radius:inherit;border-top-right-radius:inherit}.mdc-card__media:last-child{border-bottom-left-radius:inherit;border-bottom-right-radius:inherit}.mdc-card-actions{display:flex;flex-direction:row;align-items:center;box-sizing:border-box;min-height:52px}.mdc-card-title{line-height:1.75rem;font-size:1.375rem;letter-spacing:0;font-weight:700}.mdc-card-subtitle{color:#201a1b;line-height:1.5rem;font-size:1rem;letter-spacing:.009rem;font-weight:500}.mdc-card-title,.mdc-card-subtitle{display:block;margin:0}.mdc-card-avatar~.mdc-card-header-text .mdc-card-title,.mdc-card-avatar~.mdc-card-header-text .mdc-card-subtitle{padding:16px 16px 0}.mdc-card-header{display:flex;min-height:64px}.mdc-card-content{display:block}.mdc-card-title-group{display:flex;justify-content:space-between;width:100%}.mdc-card-avatar{height:40px;width:40px;border-radius:50%;flex-shrink:0;margin-bottom:16px;object-fit:cover}.mdc-card-avatar~.mdc-card-header-text .mdc-card-subtitle,.mdc-card-avatar~.mdc-card-header-text .mdc-card-title{line-height:normal}.mdc-card-sm-image{width:80px;height:80px}.mdc-card-md-image{width:112px;height:112px}.mdc-card-lg-image{width:152px;height:152px}.mdc-card-xl-image{width:240px;height:240px}.mdc-card-subtitle~.mdc-card-title,.mdc-card-title~.mdc-card-subtitle,.mdc-card-header .mdc-card-header-text .mdc-card-title,.mdc-card-header .mdc-card-header-text .mdc-card-subtitle,.mdc-card-title-group .mdc-card-title,.mdc-card-title-group .mdc-card-subtitle{padding-top:0}.mdc-card-content>:last-child:not(.mdc-card-footer){margin-bottom:0}.mdc-card-actions-align-end{justify-content:flex-end}\n"] }]
|
|
4462
4463
|
}], ctorParameters: () => [], propDecorators: { appearance: [{
|
|
4463
4464
|
type: Input
|
|
4464
4465
|
}] } });
|
|
@@ -4492,11 +4493,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
4492
4493
|
*/
|
|
4493
4494
|
class MDCardTitleGroup {
|
|
4494
4495
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCardTitleGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4495
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: MDCardTitleGroup, isStandalone: true, selector: "md-card-title-group", host: { classAttribute: "mdc-card-title-group" }, ngImport: i0, template: "<div>\r\n <ng-content\r\n select=\"card-title, card-subtitle,\r\n [card-title], [card-subtitle],\r\n [
|
|
4496
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: MDCardTitleGroup, isStandalone: true, selector: "md-card-title-group", host: { classAttribute: "mdc-card-title-group" }, ngImport: i0, template: "<div>\r\n <ng-content\r\n select=\"md-card-title, md-card-subtitle,\r\n [md-card-title], [md-card-subtitle],\r\n [mdCardTitle], [mdCardSubtitle]\"\r\n ></ng-content>\r\n</div>\r\n<ng-content\r\n select=\"[card-image], [cardImage],\r\n [card-sm-image], [cardImageSmall],\r\n [card-md-image], [cardImageMedium],\r\n [card-lg-image], [cardImageLarge],\r\n [card-xl-image], [cardImageXLarge]\"\r\n></ng-content>\r\n<ng-content></ng-content>\r\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4496
4497
|
}
|
|
4497
4498
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCardTitleGroup, decorators: [{
|
|
4498
4499
|
type: Component,
|
|
4499
|
-
args: [{ selector: 'md-card-title-group', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'mdc-card-title-group' }, template: "<div>\r\n <ng-content\r\n select=\"card-title, card-subtitle,\r\n [card-title], [card-subtitle],\r\n [
|
|
4500
|
+
args: [{ selector: 'md-card-title-group', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'mdc-card-title-group' }, template: "<div>\r\n <ng-content\r\n select=\"md-card-title, md-card-subtitle,\r\n [md-card-title], [md-card-subtitle],\r\n [mdCardTitle], [mdCardSubtitle]\"\r\n ></ng-content>\r\n</div>\r\n<ng-content\r\n select=\"[card-image], [cardImage],\r\n [card-sm-image], [cardImageSmall],\r\n [card-md-image], [cardImageMedium],\r\n [card-lg-image], [cardImageLarge],\r\n [card-xl-image], [cardImageXLarge]\"\r\n></ng-content>\r\n<ng-content></ng-content>\r\n" }]
|
|
4500
4501
|
}] });
|
|
4501
4502
|
/**
|
|
4502
4503
|
* Content directive for the main textual/body area of the card.
|
|
@@ -4587,11 +4588,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
4587
4588
|
*/
|
|
4588
4589
|
class MDCardHeader {
|
|
4589
4590
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCardHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
4590
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: MDCardHeader, isStandalone: true, selector: "md-card-header", host: { classAttribute: "mdc-card-header" }, ngImport: i0, template: "<ng-content select=\"[card-avatar], [
|
|
4591
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: MDCardHeader, isStandalone: true, selector: "md-card-header", host: { classAttribute: "mdc-card-header" }, ngImport: i0, template: "<ng-content select=\"[md-card-avatar], [mdCardAvatar]\"></ng-content>\r\n<div class=\"mdc-card-header-text\">\r\n <ng-content\r\n select=\"md-card-title, md-card-subtitle,\r\n [md-card-title], [md-card-subtitle],\r\n [mdCardTitle], [mdCardSubtitle]\"\r\n ></ng-content>\r\n</div>\r\n<ng-content></ng-content>\r\n", changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
4591
4592
|
}
|
|
4592
4593
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCardHeader, decorators: [{
|
|
4593
4594
|
type: Component,
|
|
4594
|
-
args: [{ selector: 'md-card-header', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'mdc-card-header' }, template: "<ng-content select=\"[card-avatar], [
|
|
4595
|
+
args: [{ selector: 'md-card-header', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: { class: 'mdc-card-header' }, template: "<ng-content select=\"[md-card-avatar], [mdCardAvatar]\"></ng-content>\r\n<div class=\"mdc-card-header-text\">\r\n <ng-content\r\n select=\"md-card-title, md-card-subtitle,\r\n [md-card-title], [md-card-subtitle],\r\n [mdCardTitle], [mdCardSubtitle]\"\r\n ></ng-content>\r\n</div>\r\n<ng-content></ng-content>\r\n" }]
|
|
4595
4596
|
}] });
|
|
4596
4597
|
/**
|
|
4597
4598
|
* Footer directive.
|
|
@@ -5407,7 +5408,7 @@ class MDDialogClose {
|
|
|
5407
5408
|
event.screenX === 0 && event.screenY === 0 ? 'keyboard' : 'mouse', this.dialogResult);
|
|
5408
5409
|
}
|
|
5409
5410
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDDialogClose, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
5410
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: MDDialogClose, isStandalone: true, selector: "[md-dialog-close], [mdDialogClose]", inputs: { ariaLabel: ["aria-label", "ariaLabel"], type: "type", dialogResult: ["dialog-close", "dialogResult"], dialogClose: "dialogClose" }, host: { listeners: { "click": "_onButtonClick($event)" }, properties: { "attr.aria-label": "ariaLabel || null", "attr.type": "type" } }, exportAs: ["mdDialogClose"], usesOnChanges: true, ngImport: i0 });
|
|
5411
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: MDDialogClose, isStandalone: true, selector: "[md-dialog-close], [mdDialogClose]", inputs: { ariaLabel: ["aria-label", "ariaLabel"], type: "type", dialogResult: ["md-dialog-close", "dialogResult"], dialogClose: ["mdDialogClose", "dialogClose"] }, host: { listeners: { "click": "_onButtonClick($event)" }, properties: { "attr.aria-label": "ariaLabel || null", "attr.type": "type" } }, exportAs: ["mdDialogClose"], usesOnChanges: true, ngImport: i0 });
|
|
5411
5412
|
}
|
|
5412
5413
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDDialogClose, decorators: [{
|
|
5413
5414
|
type: Directive,
|
|
@@ -5427,10 +5428,10 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
5427
5428
|
type: Input
|
|
5428
5429
|
}], dialogResult: [{
|
|
5429
5430
|
type: Input,
|
|
5430
|
-
args: ['dialog-close']
|
|
5431
|
+
args: ['md-dialog-close']
|
|
5431
5432
|
}], dialogClose: [{
|
|
5432
5433
|
type: Input,
|
|
5433
|
-
args: ['
|
|
5434
|
+
args: ['mdDialogClose']
|
|
5434
5435
|
}] } });
|
|
5435
5436
|
/**
|
|
5436
5437
|
* Base class for directives that represent structural sections within a dialog
|
|
@@ -5697,8 +5698,6 @@ class MDStepHeader extends CdkStepHeader {
|
|
|
5697
5698
|
active;
|
|
5698
5699
|
/** Marks the step as optional (affects label rendering). */
|
|
5699
5700
|
optional;
|
|
5700
|
-
/** Disables ripple effects on header interactions. */
|
|
5701
|
-
disableRipple;
|
|
5702
5701
|
constructor() {
|
|
5703
5702
|
super();
|
|
5704
5703
|
const changeDetectorRef = inject(ChangeDetectorRef);
|
|
@@ -5770,17 +5769,15 @@ class MDStepHeader extends CdkStepHeader {
|
|
|
5770
5769
|
return this.state === 'error';
|
|
5771
5770
|
}
|
|
5772
5771
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDStepHeader, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
5773
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDStepHeader, isStandalone: true, selector: "md-step-header", inputs: { state: "state", label: "label", errorMessage: "errorMessage", iconOverrides: "iconOverrides", index: "index", selected: "selected", active: "active", optional: "optional"
|
|
5772
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDStepHeader, isStandalone: true, selector: "md-step-header", inputs: { state: "state", label: "label", errorMessage: "errorMessage", iconOverrides: "iconOverrides", index: "index", selected: "selected", active: "active", optional: "optional" }, host: { attributes: { "role": "tab" }, properties: { "class.md-step-header-empty-label": "_hasEmptyLabel()" }, classAttribute: "step-header" }, usesInheritance: true, ngImport: i0, template: "<div class=\"step-icon-state-{{state}} step-icon\" [class.step-icon-selected]=\"selected\">\r\n <div class=\"step-icon-content\">\r\n @if (iconOverrides && iconOverrides[state]) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"iconOverrides[state]\"\r\n [ngTemplateOutletContext]=\"{index, active, optional}\"\r\n ></ng-container>\r\n } @else { @switch (state) { @case ('number') {\r\n <span aria-hidden=\"true\">{{_getDefaultTextForState(state)}}</span>\r\n } @default { @if (state === 'done') {\r\n <span class=\"cdk-visually-hidden\">{{_intl.completedLabel}}</span>\r\n } @else if (state === 'edit') {\r\n <span class=\"cdk-visually-hidden\">{{_intl.editableLabel}}</span>\r\n } @switch (state) { @case ('done') {\r\n <div class=\"icon-wrapper\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 640 640\">\r\n <path\r\n d=\"M530.8 134.1C545.1 144.5 548.3 164.5 537.9 178.8L281.9 530.8C276.4 538.4 267.9 543.1 258.5 543.9C249.1 544.7 240 541.2 233.4 534.6L105.4 406.6C92.9 394.1 92.9 373.8 105.4 361.3C117.9 348.8 138.2 348.8 150.7 361.3L252.2 462.8L486.2 141.1C496.6 126.8 516.6 123.6 530.9 134z\"\r\n />\r\n </svg>\r\n </div>\r\n } @case ('edit') {\r\n <div class=\"icon-wrapper\">\r\n <svg\r\n width=\"36\"\r\n height=\"36\"\r\n viewBox=\"0 0 36 36\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"ng-star-inserted\"\r\n >\r\n <rect x=\"0.5\" y=\"0.5\" width=\"35\" height=\"35\" rx=\"17.5\" stroke=\"#929292\"></rect>\r\n <path\r\n d=\"M24.7373 10L14.5466 20.3769L11.2415 17.0114L8 20.3122L11.3051 23.6777L14.5678 27L17.8093 23.6992L28 13.3224L24.7373 10Z\"\r\n fill=\"#28B446\"\r\n ></path>\r\n </svg>\r\n </div>\r\n } } } } }\r\n </div>\r\n</div>\r\n<div\r\n class=\"step-label\"\r\n [class.step-label-active]=\"active\"\r\n [class.step-label-selected]=\"selected\"\r\n [class.step-label-error]=\"state == 'error'\"\r\n>\r\n @if (_templateLabel(); as templateLabel) {\r\n <div class=\"step-text-label\">\r\n <ng-container [ngTemplateOutlet]=\"templateLabel.template\"></ng-container>\r\n </div>\r\n } @else if (_stringLabel()) {\r\n <div class=\"step-text-label\">{{label}}</div>\r\n } @if (_hasOptionalLabel()) {\r\n <div class=\"step-optional\">{{_intl.optionalLabel}}</div>\r\n } @if (_hasErrorLabel()) {\r\n <div class=\"step-sub-label-error\">{{errorMessage}}</div>\r\n }\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.step-header{overflow:hidden;outline:none;cursor:pointer;position:relative;box-sizing:content-box;-webkit-tap-highlight-color:transparent}.step-header:focus .md-focus-indicator:before{content:\"\"}.step-header:hover[aria-disabled=true]{cursor:default}.step-header:hover:not([aria-disabled]) .step-icon:after,.step-header:hover[aria-disabled=false] .step-icon:after{border-radius:100%;content:\"\";border-width:1px;border-style:solid;border-color:#929292;pointer-events:none;display:block;position:absolute;inset-block-start:-4px;inset-inline-end:-4px;inset-block-end:-4px;inset-inline-start:-4px;z-index:2}.step-header[aria-selected=true]{color:#000}.step-header.cdk-keyboard-focused:not([aria-disabled]) .step-icon:after,.step-header.cdk-program-focused:not([aria-disabled]) .step-icon:after{border-radius:100%;content:\"\";border-width:1px;border-style:solid;border-color:#929292;pointer-events:none;display:block;position:absolute;inset-block-start:-4px;inset-inline-end:-4px;inset-block-end:-4px;inset-inline-start:-4px;z-index:2}@media (hover: none){.step-header:hover{background:none}}@media (forced-colors: active){.step-header{outline:solid 1px}.step-header[aria-selected=true] .step-label{text-decoration:underline}.step-header[aria-disabled=true]{outline-color:GrayText}.step-header[aria-disabled=true] .step-label,.step-header[aria-disabled=true] .step-icon,.step-header[aria-disabled=true] .step-optional{color:GrayText}}.step-optional{font-size:12px;color:#dae5e4}.step-sub-label-error{font-size:12px;font-weight:400}.step-icon{border-radius:50%;height:36px;width:36px;flex-shrink:0;position:relative;color:#eaeaea;background-color:#4d4d4d}.step-icon-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex}.step-label{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:50px;vertical-align:middle;color:#373737}.step-header-empty-label .step-label{min-width:0}.step-label.step-label-selected{color:#000}.step-text-label{text-overflow:ellipsis;overflow:hidden}.icon-wrapper{font-size:36px;height:36px;width:36px;display:flex;align-items:center;fill:#fff}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}.step-icon-selected{color:#4d4d4d;background-color:#fff;border:1px solid #CF0106}.step-icon-state-done{background-color:#fff;color:#000}.step-icon-state-edit{background-color:#fff;color:#fff}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
5774
5773
|
}
|
|
5775
5774
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDStepHeader, decorators: [{
|
|
5776
5775
|
type: Component,
|
|
5777
5776
|
args: [{ selector: 'md-step-header', host: {
|
|
5778
5777
|
class: 'step-header',
|
|
5779
|
-
'[class.
|
|
5780
|
-
// Apply color host class or fallback to "primary"
|
|
5781
|
-
'[class]': '(color || "primary")',
|
|
5778
|
+
'[class.md-step-header-empty-label]': '_hasEmptyLabel()',
|
|
5782
5779
|
role: 'tab',
|
|
5783
|
-
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], template: "<div class=\"step-icon-state-{{state}} step-icon\" [class.step-icon-selected]=\"selected\">\r\n <div class=\"step-icon-content\">\r\n @if (iconOverrides && iconOverrides[state]) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"iconOverrides[state]\"\r\n [ngTemplateOutletContext]=\"{index, active, optional}\"\r\n ></ng-container>\r\n } @else { @switch (state) { @case ('number') {\r\n <span aria-hidden=\"true\">{{_getDefaultTextForState(state)}}</span>\r\n } @default { @if (state === 'done') {\r\n <span class=\"cdk-visually-hidden\">{{_intl.completedLabel}}</span>\r\n } @else if (state === 'edit') {\r\n <span class=\"cdk-visually-hidden\">{{_intl.editableLabel}}</span>\r\n } @switch (state) { @case ('done') {\r\n <div class=\"icon-wrapper\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 640 640\">\r\n <path\r\n d=\"M530.8 134.1C545.1 144.5 548.3 164.5 537.9 178.8L281.9 530.8C276.4 538.4 267.9 543.1 258.5 543.9C249.1 544.7 240 541.2 233.4 534.6L105.4 406.6C92.9 394.1 92.9 373.8 105.4 361.3C117.9 348.8 138.2 348.8 150.7 361.3L252.2 462.8L486.2 141.1C496.6 126.8 516.6 123.6 530.9 134z\"\r\n />\r\n </svg>\r\n </div>\r\n } @case ('edit') {\r\n <div class=\"icon-wrapper\">\r\n <svg\r\n width=\"36\"\r\n height=\"36\"\r\n viewBox=\"0 0 36 36\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"ng-star-inserted\"\r\n >\r\n <rect x=\"0.5\" y=\"0.5\" width=\"35\" height=\"35\" rx=\"17.5\" stroke=\"#929292\"></rect>\r\n <path\r\n d=\"M24.7373 10L14.5466 20.3769L11.2415 17.0114L8 20.3122L11.3051 23.6777L14.5678 27L17.8093 23.6992L28 13.3224L24.7373 10Z\"\r\n fill=\"#28B446\"\r\n ></path>\r\n </svg>\r\n </div>\r\n } } } } }\r\n </div>\r\n</div>\r\n<div\r\n class=\"step-label\"\r\n [class.step-label-active]=\"active\"\r\n [class.step-label-selected]=\"selected\"\r\n [class.step-label-error]=\"state == 'error'\"\r\n>\r\n @if (_templateLabel(); as templateLabel) {\r\n <div class=\"step-text-label\">\r\n <ng-container [ngTemplateOutlet]=\"templateLabel.template\"></ng-container>\r\n </div>\r\n } @else if (_stringLabel()) {\r\n <div class=\"step-text-label\">{{label}}</div>\r\n } @if (_hasOptionalLabel()) {\r\n <div class=\"step-optional\">{{_intl.optionalLabel}}</div>\r\n } @if (_hasErrorLabel()) {\r\n <div class=\"step-sub-label-error\">{{errorMessage}}</div>\r\n }\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.step-header{overflow:hidden;outline:none;cursor:pointer;position:relative;box-sizing:content-box;-webkit-tap-highlight-color:transparent}.step-header:focus .
|
|
5780
|
+
}, encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet], template: "<div class=\"step-icon-state-{{state}} step-icon\" [class.step-icon-selected]=\"selected\">\r\n <div class=\"step-icon-content\">\r\n @if (iconOverrides && iconOverrides[state]) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"iconOverrides[state]\"\r\n [ngTemplateOutletContext]=\"{index, active, optional}\"\r\n ></ng-container>\r\n } @else { @switch (state) { @case ('number') {\r\n <span aria-hidden=\"true\">{{_getDefaultTextForState(state)}}</span>\r\n } @default { @if (state === 'done') {\r\n <span class=\"cdk-visually-hidden\">{{_intl.completedLabel}}</span>\r\n } @else if (state === 'edit') {\r\n <span class=\"cdk-visually-hidden\">{{_intl.editableLabel}}</span>\r\n } @switch (state) { @case ('done') {\r\n <div class=\"icon-wrapper\">\r\n <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 640 640\">\r\n <path\r\n d=\"M530.8 134.1C545.1 144.5 548.3 164.5 537.9 178.8L281.9 530.8C276.4 538.4 267.9 543.1 258.5 543.9C249.1 544.7 240 541.2 233.4 534.6L105.4 406.6C92.9 394.1 92.9 373.8 105.4 361.3C117.9 348.8 138.2 348.8 150.7 361.3L252.2 462.8L486.2 141.1C496.6 126.8 516.6 123.6 530.9 134z\"\r\n />\r\n </svg>\r\n </div>\r\n } @case ('edit') {\r\n <div class=\"icon-wrapper\">\r\n <svg\r\n width=\"36\"\r\n height=\"36\"\r\n viewBox=\"0 0 36 36\"\r\n fill=\"none\"\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n class=\"ng-star-inserted\"\r\n >\r\n <rect x=\"0.5\" y=\"0.5\" width=\"35\" height=\"35\" rx=\"17.5\" stroke=\"#929292\"></rect>\r\n <path\r\n d=\"M24.7373 10L14.5466 20.3769L11.2415 17.0114L8 20.3122L11.3051 23.6777L14.5678 27L17.8093 23.6992L28 13.3224L24.7373 10Z\"\r\n fill=\"#28B446\"\r\n ></path>\r\n </svg>\r\n </div>\r\n } } } } }\r\n </div>\r\n</div>\r\n<div\r\n class=\"step-label\"\r\n [class.step-label-active]=\"active\"\r\n [class.step-label-selected]=\"selected\"\r\n [class.step-label-error]=\"state == 'error'\"\r\n>\r\n @if (_templateLabel(); as templateLabel) {\r\n <div class=\"step-text-label\">\r\n <ng-container [ngTemplateOutlet]=\"templateLabel.template\"></ng-container>\r\n </div>\r\n } @else if (_stringLabel()) {\r\n <div class=\"step-text-label\">{{label}}</div>\r\n } @if (_hasOptionalLabel()) {\r\n <div class=\"step-optional\">{{_intl.optionalLabel}}</div>\r\n } @if (_hasErrorLabel()) {\r\n <div class=\"step-sub-label-error\">{{errorMessage}}</div>\r\n }\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.step-header{overflow:hidden;outline:none;cursor:pointer;position:relative;box-sizing:content-box;-webkit-tap-highlight-color:transparent}.step-header:focus .md-focus-indicator:before{content:\"\"}.step-header:hover[aria-disabled=true]{cursor:default}.step-header:hover:not([aria-disabled]) .step-icon:after,.step-header:hover[aria-disabled=false] .step-icon:after{border-radius:100%;content:\"\";border-width:1px;border-style:solid;border-color:#929292;pointer-events:none;display:block;position:absolute;inset-block-start:-4px;inset-inline-end:-4px;inset-block-end:-4px;inset-inline-start:-4px;z-index:2}.step-header[aria-selected=true]{color:#000}.step-header.cdk-keyboard-focused:not([aria-disabled]) .step-icon:after,.step-header.cdk-program-focused:not([aria-disabled]) .step-icon:after{border-radius:100%;content:\"\";border-width:1px;border-style:solid;border-color:#929292;pointer-events:none;display:block;position:absolute;inset-block-start:-4px;inset-inline-end:-4px;inset-block-end:-4px;inset-inline-start:-4px;z-index:2}@media (hover: none){.step-header:hover{background:none}}@media (forced-colors: active){.step-header{outline:solid 1px}.step-header[aria-selected=true] .step-label{text-decoration:underline}.step-header[aria-disabled=true]{outline-color:GrayText}.step-header[aria-disabled=true] .step-label,.step-header[aria-disabled=true] .step-icon,.step-header[aria-disabled=true] .step-optional{color:GrayText}}.step-optional{font-size:12px;color:#dae5e4}.step-sub-label-error{font-size:12px;font-weight:400}.step-icon{border-radius:50%;height:36px;width:36px;flex-shrink:0;position:relative;color:#eaeaea;background-color:#4d4d4d}.step-icon-content{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex}.step-label{display:inline-block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:50px;vertical-align:middle;color:#373737}.step-header-empty-label .step-label{min-width:0}.step-label.step-label-selected{color:#000}.step-text-label{text-overflow:ellipsis;overflow:hidden}.icon-wrapper{font-size:36px;height:36px;width:36px;display:flex;align-items:center;fill:#fff}.cdk-visually-hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap;outline:0;-webkit-appearance:none;-moz-appearance:none;left:0}.step-icon-selected{color:#4d4d4d;background-color:#fff;border:1px solid #CF0106}.step-icon-state-done{background-color:#fff;color:#000}.step-icon-state-edit{background-color:#fff;color:#fff}\n"] }]
|
|
5784
5781
|
}], ctorParameters: () => [], propDecorators: { state: [{
|
|
5785
5782
|
type: Input
|
|
5786
5783
|
}], label: [{
|
|
@@ -5797,8 +5794,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
5797
5794
|
type: Input
|
|
5798
5795
|
}], optional: [{
|
|
5799
5796
|
type: Input
|
|
5800
|
-
}], disableRipple: [{
|
|
5801
|
-
type: Input
|
|
5802
5797
|
}] } });
|
|
5803
5798
|
|
|
5804
5799
|
/**
|
|
@@ -6065,7 +6060,7 @@ class MDStepper extends CdkStepper {
|
|
|
6065
6060
|
this.updatePagination();
|
|
6066
6061
|
};
|
|
6067
6062
|
merge(resize, this._stepHeader.changes, this._itemsResized())
|
|
6068
|
-
.pipe(takeUntil(this._destroyed))
|
|
6063
|
+
.pipe(filter(() => this.orientation === 'horizontal'), takeUntil(this._destroyed))
|
|
6069
6064
|
.subscribe(() => {
|
|
6070
6065
|
this._ngZone.run(() => {
|
|
6071
6066
|
Promise.resolve().then(() => {
|
|
@@ -6081,7 +6076,7 @@ class MDStepper extends CdkStepper {
|
|
|
6081
6076
|
this._stepLabelCount = this._stepHeader.length;
|
|
6082
6077
|
this.changeDetectorRef.markForCheck();
|
|
6083
6078
|
}
|
|
6084
|
-
if (this._selectedIndexChanged) {
|
|
6079
|
+
if (this._selectedIndexChanged && this.orientation === 'horizontal') {
|
|
6085
6080
|
this._scrollToLabel(this.selectedIndex);
|
|
6086
6081
|
this._checkScrollingControls();
|
|
6087
6082
|
this._selectedIndexChanged = false;
|
|
@@ -6223,6 +6218,8 @@ class MDStepper extends CdkStepper {
|
|
|
6223
6218
|
this._stepListContainer.nativeElement.scrollLeft = 0;
|
|
6224
6219
|
}
|
|
6225
6220
|
updatePagination() {
|
|
6221
|
+
if (this.orientation === 'vertical')
|
|
6222
|
+
return;
|
|
6226
6223
|
this._checkPaginationEnabled();
|
|
6227
6224
|
this._checkScrollingControls();
|
|
6228
6225
|
this._updateTabScrollPosition();
|
|
@@ -6263,6 +6260,8 @@ class MDStepper extends CdkStepper {
|
|
|
6263
6260
|
this._stateChanged();
|
|
6264
6261
|
}));
|
|
6265
6262
|
}
|
|
6263
|
+
if (this.orientation === 'vertical')
|
|
6264
|
+
return;
|
|
6266
6265
|
this._eventCleanups.push(this._renderer.listen(this._previousPaginator.nativeElement, 'touchstart', () => this._handlePaginatorPress('before'), passiveEventListenerOptions$1), this._renderer.listen(this._nextPaginator.nativeElement, 'touchstart', () => this._handlePaginatorPress('after'), passiveEventListenerOptions$1));
|
|
6267
6266
|
}
|
|
6268
6267
|
/** Tear down transition listener on destroy. */
|
|
@@ -6316,7 +6315,7 @@ class MDStepper extends CdkStepper {
|
|
|
6316
6315
|
this.animationDone.emit();
|
|
6317
6316
|
}
|
|
6318
6317
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDStepper, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6319
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDStepper, isStandalone: true, selector: "md-stepper, md-vertical-stepper, md-horizontal-stepper, [mdStepper]", inputs: { labelPosition: "labelPosition", headerPosition: "headerPosition", animationDuration: "animationDuration", disablePagination: "disablePagination" }, outputs: { animationDone: "animationDone" }, host: { attributes: { "role": "tablist" }, properties: { "class.stepper-horizontal": "orientation === \"horizontal\"", "class.stepper-vertical": "orientation === \"vertical\"", "class.stepper-label-position-end": "orientation === \"horizontal\" && labelPosition == \"end\"", "class.stepper-label-position-bottom": "orientation === \"horizontal\" && labelPosition == \"bottom\"", "class.stepper-header-position-bottom": "headerPosition === \"bottom\"", "class.mdc-step-header-pagination-controls-enabled": "_showPaginationControls", "class.stepper-animating": "_isAnimating()", "style.stepper-animation-duration": "_getAnimationDuration()", "attr.aria-orientation": "orientation" } }, providers: [{ provide: CdkStepper, useExisting: MDStepper }], queries: [{ propertyName: "footer", first: true, predicate: MDStepFooter, descendants: true, read: TemplateRef }, { propertyName: "_steps", predicate: MDStep, descendants: true }, { propertyName: "_icons", predicate: MDStepperIcon, descendants: true }], viewQueries: [{ propertyName: "_stepHeaderElRef", first: true, predicate: ["stepHeader"], descendants: true }, { propertyName: "_stepListContainer", first: true, predicate: ["stepListContainer"], descendants: true }, { propertyName: "_stepList", first: true, predicate: ["stepList"], descendants: true }, { propertyName: "_stepListInner", first: true, predicate: ["stepListInner"], descendants: true }, { propertyName: "_nextPaginator", first: true, predicate: ["nextPaginator"], descendants: true }, { propertyName: "_previousPaginator", first: true, predicate: ["previousPaginator"], descendants: true }, { propertyName: "_stepHeader", predicate: MDStepHeader, descendants: true }, { propertyName: "_animatedContainers", predicate: ["animatedContainer"], descendants: true }], exportAs: ["mdStepper", "mdVerticalStepper", "mdHorizontalStepper"], usesInheritance: true, ngImport: i0, template: "@if (_isServer) {\r\n <ng-content/>\r\n}\r\n\r\n@switch (orientation) {\r\n @case ('horizontal') {\r\n <div class=\"horizontal-stepper-wrapper\">\r\n \r\n <div class=\"mdc-step-header\" #stepHeader>\r\n <div class=\"mdc-step-header-pagination mdc-step-header-pagination-before\"\r\n #previousPaginator\r\n [class.mdc-step-header-pagination-disabled]=\"_disableScrollBefore\"\r\n (click)=\"_handlePaginatorClick('before')\"\r\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-step-header-pagination-chevron\"></div>\r\n </div>\r\n\r\n <div class=\"mdc-step-label-container\" #stepListContainer>\r\n <div class=\"mdc-step-list\" #stepList>\r\n <div class=\"horizontal-stepper-header-container\" #stepListInner>\r\n @for (step of steps; track step) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"stepTemplate\"\r\n [ngTemplateOutletContext]=\"{step}\"/>\r\n @if (!$last) {\r\n <div class=\"stepper-horizontal-line\"></div>\r\n }\r\n }\r\n </div> \r\n </div>\r\n </div>\r\n\r\n <div class=\"mdc-step-header-pagination mdc-step-header-pagination-after\"\r\n #nextPaginator\r\n [class.mdc-step-header-pagination-disabled]=\"_disableScrollAfter\"\r\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\r\n (click)=\"_handlePaginatorClick('after')\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-step-header-pagination-chevron\"></div>\r\n </div> \r\n </div>\r\n \r\n\r\n <div class=\"horizontal-content-container\">\r\n @for (step of steps; track step) {\r\n <div\r\n #animatedContainer\r\n class=\"horizontal-stepper-content\"\r\n role=\"tabpanel\"\r\n [id]=\"_getStepContentId($index)\"\r\n [attr.aria-labelledby]=\"_getStepLabelId($index)\"\r\n [class]=\"'horizontal-stepper-content-' + _getAnimationDirection($index)\"\r\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\r\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n \r\n }\r\n\r\n @case ('vertical') {\r\n @for (step of steps; track step) {\r\n <div class=\"step\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"stepTemplate\"\r\n [ngTemplateOutletContext]=\"{step}\"/>\r\n <div\r\n #animatedContainer\r\n class=\"vertical-content-container\"\r\n [class.stepper-vertical-line]=\"!$last\"\r\n [class.vertical-content-container-active]=\"selectedIndex === $index\"\r\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\r\n <div class=\"vertical-stepper-content\"\r\n role=\"tabpanel\"\r\n [id]=\"_getStepContentId($index)\"\r\n [attr.aria-labelledby]=\"_getStepLabelId($index)\">\r\n <div class=\"vertical-content\">\r\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n}\r\n\r\n<ng-template let-step=\"step\" #stepTemplate>\r\n <md-step-header\r\n [class.horizontal-stepper-header]=\"orientation === 'horizontal'\"\r\n [class.vertical-stepper-header]=\"orientation === 'vertical'\"\r\n (click)=\"step.select()\"\r\n (keydown)=\"_onKeydown($event)\"\r\n [tabIndex]=\"_getFocusIndex() === step.index() ? 0 : -1\"\r\n [id]=\"_getStepLabelId(step.index())\"\r\n [attr.aria-posinset]=\"step.index() + 1\"\r\n [attr.aria-setsize]=\"steps.length\"\r\n [attr.aria-controls]=\"_getStepContentId(step.index())\"\r\n [attr.aria-selected]=\"step.isSelected()\"\r\n [attr.aria-label]=\"step.ariaLabel || null\"\r\n [attr.aria-labelledby]=\"(!step.ariaLabel && step.ariaLabelledby) ? step.ariaLabelledby : null\"\r\n [attr.aria-disabled]=\"step.isNavigable() ? null : true\"\r\n [index]=\"step.index()\"\r\n [state]=\"step.indicatorType()\"\r\n [label]=\"step.stepLabel || step.label\"\r\n [selected]=\"step.isSelected()\"\r\n [active]=\"step.isNavigable()\"\r\n [optional]=\"step.optional\"\r\n [errorMessage]=\"step.errorMessage\"\r\n [iconOverrides]=\"_iconOverrides\"\r\n [disableRipple]=\"disableRipple || !step.isNavigable()\"\r\n [color]=\"step.color || color\"/>\r\n</ng-template>\r\n\r\n\r\n<ng-container [ngTemplateOutlet]=\"footer\"></ng-container>", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.stepper-vertical,.stepper-horizontal{display:block;font-family:Montserrat;font-size:14px;color:#000}.horizontal-stepper-header-container{white-space:nowrap;display:flex;align-items:center}.stepper-label-position-bottom .horizontal-stepper-header-container{align-items:flex-start}.stepper-header-position-bottom .horizontal-stepper-header-container{order:1}.stepper-horizontal-line{border-top-width:1px;border-top-style:solid;flex:auto;height:0;margin:0 -16px;min-width:32px;border-top-color:#889392}.stepper-label-position-bottom .stepper-horizontal-line{margin:0;min-width:0;position:relative;top:36px}.stepper-label-position-bottom .horizontal-stepper-header:not(:first-child):before,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:not(:last-child):before,.stepper-label-position-bottom .horizontal-stepper-header:not(:last-child):after,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:not(:first-child):after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px)}.horizontal-stepper-header{display:flex;overflow:hidden;align-items:center;padding:0 24px;height:48px}.horizontal-stepper-header .step-icon{position:relative;margin-right:8px;flex:none}[dir=rtl] .horizontal-stepper-header .step-icon{margin-right:0;margin-left:8px}.horizontal-stepper-header.step-header-empty-label .step-icon{margin:0}.stepper-label-position-bottom .horizontal-stepper-header{padding:24px}.stepper-label-position-bottom .horizontal-stepper-header:before,.stepper-label-position-bottom .horizontal-stepper-header:after{top:36px}.stepper-label-position-bottom .horizontal-stepper-header{box-sizing:border-box;flex-direction:column;height:auto}.stepper-label-position-bottom .horizontal-stepper-header:not(:last-child):after,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:not(:first-child):after{right:0}.stepper-label-position-bottom .horizontal-stepper-header:not(:first-child):before,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:not(:last-child):before{left:0}[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:last-child:before,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:first-child:after{display:none}.stepper-label-position-bottom .horizontal-stepper-header .step-icon{margin-right:0;margin-left:0}.stepper-label-position-bottom .horizontal-stepper-header .step-label{padding:16px 0 0;text-align:center;width:100%}.vertical-stepper-header{display:flex;align-items:center;height:24px;padding:24px}.vertical-stepper-header .step-icon{margin-right:12px}[dir=rtl] .vertical-stepper-header .step-icon{margin-right:0;margin-left:12px}.horizontal-stepper-wrapper{display:flex;flex-direction:column}.horizontal-stepper-content{visibility:hidden;overflow:hidden;outline:0;height:0}.stepper-animations-enabled .horizontal-stepper-content{transition:transform .5s cubic-bezier(.35,0,.25,1)}.horizontal-stepper-content.horizontal-stepper-content-previous{transform:translate3d(-100%,0,0)}.horizontal-stepper-content.horizontal-stepper-content-next{transform:translate3d(100%,0,0)}.horizontal-stepper-content.horizontal-stepper-content-current{visibility:visible;transform:none;height:auto}.stepper-horizontal:not(.stepper-animating) .horizontal-stepper-content.horizontal-stepper-content-current{overflow:visible}.horizontal-content-container{overflow:hidden;background:#f3f3f3;padding:24px}@media (forced-colors: active){.horizontal-content-container{outline:solid 1px}}.stepper-header-position-bottom .horizontal-content-container{padding:24px 24px 0}.vertical-content-container{display:grid;grid-template-rows:0fr;grid-template-columns:100%;margin-left:36px;border:0;position:relative}.stepper-animations-enabled .vertical-content-container{transition:grid-template-rows .5s cubic-bezier(.4,0,.2,1)}.vertical-content-container.vertical-content-container-active{grid-template-rows:1fr}.step:last-child .vertical-content-container{border:none}@media (forced-colors: active){.vertical-content-container{outline:solid 1px}}[dir=rtl] .vertical-content-container{margin-left:0;margin-right:36px}@supports not (grid-template-rows: 0fr){.vertical-content-container{height:0}.vertical-content-container.vertical-content-container-active{height:auto}}.stepper-vertical-line:before{content:\"\";position:absolute;left:0;border-left-width:1px;border-left-style:solid;border-left-color:#889392;top:-16px;bottom:-16px}[dir=rtl] .stepper-vertical-line:before{left:auto;right:0}.vertical-stepper-content{overflow:hidden;outline:0;visibility:hidden}.stepper-animations-enabled .vertical-stepper-content{transition:visibility .5s linear}.vertical-content-container-active>.vertical-stepper-content{visibility:visible}.vertical-content{padding:0 24px 24px}.mdc-step-header-pagination-before,.mdc-step-header-rtl .mdc-step-header-pagination-after{padding-left:4px}.mdc-step-header-pagination-before .mdc-step-header-pagination-chevron,.mdc-step-header-rtl .mdc-step-header-pagination-after .mdc-step-header-pagination-chevron{transform:rotate(-135deg)}.mdc-step-header-rtl .mdc-step-header-pagination-before,.mdc-step-header-pagination-after{padding-right:4px}.mdc-step-header-rtl .mdc-step-header-pagination-before .mdc-step-header-pagination-chevron,.mdc-step-header-pagination-after .mdc-step-header-pagination-chevron{transform:rotate(45deg)}.mdc-step-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:#201a1b}.mdc-step-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mdc-step-header-pagination-disabled .mdc-step-header-pagination-chevron{opacity:.4}.mdc-step-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}.mdc-step-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.animation-noopable .mdc-step-list{transition:none}.mdc-step-header{display:flex;overflow:hidden;position:relative;flex-shrink:0;padding-bottom:24px}.mdc-step-header-pagination{position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none;box-sizing:content-box;outline:0}.mdc-step-header-pagination::-moz-focus-inner{border:0}.mdc-step-header-pagination-controls-enabled .mdc-step-header-pagination{display:flex}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MDStepHeader, selector: "md-step-header", inputs: ["state", "label", "errorMessage", "iconOverrides", "index", "selected", "active", "optional", "disableRipple"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
6318
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDStepper, isStandalone: true, selector: "md-stepper, md-vertical-stepper, md-horizontal-stepper, [mdStepper]", inputs: { labelPosition: "labelPosition", headerPosition: "headerPosition", animationDuration: "animationDuration", disablePagination: "disablePagination" }, outputs: { animationDone: "animationDone" }, host: { attributes: { "role": "tablist" }, properties: { "class.stepper-horizontal": "orientation === \"horizontal\"", "class.stepper-vertical": "orientation === \"vertical\"", "class.stepper-label-position-end": "orientation === \"horizontal\" && labelPosition == \"end\"", "class.stepper-label-position-bottom": "orientation === \"horizontal\" && labelPosition == \"bottom\"", "class.stepper-header-position-bottom": "headerPosition === \"bottom\"", "class.mdc-step-header-pagination-controls-enabled": "_showPaginationControls", "class.stepper-animating": "_isAnimating()", "style.stepper-animation-duration": "_getAnimationDuration()", "attr.aria-orientation": "orientation" } }, providers: [{ provide: CdkStepper, useExisting: MDStepper }], queries: [{ propertyName: "footer", first: true, predicate: MDStepFooter, descendants: true, read: TemplateRef }, { propertyName: "_steps", predicate: MDStep, descendants: true }, { propertyName: "_icons", predicate: MDStepperIcon, descendants: true }], viewQueries: [{ propertyName: "_stepHeaderElRef", first: true, predicate: ["stepHeader"], descendants: true }, { propertyName: "_stepListContainer", first: true, predicate: ["stepListContainer"], descendants: true }, { propertyName: "_stepList", first: true, predicate: ["stepList"], descendants: true }, { propertyName: "_stepListInner", first: true, predicate: ["stepListInner"], descendants: true }, { propertyName: "_nextPaginator", first: true, predicate: ["nextPaginator"], descendants: true }, { propertyName: "_previousPaginator", first: true, predicate: ["previousPaginator"], descendants: true }, { propertyName: "_stepHeader", predicate: MDStepHeader, descendants: true }, { propertyName: "_animatedContainers", predicate: ["animatedContainer"], descendants: true }], exportAs: ["mdStepper", "mdVerticalStepper", "mdHorizontalStepper"], usesInheritance: true, ngImport: i0, template: "@if (_isServer) {\r\n <ng-content/>\r\n}\r\n\r\n@switch (orientation) {\r\n @case ('horizontal') {\r\n <div class=\"horizontal-stepper-wrapper\">\r\n \r\n <div class=\"mdc-step-header\" #stepHeader>\r\n <div class=\"mdc-step-header-pagination mdc-step-header-pagination-before\"\r\n #previousPaginator\r\n [class.mdc-step-header-pagination-disabled]=\"_disableScrollBefore\"\r\n (click)=\"_handlePaginatorClick('before')\"\r\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-step-header-pagination-chevron\"></div>\r\n </div>\r\n\r\n <div class=\"mdc-step-label-container\" #stepListContainer>\r\n <div class=\"mdc-step-list\" #stepList>\r\n <div class=\"horizontal-stepper-header-container\" #stepListInner>\r\n @for (step of steps; track step) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"stepTemplate\"\r\n [ngTemplateOutletContext]=\"{step}\"/>\r\n @if (!$last) {\r\n <div class=\"stepper-horizontal-line\"></div>\r\n }\r\n }\r\n </div> \r\n </div>\r\n </div>\r\n\r\n <div class=\"mdc-step-header-pagination mdc-step-header-pagination-after\"\r\n #nextPaginator\r\n [class.mdc-step-header-pagination-disabled]=\"_disableScrollAfter\"\r\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\r\n (click)=\"_handlePaginatorClick('after')\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-step-header-pagination-chevron\"></div>\r\n </div> \r\n </div>\r\n \r\n\r\n <div class=\"horizontal-content-container\">\r\n @for (step of steps; track step) {\r\n <div\r\n #animatedContainer\r\n class=\"horizontal-stepper-content\"\r\n role=\"tabpanel\"\r\n [id]=\"_getStepContentId($index)\"\r\n [attr.aria-labelledby]=\"_getStepLabelId($index)\"\r\n [class]=\"'horizontal-stepper-content-' + _getAnimationDirection($index)\"\r\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\r\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\r\n </div>\r\n }\r\n </div>\r\n </div>\r\n \r\n }\r\n\r\n @case ('vertical') {\r\n @for (step of steps; track step) {\r\n <div class=\"step\">\r\n <ng-container\r\n [ngTemplateOutlet]=\"stepTemplate\"\r\n [ngTemplateOutletContext]=\"{step}\"/>\r\n <div\r\n #animatedContainer\r\n class=\"vertical-content-container\"\r\n [class.stepper-vertical-line]=\"!$last\"\r\n [class.vertical-content-container-active]=\"selectedIndex === $index\"\r\n [attr.inert]=\"selectedIndex === $index ? null : ''\">\r\n <div class=\"vertical-stepper-content\"\r\n role=\"tabpanel\"\r\n [id]=\"_getStepContentId($index)\"\r\n [attr.aria-labelledby]=\"_getStepLabelId($index)\">\r\n <div class=\"vertical-content\">\r\n <ng-container [ngTemplateOutlet]=\"step.content\"/>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n}\r\n\r\n<ng-template let-step=\"step\" #stepTemplate>\r\n <md-step-header\r\n [class.horizontal-stepper-header]=\"orientation === 'horizontal'\"\r\n [class.vertical-stepper-header]=\"orientation === 'vertical'\"\r\n (click)=\"step.select()\"\r\n (keydown)=\"_onKeydown($event)\"\r\n [tabIndex]=\"_getFocusIndex() === step.index() ? 0 : -1\"\r\n [id]=\"_getStepLabelId(step.index())\"\r\n [attr.aria-posinset]=\"step.index() + 1\"\r\n [attr.aria-setsize]=\"steps.length\"\r\n [attr.aria-controls]=\"_getStepContentId(step.index())\"\r\n [attr.aria-selected]=\"step.isSelected()\"\r\n [attr.aria-label]=\"step.ariaLabel || null\"\r\n [attr.aria-labelledby]=\"(!step.ariaLabel && step.ariaLabelledby) ? step.ariaLabelledby : null\"\r\n [attr.aria-disabled]=\"step.isNavigable() ? null : true\"\r\n [index]=\"step.index()\"\r\n [state]=\"step.indicatorType()\"\r\n [label]=\"step.stepLabel || step.label\"\r\n [selected]=\"step.isSelected()\"\r\n [active]=\"step.isNavigable()\"\r\n [optional]=\"step.optional\"\r\n [errorMessage]=\"step.errorMessage\"\r\n [iconOverrides]=\"_iconOverrides\"\r\n [disableRipple]=\"disableRipple || !step.isNavigable()\"\r\n [color]=\"step.color || color\"/>\r\n</ng-template>\r\n\r\n\r\n<ng-container [ngTemplateOutlet]=\"footer\"></ng-container>", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.stepper-vertical,.stepper-horizontal{display:block;font-family:Montserrat;font-size:14px;color:#000}.horizontal-stepper-header-container{white-space:nowrap;display:flex;align-items:center}.stepper-label-position-bottom .horizontal-stepper-header-container{align-items:flex-start}.stepper-header-position-bottom .horizontal-stepper-header-container{order:1}.stepper-horizontal-line{border-top-width:1px;border-top-style:solid;flex:auto;height:0;margin:0 -16px;min-width:32px;border-top-color:#889392}.stepper-label-position-bottom .stepper-horizontal-line{margin:0;min-width:0;position:relative;top:36px}.stepper-label-position-bottom .horizontal-stepper-header:not(:first-child):before,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:not(:last-child):before,.stepper-label-position-bottom .horizontal-stepper-header:not(:last-child):after,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:not(:first-child):after{border-top-width:1px;border-top-style:solid;content:\"\";display:inline-block;height:0;position:absolute;width:calc(50% - 20px)}.horizontal-stepper-header{display:flex;overflow:hidden;align-items:center;padding:0 24px;height:48px}.horizontal-stepper-header .step-icon{position:relative;margin-right:8px;flex:none}[dir=rtl] .horizontal-stepper-header .step-icon{margin-right:0;margin-left:8px}.horizontal-stepper-header.step-header-empty-label .step-icon{margin:0}.stepper-label-position-bottom .horizontal-stepper-header{padding:24px}.stepper-label-position-bottom .horizontal-stepper-header:before,.stepper-label-position-bottom .horizontal-stepper-header:after{top:36px}.stepper-label-position-bottom .horizontal-stepper-header{box-sizing:border-box;flex-direction:column;height:auto}.stepper-label-position-bottom .horizontal-stepper-header:not(:last-child):after,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:not(:first-child):after{right:0}.stepper-label-position-bottom .horizontal-stepper-header:not(:first-child):before,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:not(:last-child):before{left:0}[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:last-child:before,[dir=rtl] .stepper-label-position-bottom .horizontal-stepper-header:first-child:after{display:none}.stepper-label-position-bottom .horizontal-stepper-header .step-icon{margin-right:0;margin-left:0}.stepper-label-position-bottom .horizontal-stepper-header .step-label{padding:16px 0 0;text-align:center;width:100%}.vertical-stepper-header{display:flex;align-items:center;height:24px;padding:24px}.vertical-stepper-header .step-icon{margin-right:12px}[dir=rtl] .vertical-stepper-header .step-icon{margin-right:0;margin-left:12px}.horizontal-stepper-wrapper{display:flex;flex-direction:column}.horizontal-stepper-content{visibility:hidden;overflow:hidden;outline:0;height:0}.stepper-animations-enabled .horizontal-stepper-content{transition:transform .5s cubic-bezier(.35,0,.25,1)}.horizontal-stepper-content.horizontal-stepper-content-previous{transform:translate3d(-100%,0,0)}.horizontal-stepper-content.horizontal-stepper-content-next{transform:translate3d(100%,0,0)}.horizontal-stepper-content.horizontal-stepper-content-current{visibility:visible;transform:none;height:auto}.stepper-horizontal:not(.stepper-animating) .horizontal-stepper-content.horizontal-stepper-content-current{overflow:visible}.horizontal-content-container{overflow:hidden;background:#f3f3f3;padding:24px}@media (forced-colors: active){.horizontal-content-container{outline:solid 1px}}.stepper-header-position-bottom .horizontal-content-container{padding:24px 24px 0}.vertical-content-container{display:grid;grid-template-rows:0fr;grid-template-columns:100%;margin-left:36px;border:0;position:relative}.stepper-animations-enabled .vertical-content-container{transition:grid-template-rows .5s cubic-bezier(.4,0,.2,1)}.vertical-content-container.vertical-content-container-active{grid-template-rows:1fr}.step:last-child .vertical-content-container{border:none}@media (forced-colors: active){.vertical-content-container{outline:solid 1px}}[dir=rtl] .vertical-content-container{margin-left:0;margin-right:36px}@supports not (grid-template-rows: 0fr){.vertical-content-container{height:0}.vertical-content-container.vertical-content-container-active{height:auto}}.stepper-vertical-line:before{content:\"\";position:absolute;left:0;border-left-width:1px;border-left-style:solid;border-left-color:#889392;top:-16px;bottom:-16px}[dir=rtl] .stepper-vertical-line:before{left:auto;right:0}.vertical-stepper-content{overflow:hidden;outline:0;visibility:hidden}.stepper-animations-enabled .vertical-stepper-content{transition:visibility .5s linear}.vertical-content-container-active>.vertical-stepper-content{visibility:visible}.vertical-content{padding:0 24px 24px}.mdc-step-header-pagination-before,.mdc-step-header-rtl .mdc-step-header-pagination-after{padding-left:4px}.mdc-step-header-pagination-before .mdc-step-header-pagination-chevron,.mdc-step-header-rtl .mdc-step-header-pagination-after .mdc-step-header-pagination-chevron{transform:rotate(-135deg)}.mdc-step-header-rtl .mdc-step-header-pagination-before,.mdc-step-header-pagination-after{padding-right:4px}.mdc-step-header-rtl .mdc-step-header-pagination-before .mdc-step-header-pagination-chevron,.mdc-step-header-pagination-after .mdc-step-header-pagination-chevron{transform:rotate(45deg)}.mdc-step-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:#201a1b}.mdc-step-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mdc-step-header-pagination-disabled .mdc-step-header-pagination-chevron{opacity:.4}.mdc-step-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1}.mdc-step-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.animation-noopable .mdc-step-list{transition:none}.mdc-step-header{display:flex;overflow:hidden;position:relative;flex-shrink:0;padding-bottom:24px}.mdc-step-header-pagination{position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none;box-sizing:content-box;outline:0}.mdc-step-header-pagination::-moz-focus-inner{border:0}.mdc-step-header-pagination-controls-enabled .mdc-step-header-pagination{display:flex}\n"], dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: MDStepHeader, selector: "md-step-header", inputs: ["state", "label", "errorMessage", "iconOverrides", "index", "selected", "active", "optional"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
6320
6319
|
}
|
|
6321
6320
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDStepper, decorators: [{
|
|
6322
6321
|
type: Component,
|
|
@@ -6525,7 +6524,7 @@ class PseudoCheckbox {
|
|
|
6525
6524
|
}, 1000);
|
|
6526
6525
|
}
|
|
6527
6526
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: PseudoCheckbox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6528
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: PseudoCheckbox, isStandalone: true, selector: "pseudo-checkbox", inputs: { state: "state", disabled: "disabled", appearance: "appearance" }, host: { properties: { "class.pseudo-checkbox-indeterminate": "state === \"indeterminate\"", "class.pseudo-checkbox-checked": "state === \"checked\"", "class.pseudo-checkbox-disabled": "disabled", "class.pseudo-checkbox-minimal": "appearance === \"minimal\"", "class.pseudo-checkbox-full": "appearance === \"full\"" }, classAttribute: "pseudo-checkbox" }, ngImport: i0, template: '', isInline: true, styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.pseudo-checkbox{border-radius:2px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);width:18px;height:18px}.pseudo-checkbox:after{position:absolute;opacity:0;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.pseudo-checkbox-disabled{cursor:default}.pseudo-checkbox-indeterminate:after{left:1px;opacity:1;border-radius:2px}.pseudo-checkbox-checked:after{left:1px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box}.pseudo-checkbox-full{border-color:#44474e;border-width:2px;border-style:solid}.pseudo-checkbox-full.pseudo-checkbox-disabled{border-color:color-mix(in srgb,#1a1b1f 38%,transparent);opacity:.38}.pseudo-checkbox-full.pseudo-checkbox-checked,.pseudo-checkbox-full.pseudo-checkbox-indeterminate{background-color:#
|
|
6527
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: PseudoCheckbox, isStandalone: true, selector: "pseudo-checkbox", inputs: { state: "state", disabled: "disabled", appearance: "appearance" }, host: { properties: { "class.pseudo-checkbox-indeterminate": "state === \"indeterminate\"", "class.pseudo-checkbox-checked": "state === \"checked\"", "class.pseudo-checkbox-disabled": "disabled", "class.pseudo-checkbox-minimal": "appearance === \"minimal\"", "class.pseudo-checkbox-full": "appearance === \"full\"" }, classAttribute: "pseudo-checkbox" }, ngImport: i0, template: '', isInline: true, styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.pseudo-checkbox{border-radius:2px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);width:18px;height:18px}.pseudo-checkbox:after{position:absolute;opacity:0;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.pseudo-checkbox-disabled{cursor:default}.pseudo-checkbox-indeterminate:after{left:1px;opacity:1;border-radius:2px}.pseudo-checkbox-checked:after{left:1px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box}.pseudo-checkbox-full{border-color:#44474e;border-width:2px;border-style:solid}.pseudo-checkbox-full.pseudo-checkbox-disabled{border-color:color-mix(in srgb,#1a1b1f 38%,transparent);opacity:.38}.pseudo-checkbox-full.pseudo-checkbox-checked,.pseudo-checkbox-full.pseudo-checkbox-indeterminate{background-color:#cf0106;border-color:transparent}.pseudo-checkbox-full.pseudo-checkbox-checked:after,.pseudo-checkbox-full.pseudo-checkbox-indeterminate:after{color:#fff}.pseudo-checkbox-full.pseudo-checkbox-checked.pseudo-checkbox-disabled,.pseudo-checkbox-full.pseudo-checkbox-indeterminate.pseudo-checkbox-disabled{background-color:#e0e3e2;opacity:.38}.pseudo-checkbox-full.pseudo-checkbox-checked.pseudo-checkbox-disabled:after,.pseudo-checkbox-full.pseudo-checkbox-indeterminate.pseudo-checkbox-disabled:after{color:#101414}.pseudo-checkbox-full.pseudo-checkbox-checked:after{width:10px;height:4px;transform-origin:center;inset:-2.8284271247px 0 0;margin:auto}.pseudo-checkbox-full.pseudo-checkbox-indeterminate:after{top:6px;width:12px}.pseudo-checkbox-minimal.pseudo-checkbox-checked:after{width:14px;height:6px;transform-origin:center;inset:-4.2426406871px 0 0;margin:auto}.pseudo-checkbox-minimal.pseudo-checkbox-checked:after{color:#cf0106}.mdc-option .pseudo-checkbox-minimal{margin-left:16px;flex-shrink:0}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
6529
6528
|
}
|
|
6530
6529
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: PseudoCheckbox, decorators: [{
|
|
6531
6530
|
type: Component,
|
|
@@ -6536,7 +6535,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
6536
6535
|
'[class.pseudo-checkbox-disabled]': 'disabled',
|
|
6537
6536
|
'[class.pseudo-checkbox-minimal]': 'appearance === "minimal"',
|
|
6538
6537
|
'[class.pseudo-checkbox-full]': 'appearance === "full"',
|
|
6539
|
-
}, standalone: true, styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.pseudo-checkbox{border-radius:2px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);width:18px;height:18px}.pseudo-checkbox:after{position:absolute;opacity:0;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.pseudo-checkbox-disabled{cursor:default}.pseudo-checkbox-indeterminate:after{left:1px;opacity:1;border-radius:2px}.pseudo-checkbox-checked:after{left:1px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box}.pseudo-checkbox-full{border-color:#44474e;border-width:2px;border-style:solid}.pseudo-checkbox-full.pseudo-checkbox-disabled{border-color:color-mix(in srgb,#1a1b1f 38%,transparent);opacity:.38}.pseudo-checkbox-full.pseudo-checkbox-checked,.pseudo-checkbox-full.pseudo-checkbox-indeterminate{background-color:#
|
|
6538
|
+
}, standalone: true, styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.pseudo-checkbox{border-radius:2px;cursor:pointer;display:inline-block;vertical-align:middle;box-sizing:border-box;position:relative;flex-shrink:0;transition:border-color 90ms cubic-bezier(0,0,.2,.1),background-color 90ms cubic-bezier(0,0,.2,.1);width:18px;height:18px}.pseudo-checkbox:after{position:absolute;opacity:0;content:\"\";border-bottom:2px solid currentColor;transition:opacity 90ms cubic-bezier(0,0,.2,.1)}.pseudo-checkbox-disabled{cursor:default}.pseudo-checkbox-indeterminate:after{left:1px;opacity:1;border-radius:2px}.pseudo-checkbox-checked:after{left:1px;border-left:2px solid currentColor;transform:rotate(-45deg);opacity:1;box-sizing:content-box}.pseudo-checkbox-full{border-color:#44474e;border-width:2px;border-style:solid}.pseudo-checkbox-full.pseudo-checkbox-disabled{border-color:color-mix(in srgb,#1a1b1f 38%,transparent);opacity:.38}.pseudo-checkbox-full.pseudo-checkbox-checked,.pseudo-checkbox-full.pseudo-checkbox-indeterminate{background-color:#cf0106;border-color:transparent}.pseudo-checkbox-full.pseudo-checkbox-checked:after,.pseudo-checkbox-full.pseudo-checkbox-indeterminate:after{color:#fff}.pseudo-checkbox-full.pseudo-checkbox-checked.pseudo-checkbox-disabled,.pseudo-checkbox-full.pseudo-checkbox-indeterminate.pseudo-checkbox-disabled{background-color:#e0e3e2;opacity:.38}.pseudo-checkbox-full.pseudo-checkbox-checked.pseudo-checkbox-disabled:after,.pseudo-checkbox-full.pseudo-checkbox-indeterminate.pseudo-checkbox-disabled:after{color:#101414}.pseudo-checkbox-full.pseudo-checkbox-checked:after{width:10px;height:4px;transform-origin:center;inset:-2.8284271247px 0 0;margin:auto}.pseudo-checkbox-full.pseudo-checkbox-indeterminate:after{top:6px;width:12px}.pseudo-checkbox-minimal.pseudo-checkbox-checked:after{width:14px;height:6px;transform-origin:center;inset:-4.2426406871px 0 0;margin:auto}.pseudo-checkbox-minimal.pseudo-checkbox-checked:after{color:#cf0106}.mdc-option .pseudo-checkbox-minimal{margin-left:16px;flex-shrink:0}\n"] }]
|
|
6540
6539
|
}], ctorParameters: () => [], propDecorators: { state: [{
|
|
6541
6540
|
type: Input
|
|
6542
6541
|
}], disabled: [{
|
|
@@ -6710,7 +6709,7 @@ class MDOption {
|
|
|
6710
6709
|
this.onSelectionChange.emit(new MDOptionSelectionChange(this, isUserInput));
|
|
6711
6710
|
}
|
|
6712
6711
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDOption, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
6713
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDOption, isStandalone: true, selector: "md-option", inputs: { value: "value", id: "id", disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { onSelectionChange: "onSelectionChange" }, host: { attributes: { "role": "option" }, listeners: { "click": "_selectViaInteraction()", "keydown": "_handleKeydown($event)" }, properties: { "class.mdc-list-item--selected": "selected", "class.mdc-option-multiple": "multiple", "class.mdc-option-active": "active", "class.mdc-list-item--disabled": "disabled", "id": "id", "attr.aria-selected": "selected", "attr.aria-disabled": "disabled.toString()" }, classAttribute: "mdc-option mdc-list-item" }, viewQueries: [{ propertyName: "_text", first: true, predicate: ["text"], descendants: true, static: true }], ngImport: i0, template: "@if (multiple) {\r\n<pseudo-checkbox\r\n class=\"mdc-option-pseudo-checkbox\"\r\n [disabled]=\"disabled\"\r\n [state]=\"selected ? 'checked' : 'unchecked'\"\r\n aria-hidden=\"true\"\r\n></pseudo-checkbox>\r\n}\r\n\r\n<ng-content select=\"icon\"></ng-content>\r\n\r\n<span class=\"mdc-list-item__primary-text\" #text><ng-content></ng-content></span>\r\n\r\n@if (!multiple && selected) {\r\n<pseudo-checkbox\r\n class=\"mdc-option-pseudo-checkbox\"\r\n [disabled]=\"disabled\"\r\n state=\"checked\"\r\n aria-hidden=\"true\"\r\n appearance=\"minimal\"\r\n></pseudo-checkbox>\r\n}", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-option{-webkit-user-select:none;user-select:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;min-height:
|
|
6712
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDOption, isStandalone: true, selector: "md-option", inputs: { value: "value", id: "id", disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { onSelectionChange: "onSelectionChange" }, host: { attributes: { "role": "option" }, listeners: { "click": "_selectViaInteraction()", "keydown": "_handleKeydown($event)" }, properties: { "class.mdc-list-item--selected": "selected", "class.mdc-option-multiple": "multiple", "class.mdc-option-active": "active", "class.mdc-list-item--disabled": "disabled", "id": "id", "attr.aria-selected": "selected", "attr.aria-disabled": "disabled.toString()" }, classAttribute: "mdc-option mdc-list-item" }, viewQueries: [{ propertyName: "_text", first: true, predicate: ["text"], descendants: true, static: true }], ngImport: i0, template: "@if (multiple) {\r\n<pseudo-checkbox\r\n class=\"mdc-option-pseudo-checkbox\"\r\n [disabled]=\"disabled\"\r\n [state]=\"selected ? 'checked' : 'unchecked'\"\r\n aria-hidden=\"true\"\r\n></pseudo-checkbox>\r\n}\r\n\r\n<ng-content select=\"icon\"></ng-content>\r\n\r\n<span class=\"mdc-list-item__primary-text\" #text><ng-content></ng-content></span>\r\n\r\n@if (!multiple && selected) {\r\n<pseudo-checkbox\r\n class=\"mdc-option-pseudo-checkbox\"\r\n [disabled]=\"disabled\"\r\n state=\"checked\"\r\n aria-hidden=\"true\"\r\n appearance=\"minimal\"\r\n></pseudo-checkbox>\r\n}", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-option{-webkit-user-select:none;user-select:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;min-height:28px;padding:0 16px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);color:#000;font-family:Montserrat;font-weight:400;font-size:13px;line-height:20px;letter-spacing:.006rem}.mdc-option .pseudo-checkbox-full{margin-right:16px;flex-shrink:0}.mdc-option .pseudo-checkbox-minimal{margin-left:16px;flex-shrink:0}.mdc-option.mdc-list-item{align-items:center;background:#0000}.mdc-option.mdc-option-active.mdc-list-item{background-color:color-mix(in srgb,#1a1b1f 8%,transparent);outline:0}.mdc-option .mdc-list-item__primary-text{white-space:normal;font-size:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;font-family:inherit;text-decoration:inherit;text-transform:inherit;margin-right:auto}.mdc-option:hover:not(.mdc-list-item--disabled){background-color:color-mix(in srgb,#1a1b1f 8%,transparent);color:#cf0106}.mdc-list-item.mdc-list-item--disabled .mdc-list-item__primary-text{color:#929292}\n"], dependencies: [{ kind: "component", type: PseudoCheckbox, selector: "pseudo-checkbox", inputs: ["state", "disabled", "appearance"] }], encapsulation: i0.ViewEncapsulation.None });
|
|
6714
6713
|
}
|
|
6715
6714
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDOption, decorators: [{
|
|
6716
6715
|
type: Component,
|
|
@@ -6726,7 +6725,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
6726
6725
|
'(click)': '_selectViaInteraction()',
|
|
6727
6726
|
'(keydown)': '_handleKeydown($event)',
|
|
6728
6727
|
class: 'mdc-option mdc-list-item',
|
|
6729
|
-
}, standalone: true, imports: [PseudoCheckbox], template: "@if (multiple) {\r\n<pseudo-checkbox\r\n class=\"mdc-option-pseudo-checkbox\"\r\n [disabled]=\"disabled\"\r\n [state]=\"selected ? 'checked' : 'unchecked'\"\r\n aria-hidden=\"true\"\r\n></pseudo-checkbox>\r\n}\r\n\r\n<ng-content select=\"icon\"></ng-content>\r\n\r\n<span class=\"mdc-list-item__primary-text\" #text><ng-content></ng-content></span>\r\n\r\n@if (!multiple && selected) {\r\n<pseudo-checkbox\r\n class=\"mdc-option-pseudo-checkbox\"\r\n [disabled]=\"disabled\"\r\n state=\"checked\"\r\n aria-hidden=\"true\"\r\n appearance=\"minimal\"\r\n></pseudo-checkbox>\r\n}", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-option{-webkit-user-select:none;user-select:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;min-height:
|
|
6728
|
+
}, standalone: true, imports: [PseudoCheckbox], template: "@if (multiple) {\r\n<pseudo-checkbox\r\n class=\"mdc-option-pseudo-checkbox\"\r\n [disabled]=\"disabled\"\r\n [state]=\"selected ? 'checked' : 'unchecked'\"\r\n aria-hidden=\"true\"\r\n></pseudo-checkbox>\r\n}\r\n\r\n<ng-content select=\"icon\"></ng-content>\r\n\r\n<span class=\"mdc-list-item__primary-text\" #text><ng-content></ng-content></span>\r\n\r\n@if (!multiple && selected) {\r\n<pseudo-checkbox\r\n class=\"mdc-option-pseudo-checkbox\"\r\n [disabled]=\"disabled\"\r\n state=\"checked\"\r\n aria-hidden=\"true\"\r\n appearance=\"minimal\"\r\n></pseudo-checkbox>\r\n}", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-option{-webkit-user-select:none;user-select:none;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;display:flex;position:relative;align-items:center;justify-content:flex-start;overflow:hidden;min-height:28px;padding:0 16px;cursor:pointer;-webkit-tap-highlight-color:rgba(0,0,0,0);color:#000;font-family:Montserrat;font-weight:400;font-size:13px;line-height:20px;letter-spacing:.006rem}.mdc-option .pseudo-checkbox-full{margin-right:16px;flex-shrink:0}.mdc-option .pseudo-checkbox-minimal{margin-left:16px;flex-shrink:0}.mdc-option.mdc-list-item{align-items:center;background:#0000}.mdc-option.mdc-option-active.mdc-list-item{background-color:color-mix(in srgb,#1a1b1f 8%,transparent);outline:0}.mdc-option .mdc-list-item__primary-text{white-space:normal;font-size:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;font-family:inherit;text-decoration:inherit;text-transform:inherit;margin-right:auto}.mdc-option:hover:not(.mdc-list-item--disabled){background-color:color-mix(in srgb,#1a1b1f 8%,transparent);color:#cf0106}.mdc-list-item.mdc-list-item--disabled .mdc-list-item__primary-text{color:#929292}\n"] }]
|
|
6730
6729
|
}], ctorParameters: () => [], propDecorators: { value: [{
|
|
6731
6730
|
type: Input
|
|
6732
6731
|
}], id: [{
|
|
@@ -7126,7 +7125,8 @@ class MDSelect {
|
|
|
7126
7125
|
const isArrowKey = keyCode === DOWN_ARROW || keyCode === UP_ARROW || keyCode === LEFT_ARROW || keyCode === RIGHT_ARROW;
|
|
7127
7126
|
const isOpenKey = keyCode === ENTER || keyCode === SPACE;
|
|
7128
7127
|
const manager = this._keyManager;
|
|
7129
|
-
if ((!manager.isTyping() && isOpenKey && !hasModifierKey(event)) ||
|
|
7128
|
+
if ((!manager.isTyping() && isOpenKey && !hasModifierKey(event)) ||
|
|
7129
|
+
((this.multiple || event.altKey) && isArrowKey)) {
|
|
7130
7130
|
event.preventDefault();
|
|
7131
7131
|
this.open();
|
|
7132
7132
|
}
|
|
@@ -7147,7 +7147,10 @@ class MDSelect {
|
|
|
7147
7147
|
event.preventDefault();
|
|
7148
7148
|
this.close();
|
|
7149
7149
|
}
|
|
7150
|
-
else if (!isTyping &&
|
|
7150
|
+
else if (!isTyping &&
|
|
7151
|
+
(keyCode === ENTER || keyCode === SPACE) &&
|
|
7152
|
+
manager.activeItem &&
|
|
7153
|
+
!hasModifierKey(event)) {
|
|
7151
7154
|
event.preventDefault();
|
|
7152
7155
|
manager.activeItem._selectViaInteraction();
|
|
7153
7156
|
}
|
|
@@ -7162,7 +7165,11 @@ class MDSelect {
|
|
|
7162
7165
|
else {
|
|
7163
7166
|
const previouslyFocusedIndex = manager.activeItemIndex;
|
|
7164
7167
|
manager.onKeydown(event);
|
|
7165
|
-
if (this._multiple &&
|
|
7168
|
+
if (this._multiple &&
|
|
7169
|
+
isArrowKey &&
|
|
7170
|
+
event.shiftKey &&
|
|
7171
|
+
manager.activeItem &&
|
|
7172
|
+
manager.activeItemIndex !== previouslyFocusedIndex) {
|
|
7166
7173
|
manager.activeItem._selectViaInteraction();
|
|
7167
7174
|
}
|
|
7168
7175
|
}
|
|
@@ -7215,7 +7222,7 @@ class MDSelect {
|
|
|
7215
7222
|
if (this._selectionModel.isSelected(option))
|
|
7216
7223
|
return false;
|
|
7217
7224
|
try {
|
|
7218
|
-
return (option.value != null || this.canSelectNullableOptions) && this._compareWith(option.value, value);
|
|
7225
|
+
return ((option.value != null || this.canSelectNullableOptions) && this._compareWith(option.value, value));
|
|
7219
7226
|
}
|
|
7220
7227
|
catch (error) {
|
|
7221
7228
|
if (typeof ngDevMode === 'undefined' || ngDevMode)
|
|
@@ -7394,7 +7401,7 @@ class MDSelect {
|
|
|
7394
7401
|
}
|
|
7395
7402
|
}
|
|
7396
7403
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDSelect, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
7397
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDSelect, isStandalone: true, selector: "md-select", inputs: { panelClass: "panelClass", disabled: ["disabled", "disabled", booleanAttribute], multiple: ["multiple", "multiple", booleanAttribute], value: "value", tabIndex: ["tabIndex", "tabIndex", (value) => (value == null ? 0 : numberAttribute(value))], required: ["required", "required", booleanAttribute], compareWith: "compareWith", placeholder: "placeholder", canSelectNullableOptions: ["canSelectNullableOptions", "canSelectNullableOptions", booleanAttribute], sortComparator: "sortComparator" }, outputs: { valueChange: "valueChange", selectionChange: "selectionChange", openedChange: "openedChange", _openedStream: "opened", _closedStream: "closed" }, host: { attributes: { "role": "combobox", "aria-haspopup": "listbox" }, listeners: { "keydown": "_handleKeydown($event)", "focus": "_onFocus()", "blur": "_onBlur()", "click": "onContainerClick()" }, properties: { "attr.
|
|
7404
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDSelect, isStandalone: true, selector: "md-select", inputs: { panelClass: "panelClass", disabled: ["disabled", "disabled", booleanAttribute], multiple: ["multiple", "multiple", booleanAttribute], value: "value", tabIndex: ["tabIndex", "tabIndex", (value) => (value == null ? 0 : numberAttribute(value))], required: ["required", "required", booleanAttribute], compareWith: "compareWith", placeholder: "placeholder", canSelectNullableOptions: ["canSelectNullableOptions", "canSelectNullableOptions", booleanAttribute], sortComparator: "sortComparator" }, outputs: { valueChange: "valueChange", selectionChange: "selectionChange", openedChange: "openedChange", _openedStream: "opened", _closedStream: "closed" }, host: { attributes: { "role": "combobox", "aria-haspopup": "listbox" }, listeners: { "keydown": "_handleKeydown($event)", "focus": "_onFocus()", "blur": "_onBlur()", "click": "onContainerClick()" }, properties: { "attr.tabindex": "disabled ? -1 : tabIndex", "attr.aria-expanded": "panelOpen", "attr.aria-required": "required.toString()", "attr.aria-disabled": "disabled.toString()", "attr.aria-activedescendant": "_getAriaActiveDescendant()", "class.mdc-select-disabled": "disabled", "class.mdc-select-required": "required", "class.mdc-select-empty": "empty", "class.mdc-select-multiple": "multiple" }, classAttribute: "mdc-select" }, queries: [{ propertyName: "customTrigger", first: true, predicate: MD_SELECT_TRIGGER, descendants: true }, { propertyName: "options", predicate: MDOption, descendants: true }, { propertyName: "optionGroups", predicate: MDOptionGroup, descendants: true }], viewQueries: [{ propertyName: "trigger", first: true, predicate: ["trigger"], descendants: true }, { propertyName: "panel", first: true, predicate: ["panel"], descendants: true }, { propertyName: "_overlayDir", first: true, predicate: CdkConnectedOverlay, descendants: true }], usesOnChanges: true, ngImport: i0, template: "<div cdk-overlay-origin\r\n class=\"mdc-select-trigger\"\r\n (click)=\"open()\"\r\n #fallbackOverlayOrigin=\"cdkOverlayOrigin\"\r\n #trigger>\r\n\r\n <div class=\"mdc-select-value\" [attr.id]=\"_valueId\">\r\n @if (empty) {\r\n <span class=\"mdc-select-placeholder mdc-select-min-line\">{{placeholder}}</span>\r\n } @else {\r\n <span class=\"mdc-select-value-text\">\r\n @if (customTrigger) {\r\n <ng-content select=\"md-select-trigger\"></ng-content>\r\n } @else {\r\n <span class=\"mdc-select-min-line\">{{triggerValue}}</span>\r\n }\r\n </span>\r\n }\r\n </div>\r\n\r\n <div class=\"mdc-select-arrow-wrapper\">\r\n <div class=\"mdc-select-arrow\">\r\n <i class=\"icon-arrow-dropdown\"></i>\r\n </div>\r\n </div>\r\n</div>\r\n<ng-template\r\n cdk-connected-overlay\r\n cdkConnectedOverlayLockPosition\r\n cdkConnectedOverlayHasBackdrop\r\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\r\n [cdkConnectedOverlayDisableClose]=\"true\"\r\n [cdkConnectedOverlayScrollStrategy]=\"_scrollStrategy\"\r\n [cdkConnectedOverlayOrigin]=\"fallbackOverlayOrigin\"\r\n [cdkConnectedOverlayPositions]=\"_positions\"\r\n [cdkConnectedOverlayWidth]=\"_overlayWidth\"\r\n [cdkConnectedOverlayFlexibleDimensions]=\"true\"\r\n (detach)=\"close()\"\r\n (backdropClick)=\"close()\"\r\n (overlayKeydown)=\"_handleOverlayKeydown($event)\"\r\n>\r\n <div\r\n #panel\r\n role=\"listbox\"\r\n tabindex=\"-1\"\r\n class=\"mdc-select-panel mdc-menu-surface select-panel-animations-enabled mdc-menu-surface--open\"\r\n [attr.id]=\"id + '-panel'\"\r\n [attr.aria-multiselectable]=\"multiple\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [ngClass]=\"panelClass\"\r\n (keydown)=\"_handleKeydown($event)\">\r\n <ng-content></ng-content>\r\n </div>\r\n</ng-template>", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-select{display:inline-block}@keyframes select-enter{0%{opacity:0;transform:scaleY(.8)}to{opacity:1;transform:none}}@keyframes select-exit{0%{opacity:1}to{opacity:0}}.select-panel-animations-enabled{animation:select-enter .12s cubic-bezier(0,0,.2,1)}.select-panel-animations-enabled.select-panel-exit{animation:select-exit .2s linear}.mdc-select{width:180px;display:inline-block;outline:none;font-family:Open Sans;line-height:1.5rem;font-size:14px;font-weight:400;letter-spacing:.031rem;color:#373737}.mdc-select-trigger{display:inline-flex;align-items:center;cursor:pointer;position:relative;box-sizing:border-box;width:100%;height:36px;padding:0 12px;border:1px solid #F3F3F3;border-radius:5px;background-color:#fff}.mdc-select-value{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mdc-select-arrow-wrapper{height:24px;flex-shrink:0;display:inline-flex;align-items:center}div.mdc-select-panel{width:100%;max-height:275px;outline:0;overflow:auto;padding:4px;border-radius:5px;box-sizing:border-box;position:relative;background-color:#fff;box-shadow:0 1px 3px 1px #00000026}.mdc-select-disabled{color:color-mix(in srgb,#e0e3e2 38%,transparent);background-color:color-mix(in srgb,#e0e3e2 4%,transparent);pointer-events:none}.mdc-select-arrow svg{fill:currentColor;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mdc-select-arrow{display:flex;width:22px;height:22px;font-size:22px;position:relative;color:#929292}.mdc-select-placeholder{color:#929292}\n"], dependencies: [{ kind: "directive", type: CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "directive", type: CdkConnectedOverlay, selector: "[cdk-connected-overlay], [connected-overlay], [cdkConnectedOverlay]", inputs: ["cdkConnectedOverlayOrigin", "cdkConnectedOverlayPositions", "cdkConnectedOverlayPositionStrategy", "cdkConnectedOverlayOffsetX", "cdkConnectedOverlayOffsetY", "cdkConnectedOverlayWidth", "cdkConnectedOverlayHeight", "cdkConnectedOverlayMinWidth", "cdkConnectedOverlayMinHeight", "cdkConnectedOverlayBackdropClass", "cdkConnectedOverlayPanelClass", "cdkConnectedOverlayViewportMargin", "cdkConnectedOverlayScrollStrategy", "cdkConnectedOverlayOpen", "cdkConnectedOverlayDisableClose", "cdkConnectedOverlayTransformOriginOn", "cdkConnectedOverlayHasBackdrop", "cdkConnectedOverlayLockPosition", "cdkConnectedOverlayFlexibleDimensions", "cdkConnectedOverlayGrowAfterOpen", "cdkConnectedOverlayPush", "cdkConnectedOverlayDisposeOnNavigation"], outputs: ["backdropClick", "positionChange", "attach", "detach", "overlayKeydown", "overlayOutsideClick"], exportAs: ["cdkConnectedOverlay"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
7398
7405
|
}
|
|
7399
7406
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDSelect, decorators: [{
|
|
7400
7407
|
type: Component,
|
|
@@ -7402,17 +7409,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
7402
7409
|
role: 'combobox',
|
|
7403
7410
|
'aria-haspopup': 'listbox',
|
|
7404
7411
|
class: 'mdc-select',
|
|
7405
|
-
'[attr.id]': 'id'
|
|
7412
|
+
/**'[attr.id]': 'id',*/
|
|
7406
7413
|
'[attr.tabindex]': 'disabled ? -1 : tabIndex',
|
|
7407
|
-
'[attr.aria-controls]': 'panelOpen ? id + "-panel" : null'
|
|
7414
|
+
/**'[attr.aria-controls]': 'panelOpen ? id + "-panel" : null',*/
|
|
7408
7415
|
'[attr.aria-expanded]': 'panelOpen',
|
|
7409
|
-
'[attr.aria-label]': 'ariaLabel || null'
|
|
7416
|
+
/**'[attr.aria-label]': 'ariaLabel || null',*/
|
|
7410
7417
|
'[attr.aria-required]': 'required.toString()',
|
|
7411
7418
|
'[attr.aria-disabled]': 'disabled.toString()',
|
|
7412
|
-
'[attr.aria-invalid]': 'errorState'
|
|
7419
|
+
/**'[attr.aria-invalid]': 'errorState',*/
|
|
7413
7420
|
'[attr.aria-activedescendant]': '_getAriaActiveDescendant()',
|
|
7414
7421
|
'[class.mdc-select-disabled]': 'disabled',
|
|
7415
|
-
'[class.mdc-select-invalid]': 'errorState'
|
|
7422
|
+
/** '[class.mdc-select-invalid]': 'errorState',*/
|
|
7416
7423
|
'[class.mdc-select-required]': 'required',
|
|
7417
7424
|
'[class.mdc-select-empty]': 'empty',
|
|
7418
7425
|
'[class.mdc-select-multiple]': 'multiple',
|
|
@@ -7420,7 +7427,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
7420
7427
|
'(focus)': '_onFocus()',
|
|
7421
7428
|
'(blur)': '_onBlur()',
|
|
7422
7429
|
'(click)': 'onContainerClick()',
|
|
7423
|
-
}, standalone: true, imports: [CdkOverlayOrigin, CdkConnectedOverlay, NgClass], template: "<div cdk-overlay-origin\r\n class=\"mdc-select-trigger\"\r\n (click)=\"open()\"\r\n #fallbackOverlayOrigin=\"cdkOverlayOrigin\"\r\n #trigger>\r\n\r\n <div class=\"mdc-select-value\" [attr.id]=\"_valueId\">\r\n @if (empty) {\r\n <span class=\"mdc-select-placeholder mdc-select-min-line\">{{placeholder}}</span>\r\n } @else {\r\n <span class=\"mdc-select-value-text\">\r\n @if (customTrigger) {\r\n <ng-content select=\"select-trigger\"></ng-content>\r\n } @else {\r\n <span class=\"mdc-select-min-line\">{{triggerValue}}</span>\r\n }\r\n </span>\r\n }\r\n </div>\r\n\r\n <div class=\"mdc-select-arrow-wrapper\">\r\n <div class=\"mdc-select-arrow\">\r\n <
|
|
7430
|
+
}, standalone: true, imports: [CdkOverlayOrigin, CdkConnectedOverlay, NgClass], template: "<div cdk-overlay-origin\r\n class=\"mdc-select-trigger\"\r\n (click)=\"open()\"\r\n #fallbackOverlayOrigin=\"cdkOverlayOrigin\"\r\n #trigger>\r\n\r\n <div class=\"mdc-select-value\" [attr.id]=\"_valueId\">\r\n @if (empty) {\r\n <span class=\"mdc-select-placeholder mdc-select-min-line\">{{placeholder}}</span>\r\n } @else {\r\n <span class=\"mdc-select-value-text\">\r\n @if (customTrigger) {\r\n <ng-content select=\"md-select-trigger\"></ng-content>\r\n } @else {\r\n <span class=\"mdc-select-min-line\">{{triggerValue}}</span>\r\n }\r\n </span>\r\n }\r\n </div>\r\n\r\n <div class=\"mdc-select-arrow-wrapper\">\r\n <div class=\"mdc-select-arrow\">\r\n <i class=\"icon-arrow-dropdown\"></i>\r\n </div>\r\n </div>\r\n</div>\r\n<ng-template\r\n cdk-connected-overlay\r\n cdkConnectedOverlayLockPosition\r\n cdkConnectedOverlayHasBackdrop\r\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\r\n [cdkConnectedOverlayDisableClose]=\"true\"\r\n [cdkConnectedOverlayScrollStrategy]=\"_scrollStrategy\"\r\n [cdkConnectedOverlayOrigin]=\"fallbackOverlayOrigin\"\r\n [cdkConnectedOverlayPositions]=\"_positions\"\r\n [cdkConnectedOverlayWidth]=\"_overlayWidth\"\r\n [cdkConnectedOverlayFlexibleDimensions]=\"true\"\r\n (detach)=\"close()\"\r\n (backdropClick)=\"close()\"\r\n (overlayKeydown)=\"_handleOverlayKeydown($event)\"\r\n>\r\n <div\r\n #panel\r\n role=\"listbox\"\r\n tabindex=\"-1\"\r\n class=\"mdc-select-panel mdc-menu-surface select-panel-animations-enabled mdc-menu-surface--open\"\r\n [attr.id]=\"id + '-panel'\"\r\n [attr.aria-multiselectable]=\"multiple\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [ngClass]=\"panelClass\"\r\n (keydown)=\"_handleKeydown($event)\">\r\n <ng-content></ng-content>\r\n </div>\r\n</ng-template>", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-select{display:inline-block}@keyframes select-enter{0%{opacity:0;transform:scaleY(.8)}to{opacity:1;transform:none}}@keyframes select-exit{0%{opacity:1}to{opacity:0}}.select-panel-animations-enabled{animation:select-enter .12s cubic-bezier(0,0,.2,1)}.select-panel-animations-enabled.select-panel-exit{animation:select-exit .2s linear}.mdc-select{width:180px;display:inline-block;outline:none;font-family:Open Sans;line-height:1.5rem;font-size:14px;font-weight:400;letter-spacing:.031rem;color:#373737}.mdc-select-trigger{display:inline-flex;align-items:center;cursor:pointer;position:relative;box-sizing:border-box;width:100%;height:36px;padding:0 12px;border:1px solid #F3F3F3;border-radius:5px;background-color:#fff}.mdc-select-value{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mdc-select-arrow-wrapper{height:24px;flex-shrink:0;display:inline-flex;align-items:center}div.mdc-select-panel{width:100%;max-height:275px;outline:0;overflow:auto;padding:4px;border-radius:5px;box-sizing:border-box;position:relative;background-color:#fff;box-shadow:0 1px 3px 1px #00000026}.mdc-select-disabled{color:color-mix(in srgb,#e0e3e2 38%,transparent);background-color:color-mix(in srgb,#e0e3e2 4%,transparent);pointer-events:none}.mdc-select-arrow svg{fill:currentColor;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.mdc-select-arrow{display:flex;width:22px;height:22px;font-size:22px;position:relative;color:#929292}.mdc-select-placeholder{color:#929292}\n"] }]
|
|
7424
7431
|
}], ctorParameters: () => [], propDecorators: { panelClass: [{
|
|
7425
7432
|
type: Input
|
|
7426
7433
|
}], disabled: [{
|
|
@@ -7482,14 +7489,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
7482
7489
|
/** Optional directive to project a custom trigger area for the select. */
|
|
7483
7490
|
class MDSelectTrigger {
|
|
7484
7491
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDSelectTrigger, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
7485
|
-
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: MDSelectTrigger, isStandalone:
|
|
7492
|
+
static ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "20.3.6", type: MDSelectTrigger, isStandalone: true, selector: "md-select-trigger", providers: [{ provide: MD_SELECT_TRIGGER, useExisting: MDSelectTrigger }], ngImport: i0 });
|
|
7486
7493
|
}
|
|
7487
7494
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDSelectTrigger, decorators: [{
|
|
7488
7495
|
type: Directive,
|
|
7489
7496
|
args: [{
|
|
7490
|
-
selector: 'select-trigger',
|
|
7497
|
+
selector: 'md-select-trigger',
|
|
7491
7498
|
providers: [{ provide: MD_SELECT_TRIGGER, useExisting: MDSelectTrigger }],
|
|
7492
|
-
standalone:
|
|
7499
|
+
standalone: true
|
|
7493
7500
|
}]
|
|
7494
7501
|
}] });
|
|
7495
7502
|
|
|
@@ -7551,14 +7558,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
7551
7558
|
|
|
7552
7559
|
class MDSelectModule {
|
|
7553
7560
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
7554
|
-
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.6", ngImport: i0, type: MDSelectModule, imports: [CommonModule, FormsModule, OverlayModule, MDOption, MDOptionGroup, MDSelect, PseudoCheckbox], exports: [MDOption, MDOptionGroup, MDSelect] });
|
|
7561
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.6", ngImport: i0, type: MDSelectModule, imports: [CommonModule, FormsModule, OverlayModule, MDOption, MDOptionGroup, MDSelect, MDSelectTrigger, PseudoCheckbox], exports: [MDOption, MDOptionGroup, MDSelect, MDSelectTrigger] });
|
|
7555
7562
|
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDSelectModule, imports: [CommonModule, FormsModule, OverlayModule] });
|
|
7556
7563
|
}
|
|
7557
7564
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDSelectModule, decorators: [{
|
|
7558
7565
|
type: NgModule,
|
|
7559
7566
|
args: [{
|
|
7560
|
-
imports: [CommonModule, FormsModule, OverlayModule, MDOption, MDOptionGroup, MDSelect, PseudoCheckbox],
|
|
7561
|
-
exports: [MDOption, MDOptionGroup, MDSelect],
|
|
7567
|
+
imports: [CommonModule, FormsModule, OverlayModule, MDOption, MDOptionGroup, MDSelect, MDSelectTrigger, PseudoCheckbox],
|
|
7568
|
+
exports: [MDOption, MDOptionGroup, MDSelect, MDSelectTrigger],
|
|
7562
7569
|
}]
|
|
7563
7570
|
}] });
|
|
7564
7571
|
|
|
@@ -7831,7 +7838,7 @@ class MDSwitch extends BaseEditableHolder {
|
|
|
7831
7838
|
useExisting: MDSwitch,
|
|
7832
7839
|
multi: true,
|
|
7833
7840
|
},
|
|
7834
|
-
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<input\r\n #input\r\n class=\"toggleswitch-input\"\r\n [checked]=\"checked()\"\r\n type=\"checkbox\"\r\n role=\"switch\"\r\n [attr.required]=\"required() ? '' : undefined\"\r\n [attr.disabled]=\"$disabled() ? '' : undefined\"\r\n [attr.aria-checked]=\"checked()\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n/>\r\n<div class=\"toggleswitch-slider\">\r\n <div class=\"toggleswitch-handle\"></div>\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-switch{display:inline-block;position:relative;width:40px;height:20px}.toggleswitch-input{cursor:pointer;appearance:none;position:absolute;top:0;inset-inline-start:0;width:100%;height:100%;padding:0;margin:0;opacity:0;z-index:1;outline:0 none;border-radius:10px}md-switch.toggleswitch-checked .toggleswitch-slider{background:#
|
|
7841
|
+
], viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<input\r\n #input\r\n class=\"toggleswitch-input\"\r\n [checked]=\"checked()\"\r\n type=\"checkbox\"\r\n role=\"switch\"\r\n [attr.required]=\"required() ? '' : undefined\"\r\n [attr.disabled]=\"$disabled() ? '' : undefined\"\r\n [attr.aria-checked]=\"checked()\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n/>\r\n<div class=\"toggleswitch-slider\">\r\n <div class=\"toggleswitch-handle\"></div>\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-switch{display:inline-block;position:relative;width:40px;height:20px}.toggleswitch-input{cursor:pointer;appearance:none;position:absolute;top:0;inset-inline-start:0;width:100%;height:100%;padding:0;margin:0;opacity:0;z-index:1;outline:0 none;border-radius:10px}md-switch.toggleswitch-checked .toggleswitch-slider{background:#cf0106;border-color:transparent}md-switch.toggleswitch-checked .toggleswitch-handle{inset-inline-start:calc(40px - 1.25rem);background:#fff;color:#cf0106}md-switch.disabled .toggleswitch-handle{background:#64748b}md-switch.disabled .toggleswitch-slider{background:#e2e8f0}.toggleswitch-slider{cursor:pointer;width:100%;height:100%;border-width:1px;border-style:solid;border-color:transparent;background:#cbd5e1;border-radius:10px;outline-color:transparent;box-shadow:0 0 #0000,0 0 #0000,0 1px 2px #1212170d;transition:background .2s,color .2s,border-color .2s,outline-color .2s,box-shadow .2s}.toggleswitch-handle{position:absolute;top:50%;background:#fff;color:#6d5cae;width:1rem;height:1rem;inset-inline-start:.25rem;margin-block-start:-.5rem;border-radius:10px;transition:background .2s,color .2s,inset-inline-start .2s,box-shadow .2s}md-switch:not(.disabled):has(.toggleswitch-input:focus-visible) .toggleswitch-slider{outline:1px solid #6d5cae;outline-offset:2px}\n"], encapsulation: i0.ViewEncapsulation.None });
|
|
7835
7842
|
}
|
|
7836
7843
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDSwitch, decorators: [{
|
|
7837
7844
|
type: Component,
|
|
@@ -7850,7 +7857,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
7850
7857
|
'[class.toggleswitch-checked]': 'checked()',
|
|
7851
7858
|
'[class.disabled]': '$disabled()',
|
|
7852
7859
|
'[class.invalid]': 'invalid()',
|
|
7853
|
-
}, template: "<input\r\n #input\r\n class=\"toggleswitch-input\"\r\n [checked]=\"checked()\"\r\n type=\"checkbox\"\r\n role=\"switch\"\r\n [attr.required]=\"required() ? '' : undefined\"\r\n [attr.disabled]=\"$disabled() ? '' : undefined\"\r\n [attr.aria-checked]=\"checked()\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n/>\r\n<div class=\"toggleswitch-slider\">\r\n <div class=\"toggleswitch-handle\"></div>\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-switch{display:inline-block;position:relative;width:40px;height:20px}.toggleswitch-input{cursor:pointer;appearance:none;position:absolute;top:0;inset-inline-start:0;width:100%;height:100%;padding:0;margin:0;opacity:0;z-index:1;outline:0 none;border-radius:10px}md-switch.toggleswitch-checked .toggleswitch-slider{background:#
|
|
7860
|
+
}, template: "<input\r\n #input\r\n class=\"toggleswitch-input\"\r\n [checked]=\"checked()\"\r\n type=\"checkbox\"\r\n role=\"switch\"\r\n [attr.required]=\"required() ? '' : undefined\"\r\n [attr.disabled]=\"$disabled() ? '' : undefined\"\r\n [attr.aria-checked]=\"checked()\"\r\n (focus)=\"onFocus()\"\r\n (blur)=\"onBlur()\"\r\n/>\r\n<div class=\"toggleswitch-slider\">\r\n <div class=\"toggleswitch-handle\"></div>\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}md-switch{display:inline-block;position:relative;width:40px;height:20px}.toggleswitch-input{cursor:pointer;appearance:none;position:absolute;top:0;inset-inline-start:0;width:100%;height:100%;padding:0;margin:0;opacity:0;z-index:1;outline:0 none;border-radius:10px}md-switch.toggleswitch-checked .toggleswitch-slider{background:#cf0106;border-color:transparent}md-switch.toggleswitch-checked .toggleswitch-handle{inset-inline-start:calc(40px - 1.25rem);background:#fff;color:#cf0106}md-switch.disabled .toggleswitch-handle{background:#64748b}md-switch.disabled .toggleswitch-slider{background:#e2e8f0}.toggleswitch-slider{cursor:pointer;width:100%;height:100%;border-width:1px;border-style:solid;border-color:transparent;background:#cbd5e1;border-radius:10px;outline-color:transparent;box-shadow:0 0 #0000,0 0 #0000,0 1px 2px #1212170d;transition:background .2s,color .2s,border-color .2s,outline-color .2s,box-shadow .2s}.toggleswitch-handle{position:absolute;top:50%;background:#fff;color:#6d5cae;width:1rem;height:1rem;inset-inline-start:.25rem;margin-block-start:-.5rem;border-radius:10px;transition:background .2s,color .2s,inset-inline-start .2s,box-shadow .2s}md-switch:not(.disabled):has(.toggleswitch-input:focus-visible) .toggleswitch-slider{outline:1px solid #6d5cae;outline-offset:2px}\n"] }]
|
|
7854
7861
|
}], ctorParameters: () => [], propDecorators: { id: [{
|
|
7855
7862
|
type: Input
|
|
7856
7863
|
}], tabindex: [{
|
|
@@ -8760,11 +8767,11 @@ class MDTab {
|
|
|
8760
8767
|
}
|
|
8761
8768
|
}
|
|
8762
8769
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDTab, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8763
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.6", type: MDTab, isStandalone: true, selector: "md-tab", inputs: { disabled: ["disabled", "disabled", booleanAttribute], textLabel: ["label", "textLabel"], ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], labelClass: "labelClass", bodyClass: "bodyClass", id: "id" }, queries: [{ propertyName: "_explicitContent", first: true, predicate: MDTabContent, descendants: true, read: TemplateRef, static: true }, { propertyName: "templateLabel", first: true, predicate: MDTabLabel, descendants: true }], viewQueries: [{ propertyName: "_implicitContent", first: true, predicate: TemplateRef, descendants: true, static: true }], usesOnChanges: true, ngImport: i0, template: "<ng-template><ng-content></ng-content></ng-template>", changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
8770
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.6", type: MDTab, isStandalone: true, selector: "md-tab", inputs: { disabled: ["disabled", "disabled", booleanAttribute], textLabel: ["label", "textLabel"], ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], labelClass: "labelClass", bodyClass: "bodyClass", id: "id" }, providers: [{ provide: MD_TAB, useExisting: MDTab }], queries: [{ propertyName: "_explicitContent", first: true, predicate: MDTabContent, descendants: true, read: TemplateRef, static: true }, { propertyName: "templateLabel", first: true, predicate: MDTabLabel, descendants: true }], viewQueries: [{ propertyName: "_implicitContent", first: true, predicate: TemplateRef, descendants: true, static: true }], exportAs: ["mdTab"], usesOnChanges: true, ngImport: i0, template: "<ng-template><ng-content></ng-content></ng-template>", changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
8764
8771
|
}
|
|
8765
8772
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDTab, decorators: [{
|
|
8766
8773
|
type: Component,
|
|
8767
|
-
args: [{ selector: 'md-tab', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, standalone: true, template: "<ng-template><ng-content></ng-content></ng-template>" }]
|
|
8774
|
+
args: [{ selector: 'md-tab', changeDetection: ChangeDetectionStrategy.Default, encapsulation: ViewEncapsulation.None, exportAs: 'mdTab', standalone: true, providers: [{ provide: MD_TAB, useExisting: MDTab }], template: "<ng-template><ng-content></ng-content></ng-template>" }]
|
|
8768
8775
|
}], ctorParameters: () => [], propDecorators: { disabled: [{
|
|
8769
8776
|
type: Input,
|
|
8770
8777
|
args: [{ transform: booleanAttribute }]
|
|
@@ -9055,7 +9062,7 @@ class MDTabHeader extends PaginatedTabHeader {
|
|
|
9055
9062
|
event.preventDefault();
|
|
9056
9063
|
}
|
|
9057
9064
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDTabHeader, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
9058
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: MDTabHeader, isStandalone: true, selector: "md-tab-header", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, host: { properties: { "class.mdc-tab-header-pagination-controls-enabled": "_showPaginationControls", "class.mdc-tab-header-rtl": "_getLayoutDirection() == 'rtl'" }, classAttribute: "mdc-tab-header" }, queries: [{ propertyName: "_items", predicate: MDTabLabelWrapper }], viewQueries: [{ propertyName: "_tabListContainer", first: true, predicate: ["tabListContainer"], descendants: true, static: true }, { propertyName: "_tabList", first: true, predicate: ["tabList"], descendants: true, static: true }, { propertyName: "_tabListInner", first: true, predicate: ["tabListInner"], descendants: true, static: true }, { propertyName: "_nextPaginator", first: true, predicate: ["nextPaginator"], descendants: true }, { propertyName: "_previousPaginator", first: true, predicate: ["previousPaginator"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\r\n<div class=\"mdc-tab-header-pagination mdc-tab-header-pagination-before\"\r\n #previousPaginator\r\n [class.mdc-tab-header-pagination-disabled]=\"_disableScrollBefore\"\r\n (click)=\"_handlePaginatorClick('before')\"\r\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-tab-header-pagination-chevron\"></div>\r\n</div>\r\n\r\n<div\r\n class=\"mdc-tab-label-container\"\r\n #tabListContainer\r\n (keydown)=\"_handleKeydown($event)\">\r\n <div\r\n #tabList\r\n class=\"mdc-tab-list\"\r\n role=\"tablist\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\r\n (cdkObserveContent)=\"_onContentChanges()\">\r\n <div class=\"mdc-tab-labels\" #tabListInner>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"mdc-tab-header-pagination mdc-tab-header-pagination-after\"\r\n #nextPaginator\r\n [class.mdc-tab-header-pagination-disabled]=\"_disableScrollAfter\"\r\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\r\n (click)=\"_handlePaginatorClick('after')\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-tab-header-pagination-chevron\"></div>\r\n</div>", styles: [".mdc-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mdc-tab-indicator .mdc-tab-indicator__content{transition-duration:.25s}.mdc-tab-header-pagination{position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none;box-sizing:content-box;outline:0}.mdc-tab-header-pagination::-moz-focus-inner{border:0}.mdc-tab-header-pagination-controls-enabled .mdc-tab-header-pagination{display:flex}.mdc-tab-header-pagination-before,.mdc-tab-header-rtl .mdc-tab-header-pagination-after{padding-left:4px}.mdc-tab-header-pagination-before .mdc-tab-header-pagination-chevron,.mdc-tab-header-rtl .mdc-tab-header-pagination-after .mdc-tab-header-pagination-chevron{transform:rotate(-135deg)}.mdc-tab-header-rtl .mdc-tab-header-pagination-before,.mdc-tab-header-pagination-after{padding-right:4px}.mdc-tab-header-rtl .mdc-tab-header-pagination-before .mdc-tab-header-pagination-chevron,.mdc-tab-header-pagination-after .mdc-tab-header-pagination-chevron{transform:rotate(45deg)}.mdc-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:#201a1b}.mdc-tab-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mdc-tab-header-pagination-disabled .mdc-tab-header-pagination-chevron{opacity:.4}.mdc-tab-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.animation-noopable .mdc-tab-list{transition:none}.mdc-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:#f3dde1}.mdc-tab-group-inverted-header .mdc-tab-label-container{border-bottom:none;border-top-style:solid;border-top-width:1px;border-top-color:#f3dde1}.mdc-tab-labels{display:flex;flex:1 0 auto}[align-tabs=center]>.mdc-tab-header .mdc-tab-labels{justify-content:center}[
|
|
9065
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.6", type: MDTabHeader, isStandalone: true, selector: "md-tab-header", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, host: { properties: { "class.mdc-tab-header-pagination-controls-enabled": "_showPaginationControls", "class.mdc-tab-header-rtl": "_getLayoutDirection() == 'rtl'" }, classAttribute: "mdc-tab-header" }, queries: [{ propertyName: "_items", predicate: MDTabLabelWrapper }], viewQueries: [{ propertyName: "_tabListContainer", first: true, predicate: ["tabListContainer"], descendants: true, static: true }, { propertyName: "_tabList", first: true, predicate: ["tabList"], descendants: true, static: true }, { propertyName: "_tabListInner", first: true, predicate: ["tabListInner"], descendants: true, static: true }, { propertyName: "_nextPaginator", first: true, predicate: ["nextPaginator"], descendants: true }, { propertyName: "_previousPaginator", first: true, predicate: ["previousPaginator"], descendants: true }], usesInheritance: true, ngImport: i0, template: "\r\n<div class=\"mdc-tab-header-pagination mdc-tab-header-pagination-before\"\r\n #previousPaginator\r\n [class.mdc-tab-header-pagination-disabled]=\"_disableScrollBefore\"\r\n (click)=\"_handlePaginatorClick('before')\"\r\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-tab-header-pagination-chevron\"></div>\r\n</div>\r\n\r\n<div\r\n class=\"mdc-tab-label-container\"\r\n #tabListContainer\r\n (keydown)=\"_handleKeydown($event)\">\r\n <div\r\n #tabList\r\n class=\"mdc-tab-list\"\r\n role=\"tablist\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\r\n (cdkObserveContent)=\"_onContentChanges()\">\r\n <div class=\"mdc-tab-labels\" #tabListInner>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"mdc-tab-header-pagination mdc-tab-header-pagination-after\"\r\n #nextPaginator\r\n [class.mdc-tab-header-pagination-disabled]=\"_disableScrollAfter\"\r\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\r\n (click)=\"_handlePaginatorClick('after')\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-tab-header-pagination-chevron\"></div>\r\n</div>", styles: [".mdc-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mdc-tab-indicator .mdc-tab-indicator__content{transition-duration:.25s}.mdc-tab-header-pagination{position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none;box-sizing:content-box;outline:0}.mdc-tab-header-pagination::-moz-focus-inner{border:0}.mdc-tab-header-pagination-controls-enabled .mdc-tab-header-pagination{display:flex}.mdc-tab-header-pagination-before,.mdc-tab-header-rtl .mdc-tab-header-pagination-after{padding-left:4px}.mdc-tab-header-pagination-before .mdc-tab-header-pagination-chevron,.mdc-tab-header-rtl .mdc-tab-header-pagination-after .mdc-tab-header-pagination-chevron{transform:rotate(-135deg)}.mdc-tab-header-rtl .mdc-tab-header-pagination-before,.mdc-tab-header-pagination-after{padding-right:4px}.mdc-tab-header-rtl .mdc-tab-header-pagination-before .mdc-tab-header-pagination-chevron,.mdc-tab-header-pagination-after .mdc-tab-header-pagination-chevron{transform:rotate(45deg)}.mdc-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:#201a1b}.mdc-tab-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mdc-tab-header-pagination-disabled .mdc-tab-header-pagination-chevron{opacity:.4}.mdc-tab-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.animation-noopable .mdc-tab-list{transition:none}.mdc-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:#f3dde1}.mdc-tab-group-inverted-header .mdc-tab-label-container{border-bottom:none;border-top-style:solid;border-top-width:1px;border-top-color:#f3dde1}.mdc-tab-labels{display:flex;flex:1 0 auto}[align-tabs=center]>.mdc-tab-header .mdc-tab-labels{justify-content:center}[align-tabs=end]>.mdc-tab-header .mdc-tab-labels{justify-content:flex-end}.cdk-drop-list .mdc-tab-labels,.mdc-tab-labels.cdk-drop-list{min-height:48px}.mdc-tab:before{margin:5px}@media (forced-colors: active){.mdc-tab[aria-disabled=true]{color:GrayText}}\n"], dependencies: [{ kind: "directive", type: CdkObserveContent, selector: "[cdkObserveContent]", inputs: ["cdkObserveContentDisabled", "debounce"], outputs: ["cdkObserveContent"], exportAs: ["cdkObserveContent"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
9059
9066
|
}
|
|
9060
9067
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDTabHeader, decorators: [{
|
|
9061
9068
|
type: Component,
|
|
@@ -9063,7 +9070,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
9063
9070
|
class: 'mdc-tab-header',
|
|
9064
9071
|
'[class.mdc-tab-header-pagination-controls-enabled]': '_showPaginationControls',
|
|
9065
9072
|
'[class.mdc-tab-header-rtl]': "_getLayoutDirection() == 'rtl'",
|
|
9066
|
-
}, imports: [CdkObserveContent], template: "\r\n<div class=\"mdc-tab-header-pagination mdc-tab-header-pagination-before\"\r\n #previousPaginator\r\n [class.mdc-tab-header-pagination-disabled]=\"_disableScrollBefore\"\r\n (click)=\"_handlePaginatorClick('before')\"\r\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-tab-header-pagination-chevron\"></div>\r\n</div>\r\n\r\n<div\r\n class=\"mdc-tab-label-container\"\r\n #tabListContainer\r\n (keydown)=\"_handleKeydown($event)\">\r\n <div\r\n #tabList\r\n class=\"mdc-tab-list\"\r\n role=\"tablist\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\r\n (cdkObserveContent)=\"_onContentChanges()\">\r\n <div class=\"mdc-tab-labels\" #tabListInner>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"mdc-tab-header-pagination mdc-tab-header-pagination-after\"\r\n #nextPaginator\r\n [class.mdc-tab-header-pagination-disabled]=\"_disableScrollAfter\"\r\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\r\n (click)=\"_handlePaginatorClick('after')\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-tab-header-pagination-chevron\"></div>\r\n</div>", styles: [".mdc-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mdc-tab-indicator .mdc-tab-indicator__content{transition-duration:.25s}.mdc-tab-header-pagination{position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none;box-sizing:content-box;outline:0}.mdc-tab-header-pagination::-moz-focus-inner{border:0}.mdc-tab-header-pagination-controls-enabled .mdc-tab-header-pagination{display:flex}.mdc-tab-header-pagination-before,.mdc-tab-header-rtl .mdc-tab-header-pagination-after{padding-left:4px}.mdc-tab-header-pagination-before .mdc-tab-header-pagination-chevron,.mdc-tab-header-rtl .mdc-tab-header-pagination-after .mdc-tab-header-pagination-chevron{transform:rotate(-135deg)}.mdc-tab-header-rtl .mdc-tab-header-pagination-before,.mdc-tab-header-pagination-after{padding-right:4px}.mdc-tab-header-rtl .mdc-tab-header-pagination-before .mdc-tab-header-pagination-chevron,.mdc-tab-header-pagination-after .mdc-tab-header-pagination-chevron{transform:rotate(45deg)}.mdc-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:#201a1b}.mdc-tab-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mdc-tab-header-pagination-disabled .mdc-tab-header-pagination-chevron{opacity:.4}.mdc-tab-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.animation-noopable .mdc-tab-list{transition:none}.mdc-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:#f3dde1}.mdc-tab-group-inverted-header .mdc-tab-label-container{border-bottom:none;border-top-style:solid;border-top-width:1px;border-top-color:#f3dde1}.mdc-tab-labels{display:flex;flex:1 0 auto}[align-tabs=center]>.mdc-tab-header .mdc-tab-labels{justify-content:center}[
|
|
9073
|
+
}, imports: [CdkObserveContent], template: "\r\n<div class=\"mdc-tab-header-pagination mdc-tab-header-pagination-before\"\r\n #previousPaginator\r\n [class.mdc-tab-header-pagination-disabled]=\"_disableScrollBefore\"\r\n (click)=\"_handlePaginatorClick('before')\"\r\n (mousedown)=\"_handlePaginatorPress('before', $event)\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-tab-header-pagination-chevron\"></div>\r\n</div>\r\n\r\n<div\r\n class=\"mdc-tab-label-container\"\r\n #tabListContainer\r\n (keydown)=\"_handleKeydown($event)\">\r\n <div\r\n #tabList\r\n class=\"mdc-tab-list\"\r\n role=\"tablist\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\r\n (cdkObserveContent)=\"_onContentChanges()\">\r\n <div class=\"mdc-tab-labels\" #tabListInner>\r\n <ng-content></ng-content>\r\n </div>\r\n </div>\r\n</div>\r\n\r\n<div class=\"mdc-tab-header-pagination mdc-tab-header-pagination-after\"\r\n #nextPaginator\r\n [class.mdc-tab-header-pagination-disabled]=\"_disableScrollAfter\"\r\n (mousedown)=\"_handlePaginatorPress('after', $event)\"\r\n (click)=\"_handlePaginatorClick('after')\"\r\n (touchend)=\"_stopInterval()\">\r\n <div class=\"mdc-tab-header-pagination-chevron\"></div>\r\n</div>", styles: [".mdc-tab-header{display:flex;overflow:hidden;position:relative;flex-shrink:0}.mdc-tab-indicator .mdc-tab-indicator__content{transition-duration:.25s}.mdc-tab-header-pagination{position:relative;display:none;justify-content:center;align-items:center;min-width:32px;cursor:pointer;z-index:2;-webkit-tap-highlight-color:transparent;touch-action:none;box-sizing:content-box;outline:0}.mdc-tab-header-pagination::-moz-focus-inner{border:0}.mdc-tab-header-pagination-controls-enabled .mdc-tab-header-pagination{display:flex}.mdc-tab-header-pagination-before,.mdc-tab-header-rtl .mdc-tab-header-pagination-after{padding-left:4px}.mdc-tab-header-pagination-before .mdc-tab-header-pagination-chevron,.mdc-tab-header-rtl .mdc-tab-header-pagination-after .mdc-tab-header-pagination-chevron{transform:rotate(-135deg)}.mdc-tab-header-rtl .mdc-tab-header-pagination-before,.mdc-tab-header-pagination-after{padding-right:4px}.mdc-tab-header-rtl .mdc-tab-header-pagination-before .mdc-tab-header-pagination-chevron,.mdc-tab-header-pagination-after .mdc-tab-header-pagination-chevron{transform:rotate(45deg)}.mdc-tab-header-pagination-chevron{border-style:solid;border-width:2px 2px 0 0;height:8px;width:8px;border-color:#201a1b}.mdc-tab-header-pagination-disabled{box-shadow:none;cursor:default;pointer-events:none}.mdc-tab-header-pagination-disabled .mdc-tab-header-pagination-chevron{opacity:.4}.mdc-tab-list{flex-grow:1;position:relative;transition:transform .5s cubic-bezier(.35,0,.25,1)}.animation-noopable .mdc-tab-list{transition:none}.mdc-tab-label-container{display:flex;flex-grow:1;overflow:hidden;z-index:1;border-bottom-style:solid;border-bottom-width:1px;border-bottom-color:#f3dde1}.mdc-tab-group-inverted-header .mdc-tab-label-container{border-bottom:none;border-top-style:solid;border-top-width:1px;border-top-color:#f3dde1}.mdc-tab-labels{display:flex;flex:1 0 auto}[align-tabs=center]>.mdc-tab-header .mdc-tab-labels{justify-content:center}[align-tabs=end]>.mdc-tab-header .mdc-tab-labels{justify-content:flex-end}.cdk-drop-list .mdc-tab-labels,.mdc-tab-labels.cdk-drop-list{min-height:48px}.mdc-tab:before{margin:5px}@media (forced-colors: active){.mdc-tab[aria-disabled=true]{color:GrayText}}\n"] }]
|
|
9067
9074
|
}], propDecorators: { _items: [{
|
|
9068
9075
|
type: ContentChildren,
|
|
9069
9076
|
args: [MDTabLabelWrapper, { descendants: false }]
|
|
@@ -9133,6 +9140,14 @@ class MDTabGroup {
|
|
|
9133
9140
|
// ---- Inputs ----
|
|
9134
9141
|
isLegacyMode = false;
|
|
9135
9142
|
hideInkBar;
|
|
9143
|
+
legacySize = 'medium';
|
|
9144
|
+
get legacySizeClass() {
|
|
9145
|
+
return `legacy-${this.legacySize}`;
|
|
9146
|
+
}
|
|
9147
|
+
c(val) {
|
|
9148
|
+
console.log(val);
|
|
9149
|
+
return val;
|
|
9150
|
+
}
|
|
9136
9151
|
/**
|
|
9137
9152
|
* Fit ink bar width to the text content of the label rather than the full tab.
|
|
9138
9153
|
* @default false
|
|
@@ -9172,6 +9187,7 @@ class MDTabGroup {
|
|
|
9172
9187
|
_selectedIndex = null;
|
|
9173
9188
|
/** Header position relative to body. @default 'above' */
|
|
9174
9189
|
headerPosition = 'above';
|
|
9190
|
+
animationDisabled = false;
|
|
9175
9191
|
/**
|
|
9176
9192
|
* Duration applied to transitions; accepts `'500ms'` or number (ms).
|
|
9177
9193
|
* Numbers are normalized to `"Xms"`.
|
|
@@ -9229,16 +9245,14 @@ class MDTabGroup {
|
|
|
9229
9245
|
defaultConfig && defaultConfig.animationDuration ? defaultConfig.animationDuration : '500ms';
|
|
9230
9246
|
this.disablePagination =
|
|
9231
9247
|
defaultConfig && defaultConfig.disablePagination != null ? defaultConfig.disablePagination : false;
|
|
9232
|
-
this.dynamicHeight =
|
|
9233
|
-
defaultConfig && defaultConfig.dynamicHeight != null ? defaultConfig.dynamicHeight : false;
|
|
9248
|
+
this.dynamicHeight = defaultConfig && defaultConfig.dynamicHeight != null ? defaultConfig.dynamicHeight : false;
|
|
9234
9249
|
if (defaultConfig?.contentTabIndex != null) {
|
|
9235
9250
|
this.contentTabIndex = defaultConfig.contentTabIndex;
|
|
9236
9251
|
}
|
|
9237
9252
|
this.preserveContent = !!defaultConfig?.preserveContent;
|
|
9238
9253
|
this.fitInkBarToContent =
|
|
9239
9254
|
defaultConfig && defaultConfig.fitInkBarToContent != null ? defaultConfig.fitInkBarToContent : false;
|
|
9240
|
-
this.stretchTabs =
|
|
9241
|
-
defaultConfig && defaultConfig.stretchTabs != null ? defaultConfig.stretchTabs : true;
|
|
9255
|
+
this.stretchTabs = defaultConfig && defaultConfig.stretchTabs != null ? defaultConfig.stretchTabs : true;
|
|
9242
9256
|
this.alignTabs = defaultConfig && defaultConfig.alignTabs != null ? defaultConfig.alignTabs : null;
|
|
9243
9257
|
}
|
|
9244
9258
|
// ---- Lifecycle ----
|
|
@@ -9424,15 +9438,15 @@ class MDTabGroup {
|
|
|
9424
9438
|
}
|
|
9425
9439
|
/** Disable animations when duration is explicitly zero. */
|
|
9426
9440
|
_animationsDisabled() {
|
|
9427
|
-
return this.animationDuration === '0' || this.animationDuration === '0ms';
|
|
9441
|
+
return this.animationDisabled || this.animationDuration === '0' || this.animationDuration === '0ms';
|
|
9428
9442
|
}
|
|
9429
9443
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDTabGroup, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9430
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDTabGroup, isStandalone: true, selector: "md-tab-group", inputs: { isLegacyMode: "isLegacyMode", hideInkBar: "hideInkBar", fitInkBarToContent: ["fitInkBarToContent", "fitInkBarToContent", booleanAttribute], stretchTabs: ["stretch-tabs", "stretchTabs", booleanAttribute], alignTabs: ["align-tabs", "alignTabs"], dynamicHeight: ["dynamicHeight", "dynamicHeight", booleanAttribute], selectedIndex: ["selectedIndex", "selectedIndex", numberAttribute], headerPosition: "headerPosition", animationDuration: "animationDuration", contentTabIndex: ["contentTabIndex", "contentTabIndex", numberAttribute], disablePagination: ["disablePagination", "disablePagination", booleanAttribute], disableRipple: ["disableRipple", "disableRipple", booleanAttribute], preserveContent: ["preserveContent", "preserveContent", booleanAttribute], ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { selectedIndexChange: "selectedIndexChange", focusChange: "focusChange", animationDone: "animationDone", selectedTabChange: "selectedTabChange" }, host: { properties: { "class": " (color || \"primary\")", "class.mdc-tab-group-dynamic-height": "dynamicHeight", "class.mdc-tab-group-inverted-header": "headerPosition === \"below\"", "class.mdc-tab-group-stretch-tabs": "stretchTabs", "attr.align-tabs": "alignTabs", "style.--tab-animation-duration": "animationDuration" }, classAttribute: "mdc-tab-group" }, providers: [
|
|
9444
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.6", type: MDTabGroup, isStandalone: true, selector: "md-tab-group", inputs: { isLegacyMode: "isLegacyMode", hideInkBar: "hideInkBar", legacySize: "legacySize", fitInkBarToContent: ["fitInkBarToContent", "fitInkBarToContent", booleanAttribute], stretchTabs: ["md-stretch-tabs", "stretchTabs", booleanAttribute], alignTabs: ["md-align-tabs", "alignTabs"], dynamicHeight: ["dynamicHeight", "dynamicHeight", booleanAttribute], selectedIndex: ["selectedIndex", "selectedIndex", numberAttribute], headerPosition: "headerPosition", animationDisabled: "animationDisabled", animationDuration: "animationDuration", contentTabIndex: ["contentTabIndex", "contentTabIndex", numberAttribute], disablePagination: ["disablePagination", "disablePagination", booleanAttribute], disableRipple: ["disableRipple", "disableRipple", booleanAttribute], preserveContent: ["preserveContent", "preserveContent", booleanAttribute], ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { selectedIndexChange: "selectedIndexChange", focusChange: "focusChange", animationDone: "animationDone", selectedTabChange: "selectedTabChange" }, host: { properties: { "class": " (color || \"primary\")", "class.mdc-tab-group-dynamic-height": "dynamicHeight", "class.mdc-tab-group-inverted-header": "headerPosition === \"below\"", "class.mdc-tab-group-stretch-tabs": "stretchTabs", "attr.align-tabs": "alignTabs", "style.--tab-animation-duration": "animationDuration" }, classAttribute: "mdc-tab-group" }, providers: [
|
|
9431
9445
|
{
|
|
9432
9446
|
provide: TAB_GROUP,
|
|
9433
9447
|
useExisting: MDTabGroup,
|
|
9434
9448
|
},
|
|
9435
|
-
], queries: [{ propertyName: "_allTabs", predicate: MDTab, descendants: true }], viewQueries: [{ propertyName: "_tabBodyWrapper", first: true, predicate: ["tabBodyWrapper"], descendants: true }, { propertyName: "_tabHeader", first: true, predicate: ["tabHeader"], descendants: true }, { propertyName: "_tabBodies", predicate: MDTabBody, descendants: true }], exportAs: ["mdTabGroup"], ngImport: i0, template: "<md-tab-header\r\n #tabHeader\r\n [ngClass]=\"{\r\n 'tabs-legacy': isLegacyMode\r\n }\"\r\n [hideInkBar]=\"hideInkBar\"\r\n [selectedIndex]=\"selectedIndex || 0\"\r\n [disablePagination]=\"disablePagination\"\r\n [aria-label]=\"ariaLabel\"\r\n [aria-labelledby]=\"ariaLabelledby\"\r\n (indexFocused)=\"_focusChanged($event)\"\r\n (selectFocusedIndex)=\"selectedIndex = $event\"\r\n>\r\n @for (tab of _tabs; track tab) {\r\n <div\r\n class=\"focus-indicator\"\r\n [ngClass]=\"{\r\n 'mdc-tab': !isLegacyMode,\r\n 'mdc-tab-legacy': isLegacyMode\r\n }\"\r\n #tabNode\r\n role=\"tab\"\r\n mdTabLabelWrapper\r\n cdkMonitorElementFocus\r\n [id]=\"_getTabLabelId(tab, $index)\"\r\n [attr.tabIndex]=\"_getTabIndex($index)\"\r\n [attr.aria-posinset]=\"$index + 1\"\r\n [attr.aria-setsize]=\"_tabs.length\"\r\n [attr.aria-controls]=\"_getTabContentId($index)\"\r\n [attr.aria-selected]=\"selectedIndex === $index\"\r\n [attr.aria-label]=\"tab.ariaLabel || null\"\r\n [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\r\n [class.mdc-tab--active]=\"selectedIndex === $index\"\r\n [class]=\"tab.labelClass\"\r\n [disabled]=\"tab.disabled\"\r\n [fitInkBarToContent]=\"fitInkBarToContent\"\r\n (click)=\"_handleClick(tab, tabHeader, $index)\"\r\n (cdkFocusChange)=\"_tabFocusChanged($event, $index)\"\r\n >\r\n <span class=\"mdc-tab__ripple\"></span>\r\n <span class=\"mdc-tab__content\">\r\n <span class=\"mdc-tab__text-label\">\r\n @if (tab.templateLabel) {\r\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\r\n } @else {{{tab.textLabel}}}\r\n </span>\r\n </span>\r\n </div>\r\n }\r\n</md-tab-header>\r\n\r\n@if (_isServer) {\r\n<ng-content />\r\n}\r\n\r\n<div class=\"mdc-tab-body-wrapper\" #tabBodyWrapper>\r\n @for (tab of _tabs; track tab;) {\r\n <md-tab-body\r\n role=\"tabpanel\"\r\n [id]=\"_getTabContentId($index)\"\r\n [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === $index) ? contentTabIndex : null\"\r\n [attr.aria-labelledby]=\"_getTabLabelId(tab, $index)\"\r\n [attr.aria-hidden]=\"selectedIndex !== $index\"\r\n [class]=\"tab.bodyClass\"\r\n [content]=\"tab.content!\"\r\n [position]=\"tab.position!\"\r\n [animationDuration]=\"animationDuration\"\r\n [preserveContent]=\"preserveContent\"\r\n (_onCentered)=\"_removeTabBodyWrapperHeight()\"\r\n (_onCentering)=\"_setTabBodyWrapperHeight($event)\"\r\n (_beforeCentering)=\"_bodyCentered($event)\"\r\n />\r\n }\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.mdc-tab{min-width:90px;padding:0 12px;display:flex;flex:1 0 auto;justify-content:center;box-sizing:border-box;border:none;outline:none;text-align:center;white-space:nowrap;cursor:pointer;z-index:1;touch-action:manipulation}.mdc-tab__content{display:flex;align-items:center;justify-content:center;height:inherit;pointer-events:none}.mdc-tab__text-label{transition:.15s color linear;display:inline-block;line-height:1;z-index:2}.mdc-tab--active .mdc-tab__text-label{transition-delay:.1s}._animation-noopable .mdc-tab__text-label{transition:none}.mdc-tab-indicator{display:flex;position:absolute;top:0;left:0;justify-content:center;width:100%;height:100%;pointer-events:none;z-index:1}.mdc-tab-indicator__content{transition:.25s transform cubic-bezier(.4,0,.2,1);transform-origin:left;opacity:0}.mdc-tab-indicator__content--underline{align-self:flex-end;box-sizing:border-box;width:100%;border-top-style:solid}.mdc-tab-indicator--active .mdc-tab-indicator__content{opacity:1}._animation-noopable .mdc-tab-indicator__content,.mdc-tab-indicator--no-transition .mdc-tab-indicator__content{transition:none}.mdc-tab{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;background:none;height:40px;font-family:Montserrat;font-size:1rem;letter-spacing:.006rem;line-height:1.25rem;font-weight:500}.mdc-tab-group.mdc-tab-group-stretch-tabs>.mdc-tab-header .mdc-tab{flex-grow:1}.mdc-tab.mdc-tab{flex-grow:0}.mdc-tab .mdc-tab-indicator__content--underline{border-color:#6d5cae;border-top-width:2px;border-radius:0}.mdc-tab:hover .mdc-tab__text-label{color:#201a1b}.mdc-tab:focus .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active .mdc-tab__ripple:before{background-color:#201a1b}.mdc-tab.mdc-tab--active:hover .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active:hover .mdc-tab-indicator__content--underline{border-color:#6d5cae}.mdc-tab.mdc-tab--active:focus .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active:focus .mdc-tab-indicator__content--underline{border-color:#6d5cae}.mdc-tab.mdc-tab-disabled{opacity:.4;pointer-events:none}.mdc-tab.mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mdc-tab .mdc-tab__ripple:before{content:\"\";display:block;position:absolute;inset:0;opacity:0;pointer-events:none;background-color:#201a1b}.mdc-tab .mdc-tab__text-label{color:#201a1b;display:inline-flex;align-items:center}.mdc-tab .mdc-tab__content{position:relative;pointer-events:auto}.mdc-tab:hover .mdc-tab__ripple:before{opacity:.04}.mdc-tab.cdk-program-focused .mdc-tab__ripple:before,.mdc-tab.cdk-keyboard-focused .mdc-tab__ripple:before{opacity:.12}.mdc-tab-group{display:flex;flex-direction:column;max-width:100%}.mdc-tab-group.tabs-with-background>.mdc-tab-header .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header .focus-indicator:before,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .focus-indicator:before{border-color:#201a1b}.mdc-tab-group.tabs-with-background>.mdc-tab-header .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .mdc-tab-header-pagination-chevron{color:transparent}.mdc-tab-group.mdc-tab-group-inverted-header{flex-direction:column-reverse}.mdc-tab-group.mdc-tab-group-inverted-header .mdc-tab-indicator__content--underline{align-self:flex-start}.mdc-tab-body-wrapper{position:relative;overflow:hidden;display:flex}.focus-indicator{position:relative}.tabs-legacy .mdc-tab-labels{gap:2px}.tabs-legacy .mdc-tab-label-container{border:0px}.mdc-tab-legacy{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;height:36px;padding:0 14px;font-family:Lato;font-size:14px;letter-spacing:0px;line-height:22px;font-weight:400;background-color:#4d4d4d;border-top-left-radius:5px;border-top-right-radius:5px;cursor:pointer;max-width:90px}.mdc-tab-group.mdc-tab-group-stretch-tabs>.mdc-tab-header .mdc-tab-legacy{flex-grow:1}.mdc-tab-legacy.mdc-tab{flex-grow:0}.mdc-tab-legacy .mdc-tab-indicator__content--underline{border-color:#6d5cae;border-top-width:2px;border-radius:0}.mdc-tab-legacy:hover:not(.mdc-tab--active){background-color:#373737}.mdc-tab-legacy:focus .mdc-tab__text-label{color:#fff}.mdc-tab-legacy.mdc-tab--active{background-color:#eaeaea}.mdc-tab-legacy.mdc-tab--active .mdc-tab__text-label{color:#000}.mdc-tab-legacy.mdc-tab--active .mdc-tab__ripple:before{background-color:#fff}.mdc-tab-legacy.mdc-tab-disabled{pointer-events:none}.mdc-tab-legacy.mdc-tab-disabled .mdc-tab__text-label{color:#bdbdbd}.mdc-tab-legacy.mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mdc-tab-legacy .mdc-tab__ripple:before{content:\"\";display:block;position:absolute;inset:0;opacity:0;pointer-events:none;background-color:#fff}.mdc-tab-legacy .mdc-tab__text-label{color:#fff;display:inline-flex;align-items:center;transition:none}.mdc-tab-legacy .mdc-tab__content{position:relative;pointer-events:auto}.mdc-tab-legacy:hover .mdc-tab__ripple:before{opacity:.04}.mdc-tab-legacy.cdk-program-focused .mdc-tab__ripple:before,.mdc-tab-legacy.cdk-keyboard-focused .mdc-tab__ripple:before{opacity:.12}\n"], dependencies: [{ kind: "component", type: MDTabHeader, selector: "md-tab-header", inputs: ["aria-label", "aria-labelledby"] }, { kind: "directive", type: MDTabLabelWrapper, selector: "[mdTabLabelWrapper]", inputs: ["disabled"] }, { kind: "directive", type: CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: MDTabBody, selector: "md-tab-body", inputs: ["content", "animationDuration", "preserveContent", "position"], outputs: ["_onCentering", "_beforeCentering", "_onCentered"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
9449
|
+
], queries: [{ propertyName: "_allTabs", predicate: MDTab, descendants: true }], viewQueries: [{ propertyName: "_tabBodyWrapper", first: true, predicate: ["tabBodyWrapper"], descendants: true }, { propertyName: "_tabHeader", first: true, predicate: ["tabHeader"], descendants: true }, { propertyName: "_tabBodies", predicate: MDTabBody, descendants: true }], exportAs: ["mdTabGroup"], ngImport: i0, template: "<md-tab-header\r\n #tabHeader\r\n [ngClass]=\"{\r\n 'tabs-legacy': isLegacyMode\r\n }\"\r\n class=\"{{ isLegacyMode ? 'legacy-' + legacySize : '' }}\"\r\n [class.no-animations]=\"_animationsDisabled()\"\r\n [hideInkBar]=\"hideInkBar\"\r\n [selectedIndex]=\"selectedIndex || 0\"\r\n [disablePagination]=\"disablePagination\"\r\n [aria-label]=\"ariaLabel\"\r\n [aria-labelledby]=\"ariaLabelledby\"\r\n (indexFocused)=\"_focusChanged($event)\"\r\n (selectFocusedIndex)=\"selectedIndex = $event\"\r\n>\r\n @for (tab of _tabs; track tab) {\r\n <div\r\n class=\"focus-indicator\"\r\n [ngClass]=\"{\r\n 'mdc-tab': !isLegacyMode,\r\n 'mdc-tab-legacy': isLegacyMode\r\n }\"\r\n #tabNode\r\n role=\"tab\"\r\n mdTabLabelWrapper\r\n cdkMonitorElementFocus\r\n [id]=\"_getTabLabelId(tab, $index)\"\r\n [attr.tabIndex]=\"_getTabIndex($index)\"\r\n [attr.aria-posinset]=\"$index + 1\"\r\n [attr.aria-setsize]=\"_tabs.length\"\r\n [attr.aria-controls]=\"_getTabContentId($index)\"\r\n [attr.aria-selected]=\"selectedIndex === $index\"\r\n [attr.aria-label]=\"tab.ariaLabel || null\"\r\n [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\r\n [class.mdc-tab--active]=\"selectedIndex === $index\"\r\n [class]=\"tab.labelClass\"\r\n [disabled]=\"tab.disabled\"\r\n [fitInkBarToContent]=\"fitInkBarToContent\"\r\n (click)=\"_handleClick(tab, tabHeader, $index)\"\r\n (cdkFocusChange)=\"_tabFocusChanged($event, $index)\"\r\n >\r\n <span class=\"mdc-tab__ripple\"></span>\r\n <span class=\"mdc-tab__content\">\r\n <span class=\"mdc-tab__text-label\">\r\n @if (tab.templateLabel) {\r\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\r\n } @else {{{tab.textLabel}}}\r\n </span>\r\n </span>\r\n </div>\r\n }\r\n</md-tab-header>\r\n\r\n@if (_isServer) {\r\n<ng-content />\r\n}\r\n\r\n<div class=\"mdc-tab-body-wrapper\" [class.no-animations]=\"_animationsDisabled()\" #tabBodyWrapper>\r\n @for (tab of _tabs; track tab;) {\r\n <md-tab-body\r\n role=\"tabpanel\"\r\n [id]=\"_getTabContentId($index)\"\r\n [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === $index) ? contentTabIndex : null\"\r\n [attr.aria-labelledby]=\"_getTabLabelId(tab, $index)\"\r\n [attr.aria-hidden]=\"selectedIndex !== $index\"\r\n [class]=\"tab.bodyClass\"\r\n [content]=\"tab.content!\"\r\n [position]=\"tab.position!\"\r\n [animationDuration]=\"animationDuration\"\r\n [preserveContent]=\"preserveContent\"\r\n (_onCentered)=\"_removeTabBodyWrapperHeight()\"\r\n (_onCentering)=\"_setTabBodyWrapperHeight($event)\"\r\n (_beforeCentering)=\"_bodyCentered($event)\"\r\n />\r\n }\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.mdc-tab{min-width:90px;padding:0 12px;display:flex;flex:1 0 auto;justify-content:center;box-sizing:border-box;border:none;outline:none;text-align:center;white-space:nowrap;cursor:pointer;z-index:1;touch-action:manipulation}.mdc-tab__content{display:flex;align-items:center;justify-content:center;height:inherit;pointer-events:none}.mdc-tab__text-label{transition:.15s color linear;display:inline-block;line-height:1;z-index:2}.mdc-tab--active .mdc-tab__text-label{transition-delay:.1s}._animation-noopable .mdc-tab__text-label{transition:none}.mdc-tab-indicator{display:flex;position:absolute;top:0;left:0;justify-content:center;width:100%;height:100%;pointer-events:none;z-index:1}.mdc-tab-indicator__content{transition:.25s transform cubic-bezier(.4,0,.2,1);transform-origin:left;opacity:0}.no-animations .mdc-tab-indicator__content{transition:none!important;animation:none!important}.mdc-tab-indicator__content--underline{align-self:flex-end;box-sizing:border-box;width:100%;border-top-style:solid}.mdc-tab-indicator--active .mdc-tab-indicator__content{opacity:1}._animation-noopable .mdc-tab-indicator__content,.mdc-tab-indicator--no-transition .mdc-tab-indicator__content{transition:none}.mdc-tab{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;background:none;height:40px;font-family:Montserrat;font-size:1rem;letter-spacing:.006rem;line-height:1.25rem;font-weight:500}.mdc-tab-group.mdc-tab-group-stretch-tabs>.mdc-tab-header .mdc-tab{flex-grow:1}.mdc-tab.mdc-tab{flex-grow:0}.mdc-tab .mdc-tab-indicator__content--underline{border-color:#cf0106;border-top-width:2px;border-radius:0}.mdc-tab:hover .mdc-tab__text-label{color:#201a1b}.mdc-tab:focus .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active .mdc-tab__ripple:before{background-color:#201a1b}.mdc-tab.mdc-tab--active:hover .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active:hover .mdc-tab-indicator__content--underline{border-color:#cf0106}.mdc-tab.mdc-tab--active:focus .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active:focus .mdc-tab-indicator__content--underline{border-color:#cf0106}.mdc-tab.mdc-tab-disabled{opacity:.4;pointer-events:none}.mdc-tab.mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mdc-tab .mdc-tab__ripple:before{content:\"\";display:block;position:absolute;inset:0;opacity:0;pointer-events:none;background-color:#201a1b}.mdc-tab .mdc-tab__text-label{color:#201a1b;display:inline-flex;align-items:center}.mdc-tab .mdc-tab__content{position:relative;pointer-events:auto}.mdc-tab:hover .mdc-tab__ripple:before{opacity:.04}.mdc-tab.cdk-program-focused .mdc-tab__ripple:before,.mdc-tab.cdk-keyboard-focused .mdc-tab__ripple:before{opacity:.12}.mdc-tab-group{display:flex;flex-direction:column;max-width:100%}.mdc-tab-group.tabs-with-background>.mdc-tab-header .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header .focus-indicator:before,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .focus-indicator:before{border-color:#201a1b}.mdc-tab-group.tabs-with-background>.mdc-tab-header .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .mdc-tab-header-pagination-chevron{color:transparent}.mdc-tab-group.mdc-tab-group-inverted-header{flex-direction:column-reverse}.mdc-tab-group.mdc-tab-group-inverted-header .mdc-tab-indicator__content--underline{align-self:flex-start}.mdc-tab-body-wrapper{position:relative;overflow:hidden;display:flex}.mdc-tab-body-wrapper.no-animations .mdc-tab-body-content{transition:none!important;animation:none!important}.focus-indicator{position:relative}.tabs-legacy .mdc-tab-labels{gap:2px}.tabs-legacy .mdc-tab-label-container{border:0px}.mdc-tab-legacy{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;height:28px;padding:0 14px;font-family:Open Sans;font-size:13px;letter-spacing:0px;line-height:22px;font-weight:400;background-color:#4d4d4d;border-top-left-radius:5px;border-top-right-radius:5px;cursor:pointer;max-width:90px}.legacy-small .mdc-tab-legacy{height:28px;font-size:12px}.legacy-medium .mdc-tab-legacy{height:36px;font-size:14px}.legacy-large .mdc-tab-legacy{height:44px;font-size:16px}.mdc-tab-group.mdc-tab-group-stretch-tabs>.mdc-tab-header .mdc-tab-legacy{flex-grow:1}.mdc-tab-legacy.mdc-tab{flex-grow:0}.mdc-tab-legacy .mdc-tab-indicator__content--underline{border-color:#cf0106;border-top-width:2px;border-radius:0}.mdc-tab-legacy:hover:not(.mdc-tab--active){background-color:#373737}.mdc-tab-legacy:focus .mdc-tab__text-label{color:#fff}.mdc-tab-legacy.mdc-tab--active{background-color:#929292}.mdc-tab-legacy.mdc-tab--active .mdc-tab__text-label{color:#fff}.mdc-tab-legacy.mdc-tab--active .mdc-tab__ripple:before{background-color:#fff}.mdc-tab-legacy.mdc-tab-disabled{pointer-events:none}.mdc-tab-legacy.mdc-tab-disabled .mdc-tab__text-label{color:#bdbdbd}.mdc-tab-legacy.mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mdc-tab-legacy .mdc-tab__ripple:before{content:\"\";display:block;position:absolute;inset:0;opacity:0;pointer-events:none;background-color:#fff}.mdc-tab-legacy .mdc-tab__text-label{color:#fff;display:inline-flex;align-items:center;transition:none}.mdc-tab-legacy .mdc-tab__content{position:relative;pointer-events:auto}.mdc-tab-legacy:hover .mdc-tab__ripple:before{opacity:.04}.mdc-tab-legacy.cdk-program-focused .mdc-tab__ripple:before,.mdc-tab-legacy.cdk-keyboard-focused .mdc-tab__ripple:before{opacity:.12}\n"], dependencies: [{ kind: "component", type: MDTabHeader, selector: "md-tab-header", inputs: ["aria-label", "aria-labelledby"] }, { kind: "directive", type: MDTabLabelWrapper, selector: "[mdTabLabelWrapper]", inputs: ["disabled"] }, { kind: "directive", type: CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "directive", type: CdkPortalOutlet, selector: "[cdkPortalOutlet]", inputs: ["cdkPortalOutlet"], outputs: ["attached"], exportAs: ["cdkPortalOutlet"] }, { kind: "component", type: MDTabBody, selector: "md-tab-body", inputs: ["content", "animationDuration", "preserveContent", "position"], outputs: ["_onCentering", "_beforeCentering", "_onCentered"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], changeDetection: i0.ChangeDetectionStrategy.Default, encapsulation: i0.ViewEncapsulation.None });
|
|
9436
9450
|
}
|
|
9437
9451
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDTabGroup, decorators: [{
|
|
9438
9452
|
type: Component,
|
|
@@ -9449,7 +9463,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
9449
9463
|
'[class.mdc-tab-group-stretch-tabs]': 'stretchTabs',
|
|
9450
9464
|
'[attr.align-tabs]': 'alignTabs',
|
|
9451
9465
|
'[style.--tab-animation-duration]': 'animationDuration',
|
|
9452
|
-
}, imports: [MDTabHeader, MDTabLabelWrapper, CdkMonitorFocus, CdkPortalOutlet, MDTabBody, CommonModule], template: "<md-tab-header\r\n #tabHeader\r\n [ngClass]=\"{\r\n 'tabs-legacy': isLegacyMode\r\n }\"\r\n [hideInkBar]=\"hideInkBar\"\r\n [selectedIndex]=\"selectedIndex || 0\"\r\n [disablePagination]=\"disablePagination\"\r\n [aria-label]=\"ariaLabel\"\r\n [aria-labelledby]=\"ariaLabelledby\"\r\n (indexFocused)=\"_focusChanged($event)\"\r\n (selectFocusedIndex)=\"selectedIndex = $event\"\r\n>\r\n @for (tab of _tabs; track tab) {\r\n <div\r\n class=\"focus-indicator\"\r\n [ngClass]=\"{\r\n 'mdc-tab': !isLegacyMode,\r\n 'mdc-tab-legacy': isLegacyMode\r\n }\"\r\n #tabNode\r\n role=\"tab\"\r\n mdTabLabelWrapper\r\n cdkMonitorElementFocus\r\n [id]=\"_getTabLabelId(tab, $index)\"\r\n [attr.tabIndex]=\"_getTabIndex($index)\"\r\n [attr.aria-posinset]=\"$index + 1\"\r\n [attr.aria-setsize]=\"_tabs.length\"\r\n [attr.aria-controls]=\"_getTabContentId($index)\"\r\n [attr.aria-selected]=\"selectedIndex === $index\"\r\n [attr.aria-label]=\"tab.ariaLabel || null\"\r\n [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\r\n [class.mdc-tab--active]=\"selectedIndex === $index\"\r\n [class]=\"tab.labelClass\"\r\n [disabled]=\"tab.disabled\"\r\n [fitInkBarToContent]=\"fitInkBarToContent\"\r\n (click)=\"_handleClick(tab, tabHeader, $index)\"\r\n (cdkFocusChange)=\"_tabFocusChanged($event, $index)\"\r\n >\r\n <span class=\"mdc-tab__ripple\"></span>\r\n <span class=\"mdc-tab__content\">\r\n <span class=\"mdc-tab__text-label\">\r\n @if (tab.templateLabel) {\r\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\r\n } @else {{{tab.textLabel}}}\r\n </span>\r\n </span>\r\n </div>\r\n }\r\n</md-tab-header>\r\n\r\n@if (_isServer) {\r\n<ng-content />\r\n}\r\n\r\n<div class=\"mdc-tab-body-wrapper\" #tabBodyWrapper>\r\n @for (tab of _tabs; track tab;) {\r\n <md-tab-body\r\n role=\"tabpanel\"\r\n [id]=\"_getTabContentId($index)\"\r\n [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === $index) ? contentTabIndex : null\"\r\n [attr.aria-labelledby]=\"_getTabLabelId(tab, $index)\"\r\n [attr.aria-hidden]=\"selectedIndex !== $index\"\r\n [class]=\"tab.bodyClass\"\r\n [content]=\"tab.content!\"\r\n [position]=\"tab.position!\"\r\n [animationDuration]=\"animationDuration\"\r\n [preserveContent]=\"preserveContent\"\r\n (_onCentered)=\"_removeTabBodyWrapperHeight()\"\r\n (_onCentering)=\"_setTabBodyWrapperHeight($event)\"\r\n (_beforeCentering)=\"_bodyCentered($event)\"\r\n />\r\n }\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.mdc-tab{min-width:90px;padding:0 12px;display:flex;flex:1 0 auto;justify-content:center;box-sizing:border-box;border:none;outline:none;text-align:center;white-space:nowrap;cursor:pointer;z-index:1;touch-action:manipulation}.mdc-tab__content{display:flex;align-items:center;justify-content:center;height:inherit;pointer-events:none}.mdc-tab__text-label{transition:.15s color linear;display:inline-block;line-height:1;z-index:2}.mdc-tab--active .mdc-tab__text-label{transition-delay:.1s}._animation-noopable .mdc-tab__text-label{transition:none}.mdc-tab-indicator{display:flex;position:absolute;top:0;left:0;justify-content:center;width:100%;height:100%;pointer-events:none;z-index:1}.mdc-tab-indicator__content{transition:.25s transform cubic-bezier(.4,0,.2,1);transform-origin:left;opacity:0}.mdc-tab-indicator__content--underline{align-self:flex-end;box-sizing:border-box;width:100%;border-top-style:solid}.mdc-tab-indicator--active .mdc-tab-indicator__content{opacity:1}._animation-noopable .mdc-tab-indicator__content,.mdc-tab-indicator--no-transition .mdc-tab-indicator__content{transition:none}.mdc-tab{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;background:none;height:40px;font-family:Montserrat;font-size:1rem;letter-spacing:.006rem;line-height:1.25rem;font-weight:500}.mdc-tab-group.mdc-tab-group-stretch-tabs>.mdc-tab-header .mdc-tab{flex-grow:1}.mdc-tab.mdc-tab{flex-grow:0}.mdc-tab .mdc-tab-indicator__content--underline{border-color:#
|
|
9466
|
+
}, imports: [MDTabHeader, MDTabLabelWrapper, CdkMonitorFocus, CdkPortalOutlet, MDTabBody, CommonModule], template: "<md-tab-header\r\n #tabHeader\r\n [ngClass]=\"{\r\n 'tabs-legacy': isLegacyMode\r\n }\"\r\n class=\"{{ isLegacyMode ? 'legacy-' + legacySize : '' }}\"\r\n [class.no-animations]=\"_animationsDisabled()\"\r\n [hideInkBar]=\"hideInkBar\"\r\n [selectedIndex]=\"selectedIndex || 0\"\r\n [disablePagination]=\"disablePagination\"\r\n [aria-label]=\"ariaLabel\"\r\n [aria-labelledby]=\"ariaLabelledby\"\r\n (indexFocused)=\"_focusChanged($event)\"\r\n (selectFocusedIndex)=\"selectedIndex = $event\"\r\n>\r\n @for (tab of _tabs; track tab) {\r\n <div\r\n class=\"focus-indicator\"\r\n [ngClass]=\"{\r\n 'mdc-tab': !isLegacyMode,\r\n 'mdc-tab-legacy': isLegacyMode\r\n }\"\r\n #tabNode\r\n role=\"tab\"\r\n mdTabLabelWrapper\r\n cdkMonitorElementFocus\r\n [id]=\"_getTabLabelId(tab, $index)\"\r\n [attr.tabIndex]=\"_getTabIndex($index)\"\r\n [attr.aria-posinset]=\"$index + 1\"\r\n [attr.aria-setsize]=\"_tabs.length\"\r\n [attr.aria-controls]=\"_getTabContentId($index)\"\r\n [attr.aria-selected]=\"selectedIndex === $index\"\r\n [attr.aria-label]=\"tab.ariaLabel || null\"\r\n [attr.aria-labelledby]=\"(!tab.ariaLabel && tab.ariaLabelledby) ? tab.ariaLabelledby : null\"\r\n [class.mdc-tab--active]=\"selectedIndex === $index\"\r\n [class]=\"tab.labelClass\"\r\n [disabled]=\"tab.disabled\"\r\n [fitInkBarToContent]=\"fitInkBarToContent\"\r\n (click)=\"_handleClick(tab, tabHeader, $index)\"\r\n (cdkFocusChange)=\"_tabFocusChanged($event, $index)\"\r\n >\r\n <span class=\"mdc-tab__ripple\"></span>\r\n <span class=\"mdc-tab__content\">\r\n <span class=\"mdc-tab__text-label\">\r\n @if (tab.templateLabel) {\r\n <ng-template [cdkPortalOutlet]=\"tab.templateLabel\"></ng-template>\r\n } @else {{{tab.textLabel}}}\r\n </span>\r\n </span>\r\n </div>\r\n }\r\n</md-tab-header>\r\n\r\n@if (_isServer) {\r\n<ng-content />\r\n}\r\n\r\n<div class=\"mdc-tab-body-wrapper\" [class.no-animations]=\"_animationsDisabled()\" #tabBodyWrapper>\r\n @for (tab of _tabs; track tab;) {\r\n <md-tab-body\r\n role=\"tabpanel\"\r\n [id]=\"_getTabContentId($index)\"\r\n [attr.tabindex]=\"(contentTabIndex != null && selectedIndex === $index) ? contentTabIndex : null\"\r\n [attr.aria-labelledby]=\"_getTabLabelId(tab, $index)\"\r\n [attr.aria-hidden]=\"selectedIndex !== $index\"\r\n [class]=\"tab.bodyClass\"\r\n [content]=\"tab.content!\"\r\n [position]=\"tab.position!\"\r\n [animationDuration]=\"animationDuration\"\r\n [preserveContent]=\"preserveContent\"\r\n (_onCentered)=\"_removeTabBodyWrapperHeight()\"\r\n (_onCentering)=\"_setTabBodyWrapperHeight($event)\"\r\n (_beforeCentering)=\"_bodyCentered($event)\"\r\n />\r\n }\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.mdc-tab{min-width:90px;padding:0 12px;display:flex;flex:1 0 auto;justify-content:center;box-sizing:border-box;border:none;outline:none;text-align:center;white-space:nowrap;cursor:pointer;z-index:1;touch-action:manipulation}.mdc-tab__content{display:flex;align-items:center;justify-content:center;height:inherit;pointer-events:none}.mdc-tab__text-label{transition:.15s color linear;display:inline-block;line-height:1;z-index:2}.mdc-tab--active .mdc-tab__text-label{transition-delay:.1s}._animation-noopable .mdc-tab__text-label{transition:none}.mdc-tab-indicator{display:flex;position:absolute;top:0;left:0;justify-content:center;width:100%;height:100%;pointer-events:none;z-index:1}.mdc-tab-indicator__content{transition:.25s transform cubic-bezier(.4,0,.2,1);transform-origin:left;opacity:0}.no-animations .mdc-tab-indicator__content{transition:none!important;animation:none!important}.mdc-tab-indicator__content--underline{align-self:flex-end;box-sizing:border-box;width:100%;border-top-style:solid}.mdc-tab-indicator--active .mdc-tab-indicator__content{opacity:1}._animation-noopable .mdc-tab-indicator__content,.mdc-tab-indicator--no-transition .mdc-tab-indicator__content{transition:none}.mdc-tab{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;background:none;height:40px;font-family:Montserrat;font-size:1rem;letter-spacing:.006rem;line-height:1.25rem;font-weight:500}.mdc-tab-group.mdc-tab-group-stretch-tabs>.mdc-tab-header .mdc-tab{flex-grow:1}.mdc-tab.mdc-tab{flex-grow:0}.mdc-tab .mdc-tab-indicator__content--underline{border-color:#cf0106;border-top-width:2px;border-radius:0}.mdc-tab:hover .mdc-tab__text-label{color:#201a1b}.mdc-tab:focus .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active .mdc-tab__ripple:before{background-color:#201a1b}.mdc-tab.mdc-tab--active:hover .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active:hover .mdc-tab-indicator__content--underline{border-color:#cf0106}.mdc-tab.mdc-tab--active:focus .mdc-tab__text-label{color:#201a1b}.mdc-tab.mdc-tab--active:focus .mdc-tab-indicator__content--underline{border-color:#cf0106}.mdc-tab.mdc-tab-disabled{opacity:.4;pointer-events:none}.mdc-tab.mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mdc-tab .mdc-tab__ripple:before{content:\"\";display:block;position:absolute;inset:0;opacity:0;pointer-events:none;background-color:#201a1b}.mdc-tab .mdc-tab__text-label{color:#201a1b;display:inline-flex;align-items:center}.mdc-tab .mdc-tab__content{position:relative;pointer-events:auto}.mdc-tab:hover .mdc-tab__ripple:before{opacity:.04}.mdc-tab.cdk-program-focused .mdc-tab__ripple:before,.mdc-tab.cdk-keyboard-focused .mdc-tab__ripple:before{opacity:.12}.mdc-tab-group{display:flex;flex-direction:column;max-width:100%}.mdc-tab-group.tabs-with-background>.mdc-tab-header .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header .focus-indicator:before,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .focus-indicator:before{border-color:#201a1b}.mdc-tab-group.tabs-with-background>.mdc-tab-header .mdc-tab-header-pagination-chevron,.mdc-tab-group.tabs-with-background>.mdc-tab-header-pagination .mdc-tab-header-pagination-chevron{color:transparent}.mdc-tab-group.mdc-tab-group-inverted-header{flex-direction:column-reverse}.mdc-tab-group.mdc-tab-group-inverted-header .mdc-tab-indicator__content--underline{align-self:flex-start}.mdc-tab-body-wrapper{position:relative;overflow:hidden;display:flex}.mdc-tab-body-wrapper.no-animations .mdc-tab-body-content{transition:none!important;animation:none!important}.focus-indicator{position:relative}.tabs-legacy .mdc-tab-labels{gap:2px}.tabs-legacy .mdc-tab-label-container{border:0px}.mdc-tab-legacy{-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-decoration:none;height:28px;padding:0 14px;font-family:Open Sans;font-size:13px;letter-spacing:0px;line-height:22px;font-weight:400;background-color:#4d4d4d;border-top-left-radius:5px;border-top-right-radius:5px;cursor:pointer;max-width:90px}.legacy-small .mdc-tab-legacy{height:28px;font-size:12px}.legacy-medium .mdc-tab-legacy{height:36px;font-size:14px}.legacy-large .mdc-tab-legacy{height:44px;font-size:16px}.mdc-tab-group.mdc-tab-group-stretch-tabs>.mdc-tab-header .mdc-tab-legacy{flex-grow:1}.mdc-tab-legacy.mdc-tab{flex-grow:0}.mdc-tab-legacy .mdc-tab-indicator__content--underline{border-color:#cf0106;border-top-width:2px;border-radius:0}.mdc-tab-legacy:hover:not(.mdc-tab--active){background-color:#373737}.mdc-tab-legacy:focus .mdc-tab__text-label{color:#fff}.mdc-tab-legacy.mdc-tab--active{background-color:#929292}.mdc-tab-legacy.mdc-tab--active .mdc-tab__text-label{color:#fff}.mdc-tab-legacy.mdc-tab--active .mdc-tab__ripple:before{background-color:#fff}.mdc-tab-legacy.mdc-tab-disabled{pointer-events:none}.mdc-tab-legacy.mdc-tab-disabled .mdc-tab__text-label{color:#bdbdbd}.mdc-tab-legacy.mdc-tab-disabled .mdc-tab__content{pointer-events:none}.mdc-tab-legacy .mdc-tab__ripple:before{content:\"\";display:block;position:absolute;inset:0;opacity:0;pointer-events:none;background-color:#fff}.mdc-tab-legacy .mdc-tab__text-label{color:#fff;display:inline-flex;align-items:center;transition:none}.mdc-tab-legacy .mdc-tab__content{position:relative;pointer-events:auto}.mdc-tab-legacy:hover .mdc-tab__ripple:before{opacity:.04}.mdc-tab-legacy.cdk-program-focused .mdc-tab__ripple:before,.mdc-tab-legacy.cdk-keyboard-focused .mdc-tab__ripple:before{opacity:.12}\n"] }]
|
|
9453
9467
|
}], ctorParameters: () => [], propDecorators: { _allTabs: [{
|
|
9454
9468
|
type: ContentChildren,
|
|
9455
9469
|
args: [MDTab, { descendants: true }]
|
|
@@ -9466,15 +9480,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
9466
9480
|
type: Input
|
|
9467
9481
|
}], hideInkBar: [{
|
|
9468
9482
|
type: Input
|
|
9483
|
+
}], legacySize: [{
|
|
9484
|
+
type: Input
|
|
9469
9485
|
}], fitInkBarToContent: [{
|
|
9470
9486
|
type: Input,
|
|
9471
9487
|
args: [{ transform: booleanAttribute }]
|
|
9472
9488
|
}], stretchTabs: [{
|
|
9473
9489
|
type: Input,
|
|
9474
|
-
args: [{ alias: 'stretch-tabs', transform: booleanAttribute }]
|
|
9490
|
+
args: [{ alias: 'md-stretch-tabs', transform: booleanAttribute }]
|
|
9475
9491
|
}], alignTabs: [{
|
|
9476
9492
|
type: Input,
|
|
9477
|
-
args: [{ alias: 'align-tabs' }]
|
|
9493
|
+
args: [{ alias: 'md-align-tabs' }]
|
|
9478
9494
|
}], dynamicHeight: [{
|
|
9479
9495
|
type: Input,
|
|
9480
9496
|
args: [{ transform: booleanAttribute }]
|
|
@@ -9483,6 +9499,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
9483
9499
|
args: [{ transform: numberAttribute }]
|
|
9484
9500
|
}], headerPosition: [{
|
|
9485
9501
|
type: Input
|
|
9502
|
+
}], animationDisabled: [{
|
|
9503
|
+
type: Input
|
|
9486
9504
|
}], animationDuration: [{
|
|
9487
9505
|
type: Input
|
|
9488
9506
|
}], contentTabIndex: [{
|
|
@@ -9533,9 +9551,470 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImpor
|
|
|
9533
9551
|
}]
|
|
9534
9552
|
}] });
|
|
9535
9553
|
|
|
9554
|
+
/**
|
|
9555
|
+
* Finite states for the checkbox visual state machine.
|
|
9556
|
+
*
|
|
9557
|
+
* - `Init`: initial (pre-render) state
|
|
9558
|
+
* - `Checked`: box is checked
|
|
9559
|
+
* - `Unchecked`: box is unchecked
|
|
9560
|
+
*
|
|
9561
|
+
* Used to pick the proper animation class during transitions.
|
|
9562
|
+
*/
|
|
9563
|
+
var TransitionCheckState;
|
|
9564
|
+
(function (TransitionCheckState) {
|
|
9565
|
+
TransitionCheckState[TransitionCheckState["Init"] = 0] = "Init";
|
|
9566
|
+
TransitionCheckState[TransitionCheckState["Checked"] = 1] = "Checked";
|
|
9567
|
+
TransitionCheckState[TransitionCheckState["Unchecked"] = 2] = "Unchecked";
|
|
9568
|
+
})(TransitionCheckState || (TransitionCheckState = {}));
|
|
9569
|
+
/**
|
|
9570
|
+
* Payload for `(change)` output.
|
|
9571
|
+
*
|
|
9572
|
+
* - `source`: reference to emitting checkbox instance
|
|
9573
|
+
* - `checked`: current boolean state after the change
|
|
9574
|
+
*/
|
|
9575
|
+
class MDCheckboxChange {
|
|
9576
|
+
/** Source checkbox that emitted the change. */
|
|
9577
|
+
source;
|
|
9578
|
+
/** Current checked state after the update. */
|
|
9579
|
+
checked;
|
|
9580
|
+
}
|
|
9581
|
+
/**
|
|
9582
|
+
* Material-like Checkbox with CVA + validation support.
|
|
9583
|
+
*
|
|
9584
|
+
* @remarks
|
|
9585
|
+
* - Implements Angular Forms interfaces (`ControlValueAccessor`, `Validator`).
|
|
9586
|
+
* - Emits {@link MDCheckBox.change | change} on user-driven updates.
|
|
9587
|
+
* - Applies CSS animation classes for state transitions (configurable).
|
|
9588
|
+
*
|
|
9589
|
+
* @example Template usage
|
|
9590
|
+
* ```html
|
|
9591
|
+
* <md-checkbox [(ngModel)]="checked" (change)="onChanged($event)">Remember me</md-checkbox>
|
|
9592
|
+
* ```
|
|
9593
|
+
*/
|
|
9594
|
+
class MDCheckBox {
|
|
9595
|
+
/** Host `ElementRef` for low-level DOM ops (focus mgmt, class toggles via templates). */
|
|
9596
|
+
_elementRef = inject(ElementRef);
|
|
9597
|
+
/** Change detector to mark view dirty on imperative state changes. */
|
|
9598
|
+
_changeDetectorRef = inject(ChangeDetectorRef);
|
|
9599
|
+
/** Zone used to schedule work outside Angular for animation class cleanup. */
|
|
9600
|
+
_ngZone = inject(NgZone);
|
|
9601
|
+
/** When true, skips adding animation classes to avoid motion. */
|
|
9602
|
+
_animationsDisabled = false;
|
|
9603
|
+
/**
|
|
9604
|
+
* Local options bag (can be extended to accept DI-config in the future).
|
|
9605
|
+
*
|
|
9606
|
+
* - `color`: theme class on host (`'accent'` by default)
|
|
9607
|
+
* - `clickAction`: how clicks affect toggle (default `'check'`)
|
|
9608
|
+
* - `disabledInteractive`: allow certain focus/aria semantics even if disabled
|
|
9609
|
+
*/
|
|
9610
|
+
_options = {
|
|
9611
|
+
color: 'accent',
|
|
9612
|
+
clickAction: 'check',
|
|
9613
|
+
disabledInteractive: false,
|
|
9614
|
+
};
|
|
9615
|
+
// ───────────────────────────── FocusableOption ─────────────────────────────
|
|
9616
|
+
/**
|
|
9617
|
+
* FocusableOption API (CDK lists, key manager, etc.).
|
|
9618
|
+
* Delegates focus to the internal native `<input>`.
|
|
9619
|
+
*/
|
|
9620
|
+
focus() {
|
|
9621
|
+
this._inputElement.nativeElement.focus();
|
|
9622
|
+
}
|
|
9623
|
+
// ───────────────────────────── Events & helpers ─────────────────────────────
|
|
9624
|
+
/**
|
|
9625
|
+
* Factory for `(change)` event payloads.
|
|
9626
|
+
* @param isChecked Final boolean state after user interaction/programmatic toggle.
|
|
9627
|
+
*/
|
|
9628
|
+
_createChangeEvent(isChecked) {
|
|
9629
|
+
const event = new MDCheckboxChange();
|
|
9630
|
+
event.source = this;
|
|
9631
|
+
event.checked = isChecked;
|
|
9632
|
+
return event;
|
|
9633
|
+
}
|
|
9634
|
+
/**
|
|
9635
|
+
* Returns the element on which animation classes are applied.
|
|
9636
|
+
* Typically the native input or visual container around it.
|
|
9637
|
+
*/
|
|
9638
|
+
_getAnimationTargetElement() {
|
|
9639
|
+
return this._inputElement?.nativeElement;
|
|
9640
|
+
}
|
|
9641
|
+
/** Mapping of transition names to MDC animation classes. */
|
|
9642
|
+
_animationClasses = {
|
|
9643
|
+
uncheckedToChecked: 'mdc-checkbox--anim-unchecked-checked',
|
|
9644
|
+
checkedToUnchecked: 'mdc-checkbox--anim-checked-unchecked',
|
|
9645
|
+
};
|
|
9646
|
+
// ───────────────────────────── A11y Inputs ─────────────────────────────
|
|
9647
|
+
/** Accessible label text (if no external label is used). */
|
|
9648
|
+
ariaLabel = '';
|
|
9649
|
+
/** Element id that labels this checkbox (preferred over `aria-label`). */
|
|
9650
|
+
ariaLabelledby = null;
|
|
9651
|
+
/** Element id that provides a description for this control. */
|
|
9652
|
+
ariaDescribedby;
|
|
9653
|
+
/** Expanded state for composite widgets; rarely needed on a checkbox. */
|
|
9654
|
+
ariaExpanded;
|
|
9655
|
+
/** Id of element(s) whose contents are controlled by this checkbox. */
|
|
9656
|
+
ariaControls;
|
|
9657
|
+
/** Id of element(s) owned by this checkbox. */
|
|
9658
|
+
ariaOwns;
|
|
9659
|
+
// ───────────────────────────── Identity / naming ─────────────────────────────
|
|
9660
|
+
/** Unique id seed used for host and internal input id wiring. */
|
|
9661
|
+
_uniqueId;
|
|
9662
|
+
/** Host element id; also used to derive input id if provided. */
|
|
9663
|
+
id;
|
|
9664
|
+
/** Computed id for the internal `<input>`. */
|
|
9665
|
+
get inputId() {
|
|
9666
|
+
return `${this.id || this._uniqueId}-input`;
|
|
9667
|
+
}
|
|
9668
|
+
// ───────────────────────────── Form-related inputs ─────────────────────────────
|
|
9669
|
+
/** Whether the control is required; used by `Validator` implementation. */
|
|
9670
|
+
required;
|
|
9671
|
+
/** Label placement relative to the box. @default 'after' */
|
|
9672
|
+
labelPosition = 'after';
|
|
9673
|
+
/** HTML `name` attribute of the internal input. */
|
|
9674
|
+
name = null;
|
|
9675
|
+
/**
|
|
9676
|
+
* Fired when the user toggles the checkbox (after internal state is updated).
|
|
9677
|
+
* Emits {@link MDCheckboxChange}.
|
|
9678
|
+
*/
|
|
9679
|
+
change = new EventEmitter();
|
|
9680
|
+
/** Optional value associated with this checkbox (for forms/radio-like patterns). */
|
|
9681
|
+
value;
|
|
9682
|
+
/** Reference to the native input (used for focus, syncing native state). */
|
|
9683
|
+
_inputElement;
|
|
9684
|
+
/** Reference to the label element (used to stop click bubbling). */
|
|
9685
|
+
_labelElement;
|
|
9686
|
+
/**
|
|
9687
|
+
* Tab order for the internal input. If `null/undefined` — defaults to `0`.
|
|
9688
|
+
* Accepts string/number; normalized via `numberAttribute`.
|
|
9689
|
+
*/
|
|
9690
|
+
tabIndex;
|
|
9691
|
+
/** Theme color token applied as a host class (e.g., `'accent'`, `'primary'`). */
|
|
9692
|
+
color;
|
|
9693
|
+
/**
|
|
9694
|
+
* When true, allows certain interactions even in disabled state.
|
|
9695
|
+
* Useful when a disabled checkbox still needs focus/aria semantics.
|
|
9696
|
+
*/
|
|
9697
|
+
disabledInteractive;
|
|
9698
|
+
/** onTouched callback provided by Angular Forms. */
|
|
9699
|
+
_onTouched = () => { };
|
|
9700
|
+
/** Currently applied animation class; cleared after timeout. */
|
|
9701
|
+
_currentAnimationClass = '';
|
|
9702
|
+
/** Last known check state to compute transition direction. */
|
|
9703
|
+
_currentCheckState = TransitionCheckState.Init;
|
|
9704
|
+
/** onChange callback provided by Angular Forms (propagates model updates). */
|
|
9705
|
+
_controlValueAccessorChangeFn = () => { };
|
|
9706
|
+
/** Hook to notify Angular Forms that validator inputs changed. */
|
|
9707
|
+
_validatorChangeFn = () => { };
|
|
9708
|
+
constructor() {
|
|
9709
|
+
const tabIndex = inject(new HostAttributeToken('tabindex'), { optional: true });
|
|
9710
|
+
this._options = this._options;
|
|
9711
|
+
this.color = this._options.color;
|
|
9712
|
+
this.tabIndex = tabIndex == null ? 0 : parseInt(tabIndex) || 0;
|
|
9713
|
+
this.id = this._uniqueId = inject(_IdGenerator).getId('mdc-checkbox-');
|
|
9714
|
+
this.disabledInteractive = this._options?.disabledInteractive ?? false;
|
|
9715
|
+
}
|
|
9716
|
+
// ───────────────────────────── Angular lifecycle ─────────────────────────────
|
|
9717
|
+
/** On input changes (e.g., `required` toggled), re-run validator if needed. */
|
|
9718
|
+
ngOnChanges(changes) {
|
|
9719
|
+
if (changes['required']) {
|
|
9720
|
+
this._validatorChangeFn();
|
|
9721
|
+
}
|
|
9722
|
+
}
|
|
9723
|
+
// ───────────────────────────── State: checked/disabled ─────────────────────────────
|
|
9724
|
+
/** Current boolean state (getter). */
|
|
9725
|
+
get checked() {
|
|
9726
|
+
return this._checked;
|
|
9727
|
+
}
|
|
9728
|
+
/**
|
|
9729
|
+
* Setter that marks view for check under OnPush strategy.
|
|
9730
|
+
* Avoids unnecessary marks if value didn't change.
|
|
9731
|
+
*/
|
|
9732
|
+
set checked(value) {
|
|
9733
|
+
if (value != this.checked) {
|
|
9734
|
+
this._checked = value;
|
|
9735
|
+
this._changeDetectorRef.markForCheck();
|
|
9736
|
+
}
|
|
9737
|
+
}
|
|
9738
|
+
_checked = false;
|
|
9739
|
+
/** Disabled state (getter). */
|
|
9740
|
+
get disabled() {
|
|
9741
|
+
return this._disabled;
|
|
9742
|
+
}
|
|
9743
|
+
/**
|
|
9744
|
+
* Setter that marks view for check under OnPush strategy.
|
|
9745
|
+
* Avoids unnecessary marks if value didn't change.
|
|
9746
|
+
*/
|
|
9747
|
+
set disabled(value) {
|
|
9748
|
+
if (value !== this.disabled) {
|
|
9749
|
+
this._disabled = value;
|
|
9750
|
+
this._changeDetectorRef.markForCheck();
|
|
9751
|
+
}
|
|
9752
|
+
}
|
|
9753
|
+
_disabled = false;
|
|
9754
|
+
// ───────────────────────────── Misc handlers ─────────────────────────────
|
|
9755
|
+
/**
|
|
9756
|
+
* Force change detection when projected label text mutates (e.g., via i18n async).
|
|
9757
|
+
* Called from template via `(cdkObserveContent)` or similar.
|
|
9758
|
+
*/
|
|
9759
|
+
_onLabelTextChange() {
|
|
9760
|
+
this._changeDetectorRef.detectChanges();
|
|
9761
|
+
}
|
|
9762
|
+
// ───────────────────────────── ControlValueAccessor ─────────────────────────────
|
|
9763
|
+
/** Writes a new value from the model into the view. */
|
|
9764
|
+
writeValue(value) {
|
|
9765
|
+
this.checked = !!value;
|
|
9766
|
+
}
|
|
9767
|
+
/** Registers a callback to be triggered when the value changes in the UI. */
|
|
9768
|
+
registerOnChange(fn) {
|
|
9769
|
+
this._controlValueAccessorChangeFn = fn;
|
|
9770
|
+
}
|
|
9771
|
+
/** Registers a callback for the control being touched (blurred). */
|
|
9772
|
+
registerOnTouched(fn) {
|
|
9773
|
+
this._onTouched = fn;
|
|
9774
|
+
}
|
|
9775
|
+
/** Enables or disables the control from the Angular Forms API. */
|
|
9776
|
+
setDisabledState(isDisabled) {
|
|
9777
|
+
this.disabled = isDisabled;
|
|
9778
|
+
}
|
|
9779
|
+
// ───────────────────────────── Validator ─────────────────────────────
|
|
9780
|
+
/**
|
|
9781
|
+
* Synchronous validation: if `required`, only `true` is valid.
|
|
9782
|
+
*/
|
|
9783
|
+
validate(control) {
|
|
9784
|
+
return this.required && control.value !== true ? { required: true } : null;
|
|
9785
|
+
}
|
|
9786
|
+
/** Informs Angular Forms that validators should be re-run. */
|
|
9787
|
+
registerOnValidatorChange(fn) {
|
|
9788
|
+
this._validatorChangeFn = fn;
|
|
9789
|
+
}
|
|
9790
|
+
// ───────────────────────────── Animations ─────────────────────────────
|
|
9791
|
+
/**
|
|
9792
|
+
* Applies/removes the appropriate animation CSS class for the transition.
|
|
9793
|
+
* Cleans up the class after a timeout (~duration of the CSS animation).
|
|
9794
|
+
*/
|
|
9795
|
+
_transitionCheckState(newState) {
|
|
9796
|
+
let oldState = this._currentCheckState;
|
|
9797
|
+
let element = this._getAnimationTargetElement();
|
|
9798
|
+
if (oldState === newState || !element) {
|
|
9799
|
+
return;
|
|
9800
|
+
}
|
|
9801
|
+
if (this._currentAnimationClass) {
|
|
9802
|
+
element.classList.remove(this._currentAnimationClass);
|
|
9803
|
+
}
|
|
9804
|
+
this._currentAnimationClass = this._getAnimationClassForCheckStateTransition(oldState, newState);
|
|
9805
|
+
this._currentCheckState = newState;
|
|
9806
|
+
if (this._currentAnimationClass.length > 0) {
|
|
9807
|
+
element.classList.add(this._currentAnimationClass);
|
|
9808
|
+
const animationClass = this._currentAnimationClass;
|
|
9809
|
+
this._ngZone.runOutsideAngular(() => {
|
|
9810
|
+
setTimeout(() => {
|
|
9811
|
+
element.classList.remove(animationClass);
|
|
9812
|
+
}, 1000);
|
|
9813
|
+
});
|
|
9814
|
+
}
|
|
9815
|
+
}
|
|
9816
|
+
/**
|
|
9817
|
+
* Picks the correct CSS animation class for a given `old → new` transition.
|
|
9818
|
+
* Returns empty string when animations are disabled.
|
|
9819
|
+
*/
|
|
9820
|
+
_getAnimationClassForCheckStateTransition(oldState, newState) {
|
|
9821
|
+
if (this._animationsDisabled) {
|
|
9822
|
+
return '';
|
|
9823
|
+
}
|
|
9824
|
+
switch (oldState) {
|
|
9825
|
+
case TransitionCheckState.Init:
|
|
9826
|
+
if (newState === TransitionCheckState.Checked) {
|
|
9827
|
+
return this._animationClasses.uncheckedToChecked;
|
|
9828
|
+
}
|
|
9829
|
+
break;
|
|
9830
|
+
case TransitionCheckState.Unchecked:
|
|
9831
|
+
return this._animationClasses.uncheckedToChecked;
|
|
9832
|
+
case TransitionCheckState.Checked:
|
|
9833
|
+
return this._animationClasses.checkedToUnchecked;
|
|
9834
|
+
}
|
|
9835
|
+
return '';
|
|
9836
|
+
}
|
|
9837
|
+
// ───────────────────────────── UI events ─────────────────────────────
|
|
9838
|
+
/** Host handler for click on the native `<input>`. */
|
|
9839
|
+
_onInputClick() {
|
|
9840
|
+
this._handleInputClick();
|
|
9841
|
+
}
|
|
9842
|
+
/**
|
|
9843
|
+
* Click on the larger touch target (ripple/visual area) should toggle as well.
|
|
9844
|
+
* Also refocuses the real input if not disabled to preserve keyboard flow.
|
|
9845
|
+
*/
|
|
9846
|
+
_onTouchTargetClick() {
|
|
9847
|
+
this._handleInputClick();
|
|
9848
|
+
if (!this.disabled) {
|
|
9849
|
+
this._inputElement.nativeElement.focus();
|
|
9850
|
+
}
|
|
9851
|
+
}
|
|
9852
|
+
/**
|
|
9853
|
+
* Prevent outer components from reacting to internal mouse/keyboard events.
|
|
9854
|
+
*/
|
|
9855
|
+
_onInteractionEvent(event) {
|
|
9856
|
+
event.stopPropagation();
|
|
9857
|
+
}
|
|
9858
|
+
/**
|
|
9859
|
+
* Mark as touched after blur has fully propagated to avoid change collisions.
|
|
9860
|
+
*/
|
|
9861
|
+
_onBlur() {
|
|
9862
|
+
Promise.resolve().then(() => {
|
|
9863
|
+
this._onTouched();
|
|
9864
|
+
this._changeDetectorRef.markForCheck();
|
|
9865
|
+
});
|
|
9866
|
+
}
|
|
9867
|
+
/**
|
|
9868
|
+
* Centralized click handler used by input/touch-target.
|
|
9869
|
+
* Respects disabled state and `clickAction` behavior.
|
|
9870
|
+
*/
|
|
9871
|
+
_handleInputClick() {
|
|
9872
|
+
const clickAction = this._options?.clickAction;
|
|
9873
|
+
if (!this.disabled && clickAction !== 'noop') {
|
|
9874
|
+
this._checked = !this._checked;
|
|
9875
|
+
this._transitionCheckState(this._checked ? TransitionCheckState.Checked : TransitionCheckState.Unchecked);
|
|
9876
|
+
this._emitChangeEvent();
|
|
9877
|
+
}
|
|
9878
|
+
else if ((this.disabled && this.disabledInteractive) || (!this.disabled && clickAction === 'noop')) {
|
|
9879
|
+
this._inputElement.nativeElement.checked = this.checked;
|
|
9880
|
+
}
|
|
9881
|
+
}
|
|
9882
|
+
/**
|
|
9883
|
+
* Emits Angular Forms change, fires `(change)` output, and syncs native input state.
|
|
9884
|
+
*/
|
|
9885
|
+
_emitChangeEvent() {
|
|
9886
|
+
this._controlValueAccessorChangeFn(this.checked);
|
|
9887
|
+
this.change.emit(this._createChangeEvent(this.checked));
|
|
9888
|
+
if (this._inputElement) {
|
|
9889
|
+
this._inputElement.nativeElement.checked = this.checked;
|
|
9890
|
+
}
|
|
9891
|
+
}
|
|
9892
|
+
/**
|
|
9893
|
+
* Programmatic toggle (e.g., from parent component).
|
|
9894
|
+
* Also notifies Angular Forms via registered `onChange` callback.
|
|
9895
|
+
*/
|
|
9896
|
+
toggle() {
|
|
9897
|
+
this.checked = !this.checked;
|
|
9898
|
+
this._controlValueAccessorChangeFn(this.checked);
|
|
9899
|
+
}
|
|
9900
|
+
/**
|
|
9901
|
+
* If a click originates from inside the label element, stop it from bubbling
|
|
9902
|
+
* to avoid double-handling (host click + input click).
|
|
9903
|
+
*/
|
|
9904
|
+
_preventBubblingFromLabel(event) {
|
|
9905
|
+
if (!!event.target && this._labelElement.nativeElement.contains(event.target)) {
|
|
9906
|
+
event.stopPropagation();
|
|
9907
|
+
}
|
|
9908
|
+
}
|
|
9909
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCheckBox, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9910
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.3.6", type: MDCheckBox, isStandalone: true, selector: "md-checkbox", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], ariaExpanded: ["aria-expanded", "ariaExpanded", booleanAttribute], ariaControls: ["aria-controls", "ariaControls"], ariaOwns: ["aria-owns", "ariaOwns"], id: "id", required: ["required", "required", booleanAttribute], labelPosition: "labelPosition", name: "name", value: "value", tabIndex: ["tabIndex", "tabIndex", (value) => (value == null ? undefined : numberAttribute(value))], color: "color", disabledInteractive: ["disabledInteractive", "disabledInteractive", booleanAttribute], checked: ["checked", "checked", booleanAttribute], disabled: ["disabled", "disabled", booleanAttribute] }, outputs: { change: "change" }, host: { properties: { "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "class.animation-noopable": "_animationsDisabled", "class.mdc-checkbox--disabled": "disabled", "id": "id", "class.mdc-checkbox-disabled": "disabled", "class.mdc-checkbox-checked": "checked", "class.mdc-checkbox-disabled-interactive": "disabledInteractive", "class": "color ? color : \"accent\"" }, classAttribute: "md-mdc-checkbox" }, providers: [
|
|
9911
|
+
{
|
|
9912
|
+
provide: NG_VALUE_ACCESSOR,
|
|
9913
|
+
useExisting: forwardRef(() => MDCheckBox),
|
|
9914
|
+
multi: true,
|
|
9915
|
+
},
|
|
9916
|
+
{
|
|
9917
|
+
provide: NG_VALIDATORS,
|
|
9918
|
+
useExisting: MDCheckBox,
|
|
9919
|
+
multi: true,
|
|
9920
|
+
},
|
|
9921
|
+
], viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }, { propertyName: "_labelElement", first: true, predicate: ["label"], descendants: true }], exportAs: ["mdCheckbox"], usesOnChanges: true, ngImport: i0, template: "<div class=\"checkbox-internal-field\" (click)=\"_preventBubblingFromLabel($event)\">\r\n <div #checkbox class=\"mdc-checkbox\">\r\n <div class=\"mdc-checkbox-touch-target\" (click)=\"_onTouchTargetClick()\"></div>\r\n <input\r\n #input\r\n type=\"checkbox\"\r\n class=\"mdc-checkbox__native-control\"\r\n [class.mdc-checkbox--selected]=\"checked\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [attr.aria-labelledby]=\"ariaLabelledby\"\r\n [attr.aria-describedby]=\"ariaDescribedby\"\r\n [attr.aria-controls]=\"ariaControls\"\r\n [attr.aria-disabled]=\"disabled && disabledInteractive ? true : null\"\r\n [attr.aria-expanded]=\"ariaExpanded\"\r\n [attr.aria-owns]=\"ariaOwns\"\r\n [attr.name]=\"name\"\r\n [attr.value]=\"value\"\r\n [checked]=\"checked\"\r\n [disabled]=\"disabled && !disabledInteractive\"\r\n [id]=\"inputId\"\r\n [required]=\"required\"\r\n [tabIndex]=\"disabled && !disabledInteractive ? -1 : tabIndex\"\r\n (blur)=\"_onBlur()\"\r\n (click)=\"_onInputClick()\"\r\n (change)=\"_onInteractionEvent($event)\"\r\n />\r\n <div class=\"mdc-checkbox__background\">\r\n <svg class=\"mdc-checkbox__checkmark\" focusable=\"false\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\r\n <path class=\"mdc-checkbox__checkmark-path\" fill=\"none\" d=\"M1.73,12.91 8.1,19.28 22.79,4.59\" />\r\n </svg>\r\n <div class=\"mdc-checkbox__mixedmark\"></div>\r\n </div>\r\n </div>\r\n\r\n <label class=\"mdc-label\" #label [for]=\"inputId\">\r\n <ng-content></ng-content>\r\n </label>\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.md-mdc-checkbox{display:inline-block;position:relative;-webkit-tap-highlight-color:rgba(0,0,0,0)}.checkbox-internal-field{display:inline-flex;align-items:center;vertical-align:middle;line-height:1.25rem;font-family:Montserrat;font-size:.875rem;letter-spacing:.016rem;font-weight:400}.mdc-checkbox{display:inline-block;position:relative;-webkit-tap-highlight-color:transparent}.mdc-checkbox label{cursor:pointer}.mdc-checkbox.mdc-checkbox-disabled.mdc-checkbox-disabled-interactive{pointer-events:auto}.mdc-checkbox.mdc-checkbox-disabled.mdc-checkbox-disabled-interactive input{cursor:default}.mdc-checkbox.mdc-checkbox-disabled label{cursor:default;color:color-mix(in srgb,#000000 38%,transparent)}.mdc-checkbox label:empty{display:none}.mdc-checkbox-touch-target{position:absolute;top:50%;left:50%;height:48px;width:48px;transform:translate(-50%,-50%);display:block}.mdc-checkbox__native-control:focus~.focus-indicator:before{content:\"\"}.mdc-checkbox{display:inline-block;position:relative;flex:0 0 16px;box-sizing:content-box;width:16px;height:16px;line-height:0;white-space:nowrap;cursor:pointer;vertical-align:bottom;padding:12px;margin:0}.mdc-checkbox .mdc-checkbox__native-control{position:absolute;margin:0;padding:0;opacity:0;cursor:inherit;z-index:1;width:40px;height:40px;top:0;right:0;left:0}.mdc-checkbox .mdc-checkbox__native-control:focus-visible~.mdc-checkbox__background{outline:1px solid #020617;outline-offset:2px}.mdc-checkbox--disabled{cursor:default;pointer-events:none}@media (forced-colors: active){.mdc-checkbox--disabled{opacity:.5}}.mdc-checkbox__background{display:inline-flex;position:absolute;align-items:center;justify-content:center;box-sizing:border-box;width:16px;height:16px;border:2px solid currentColor;border-radius:2px;background-color:transparent;pointer-events:none;will-change:background-color,border-color;transition:background-color 90ms cubic-bezier(.4,0,.6,1),border-color 90ms cubic-bezier(.4,0,.6,1);border-color:#514346;top:12px;left:12px}.mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background{border-color:#cf0106;background-color:#cf0106}.mdc-checkbox--disabled .mdc-checkbox__background{border-color:color-mix(in srgb,#000000 38%,transparent)}.mdc-checkbox__native-control:disabled:checked~.mdc-checkbox__background{background-color:color-mix(in srgb,#000000 38%,transparent);border-color:transparent}.mdc-checkbox:hover>.mdc-checkbox__native-control:not(:checked)~.mdc-checkbox__background{border-color:#000;background-color:transparent}.mdc-checkbox:hover>.mdc-checkbox__native-control:checked~.mdc-checkbox__background{border-color:#cf0106;background-color:#cf0106}.mdc-checkbox__native-control:focus:focus:not(:checked)~.mdc-checkbox__background{border-color:#000}.mdc-checkbox__native-control:focus:focus:checked~.mdc-checkbox__background{border-color:#cf0106;background-color:#cf0106}.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox:hover>.mdc-checkbox__native-control~.mdc-checkbox__background,.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox .mdc-checkbox__native-control:focus~.mdc-checkbox__background,.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox__background{border-color:color-mix(in srgb,#000000 38%,transparent)}.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox__native-control:checked~.mdc-checkbox__background{background-color:color-mix(in srgb,#000000 38%,transparent);border-color:transparent}.mdc-checkbox__checkmark{position:absolute;inset:0;width:100%;opacity:0;transition:opacity .18s cubic-bezier(.4,0,.6,1);color:#fff}@media (forced-colors: active){.mdc-checkbox__checkmark{color:CanvasText}}.mdc-checkbox--disabled .mdc-checkbox__checkmark{color:#fff8f8}@media (forced-colors: active){.mdc-checkbox--disabled .mdc-checkbox__checkmark{color:CanvasText}}.mdc-checkbox__checkmark-path{transition:stroke-dashoffset .18s cubic-bezier(.4,0,.6,1);stroke:currentColor;stroke-width:2.7733333333px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-checkbox__mixedmark{width:100%;height:0;transform:scaleX(0) rotate(0);border-width:1px;border-style:solid;opacity:0;transition:opacity 90ms cubic-bezier(.4,0,.6,1),transform 90ms cubic-bezier(.4,0,.6,1);border-color:#fff}@media (forced-colors: active){.mdc-checkbox__mixedmark{margin:0 1px}}.mdc-checkbox--disabled .mdc-checkbox__mixedmark,.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox__mixedmark{border-color:#fff}.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background,.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background{animation-duration:.18s;animation-timing-function:linear}.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__checkmark-path{animation:mdc-checkbox-unchecked-checked-checkmark-path .18s linear;transition:none}.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__checkmark-path{animation:mdc-checkbox-checked-unchecked-checkmark-path 90ms linear;transition:none}.mdc-checkbox__native-control:checked~.mdc-checkbox__background{transition:border-color 90ms cubic-bezier(0,0,.2,1),background-color 90ms cubic-bezier(0,0,.2,1)}.mdc-checkbox__native-control:checked~.mdc-checkbox__background>.mdc-checkbox__checkmark>.mdc-checkbox__checkmark-path{stroke-dashoffset:0}.mdc-checkbox__native-control:checked~.mdc-checkbox__background>.mdc-checkbox__checkmark{transition:opacity .18s cubic-bezier(0,0,.2,1),transform .18s cubic-bezier(0,0,.2,1);opacity:1}.mdc-checkbox__native-control:checked~.mdc-checkbox__background>.mdc-checkbox__mixedmark{transform:scaleX(1) rotate(-45deg)}@keyframes mdc-checkbox-unchecked-checked-checkmark-path{0%,50%{stroke-dashoffset:29.7833385}50%{animation-timing-function:cubic-bezier(0,0,.2,1)}to{stroke-dashoffset:0}}@keyframes mdc-checkbox-checked-unchecked-checkmark-path{0%{animation-timing-function:cubic-bezier(.4,0,1,1);opacity:1;stroke-dashoffset:0}to{opacity:0;stroke-dashoffset:-29.7833385}}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
|
|
9922
|
+
}
|
|
9923
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCheckBox, decorators: [{
|
|
9924
|
+
type: Component,
|
|
9925
|
+
args: [{ selector: 'md-checkbox', host: {
|
|
9926
|
+
class: 'md-mdc-checkbox',
|
|
9927
|
+
'[attr.tabindex]': 'null',
|
|
9928
|
+
'[attr.aria-label]': 'null',
|
|
9929
|
+
'[attr.aria-labelledby]': 'null',
|
|
9930
|
+
'[class.animation-noopable]': '_animationsDisabled',
|
|
9931
|
+
'[class.mdc-checkbox--disabled]': 'disabled',
|
|
9932
|
+
'[id]': 'id',
|
|
9933
|
+
'[class.mdc-checkbox-disabled]': 'disabled',
|
|
9934
|
+
'[class.mdc-checkbox-checked]': 'checked',
|
|
9935
|
+
'[class.mdc-checkbox-disabled-interactive]': 'disabledInteractive',
|
|
9936
|
+
'[class]': 'color ? color : "accent"',
|
|
9937
|
+
}, providers: [
|
|
9938
|
+
{
|
|
9939
|
+
provide: NG_VALUE_ACCESSOR,
|
|
9940
|
+
useExisting: forwardRef(() => MDCheckBox),
|
|
9941
|
+
multi: true,
|
|
9942
|
+
},
|
|
9943
|
+
{
|
|
9944
|
+
provide: NG_VALIDATORS,
|
|
9945
|
+
useExisting: MDCheckBox,
|
|
9946
|
+
multi: true,
|
|
9947
|
+
},
|
|
9948
|
+
], exportAs: 'mdCheckbox', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"checkbox-internal-field\" (click)=\"_preventBubblingFromLabel($event)\">\r\n <div #checkbox class=\"mdc-checkbox\">\r\n <div class=\"mdc-checkbox-touch-target\" (click)=\"_onTouchTargetClick()\"></div>\r\n <input\r\n #input\r\n type=\"checkbox\"\r\n class=\"mdc-checkbox__native-control\"\r\n [class.mdc-checkbox--selected]=\"checked\"\r\n [attr.aria-label]=\"ariaLabel || null\"\r\n [attr.aria-labelledby]=\"ariaLabelledby\"\r\n [attr.aria-describedby]=\"ariaDescribedby\"\r\n [attr.aria-controls]=\"ariaControls\"\r\n [attr.aria-disabled]=\"disabled && disabledInteractive ? true : null\"\r\n [attr.aria-expanded]=\"ariaExpanded\"\r\n [attr.aria-owns]=\"ariaOwns\"\r\n [attr.name]=\"name\"\r\n [attr.value]=\"value\"\r\n [checked]=\"checked\"\r\n [disabled]=\"disabled && !disabledInteractive\"\r\n [id]=\"inputId\"\r\n [required]=\"required\"\r\n [tabIndex]=\"disabled && !disabledInteractive ? -1 : tabIndex\"\r\n (blur)=\"_onBlur()\"\r\n (click)=\"_onInputClick()\"\r\n (change)=\"_onInteractionEvent($event)\"\r\n />\r\n <div class=\"mdc-checkbox__background\">\r\n <svg class=\"mdc-checkbox__checkmark\" focusable=\"false\" viewBox=\"0 0 24 24\" aria-hidden=\"true\">\r\n <path class=\"mdc-checkbox__checkmark-path\" fill=\"none\" d=\"M1.73,12.91 8.1,19.28 22.79,4.59\" />\r\n </svg>\r\n <div class=\"mdc-checkbox__mixedmark\"></div>\r\n </div>\r\n </div>\r\n\r\n <label class=\"mdc-label\" #label [for]=\"inputId\">\r\n <ng-content></ng-content>\r\n </label>\r\n</div>\r\n", styles: ["div.jqxInGridLink{cursor:pointer;color:#00f;margin:2px;text-decoration:underline}div.jqxInGridLink :hover{color:#8a2be2}.pink-text{color:pink!important}.red-text{color:red!important}.turquoise-text{color:#03a796!important}.blue-text{color:#00f!important}.md-mdc-checkbox{display:inline-block;position:relative;-webkit-tap-highlight-color:rgba(0,0,0,0)}.checkbox-internal-field{display:inline-flex;align-items:center;vertical-align:middle;line-height:1.25rem;font-family:Montserrat;font-size:.875rem;letter-spacing:.016rem;font-weight:400}.mdc-checkbox{display:inline-block;position:relative;-webkit-tap-highlight-color:transparent}.mdc-checkbox label{cursor:pointer}.mdc-checkbox.mdc-checkbox-disabled.mdc-checkbox-disabled-interactive{pointer-events:auto}.mdc-checkbox.mdc-checkbox-disabled.mdc-checkbox-disabled-interactive input{cursor:default}.mdc-checkbox.mdc-checkbox-disabled label{cursor:default;color:color-mix(in srgb,#000000 38%,transparent)}.mdc-checkbox label:empty{display:none}.mdc-checkbox-touch-target{position:absolute;top:50%;left:50%;height:48px;width:48px;transform:translate(-50%,-50%);display:block}.mdc-checkbox__native-control:focus~.focus-indicator:before{content:\"\"}.mdc-checkbox{display:inline-block;position:relative;flex:0 0 16px;box-sizing:content-box;width:16px;height:16px;line-height:0;white-space:nowrap;cursor:pointer;vertical-align:bottom;padding:12px;margin:0}.mdc-checkbox .mdc-checkbox__native-control{position:absolute;margin:0;padding:0;opacity:0;cursor:inherit;z-index:1;width:40px;height:40px;top:0;right:0;left:0}.mdc-checkbox .mdc-checkbox__native-control:focus-visible~.mdc-checkbox__background{outline:1px solid #020617;outline-offset:2px}.mdc-checkbox--disabled{cursor:default;pointer-events:none}@media (forced-colors: active){.mdc-checkbox--disabled{opacity:.5}}.mdc-checkbox__background{display:inline-flex;position:absolute;align-items:center;justify-content:center;box-sizing:border-box;width:16px;height:16px;border:2px solid currentColor;border-radius:2px;background-color:transparent;pointer-events:none;will-change:background-color,border-color;transition:background-color 90ms cubic-bezier(.4,0,.6,1),border-color 90ms cubic-bezier(.4,0,.6,1);border-color:#514346;top:12px;left:12px}.mdc-checkbox__native-control:enabled:checked~.mdc-checkbox__background{border-color:#cf0106;background-color:#cf0106}.mdc-checkbox--disabled .mdc-checkbox__background{border-color:color-mix(in srgb,#000000 38%,transparent)}.mdc-checkbox__native-control:disabled:checked~.mdc-checkbox__background{background-color:color-mix(in srgb,#000000 38%,transparent);border-color:transparent}.mdc-checkbox:hover>.mdc-checkbox__native-control:not(:checked)~.mdc-checkbox__background{border-color:#000;background-color:transparent}.mdc-checkbox:hover>.mdc-checkbox__native-control:checked~.mdc-checkbox__background{border-color:#cf0106;background-color:#cf0106}.mdc-checkbox__native-control:focus:focus:not(:checked)~.mdc-checkbox__background{border-color:#000}.mdc-checkbox__native-control:focus:focus:checked~.mdc-checkbox__background{border-color:#cf0106;background-color:#cf0106}.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox:hover>.mdc-checkbox__native-control~.mdc-checkbox__background,.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox .mdc-checkbox__native-control:focus~.mdc-checkbox__background,.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox__background{border-color:color-mix(in srgb,#000000 38%,transparent)}.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox__native-control:checked~.mdc-checkbox__background{background-color:color-mix(in srgb,#000000 38%,transparent);border-color:transparent}.mdc-checkbox__checkmark{position:absolute;inset:0;width:100%;opacity:0;transition:opacity .18s cubic-bezier(.4,0,.6,1);color:#fff}@media (forced-colors: active){.mdc-checkbox__checkmark{color:CanvasText}}.mdc-checkbox--disabled .mdc-checkbox__checkmark{color:#fff8f8}@media (forced-colors: active){.mdc-checkbox--disabled .mdc-checkbox__checkmark{color:CanvasText}}.mdc-checkbox__checkmark-path{transition:stroke-dashoffset .18s cubic-bezier(.4,0,.6,1);stroke:currentColor;stroke-width:2.7733333333px;stroke-dashoffset:29.7833385;stroke-dasharray:29.7833385}.mdc-checkbox__mixedmark{width:100%;height:0;transform:scaleX(0) rotate(0);border-width:1px;border-style:solid;opacity:0;transition:opacity 90ms cubic-bezier(.4,0,.6,1),transform 90ms cubic-bezier(.4,0,.6,1);border-color:#fff}@media (forced-colors: active){.mdc-checkbox__mixedmark{margin:0 1px}}.mdc-checkbox--disabled .mdc-checkbox__mixedmark,.mdc-checkbox--disabled.md-mdc-checkbox-disabled-interactive .mdc-checkbox__mixedmark{border-color:#fff}.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__background,.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__background{animation-duration:.18s;animation-timing-function:linear}.mdc-checkbox--anim-unchecked-checked .mdc-checkbox__checkmark-path{animation:mdc-checkbox-unchecked-checked-checkmark-path .18s linear;transition:none}.mdc-checkbox--anim-checked-unchecked .mdc-checkbox__checkmark-path{animation:mdc-checkbox-checked-unchecked-checkmark-path 90ms linear;transition:none}.mdc-checkbox__native-control:checked~.mdc-checkbox__background{transition:border-color 90ms cubic-bezier(0,0,.2,1),background-color 90ms cubic-bezier(0,0,.2,1)}.mdc-checkbox__native-control:checked~.mdc-checkbox__background>.mdc-checkbox__checkmark>.mdc-checkbox__checkmark-path{stroke-dashoffset:0}.mdc-checkbox__native-control:checked~.mdc-checkbox__background>.mdc-checkbox__checkmark{transition:opacity .18s cubic-bezier(0,0,.2,1),transform .18s cubic-bezier(0,0,.2,1);opacity:1}.mdc-checkbox__native-control:checked~.mdc-checkbox__background>.mdc-checkbox__mixedmark{transform:scaleX(1) rotate(-45deg)}@keyframes mdc-checkbox-unchecked-checked-checkmark-path{0%,50%{stroke-dashoffset:29.7833385}50%{animation-timing-function:cubic-bezier(0,0,.2,1)}to{stroke-dashoffset:0}}@keyframes mdc-checkbox-checked-unchecked-checkmark-path{0%{animation-timing-function:cubic-bezier(.4,0,1,1);opacity:1;stroke-dashoffset:0}to{opacity:0;stroke-dashoffset:-29.7833385}}\n"] }]
|
|
9949
|
+
}], ctorParameters: () => [], propDecorators: { ariaLabel: [{
|
|
9950
|
+
type: Input,
|
|
9951
|
+
args: ['aria-label']
|
|
9952
|
+
}], ariaLabelledby: [{
|
|
9953
|
+
type: Input,
|
|
9954
|
+
args: ['aria-labelledby']
|
|
9955
|
+
}], ariaDescribedby: [{
|
|
9956
|
+
type: Input,
|
|
9957
|
+
args: ['aria-describedby']
|
|
9958
|
+
}], ariaExpanded: [{
|
|
9959
|
+
type: Input,
|
|
9960
|
+
args: [{ alias: 'aria-expanded', transform: booleanAttribute }]
|
|
9961
|
+
}], ariaControls: [{
|
|
9962
|
+
type: Input,
|
|
9963
|
+
args: ['aria-controls']
|
|
9964
|
+
}], ariaOwns: [{
|
|
9965
|
+
type: Input,
|
|
9966
|
+
args: ['aria-owns']
|
|
9967
|
+
}], id: [{
|
|
9968
|
+
type: Input
|
|
9969
|
+
}], required: [{
|
|
9970
|
+
type: Input,
|
|
9971
|
+
args: [{ transform: booleanAttribute }]
|
|
9972
|
+
}], labelPosition: [{
|
|
9973
|
+
type: Input
|
|
9974
|
+
}], name: [{
|
|
9975
|
+
type: Input
|
|
9976
|
+
}], change: [{
|
|
9977
|
+
type: Output
|
|
9978
|
+
}], value: [{
|
|
9979
|
+
type: Input
|
|
9980
|
+
}], _inputElement: [{
|
|
9981
|
+
type: ViewChild,
|
|
9982
|
+
args: ['input']
|
|
9983
|
+
}], _labelElement: [{
|
|
9984
|
+
type: ViewChild,
|
|
9985
|
+
args: ['label']
|
|
9986
|
+
}], tabIndex: [{
|
|
9987
|
+
type: Input,
|
|
9988
|
+
args: [{ transform: (value) => (value == null ? undefined : numberAttribute(value)) }]
|
|
9989
|
+
}], color: [{
|
|
9990
|
+
type: Input
|
|
9991
|
+
}], disabledInteractive: [{
|
|
9992
|
+
type: Input,
|
|
9993
|
+
args: [{ transform: booleanAttribute }]
|
|
9994
|
+
}], checked: [{
|
|
9995
|
+
type: Input,
|
|
9996
|
+
args: [{ transform: booleanAttribute }]
|
|
9997
|
+
}], disabled: [{
|
|
9998
|
+
type: Input,
|
|
9999
|
+
args: [{ transform: booleanAttribute }]
|
|
10000
|
+
}] } });
|
|
10001
|
+
|
|
10002
|
+
class MDCheckBoxModule {
|
|
10003
|
+
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCheckBoxModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
|
|
10004
|
+
static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.3.6", ngImport: i0, type: MDCheckBoxModule, imports: [MDCheckBox], exports: [MDCheckBox] });
|
|
10005
|
+
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCheckBoxModule });
|
|
10006
|
+
}
|
|
10007
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.6", ngImport: i0, type: MDCheckBoxModule, decorators: [{
|
|
10008
|
+
type: NgModule,
|
|
10009
|
+
args: [{
|
|
10010
|
+
imports: [MDCheckBox],
|
|
10011
|
+
exports: [MDCheckBox],
|
|
10012
|
+
}]
|
|
10013
|
+
}] });
|
|
10014
|
+
|
|
9536
10015
|
/**
|
|
9537
10016
|
* Generated bundle index. Do not edit.
|
|
9538
10017
|
*/
|
|
9539
10018
|
|
|
9540
|
-
export { ACCORDION,
|
|
10019
|
+
export { ACCORDION, CARD_CONFIG, CardSimpleComponent, CentralPageComponent, CentralPageRowComponent, CollapseComponent, CollapseSetComponent, DIALOG_DATA, DIALOG_DEFAULT_OPTIONS, DIALOG_SCROLL_STRATEGY, DialogState, EXPANSION_PANEL_DEFAULT_OPTIONS, ErrorStateMatcher, ExpansionPanelActionRow, ExpansionPanelDescription, ExpansionPanelTitle, FillComponent, FilteredFieldContainerComponent, FilteredFieldItemComponent, FilteredFieldService, FiltredItemModel, INK_BAR_POSITIONER, INK_BAR_POSITIONER_FACTORY, InkBar, MDAccordion, MDCard, MDCardActions, MDCardAvatar, MDCardContent, MDCardFooter, MDCardHeader, MDCardImage, MDCardLgImage, MDCardMdImage, MDCardModule, MDCardSmImage, MDCardSubtitle, MDCardTitle, MDCardTitleGroup, MDCardXlImage, MDCheckBox, MDCheckBoxModule, MDCheckboxChange, MDCollapseModule, MDDialog, MDDialogActions, MDDialogClose, MDDialogContainer, MDDialogContent, MDDialogTitle, MDExpansionPanel, MDExpansionPanelContent, MDExpansionPanelHeader, MDModalModule, MDOption, MDOptionGroup, MDOptionSelectionChange, MDSelect, MDSelectModule, MDSelectTrigger, MDStep, MDStepContent, MDStepExecutorModule, MDStepFooter, MDStepHeader, MDStepLabel, MDStepper, MDStepperIcon, MDStepperNext, MDStepperPrevious, MDSwitch, MDSwitchModule, MDTab, MDTabBody, MDTabChangeEvent, MDTabContent, MDTabGroup, MDTabHeader, MDTabLabel, MDTabLabelWrapper, MDTabsModule, MD_EXPANSION_PANEL, MD_SELECT_TRIGGER, MD_TAB, MD_TAB_LABEL, ManagePageComponent, MefDevCardModule, MefDevCollapseModule, MefDevDialogConfig, MefDevDialogRef, MefDevDropDownMenuModule, MefDevFilteredFieldModule, MefDevModalModule, MefDevOptionComponent, MefDevPageLayoutsModule, MefDevProgressComponent, MefDevProgressModule, MefDevSelectComponent, MefDevSelectModule, MefDevStepExecutorModule, MefDevSwitchComponent, MefDevSwitchModule, MefDevTabBodyComponent, MefDevTabComponent, MefDevTabLabelDirective, MefDevTabSetComponent, MefDevTabsInkBarDirective, MefDevTabsModule, MefDevTabsNavComponent, MefdevDropdownMenuComponent, MefdevExecutorPageComponent, OptionPipe, PaginatedTabHeader, ProgressConfig, PseudoCheckbox, RightFilterComponent, STEPPER_INTL_PROVIDER, STEPPER_INTL_PROVIDER_FACTORY, SelectChange, ShowOnDirtyErrorStateMatcher, SlideRightComponent, SlideUpComponent, StageComponent, StepExecutorComponent, StepperIntl, TABS_CONFIG, TAB_CONTENT, TAB_GROUP, TabBodyPortal, TabChangeEvent, TablePageComponent, TransitionCheckState, _closeDialogVia, _countGroupLabelsBeforeOption, _getOptionScrollPosition, components, mefDevCardComponents, mefDevCollapseModuleComponents };
|
|
9541
10020
|
//# sourceMappingURL=natec-mef-dev-ui-kit.mjs.map
|