refactor(module:*) remove deprecated APIs in v21 (#9531)

* refactor(module:checkbox): remove deprecated nz-checkbox-wrapper

please use nz-checkbox-group instead

* refactor(module:input-number): remove deprecated input `nzBordered`

please use `nzVariant` instead

* refactor(module:mention): remove deprecated NZ_MENTION_TRIGGER_ACCESSOR

* refactor(module:mention): remove deprecated NzToolTipModule

which had been renamed to NzTooltipModule in v20

* refactor(module:input): remove deprecated input `nzBorderless`

please use `nzVariant` instead

* refactor(module:core): remove deprecated `NzHighlightModule`

please use `NzHighlightPipe` directly instead

* refactor(module:date-picker): remove deprecated input `nzBorderless`

please use `nzVariant` instead

* refactor(module:auto-complete): remove NZ_AUTOCOMPLETE_VALUE_ACCESSOR

* refactor(module:select): remove deprecated input `nzBorderless`

please use `nzVariant` instead

* refactor(module:time-picker): remove deprecated input `nzBorderless`

please use `nzVariant` instead

* refactor(module:*): add missing nzConfig field `nzVariant`

Author: Laffery

components/auto-complete/autocomplete-trigger.directive.ts

@@ -20,7 +20,6 @@ import {
   Directive,
   DOCUMENT,
   ElementRef,
-  ExistingProvider,
   forwardRef,
   inject,
   Injector,
@@ -38,31 +37,18 @@ import { NzInputGroupWhitSuffixOrPrefixDirective } from 'ng-zorro-antd/input';
 
 import { NzAutocompleteOptionComponent } from './autocomplete-option.component';
 import { NzAutocompleteComponent } from './autocomplete.component';
-
-/**
- * @deprecated Internally used, will be removed in v21, please do not use it.
- */
-export const NZ_AUTOCOMPLETE_VALUE_ACCESSOR: ExistingProvider = {
-  provide: NG_VALUE_ACCESSOR,
-  useExisting: forwardRef(() => NzAutocompleteTriggerDirective),
-  multi: true
-};
-
-/**
- * @deprecated Internally used, will not be exported in v21, please do not use it.
- */
-export function getNzAutocompleteMissingPanelError(): Error {
-  return Error(
-    'Attempting to open an undefined instance of `nz-autocomplete`. ' +
-      'Make sure that the id passed to the `nzAutocomplete` is correct and that ' +
-      "you're attempting to open it after the ngAfterContentInit hook."
-  );
-}
+import { getNzAutocompleteMissingPanelError } from './error';
 
 @Directive({
   selector: `input[nzAutocomplete], textarea[nzAutocomplete]`,
   exportAs: 'nzAutocompleteTrigger',
-  providers: [NZ_AUTOCOMPLETE_VALUE_ACCESSOR],
+  providers: [
+    {
+      provide: NG_VALUE_ACCESSOR,
+      useExisting: forwardRef(() => NzAutocompleteTriggerDirective),
+      multi: true
+    }
+  ],
   host: {
     autocomplete: 'off',
     'aria-autocomplete': 'list',

components/auto-complete/autocomplete.spec.ts

@@ -46,7 +46,7 @@ import {
 import { NzSafeAny } from 'ng-zorro-antd/core/types';
 import { NzInputModule } from 'ng-zorro-antd/input';
 
-import { getNzAutocompleteMissingPanelError } from './autocomplete-trigger.directive';
+import { getNzAutocompleteMissingPanelError } from './error';
 import {
   NzAutocompleteComponent,
   NzAutocompleteModule,
@@ -933,29 +933,25 @@ describe('auto-complete', () => {
       }).toThrow(getNzAutocompleteMissingPanelError());
     }));
 
-    it(
-      'should show the panel when the options are initialized later within a component with ' +
-        'OnPush change detection',
-      fakeAsync(() => {
-        fixture = TestBed.createComponent(NzTestAutocompleteWithOnPushDelayComponent);
-        fixture.detectChanges();
+    it('should show the panel when the options are initialized later within a component with OnPush change detection', fakeAsync(() => {
+      fixture = TestBed.createComponent(NzTestAutocompleteWithOnPushDelayComponent);
+      fixture.detectChanges();
 
-        dispatchFakeEvent(fixture.debugElement.query(By.css('input')).nativeElement, 'focusin');
-        fixture.detectChanges();
-        tick(1000);
+      dispatchFakeEvent(fixture.debugElement.query(By.css('input')).nativeElement, 'focusin');
+      fixture.detectChanges();
+      tick(1000);
+
+      fixture.detectChanges();
+      tick();
 
+      Promise.resolve().then(() => {
+        fixture.detectChanges();
+        flush();
         fixture.detectChanges();
-        tick();
-
-        Promise.resolve().then(() => {
-          fixture.detectChanges();
-          flush();
-          fixture.detectChanges();
-          const panel = overlayContainerElement.querySelector('.ant-select-dropdown') as HTMLElement;
-          expect(panel.classList).not.toContain('ant-select-dropdown-hidden');
-        });
-      })
-    );
+        const panel = overlayContainerElement.querySelector('.ant-select-dropdown') as HTMLElement;
+        expect(panel.classList).not.toContain('ant-select-dropdown-hidden');
+      });
+    }));
   });
 
   describe('within input-wrapper', () => {

components/auto-complete/error.ts

@@ -0,0 +1,15 @@
+/**
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/NG-ZORRO/ng-zorro-antd/blob/master/LICENSE
+ */
+
+/**
+ * @note Internally used, please do not use it
+ */
+export function getNzAutocompleteMissingPanelError(): Error {
+  return Error(
+    'Attempting to open an undefined instance of `nz-autocomplete`. ' +
+      'Make sure that the id passed to the `nzAutocomplete` is correct and that ' +
+      "you're attempting to open it after the ngAfterContentInit hook."
+  );
+}

components/checkbox/checkbox-wrapper.component.ts

@@ -26,13 +26,11 @@ import {
 } from '@angular/core';
 import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
 import { ControlValueAccessor, FormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
-import { Subject } from 'rxjs';
 
 import { NzFormStatusService } from 'ng-zorro-antd/core/form';
 import { NzSafeAny, OnChangeType, OnTouchedType } from 'ng-zorro-antd/core/types';
 import { fromEventOutsideAngular } from 'ng-zorro-antd/core/util';
 
-import { NzCheckboxWrapperComponent } from './checkbox-wrapper.component';
 import { NZ_CHECKBOX_GROUP } from './tokens';
 
 @Component({
@@ -89,11 +87,8 @@ export class NzCheckboxComponent implements OnInit, ControlValueAccessor, AfterV
   private destroyRef = inject(DestroyRef);
   protected checkboxGroupComponent = inject(NZ_CHECKBOX_GROUP, { optional: true });
   protected nzFormStatusService = inject(NzFormStatusService, { optional: true });
-  /** @deprecated */
-  private nzCheckboxWrapperComponent = inject(NzCheckboxWrapperComponent, { optional: true });
 
   dir: Direction = 'ltr';
-  private destroy$ = new Subject<void>();
   private isNzDisableFirstChange: boolean = true;
 
   onChange: OnChangeType = () => {};
@@ -111,7 +106,6 @@ export class NzCheckboxComponent implements OnInit, ControlValueAccessor, AfterV
   innerCheckedChange(checked: boolean): void {
     if (!this.nzDisabled && !this.checkboxGroupComponent?.finalDisabled()) {
       this.setValue(checked);
-      this.nzCheckboxWrapperComponent?.onChange();
       this.checkboxGroupComponent?.onCheckedChange(this.nzValue, checked);
     }
   }
@@ -146,7 +140,6 @@ export class NzCheckboxComponent implements OnInit, ControlValueAccessor, AfterV
   constructor() {
     this.destroyRef.onDestroy(() => {
       this.focusMonitor.stopMonitoring(this.elementRef);
-      this.nzCheckboxWrapperComponent?.removeCheckbox(this);
     });
     if (this.checkboxGroupComponent) {
       effect(() => {
@@ -167,8 +160,6 @@ export class NzCheckboxComponent implements OnInit, ControlValueAccessor, AfterV
         }
       });
 
-    this.nzCheckboxWrapperComponent?.addCheckbox(this);
-
     this.directionality.change.pipe(takeUntilDestroyed(this.destroyRef)).subscribe(direction => {
       this.dir = direction;
       this.cdr.detectChanges();

components/checkbox/checkbox.component.ts

@@ -6,11 +6,10 @@
 import { NgModule } from '@angular/core';
 
 import { NzCheckboxGroupComponent } from './checkbox-group.component';
-import { NzCheckboxWrapperComponent } from './checkbox-wrapper.component';
 import { NzCheckboxComponent } from './checkbox.component';
 
 @NgModule({
-  imports: [NzCheckboxComponent, NzCheckboxGroupComponent, NzCheckboxWrapperComponent],
-  exports: [NzCheckboxComponent, NzCheckboxGroupComponent, NzCheckboxWrapperComponent]
+  imports: [NzCheckboxComponent, NzCheckboxGroupComponent],
+  exports: [NzCheckboxComponent, NzCheckboxGroupComponent]
 })
 export class NzCheckboxModule {}

components/checkbox/checkbox.module.ts

@@ -9,9 +9,6 @@ import { ComponentFixture, TestBed, fakeAsync, flush } from '@angular/core/testi
 import { FormControl, FormsModule, ReactiveFormsModule } from '@angular/forms';
 import { By } from '@angular/platform-browser';
 
-import { NzSafeAny } from 'ng-zorro-antd/core/types';
-
-import { NzCheckboxWrapperComponent } from './checkbox-wrapper.component';
 import { NzCheckboxComponent } from './checkbox.component';
 import { NzCheckboxModule } from './checkbox.module';
 
@@ -212,32 +209,6 @@ describe('checkbox', () => {
     }));
   });
 
-  describe('checkbox wrapper', () => {
-    let fixture: ComponentFixture<NzTestCheckboxWrapperComponent>;
-    let testComponent: NzTestCheckboxWrapperComponent;
-    let checkboxWrapper: DebugElement;
-    let inputElement: HTMLInputElement;
-
-    beforeEach(fakeAsync(() => {
-      fixture = TestBed.createComponent(NzTestCheckboxWrapperComponent);
-      fixture.detectChanges();
-      flush();
-      fixture.detectChanges();
-      testComponent = fixture.debugElement.componentInstance;
-      checkboxWrapper = fixture.debugElement.query(By.directive(NzCheckboxWrapperComponent));
-      inputElement = checkboxWrapper.nativeElement.querySelector('input') as HTMLInputElement;
-    }));
-    it('should className correct', fakeAsync(() => {
-      expect(checkboxWrapper.nativeElement.classList).toContain('ant-checkbox-group');
-    }));
-    it('should onChange correct', fakeAsync(() => {
-      inputElement.click();
-      flush();
-      fixture.detectChanges();
-      expect(testComponent.onChange).toHaveBeenCalledWith([]);
-      expect(testComponent.onChange).toHaveBeenCalledTimes(1);
-    }));
-  });
   describe('RTL', () => {
     it('should single checkbox className correct on dir change', () => {
       const fixture = TestBed.createComponent(NzTestCheckboxSingleRtlComponent);
@@ -277,22 +248,6 @@ export class NzTestCheckboxSingleComponent {
   modelChange = jasmine.createSpy('change callback');
 }
 
-@Component({
-  imports: [FormsModule, NzCheckboxModule],
-  template: `
-    <nz-checkbox-wrapper (nzOnChange)="onChange($event)">
-      <div><label nz-checkbox nzValue="A" [ngModel]="true">A</label></div>
-      <div><label nz-checkbox nzValue="B">B</label></div>
-      <div><label nz-checkbox nzValue="C">C</label></div>
-      <div><label nz-checkbox nzValue="D">D</label></div>
-      <div><label nz-checkbox nzValue="E">E</label></div>
-    </nz-checkbox-wrapper>
-  `
-})
-export class NzTestCheckboxWrapperComponent {
-  onChange = jasmine.createSpy('change callback');
-}
-
 @Component({
   imports: [ReactiveFormsModule, NzCheckboxModule],
   template: `
@@ -347,34 +302,4 @@ describe('checkbox component', () => {
     component.ngAfterViewInit();
     expect(component.focus).toHaveBeenCalled();
   });
-
-  describe('checkbox wrapper component', () => {
-    let fixture: ComponentFixture<NzCheckboxWrapperComponent>;
-    let component: NzCheckboxWrapperComponent;
-
-    beforeEach(() => {
-      fixture = TestBed.createComponent(NzCheckboxWrapperComponent);
-      component = fixture.componentInstance;
-    });
-
-    it('should emit correct value', () => {
-      (component as NzSafeAny)['checkboxList'] = [
-        {
-          nzChecked: true,
-          nzValue: 'value 1'
-        },
-        {
-          nzChecked: true,
-          nzValue: 'value 2'
-        },
-        {
-          nzChecked: false,
-          nzValue: 'value 3'
-        }
-      ];
-      spyOn(component.nzOnChange, 'emit');
-      component.onChange();
-      expect(component.nzOnChange.emit).toHaveBeenCalledWith(['value 1', 'value 2']);
-    });
-  });
 });

components/checkbox/checkbox.spec.ts

@@ -36,12 +36,6 @@ description: Collect user's choices.
 | `[nzDisabled]`    | Disable all checkboxes                                          | `boolean`                                    | `false` |
 | `(ngModelChange)` | The callback function that is triggered when the state changes. | `EventEmitter<string[] \| number[]>`         | -       |
 
-### nz-checkbox-wrapper
-
-| Property       | Description                                                     | Type                  | Default |
-| -------------- | --------------------------------------------------------------- | --------------------- | ------- |
-| `(nzOnChange)` | The callback function that is triggered when the state changes. | `EventEmitter<any[]>` | -       |
-
 ## Methods
 
 ### [nz-checkbox]