Replies: 1 comment 3 replies
-
|
There are a couple of paths forward for you here. One would be creating a component at the form level in Angular that could be reused throughout your application. This could be built in a way such that it can handle/abstract this behavior. In theory, you could also create a custom directive that you could then add to existing forms without the need for a separate component abstraction. Another option would be to create a custom Angular component with the button. This could wrap (or extend) the existing component and you could trigger the behavior you want at the button level. This would still require a change to your forms because that behavior would have to be initiated from somewhere. All in all, I think a custom directive that you can add to your form tags is probably the most straightforward option. |
Beta Was this translation helpful? Give feedback.
-
|
So far I've come up with: @Directive({
selector: 'cds-button'
})
export class TildaCdsButtonDirective extends CdsButtonDirective {
set loadingState(value: any) {
super.loadingState = value;
if (value == ClrLoadingState.success || value == ClrLoadingState.error) {
setTimeout(() => {
super.loadingState = ClrLoadingState.default;
}, 600);
}
}
}That takes care of the loading state but the transition animation from the clr buttons are still lost. I haven't found a good way to animate the What was the reasoning for dropping the button state transition animations in cds core? |
Beta Was this translation helpful? Give feedback.
-
|
I don't think that dropping the button state transition was intentional. At the time the button in I will open an issue to do that. |
Beta Was this translation helpful? Give feedback.
-
|
Github issue for the button animation: #16 |
Beta Was this translation helpful? Give feedback.
-
The old clr angular buttons had a briefly check mark shown when set to
ClrLoadingState.SUCCESS. The newcds-buttonare stateless and I was wondering which way is the best way to extendcds-buttonso that it will behave like the old angular buttons do.So far I've come up with:
But I would have to add it to every
submit()method in my application. Is it possible to extendcds-buttonwith this behavior? I've been looking at Angular directives but I must say I'm not sure it's the best way or if at all possible to extend Clarity Core components this way.Beta Was this translation helpful? Give feedback.
All reactions