명령 팔레트 API · Needless UI

가져오기

import-command.ts

import { type NuiCommand, NuiCommandPalette } from '@needless-ui/angular/command';

NuiCommandPalette

명령을 검색하는 필드가 있는 모달 다이얼로그입니다.

셀렉터: nui-command-palette

NuiCommandPalette: 속성
이름	타입	기본값	설명
`commands`입력	`NuiCommand[]`		명령 목록. `NuiCommand` 객체로 지정합니다.
`open`양방향	`boolean`	`false`	팔레트가 열려 있는지 여부.
`hotkey`입력	`string \| null`	`'mod+k'`	어디서나 팔레트를 열고 닫는 단축키이며, 없애려면 `null`을 지정합니다. `mod`는 Apple 기기에서는 ⌘, 그 외에서는 Ctrl입니다.
`bindShortcuts`입력	`boolean`	`false`	페이지 어디서든 각 명령의 단축키로도 명령을 실행합니다.
`loop`입력	`boolean`	`true`	마지막 명령에서 아래로 가면 첫 번째로, 첫 번째 명령에서 위로 가면 마지막으로 이동합니다.
`filtering`입력	`boolean`	`true`	입력하는 대로 필터링합니다. 서버에서 명령을 필터링할 때는 끕니다.
`loading`입력	`boolean`	`false`	결과를 기다리는 동안 로딩 행을 표시합니다.
`hints`입력	`boolean`	`true`	하단에 사용할 수 있는 키를 표시합니다.
`virtual`입력	`boolean \| 'auto'`	`'auto'`	보이는 행만 렌더링합니다: 항상, 안 함, 또는 200행을 넘으면 켜지는 `auto`.
`label`입력	`string`	`'Command palette'`	다이얼로그와 검색 필드의 접근 가능한 이름.
`placeholder`입력	`string`	`'Type a command or search…'`	빈 검색 필드에 표시되는 텍스트.
`run`출력	`NuiCommand`		실행되는 각 명령을 내보냅니다.
`queryChange`출력	`string`		입력되는 텍스트를 내보냅니다. 서버 검색에 사용합니다.
`show`메서드	`() => void`		팔레트를 엽니다.
`hide`메서드	`() => void`		팔레트를 닫습니다.
`toggle`메서드	`() => void`		팔레트를 열거나 닫습니다.
`back`메서드	`() => void`		이전 페이지로 돌아갑니다.

표시하거나 읽어 주는 모든 텍스트도 입력이므로 번역할 수 있습니다: emptyLabel loadingLabel backLabel closeLabel moveLabel chooseLabel

NuiCommand

명령 하나, 또는 명령이 담긴 페이지입니다.

NuiCommand: 속성
이름	타입	설명
`label`속성	`string`	표시되고 검색되는 텍스트.
`description`속성	`string`	레이블 아래의 보조 텍스트.
`group`속성	`string`	같은 그룹의 명령은 그 제목 아래에 나열됩니다.
`keywords`속성	`string[]`	검색에서 일치시킬 추가 단어. 예: 동의어.
`shortcut`속성	`string`	함께 표시되는 키. 예: `mod+shift+p`.
`disabled`속성	`boolean`	표시되지만 실행할 수 없습니다.
`children`속성	`NuiCommand[]`	한 단계 아래의 명령. 이 명령을 선택하면 페이지로 열립니다.
`run`속성	`() => void`	선택되면 팔레트가 닫힌 뒤 실행됩니다.
`id`속성	`string`	자유롭게 쓰는 값. 예를 들어 `(run)`에서 명령을 구분할 때 사용합니다.