@tedi-design-system/angular 4.1.0 → 4.1.1-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/community/components/form/checkbox/checkbox/checkbox.component.d.ts +2 -2
  2. package/community/components/form/checkbox/checkbox/checkbox.component.d.ts.map +1 -1
  3. package/fesm2022/tedi-design-system-angular-community.mjs +6 -5
  4. package/fesm2022/tedi-design-system-angular-community.mjs.map +1 -1
  5. package/package.json +1 -1
package/community/components/form/checkbox/checkbox/checkbox.component.d.ts CHANGED
@@ -6,7 +6,7 @@ export type CheckboxSize = "default" | "large";
6
6
  export declare class CheckboxComponent implements ControlValueAccessor, OnInit {
7
7
  inputId: import("@angular/core").InputSignal<string>;
8
8
  checked: import("@angular/core").ModelSignal<boolean | null>;
9
- indeterminate: import("@angular/core").InputSignal<boolean | undefined>;
9
+ indeterminate: import("@angular/core").ModelSignal<boolean | undefined>;
10
10
  value: import("@angular/core").InputSignal<string | undefined>;
11
11
  disabled: import("@angular/core").ModelSignal<boolean | undefined>;
12
12
  size: import("@angular/core").InputSignal<CheckboxSize | undefined>;
@@ -33,6 +33,6 @@ export declare class CheckboxComponent implements ControlValueAccessor, OnInit {
33
33
  onInputChange(event: Event): void;
34
34
  ngOnInit(): void;
35
35
  static ɵfac: i0.ɵɵFactoryDeclaration<CheckboxComponent, never>;
36
- static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "tedi-checkbox", never, { "inputId": { "alias": "inputId"; "required": true; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; "feedbackText": { "alias": "feedbackText"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "disabled": "disabledChange"; }, never, ["*"], true, never>;
36
+ static ɵcmp: i0.ɵɵComponentDeclaration<CheckboxComponent, "tedi-checkbox", never, { "inputId": { "alias": "inputId"; "required": true; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "hasError": { "alias": "hasError"; "required": false; "isSignal": true; }; "feedbackText": { "alias": "feedbackText"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; "indeterminate": "indeterminateChange"; "disabled": "disabledChange"; }, never, ["*"], true, never>;
37
37
  }
38
38
  //# sourceMappingURL=checkbox.component.d.ts.map
package/community/components/form/checkbox/checkbox/checkbox.component.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"checkbox.component.d.ts","sourceRoot":"","sources":["../../../../../../community/components/form/checkbox/checkbox/checkbox.component.ts"],"names":[],"mappings":"AAAA,OAAO,EASL,MAAM,EAGP,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,eAAe,EAEf,qBAAqB,EACtB,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAE,oBAAoB,EAAqB,MAAM,gBAAgB,CAAC;;AAIzE,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,CAAC;AAE/C,qBAqBa,iBAAkB,YAAW,oBAAoB,EAAE,MAAM;IAIpE,OAAO,8CAA4B;IAInC,OAAO,sDAA+B;IAItC,aAAa,2DAAoB;IAIjC,KAAK,0DAAmB;IAIxB,QAAQ,2DAAoB;IAI5B,IAAI,gEAAyB;IAI7B,QAAQ,2DAAoB;IAC5B;;OAEG;IACH,YAAY,0FAAmD;IAE/D,OAAO,CAAC,QAAQ,CAA6D;IAC7E,OAAO,CAAC,aAAa,CAAsD;IAC3E,OAAO,CAAC,iBAAiB,CAEtB;IAEH,OAAO,CAAC,SAAS,CAAoC;IACrD,UAAU,EAAE,MAAM,IAAI,CAAY;IAElC,cAAc,qDAKX;IAEH,aAAa,iEAQV;IAEH,YAAY,2DAET;IAEH,QAAQ,0CAEL;IAEH,gBAAgB,sDAEb;IAEH,KAAK;IAIL,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,GAAG,IAAI;IAIvC,gBAAgB,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,GAAG,IAAI;IAIlD,iBAAiB,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,IAAI;IAIvC,gBAAgB,CAAC,UAAU,EAAE,OAAO,GAAG,IAAI;IAI3C,aAAa,CAAC,KAAK,EAAE,KAAK;IAO1B,QAAQ;yCAnGG,iBAAiB;2CAAjB,iBAAiB;CAwG7B"}
1
+ {"version":3,"file":"checkbox.component.d.ts","sourceRoot":"","sources":["../../../../../../community/components/form/checkbox/checkbox/checkbox.component.ts"],"names":[],"mappings":"AAAA,OAAO,EASL,MAAM,EAGP,MAAM,eAAe,CAAC;AACvB,OAAO,EACL,eAAe,EAEf,qBAAqB,EACtB,MAAM,kCAAkC,CAAC;AAE1C,OAAO,EAAE,oBAAoB,EAAqB,MAAM,gBAAgB,CAAC;;AAIzE,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,OAAO,CAAC;AAE/C,qBAqBa,iBAAkB,YAAW,oBAAoB,EAAE,MAAM;IAIpE,OAAO,8CAA4B;IAInC,OAAO,sDAA+B;IAItC,aAAa,2DAAoB;IAIjC,KAAK,0DAAmB;IAIxB,QAAQ,2DAAoB;IAI5B,IAAI,gEAAyB;IAI7B,QAAQ,2DAAoB;IAC5B;;OAEG;IACH,YAAY,0FAAmD;IAE/D,OAAO,CAAC,QAAQ,CAA6D;IAC7E,OAAO,CAAC,aAAa,CAAsD;IAC3E,OAAO,CAAC,iBAAiB,CAEtB;IAEH,OAAO,CAAC,SAAS,CAAoC;IACrD,UAAU,EAAE,MAAM,IAAI,CAAY;IAElC,cAAc,qDAKX;IAEH,aAAa,iEAQV;IAEH,YAAY,2DAET;IAEH,QAAQ,0CAEL;IAEH,gBAAgB,sDAEb;IAEH,KAAK;IAIL,UAAU,CAAC,KAAK,EAAE,OAAO,GAAG,IAAI,GAAG,IAAI;IAIvC,gBAAgB,CAAC,EAAE,EAAE,CAAC,GAAG,EAAE,OAAO,KAAK,IAAI,GAAG,IAAI;IAIlD,iBAAiB,CAAC,EAAE,EAAE,MAAM,IAAI,GAAG,IAAI;IAIvC,gBAAgB,CAAC,UAAU,EAAE,OAAO,GAAG,IAAI;IAI3C,aAAa,CAAC,KAAK,EAAE,KAAK;IAQ1B,QAAQ;yCApGG,iBAAiB;2CAAjB,iBAAiB;CAyG7B"}
package/fesm2022/tedi-design-system-angular-community.mjs CHANGED
@@ -575,7 +575,7 @@ class CheckboxComponent {
575
575
  /*
576
576
  * Whether checkbox is indeterminate.
577
577
  */
578
- indeterminate = input();
578
+ indeterminate = model();
579
579
  /*
580
580
  * Checkbox value. For use in checkbox card group
581
581
  */
@@ -647,6 +647,7 @@ class CheckboxComponent {
647
647
  this._onChange(checked);
648
648
  this.checked.set(checked);
649
649
  this.checkboxCardGroup?.onCheckboxChange(checked, this.value());
650
+ this.indeterminate.set(false);
650
651
  }
651
652
  ngOnInit() {
652
653
  if (this.checked()) {
@@ -654,13 +655,13 @@ class CheckboxComponent {
654
655
  }
655
656
  }
656
657
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
657
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: CheckboxComponent, isStandalone: true, selector: "tedi-checkbox", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", disabled: "disabledChange" }, host: { properties: { "class.tedi-checkbox": "true", "class.tedi-checkbox--error": "hasError() || cardGroup?.hasError()", "class.tedi-checkbox--large": "checkboxSize() === 'large'" } }, providers: [
658
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.15", type: CheckboxComponent, isStandalone: true, selector: "tedi-checkbox", inputs: { inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: true, isRequired: true, transformFunction: null }, checked: { classPropertyName: "checked", publicName: "checked", isSignal: true, isRequired: false, transformFunction: null }, indeterminate: { classPropertyName: "indeterminate", publicName: "indeterminate", isSignal: true, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, hasError: { classPropertyName: "hasError", publicName: "hasError", isSignal: true, isRequired: false, transformFunction: null }, feedbackText: { classPropertyName: "feedbackText", publicName: "feedbackText", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { checked: "checkedChange", indeterminate: "indeterminateChange", disabled: "disabledChange" }, host: { properties: { "class.tedi-checkbox": "true", "class.tedi-checkbox--error": "hasError() || cardGroup?.hasError()", "class.tedi-checkbox--large": "checkboxSize() === 'large'" } }, providers: [
658
659
  {
659
660
  provide: NG_VALUE_ACCESSOR,
660
661
  useExisting: forwardRef(() => CheckboxComponent),
661
662
  multi: true,
662
663
  },
663
- ], viewQueries: [{ propertyName: "_inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"tedi-checkbox__input-area\">\n <input\n class=\"tedi-checkbox__input\"\n type=\"checkbox\"\n #input\n [id]=\"inputId()\"\n [checked]=\"checked()\"\n [disabled]=\"checkboxDisabled()\"\n [attr.aria-describedby]=\"feedbackTextId()\"\n [indeterminate]=\"indeterminate()\"\n (change)=\"onInputChange($event)\"\n (blur)=\"_onTouched()\"\n />\n <div class=\"tedi-checkbox__indicator\">\n @if (indicatorIcon(); as iconName) {\n <tedi-icon [name]=\"iconName\" color=\"white\" [size]=\"iconSize()\" />\n }\n </div>\n</div>\n<label [for]=\"inputId()\" class=\"tedi-checkbox__label\">\n <ng-content></ng-content>\n</label>\n@if (feedbackText(); as feedback) {\n <tedi-feedback-text\n [id]=\"feedbackTextId()\"\n [text]=\"feedback.text\"\n [type]=\"feedback.type\"\n [position]=\"feedback.position\"\n />\n}\n", styles: [".tedi-checkbox{--_checkbox-bg: var(--form-checkbox-radio-default-background-default);--_checkbox-border: var(--form-checkbox-radio-default-border-default);--_checkbox-label-color: var(--general-text-primary);--_checkbox-check-color: var(--_checkbox-border);display:grid;grid-template-areas:\"input-area label\" \". feedback\";grid-template-columns:auto 1fr;align-items:center}.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-desktop)}}.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-desktop)}}.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-desktop)}}.tedi-checkbox{--_label-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-checkbox{--_label-size: var(--body-regular-size-desktop)}}.tedi-checkbox tedi-icon{-webkit-user-select:none;user-select:none}.tedi-checkbox__input-area{position:relative;grid-area:input-area}.tedi-checkbox__input{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0;opacity:0;z-index:1}.tedi-checkbox__indicator{position:relative;width:var(--_checkbox-size);height:var(--_checkbox-size);border-radius:var(--_checkbox-radius);border:1px solid var(--_checkbox-border);background:var(--_checkbox-bg);margin-right:var(--_checkbox-inner-spacing);display:flex;align-items:center;justify-content:center}.tedi-checkbox__label{color:var(--_checkbox-label-color);font-size:var(--_label-size);grid-area:label}.tedi-checkbox__label{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-checkbox__label{font-family:var(--family-primary-desktop)}}.tedi-checkbox:has(input:checked){--_checkbox-bg: var(--form-checkbox-radio-default-background-selected);--_checkbox-border: var(--form-checkbox-radio-default-border-selected)}.tedi-checkbox:has(input:hover,input:focus-visible) .tedi-checkbox__indicator{outline:1px solid var(--_checkbox-border)}.tedi-checkbox:has(input:hover,input:focus-visible){--_checkbox-border: var(--form-checkbox-radio-default-border-hover)}.tedi-checkbox:has(input:active){--_checkbox-border: var(--form-checkbox-radio-default-border-active);--_checkbox-bg: var(--form-checkbox-radio-default-background-active)}.tedi-checkbox:has(input:disabled){pointer-events:none;--_checkbox-label-color: var(--general-text-disabled);--_checkbox-bg: var(--form-input-background-disabled);--_checkbox-border: var(--form-input-border-disabled)}.tedi-checkbox:has(input:disabled:checked){--_checkbox-bg: var( --form-checkbox-radio-default-background-selected-disabled );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-disabled )}.tedi-checkbox--error{--_checkbox-bg: var(--form-checkbox-radio-default-background-error);--_checkbox-border: var(--form-general-feedback-error-border)}.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-mobile)}@media (min-width: 576px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-tablet)}}@media (min-width: 992px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-desktop)}}.tedi-checkbox .tedi-feedback-text{grid-area:feedback}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
664
+ ], viewQueries: [{ propertyName: "_inputEl", first: true, predicate: ["input"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"tedi-checkbox__input-area\">\n <input\n class=\"tedi-checkbox__input\"\n type=\"checkbox\"\n #input\n [id]=\"inputId()\"\n [checked]=\"checked()\"\n [disabled]=\"checkboxDisabled()\"\n [attr.aria-describedby]=\"feedbackTextId()\"\n [indeterminate]=\"indeterminate()\"\n (change)=\"onInputChange($event)\"\n (blur)=\"_onTouched()\"\n />\n <div class=\"tedi-checkbox__indicator\">\n @if (indicatorIcon(); as iconName) {\n <tedi-icon [name]=\"iconName\" color=\"white\" [size]=\"iconSize()\" />\n }\n </div>\n</div>\n<label [for]=\"inputId()\" class=\"tedi-checkbox__label\">\n <ng-content></ng-content>\n</label>\n@if (feedbackText(); as feedback) {\n <tedi-feedback-text\n [id]=\"feedbackTextId()\"\n [text]=\"feedback.text\"\n [type]=\"feedback.type\"\n [position]=\"feedback.position\"\n />\n}\n", styles: [".tedi-checkbox{--_checkbox-bg: var(--form-checkbox-radio-default-background-default);--_checkbox-border: var(--form-checkbox-radio-default-border-default);--_checkbox-label-color: var(--general-text-primary);--_checkbox-check-color: var(--_checkbox-border);display:grid;grid-template-areas:\"input-area label\" \". feedback\";grid-template-columns:auto 1fr;align-items:center}.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-desktop)}}.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-desktop)}}.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-desktop)}}.tedi-checkbox{--_label-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-checkbox{--_label-size: var(--body-regular-size-desktop)}}.tedi-checkbox tedi-icon{-webkit-user-select:none;user-select:none}.tedi-checkbox__input-area{position:relative;grid-area:input-area}.tedi-checkbox__input{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0;opacity:0;z-index:1}.tedi-checkbox__indicator{position:relative;width:var(--_checkbox-size);height:var(--_checkbox-size);border-radius:var(--_checkbox-radius);border:1px solid var(--_checkbox-border);background:var(--_checkbox-bg);margin-right:var(--_checkbox-inner-spacing);display:flex;align-items:center;justify-content:center}.tedi-checkbox__label{color:var(--_checkbox-label-color);font-size:var(--_label-size);grid-area:label}.tedi-checkbox__label{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-checkbox__label{font-family:var(--family-primary-desktop)}}.tedi-checkbox:has(input:checked,input:indeterminate){--_checkbox-bg: var(--form-checkbox-radio-default-background-selected);--_checkbox-border: var(--form-checkbox-radio-default-border-selected)}.tedi-checkbox:has(input:hover,input:focus-visible) .tedi-checkbox__indicator{outline:1px solid var(--_checkbox-border)}.tedi-checkbox:has(input:hover,input:focus-visible){--_checkbox-border: var(--form-checkbox-radio-default-border-hover)}.tedi-checkbox:has(input:active){--_checkbox-border: var(--form-checkbox-radio-default-border-active);--_checkbox-bg: var(--form-checkbox-radio-default-background-active)}.tedi-checkbox:has(input:disabled){pointer-events:none;--_checkbox-label-color: var(--general-text-disabled);--_checkbox-bg: var(--form-input-background-disabled);--_checkbox-border: var(--form-input-border-disabled)}.tedi-checkbox:has(input:disabled:checked){--_checkbox-bg: var( --form-checkbox-radio-default-background-selected-disabled );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-disabled )}.tedi-checkbox--error{--_checkbox-bg: var(--form-checkbox-radio-default-background-error);--_checkbox-border: var(--form-general-feedback-error-border)}.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-mobile)}@media (min-width: 576px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-tablet)}}@media (min-width: 992px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-desktop)}}.tedi-checkbox .tedi-feedback-text{grid-area:feedback}\n"], dependencies: [{ kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
664
665
  }
665
666
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: CheckboxComponent, decorators: [{
666
667
  type: Component,
@@ -674,7 +675,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImpo
674
675
  "[class.tedi-checkbox]": "true",
675
676
  "[class.tedi-checkbox--error]": "hasError() || cardGroup?.hasError()",
676
677
  "[class.tedi-checkbox--large]": "checkboxSize() === 'large'",
677
- }, template: "<div class=\"tedi-checkbox__input-area\">\n <input\n class=\"tedi-checkbox__input\"\n type=\"checkbox\"\n #input\n [id]=\"inputId()\"\n [checked]=\"checked()\"\n [disabled]=\"checkboxDisabled()\"\n [attr.aria-describedby]=\"feedbackTextId()\"\n [indeterminate]=\"indeterminate()\"\n (change)=\"onInputChange($event)\"\n (blur)=\"_onTouched()\"\n />\n <div class=\"tedi-checkbox__indicator\">\n @if (indicatorIcon(); as iconName) {\n <tedi-icon [name]=\"iconName\" color=\"white\" [size]=\"iconSize()\" />\n }\n </div>\n</div>\n<label [for]=\"inputId()\" class=\"tedi-checkbox__label\">\n <ng-content></ng-content>\n</label>\n@if (feedbackText(); as feedback) {\n <tedi-feedback-text\n [id]=\"feedbackTextId()\"\n [text]=\"feedback.text\"\n [type]=\"feedback.type\"\n [position]=\"feedback.position\"\n />\n}\n", styles: [".tedi-checkbox{--_checkbox-bg: var(--form-checkbox-radio-default-background-default);--_checkbox-border: var(--form-checkbox-radio-default-border-default);--_checkbox-label-color: var(--general-text-primary);--_checkbox-check-color: var(--_checkbox-border);display:grid;grid-template-areas:\"input-area label\" \". feedback\";grid-template-columns:auto 1fr;align-items:center}.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-desktop)}}.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-desktop)}}.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-desktop)}}.tedi-checkbox{--_label-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-checkbox{--_label-size: var(--body-regular-size-desktop)}}.tedi-checkbox tedi-icon{-webkit-user-select:none;user-select:none}.tedi-checkbox__input-area{position:relative;grid-area:input-area}.tedi-checkbox__input{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0;opacity:0;z-index:1}.tedi-checkbox__indicator{position:relative;width:var(--_checkbox-size);height:var(--_checkbox-size);border-radius:var(--_checkbox-radius);border:1px solid var(--_checkbox-border);background:var(--_checkbox-bg);margin-right:var(--_checkbox-inner-spacing);display:flex;align-items:center;justify-content:center}.tedi-checkbox__label{color:var(--_checkbox-label-color);font-size:var(--_label-size);grid-area:label}.tedi-checkbox__label{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-checkbox__label{font-family:var(--family-primary-desktop)}}.tedi-checkbox:has(input:checked){--_checkbox-bg: var(--form-checkbox-radio-default-background-selected);--_checkbox-border: var(--form-checkbox-radio-default-border-selected)}.tedi-checkbox:has(input:hover,input:focus-visible) .tedi-checkbox__indicator{outline:1px solid var(--_checkbox-border)}.tedi-checkbox:has(input:hover,input:focus-visible){--_checkbox-border: var(--form-checkbox-radio-default-border-hover)}.tedi-checkbox:has(input:active){--_checkbox-border: var(--form-checkbox-radio-default-border-active);--_checkbox-bg: var(--form-checkbox-radio-default-background-active)}.tedi-checkbox:has(input:disabled){pointer-events:none;--_checkbox-label-color: var(--general-text-disabled);--_checkbox-bg: var(--form-input-background-disabled);--_checkbox-border: var(--form-input-border-disabled)}.tedi-checkbox:has(input:disabled:checked){--_checkbox-bg: var( --form-checkbox-radio-default-background-selected-disabled );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-disabled )}.tedi-checkbox--error{--_checkbox-bg: var(--form-checkbox-radio-default-background-error);--_checkbox-border: var(--form-general-feedback-error-border)}.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-mobile)}@media (min-width: 576px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-tablet)}}@media (min-width: 992px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-desktop)}}.tedi-checkbox .tedi-feedback-text{grid-area:feedback}\n"] }]
678
+ }, template: "<div class=\"tedi-checkbox__input-area\">\n <input\n class=\"tedi-checkbox__input\"\n type=\"checkbox\"\n #input\n [id]=\"inputId()\"\n [checked]=\"checked()\"\n [disabled]=\"checkboxDisabled()\"\n [attr.aria-describedby]=\"feedbackTextId()\"\n [indeterminate]=\"indeterminate()\"\n (change)=\"onInputChange($event)\"\n (blur)=\"_onTouched()\"\n />\n <div class=\"tedi-checkbox__indicator\">\n @if (indicatorIcon(); as iconName) {\n <tedi-icon [name]=\"iconName\" color=\"white\" [size]=\"iconSize()\" />\n }\n </div>\n</div>\n<label [for]=\"inputId()\" class=\"tedi-checkbox__label\">\n <ng-content></ng-content>\n</label>\n@if (feedbackText(); as feedback) {\n <tedi-feedback-text\n [id]=\"feedbackTextId()\"\n [text]=\"feedback.text\"\n [type]=\"feedback.type\"\n [position]=\"feedback.position\"\n />\n}\n", styles: [".tedi-checkbox{--_checkbox-bg: var(--form-checkbox-radio-default-background-default);--_checkbox-border: var(--form-checkbox-radio-default-border-default);--_checkbox-label-color: var(--general-text-primary);--_checkbox-check-color: var(--_checkbox-border);display:grid;grid-template-areas:\"input-area label\" \". feedback\";grid-template-columns:auto 1fr;align-items:center}.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-inner-spacing: var(--form-checkbox-radio-inner-spacing-desktop)}}.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-size: var(--form-checkbox-radio-size-responsive-desktop)}}.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-mobile)}@media (min-width: 576px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-tablet)}}@media (min-width: 992px){.tedi-checkbox{--_checkbox-radius: var(--form-checkbox-radio-indicator-radius-checkbox-desktop)}}.tedi-checkbox{--_label-size: var(--body-regular-size-mobile)}@media (min-width: 992px){.tedi-checkbox{--_label-size: var(--body-regular-size-desktop)}}.tedi-checkbox tedi-icon{-webkit-user-select:none;user-select:none}.tedi-checkbox__input-area{position:relative;grid-area:input-area}.tedi-checkbox__input{position:absolute;top:0;left:0;height:100%;width:100%;margin:0;padding:0;opacity:0;z-index:1}.tedi-checkbox__indicator{position:relative;width:var(--_checkbox-size);height:var(--_checkbox-size);border-radius:var(--_checkbox-radius);border:1px solid var(--_checkbox-border);background:var(--_checkbox-bg);margin-right:var(--_checkbox-inner-spacing);display:flex;align-items:center;justify-content:center}.tedi-checkbox__label{color:var(--_checkbox-label-color);font-size:var(--_label-size);grid-area:label}.tedi-checkbox__label{font-family:var(--family-primary-mobile)}@media (min-width: 992px){.tedi-checkbox__label{font-family:var(--family-primary-desktop)}}.tedi-checkbox:has(input:checked,input:indeterminate){--_checkbox-bg: var(--form-checkbox-radio-default-background-selected);--_checkbox-border: var(--form-checkbox-radio-default-border-selected)}.tedi-checkbox:has(input:hover,input:focus-visible) .tedi-checkbox__indicator{outline:1px solid var(--_checkbox-border)}.tedi-checkbox:has(input:hover,input:focus-visible){--_checkbox-border: var(--form-checkbox-radio-default-border-hover)}.tedi-checkbox:has(input:active){--_checkbox-border: var(--form-checkbox-radio-default-border-active);--_checkbox-bg: var(--form-checkbox-radio-default-background-active)}.tedi-checkbox:has(input:disabled){pointer-events:none;--_checkbox-label-color: var(--general-text-disabled);--_checkbox-bg: var(--form-input-background-disabled);--_checkbox-border: var(--form-input-border-disabled)}.tedi-checkbox:has(input:disabled:checked){--_checkbox-bg: var( --form-checkbox-radio-default-background-selected-disabled );--_checkbox-border: var( --form-checkbox-radio-default-border-selected-disabled )}.tedi-checkbox--error{--_checkbox-bg: var(--form-checkbox-radio-default-background-error);--_checkbox-border: var(--form-general-feedback-error-border)}.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-mobile)}@media (min-width: 576px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-tablet)}}@media (min-width: 992px){.tedi-checkbox--large{--_checkbox-size: var(--form-checkbox-radio-size-large-desktop)}}.tedi-checkbox .tedi-feedback-text{grid-area:feedback}\n"] }]
678
679
  }] });
679
680
 
680
681
  class FormFieldComponent {
@@ -1797,7 +1798,7 @@ class MultiselectComponent {
1797
1798
  useExisting: forwardRef(() => MultiselectComponent),
1798
1799
  multi: true,
1799
1800
  },
1800
- ], queries: [{ propertyName: "options", predicate: SelectOptionComponent, isSignal: true }], viewQueries: [{ propertyName: "listboxRef", first: true, predicate: CdkListbox, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "triggerRef", first: true, predicate: CdkOverlayOrigin, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@let listboxId = inputId() + \"-listbox\";\n@let labelId = inputId() + \"-label\";\n\n@if (label()) {\n <label\n [id]=\"labelId\"\n tedi-label\n [for]=\"inputId()\"\n [required]=\"required()\"\n [size]=\"size()\"\n >\n {{ label() }}\n </label>\n}\n<div\n [id]=\"inputId()\"\n class=\"tedi-select__trigger\"\n [class.tedi-input--disabled]=\"disabled()\"\n tedi-input\n cdkOverlayOrigin\n #trigger=\"cdkOverlayOrigin\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-controls]=\"listboxId\"\n [attr.aria-labelledby]=\"labelId\"\n [tabindex]=\"disabled() ? -1 : 0\"\n [state]=\"state()\"\n [size]=\"size()\"\n (click)=\"toggleIsOpen()\"\n (keydown.enter)=\"toggleIsOpen()\"\n (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n (blur)=\"onTouched()\"\n>\n <span class=\"tedi-select__label\">\n @if (selectedOptions().length) {\n <div\n class=\"tedi-select__multiselect-container\"\n [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n >\n @for (value of selectedOptions(); track value) {\n <tedi-tag\n [closable]=\"clearableTags()\"\n (closed)=\"deselect($event, value)\"\n >\n {{ getLabel(value) }}\n </tedi-tag>\n }\n </div>\n } @else {\n <span class=\"tedi-select__label--placeholder\">\n {{ placeholder() }}\n </span>\n }\n </span>\n\n @if (clearable() && selectedOptions().length) {\n <button\n class=\"tedi-select__clear\"\n tedi-closing-button\n type=\"button\"\n size=\"small\"\n [iconSize]=\"18\"\n title=\"Clear\"\n (click)=\"clear($event)\"\n ></button>\n }\n\n <tedi-icon class=\"tedi-select__arrow\" name=\"arrow_drop_down\" />\n</div>\n@if (feedbackText(); as feedback) {\n <tedi-feedback-text\n [text]=\"feedback.text\"\n [type]=\"feedback.type\"\n [position]=\"feedback.position\"\n />\n}\n\n<ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"isOpen()\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n (backdropClick)=\"toggleIsOpen(false)\"\n (detach)=\"toggleIsOpen(false)\"\n>\n <tedi-card\n class=\"tedi-select__dropdown\"\n spacing=\"none\"\n [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n >\n <tedi-card-content>\n <ul\n [id]=\"listboxId\"\n class=\"tedi-select__options\"\n cdkListbox\n cdkListboxMultiple\n [cdkListboxValue]=\"selectedOptions()\"\n (cdkListboxValueChange)=\"handleValueChange($event)\"\n #listbox=\"cdkListbox\"\n >\n @if (options().length) {\n @if (selectAll()) {\n <li\n tedi-dropdown-item\n [cdkOption]=\"specialOptionControls.SELECT_ALL\"\n >\n <tedi-checkbox\n class=\"tedi-select__multiselect-checkbox\"\n [inputId]=\"inputId() + '-select-all'\"\n [checked]=\"allOptionsSelected()\"\n >\n {{ \"select.select-all\" | tediTranslate }}\n </tedi-checkbox>\n </li>\n }\n\n @for (group of optionGroups(); track $index) {\n @if (group.label.length) {\n @if (selectableGroups()) {\n <li\n tedi-dropdown-item\n class=\"tedi-select__group-name tedi-select__group-name--selectable\"\n [cdkOption]=\"specialOptionControls.SELECTGROUP + group.label\"\n >\n <div class=\"tedi-select__group-checkbox\">\n <tedi-checkbox\n class=\"tedi-select__multiselect-checkbox\"\n [inputId]=\"'group-' + group.label\"\n [checked]=\"isGroupSelected(group.label)\"\n >\n <span tedi-text color=\"tertiary\">\n {{ group.label }}\n </span>\n </tedi-checkbox>\n </div>\n </li>\n } @else {\n <li\n tedi-dropdown-item\n class=\"tedi-select__group-name\"\n role=\"presentation\"\n >\n <span tedi-text color=\"tertiary\">\n {{ group.label }}\n </span>\n </li>\n }\n }\n\n @for (option of group.options; track option.value()) {\n <li\n tedi-dropdown-item\n [cdkOption]=\"option.value()\"\n [cdkOptionDisabled]=\"option.disabled()\"\n [disabled]=\"option.disabled()\"\n >\n <tedi-checkbox\n class=\"tedi-select__multiselect-checkbox\"\n [inputId]=\"'option-' + option.value()\"\n [checked]=\"isOptionSelected(option.value())\"\n >\n @if (option.templateRef(); as optionTemplate) {\n <span class=\"tedi-select__dropdown-item--custom-content\">\n <ng-container [ngTemplateOutlet]=\"optionTemplate\" />\n </span>\n <span class=\"tedi-select__dropdown-item--label\">\n {{ option.label() }}\n </span>\n } @else {\n {{ option.label() }}\n }\n </tedi-checkbox>\n </li>\n }\n }\n } @else {\n <li tedi-dropdown-item class=\"tedi-select__no-options\">\n {{ \"select.no-options\" | tediTranslate }}\n </li>\n }\n </ul>\n </tedi-card-content>\n </tedi-card>\n</ng-template>\n", styles: [".tedi-select{display:block;width:100%}.tedi-select{--_inner-gap: var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-desktop)}}.tedi-select__trigger{display:flex;width:100%;justify-content:space-between}.tedi-select__label{overflow:hidden;text-align:left;flex-grow:1;cursor:default}.tedi-select__label--placeholder{pointer-events:none;color:var(--_placeholder-color)}.tedi-select__clear{padding:0;margin:0;border:none;background:none;flex-grow:0;color:var(--button-close-text-default);cursor:pointer}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{flex-grow:0;cursor:default}.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__dropdown{box-shadow:0 1px 5px 0 var(--alpha-20)}.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-desktop)}}.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-desktop)}}.tedi-select__options{margin:0;padding:0;max-height:300px;overflow-y:auto}.tedi-select__options:focus .cdk-option-active{background:var(--dropdown-item-hover-background);color:var(--dropdown-item-hover-text)}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;text-transform:uppercase;letter-spacing:0px;padding:8px 12px 4px}.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-desktop)}}.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-desktop)}}.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-mobile)}@media (min-width: 576px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-tablet)}}@media (min-width: 992px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-desktop)}}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-mobile)}@media (min-width: 576px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-tablet)}}@media (min-width: 992px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-desktop)}}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex-wrap:wrap;gap:var(--_inner-gap)}.tedi-select__multiselect-container--single-row{overflow:hidden;flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-checkbox{pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.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: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "ngmodule", type: CdkListboxModule }, { kind: "directive", type: i3.CdkListbox, selector: "[cdkListbox]", inputs: ["id", "tabindex", "cdkListboxValue", "cdkListboxMultiple", "cdkListboxDisabled", "cdkListboxUseActiveDescendant", "cdkListboxOrientation", "cdkListboxCompareWith", "cdkListboxNavigationWrapDisabled", "cdkListboxNavigatesDisabledOptions"], outputs: ["cdkListboxValueChange"], exportAs: ["cdkListbox"] }, { kind: "directive", type: i3.CdkOption, selector: "[cdkOption]", inputs: ["id", "cdkOption", "cdkOptionTypeaheadLabel", "cdkOptionDisabled", "tabindex"], exportAs: ["cdkOption"] }, { kind: "component", type: InputComponent, selector: "[tedi-input]", inputs: ["size", "state"] }, { kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }, { kind: "component", type: DropdownItemComponent, selector: "[tedi-dropdown-item]", inputs: ["selected", "disabled"], outputs: ["itemSelected"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: LabelComponent, selector: "label[tedi-label]", inputs: ["size", "required", "color"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: CheckboxComponent, selector: "tedi-checkbox", inputs: ["inputId", "checked", "indeterminate", "value", "disabled", "size", "hasError", "feedbackText"], outputs: ["checkedChange", "disabledChange"] }, { kind: "component", type: TagComponent, selector: "tedi-tag", inputs: ["loading", "closable", "type"], outputs: ["closed"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1801
+ ], queries: [{ propertyName: "options", predicate: SelectOptionComponent, isSignal: true }], viewQueries: [{ propertyName: "listboxRef", first: true, predicate: CdkListbox, descendants: true, read: ElementRef, isSignal: true }, { propertyName: "triggerRef", first: true, predicate: CdkOverlayOrigin, descendants: true, read: ElementRef, isSignal: true }], ngImport: i0, template: "@let listboxId = inputId() + \"-listbox\";\n@let labelId = inputId() + \"-label\";\n\n@if (label()) {\n <label\n [id]=\"labelId\"\n tedi-label\n [for]=\"inputId()\"\n [required]=\"required()\"\n [size]=\"size()\"\n >\n {{ label() }}\n </label>\n}\n<div\n [id]=\"inputId()\"\n class=\"tedi-select__trigger\"\n [class.tedi-input--disabled]=\"disabled()\"\n tedi-input\n cdkOverlayOrigin\n #trigger=\"cdkOverlayOrigin\"\n role=\"combobox\"\n aria-haspopup=\"listbox\"\n [attr.aria-expanded]=\"isOpen()\"\n [attr.aria-controls]=\"listboxId\"\n [attr.aria-labelledby]=\"labelId\"\n [tabindex]=\"disabled() ? -1 : 0\"\n [state]=\"state()\"\n [size]=\"size()\"\n (click)=\"toggleIsOpen()\"\n (keydown.enter)=\"toggleIsOpen()\"\n (keydown.space)=\"$event.preventDefault(); toggleIsOpen()\"\n (keydown.arrowdown)=\"$event.preventDefault(); toggleIsOpen()\"\n (blur)=\"onTouched()\"\n>\n <span class=\"tedi-select__label\">\n @if (selectedOptions().length) {\n <div\n class=\"tedi-select__multiselect-container\"\n [class.tedi-select__multiselect-container--single-row]=\"!multiRow()\"\n >\n @for (value of selectedOptions(); track value) {\n <tedi-tag\n [closable]=\"clearableTags()\"\n (closed)=\"deselect($event, value)\"\n >\n {{ getLabel(value) }}\n </tedi-tag>\n }\n </div>\n } @else {\n <span class=\"tedi-select__label--placeholder\">\n {{ placeholder() }}\n </span>\n }\n </span>\n\n @if (clearable() && selectedOptions().length) {\n <button\n class=\"tedi-select__clear\"\n tedi-closing-button\n type=\"button\"\n size=\"small\"\n [iconSize]=\"18\"\n title=\"Clear\"\n (click)=\"clear($event)\"\n ></button>\n }\n\n <tedi-icon class=\"tedi-select__arrow\" name=\"arrow_drop_down\" />\n</div>\n@if (feedbackText(); as feedback) {\n <tedi-feedback-text\n [text]=\"feedback.text\"\n [type]=\"feedback.type\"\n [position]=\"feedback.position\"\n />\n}\n\n<ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"isOpen()\"\n [cdkConnectedOverlayHasBackdrop]=\"true\"\n cdkConnectedOverlayBackdropClass=\"cdk-overlay-transparent-backdrop\"\n (backdropClick)=\"toggleIsOpen(false)\"\n (detach)=\"toggleIsOpen(false)\"\n>\n <tedi-card\n class=\"tedi-select__dropdown\"\n spacing=\"none\"\n [style.width]=\"!!dropdownWidth() ? dropdownWidth() + 'px' : 'auto'\"\n >\n <tedi-card-content>\n <ul\n [id]=\"listboxId\"\n class=\"tedi-select__options\"\n cdkListbox\n cdkListboxMultiple\n [cdkListboxValue]=\"selectedOptions()\"\n (cdkListboxValueChange)=\"handleValueChange($event)\"\n #listbox=\"cdkListbox\"\n >\n @if (options().length) {\n @if (selectAll()) {\n <li\n tedi-dropdown-item\n [cdkOption]=\"specialOptionControls.SELECT_ALL\"\n >\n <tedi-checkbox\n class=\"tedi-select__multiselect-checkbox\"\n [inputId]=\"inputId() + '-select-all'\"\n [checked]=\"allOptionsSelected()\"\n >\n {{ \"select.select-all\" | tediTranslate }}\n </tedi-checkbox>\n </li>\n }\n\n @for (group of optionGroups(); track $index) {\n @if (group.label.length) {\n @if (selectableGroups()) {\n <li\n tedi-dropdown-item\n class=\"tedi-select__group-name tedi-select__group-name--selectable\"\n [cdkOption]=\"specialOptionControls.SELECTGROUP + group.label\"\n >\n <div class=\"tedi-select__group-checkbox\">\n <tedi-checkbox\n class=\"tedi-select__multiselect-checkbox\"\n [inputId]=\"'group-' + group.label\"\n [checked]=\"isGroupSelected(group.label)\"\n >\n <span tedi-text color=\"tertiary\">\n {{ group.label }}\n </span>\n </tedi-checkbox>\n </div>\n </li>\n } @else {\n <li\n tedi-dropdown-item\n class=\"tedi-select__group-name\"\n role=\"presentation\"\n >\n <span tedi-text color=\"tertiary\">\n {{ group.label }}\n </span>\n </li>\n }\n }\n\n @for (option of group.options; track option.value()) {\n <li\n tedi-dropdown-item\n [cdkOption]=\"option.value()\"\n [cdkOptionDisabled]=\"option.disabled()\"\n [disabled]=\"option.disabled()\"\n >\n <tedi-checkbox\n class=\"tedi-select__multiselect-checkbox\"\n [inputId]=\"'option-' + option.value()\"\n [checked]=\"isOptionSelected(option.value())\"\n >\n @if (option.templateRef(); as optionTemplate) {\n <span class=\"tedi-select__dropdown-item--custom-content\">\n <ng-container [ngTemplateOutlet]=\"optionTemplate\" />\n </span>\n <span class=\"tedi-select__dropdown-item--label\">\n {{ option.label() }}\n </span>\n } @else {\n {{ option.label() }}\n }\n </tedi-checkbox>\n </li>\n }\n }\n } @else {\n <li tedi-dropdown-item class=\"tedi-select__no-options\">\n {{ \"select.no-options\" | tediTranslate }}\n </li>\n }\n </ul>\n </tedi-card-content>\n </tedi-card>\n</ng-template>\n", styles: [".tedi-select{display:block;width:100%}.tedi-select{--_inner-gap: var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select{--_inner-gap: var(--form-field-inner-spacing-desktop)}}.tedi-select__trigger{display:flex;width:100%;justify-content:space-between}.tedi-select__label{overflow:hidden;text-align:left;flex-grow:1;cursor:default}.tedi-select__label--placeholder{pointer-events:none;color:var(--_placeholder-color)}.tedi-select__clear{padding:0;margin:0;border:none;background:none;flex-grow:0;color:var(--button-close-text-default);cursor:pointer}.tedi-select__clear+.tedi-select__arrow{border-left:1px solid var(--general-border-primary)}.tedi-select__arrow{flex-grow:0;cursor:default}.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{padding-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-mobile)}@media (min-width: 576px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-tablet)}}@media (min-width: 992px){.tedi-select__arrow{margin-left:var(--form-field-inner-spacing-desktop)}}.tedi-select__dropdown{box-shadow:0 1px 5px 0 var(--alpha-20)}.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-top:var(--form-field-outer-spacing-desktop)}}.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-mobile)}@media (min-width: 576px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-tablet)}}@media (min-width: 992px){.tedi-select__dropdown{margin-bottom:var(--form-field-outer-spacing-desktop)}}.tedi-select__options{margin:0;padding:0;max-height:300px;overflow-y:auto}.tedi-select__options:focus .cdk-option-active{background:var(--dropdown-item-hover-background);color:var(--dropdown-item-hover-text)}.tedi-select__dropdown-item--label{display:none}.tedi-select__dropdown-item--custom-content:empty+.tedi-select__dropdown-item--label{display:block}.tedi-select__group-name{display:block;text-transform:uppercase;letter-spacing:0px;padding:8px 12px 4px}.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-weight:var(--heading-subtitle-small-weight-desktop)}}.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-mobile)}@media (min-width: 576px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-tablet)}}@media (min-width: 992px){.tedi-select__group-name{font-size:var(--heading-subtitle-small-size-desktop)}}.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-mobile)}@media (min-width: 576px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-tablet)}}@media (min-width: 992px){.tedi-select__group-name{line-height:var(--heading-subtitle-small-line-height-desktop)}}.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-mobile)}@media (min-width: 576px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-tablet)}}@media (min-width: 992px){.tedi-select__group-name--selectable~.tedi-dropdown-item:not(.tedi-select__group-name){padding-left:var(--form-checkbox-radio-subitem-padding-left-desktop)}}.tedi-select--multiselect .tedi-select__trigger{align-items:flex-start}.tedi-select__multiselect-container{display:flex;flex-wrap:wrap;gap:var(--_inner-gap)}.tedi-select__multiselect-container--single-row{overflow:hidden;flex-wrap:nowrap}.tedi-select__multiselect-container--single-row .tedi-tag{flex-shrink:0}.tedi-select__multiselect-container--single-row .tedi-tag__content{white-space:nowrap}.tedi-select__multiselect-checkbox{pointer-events:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: OverlayModule }, { kind: "directive", type: i2.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: i2.CdkOverlayOrigin, selector: "[cdk-overlay-origin], [overlay-origin], [cdkOverlayOrigin]", exportAs: ["cdkOverlayOrigin"] }, { kind: "ngmodule", type: CdkListboxModule }, { kind: "directive", type: i3.CdkListbox, selector: "[cdkListbox]", inputs: ["id", "tabindex", "cdkListboxValue", "cdkListboxMultiple", "cdkListboxDisabled", "cdkListboxUseActiveDescendant", "cdkListboxOrientation", "cdkListboxCompareWith", "cdkListboxNavigationWrapDisabled", "cdkListboxNavigatesDisabledOptions"], outputs: ["cdkListboxValueChange"], exportAs: ["cdkListbox"] }, { kind: "directive", type: i3.CdkOption, selector: "[cdkOption]", inputs: ["id", "cdkOption", "cdkOptionTypeaheadLabel", "cdkOptionDisabled", "tabindex"], exportAs: ["cdkOption"] }, { kind: "component", type: InputComponent, selector: "[tedi-input]", inputs: ["size", "state"] }, { kind: "component", type: CardComponent, selector: "tedi-card", inputs: ["borderless", "spacing", "accentBorder", "selected"] }, { kind: "component", type: CardContentComponent, selector: "tedi-card-content", inputs: ["hasSeparator", "autoWidth", "timeline"] }, { kind: "component", type: DropdownItemComponent, selector: "[tedi-dropdown-item]", inputs: ["selected", "disabled"], outputs: ["itemSelected"] }, { kind: "component", type: ClosingButtonComponent, selector: "button[tedi-closing-button]", inputs: ["size", "iconSize"] }, { kind: "component", type: IconComponent, selector: "tedi-icon", inputs: ["name", "size", "color", "background", "variant", "type", "label"] }, { kind: "component", type: LabelComponent, selector: "label[tedi-label]", inputs: ["size", "required", "color"] }, { kind: "component", type: FeedbackTextComponent, selector: "tedi-feedback-text", inputs: ["text", "type", "position"] }, { kind: "component", type: TextComponent, selector: "[tedi-text]", inputs: ["modifiers", "color"] }, { kind: "component", type: CheckboxComponent, selector: "tedi-checkbox", inputs: ["inputId", "checked", "indeterminate", "value", "disabled", "size", "hasError", "feedbackText"], outputs: ["checkedChange", "indeterminateChange", "disabledChange"] }, { kind: "component", type: TagComponent, selector: "tedi-tag", inputs: ["loading", "closable", "type"], outputs: ["closed"] }, { kind: "pipe", type: TediTranslationPipe, name: "tediTranslate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
1801
1802
  }
1802
1803
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.15", ngImport: i0, type: MultiselectComponent, decorators: [{
1803
1804
  type: Component,