mirror of
https://github.com/bitwarden/browser
synced 2025-12-13 14:53:33 +00:00
[CL-58] Make icon button compatible with bit suffix directive (#4057)
* [CL-58] feat: add support for modyfing button types from directives * [CL-58] feat: set button type secondary when used as prefix/suffix * [CL-58] chore: add example using suffix to async actions story * [CL-58] feat: update story with examples * [CL-58] feat: allow buttons to have their style unset * [CL-58] feat: move all styling into prefix/suffix * [CL-58] fix: static content prefix/suffix * [CL-58] fix: add missing bitFormButton to bitAction * [CL-58] fix: disabled opacity not overriding correctly * [CL-58] feat: change hover color to muted * [CL-58] feat: replace undefined with unstyled * [CL-58] fix: focus borders on input and prefix/suffix * [CL-58] feat: update production code to use icon button correctly * [CL-58] refactor: move out button type to common place * [CL-58] fix: buttons not migrated correctly * [CL-58] feat: use icon button in password toggle * [CL-58] fix: remove button icon stories * [SM-358] Migrate password toggles (#4129) * [CL-58] fix: missing i18n service in story * [CL-58] fix: missing bitIconButton directive in export comp Co-authored-by: Oscar Hinton <Hinton@users.noreply.github.com> Co-authored-by: Thomas Rittson <trittson@bitwarden.com>
This commit is contained in:
@@ -27,6 +27,7 @@ const template = `
|
||||
<bit-form-field>
|
||||
<bit-label>Email</bit-label>
|
||||
<input bitInput formControlName="email" />
|
||||
<button type="button" bitSuffix bitIconButton="bwi-refresh" bitFormButton [bitAction]="refresh"></button>
|
||||
</bit-form-field>
|
||||
|
||||
<button class="tw-mr-2" type="submit" buttonType="primary" bitButton bitFormButton>Submit</button>
|
||||
@@ -47,6 +48,12 @@ class PromiseExampleComponent {
|
||||
|
||||
constructor(private formBuilder: FormBuilder) {}
|
||||
|
||||
refresh = async () => {
|
||||
await new Promise<void>((resolve, reject) => {
|
||||
setTimeout(resolve, 2000);
|
||||
});
|
||||
};
|
||||
|
||||
submit = async () => {
|
||||
this.formObj.markAllAsTouched();
|
||||
|
||||
@@ -78,6 +85,10 @@ class ObservableExampleComponent {
|
||||
|
||||
constructor(private formBuilder: FormBuilder) {}
|
||||
|
||||
refresh = () => {
|
||||
return of("fake observable").pipe(delay(2000));
|
||||
};
|
||||
|
||||
submit = () => {
|
||||
this.formObj.markAllAsTouched();
|
||||
|
||||
|
||||
Reference in New Issue
Block a user