primeng 20.0.0-rc.2 → 20.0.0

package/fesm2022/primeng-cascadeselect.mjs

@@ -36,9 +36,9 @@ const classes = {
         'p-cascadeselect p-component p-inputwrapper',
         {
             'p-cascadeselect p-component p-inputwrapper': true,
-            'p-cascadeselect-clearable': instance.showClear && !instance.disabled(),
+            'p-cascadeselect-clearable': instance.showClear && !instance.$disabled(),
             'p-cascadeselect-mobile': instance.queryMatches(),
-            'p-disabled': instance.disabled(),
+            'p-disabled': instance.$disabled(),
             'p-invalid': instance.invalid(),
             'p-focus': instance.focused,
             'p-inputwrapper-filled': instance.modelValue(),
@@ -89,10 +89,10 @@ class CascadeSelectStyle extends BaseStyle {
     theme = theme;
     classes = classes;
     inlineStyles = inlineStyles;
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectStyle });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectStyle, deps: null, target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectStyle });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectStyle, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectStyle, decorators: [{
             type: Injectable
         }] });
 /**
@@ -259,8 +259,8 @@ class CascadeSelectSub extends BaseComponent {
             this.el.nativeElement.children[0].style.left = '-200%';
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectSub, deps: [{ token: CascadeSelect }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.0.6", type: CascadeSelectSub, isStandalone: true, selector: "p-cascadeSelectSub, p-cascadeselect-sub", inputs: { role: "role", selectId: "selectId", activeOptionPath: "activeOptionPath", optionDisabled: "optionDisabled", focusedOptionId: "focusedOptionId", options: "options", optionGroupChildren: "optionGroupChildren", optionTemplate: "optionTemplate", groupicon: "groupicon", level: ["level", "level", numberAttribute], optionLabel: "optionLabel", optionValue: "optionValue", optionGroupLabel: "optionGroupLabel", dirty: ["dirty", "dirty", booleanAttribute], root: ["root", "root", booleanAttribute] }, outputs: { onChange: "onChange", onFocusChange: "onFocusChange", onFocusEnterChange: "onFocusEnterChange" }, providers: [CascadeSelectStyle], usesInheritance: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectSub, deps: [{ token: CascadeSelect }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "16.1.0", version: "20.1.0", type: CascadeSelectSub, isStandalone: true, selector: "p-cascadeSelectSub, p-cascadeselect-sub", inputs: { role: "role", selectId: "selectId", activeOptionPath: "activeOptionPath", optionDisabled: "optionDisabled", focusedOptionId: "focusedOptionId", options: "options", optionGroupChildren: "optionGroupChildren", optionTemplate: "optionTemplate", groupicon: "groupicon", level: ["level", "level", numberAttribute], optionLabel: "optionLabel", optionValue: "optionValue", optionGroupLabel: "optionGroupLabel", dirty: ["dirty", "dirty", booleanAttribute], root: ["root", "root", booleanAttribute] }, outputs: { onChange: "onChange", onFocusChange: "onFocusChange", onFocusEnterChange: "onFocusEnterChange" }, providers: [CascadeSelectStyle], usesInheritance: true, ngImport: i0, template: `
         <ul [class]="cx('list')" [attr.role]="role" aria-orientation="horizontal" [attr.data-pc-section]="level === 0 ? 'list' : 'sublist'" [attr.aria-label]="listLabel">
             <ng-template ngFor let-processedOption [ngForOf]="options" let-i="index">
                 <li
@@ -318,7 +318,7 @@ class CascadeSelectSub extends BaseComponent {
         </ul>
     `, isInline: true, dependencies: [{ kind: "component", type: CascadeSelectSub, selector: "p-cascadeSelectSub, p-cascadeselect-sub", inputs: ["role", "selectId", "activeOptionPath", "optionDisabled", "focusedOptionId", "options", "optionGroupChildren", "optionTemplate", "groupicon", "level", "optionLabel", "optionValue", "optionGroupLabel", "dirty", "root"], outputs: ["onChange", "onFocusChange", "onFocusEnterChange"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: Ripple, selector: "[pRipple]" }, { kind: "component", type: AngleRightIcon, selector: "[data-p-icon=\"angle-right\"]" }, { kind: "ngmodule", type: SharedModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectSub, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectSub, decorators: [{
             type: Component,
             args: [{
                     selector: 'p-cascadeSelectSub, p-cascadeselect-sub',
@@ -606,25 +606,25 @@ class CascadeSelect extends BaseEditableHolder {
      * @defaultValue undefined
      * @group Props
      */
