[FEAT] Update Design Mixins to Host Directives

[xelaint]

💡 Feature request

Feature Name

Update Design Mixins to Host Directives

The Desired Behavior

Update core design mixins to host directives instead. This simplifies the implementation process of our commonly used input properties. Eliminates the needs to construct ElementRef and Renderer in every component that uses core properties.

• daffArticleEncapsulatedMixin
• daffColorMixin
• daffCompactableMixin
• daffManageContainerLayoutMixin
• daffSizeMixin
• daffSkeletonableMixin
• daffStatusMixin
• daffTextAlignmentMixin

Your Use Case

As a developer, I would like the implementation process for design's core properties to be simpler.

Prior Work

https://angular.dev/guide/directives/directive-composition-api

Environment

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

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

Others: