diff --git a/README.md b/README.md index 78a7de7..5ae03d1 100644 --- a/README.md +++ b/README.md @@ -173,6 +173,7 @@ The available fields to customize an action are: - `label`: this is the text what will be shown on the button if no icons exist for the name you provided - `detect`: this is either a `FateType` or a function that takes a `FateNode` as an input and returns either `false` or an object with a `value` field that will be value passed to the dropdown (if any) - `dropdown`: this is an Angular Component implementing the `FateDropdown` interface. It will be use to show a dialog that allows the user to customize the value of the command + - `closeOnEmit`: this is for determination if close dropdown, when emits a value ### Add the icon to your toolbar In the template where your ui is included you can simply add the new custom button by it's `name`: diff --git a/src/app/fate-ui/fate-ui.component.ts b/src/app/fate-ui/fate-ui.component.ts index 85561d3..1275e4e 100644 --- a/src/app/fate-ui/fate-ui.component.ts +++ b/src/app/fate-ui/fate-ui.component.ts @@ -97,7 +97,7 @@ export class FateUiComponent implements OnChanges, AfterViewInit { if (!button.classList.contains('fate-ui-button')) { button = this.legacyBrowser.findParent(button, '.fate-ui-button'); } - if(!button) { + if (!button) { return } const dropdown = this.el.nativeElement.querySelector('.fate-ui-dropdown'); @@ -106,7 +106,7 @@ export class FateUiComponent implements OnChanges, AfterViewInit { this.dropdownValue = this.enabled[action]; console.debug('action has value', button, dropdown, this.dropdownValue); - this.initDropdown(this.controller.getAction(action).dropdown, this.dropdownValue); + this.initDropdown(this.controller.getAction(action).dropdown, this.dropdownValue, this.controller.getAction(action).closeOnEmit); // Postion the dropdown setTimeout(() => { @@ -147,7 +147,7 @@ export class FateUiComponent implements OnChanges, AfterViewInit { }; } - protected initDropdown(actionComponent, value) { + protected initDropdown(actionComponent, value, closeOnEmit) { if (this.dropdownComponent) { this.dropdownComponent.destroy(); } @@ -158,6 +158,7 @@ export class FateUiComponent implements OnChanges, AfterViewInit { component.instance.valueChange.subscribe((newValue) => { this.dropdownValue = newValue; this.controller.do(this.uiId, this.dropdownAction, newValue); + this.dropdownAction = closeOnEmit ? false : this.dropdownAction; }); this.dropdownComponent = this.viewContainerRef.insert(component.hostView); } else {