-    size = input();
+    size = input(...(ngDevMode ? [undefined, { debugName: "size" }] : []));
     /**
      * Specifies the input variant of the component.
      * @defaultValue undefined
      * @group Props
      */
-    variant = input();
+    variant = input(...(ngDevMode ? [undefined, { debugName: "variant" }] : []));
     /**
      * Spans 100% width of the container when enabled.
      * @defaultValue undefined
      * @group Props
      */
-    fluid = input(undefined, { transform: booleanAttribute });
+    fluid = input(undefined, ...(ngDevMode ? [{ debugName: "fluid", transform: booleanAttribute }] : [{ transform: booleanAttribute }]));
     /**
      * Target element to attach the overlay, valid values are "body" or a local ng-template variable of another element (note: use binding with brackets for template variables, e.g. [appendTo]="mydiv" for a div element having #mydiv as variable name).
      * @defaultValue 'self'
      * @group Props
      */
-    appendTo = input(undefined);
+    appendTo = input(undefined, ...(ngDevMode ? [{ debugName: "appendTo" }] : []));
     /**
      * Callback to invoke on value change.
      * @param {CascadeSelectChangeEvent} event - Custom change event.
@@ -736,15 +736,13 @@ class CascadeSelect extends BaseEditableHolder {
     dirty = false;
     searchValue;
     searchTimeout;
-    onModelChange = () => { };
-    onModelTouched = () => { };
-    focusedOptionInfo = signal({ index: -1, level: 0, parentKey: '' });
-    activeOptionPath = signal([]);
+    focusedOptionInfo = signal({ index: -1, level: 0, parentKey: '' }, ...(ngDevMode ? [{ debugName: "focusedOptionInfo" }] : []));
+    activeOptionPath = signal([], ...(ngDevMode ? [{ debugName: "activeOptionPath" }] : []));
     processedOptions = [];
     _componentStyle = inject(CascadeSelectStyle);
     initialized = false;
-    $variant = computed(() => this.variant() || this.config.inputStyle() || this.config.inputVariant());
-    $appendTo = computed(() => this.appendTo() || this.config.overlayAppendTo());
+    $variant = computed(() => this.variant() || this.config.inputStyle() || this.config.inputVariant(), ...(ngDevMode ? [{ debugName: "$variant" }] : []));
+    $appendTo = computed(() => this.appendTo() || this.config.overlayAppendTo(), ...(ngDevMode ? [{ debugName: "$appendTo" }] : []));
     pcFluid = inject(Fluid, { optional: true, host: true, skipSelf: true });
     get hasFluid() {
         return this.fluid() ?? !!this.pcFluid;
@@ -779,7 +777,7 @@ class CascadeSelect extends BaseEditableHolder {
     visibleOptions = computed(() => {
         const processedOption = this.activeOptionPath().find((p) => p.key === this.focusedOptionInfo().parentKey);
         return processedOption ? processedOption.children : this.processedOptions;
-    });
+    }, ...(ngDevMode ? [{ debugName: "visibleOptions" }] : []));
     label = computed(() => {
         const label = this.placeholder || 'p-emptylabel';
         if (this.hasSelectedOption()) {
@@ -788,7 +786,7 @@ class CascadeSelect extends BaseEditableHolder {
             return processedOption ? this.getOptionLabel(processedOption.option) : label;
         }
         return label;
-    });
+    }, ...(ngDevMode ? [{ debugName: "label" }] : []));
     get _label() {
         const label = this.placeholder || 'p-emptylabel';
         if (this.hasSelectedOption()) {
@@ -852,7 +850,7 @@ class CascadeSelect extends BaseEditableHolder {
         return processedOptions;
     }
     onInputFocus(event) {
-        if (this.disabled()) {
+        if (this.$disabled()) {
             // For screenreaders
             return;
         }
@@ -867,7 +865,7 @@ class CascadeSelect extends BaseEditableHolder {
         this.onBlur.emit(event);
     }
     onInputKeyDown(event) {
-        if (this.disabled() || this.loading) {
+        if (this.$disabled() || this.loading) {
             event.preventDefault();
             return;
         }
@@ -1091,7 +1089,7 @@ class CascadeSelect extends BaseEditableHolder {
         this.onGroupChange.emit(event);
     }
     onContainerClick(event) {
-        if (this.disabled() || this.loading) {
+        if (this.$disabled() || this.loading) {
             return;
         }
         if (!this.overlayViewChild?.el?.nativeElement?.contains(event.target)) {
@@ -1280,8 +1278,8 @@ class CascadeSelect extends BaseEditableHolder {
         });
     }
     query;
-    queryMatches = signal(false);
-    mobileActive = signal(false);
+    queryMatches = signal(false, ...(ngDevMode ? [{ debugName: "queryMatches" }] : []));
+    mobileActive = signal(false, ...(ngDevMode ? [{ debugName: "mobileActive" }] : []));
     onOptionChange(event) {
         const { processedOption, type } = event;
         if (isEmpty(processedOption))
@@ -1378,24 +1376,24 @@ class CascadeSelect extends BaseEditableHolder {
                 break;
         }
     }
-    writeValue(value) {
+    /**
+     * @override
+     *
+     * @see {@link BaseEditableHolder.writeControlValue}
+     * Writes the value to the control.
+     */
+    writeControlValue(value, setModelValue) {
         this.value = value;
-        this.updateModel(value);
+        setModelValue(value);
         this.cd.markForCheck();
     }
