CommandItem
CommandItem is the definition of a custom menu, tool or shortcut, and is applied to the following interfaces:
pixso.setTopTools(tools: Tool[]): voidpixso.setTopLeftTools(tools: Tool[]): voidpixso.setBottomTools(tools: Tool[]): voidpixso.stickyToolbar.open(tools: Tool[]): voidpixso.setContextMenus(menus: ContextMenuItem[]): voidpixso.setShortcuts(shortcuts: ShortcutItem[]): void
typescript
interface CommandItem = {
label: string;
value: string;
disabled?: boolean;
description?: string;
icon?: string | Uint8Array; // svg string or image binary data. PS: When iconUrl also exists, icon data will be used first.
iconUrl?: string;
size?: number; // Icon size, supported by top-left tools only.
tippy?: {
showOnCreate?: boolean; // Whether to show the tooltip when created, supported by top-left tools only.
maxWidth?: number; // Tooltip max width, supported by top-left tools only.
placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end"; // Tooltip placement. Defaults to "bottom". Supported by top-left tools only.
};
guide?: {
// A persistent guide bubble (PxGuideCard) anchored to the tool icon. Supported by top-left tools only.
// When enabled, the bubble does not auto-dismiss and only closes when the user clicks the close button
// or clicks the tool icon. The closed state is not persisted.
enabled: boolean;
title?: string;
content?: string; // Body text. Falls back to label when omitted.
closeText?: string; // Close button text. Defaults to "我知道了".
};
children: Array<CommandItem>
};
type CommandItemWithoutIcon = Omit<CommandItem, "icon" | "iconUrl">;
type SeparatorItem = {
separator: true;
};ToolItem
typescript
type ToolItem =
| SeparatorItem
| (CommandItem & {
children?: Array<ToolItem>;
});ContextMenuItem
typescript
type ContextMenuItem =
| SeparatorItem
| (CommandItemWithoutIcon & {
children?: Array<ContextMenuItem>;
});ShortcutItem
typescript
type SubShortcutItem = CommandItemWithoutIcon & {
children?: Array<SubShortcutItem>;
};
type ShortcutItem = CommandItem & {
children?: Array<SubShortcutItem>;
};