diff --git a/README.md b/README.md index d70e306..cb8573c 100644 --- a/README.md +++ b/README.md @@ -47,8 +47,12 @@ export class AppModule {} ```html - Item 1 Content - Item 2 Content + Item 1 Content + Item 2 Content ``` diff --git a/apps/documentations/src/app/app.component.html b/apps/documentations/src/app/app.component.html index db4c233..e5c1b2c 100644 --- a/apps/documentations/src/app/app.component.html +++ b/apps/documentations/src/app/app.component.html @@ -3,15 +3,15 @@
-
- @for (link of hyperlinks ; track $index) { - -
+
@for (item of features; track $index) { - + }
diff --git a/apps/documentations/src/app/app.component.spec.ts b/apps/documentations/src/app/app.component.spec.ts index 4c8fcc5..2e2c1e5 100644 --- a/apps/documentations/src/app/app.component.spec.ts +++ b/apps/documentations/src/app/app.component.spec.ts @@ -14,7 +14,7 @@ describe('AppComponent', () => { fixture.detectChanges(); const compiled = fixture.nativeElement as HTMLElement; expect(compiled.querySelector('h1')?.textContent).toContain( - 'Welcome documentations' + 'Welcome documentations', ); }); diff --git a/apps/documentations/src/app/app.component.ts b/apps/documentations/src/app/app.component.ts index fcf6aaa..2ba3710 100644 --- a/apps/documentations/src/app/app.component.ts +++ b/apps/documentations/src/app/app.component.ts @@ -1,60 +1,72 @@ import { AppBannerTextComponent } from './shared/components/commons/app-banner-text/app-banner-text.component'; import { AppContentSectionComponent } from './shared/components/commons/app-content-section/app-content-section.component'; import { AppFeatureButtonComponent } from './shared/components/commons/app-feature-button/app-feature-button.component'; -import { AppFeatureCardComponent } from "./shared/components/commons/app-feature-card/app-feature-card.component"; +import { AppFeatureCardComponent } from './shared/components/commons/app-feature-card/app-feature-card.component'; import { AppFooterComponentComponent } from './shared/components/commons/app-footer-component/app-footer-component.component'; import { AppHeaderComponentComponent } from './shared/components/commons/app-header-component/app-header-component.component'; import { Component } from '@angular/core'; import { RouterModule } from '@angular/router'; @Component({ - imports: [RouterModule, AppHeaderComponentComponent, AppFooterComponentComponent, AppFeatureButtonComponent, AppContentSectionComponent, AppBannerTextComponent, AppFeatureCardComponent], + imports: [ + RouterModule, + AppHeaderComponentComponent, + AppFooterComponentComponent, + AppFeatureButtonComponent, + AppContentSectionComponent, + AppBannerTextComponent, + AppFeatureCardComponent, + ], selector: 'app-root', templateUrl: './app.component.html', styleUrl: './app.component.scss', - providers: [ - ] + providers: [], }) export class AppComponent { title = 'Ngx Primer | Angular Primtives Component Library'; features = [ { - title: "Accessible", - description: "All components follow the accessibility guidelines set out by the Primer Design System to ensure a better user experience." - }, + title: 'Accessible', + description: + 'All components follow the accessibility guidelines set out by the Primer Design System to ensure a better user experience.', + }, { - title: "Customizable", - description: "Tailor the components' appearance and behavior using Angular's flexible input properties and directives." - }, + title: 'Customizable', + description: + "Tailor the components' appearance and behavior using Angular's flexible input properties and directives.", + }, { - title: "Responsive", - description: "The library is designed to be responsive and work seamlessly across all device types and screen sizes." + title: 'Responsive', + description: + 'The library is designed to be responsive and work seamlessly across all device types and screen sizes.', }, { - title: "Themeable", - description: "Easily switch between light and dark modes, as well as apply custom themes to your components." + title: 'Themeable', + description: + 'Easily switch between light and dark modes, as well as apply custom themes to your components.', }, { - title: "Signal API", - description: "Leverage Angular's Signal API to create custom events and handle them in your application, for highly reactive, optimized performance.", - } + title: 'Signal API', + description: + "Leverage Angular's Signal API to create custom events and handle them in your application, for highly reactive, optimized performance.", + }, ]; hyperlinks = [ { - text: "Get Started", + text: 'Get Started', hyperlink: true, - target: "get-started", + target: 'get-started', }, { - text: "Quick Start", + text: 'Quick Start', hyperlink: true, - target: "quick-start", + target: 'quick-start', }, { - text: "Api Reference", + text: 'Api Reference', hyperlink: true, - target: "api-reference", + target: 'api-reference', }, - ] + ]; } diff --git a/apps/documentations/src/app/shared/components/commons/app-banner-text/app-banner-text.component.html b/apps/documentations/src/app/shared/components/commons/app-banner-text/app-banner-text.component.html index d2a0409..cf61067 100644 --- a/apps/documentations/src/app/shared/components/commons/app-banner-text/app-banner-text.component.html +++ b/apps/documentations/src/app/shared/components/commons/app-banner-text/app-banner-text.component.html @@ -1,9 +1,15 @@ -

