Command Bar 101
Command Tutorials
Action
Actions tell the Command Bar to perform a side effect (e.g. open a URL or copy something to the clipboard). They can be used in two places:
1
export type Action =
2
| ActionOpenURL
3
| ActionPaste
4
| ActionCopy
5
| ActionShowToast
6
| ActionMove;
7
8
type ActionMove = ActionMoveAddParam;
Copied!
ActionOpenURL
Opens a given URL using the system's default handler.
- type:
"open-url" - url: The URL to open. You can use any valid URI schema. For example, "https://", "file://", "ssh://", "slack://" (native app). Provide a string to open a single URL or an array of strings to open multiple URLs at once.
Open a URL in the browser
Open multiple URLs at once
List View: open Google and Bing URLs
Open a local folder in Finder
Open a Slack channel in the Slack desktop app
1
{
2
"action": {
3
"type": "open-url",
4
"url": "https://slapdash.com/",
5
}
6
}
Copied!
1
{
2
"action": {
3
"type": "open-url",
4
"url": [
5
"https://google.com/",
6
"https://bing.com/"
7
]
8
}
9
}
Copied!
1
{
2
"view": {
3
"type": "list",
4
"options": [
5
{
6
"title": "Open Google",
7
"action": {
8
"type": "open-url",
9
"url": "https://www.google.com/"
10
}
11
},
12
{
13
"title": "Open Bing",
14
"action": {
15
"type": "open-url",
16
"url": "https://www.bing.com/"
17
}
18
}
19
]
20
}
21
}
Copied!
1
{
2
"action": {
3
"type": "open-url",
4
"url": "file:///Users/Johny/Downloads",
5
}
6
}
Copied!
1
{
2
"action": {
3
"type": "open-url",
4
"url": "slack://channel?team=TA4PV0NH4&id=CR7EDED9Q"
5
}
6
}
Copied!
ActionPaste
Pastes some text to the active app.
- type:
"paste" - value: The string that will be pasted to the active app.
Paste text to the active app
List View: paste an email address to the active app
1
{
2
"action": {
3
"type": "paste",
4
"value": "Hello, world!"
5
}
6
}
Copied!
1
{
2
"view": {
3
"type": "list",
4
"options": [
5
{
6
"title": "Paste My Email",
7
"action": {
8
"type": "paste",
9
"value": "[email protected]"
10
}
11
}
12
]
13
}
14
}
Copied!
ActionCopy
Copies some text to the clipboard.
- type:
"copy" - value: The string that will be copied to the clipboard.
Copy text to clipboard
List View: option to copy a URL to clipboard
1
{
2
"action": {
3
"type": "copy",
4
"value": "Hello, world!"
5
}
6
}
Copied!
1
{
2
"view": {
3
"type": "list",
4
"options": [
5
{
6
"title": "Copy Google URL",
7
"action": {
8
"type": "copy",
9
"value": "https://www.google.com/"
10
}
11
}
12
]
13
}
14
}
Copied!
ActionShowToast
Shows a message in a toast (an ephemeral message displayed on the screen).
- type:
"show-toast" - message: The message that will be displayed in a toast.
Show a confirmation message in a toast
1
{
2
"view": {
3
"type": "list",
4
"options": [
5
{
6
"title": "Show a Message",
7
"action": {
8
"type": "show-toast",
9
"message": "The task has been successfully completed!"
10
}
11
}
12
]
13
}
14
}
Copied!
ActionMoveAddParam
Allows to change the location of the Command Bar. Currently, there is only one Move Action supported – add a param. Location parameters are then passed to the Command when it's run.
Typically, the "add-param" Action is used in the
moveAction property of some Option that can be triggered by pressing Tab.- type:
"add-param" - name: The name of the parameter.
- value: The value of the parameter.
Masonry View: option with Main and Move Actions
1
{
2
"view": {
3
"type": "masonry",
4
"options": [
5
{
6
"imageURL": "https://images.unsplash.com/photo-1481819613568-3701cbc70156",
7
"action": {
8
"type": "open-url",
9
"url": "https://images.unsplash.com/photo-1481819613568-3701cbc70156"
10
},
11
"moveAction": {
12
"type": "add-param",
13
"name": "image",
14
"value": "moon"
15
}
16
}
17
]
18
}
19
}
Copied!
Last modified 1mo ago
Copy link