From 198d326e7d3a12fb1fac792d75146944295a47e2 Mon Sep 17 00:00:00 2001
From: Elain T <elain.tsai@graycore.io>
Date: Fri, 14 Jun 2024 10:32:36 -0600
Subject: [PATCH] feat(design)!: remove deprecated properties and directives in
 `DaffAccordionComponent` and update usage (#2868)

BREAKING CHANGE: `[daffAccordionItemContent]` is no longer needed to place content inside the accordion item. `initiallyActive` has been removed in favor of `initiallyExpanded`.
---
 .../checkout-view.component.html              |  2 +-
 .../checkout-view.component.spec.ts           |  2 +-
 .../components/product/product.component.html |  4 +-
 .../pages/thank-you-view.component.html       |  2 +-
 .../pages/thank-you-view.component.spec.ts    |  2 +-
 libs/design/accordion/src/accordion.module.ts |  3 -
 .../accordion-item-content.directive.spec.ts  | 55 -------------------
 .../accordion-item-content.directive.ts       | 18 ------
 .../accordion-item.component.spec.ts          |  2 +-
 .../accordion-item.component.ts               |  4 --
 libs/design/accordion/src/public_api.ts       |  1 -
 11 files changed, 7 insertions(+), 88 deletions(-)
 delete mode 100644 libs/design/accordion/src/accordion/accordion-item-content/accordion-item-content.directive.spec.ts
 delete mode 100644 libs/design/accordion/src/accordion/accordion-item-content/accordion-item-content.directive.ts

diff --git a/apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.html b/apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.html
index 49c39a036e..8c935f6e0a 100644
--- a/apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.html
+++ b/apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.html
@@ -1,7 +1,7 @@
 <daff-container size="md">
 	<div class="demo-checkout" *ngIf="(loading$ | async) === false">
 		<daff-accordion class="demo-checkout__mobile-cart">
-			<daff-accordion-item [initiallyActive]="false">
+			<daff-accordion-item [initiallyExpanded]="false">
 				<h3 daffAccordionItemTitle>Cart Summary ({{(cart$ | async) ? (cart$ | async).items.length : 0}})</h3>
 				<demo-cart-summary-wrapper [cart]="cart$ | async" [loading]="loading$ | async"></demo-cart-summary-wrapper>
 			</daff-accordion-item>
diff --git a/apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.spec.ts b/apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.spec.ts
index 3bbbe7df0d..71d9cd2fb9 100644
--- a/apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.spec.ts
+++ b/apps/demo/src/app/checkout/pages/checkout-view/checkout-view.component.spec.ts
@@ -350,7 +350,7 @@ describe('CheckoutViewComponent', () => {
   describe('on <daff-accordion-item>', () => {
 
     it('should set initiallyAction to false', () => {
-      expect(accordionItem.initiallyActive).toBeFalsy();
+      expect(accordionItem.initiallyExpanded).toBeFalsy();
     });
 
     describe('when cart is null', () => {
diff --git a/apps/demo/src/app/product/components/product/product.component.html b/apps/demo/src/app/product/components/product/product.component.html
index 20ebd62d61..1433ada05e 100644
--- a/apps/demo/src/app/product/components/product/product.component.html
+++ b/apps/demo/src/app/product/components/product/product.component.html
@@ -24,9 +24,9 @@ <h1 class="demo-product__name">{{product.name}}</h1>
       </div>
       <div class="demo-product__accordion">
         <daff-accordion>
-          <daff-accordion-item initiallyActive="true">
+          <daff-accordion-item initiallyExpanded="true">
             <h3 daffAccordionItemTitle>Details</h3>
-            <div daffAccordionItemContent [innerHtml]="product.description"></div>
+            <div [innerHtml]="product.description"></div>
           </daff-accordion-item>
         </daff-accordion>
       </div>
diff --git a/apps/demo/src/app/thank-you/pages/thank-you-view.component.html b/apps/demo/src/app/thank-you/pages/thank-you-view.component.html
index b410bcbdc3..892fca62cb 100644
--- a/apps/demo/src/app/thank-you/pages/thank-you-view.component.html
+++ b/apps/demo/src/app/thank-you/pages/thank-you-view.component.html
@@ -2,7 +2,7 @@
   <div order-container #OrderContainer="OrderContainer">
     <div class="demo-thank-you-view" *ngIf="(OrderContainer.loading$ | async) === false">
       <daff-accordion class="demo-thank-you-view__mobile-cart">
-        <daff-accordion-item [initiallyActive]="false">
+        <daff-accordion-item [initiallyExpanded]="false">
           <h3 daffAccordionItemTitle>Cart Summary ({{(OrderContainer.order$ | async).items.length}})</h3>
           <demo-cart-summary-wrapper [cart]="OrderContainer.order$ | async" [loading]="OrderContainer.loading$ | async"></demo-cart-summary-wrapper>
         </daff-accordion-item>
diff --git a/apps/demo/src/app/thank-you/pages/thank-you-view.component.spec.ts b/apps/demo/src/app/thank-you/pages/thank-you-view.component.spec.ts
index dec82737da..58f4806912 100644
--- a/apps/demo/src/app/thank-you/pages/thank-you-view.component.spec.ts
+++ b/apps/demo/src/app/thank-you/pages/thank-you-view.component.spec.ts
@@ -138,7 +138,7 @@ describe('ThankYouViewComponent', () => {
   describe('on <daff-accordion-item>', () => {
 
     it('should set initiallyAction to false', () => {
-      expect(accordionItem.initiallyActive).toBeFalsy();
+      expect(accordionItem.initiallyExpanded).toBeFalsy();
     });
 
     it('should show the number of cart items in the accordion title', () => {
diff --git a/libs/design/accordion/src/accordion.module.ts b/libs/design/accordion/src/accordion.module.ts
index 4774ccd685..4cc690e5e2 100644
--- a/libs/design/accordion/src/accordion.module.ts
+++ b/libs/design/accordion/src/accordion.module.ts
@@ -6,7 +6,6 @@ import { DaffPrefixSuffixModule } from '@daffodil/design';
 
 import { DaffAccordionComponent } from './accordion/accordion/accordion.component';
 import { DaffAccordionItemComponent } from './accordion/accordion-item/accordion-item.component';
-import { DaffAccordionItemContentDirective } from './accordion/accordion-item-content/accordion-item-content.directive';
 import { DaffAccordionItemTitleDirective } from './accordion/accordion-item-title/accordion-item-title.directive';
 
 @NgModule({
@@ -20,13 +19,11 @@ import { DaffAccordionItemTitleDirective } from './accordion/accordion-item-titl
     DaffAccordionComponent,
     DaffAccordionItemComponent,
     DaffAccordionItemTitleDirective,
-    DaffAccordionItemContentDirective,
   ],
   exports: [
     DaffAccordionComponent,
     DaffAccordionItemComponent,
     DaffAccordionItemTitleDirective,
-    DaffAccordionItemContentDirective,
   ],
 })
 export class DaffAccordionModule { }
diff --git a/libs/design/accordion/src/accordion/accordion-item-content/accordion-item-content.directive.spec.ts b/libs/design/accordion/src/accordion/accordion-item-content/accordion-item-content.directive.spec.ts
deleted file mode 100644
index d6cde68b4e..0000000000
--- a/libs/design/accordion/src/accordion/accordion-item-content/accordion-item-content.directive.spec.ts
+++ /dev/null
@@ -1,55 +0,0 @@
-import {
-  Component,
-  DebugElement,
-} from '@angular/core';
-import {
-  waitForAsync,
-  ComponentFixture,
-  TestBed,
-} from '@angular/core/testing';
-import { By } from '@angular/platform-browser';
-
-import { DaffAccordionItemContentDirective } from './accordion-item-content.directive';
-
-@Component({
-  template: `
-    <div daffAccordionItemContent>Content</div>
-  `,
-})
-class WrapperComponent {}
-
-describe('@daffodil/design/accordion | DaffAccordionItemContentDirective', () => {
-  let accordionItemContent: DaffAccordionItemContentDirective;
-  let de: DebugElement;
-  let fixture: ComponentFixture<WrapperComponent>;
-
-  beforeEach(waitForAsync(() => {
-    TestBed.configureTestingModule({
-      declarations: [
-        DaffAccordionItemContentDirective,
-        WrapperComponent,
-      ],
-    })
-      .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(WrapperComponent);
-    de = fixture.debugElement.query(By.css('[daffAccordionItemContent]'));
-    accordionItemContent = de.componentInstance;
-
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(accordionItemContent).toBeTruthy();
-  });
-
-  describe('[daffAccordionItemContent]', () => {
-    it('should add a class of "daff-accordion-item__content" to the host element', () => {
-      expect(de.classes).toEqual(jasmine.objectContaining({
-        'daff-accordion-item__content': true,
-      }));
-    });
-  });
-});
diff --git a/libs/design/accordion/src/accordion/accordion-item-content/accordion-item-content.directive.ts b/libs/design/accordion/src/accordion/accordion-item-content/accordion-item-content.directive.ts
deleted file mode 100644
index c6d1b132fe..0000000000
--- a/libs/design/accordion/src/accordion/accordion-item-content/accordion-item-content.directive.ts
+++ /dev/null
@@ -1,18 +0,0 @@
-import {
-  Directive,
-  HostBinding,
-} from '@angular/core';
-
-/**
- * @deprecated in v1.0.0
- */
-@Directive({
-  selector: '[daffAccordionItemContent]',
-})
-export class DaffAccordionItemContentDirective {
-
-  /**
-   * @docs-private
-   */
-  @HostBinding('class.daff-accordion-item__content') class = true;
-}
diff --git a/libs/design/accordion/src/accordion/accordion-item/accordion-item.component.spec.ts b/libs/design/accordion/src/accordion/accordion-item/accordion-item.component.spec.ts
index 6cc103923e..403f99b81e 100644
--- a/libs/design/accordion/src/accordion/accordion-item/accordion-item.component.spec.ts
+++ b/libs/design/accordion/src/accordion/accordion-item/accordion-item.component.spec.ts
@@ -17,7 +17,7 @@ import { DaffAccordionItemComponent } from './accordion-item.component';
 @Component({ template: `
 <daff-accordion-item [initiallyExpanded]="initiallyExpandedValue">
   <h3 daffAccordionItemTitle>Size and Fit</h3>
-  <div daffAccordionItemContent>no content</div>
+  <div>no content</div>
 </daff-accordion-item>
 ` })
 class WrapperComponent {
diff --git a/libs/design/accordion/src/accordion/accordion-item/accordion-item.component.ts b/libs/design/accordion/src/accordion/accordion-item/accordion-item.component.ts
index 33d8f47f83..6ee31b4532 100644
--- a/libs/design/accordion/src/accordion/accordion-item/accordion-item.component.ts
+++ b/libs/design/accordion/src/accordion/accordion-item/accordion-item.component.ts
@@ -49,9 +49,6 @@ export class DaffAccordionItemComponent implements OnInit {
 
   @Input() id: string = this._daffAccordionItemId;
 
-  /** @deprecated in v1.0.0 in favor of `initiallyExpanded` */
-  @Input() initiallyActive: boolean;
-
   /** Whether or not the item is initiallyExpanded by default. */
   @Input() initiallyExpanded = false;
 
@@ -68,7 +65,6 @@ export class DaffAccordionItemComponent implements OnInit {
    * @docs-private
    */
   ngOnInit() {
-    this._open = this.initiallyActive ? this.initiallyActive : this._open;
     this._open = this.initiallyExpanded ? this.initiallyExpanded : this._open;
     this._animationState = getAnimationState(this._open);
   }
diff --git a/libs/design/accordion/src/public_api.ts b/libs/design/accordion/src/public_api.ts
index 1d6dd2d5b3..aff30a7087 100644
--- a/libs/design/accordion/src/public_api.ts
+++ b/libs/design/accordion/src/public_api.ts
@@ -2,4 +2,3 @@ export { DaffAccordionModule } from './accordion.module';
 export * from './accordion/accordion/accordion.component';
 export * from './accordion/accordion-item/accordion-item.component';
 export * from './accordion/accordion-item-title/accordion-item-title.directive';
-export * from './accordion/accordion-item-content/accordion-item-content.directive';