docs(ngx-components): describe how to use with standalone components (#…

…2183)
db-ui · Feb 8, 2024 · 729810a · 729810a
1 parent b816ee3
commit 729810a
Show file tree

Hide file tree

Showing 22 changed files with 130 additions and 132 deletions.
diff --git a/packages/components/_templates/mitosis/new/readmes/readme-angular.ejs.t b/packages/components/_templates/mitosis/new/readmes/readme-angular.ejs.t
@@ -7,16 +7,15 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DB<%= h.changeCase.pascal(name) %>Module } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
   imports: [..., DB<%= h.changeCase.pascal(name) %>Module],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/_templates/update-docs/new/readme-angular.ejs.t b/packages/components/_templates/update-docs/new/readme-angular.ejs.t
@@ -8,16 +8,15 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DB<%= h.changeCase.pascal(name) %>Module } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
   imports: [..., DB<%= h.changeCase.pascal(name) %>Module],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/accordion-item/docs/Angular.md b/packages/components/src/components/accordion-item/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration look at the [ngx-components](https://
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBAccordionItemModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBAccordionItemModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/accordion/docs/Angular.md b/packages/components/src/components/accordion/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration look at the [ngx-components](https://
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBAccordionModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBAccordionModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/alert/docs/Angular.md b/packages/components/src/components/alert/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBAlertModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBAlertModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/badge/docs/Angular.md b/packages/components/src/components/badge/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBBadgeModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBBadgeModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/brand/docs/Angular.md b/packages/components/src/components/brand/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBBrandModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBBrandModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/button/docs/Angular.md b/packages/components/src/components/button/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBButtonModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBButtonModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/checkbox/docs/Angular.md b/packages/components/src/components/checkbox/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBCheckboxModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBCheckboxModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/divider/docs/Angular.md b/packages/components/src/components/divider/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBDividerModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBDividerModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/drawer/docs/Angular.md b/packages/components/src/components/drawer/docs/Angular.md
@@ -8,16 +8,16 @@ If you use `width !== full` you are able to overwrite the `max-width` with `--db
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBDrawerModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBDrawerModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/icon/docs/Angular.md b/packages/components/src/components/icon/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBIconModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBIconModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/infotext/docs/Angular.md b/packages/components/src/components/infotext/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBInfotextModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBInfotextModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/link/docs/Angular.md b/packages/components/src/components/link/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBLinkModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBLinkModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/main-navigation/docs/Angular.md b/packages/components/src/components/main-navigation/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration look at the [ngx-components](https://
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBMainNavigationModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBMainNavigationModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/popover/docs/Angular.md b/packages/components/src/components/popover/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBPopoverModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBPopoverModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component

diff --git a/packages/components/src/components/radio/docs/Angular.md b/packages/components/src/components/radio/docs/Angular.md
@@ -4,16 +4,16 @@ For general installation and configuration take a look at the [ngx-components](h
 
 ### Load component
 
-```ts app.module.ts
-//app.module.ts
+```ts app.component.ts
+// app.component.ts
 import { DBRadioModule } from '@db-ui/ngx-components';
 
-@NgModule({
-  ...
+@Component({
+  // ...
+  standalone: true,
   imports: [..., DBRadioModule],
-  ...
+  // ...
 })
-
 ```
 
 ### Use component