mirror of
https://github.com/alibaba/lowcode-engine.git
synced 2026-01-19 14:04:28 +00:00
add focusing track
This commit is contained in:
parent
7ef3f300ea
commit
e21a74a15e
@ -1,22 +1,47 @@
|
|||||||
|
import { hotkey } from '../hotkey';
|
||||||
|
|
||||||
class FocusingManager {
|
class FocusingManager {
|
||||||
deploy() {
|
deploy() {
|
||||||
|
// in
|
||||||
|
hotkey.bind('esc', () => {
|
||||||
|
// do esc
|
||||||
|
});
|
||||||
|
hotkey.bind(['command + s', 'ctrl + s'], () => {
|
||||||
|
// do save
|
||||||
|
// do esc
|
||||||
|
});
|
||||||
}
|
}
|
||||||
send(e: MouseEvent | KeyboardEvent) {
|
private actives: Focusable[] = [];
|
||||||
|
send(e: MouseEvent) {
|
||||||
|
// if keyborad event check is esc or
|
||||||
}
|
}
|
||||||
addModalCheck() {
|
addModalCheck(check) {
|
||||||
|
|
||||||
}
|
}
|
||||||
create(config: FocusableConfig) {
|
create(config: FocusableConfig) {
|
||||||
|
|
||||||
}
|
}
|
||||||
activeItem() {
|
internalActiveItem(item: Focusable) {
|
||||||
|
const first = this.actives[0];
|
||||||
|
if (first === item) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
const i = this.actives.indexOf(item);
|
||||||
|
if (i > -1) {
|
||||||
|
this.actives.splice(i, 1);
|
||||||
|
}
|
||||||
|
this.actives.unshift(item);
|
||||||
|
if (!item.isModal && first) {
|
||||||
|
// trigger Blur
|
||||||
|
first.internalTriggerBlur();
|
||||||
|
}
|
||||||
|
// trigger onActive
|
||||||
}
|
}
|
||||||
suspenceItem() {
|
internalSuspenceItem(item: Focusable) {
|
||||||
|
const i = this.actives.indexOf(item);
|
||||||
|
if (i > -1) {
|
||||||
|
this.actives.splice(i, 1);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -25,24 +50,46 @@ export interface FocusableConfig {
|
|||||||
modal?: boolean;
|
modal?: boolean;
|
||||||
onEsc?: () => void;
|
onEsc?: () => void;
|
||||||
onBlur?: () => void;
|
onBlur?: () => void;
|
||||||
|
onSave?: () => void;
|
||||||
}
|
}
|
||||||
|
|
||||||
class Focusable {
|
class Focusable {
|
||||||
readonly isModal: boolean;
|
readonly isModal: boolean;
|
||||||
constructor(private manager: FocusingManager, { range, modal }: FocusableConfig) {
|
constructor(private manager: FocusingManager, private config: FocusableConfig) {
|
||||||
this.isModal = modal == null ? false : modal;
|
this.isModal = config.modal == null ? false : config.modal;
|
||||||
|
|
||||||
}
|
|
||||||
checkRange(e: MouseEvent) {
|
|
||||||
|
|
||||||
}
|
}
|
||||||
active() {
|
active() {
|
||||||
this.manager.activeItem(this);
|
this.manager.internalActiveItem(this);
|
||||||
}
|
}
|
||||||
suspence() {
|
suspence() {
|
||||||
this.manager.suspenceItem(this);
|
this.manager.internalSuspenceItem(this);
|
||||||
}
|
}
|
||||||
purge() {
|
purge() {
|
||||||
|
this.manager.internalSuspenceItem(this);
|
||||||
|
}
|
||||||
|
internalCheckInRange(e: MouseEvent) {
|
||||||
|
const { range } = this.config;
|
||||||
|
if (!range) {
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
if (typeof range === 'function') {
|
||||||
|
return range(e);
|
||||||
|
}
|
||||||
|
return range.contains(e.target as HTMLElement);
|
||||||
|
}
|
||||||
|
internalTriggerBlur() {
|
||||||
|
if (this.config.onBlur) {
|
||||||
|
this.config.onBlur();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
internalTriggerSave() {
|
||||||
|
if (this.config.onSave) {
|
||||||
|
this.config.onSave();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
internalTriggerEsc() {
|
||||||
|
if (this.config.onEsc) {
|
||||||
|
this.config.onEsc();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user