import type { ScalarIconComponent } from '@scalar/icons/types'; import type { CommandPalettePayload } from '@scalar/workspace-store/events'; import { type Component, type ComputedRef, type MaybeRefOrGetter, type Ref, type ShallowRef } from 'vue'; import type { RouteLocationRaw } from 'vue-router'; /** * Command IDs that map to UI components (folder and hidden-folder types) * * For base app commands they are defined by their action payload */ type UiCommandIds = keyof CommandPalettePayload; /** Map the the prop definitons to the prop value */ type CommandPaletteActionProps = CommandPalettePayload[K]; /** * Type for the open function in the command palette. * Supports two usage patterns: * - open() - Opens the palette without a specific command * - open(commandId) - Opens a command that does not require props * - open(commandId, props) - Opens a command with required props */ type OpenCommand = { (): void; (commandId: T, props: CommandPaletteActionProps): void; }; /** Route enntry for the palette list */ export type CommandPaletteRoute = { id: string; type: 'route'; icon: ScalarIconComponent; name: string; to: RouteLocationRaw; }; /** Command entry for the palette list */ type BaseCommandPaletteAction = { id: keyof CommandPalettePayload; name: string; icon?: ScalarIconComponent; component: Component; hidden?: boolean; }; export type CommandPaletteAction = Omit & { id: string; }; export type CommandPaletteEntry = CommandPaletteAction | CommandPaletteRoute; /** * Return type for the useCommandPaletteState composable. * Provides reactive state and methods to control the command palette. */ export type CommandPaletteState = { /** Whether the command palette is currently open */ isOpen: Ref; /** The currently active command, or null if showing the main list */ activeCommand: ShallowRef; /** Properties passed to the active command component */ activeCommandProps: Ref | null>; /** Current filter/search query for filtering commands */ filterQuery: Ref; /** Grouped actions and routes to be rendered */ filteredCommands: ComputedRef<{ label?: string; commands: (CommandPaletteAction | CommandPaletteRoute)[]; }[]>; /** * Opens the command palette, optionally with a specific command active. * When opening a command, props are required only if the command defines them. */ open: OpenCommand; /** Closes the command palette and resets state */ close: () => void; /** Updates the filter query for searching commands */ setFilterQuery: (query: string) => void; /** Resets all state to initial values */ reset: () => void; }; /** * Composable for managing command palette state. * * Centralizes all state management for the command palette including: * - Open/closed state * - Filter/search query * - Command filtering logic * * @example * const palette = useCommandPaletteState() * * // Open the palette * palette.open() * * // Open with a specific command * palette.open('create-openapi-document') * * // Open with command props * palette.open('import-curl-command', { curl: 'curl https://api.example.com' }) * * // Update filter query (automatically filters commands) * palette.setFilterQuery('import') * * // Access filtered results * console.log(palette.filteredCommands.value) * * // Close and reset * palette.close() */ export declare const useCommandPaletteState: (actions?: MaybeRefOrGetter, routes?: MaybeRefOrGetter) => CommandPaletteState; /** * The base naviation routes used in the command palette. * This object can be extended and passed to the useCommandPaletteState hook to add custom routes */ export declare const baseRoutes: CommandPaletteRoute[]; /** * The internal client command palette actions * This object can be extended and passed to the useCommandPaletteState hook to add custom actions */ export declare const baseClientActions: [{ readonly id: "import-from-openapi-swagger-postman-curl"; readonly name: "Import from OpenAPI/Swagger/Postman/cURL"; readonly component: { new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; fileLoader?: import("@scalar/json-magic/bundle").LoaderPlugin; }> & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, {}>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & import("vue").ComponentOptionsBase & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => { $slots: { fileUpload(props: { import: (source: string, type: "file" | "raw") => Promise; }): void; }; }); readonly icon: { new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly & Readonly<{}>, {}, {}, {}, {}, {}>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & import("vue").ComponentOptionsBase & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => { $slots: { default?: (props: {}) => any; }; }); }, { readonly id: "create-openapi-document"; readonly name: "Create OpenAPI Document"; readonly component: import("vue").DefineComponent<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, string, import("vue").PublicProps, Readonly<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; }> & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; readonly icon: { new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly & Readonly<{}>, {}, {}, {}, {}, {}>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & import("vue").ComponentOptionsBase & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => { $slots: { default?: (props: {}) => any; }; }); }, { readonly id: "add-tag"; readonly name: "Add Tag"; readonly component: import("vue").DefineComponent<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; tag?: import("@scalar/workspace-store/schemas/navigation").TraversedTag; }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, string, import("vue").PublicProps, Readonly<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; tag?: import("@scalar/workspace-store/schemas/navigation").TraversedTag; }> & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; readonly icon: { new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly & Readonly<{}>, {}, {}, {}, {}, {}>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & import("vue").ComponentOptionsBase & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => { $slots: { default?: (props: {}) => any; }; }); }, { readonly id: "create-request"; readonly name: "Create Request"; readonly component: import("vue").DefineComponent<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; tagId?: string; }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, string, import("vue").PublicProps, Readonly<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; tagId?: string; }> & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; readonly icon: { new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly & Readonly<{}>, {}, {}, {}, {}, {}>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & import("vue").ComponentOptionsBase & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => { $slots: { default?: (props: {}) => any; }; }); }, { readonly id: "add-example"; readonly name: "Add Example"; readonly component: import("vue").DefineComponent<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; operationId?: string; example?: import("@scalar/workspace-store/schemas/navigation").TraversedExample; }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, string, import("vue").PublicProps, Readonly<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; operationId?: string; example?: import("@scalar/workspace-store/schemas/navigation").TraversedExample; }> & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; readonly icon: { new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, import("vue").PublicProps, {}, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, { P: {}; B: {}; D: {}; C: {}; M: {}; Defaults: {}; }, Readonly & Readonly<{}>, {}, {}, {}, {}, {}>; __isFragment?: never; __isTeleport?: never; __isSuspense?: never; } & import("vue").ComponentOptionsBase & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {}, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => { $slots: { default?: (props: {}) => any; }; }); }, { readonly id: "import-curl-command"; readonly name: "Import cURL Command"; readonly hidden: true; readonly component: import("vue").DefineComponent<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; inputValue: string; }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, string, import("vue").PublicProps, Readonly<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; inputValue: string; }> & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; }, { readonly id: "edit-tag"; readonly name: "Edit Tag"; readonly hidden: true; readonly component: import("vue").DefineComponent<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; tag?: import("@scalar/workspace-store/schemas/navigation").TraversedTag; }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, string, import("vue").PublicProps, Readonly<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; tag?: import("@scalar/workspace-store/schemas/navigation").TraversedTag; }> & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; }, { readonly id: "edit-example"; readonly name: "Edit Example"; readonly hidden: true; readonly component: import("vue").DefineComponent<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; operationId?: string; example?: import("@scalar/workspace-store/schemas/navigation").TraversedExample; }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & { close: () => any; back: (keyboardEvent: KeyboardEvent) => any; }, string, import("vue").PublicProps, Readonly<{ workspaceStore: import("@scalar/workspace-store/client").WorkspaceStore; eventBus: import("@scalar/workspace-store/events").WorkspaceEventBus; documentName?: string; operationId?: string; example?: import("@scalar/workspace-store/schemas/navigation").TraversedExample; }> & Readonly<{ onClose?: (() => any) | undefined; onBack?: ((keyboardEvent: KeyboardEvent) => any) | undefined; }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>; }]; export {}; //# sourceMappingURL=use-command-palette-state.d.ts.map