feat(test-app): enables modal

Legal-and-General · Dec 11, 2024 · 2d608bf · 2d608bf
1 parent eb4b4dd
commit 2d608bf
Show file tree

Hide file tree

Showing 2 changed files with 26 additions and 14 deletions.
diff --git a/projects/canopy-test-app/src/app/app.component.html b/projects/canopy-test-app/src/app/app.component.html
@@ -563,20 +563,20 @@ <h3>Carousel item 3</h3>
               <button lg-button type="submit" variant="primary-dark">Submit</button>
             </form>
 
-<!--            <lg-separator></lg-separator>-->
-<!--            <lg-heading level="3">Modal</lg-heading>-->
-
-<!--            <button lgModalTrigger="modal" lg-button type="button" variant="secondary-dark">Open modal</button>-->
-<!--            <lg-modal id="modal">-->
-<!--              <lg-modal-header [headingLevel]="3">Lorem ipsum</lg-modal-header>-->
-<!--              <lg-modal-body>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</lg-modal-body>-->
-<!--              <lg-modal-footer>-->
-<!--                <lg-button-group>-->
-<!--                  <button lg-button lgMarginBottom="none" variant="primary-dark" type="button">Primary CTA</button>-->
-<!--                  <button lg-button lgMarginBottom="none" variant="secondary-dark" type="button">Cancel</button>-->
-<!--                </lg-button-group>-->
-<!--              </lg-modal-footer>-->
-<!--            </lg-modal>-->
+            <lg-separator></lg-separator>
+            <lg-heading level="3">Modal</lg-heading>
+
+            <button lgModalTrigger="modal" lg-button type="button" variant="secondary-dark">Open modal</button>
+            <lg-modal id="modal">
+              <lg-modal-header [headingLevel]="3">Lorem ipsum</lg-modal-header>
+              <lg-modal-body>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</lg-modal-body>
+              <lg-modal-footer>
+                <lg-button-group>
+                  <button lg-button lgMarginBottom="none" variant="primary-dark" type="button">Primary CTA</button>
+                  <button lg-button lgMarginBottom="none" variant="secondary-dark" type="button">Cancel</button>
+                </lg-button-group>
+              </lg-modal-footer>
+            </lg-modal>
 
             <lg-separator></lg-separator>
             <lg-heading level="3">List with Icons</lg-heading>

diff --git a/projects/canopy-test-app/src/app/app.component.ts b/projects/canopy-test-app/src/app/app.component.ts
@@ -7,6 +7,13 @@ import {
 import { NgForOf, NgIf } from '@angular/common';
 import { RouterLink, RouterOutlet } from '@angular/router';
 
+import {
+  LgModalBodyComponent,
+  LgModalComponent,
+  LgModalFooterComponent,
+  LgModalHeaderComponent,
+  LgModalTriggerDirective,
+} from '../../../canopy/src/lib/modal';
 import { LgPageComponent } from '../../../canopy/src/lib/page';
 import { LgHeaderComponent, LgHeaderLogoComponent } from '../../../canopy/src/lib/header';
 import {
@@ -294,6 +301,11 @@ import {
     RouterOutlet,
     NgForOf,
     NgIf,
+    LgModalComponent,
+    LgModalTriggerDirective,
+    LgModalHeaderComponent,
+    LgModalBodyComponent,
+    LgModalFooterComponent,
   ],
 })
 export class AppComponent {