graycoreio / daffodil

Angular Ecommerce PWA Framework
https://next.daff.io
MIT License
156 stars 31 forks source link

[FEAT] Update all `@daffodil/design` components as standalone #3027

Closed xelaint closed 3 weeks ago

xelaint commented 2 months ago

:bulb: Feature request

Feature Name

Update all @daffodil/design components as standalone

The Desired Behavior

All @daffodil/design components should be standalone.

  1. Add array export for component directives (https://v17.angular.io/guide/standalone-components#standalone-components-for-library-authors)
  2. Add deprecation flag to all modules
  3. Update documentation

Documentation template:


## Usage

## Within a standalone component
To use breadcrumb in a standalone component, import it directly into your custom component:

```ts
@Component({
  selector: 'custom-component',
  templateUrl: './custom-component.component.html',
  standalone: true,
  imports: [
    DAFF_BREADCRUMB_COMPONENTS,
  ],
})
export class CustomComponent {}
```

## Within a module (deprecated)
To use breadcrumb in a module, import `DaffBreadcrumbModule` into your custom module:

```ts
import { NgModule } from '@angular/core';

import { DaffBreadcrumbModule } from './breadcrumb/breadcrumb.component';

@NgModule({
    declarations: [
    CustomComponent,
  ],
  exports: [
    CustomComponent,
  ],
  imports: [
    DaffBreadcrumbModule,
  ],
})
export class CustomComponentModule { }
```

> This method is deprecated. It's recommended to update all custom components to standalone.
## Your Use Case ## Prior Work ## Environment

Daffodil version: X.Y.Z
Angular version: X.Y.Z 


For Tooling issues:
- Node version: XX  
- Platform:  

Others: