08 ‐ Stateless

Logotype

<app-logotype />

Desktop, Table and mobile version, switched based on tailwind css behaviors.

Input

<app-input />

Input / Output	Default	Required	Description
placeholder	undefined	no	initial content inside the field
content	""	maybe	model based on angular two way binding pattern
disabled	false	no	html attribute for allowance
multiline	false	no	type of field
number	false	no	type of field
maxLength	null	maybe	max characters

settings/form.config

• Wrap: css tailwind classes that groups every future children

Badge

<app-badge-pause /> <app-badge-progress /> <app-badge-done />

All possible states/behaviors

settings/badge.config

• Wrap: css tailwind classes that groups every future children

Notification

<app-notification-warning /> <app-notification-error /> <app-notification-success />

Input / Output	Default	Required	Description
cssClass	undefined	no	additional css classes to wrapper element
label	""	no	any content displayed after icon

settings/notification.config

• Wrap: css tailwind classes that groups every future children
• Icon: css tailwind classes that define icon positions and family

ReactionBox

Input / Output	Default	Required	Description
id	0	yes	entity id
counter	"12314"	maybe	likes number (total)
price	"434,76"	maybe	suggestion price for this project

NotificationBox

Name	Type	3rd Party	Description
Notification	Services	no	expose notification methods to queue messages
isSuccess	Method	no	validate on typescript if current iterable item is success enum
isError	Method	no	validate on typescript if current iterable item is error enum
isWarning	Method	no	validate on typescript if current iterable item is warning enum

Smoot transitions

Just change the cssClass properly before pop item from the queue - this is the responsability of the consumer.