@progress/kendo-angular-dropdowns 14.4.0-develop.1 → 14.4.0-develop.12

package/esm2020/dropdownlist/dropdownlist.component.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Component, Renderer2, forwardRef, ElementRef, Input, Output, HostBinding, EventEmitter, ContentChild, ViewChild, ViewContainerRef, isDevMode, Optional, Inject, NgZone, TemplateRef, ChangeDetectorRef, HostListener, Injector } from '@angular/core';

package/esm2020/dropdownlist/dropdownlist.module.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { NgModule } from '@angular/core';

package/esm2020/dropdowns.module.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { NgModule } from '@angular/core';

package/esm2020/dropdowntrees/checked-state/base-check.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, Input } from '@angular/core';

package/esm2020/dropdowntrees/checked-state/check-all.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { ChangeDetectorRef, Directive, ElementRef, EventEmitter, HostListener, Input, NgZone, Output, Renderer2 } from '@angular/core';

package/esm2020/dropdowntrees/checked-state/check.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, EventEmitter, Input, Output } from '@angular/core';

package/esm2020/dropdowntrees/checked-state/checkable-settings.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 export {};

package/esm2020/dropdowntrees/checked-state/checked-item.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 export {};

package/esm2020/dropdowntrees/data-binding/dropdowntree/flat-binding.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, Input } from '@angular/core';

package/esm2020/dropdowntrees/data-binding/dropdowntree/hierarchy-binding.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, Input } from '@angular/core';

package/esm2020/dropdowntrees/data-binding/multiselecttree/flat-binding.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, Input } from '@angular/core';

package/esm2020/dropdowntrees/data-binding/multiselecttree/hierarchy-binding.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, Input } from '@angular/core';

package/esm2020/dropdowntrees/dropdowntree.component.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { ChangeDetectionStrategy, Component, ElementRef, EventEmitter, HostBinding, Input, Output, NgZone, Renderer2, TemplateRef, ViewChild, ChangeDetectorRef, ContentChild, forwardRef, ViewContainerRef, isDevMode, Optional, Inject, Injector } from '@angular/core';
@@ -145,7 +145,7 @@ export class DropDownTreeComponent {
         this.placeholder = "";
         this._listHeight = 200;
         /**
-         * Sets the disabled state of the component.
+         * Sets the disabled state of the component. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_dropdowntree#toc-managing-the-dropdowntree-disabled-state-in-reactive-forms).
          */
         this.disabled = false;
         /**

package/esm2020/dropdowntrees/dropdowntrees.module.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { NgModule } from '@angular/core';

package/esm2020/dropdowntrees/expanded-state/expand.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, Input } from '@angular/core';

package/esm2020/dropdowntrees/lookup/lookup.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 ;

package/esm2020/dropdowntrees/lookup/lookup.service.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Injectable } from '@angular/core';

package/esm2020/dropdowntrees/multiselecttree.component.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { ChangeDetectorRef, Component, ContentChild, ElementRef, EventEmitter, forwardRef, HostBinding, Inject, Injector, Input, isDevMode, NgZone, Optional, Output, Renderer2, TemplateRef, ViewChild, ViewContainerRef } from '@angular/core';
@@ -114,7 +114,7 @@ export class MultiSelectTreeComponent {
         this.placeholder = '';
         this._listHeight = 200;
         /**
-         * Sets the disabled state of the component.
+         * Sets the disabled state of the component. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_multiselecttree#toc-managing-the-multiselecttree-disabled-state-in-reactive-forms).
          */
         this.disabled = false;
         /**
@@ -1601,31 +1601,32 @@ MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0
             cancelButton="Cancel"
         >
         </ng-container>
-        <div class="k-input-values">
-            <kendo-taglist
-                [size]="size"
-                [rounded]="rounded"
-                [fillMode]="fillMode"
-                [id]="tagListId"
-                [tags]="tags"
-                [focused]="focusedTagIndex"
-                [textField]="textField"
-                [valueField]="valueField"
-                [valueDepth]="valueDepth"
-                [disabled]="disabled"
-                [tagPrefix]="tagPrefix"
-                [template]="tagTemplate"
-                [groupTemplate]="groupTagTemplate"
-                [disabledIndices]="disabledIndices"
-                (removeTag)="handleRemoveTag($event)"
-            >
-            </kendo-taglist>
-        </div>
-        <span
-            *ngIf="!tags || !tags.length"
-            class="k-input-inner k-readonly"
+        <kendo-taglist
+            class="k-input-values"
+            [size]="size"
+            [rounded]="rounded"
+            [fillMode]="fillMode"
+            [id]="tagListId"
+            [tags]="tags"
+            [focused]="focusedTagIndex"
+            [textField]="textField"
+            [valueField]="valueField"
+            [valueDepth]="valueDepth"
+            [disabled]="disabled"
+            [tagPrefix]="tagPrefix"
+            [template]="tagTemplate"
+            [groupTemplate]="groupTagTemplate"
+            [disabledIndices]="disabledIndices"
+            (removeTag)="handleRemoveTag($event)"
         >
-            <span class="k-input-value-text">{{ placeholder }}</span>
+        </kendo-taglist>
+        <span class="k-input-inner k-readonly">
+            <span 
+                *ngIf="!tags || !tags.length"
+                class="k-input-value-text"
+            >
+                {{ placeholder }}
+            </span>
         </span>
         <span
             *ngIf="!disabled && !loading && !readonly && clearButton && tags?.length"
@@ -1857,31 +1858,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             cancelButton="Cancel"
         >
         </ng-container>
-        <div class="k-input-values">
-            <kendo-taglist
-                [size]="size"
-                [rounded]="rounded"
-                [fillMode]="fillMode"
-                [id]="tagListId"
-                [tags]="tags"
-                [focused]="focusedTagIndex"
-                [textField]="textField"
-                [valueField]="valueField"
-                [valueDepth]="valueDepth"
-                [disabled]="disabled"
-                [tagPrefix]="tagPrefix"
-                [template]="tagTemplate"
-                [groupTemplate]="groupTagTemplate"
-                [disabledIndices]="disabledIndices"
-                (removeTag)="handleRemoveTag($event)"
-            >
-            </kendo-taglist>
-        </div>
-        <span
-            *ngIf="!tags || !tags.length"
-            class="k-input-inner k-readonly"
+        <kendo-taglist
+            class="k-input-values"
+            [size]="size"
+            [rounded]="rounded"
+            [fillMode]="fillMode"
+            [id]="tagListId"
+            [tags]="tags"
+            [focused]="focusedTagIndex"
+            [textField]="textField"
+            [valueField]="valueField"
+            [valueDepth]="valueDepth"
+            [disabled]="disabled"
+            [tagPrefix]="tagPrefix"
+            [template]="tagTemplate"
+            [groupTemplate]="groupTagTemplate"
+            [disabledIndices]="disabledIndices"
+            (removeTag)="handleRemoveTag($event)"
         >
-            <span class="k-input-value-text">{{ placeholder }}</span>
+        </kendo-taglist>
+        <span class="k-input-inner k-readonly">
+            <span 
+                *ngIf="!tags || !tags.length"
+                class="k-input-value-text"
+            >
+                {{ placeholder }}
+            </span>
         </span>
         <span
             *ngIf="!disabled && !loading && !readonly && clearButton && tags?.length"

package/esm2020/dropdowntrees/summary-tag/summary-tag.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, Input } from '@angular/core';

package/esm2020/dropdowntrees/templates/node-template.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, TemplateRef } from '@angular/core';

package/esm2020/index.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 export { AutoCompleteComponent } from './autocomplete/autocomplete.component';

package/esm2020/multiselect/multiselect.component.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { guid, isPresent, isArray, isObjectArray, resolveAllValues, selectedIndices, getter, isNumber, isUntouched, inDropDown, getSizeClass, getRoundedClass, getFillModeClass, animationDuration, isTruthy, windowSize, setListBoxAriaLabelLebBy, setActionSheetTitle, updateActionSheetAdaptiveAppearance } from '../common/util';
@@ -141,7 +141,7 @@ export class MultiSelectComponent {
          */
         this.title = '';
         /**
-         * Sets the disabled state of the component.
+         * Sets the disabled state of the component. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_multiselect#toc-managing-the-multiselect-disabled-state-in-reactive-forms).
          */
         this.disabled = false;
         /**

package/esm2020/multiselect/multiselect.module.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { NgModule } from '@angular/core';

package/esm2020/multiselect/summary-tag.directive.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import { Directive, Input } from '@angular/core';

package/esm2020/package-metadata.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 /**
@@ -9,7 +9,7 @@ export const packageMetadata = {
     name: '@progress/kendo-angular-dropdowns',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1703163323,
-    version: '14.4.0-develop.1',
+    publishDate: 1705561470,
+    version: '14.4.0-develop.12',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };

package/esm2020/progress-kendo-angular-dropdowns.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 /**

package/fesm2015/progress-kendo-angular-dropdowns.mjs

@@ -1,5 +1,5 @@
 /**-----------------------------------------------------------------------------------------
-* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Copyright © 2024 Progress Software Corporation. All rights reserved.
 * Licensed under commercial license. See LICENSE.md in the project root for more information
 *-------------------------------------------------------------------------------------------*/
 import * as i0 from '@angular/core';
@@ -37,8 +37,8 @@ const packageMetadata = {
     name: '@progress/kendo-angular-dropdowns',
     productName: 'Kendo UI for Angular',
     productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
-    publishDate: 1703163323,
-    version: '14.4.0-develop.1',
+    publishDate: 1705561470,
+    version: '14.4.0-develop.12',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/'
 };
 
@@ -2919,7 +2919,7 @@ class AutoCompleteComponent {
          */
         this.clearButton = true;
         /**
-         * Sets the disabled state of the component.
+         * Sets the disabled state of the component. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_autocomplete#toc-managing-the-autocomplete-disabled-state-in-reactive-forms).
          */
         this.disabled = false;
         /**
@@ -4469,7 +4469,7 @@ class ComboBoxComponent {
          */
         this.clearButton = true;
         /**
-         * Sets the disabled state of the component.
+         * Sets the disabled state of the component. To learn how to disable the component in reactive forms, refer to the articles on [ComboBox Forms Support](slug:slug:formssupport_combobox#toc-managing-the-combobox-disabled-state-in-reactive-forms) and [MultiColumnComboBox Forms Support](slug:formssupport_multicolumncombobox#toc-managing-the-multicolumncombobox-disabled-state-in-reactive-forms).
          */
         this.disabled = false;
         /**
@@ -8671,7 +8671,7 @@ class MultiSelectComponent {
          */
         this.title = '';
         /**
-         * Sets the disabled state of the component.
+         * Sets the disabled state of the component. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_multiselect#toc-managing-the-multiselect-disabled-state-in-reactive-forms).
          */
         this.disabled = false;
         /**
@@ -11698,7 +11698,7 @@ class DropDownTreeComponent {
         this.placeholder = "";
         this._listHeight = 200;
         /**
-         * Sets the disabled state of the component.
+         * Sets the disabled state of the component. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_dropdowntree#toc-managing-the-dropdowntree-disabled-state-in-reactive-forms).
          */
         this.disabled = false;
         /**
@@ -13866,7 +13866,7 @@ class MultiSelectTreeComponent {
         this.placeholder = '';
         this._listHeight = 200;
         /**
-         * Sets the disabled state of the component.
+         * Sets the disabled state of the component. To learn how to disable the component in reactive forms, refer to the article on [Forms Support](slug:formssupport_multiselecttree#toc-managing-the-multiselecttree-disabled-state-in-reactive-forms).
          */
         this.disabled = false;
         /**
@@ -15353,31 +15353,32 @@ MultiSelectTreeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0
             cancelButton="Cancel"
         >
         </ng-container>
-        <div class="k-input-values">
-            <kendo-taglist
-                [size]="size"
-                [rounded]="rounded"
-                [fillMode]="fillMode"
-                [id]="tagListId"
-                [tags]="tags"
-                [focused]="focusedTagIndex"
-                [textField]="textField"
-                [valueField]="valueField"
-                [valueDepth]="valueDepth"
-                [disabled]="disabled"
-                [tagPrefix]="tagPrefix"
-                [template]="tagTemplate"
-                [groupTemplate]="groupTagTemplate"
-                [disabledIndices]="disabledIndices"
-                (removeTag)="handleRemoveTag($event)"
-            >
-            </kendo-taglist>
-        </div>
-        <span
-            *ngIf="!tags || !tags.length"
-            class="k-input-inner k-readonly"
+        <kendo-taglist
+            class="k-input-values"
+            [size]="size"
+            [rounded]="rounded"
+            [fillMode]="fillMode"
+            [id]="tagListId"
+            [tags]="tags"
+            [focused]="focusedTagIndex"
+            [textField]="textField"
+            [valueField]="valueField"
+            [valueDepth]="valueDepth"
+            [disabled]="disabled"
+            [tagPrefix]="tagPrefix"
+            [template]="tagTemplate"
+            [groupTemplate]="groupTagTemplate"
+            [disabledIndices]="disabledIndices"
+            (removeTag)="handleRemoveTag($event)"
         >
-            <span class="k-input-value-text">{{ placeholder }}</span>
+        </kendo-taglist>
+        <span class="k-input-inner k-readonly">
+            <span 
+                *ngIf="!tags || !tags.length"
+                class="k-input-value-text"
+            >
+                {{ placeholder }}
+            </span>
         </span>
         <span
             *ngIf="!disabled && !loading && !readonly && clearButton && tags?.length"
@@ -15609,31 +15610,32 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImpo
             cancelButton="Cancel"
         >
         </ng-container>
-        <div class="k-input-values">
-            <kendo-taglist
-                [size]="size"
-                [rounded]="rounded"
-                [fillMode]="fillMode"
-                [id]="tagListId"
-                [tags]="tags"
-                [focused]="focusedTagIndex"
-                [textField]="textField"
-                [valueField]="valueField"
-                [valueDepth]="valueDepth"
-                [disabled]="disabled"
-                [tagPrefix]="tagPrefix"
-                [template]="tagTemplate"
-                [groupTemplate]="groupTagTemplate"
-                [disabledIndices]="disabledIndices"
-                (removeTag)="handleRemoveTag($event)"
-            >
-            </kendo-taglist>
-        </div>
-        <span
-            *ngIf="!tags || !tags.length"
-            class="k-input-inner k-readonly"
+        <kendo-taglist
+            class="k-input-values"
+            [size]="size"
+            [rounded]="rounded"
+            [fillMode]="fillMode"
+            [id]="tagListId"
+            [tags]="tags"
+            [focused]="focusedTagIndex"
+            [textField]="textField"
+            [valueField]="valueField"
+            [valueDepth]="valueDepth"
+            [disabled]="disabled"
+            [tagPrefix]="tagPrefix"
+            [template]="tagTemplate"
+            [groupTemplate]="groupTagTemplate"
+            [disabledIndices]="disabledIndices"
+            (removeTag)="handleRemoveTag($event)"
         >
-            <span class="k-input-value-text">{{ placeholder }}</span>
+        </kendo-taglist>
+        <span class="k-input-inner k-readonly">
+            <span 
+                *ngIf="!tags || !tags.length"
+                class="k-input-value-text"
+            >
+                {{ placeholder }}
+            </span>
         </span>
         <span
             *ngIf="!disabled && !loading && !readonly && clearButton && tags?.length"