"Select All" only appears when clicking outside of a shape via actionFilter (#329)
Co-authored-by: Christopher Chedeau <vjeuxx@gmail.com>
This commit is contained in:
parent
88a9cee8bb
commit
abf2aaa102
@ -1,5 +1,10 @@
|
|||||||
import React from "react";
|
import React from "react";
|
||||||
import { Action, ActionsManagerInterface, UpdaterFn } from "./types";
|
import {
|
||||||
|
Action,
|
||||||
|
ActionsManagerInterface,
|
||||||
|
UpdaterFn,
|
||||||
|
ActionFilterFn
|
||||||
|
} from "./types";
|
||||||
import { ExcalidrawElement } from "../element/types";
|
import { ExcalidrawElement } from "../element/types";
|
||||||
import { AppState } from "../types";
|
import { AppState } from "../types";
|
||||||
|
|
||||||
@ -40,9 +45,11 @@ export class ActionManager implements ActionsManagerInterface {
|
|||||||
getContextMenuItems(
|
getContextMenuItems(
|
||||||
elements: readonly ExcalidrawElement[],
|
elements: readonly ExcalidrawElement[],
|
||||||
appState: AppState,
|
appState: AppState,
|
||||||
updater: UpdaterFn
|
updater: UpdaterFn,
|
||||||
|
actionFilter: ActionFilterFn = action => action
|
||||||
) {
|
) {
|
||||||
return Object.values(this.actions)
|
return Object.values(this.actions)
|
||||||
|
.filter(actionFilter)
|
||||||
.filter(action => "contextItemLabel" in action)
|
.filter(action => "contextItemLabel" in action)
|
||||||
.sort(
|
.sort(
|
||||||
(a, b) =>
|
(a, b) =>
|
||||||
|
@ -14,6 +14,7 @@ type ActionFn = (
|
|||||||
) => ActionResult;
|
) => ActionResult;
|
||||||
|
|
||||||
export type UpdaterFn = (res: ActionResult) => void;
|
export type UpdaterFn = (res: ActionResult) => void;
|
||||||
|
export type ActionFilterFn = (action: Action) => void;
|
||||||
|
|
||||||
export interface Action {
|
export interface Action {
|
||||||
name: string;
|
name: string;
|
||||||
@ -46,7 +47,8 @@ export interface ActionsManagerInterface {
|
|||||||
getContextMenuItems: (
|
getContextMenuItems: (
|
||||||
elements: readonly ExcalidrawElement[],
|
elements: readonly ExcalidrawElement[],
|
||||||
appState: AppState,
|
appState: AppState,
|
||||||
updater: UpdaterFn
|
updater: UpdaterFn,
|
||||||
|
actionFilter: ActionFilterFn
|
||||||
) => { label: string; action: () => void }[];
|
) => { label: string; action: () => void }[];
|
||||||
renderAction: (
|
renderAction: (
|
||||||
name: string,
|
name: string,
|
||||||
|
@ -64,7 +64,7 @@ import {
|
|||||||
actionPasteStyles
|
actionPasteStyles
|
||||||
} from "./actions";
|
} from "./actions";
|
||||||
import { SidePanel } from "./components/SidePanel";
|
import { SidePanel } from "./components/SidePanel";
|
||||||
import { ActionResult } from "./actions/types";
|
import { Action, ActionResult } from "./actions/types";
|
||||||
import { getDefaultAppState } from "./appState";
|
import { getDefaultAppState } from "./appState";
|
||||||
|
|
||||||
let { elements } = createScene();
|
let { elements } = createScene();
|
||||||
@ -123,6 +123,7 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
rc: RoughCanvas | null = null;
|
rc: RoughCanvas | null = null;
|
||||||
|
|
||||||
actionManager: ActionManager = new ActionManager();
|
actionManager: ActionManager = new ActionManager();
|
||||||
|
canvasOnlyActions: Array<Action>;
|
||||||
constructor(props: any) {
|
constructor(props: any) {
|
||||||
super(props);
|
super(props);
|
||||||
this.actionManager.registerAction(actionDeleteSelected);
|
this.actionManager.registerAction(actionDeleteSelected);
|
||||||
@ -151,6 +152,8 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
|
|
||||||
this.actionManager.registerAction(actionCopyStyles);
|
this.actionManager.registerAction(actionCopyStyles);
|
||||||
this.actionManager.registerAction(actionPasteStyles);
|
this.actionManager.registerAction(actionPasteStyles);
|
||||||
|
|
||||||
|
this.canvasOnlyActions = [actionSelectAll];
|
||||||
}
|
}
|
||||||
|
|
||||||
private syncActionResult = (res: ActionResult) => {
|
private syncActionResult = (res: ActionResult) => {
|
||||||
@ -398,7 +401,13 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
navigator.clipboard && {
|
navigator.clipboard && {
|
||||||
label: "Paste",
|
label: "Paste",
|
||||||
action: () => this.pasteFromClipboard()
|
action: () => this.pasteFromClipboard()
|
||||||
}
|
},
|
||||||
|
...this.actionManager.getContextMenuItems(
|
||||||
|
elements,
|
||||||
|
this.state,
|
||||||
|
this.syncActionResult,
|
||||||
|
action => this.canvasOnlyActions.includes(action)
|
||||||
|
)
|
||||||
],
|
],
|
||||||
top: e.clientY,
|
top: e.clientY,
|
||||||
left: e.clientX
|
left: e.clientX
|
||||||
@ -425,7 +434,8 @@ export class App extends React.Component<{}, AppState> {
|
|||||||
...this.actionManager.getContextMenuItems(
|
...this.actionManager.getContextMenuItems(
|
||||||
elements,
|
elements,
|
||||||
this.state,
|
this.state,
|
||||||
this.syncActionResult
|
this.syncActionResult,
|
||||||
|
action => !this.canvasOnlyActions.includes(action)
|
||||||
)
|
)
|
||||||
],
|
],
|
||||||
top: e.clientY,
|
top: e.clientY,
|
||||||
|
Loading…
x
Reference in New Issue
Block a user