+

{{ brand() }}

-

+

{{ tagline() }}

-

+

{{ subtle() }} -

\ No newline at end of file + diff --git a/apps/documentations/src/app/shared/components/commons/app-banner-text/app-banner-text.component.spec.ts b/apps/documentations/src/app/shared/components/commons/app-banner-text/app-banner-text.component.spec.ts index f750d30..f3ebe41 100644 --- a/apps/documentations/src/app/shared/components/commons/app-banner-text/app-banner-text.component.spec.ts +++ b/apps/documentations/src/app/shared/components/commons/app-banner-text/app-banner-text.component.spec.ts @@ -8,9 +8,8 @@ describe('AppBannerTextComponent', () => { beforeEach(async () => { await TestBed.configureTestingModule({ - imports: [AppBannerTextComponent] - }) - .compileComponents(); + imports: [AppBannerTextComponent], + }).compileComponents(); fixture = TestBed.createComponent(AppBannerTextComponent); component = fixture.componentInstance; diff --git a/apps/documentations/src/app/shared/components/commons/app-content-section/app-content-section.component.html b/apps/documentations/src/app/shared/components/commons/app-content-section/app-content-section.component.html index 130fbfb..99a9534 100644 --- a/apps/documentations/src/app/shared/components/commons/app-content-section/app-content-section.component.html +++ b/apps/documentations/src/app/shared/components/commons/app-content-section/app-content-section.component.html @@ -1,3 +1,5 @@ -
+
-
\ No newline at end of file +
diff --git a/apps/documentations/src/app/shared/components/commons/app-feature-button/app-feature-button.component.html b/apps/documentations/src/app/shared/components/commons/app-feature-button/app-feature-button.component.html index 277b00e..154c769 100644 --- a/apps/documentations/src/app/shared/components/commons/app-feature-button/app-feature-button.component.html +++ b/apps/documentations/src/app/shared/components/commons/app-feature-button/app-feature-button.component.html @@ -1,12 +1,14 @@ @if (!hyperlink()) { - } @else { - + class="bg-[#0546f1]/100 font-semibold text-xs sm:text-sm xl:text-md p-2 sm:py-2 sm:px-2 md:px-4 md:py-2 rounded-lg md:rounded-xl" + > {{ buttonText }} -} \ No newline at end of file +} diff --git a/apps/documentations/src/app/shared/components/commons/app-feature-button/app-feature-button.component.ts b/apps/documentations/src/app/shared/components/commons/app-feature-button/app-feature-button.component.ts index 3c27c9e..b02a1de 100644 --- a/apps/documentations/src/app/shared/components/commons/app-feature-button/app-feature-button.component.ts +++ b/apps/documentations/src/app/shared/components/commons/app-feature-button/app-feature-button.component.ts @@ -9,20 +9,20 @@ import { RouterLink } from '@angular/router'; imports: [CommonModule, RouterLink], templateUrl: './app-feature-button.component.html', styleUrl: './app-feature-button.component.scss', - standalone: true + standalone: true, }) export class AppFeatureButtonComponent { public text = input('', { - alias: 'text' + alias: 'text', }); public hyperlink = input(false, { - alias: 'hyperlink' + alias: 'hyperlink', }); public hyperlinkTarget = input('#', { - alias: 'target' - }) + alias: 'target', + }); public get buttonText(): string { return this.text(); diff --git a/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.html b/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.html index 01d1e3a..74ecb9c 100644 --- a/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.html +++ b/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.html @@ -1,6 +1,10 @@
-

{{ item()?.title }}

+

+ {{ item()?.title }} +

{{ item()?.description }}

-
\ No newline at end of file +
diff --git a/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.spec.ts b/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.spec.ts index cc154ff..ff55540 100644 --- a/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.spec.ts +++ b/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.spec.ts @@ -8,9 +8,8 @@ describe('AppFeatureCardComponent', () => { beforeEach(async () => { await TestBed.configureTestingModule({ - imports: [AppFeatureCardComponent] - }) - .compileComponents(); + imports: [AppFeatureCardComponent], + }).compileComponents(); fixture = TestBed.createComponent(AppFeatureCardComponent); component = fixture.componentInstance; diff --git a/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.ts b/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.ts index 5bd3722..c95df04 100644 --- a/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.ts +++ b/apps/documentations/src/app/shared/components/commons/app-feature-card/app-feature-card.component.ts @@ -4,8 +4,8 @@ import { Component, input } from '@angular/core'; selector: 'app-feature-card', imports: [], templateUrl: './app-feature-card.component.html', - styleUrl: './app-feature-card.component.scss' + styleUrl: './app-feature-card.component.scss', }) export class AppFeatureCardComponent { - item = input<{ title: string, description: string }>(); + item = input<{ title: string; description: string }>(); } diff --git a/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.html b/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.html index d407a63..e108d67 100644 --- a/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.html +++ b/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.html @@ -1,4 +1,6 @@ -
+

Released under the Apache-2.0 license. @@ -7,4 +9,4 @@ Copyright © 2024-present ElhakimDev99

-
\ No newline at end of file +
diff --git a/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.spec.ts b/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.spec.ts index 028c636..a531793 100644 --- a/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.spec.ts +++ b/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.spec.ts @@ -8,9 +8,8 @@ describe('AppFooterComponentComponent', () => { beforeEach(async () => { await TestBed.configureTestingModule({ - imports: [AppFooterComponentComponent] - }) - .compileComponents(); + imports: [AppFooterComponentComponent], + }).compileComponents(); fixture = TestBed.createComponent(AppFooterComponentComponent); component = fixture.componentInstance; diff --git a/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.ts b/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.ts index f39ac0a..1bf2fb4 100644 --- a/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.ts +++ b/apps/documentations/src/app/shared/components/commons/app-footer-component/app-footer-component.component.ts @@ -4,8 +4,6 @@ import { Component } from '@angular/core'; selector: 'app-footer-component', imports: [], templateUrl: './app-footer-component.component.html', - styleUrl: './app-footer-component.component.scss' + styleUrl: './app-footer-component.component.scss', }) -export class AppFooterComponentComponent { - -} +export class AppFooterComponentComponent {} diff --git a/apps/documentations/src/app/shared/components/commons/app-header-component/app-header-component.component.html b/apps/documentations/src/app/shared/components/commons/app-header-component/app-header-component.component.html index d2bd7e4..570585d 100644 --- a/apps/documentations/src/app/shared/components/commons/app-header-component/app-header-component.component.html +++ b/apps/documentations/src/app/shared/components/commons/app-header-component/app-header-component.component.html @@ -10,4 +10,4 @@
- \ No newline at end of file + diff --git a/apps/documentations/src/index.html b/apps/documentations/src/index.html index 3600850..6fef7cb 100644 --- a/apps/documentations/src/index.html +++ b/apps/documentations/src/index.html @@ -1,4 +1,4 @@ - + diff --git a/apps/documentations/src/main.ts b/apps/documentations/src/main.ts index 514c89a..8882c45 100644 --- a/apps/documentations/src/main.ts +++ b/apps/documentations/src/main.ts @@ -3,5 +3,5 @@ import { appConfig } from './app/app.config'; import { AppComponent } from './app/app.component'; bootstrapApplication(AppComponent, appConfig).catch((err) => - console.error(err) + console.error(err), ); diff --git a/apps/documentations/src/server.ts b/apps/documentations/src/server.ts index 2111f7c..0f3612e 100644 --- a/apps/documentations/src/server.ts +++ b/apps/documentations/src/server.ts @@ -34,7 +34,7 @@ app.use( maxAge: '1y', index: false, redirect: false, - }) + }), ); /** @@ -44,7 +44,7 @@ app.use('/**', (req, res, next) => { angularApp .handle(req) .then((response) => - response ? writeResponseToNodeResponse(response, res) : next() + response ? writeResponseToNodeResponse(response, res) : next(), ) .catch(next); }); diff --git a/apps/documentations/src/test-setup.ts b/apps/documentations/src/test-setup.ts index 318c3b9..dd9cc98 100644 --- a/apps/documentations/src/test-setup.ts +++ b/apps/documentations/src/test-setup.ts @@ -8,5 +8,5 @@ import { getTestBed } from '@angular/core/testing'; getTestBed().initTestEnvironment( BrowserDynamicTestingModule, - platformBrowserDynamicTesting() + platformBrowserDynamicTesting(), ); diff --git a/apps/playground/server.ts b/apps/playground/server.ts index 89071ed..172a43d 100644 --- a/apps/playground/server.ts +++ b/apps/playground/server.ts @@ -32,7 +32,7 @@ export function app(): express.Express { '*.*', express.static(browserDistFolder, { maxAge: '1y', - }) + }), ); // All routes render the Angular application diff --git a/apps/playground/src/app/app.component.html b/apps/playground/src/app/app.component.html index 16da5b8..97cdeba 100644 --- a/apps/playground/src/app/app.component.html +++ b/apps/playground/src/app/app.component.html @@ -29,18 +29,72 @@ class="flex min-w-[360px] w-[360px] h-full flex-col border rounded-md shadow-sm shadow-gray-300 border-opacity-50 border-gray-400 overflow-hidden" > @for (item of accordionData; track item.value) { + + +
+ {{ item.label }} +
+
+ +
+ + + + + {{ item.content }} + + + + } + + + + + @for (item of accordion2Data; track $index) {
@@ -49,82 +103,28 @@
- {{ item.content }} - } - -
- - - @for (item of accordion2Data; track $index) { - - -
- {{ item.label }} -
-
- -
- - - - {{ item.content }} - - - } diff --git a/apps/playground/src/app/app.component.spec.ts b/apps/playground/src/app/app.component.spec.ts index fe1d21a..7618e12 100644 --- a/apps/playground/src/app/app.component.spec.ts +++ b/apps/playground/src/app/app.component.spec.ts @@ -15,7 +15,7 @@ describe('AppComponent', () => { fixture.detectChanges(); const compiled = fixture.nativeElement as HTMLElement; expect(compiled.querySelector('h1')?.textContent).toContain( - 'Welcome playground' + 'Welcome playground', ); }); diff --git a/apps/playground/src/app/nx-welcome.component.ts b/apps/playground/src/app/nx-welcome.component.ts index f899c0a..1935591 100644 --- a/apps/playground/src/app/nx-welcome.component.ts +++ b/apps/playground/src/app/nx-welcome.component.ts @@ -16,9 +16,20 @@ import { CommonModule } from '@angular/common';