-    registerOnChange(fn) {
-        this.onModelChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onModelTouched = fn;
-    }
     ngOnDestroy() {
         if (this.matchMediaListener) {
             this.unbindMatchMediaListener();
         }
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelect, deps: [{ token: i2.OverlayService }], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.0.6", type: CascadeSelect, isStandalone: true, selector: "p-cascadeSelect, p-cascadeselect, p-cascade-select", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, searchMessage: { classPropertyName: "searchMessage", publicName: "searchMessage", isSignal: false, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: false, isRequired: false, transformFunction: null }, selectionMessage: { classPropertyName: "selectionMessage", publicName: "selectionMessage", isSignal: false, isRequired: false, transformFunction: null }, emptySearchMessage: { classPropertyName: "emptySearchMessage", publicName: "emptySearchMessage", isSignal: false, isRequired: false, transformFunction: null }, emptySelectionMessage: { classPropertyName: "emptySelectionMessage", publicName: "emptySelectionMessage", isSignal: false, isRequired: false, transformFunction: null }, searchLocale: { classPropertyName: "searchLocale", publicName: "searchLocale", isSignal: false, isRequired: false, transformFunction: null }, optionDisabled: { classPropertyName: "optionDisabled", publicName: "optionDisabled", isSignal: false, isRequired: false, transformFunction: null }, focusOnHover: { classPropertyName: "focusOnHover", publicName: "focusOnHover", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, selectOnFocus: { classPropertyName: "selectOnFocus", publicName: "selectOnFocus", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, autoOptionFocus: { classPropertyName: "autoOptionFocus", publicName: "autoOptionFocus", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: false, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: false, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: false, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: false, isRequired: false, transformFunction: null }, optionGroupLabel: { classPropertyName: "optionGroupLabel", publicName: "optionGroupLabel", isSignal: false, isRequired: false, transformFunction: null }, optionGroupChildren: { classPropertyName: "optionGroupChildren", publicName: "optionGroupChildren", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: false, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: false, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: false, isRequired: false, transformFunction: numberAttribute }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: false, isRequired: false, transformFunction: null }, inputLabel: { classPropertyName: "inputLabel", publicName: "inputLabel", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, panelStyleClass: { classPropertyName: "panelStyleClass", publicName: "panelStyleClass", isSignal: false, isRequired: false, transformFunction: null }, panelStyle: { classPropertyName: "panelStyle", publicName: "panelStyle", isSignal: false, isRequired: false, transformFunction: null }, overlayOptions: { classPropertyName: "overlayOptions", publicName: "overlayOptions", isSignal: false, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, loadingIcon: { classPropertyName: "loadingIcon", publicName: "loadingIcon", isSignal: false, isRequired: false, transformFunction: null }, breakpoint: { classPropertyName: "breakpoint", publicName: "breakpoint", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange", onGroupChange: "onGroupChange", onShow: "onShow", onHide: "onHide", onClear: "onClear", onBeforeShow: "onBeforeShow", onBeforeHide: "onBeforeHide", onFocus: "onFocus", onBlur: "onBlur" }, host: { listeners: { "click": "onHostClick($event)" }, properties: { "class": "cn(cx('root'), styleClass)", "style": "sx('root')", "attr.data-pc-name": "'cascadeselect'", "attr.data-pc-section": "'root'" } }, providers: [CASCADESELECT_VALUE_ACCESSOR, CascadeSelectStyle], queries: [{ propertyName: "valueTemplate", first: true, predicate: ["value"] }, { propertyName: "optionTemplate", first: true, predicate: ["option"] }, { propertyName: "headerTemplate", first: true, predicate: ["header"] }, { propertyName: "footerTemplate", first: true, predicate: ["footer"] }, { propertyName: "triggerIconTemplate", first: true, predicate: ["triggericon"] }, { propertyName: "loadingIconTemplate", first: true, predicate: ["loadingicon"] }, { propertyName: "groupIconTemplate", first: true, predicate: ["optiongroupicon"] }, { propertyName: "clearIconTemplate", first: true, predicate: ["clearicon"] }, { propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "focusInputViewChild", first: true, predicate: ["focusInput"], descendants: true }, { propertyName: "panelViewChild", first: true, predicate: ["panel"], descendants: true }, { propertyName: "overlayViewChild", first: true, predicate: ["overlay"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelect, deps: [{ token: i2.OverlayService }], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.1.0", type: CascadeSelect, isStandalone: true, selector: "p-cascadeSelect, p-cascadeselect, p-cascade-select", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null }, searchMessage: { classPropertyName: "searchMessage", publicName: "searchMessage", isSignal: false, isRequired: false, transformFunction: null }, emptyMessage: { classPropertyName: "emptyMessage", publicName: "emptyMessage", isSignal: false, isRequired: false, transformFunction: null }, selectionMessage: { classPropertyName: "selectionMessage", publicName: "selectionMessage", isSignal: false, isRequired: false, transformFunction: null }, emptySearchMessage: { classPropertyName: "emptySearchMessage", publicName: "emptySearchMessage", isSignal: false, isRequired: false, transformFunction: null }, emptySelectionMessage: { classPropertyName: "emptySelectionMessage", publicName: "emptySelectionMessage", isSignal: false, isRequired: false, transformFunction: null }, searchLocale: { classPropertyName: "searchLocale", publicName: "searchLocale", isSignal: false, isRequired: false, transformFunction: null }, optionDisabled: { classPropertyName: "optionDisabled", publicName: "optionDisabled", isSignal: false, isRequired: false, transformFunction: null }, focusOnHover: { classPropertyName: "focusOnHover", publicName: "focusOnHover", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, selectOnFocus: { classPropertyName: "selectOnFocus", publicName: "selectOnFocus", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, autoOptionFocus: { classPropertyName: "autoOptionFocus", publicName: "autoOptionFocus", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, styleClass: { classPropertyName: "styleClass", publicName: "styleClass", isSignal: false, isRequired: false, transformFunction: null }, options: { classPropertyName: "options", publicName: "options", isSignal: false, isRequired: false, transformFunction: null }, optionLabel: { classPropertyName: "optionLabel", publicName: "optionLabel", isSignal: false, isRequired: false, transformFunction: null }, optionValue: { classPropertyName: "optionValue", publicName: "optionValue", isSignal: false, isRequired: false, transformFunction: null }, optionGroupLabel: { classPropertyName: "optionGroupLabel", publicName: "optionGroupLabel", isSignal: false, isRequired: false, transformFunction: null }, optionGroupChildren: { classPropertyName: "optionGroupChildren", publicName: "optionGroupChildren", isSignal: false, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: false, isRequired: false, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: false, isRequired: false, transformFunction: null }, dataKey: { classPropertyName: "dataKey", publicName: "dataKey", isSignal: false, isRequired: false, transformFunction: null }, inputId: { classPropertyName: "inputId", publicName: "inputId", isSignal: false, isRequired: false, transformFunction: null }, tabindex: { classPropertyName: "tabindex", publicName: "tabindex", isSignal: false, isRequired: false, transformFunction: numberAttribute }, ariaLabelledBy: { classPropertyName: "ariaLabelledBy", publicName: "ariaLabelledBy", isSignal: false, isRequired: false, transformFunction: null }, inputLabel: { classPropertyName: "inputLabel", publicName: "inputLabel", isSignal: false, isRequired: false, transformFunction: null }, ariaLabel: { classPropertyName: "ariaLabel", publicName: "ariaLabel", isSignal: false, isRequired: false, transformFunction: null }, showClear: { classPropertyName: "showClear", publicName: "showClear", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, panelStyleClass: { classPropertyName: "panelStyleClass", publicName: "panelStyleClass", isSignal: false, isRequired: false, transformFunction: null }, panelStyle: { classPropertyName: "panelStyle", publicName: "panelStyle", isSignal: false, isRequired: false, transformFunction: null }, overlayOptions: { classPropertyName: "overlayOptions", publicName: "overlayOptions", isSignal: false, isRequired: false, transformFunction: null }, autofocus: { classPropertyName: "autofocus", publicName: "autofocus", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: false, isRequired: false, transformFunction: booleanAttribute }, loadingIcon: { classPropertyName: "loadingIcon", publicName: "loadingIcon", isSignal: false, isRequired: false, transformFunction: null }, breakpoint: { classPropertyName: "breakpoint", publicName: "breakpoint", isSignal: false, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: true, isRequired: false, transformFunction: null }, fluid: { classPropertyName: "fluid", publicName: "fluid", isSignal: true, isRequired: false, transformFunction: null }, appendTo: { classPropertyName: "appendTo", publicName: "appendTo", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { onChange: "onChange", onGroupChange: "onGroupChange", onShow: "onShow", onHide: "onHide", onClear: "onClear", onBeforeShow: "onBeforeShow", onBeforeHide: "onBeforeHide", onFocus: "onFocus", onBlur: "onBlur" }, host: { listeners: { "click": "onHostClick($event)" }, properties: { "class": "cn(cx('root'), styleClass)", "style": "sx('root')", "attr.data-pc-name": "'cascadeselect'", "attr.data-pc-section": "'root'" } }, providers: [CASCADESELECT_VALUE_ACCESSOR, CascadeSelectStyle], queries: [{ propertyName: "valueTemplate", first: true, predicate: ["value"] }, { propertyName: "optionTemplate", first: true, predicate: ["option"] }, { propertyName: "headerTemplate", first: true, predicate: ["header"] }, { propertyName: "footerTemplate", first: true, predicate: ["footer"] }, { propertyName: "triggerIconTemplate", first: true, predicate: ["triggericon"] }, { propertyName: "loadingIconTemplate", first: true, predicate: ["loadingicon"] }, { propertyName: "groupIconTemplate", first: true, predicate: ["optiongroupicon"] }, { propertyName: "clearIconTemplate", first: true, predicate: ["clearicon"] }, { propertyName: "templates", predicate: PrimeTemplate }], viewQueries: [{ propertyName: "focusInputViewChild", first: true, predicate: ["focusInput"], descendants: true }, { propertyName: "panelViewChild", first: true, predicate: ["panel"], descendants: true }, { propertyName: "overlayViewChild", first: true, predicate: ["overlay"], descendants: true }], usesInheritance: true, usesOnChanges: true, ngImport: i0, template: `
         <div class="p-hidden-accessible" [attr.data-pc-section]="'hiddenInputWrapper'">
             <input
                 #focusInput
@@ -1404,13 +1402,13 @@ class CascadeSelect extends BaseEditableHolder {
                 role="combobox"
                 [attr.name]="name()"
                 [attr.required]="required() ? '' : undefined"
-                [attr.disabled]="disabled() ? '' : undefined"
+                [attr.disabled]="$disabled() ? '' : undefined"
                 [attr.placeholder]="placeholder"
-                [attr.tabindex]="!disabled() ? tabindex : -1"
+                [attr.tabindex]="!$disabled() ? tabindex : -1"
                 [attr.id]="inputId"
                 [attr.aria-label]="ariaLabel"
                 [attr.aria-labelledby]="ariaLabelledBy"
-                aria-haspopup="tree"
+                [attr.aria-haspopup]="'tree'"
                 [attr.aria-expanded]="overlayVisible ?? false"
                 [attr.aria-controls]="overlayVisible ? id + '_tree' : null"
                 [attr.aria-activedescendant]="focused ? focusedOptionId : undefined"
@@ -1429,7 +1427,7 @@ class CascadeSelect extends BaseEditableHolder {
             </ng-template>
         </span>
 
-        <ng-container *ngIf="$filled() && !disabled() && showClear">
+        <ng-container *ngIf="$filled() && !$disabled() && showClear">
             <svg data-p-icon="times" *ngIf="!clearIconTemplate && !_clearIconTemplate" [class]="cx('clearIcon')" (click)="clear($event)" [attr.data-pc-section]="'clearicon'" [attr.aria-hidden]="true" />
             <span *ngIf="clearIconTemplate || _clearIconTemplate" [class]="cx('clearIcon')" (click)="clear($event)" [attr.data-pc-section]="'clearicon'" [attr.aria-hidden]="true">
                 <ng-template *ngTemplateOutlet="clearIconTemplate || _clearIconTemplate"></ng-template>
@@ -1504,7 +1502,7 @@ class CascadeSelect extends BaseEditableHolder {
         </p-overlay>
     `, isInline: true, dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: Overlay, selector: "p-overlay", inputs: ["visible", "mode", "style", "styleClass", "contentStyle", "contentStyleClass", "target", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "listener", "responsive", "options", "appendTo", "hostAttrSelector"], outputs: ["visibleChange", "onBeforeShow", "onShow", "onBeforeHide", "onHide", "onAnimationStart", "onAnimationDone"] }, { kind: "directive", type: AutoFocus, selector: "[pAutoFocus]", inputs: ["pAutoFocus"] }, { kind: "component", type: CascadeSelectSub, selector: "p-cascadeSelectSub, p-cascadeselect-sub", inputs: ["role", "selectId", "activeOptionPath", "optionDisabled", "focusedOptionId", "options", "optionGroupChildren", "optionTemplate", "groupicon", "level", "optionLabel", "optionValue", "optionGroupLabel", "dirty", "root"], outputs: ["onChange", "onFocusChange", "onFocusEnterChange"] }, { kind: "component", type: ChevronDownIcon, selector: "[data-p-icon=\"chevron-down\"]" }, { kind: "component", type: TimesIcon, selector: "[data-p-icon=\"times\"]" }, { kind: "ngmodule", type: SharedModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelect, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelect, decorators: [{
             type: Component,
             args: [{
                     selector: 'p-cascadeSelect, p-cascadeselect, p-cascade-select',
@@ -1519,13 +1517,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                 role="combobox"
                 [attr.name]="name()"
                 [attr.required]="required() ? '' : undefined"
-                [attr.disabled]="disabled() ? '' : undefined"
+                [attr.disabled]="$disabled() ? '' : undefined"
                 [attr.placeholder]="placeholder"
-                [attr.tabindex]="!disabled() ? tabindex : -1"
+                [attr.tabindex]="!$disabled() ? tabindex : -1"
                 [attr.id]="inputId"
                 [attr.aria-label]="ariaLabel"
                 [attr.aria-labelledby]="ariaLabelledBy"
-                aria-haspopup="tree"
+                [attr.aria-haspopup]="'tree'"
                 [attr.aria-expanded]="overlayVisible ?? false"
                 [attr.aria-controls]="overlayVisible ? id + '_tree' : null"
                 [attr.aria-activedescendant]="focused ? focusedOptionId : undefined"
@@ -1544,7 +1542,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
             </ng-template>
         </span>
 
-        <ng-container *ngIf="$filled() && !disabled() && showClear">
+        <ng-container *ngIf="$filled() && !$disabled() && showClear">
             <svg data-p-icon="times" *ngIf="!clearIconTemplate && !_clearIconTemplate" [class]="cx('clearIcon')" (click)="clear($event)" [attr.data-pc-section]="'clearicon'" [attr.aria-hidden]="true" />
             <span *ngIf="clearIconTemplate || _clearIconTemplate" [class]="cx('clearIcon')" (click)="clear($event)" [attr.data-pc-section]="'clearicon'" [attr.aria-hidden]="true">
                 <ng-template *ngTemplateOutlet="clearIconTemplate || _clearIconTemplate"></ng-template>
@@ -1760,11 +1758,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImpor
                 args: [PrimeTemplate]
             }] } });
 class CascadeSelectModule {
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
-    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectModule, imports: [CascadeSelect, SharedModule], exports: [CascadeSelect, SharedModule] });
-    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectModule, imports: [CascadeSelect, SharedModule, SharedModule] });
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+    static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectModule, imports: [CascadeSelect, SharedModule], exports: [CascadeSelect, SharedModule] });
+    static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectModule, imports: [CascadeSelect, SharedModule, SharedModule] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.0.6", ngImport: i0, type: CascadeSelectModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.0", ngImport: i0, type: CascadeSelectModule, decorators: [{
             type: NgModule,
             args: [{
                     imports: [CascadeSelect, SharedModule],