@raycast/api 1.33.1 → 1.34.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/types/index.d.ts CHANGED
@@ -1,9 +1,9 @@
1
1
  /// <reference types="node" />
2
+ /// <reference types="react" />
2
3
 
3
4
  import { ForwardRefExoticComponent } from 'react';
4
5
  import { FunctionComponent } from 'react';
5
6
  import { PathLike } from 'fs';
6
- import PropTypes from 'prop-types';
7
7
  import { ReactElement } from 'react';
8
8
  import { ReactNode } from 'react';
9
9
  import { RefAttributes } from 'react';
@@ -37,354 +37,15 @@ import { RefAttributes } from 'react';
37
37
  * }
38
38
  * ```
39
39
  */
40
- export declare function Action(props: Action.Props): ReactElement<Action.Props>;
40
+ export declare const Action: FunctionComponent<ActionProps> & ConvenienceActions;
41
41
 
42
42
  export declare namespace Action {
43
- var propTypes: {
44
- id: PropTypes.Requireable<string>;
45
- title: PropTypes.Validator<string>;
46
- icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
47
- fileIcon: PropTypes.Validator<string>;
48
- }>> | Required<PropTypes.InferProps<{
49
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
50
- light: PropTypes.Validator<string>;
51
- dark: PropTypes.Validator<string>;
52
- }>>>;
53
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
54
- light: PropTypes.Validator<string>;
55
- dark: PropTypes.Validator<string>;
56
- }>>>;
57
- mask: PropTypes.Requireable<Image.Mask>;
58
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
59
- light: PropTypes.Validator<string>;
60
- dark: PropTypes.Validator<string>;
61
- adjustContrast: PropTypes.Requireable<boolean>;
62
- }>>>;
63
- }>>>;
64
- shortcut: PropTypes.Requireable<Required<PropTypes.InferProps<{
65
- modifiers: PropTypes.Validator<string[]>;
66
- key: PropTypes.Validator<string>;
67
- }>>>;
68
- onAction: PropTypes.Requireable<(...args: any[]) => any>;
69
- };
70
- var displayName: string;
71
- }
72
-
73
- export declare namespace Action {
74
- /**
75
- * Action that copies the content to the clipboard.
76
- *
77
- * @remarks
78
- * The main window is closed, and a HUD is shown after the content was copied to the clipboard.
79
- *
80
- * @example
81
- * ```typescript
82
- * import { ActionPanel, Action, Detail } from "@raycast/api";
83
- *
84
- * export default function Command() {
85
- * return (
86
- * <Detail
87
- * markdown="Press `⌘ + .` and share some love."
88
- * actions={
89
- * <ActionPanel>
90
- * <Action.CopyToClipboard content="I ❤️ Raycast" shortcut={{ modifiers: ["cmd"], key: "." }} />
91
- * </ActionPanel>
92
- * }
93
- * />
94
- * );
95
- * }
96
- * ```
97
- */
98
- const CopyToClipboard: typeof CopyToClipboardAction_2;
99
- /**
100
- * An action to open a file or folder with a specific application, just as if you had double-clicked the
101
- * file's icon.
102
- *
103
- * @remarks
104
- * The main window is closed after the file is opened.
105
- *
106
- * @example
107
- * ```typescript
108
- * import { ActionPanel, Detail, Action } from "@raycast/api";
109
- *
110
- * export default function Command() {
111
- * return (
112
- * <Detail
113
- * markdown="Check out your extension code."
114
- * actions={
115
- * <ActionPanel>
116
- * <Action.Open title="Open Folder" target={__dirname} />
117
- * </ActionPanel>
118
- * }
119
- * />
120
- * );
121
- * }
122
- * ```
123
- */
124
- const Open: typeof OpenAction_2;
125
- /**
126
- * Action that opens a URL in the default browser.
127
- *
128
- * @remarks
129
- * The main window is closed after the URL is opened in the browser.
130
- *
131
- * @example
132
- * ```typescript
133
- * import { ActionPanel, Detail, Action } from "@raycast/api";
134
- *
135
- * export default function Command() {
136
- * return (
137
- * <Detail
138
- * markdown="Join the gang!"
139
- * actions={
140
- * <ActionPanel>
141
- * <Action.OpenInBrowser url="https://raycast.com/jobs" />
142
- * </ActionPanel>
143
- * }
144
- * />
145
- * );
146
- * }
147
- * ```
148
- */
149
- const OpenInBrowser: typeof OpenInBrowserAction_2;
150
- /**
151
- * Action that opens a file or folder with a specific application.
152
- *
153
- * @remarks
154
- * The action opens a sub-menu with all applications that can open the file or folder.
155
- * The main window is closed after the file is opened in the specified application.
156
- *
157
- * @example
158
- * ```typescript
159
- * import { ActionPanel, Detail, Action } from "@raycast/api";
160
- * import { homedir } from "os";
161
- *
162
- * const DESKTOP_DIR = `${homedir()}/Desktop`;
163
- *
164
- * export default function Command() {
165
- * return (
166
- * <Detail
167
- * markdown="What do you want to use to open your desktop with?"
168
- * actions={
169
- * <ActionPanel>
170
- * <Action.OpenWith path={DESKTOP_DIR} />
171
- * </ActionPanel>
172
- * }
173
- * />
174
- * );
175
- * }
176
- * ```
177
- */
178
- const OpenWith: typeof OpenWithAction_2;
179
- /**
180
- * Action that pastes the content to the front-most applications.
181
- *
182
- * @remarks
183
- * The main window is closed after the content is pasted to the front-most application.
184
- *
185
- * @example
186
- * ```typescript
187
- * import { ActionPanel, Detail, Action } from "@raycast/api";
188
- *
189
- * export default function Command() {
190
- * return (
191
- * <Detail
192
- * markdown="Let us know what you think about the Raycast API?"
193
- * actions={
194
- * <ActionPanel>
195
- * <Action.Paste content="api@raycast.com" />
196
- * </ActionPanel>
197
- * }
198
- * />
199
- * );
200
- * }
201
- * ```
202
- */
203
- const Paste: typeof PasteAction_2;
204
- /**
205
- * Action that pushes a new view to the navigation stack.
206
- *
207
- * @example
208
- * ```typescript
209
- * import { ActionPanel, Detail, Action } from "@raycast/api";
210
- *
211
- * function Ping() {
212
- * return (
213
- * <Detail
214
- * markdown="Ping"
215
- * actions={
216
- * <ActionPanel>
217
- * <Action.Push title="Push Pong" target={<Pong />} />
218
- * </ActionPanel>
219
- * }
220
- * />
221
- * );
222
- * }
223
- *
224
- * function Pong() {
225
- * return <Detail markdown="Pong" />;
226
- * }
227
- *
228
- * export default function Command() {
229
- * return <Ping />;
230
- * }
231
- * ```
232
- */
233
- const Push: typeof PushAction_2;
234
- /**
235
- * Action that shows a file or folder in the Finder.
236
- *
237
- * @remarks
238
- * The main window is closed after the file or folder is revealed in the Finder.
239
- *
240
- * @example
241
- * ```typescript
242
- * import { ActionPanel, Detail, Action } from "@raycast/api";
243
- * import { homedir } from "os";
244
- *
245
- * const DOWNLOADS_DIR = `${homedir()}/Downloads`;
246
- *
247
- * export default function Command() {
248
- * return (
249
- * <Detail
250
- * markdown="Are your downloads pilling up again?"
251
- * actions={
252
- * <ActionPanel>
253
- * <Action.ShowInFinder path={DOWNLOADS_DIR} />
254
- * </ActionPanel>
255
- * }
256
- * />
257
- * );
258
- * }
259
- * ```
260
- */
261
- const ShowInFinder: typeof ShowInFinderAction_2;
262
- /**
263
- * Action that adds a submit handler for capturing form values.
264
- *
265
- * @example
266
- * ```typescript
267
- * import { ActionPanel, Form, Action } from "@raycast/api";
268
- * import { useState } from "react";
269
- *
270
- * export default function Command() {
271
- * const [name, setName] = useState<string>();
272
- *
273
- * return (
274
- * <Form
275
- * actions={
276
- * <ActionPanel>
277
- * <Action.SubmitForm title="Submit Name" onSubmit={(values) => console.log(values)} />
278
- * </ActionPanel>
279
- * }
280
- * >
281
- * <Form.TextField id="name" value={name} onChange={setName} />
282
- * </Form>
283
- * );
284
- * }
285
- * ```
286
- */
287
- const SubmitForm: typeof SubmitFormAction_2;
288
- /**
289
- * Action that moves a file or folder to the Trash.
290
- *
291
- * @example
292
- * ```typescript
293
- * import { ActionPanel, Detail, Action } from "@raycast/api";
294
- * import { homedir } from "os";
295
- *
296
- * const FILE = `${homedir()}/Downloads/get-rid-of-me.txt`;
297
- *
298
- * export default function Command() {
299
- * return (
300
- * <Detail
301
- * markdown="Some spring cleaning?"
302
- * actions={
303
- * <ActionPanel>
304
- * <Action.Trash paths={FILE} />
305
- * </ActionPanel>
306
- * }
307
- * />
308
- * );
309
- * }
310
- * ```
311
- */
312
- const Trash: typeof TrashAction_2;
313
- /**
314
- * Action that navigates to the the Create Snippet command with some or all of the fields prefilled.
315
- *
316
- * @example
317
- * ```typescript
318
- * import { ActionPanel, Detail, Action } from "@raycast/api";
319
- *
320
- * export default function Command() {
321
- * return (
322
- * <Detail
323
- * markdown="Test out snippet creation"
324
- * actions={
325
- * <ActionPanel>
326
- * <Action.CreateSnippet snippet={{ text: "DE75512108001245126199" }} />
327
- * </ActionPanel>
328
- * }
329
- * />
330
- * );
331
- * }
332
- * ```
333
- */
334
- const CreateSnippet: typeof CreateSnippetAction;
335
- /**
336
- * Action that navigates to the the Create Quicklink command with some or all of the fields prefilled.
337
- *
338
- * @example
339
- * ```typescript
340
- * import { ActionPanel, Detail, Action } from "@raycast/api";
341
- *
342
- * export default function Command() {
343
- * return (
344
- * <Detail
345
- * markdown="Test out quicklink creation"
346
- * actions={
347
- * <ActionPanel>
348
- * <Action.CreateQuicklink quicklink={{ link: "https://duckduckgo.com/?q={Query}" }} />
349
- * </ActionPanel>
350
- * }
351
- * />
352
- * );
353
- * }
354
- * ```
355
- */
356
- const CreateQuicklink: typeof CreateQuicklinkAction;
357
- /**
358
- * Props of the {@link Action} React component.
359
- */
360
- export interface Props {
361
- /**
362
- * ID of the item.
363
- *
364
- * @remarks
365
- * Make sure to assign each section or item a unique ID. If no ID is specified, a memoized auto-generated is used.
366
- */
367
- id?: string;
368
- /**
369
- * The title displayed for the item.
370
- */
371
- title: string;
372
- /**
373
- * The icon displayed for the action.
374
- */
375
- icon?: Image.ImageLike;
376
- /**
377
- * The keyboard shortcut for the item.
378
- *
379
- * @remarks
380
- * The first and second action in an {@link ActionPanel} become the primary and secondary action. They automatically get the default keyboard shortcuts assigned.
381
- * In {@link List} and {@link Detail}, this is `↵` for the primary and `⌘` `↵` for the secondary action. In {@link Form} it's `⌘` `↵` for the primary and `⌘` `⇧` `↵` for the secondary.
382
- */
383
- shortcut?: Keyboard.Shortcut;
43
+ export type Props = ActionProps;
44
+ export namespace CopyToClipboard {
384
45
  /**
385
- * Callback that is triggered when the item is selected.
46
+ * Props of the {@link Action.CopyToClipboard} React component.
386
47
  */
387
- onAction?: () => void;
48
+ export type Props = CopyToClipboardProps;
388
49
  }
389
50
  export namespace CreateQuicklink {
390
51
  /**
@@ -398,59 +59,53 @@ export declare namespace Action {
398
59
  */
399
60
  export type Props = CreateSnippetProps;
400
61
  }
401
- export namespace CopyToClipboard {
402
- /**
403
- * Props of the {@link Action.CopyToClipboard} React component.
404
- */
405
- export type Props = CopyToClipboardActionProps_2;
406
- }
407
62
  export namespace Open {
408
63
  /**
409
64
  * Props of the {@link Action.Open} React component.
410
65
  */
411
- export type Props = OpenActionProps_2;
66
+ export type Props = OpenProps;
412
67
  }
413
68
  export namespace OpenInBrowser {
414
69
  /**
415
70
  * Props of the {@link Action.OpenInBrowser} React component.
416
71
  */
417
- export type Props = OpenInBrowserActionProps_2;
72
+ export type Props = OpenInBrowserProps;
418
73
  }
419
74
  export namespace OpenWith {
420
75
  /**
421
76
  * Props of the {@link Action.OpenWith} React component.
422
77
  */
423
- export type Props = OpenWithActionProps_2;
78
+ export type Props = OpenWithProps;
424
79
  }
425
80
  export namespace Paste {
426
81
  /**
427
82
  * Props of the {@link Action.Paste} React component.
428
83
  */
429
- export type Props = PasteActionProps_2;
84
+ export type Props = PasteProps;
430
85
  }
431
86
  export namespace Push {
432
87
  /**
433
88
  * Props of the {@link Action.Push} React component.
434
89
  */
435
- export type Props = PushActionProps_2;
90
+ export type Props = PushProps;
436
91
  }
437
92
  export namespace ShowInFinder {
438
93
  /**
439
94
  * Props of the {@link Action.ShowInFinder} React component.
440
95
  */
441
- export type Props = ShowInFinderActionProps_2;
96
+ export type Props = ShowInFinderProps;
442
97
  }
443
98
  export namespace SubmitForm {
444
99
  /**
445
100
  * Props of the {@link Action.SubmitForm} React component.
446
101
  */
447
- export type Props<T> = SubmitFormActionProps_2<T>;
102
+ export type Props<T> = SubmitFormProps<T>;
448
103
  }
449
104
  export namespace Trash {
450
105
  /**
451
106
  * Props of the {@link Action.Trash} React component.
452
107
  */
453
- export type Props = TrashActionProps_2;
108
+ export type Props = TrashProps;
454
109
  }
455
110
  }
456
111
 
@@ -490,20 +145,58 @@ export declare namespace Action {
490
145
  * }
491
146
  * ```
492
147
  */
493
- export declare function ActionPanel(props: ActionPanel.Props): ReactElement<ActionPanel.Props>;
494
-
495
- export declare namespace ActionPanel {
496
- var propTypes: {
497
- title: PropTypes.Requireable<string>;
498
- };
499
- var displayName: string;
500
- }
148
+ export declare const ActionPanel: FunctionComponent<ActionPanelProps_2> & DeprecatedActionPanelMembers & ActionPanelMembers;
501
149
 
502
150
  export declare namespace ActionPanel {
503
151
  /**
504
- * @deprecated Use `Action` instead.
152
+ * Props of the {@link ActionPanel} React component.
505
153
  */
506
- const Item: typeof Action;
154
+ export type Props = ActionPanelProps_2;
155
+ /**
156
+ * Supported children for the {@link ActionPanel} components.
157
+ */
158
+ export type Children = ActionPanelChildren_2;
159
+ export namespace Section {
160
+ /**
161
+ * Props of the {@link ActionPanel.Section} React component.
162
+ */
163
+ export type Props = SectionProps;
164
+ /**
165
+ * Supported children for the {@link ActionPanel.Section} component.
166
+ */
167
+ export type Children = SectionChildren;
168
+ }
169
+ export namespace Submenu {
170
+ /**
171
+ * Props of the {@link ActionPanel.Submenu} React component.
172
+ */
173
+ export type Props = SubmenuProps;
174
+ /**
175
+ * Supported children for the {@link ActionPanel.Submenu} components.
176
+ */
177
+ export type Children = SubmenuChildren;
178
+ }
179
+ }
180
+
181
+ /**
182
+ * @deprecated Use {@link ActionPanel.Children} instead.
183
+ */
184
+ export declare type ActionPanelChildren = ActionPanel.Children;
185
+
186
+ declare type ActionPanelChildren_2 = ReactElement<ActionPanel.Section.Props> | ReactElement<ActionPanel.Section.Props>[] | ActionPanel.Section.Children | null;
187
+
188
+ /**
189
+ * @deprecated Use {@link Action} instead.
190
+ */
191
+ export declare const ActionPanelItem: FunctionComponent<ActionProps> & ConvenienceActions;
192
+
193
+ /**
194
+ * @deprecated Use {@link Action.Props} instead.
195
+ */
196
+ export declare interface ActionPanelItemProps extends Action.Props {
197
+ }
198
+
199
+ declare interface ActionPanelMembers {
507
200
  /**
508
201
  * A group of visually separated items.
509
202
  *
@@ -542,7 +235,7 @@ export declare namespace ActionPanel {
542
235
  * }
543
236
  * ```
544
237
  */
545
- const Section: typeof ActionPanelSection_2;
238
+ Section: typeof Section;
546
239
  /**
547
240
  * An action that replaces the current ActionPanel with its children when selected.
548
241
  *
@@ -587,102 +280,7 @@ export declare namespace ActionPanel {
587
280
  * }
588
281
  * ```
589
282
  */
590
- const Submenu: typeof ActionPanelSubmenu_2;
591
- /**
592
- * Props of the {@link ActionPanel} React component.
593
- */
594
- export interface Props {
595
- /**
596
- * Sections or Actions. If {@link Action} elements are specified, a default section is automatically created.
597
- */
598
- children?: ReactNode;
599
- /**
600
- * The title displayed at the top of the panel
601
- */
602
- title?: string;
603
- }
604
- /**
605
- * Supported children for the {@link ActionPanel} components.
606
- */
607
- export type Children = ReactElement<ActionPanel.Section.Props> | ReactElement<ActionPanel.Section.Props>[] | ActionPanel.Section.Children | null;
608
- export namespace Section {
609
- /**
610
- * Props of the {@link ActionPanel.Section} React component.
611
- */
612
- export interface Props {
613
- /**
614
- * The item elements of the section.
615
- */
616
- children?: ReactNode;
617
- /**
618
- * Title displayed above the section
619
- */
620
- title?: string;
621
- }
622
- /**
623
- * Supported children for the {@link ActionPanel.Section} component.
624
- */
625
- export type Children = ReactElement<Action.Props> | ReactElement<Action.Props>[] | ReactElement<ActionPanel.Submenu.Props> | Array<ReactElement<ActionPanel.Submenu.Props>> | Array<ReactElement<ActionPanel.Submenu.Props> | ReactElement<Action.Props>> | null;
626
- }
627
- export namespace Submenu {
628
- /**
629
- * Props of the {@link ActionPanel.Submenu} React component.
630
- */
631
- export interface Props {
632
- /**
633
- * ID of the submenu.
634
- * Make sure to assign each submenu a unique ID or a UUID will be auto-generated.
635
- */
636
- id?: string;
637
- /**
638
- * The title displayed for submenu.
639
- */
640
- title: string;
641
- /**
642
- * The icon displayed for the submenu.
643
- */
644
- icon?: Image.ImageLike;
645
- /**
646
- * The keyboard shortcut for the submenu.
647
- */
648
- shortcut?: Keyboard.Shortcut;
649
- /**
650
- * Items of the submenu.
651
- *
652
- * @example
653
- * ```typescript
654
- * <ActionPanel.Submenu title="Submenu">
655
- * <Action title="Just an action" />
656
- * </ActionPanel.Submenu>
657
- * ```
658
- *
659
- * @remarks
660
- * If {@link Action} elements are specified, a default section is automatically created.
661
- * Use {@link ActionPanel.Submenu} as parent when specifying sub-menu's children to make code is more readable.
662
- */
663
- children?: ReactNode;
664
- }
665
- /**
666
- * Supported children for the {@link ActionPanel.Submenu} components.
667
- */
668
- export type Children = ActionPanel.Children;
669
- }
670
- }
671
-
672
- /**
673
- * @deprecated Use {@link ActionPanel.Children} instead.
674
- */
675
- export declare type ActionPanelChildren = ActionPanel.Children;
676
-
677
- /**
678
- * @deprecated Use {@link Action} instead.
679
- */
680
- export declare const ActionPanelItem: typeof Action;
681
-
682
- /**
683
- * @deprecated Use {@link Action.Props} instead.
684
- */
685
- export declare interface ActionPanelItemProps extends Action.Props {
283
+ Submenu: typeof Submenu;
686
284
  }
687
285
 
688
286
  /**
@@ -691,23 +289,22 @@ export declare interface ActionPanelItemProps extends Action.Props {
691
289
  export declare interface ActionPanelProps extends ActionPanel.Props {
692
290
  }
693
291
 
292
+ declare interface ActionPanelProps_2 {
293
+ /**
294
+ * Sections or Actions. If {@link Action} elements are specified, a default section is automatically created.
295
+ */
296
+ children?: ReactNode;
297
+ /**
298
+ * The title displayed at the top of the panel
299
+ */
300
+ title?: string;
301
+ }
302
+
694
303
  /**
695
304
  * @deprecated Use {@link ActionPanel.Section} instead.
696
305
  */
697
306
  export declare const ActionPanelSection: typeof ActionPanel.Section;
698
307
 
699
- /**
700
- * See {@link ActionPanel.Section}
701
- */
702
- declare function ActionPanelSection_2(props: ActionPanel.Section.Props): ReactElement<ActionPanel.Section.Props>;
703
-
704
- declare namespace ActionPanelSection_2 {
705
- var propTypes: {
706
- title: PropTypes.Requireable<string>;
707
- };
708
- var displayName: string;
709
- }
710
-
711
308
  /**
712
309
  * @deprecated Use {@link ActionPanel.Section.Children} instead.
713
310
  */
@@ -735,44 +332,40 @@ export declare interface ActionPanelState {
735
332
  export declare const ActionPanelSubmenu: typeof ActionPanel.Submenu;
736
333
 
737
334
  /**
738
- * See {@link ActionPanel.Submenu}
335
+ * @deprecated Use {@link ActionPanel.Submenu.Props} instead.
739
336
  */
740
- declare function ActionPanelSubmenu_2(props: ActionPanel.Submenu.Props): ReactElement<Action.Props>;
741
-
742
- declare namespace ActionPanelSubmenu_2 {
743
- var propTypes: {
744
- id: PropTypes.Requireable<string>;
745
- title: PropTypes.Validator<string>;
746
- icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
747
- fileIcon: PropTypes.Validator<string>;
748
- }>> | Required<PropTypes.InferProps<{
749
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
750
- light: PropTypes.Validator<string>;
751
- dark: PropTypes.Validator<string>;
752
- }>>>;
753
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
754
- light: PropTypes.Validator<string>;
755
- dark: PropTypes.Validator<string>;
756
- }>>>;
757
- mask: PropTypes.Requireable<Image.Mask>;
758
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
759
- light: PropTypes.Validator<string>;
760
- dark: PropTypes.Validator<string>;
761
- adjustContrast: PropTypes.Requireable<boolean>;
762
- }>>>;
763
- }>>>;
764
- shortcut: PropTypes.Requireable<Required<PropTypes.InferProps<{
765
- modifiers: PropTypes.Validator<string[]>;
766
- key: PropTypes.Validator<string>;
767
- }>>>;
768
- };
769
- var displayName: string;
337
+ export declare interface ActionPanelSubmenuProps extends ActionPanel.Submenu.Props {
770
338
  }
771
339
 
772
340
  /**
773
- * @deprecated Use {@link ActionPanel.Submenu.Props} instead.
341
+ * Props of the {@link Action} React component.
774
342
  */
775
- export declare interface ActionPanelSubmenuProps extends ActionPanel.Submenu.Props {
343
+ declare interface ActionProps {
344
+ /**
345
+ * ID of the item.
346
+ * @deprecated - This is an internal prop which not not have been exposed. You can safely remove it.
347
+ */
348
+ id?: string;
349
+ /**
350
+ * The title displayed for the item.
351
+ */
352
+ title: string;
353
+ /**
354
+ * The icon displayed for the action.
355
+ */
356
+ icon?: Image.ImageLike | undefined | null;
357
+ /**
358
+ * The keyboard shortcut for the item.
359
+ *
360
+ * @remarks
361
+ * The first and second action in an {@link ActionPanel} become the primary and secondary action. They automatically get the default keyboard shortcuts assigned.
362
+ * In {@link List} and {@link Detail}, this is `↵` for the primary and `⌘` `↵` for the secondary action. In {@link Form} it's `⌘` `↵` for the primary and `⌘` `⇧` `↵` for the secondary.
363
+ */
364
+ shortcut?: Keyboard.Shortcut | undefined | null;
365
+ /**
366
+ * Callback that is triggered when the item is selected.
367
+ */
368
+ onAction?: () => void;
776
369
  }
777
370
 
778
371
  /**
@@ -917,285 +510,567 @@ declare const Checkbox: ForwardRefExoticComponent<CheckboxProps & RefAttributes<
917
510
  */
918
511
  declare interface CheckboxProps extends FormItemProps_2<boolean> {
919
512
  /**
920
- * The label displayed on the right side of the checkbox.
513
+ * The label displayed on the right side of the checkbox.
514
+ */
515
+ label: string;
516
+ }
517
+
518
+ /**
519
+ * Form.Checkbox Ref type.
520
+ */
521
+ declare type CheckboxRef = FormItemRef;
522
+
523
+ /**
524
+ * @deprecated Use {@link Clipboard.clear} instead
525
+ */
526
+ export declare const clearClipboard: typeof Clipboard.clear;
527
+
528
+ /**
529
+ * @deprecated Use {@link LocalStorage.clear} instead
530
+ */
531
+ export declare const clearLocalStorage: typeof LocalStorage.clear;
532
+
533
+ /**
534
+ * Clear the text in the search bar.
535
+ *
536
+ * @param options - Can be used to force scrolling to the top. Defaults to scrolling to the top after the
537
+ * the search bar was cleared.
538
+ * @returns A Promise that resolves when the search bar is cleared.
539
+ */
540
+ export declare function clearSearchBar(options?: {
541
+ forceScrollToTop?: boolean;
542
+ }): Promise<void>;
543
+
544
+ export declare namespace Clipboard {
545
+ /**
546
+ * Copies text to the clipboard.
547
+ *
548
+ * @param text - The text to copy to the clipboard.
549
+ * @returns A Promise that resolves when the text is copied to the clipboard.
550
+ *
551
+ * @example
552
+ * ```typescript
553
+ * import { Clipboard } from "@raycast/api";
554
+ *
555
+ * export default async () => {
556
+ * await Clipboard.copy("https://raycast.com");
557
+ * };
558
+ * ```
559
+ */
560
+ export function copy(text: string): Promise<void>;
561
+ /**
562
+ * Clears the current clipboard contents.
563
+ *
564
+ * @returns A Promise that resolves when the clipboard is cleared.
565
+ *
566
+ * @example
567
+ * ```typescript
568
+ * import { Clipboard } from "@raycast/api";
569
+ *
570
+ * export default async () => {
571
+ * await Clipboard.clear();
572
+ * };
573
+ * ```
574
+ */
575
+ export function clear(): Promise<void>;
576
+ /**
577
+ * Pastes text to the current selection of the frontmost application.
578
+ *
579
+ * @param text - The text to insert at the cursor.
580
+ * @returns A Promise that resolves when the text is pasted.
581
+ *
582
+ * @example
583
+ * ```typescript
584
+ * import { Clipboard } from "@raycast/api";
585
+ *
586
+ * export default async () => {
587
+ * await Clipboard.paste("I really like Raycast's API");
588
+ * };
589
+ * ```
590
+ */
591
+ export function paste(text: string): Promise<void>;
592
+ /**
593
+ * Reads the clipboard as plain text.
594
+ *
595
+ * @returns A promise that resolves when the clipboard content was read as plain text.
596
+ *
597
+ * @example
598
+ * ```typescript
599
+ * import { Clipboard } from "@raycast/api";
600
+ *
601
+ * export default async () => {
602
+ * const text = await Clipboard.readText();
603
+ * console.log(text);
604
+ * };
605
+ * ```
606
+ */
607
+ export function readText(): Promise<string | undefined>;
608
+ }
609
+
610
+ /**
611
+ * Closes the main Raycast window.
612
+ *
613
+ * @param options - Can be used to clear the root search. Defaults to not clearing the root search after
614
+ * the window was closed.
615
+ * @returns A Promise that resolves when the main window is closed.
616
+ *
617
+ * @example
618
+ * ```typescript
619
+ * import { closeMainWindow } from "@raycast/api";
620
+ * import { setTimeout } from "timers/promises";
621
+ *
622
+ * export default async () => {
623
+ * await setTimeout(1000);
624
+ * await closeMainWindow({ clearRootSearch: true });
625
+ * };
626
+ * ```
627
+ */
628
+ export declare function closeMainWindow(options?: {
629
+ clearRootSearch?: boolean;
630
+ }): Promise<void>;
631
+
632
+ /**
633
+ * The standard colors. Use those colors for consistency.
634
+ *
635
+ * @remarks
636
+ * The colors automatically adapt to the Raycast theme (light or dark).
637
+ *
638
+ * @example
639
+ * ```typescript
640
+ * import { Color, Icon, List } from "@raycast/api";
641
+ *
642
+ * export default function Command() {
643
+ * return (
644
+ * <List>
645
+ * <List.Item title="Blue" icon={{ source: Icon.Circle, tintColor: Color.Blue }} />
646
+ * <List.Item title="Green" icon={{ source: Icon.Circle, tintColor: Color.Green }} />
647
+ * <List.Item title="Brown" icon={{ source: Icon.Circle, tintColor: Color.Brown }} />
648
+ * <List.Item title="Magenta" icon={{ source: Icon.Circle, tintColor: Color.Magenta }} />
649
+ * <List.Item title="Orange" icon={{ source: Icon.Circle, tintColor: Color.Orange }} />
650
+ * <List.Item title="Purple" icon={{ source: Icon.Circle, tintColor: Color.Purple }} />
651
+ * <List.Item title="Red" icon={{ source: Icon.Circle, tintColor: Color.Red }} />
652
+ * <List.Item title="Yellow" icon={{ source: Icon.Circle, tintColor: Color.Yellow }} />
653
+ * <List.Item title="PrimaryText" icon={{ source: Icon.Circle, tintColor: Color.PrimaryText }} />
654
+ * <List.Item title="SecondaryText" icon={{ source: Icon.Circle, tintColor: Color.SecondaryText }} />
655
+ * </List>
656
+ * );
657
+ * };
658
+ * ```
659
+ */
660
+ export declare enum Color {
661
+ Blue = "raycast-blue",
662
+ Brown = "raycast-brown",
663
+ Green = "raycast-green",
664
+ Magenta = "raycast-magenta",
665
+ Orange = "raycast-orange",
666
+ Purple = "raycast-purple",
667
+ Red = "raycast-red",
668
+ Yellow = "raycast-yellow",
669
+ PrimaryText = "raycast-primary-text",
670
+ SecondaryText = "raycast-secondary-text"
671
+ }
672
+
673
+ export declare namespace Color {
674
+ /**
675
+ * Union type for the supported color types.
676
+ *
677
+ * {@link Color.Raw} will be dynamically adjusted to achieve high contrast with the Raycast user interface.
678
+ *
679
+ * @example
680
+ * ```typescript
681
+ * import { Color, Icon, List } from "@raycast/api";
682
+ *
683
+ * export default function Command() {
684
+ * return (
685
+ * <List>
686
+ * <List.Item title="Built-in color" icon={{ source: Icon.Circle, tintColor: Color.Red }} />
687
+ * <List.Item title="HEX" icon={{ source: Icon.Circle, tintColor: "#FF0000" }} />
688
+ * <List.Item title="Short HEX" icon={{ source: Icon.Circle, tintColor: "#F00" }} />
689
+ * <List.Item title="RGBA" icon={{ source: Icon.Circle, tintColor: "rgb(255, 0, 0)" }} />
690
+ * <List.Item title="RGBA Percentage" icon={{ source: Icon.Circle, tintColor: "rgb(255, 0, 0, 1.0)" }} />
691
+ * <List.Item title="HSL" icon={{ source: Icon.Circle, tintColor: "hsla(200, 20%, 33%, 0.2)" }} />
692
+ * <List.Item title="Keywords" icon={{ source: Icon.Circle, tintColor: "red" }} />
693
+ * </List>
694
+ * );
695
+ * };
696
+ * ```
697
+ */
698
+ export type ColorLike = Color | Color.Dynamic | Color.Raw;
699
+ /**
700
+ * A dynamic color applies different colors depending on the active Raycast theme.
701
+ *
702
+ * @example
703
+ * ```typescript
704
+ * import { Color, Icon, List } from "@raycast/api";
705
+ *
706
+ * export default function Command() {
707
+ * return (
708
+ * <List>
709
+ * <List.Item title="Dynamic Tint Color" icon={{ source: Icon.Circle, tintColor: { light: "#FF01FF", dark: "#FFFF50", adjustContrast: true } }} />
710
+ * <List.Item title="Dynamic Tint Color" icon={{ source: Icon.Circle, tintColor: { light: "#FF01FF", dark: "#FFFF50" } }} />
711
+ * </List>
712
+ * );
713
+ * };
714
+ * ```
715
+ */
716
+ export interface Dynamic {
717
+ /**
718
+ * The color which is used in light theme.
719
+ */
720
+ light: Color.Raw;
721
+ /**
722
+ * The color which is used in dark theme.
723
+ */
724
+ dark: Color.Raw;
725
+ /**
726
+ * Enables dynamic contrast adjustment for light and dark theme color.
727
+ *
728
+ * @remarks
729
+ * Colors different to the built-in {@link Color} can be dynamically adjusted to achieve high contrast with the
730
+ * Raycast user interface. This makes it easy to guarantee a good look and feel when you aren't in control of the
731
+ * color, e.g. get it via a network request.
732
+ *
733
+ * @defaultValue false
734
+ */
735
+ adjustContrast?: boolean | undefined | null;
736
+ }
737
+ /**
738
+ * You can use any of the following color formats:
739
+ * - HEX, e.g `#FF0000`
740
+ * - Short HEX, e.g. `#F00`
741
+ * - RGBA, e.g. `rgb(255, 0, 0)`
742
+ * - RGBA Percentage, e.g. `rgb(255, 0, 0, 1.0)`
743
+ * - HSL, e.g. `hsla(200, 20%, 33%, 0.2)`
744
+ * - Keywords, e.g. `red`
921
745
  */
922
- label: string;
746
+ export type Raw = string;
923
747
  }
924
748
 
925
749
  /**
926
- * Form.Checkbox Ref type.
927
- */
928
- declare type CheckboxRef = FormItemRef;
929
-
930
- /**
931
- * @deprecated Use {@link Clipboard.clear} instead
932
- */
933
- export declare const clearClipboard: typeof Clipboard.clear;
934
-
935
- /**
936
- * @deprecated Use {@link LocalStorage.clear} instead
750
+ * @deprecated Use {@link Color.ColorLike} instead
937
751
  */
938
- export declare const clearLocalStorage: typeof LocalStorage.clear;
752
+ export declare type ColorLike = Color.ColorLike;
939
753
 
940
754
  /**
941
- * Clear the text in the search bar.
755
+ * Creates and shows a confirmation Alert with the given options.
942
756
  *
943
- * @param options - Can be used to force scrolling to the top. Defaults to scrolling to the top after the
944
- * the search bar was cleared.
945
- * @returns A Promise that resolves when the search bar is cleared.
757
+ * @param options - The options used to create the Alert.
758
+ * @returns A Promise that resolves to a boolean when the user triggers one of the actions.
759
+ * It will be `true` for the primary Action, `false` for the dismiss Action.
760
+ *
761
+ * @example
762
+ * ```typescript
763
+ * import { confirmAlert } from "@raycast/api";
764
+ *
765
+ * export default async () => {
766
+ * if (await confirmAlert({ title: "Are you sure?" })) {
767
+ * // do something
768
+ * }
769
+ * };
770
+ * ```
946
771
  */
947
- export declare function clearSearchBar(options?: {
948
- forceScrollToTop?: boolean;
949
- }): Promise<void>;
772
+ export declare function confirmAlert(options: Alert.Options): Promise<boolean>;
950
773
 
951
- export declare namespace Clipboard {
774
+ declare interface ConvenienceActions {
952
775
  /**
953
- * Copies text to the clipboard.
776
+ * Action that copies the content to the clipboard.
954
777
  *
955
- * @param text - The text to copy to the clipboard.
956
- * @returns A Promise that resolves when the text is copied to the clipboard.
778
+ * @remarks
779
+ * The main window is closed, and a HUD is shown after the content was copied to the clipboard.
957
780
  *
958
781
  * @example
959
782
  * ```typescript
960
- * import { Clipboard } from "@raycast/api";
783
+ * import { ActionPanel, Action, Detail } from "@raycast/api";
961
784
  *
962
- * export default async () => {
963
- * await Clipboard.copy("https://raycast.com");
964
- * };
785
+ * export default function Command() {
786
+ * return (
787
+ * <Detail
788
+ * markdown="Press `⌘ + .` and share some love."
789
+ * actions={
790
+ * <ActionPanel>
791
+ * <Action.CopyToClipboard content="I ❤️ Raycast" shortcut={{ modifiers: ["cmd"], key: "." }} />
792
+ * </ActionPanel>
793
+ * }
794
+ * />
795
+ * );
796
+ * }
965
797
  * ```
966
798
  */
967
- export function copy(text: string): Promise<void>;
799
+ CopyToClipboard: typeof CopyToClipboard;
968
800
  /**
969
- * Clears the current clipboard contents.
801
+ * An action to open a file or folder with a specific application, just as if you had double-clicked the
802
+ * file's icon.
970
803
  *
971
- * @returns A Promise that resolves when the clipboard is cleared.
804
+ * @remarks
805
+ * The main window is closed after the file is opened.
972
806
  *
973
807
  * @example
974
808
  * ```typescript
975
- * import { Clipboard } from "@raycast/api";
809
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
976
810
  *
977
- * export default async () => {
978
- * await Clipboard.clear();
979
- * };
811
+ * export default function Command() {
812
+ * return (
813
+ * <Detail
814
+ * markdown="Check out your extension code."
815
+ * actions={
816
+ * <ActionPanel>
817
+ * <Action.Open title="Open Folder" target={__dirname} />
818
+ * </ActionPanel>
819
+ * }
820
+ * />
821
+ * );
822
+ * }
980
823
  * ```
981
824
  */
982
- export function clear(): Promise<void>;
825
+ Open: typeof Open;
983
826
  /**
984
- * Pastes text to the current selection of the frontmost application.
827
+ * Action that opens a URL in the default browser.
985
828
  *
986
- * @param text - The text to insert at the cursor.
987
- * @returns A Promise that resolves when the text is pasted.
829
+ * @remarks
830
+ * The main window is closed after the URL is opened in the browser.
988
831
  *
989
832
  * @example
990
833
  * ```typescript
991
- * import { Clipboard } from "@raycast/api";
834
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
992
835
  *
993
- * export default async () => {
994
- * await Clipboard.paste("I really like Raycast's API");
995
- * };
836
+ * export default function Command() {
837
+ * return (
838
+ * <Detail
839
+ * markdown="Join the gang!"
840
+ * actions={
841
+ * <ActionPanel>
842
+ * <Action.OpenInBrowser url="https://raycast.com/jobs" />
843
+ * </ActionPanel>
844
+ * }
845
+ * />
846
+ * );
847
+ * }
848
+ * ```
849
+ */
850
+ OpenInBrowser: typeof OpenInBrowser;
851
+ /**
852
+ * Action that opens a file or folder with a specific application.
853
+ *
854
+ * @remarks
855
+ * The action opens a sub-menu with all applications that can open the file or folder.
856
+ * The main window is closed after the file is opened in the specified application.
857
+ *
858
+ * @example
859
+ * ```typescript
860
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
861
+ * import { homedir } from "os";
862
+ *
863
+ * const DESKTOP_DIR = `${homedir()}/Desktop`;
864
+ *
865
+ * export default function Command() {
866
+ * return (
867
+ * <Detail
868
+ * markdown="What do you want to use to open your desktop with?"
869
+ * actions={
870
+ * <ActionPanel>
871
+ * <Action.OpenWith path={DESKTOP_DIR} />
872
+ * </ActionPanel>
873
+ * }
874
+ * />
875
+ * );
876
+ * }
877
+ * ```
878
+ */
879
+ OpenWith: typeof OpenWith;
880
+ /**
881
+ * Action that pastes the content to the front-most applications.
882
+ *
883
+ * @remarks
884
+ * The main window is closed after the content is pasted to the front-most application.
885
+ *
886
+ * @example
887
+ * ```typescript
888
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
889
+ *
890
+ * export default function Command() {
891
+ * return (
892
+ * <Detail
893
+ * markdown="Let us know what you think about the Raycast API?"
894
+ * actions={
895
+ * <ActionPanel>
896
+ * <Action.Paste content="api@raycast.com" />
897
+ * </ActionPanel>
898
+ * }
899
+ * />
900
+ * );
901
+ * }
902
+ * ```
903
+ */
904
+ Paste: typeof Paste;
905
+ /**
906
+ * Action that pushes a new view to the navigation stack.
907
+ *
908
+ * @example
909
+ * ```typescript
910
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
911
+ *
912
+ * function Ping() {
913
+ * return (
914
+ * <Detail
915
+ * markdown="Ping"
916
+ * actions={
917
+ * <ActionPanel>
918
+ * <Action.Push title="Push Pong" target={<Pong />} />
919
+ * </ActionPanel>
920
+ * }
921
+ * />
922
+ * );
923
+ * }
924
+ *
925
+ * function Pong() {
926
+ * return <Detail markdown="Pong" />;
927
+ * }
928
+ *
929
+ * export default function Command() {
930
+ * return <Ping />;
931
+ * }
932
+ * ```
933
+ */
934
+ Push: typeof Push;
935
+ /**
936
+ * Action that shows a file or folder in the Finder.
937
+ *
938
+ * @remarks
939
+ * The main window is closed after the file or folder is revealed in the Finder.
940
+ *
941
+ * @example
942
+ * ```typescript
943
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
944
+ * import { homedir } from "os";
945
+ *
946
+ * const DOWNLOADS_DIR = `${homedir()}/Downloads`;
947
+ *
948
+ * export default function Command() {
949
+ * return (
950
+ * <Detail
951
+ * markdown="Are your downloads pilling up again?"
952
+ * actions={
953
+ * <ActionPanel>
954
+ * <Action.ShowInFinder path={DOWNLOADS_DIR} />
955
+ * </ActionPanel>
956
+ * }
957
+ * />
958
+ * );
959
+ * }
960
+ * ```
961
+ */
962
+ ShowInFinder: typeof ShowInFinder;
963
+ /**
964
+ * Action that adds a submit handler for capturing form values.
965
+ *
966
+ * @example
967
+ * ```typescript
968
+ * import { ActionPanel, Form, Action } from "@raycast/api";
969
+ * import { useState } from "react";
970
+ *
971
+ * export default function Command() {
972
+ * const [name, setName] = useState<string>();
973
+ *
974
+ * return (
975
+ * <Form
976
+ * actions={
977
+ * <ActionPanel>
978
+ * <Action.SubmitForm title="Submit Name" onSubmit={(values) => console.log(values)} />
979
+ * </ActionPanel>
980
+ * }
981
+ * >
982
+ * <Form.TextField id="name" value={name} onChange={setName} />
983
+ * </Form>
984
+ * );
985
+ * }
996
986
  * ```
997
987
  */
998
- export function paste(text: string): Promise<void>;
988
+ SubmitForm: typeof SubmitForm;
999
989
  /**
1000
- * Reads the clipboard as plain text.
1001
- *
1002
- * @returns A promise that resolves when the clipboard content was read as plain text.
990
+ * Action that moves a file or folder to the Trash.
1003
991
  *
1004
992
  * @example
1005
993
  * ```typescript
1006
- * import { Clipboard } from "@raycast/api";
994
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
995
+ * import { homedir } from "os";
1007
996
  *
1008
- * export default async () => {
1009
- * const text = await Clipboard.readText();
1010
- * console.log(text);
1011
- * };
997
+ * const FILE = `${homedir()}/Downloads/get-rid-of-me.txt`;
998
+ *
999
+ * export default function Command() {
1000
+ * return (
1001
+ * <Detail
1002
+ * markdown="Some spring cleaning?"
1003
+ * actions={
1004
+ * <ActionPanel>
1005
+ * <Action.Trash paths={FILE} />
1006
+ * </ActionPanel>
1007
+ * }
1008
+ * />
1009
+ * );
1010
+ * }
1012
1011
  * ```
1013
1012
  */
1014
- export function readText(): Promise<string | undefined>;
1015
- }
1016
-
1017
- /**
1018
- * Closes the main Raycast window.
1019
- *
1020
- * @param options - Can be used to clear the root search. Defaults to not clearing the root search after
1021
- * the window was closed.
1022
- * @returns A Promise that resolves when the main window is closed.
1023
- *
1024
- * @example
1025
- * ```typescript
1026
- * import { closeMainWindow } from "@raycast/api";
1027
- * import { setTimeout } from "timers/promises";
1028
- *
1029
- * export default async () => {
1030
- * await setTimeout(1000);
1031
- * await closeMainWindow({ clearRootSearch: true });
1032
- * };
1033
- * ```
1034
- */
1035
- export declare function closeMainWindow(options?: {
1036
- clearRootSearch?: boolean;
1037
- }): Promise<void>;
1038
-
1039
- /**
1040
- * The standard colors. Use those colors for consistency.
1041
- *
1042
- * @remarks
1043
- * The colors automatically adapt to the Raycast theme (light or dark).
1044
- *
1045
- * @example
1046
- * ```typescript
1047
- * import { Color, Icon, List } from "@raycast/api";
1048
- *
1049
- * export default function Command() {
1050
- * return (
1051
- * <List>
1052
- * <List.Item title="Blue" icon={{ source: Icon.Circle, tintColor: Color.Blue }} />
1053
- * <List.Item title="Green" icon={{ source: Icon.Circle, tintColor: Color.Green }} />
1054
- * <List.Item title="Brown" icon={{ source: Icon.Circle, tintColor: Color.Brown }} />
1055
- * <List.Item title="Magenta" icon={{ source: Icon.Circle, tintColor: Color.Magenta }} />
1056
- * <List.Item title="Orange" icon={{ source: Icon.Circle, tintColor: Color.Orange }} />
1057
- * <List.Item title="Purple" icon={{ source: Icon.Circle, tintColor: Color.Purple }} />
1058
- * <List.Item title="Red" icon={{ source: Icon.Circle, tintColor: Color.Red }} />
1059
- * <List.Item title="Yellow" icon={{ source: Icon.Circle, tintColor: Color.Yellow }} />
1060
- * <List.Item title="PrimaryText" icon={{ source: Icon.Circle, tintColor: Color.PrimaryText }} />
1061
- * <List.Item title="SecondaryText" icon={{ source: Icon.Circle, tintColor: Color.SecondaryText }} />
1062
- * </List>
1063
- * );
1064
- * };
1065
- * ```
1066
- */
1067
- export declare enum Color {
1068
- Blue = "raycast-blue",
1069
- Brown = "raycast-brown",
1070
- Green = "raycast-green",
1071
- Magenta = "raycast-magenta",
1072
- Orange = "raycast-orange",
1073
- Purple = "raycast-purple",
1074
- Red = "raycast-red",
1075
- Yellow = "raycast-yellow",
1076
- PrimaryText = "raycast-primary-text",
1077
- SecondaryText = "raycast-secondary-text"
1078
- }
1079
-
1080
- export declare namespace Color {
1013
+ Trash: typeof Trash;
1081
1014
  /**
1082
- * Union type for the supported color types.
1083
- *
1084
- * {@link Color.Raw} will be dynamically adjusted to achieve high contrast with the Raycast user interface.
1015
+ * Action that navigates to the the Create Snippet command with some or all of the fields prefilled.
1085
1016
  *
1086
1017
  * @example
1087
1018
  * ```typescript
1088
- * import { Color, Icon, List } from "@raycast/api";
1019
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
1089
1020
  *
1090
1021
  * export default function Command() {
1091
1022
  * return (
1092
- * <List>
1093
- * <List.Item title="Built-in color" icon={{ source: Icon.Circle, tintColor: Color.Red }} />
1094
- * <List.Item title="HEX" icon={{ source: Icon.Circle, tintColor: "#FF0000" }} />
1095
- * <List.Item title="Short HEX" icon={{ source: Icon.Circle, tintColor: "#F00" }} />
1096
- * <List.Item title="RGBA" icon={{ source: Icon.Circle, tintColor: "rgb(255, 0, 0)" }} />
1097
- * <List.Item title="RGBA Percentage" icon={{ source: Icon.Circle, tintColor: "rgb(255, 0, 0, 1.0)" }} />
1098
- * <List.Item title="HSL" icon={{ source: Icon.Circle, tintColor: "hsla(200, 20%, 33%, 0.2)" }} />
1099
- * <List.Item title="Keywords" icon={{ source: Icon.Circle, tintColor: "red" }} />
1100
- * </List>
1023
+ * <Detail
1024
+ * markdown="Test out snippet creation"
1025
+ * actions={
1026
+ * <ActionPanel>
1027
+ * <Action.CreateSnippet snippet={{ text: "DE75512108001245126199" }} />
1028
+ * </ActionPanel>
1029
+ * }
1030
+ * />
1101
1031
  * );
1102
- * };
1032
+ * }
1103
1033
  * ```
1104
1034
  */
1105
- export type ColorLike = Color | Color.Dynamic | Color.Raw;
1035
+ CreateSnippet: typeof CreateSnippet;
1106
1036
  /**
1107
- * A dynamic color applies different colors depending on the active Raycast theme.
1037
+ * Action that navigates to the the Create Quicklink command with some or all of the fields prefilled.
1108
1038
  *
1109
1039
  * @example
1110
1040
  * ```typescript
1111
- * import { Color, Icon, List } from "@raycast/api";
1041
+ * import { ActionPanel, Detail, Action } from "@raycast/api";
1112
1042
  *
1113
1043
  * export default function Command() {
1114
- * return (
1115
- * <List>
1116
- * <List.Item title="Dynamic Tint Color" icon={{ source: Icon.Circle, tintColor: { light: "#FF01FF", dark: "#FFFF50", adjustContrast: true } }} />
1117
- * <List.Item title="Dynamic Tint Color" icon={{ source: Icon.Circle, tintColor: { light: "#FF01FF", dark: "#FFFF50" } }} />
1118
- * </List>
1119
- * );
1120
- * };
1044
+ * return (
1045
+ * <Detail
1046
+ * markdown="Test out quicklink creation"
1047
+ * actions={
1048
+ * <ActionPanel>
1049
+ * <Action.CreateQuicklink quicklink={{ link: "https://duckduckgo.com/?q={Query}" }} />
1050
+ * </ActionPanel>
1051
+ * }
1052
+ * />
1053
+ * );
1054
+ * }
1121
1055
  * ```
1122
1056
  */
1123
- export interface Dynamic {
1124
- /**
1125
- * The color which is used in light theme.
1126
- */
1127
- light: Color.Raw;
1128
- /**
1129
- * The color which is used in dark theme.
1130
- */
1131
- dark: Color.Raw;
1132
- /**
1133
- * Enables dynamic contrast adjustment for light and dark theme color.
1134
- *
1135
- * @remarks
1136
- * Colors different to the built-in {@link Color} can be dynamically adjusted to achieve high contrast with the
1137
- * Raycast user interface. This makes it easy to guarantee a good look and feel when you aren't in control of the
1138
- * color, e.g. get it via a network request.
1139
- *
1140
- * @defaultValue false
1141
- */
1142
- adjustContrast?: boolean | undefined | null;
1143
- }
1144
- /**
1145
- * You can use any of the following color formats:
1146
- * - HEX, e.g `#FF0000`
1147
- * - Short HEX, e.g. `#F00`
1148
- * - RGBA, e.g. `rgb(255, 0, 0)`
1149
- * - RGBA Percentage, e.g. `rgb(255, 0, 0, 1.0)`
1150
- * - HSL, e.g. `hsla(200, 20%, 33%, 0.2)`
1151
- * - Keywords, e.g. `red`
1152
- */
1153
- export type Raw = string;
1057
+ CreateQuicklink: typeof CreateQuicklink;
1154
1058
  }
1155
1059
 
1156
- /**
1157
- * @deprecated Use {@link Color.ColorLike} instead
1158
- */
1159
- export declare type ColorLike = Color.ColorLike;
1160
-
1161
- /**
1162
- * Creates and shows a confirmation Alert with the given options.
1163
- *
1164
- * @param options - The options used to create the Alert.
1165
- * @returns A Promise that resolves to a boolean when the user triggers one of the actions.
1166
- * It will be `true` for the primary Action, `false` for the dismiss Action.
1167
- *
1168
- * @example
1169
- * ```typescript
1170
- * import { confirmAlert } from "@raycast/api";
1171
- *
1172
- * export default async () => {
1173
- * if (await confirmAlert({ title: "Are you sure?" })) {
1174
- * // do something
1175
- * }
1176
- * };
1177
- * ```
1178
- */
1179
- export declare function confirmAlert(options: Alert.Options): Promise<boolean>;
1180
-
1181
1060
  /**
1182
1061
  * @deprecated Use {@link Clipboard.copy} instead
1183
1062
  */
1184
1063
  export declare const copyTextToClipboard: typeof Clipboard.copy;
1185
1064
 
1186
1065
  /**
1187
- * @deprecated Use {@link Action.CopyToClipboard} instead.
1066
+ * See {@link Action.CopyToClipboard}
1188
1067
  */
1189
- export declare const CopyToClipboardAction: CopyToClipboardAction_2;
1068
+ declare const CopyToClipboard: FunctionComponent<CopyToClipboardProps>;
1190
1069
 
1191
1070
  /**
1192
- * See {@link Action.CopyToClipboard}
1071
+ * @deprecated Use {@link Action.CopyToClipboard} instead.
1193
1072
  */
1194
- declare function CopyToClipboardAction_2(props: CopyToClipboardActionProps_2): ReactElement<CopyToClipboardActionProps_2>;
1195
-
1196
- declare namespace CopyToClipboardAction_2 {
1197
- var displayName: string;
1198
- }
1073
+ export declare const CopyToClipboardAction: FunctionComponent<CopyToClipboardProps>;
1199
1074
 
1200
1075
  /**
1201
1076
  * @deprecated Use {@link Action.CopyToClipboard.Props} instead.
@@ -1206,7 +1081,7 @@ export declare interface CopyToClipboardActionProps extends Action.CopyToClipboa
1206
1081
  /**
1207
1082
  * See {@link Action.CopyToClipboard.Props}
1208
1083
  */
1209
- declare interface CopyToClipboardActionProps_2 {
1084
+ declare interface CopyToClipboardProps {
1210
1085
  /**
1211
1086
  * The contents that will be written to the clipboard as string.
1212
1087
  */
@@ -1237,11 +1112,7 @@ declare interface CopyToClipboardActionProps_2 {
1237
1112
  /**
1238
1113
  * See {@link Action.CreateQuicklink}
1239
1114
  */
1240
- declare function CreateQuicklinkAction(props: CreateQuicklinkProps): ReactElement<CreateQuicklinkProps>;
1241
-
1242
- declare namespace CreateQuicklinkAction {
1243
- var displayName: string;
1244
- }
1115
+ declare const CreateQuicklink: FunctionComponent<CreateQuicklinkProps>;
1245
1116
 
1246
1117
  declare interface CreateQuicklinkProps {
1247
1118
  /**
@@ -1253,7 +1124,7 @@ declare interface CreateQuicklinkProps {
1253
1124
  */
1254
1125
  title?: string;
1255
1126
  /**
1256
- * A optional icon displayed for the item. See {@link ImageLike} for the supported formats and types.
1127
+ * A optional icon displayed for the item. See {@link Image.ImageLike} for the supported formats and types.
1257
1128
  */
1258
1129
  icon?: Image.ImageLike;
1259
1130
  /**
@@ -1265,11 +1136,7 @@ declare interface CreateQuicklinkProps {
1265
1136
  /**
1266
1137
  * See {@link Action.CreateQuicklink}
1267
1138
  */
1268
- declare function CreateSnippetAction(props: CreateSnippetProps): ReactElement<CreateSnippetProps>;
1269
-
1270
- declare namespace CreateSnippetAction {
1271
- var displayName: string;
1272
- }
1139
+ declare const CreateSnippet: FunctionComponent<CreateSnippetProps>;
1273
1140
 
1274
1141
  declare interface CreateSnippetProps {
1275
1142
  snippet: Snippet;
@@ -1278,7 +1145,7 @@ declare interface CreateSnippetProps {
1278
1145
  */
1279
1146
  title?: string;
1280
1147
  /**
1281
- * A optional icon displayed for the item. See {@link ImageLike} for the supported formats and types.
1148
+ * A optional icon displayed for the item. See {@link Image.ImageLike} for the supported formats and types.
1282
1149
  */
1283
1150
  icon?: Image.ImageLike;
1284
1151
  /**
@@ -1290,14 +1157,16 @@ declare interface CreateSnippetProps {
1290
1157
  /**
1291
1158
  * See {@link Form.DatePicker}
1292
1159
  */
1293
- declare const DatePicker: ForwardRefExoticComponent<DatePickerProps & RefAttributes<FormItemRef>> & {
1160
+ declare const DatePicker: ForwardRefExoticComponent<DatePickerProps & RefAttributes<FormItemRef>> & DatePickerMembers;
1161
+
1162
+ declare interface DatePickerMembers {
1294
1163
  /**
1295
1164
  * The types of date components the user can pick
1296
1165
  * * `Date` - only year, month, and day can be picked
1297
1166
  * * `DateTime` - hour and second can be picked in addition to year, month and day
1298
1167
  */
1299
1168
  Type: typeof FormDatePickerType;
1300
- };
1169
+ }
1301
1170
 
1302
1171
  declare interface DatePickerProps extends FormItemProps_2<Date> {
1303
1172
  /**
@@ -1313,7 +1182,14 @@ declare interface DatePickerProps extends FormItemProps_2<Date> {
1313
1182
  */
1314
1183
  declare type DatePickerRef = FormItemRef;
1315
1184
 
1316
- declare interface DeprecatedFormItems {
1185
+ declare interface DeprecatedActionPanelMembers {
1186
+ /**
1187
+ * @deprecated Use {@link Action} instead.
1188
+ */
1189
+ Item: typeof Action;
1190
+ }
1191
+
1192
+ declare interface DeprecatedFormMembers {
1317
1193
  /**
1318
1194
  * @deprecated Use {@link Form.Dropdown.Section} instead.
1319
1195
  */
@@ -1385,276 +1261,151 @@ declare interface DescriptionProps {
1385
1261
  * }
1386
1262
  * ```
1387
1263
  */
1388
- export declare function Detail(props: Detail.Props): ReactElement<Detail.Props>;
1389
-
1390
- export declare namespace Detail {
1391
- var propTypes: {
1392
- navigationTitle: PropTypes.Requireable<string>;
1393
- isLoading: PropTypes.Requireable<boolean>;
1394
- markdown: PropTypes.Requireable<string>;
1395
- metadata: PropTypes.Requireable<PropTypes.ReactNodeLike>;
1396
- };
1397
- var displayName: string;
1398
- }
1264
+ export declare const Detail: FunctionComponent<DetailProps_2> & DetailMembers;
1399
1265
 
1400
1266
  export declare namespace Detail {
1401
1267
  /**
1402
1268
  * Props of the {@link Detail} React component.
1403
1269
  */
1404
- export interface Props extends ActionsInterface, NavigationChildInterface {
1405
- /**
1406
- * The CommonMark string to be rendered.
1407
- */
1408
- markdown?: string | null;
1409
- /**
1410
- * The `Detail.Metadata` to be rendered in the right side area
1411
- */
1412
- metadata?: ReactNode;
1413
- }
1414
- /**
1415
- * A Metadata view that will be shown in the right-hand-side of the `Detail`.
1416
- *
1417
- * Use it to display additional structured data about the main content shown in the `Detail` view.
1418
- */
1419
- const Metadata: typeof DetailMetadata;
1270
+ export type Props = DetailProps_2;
1420
1271
  export namespace Metadata {
1421
1272
  /**
1422
1273
  * Props of the {@link Detail.Metadata} React component.
1423
1274
  */
1424
- export interface Props {
1425
- /**
1426
- * The Detail.Metadata.Item elements of the Metadata view.
1427
- */
1428
- children: ReactNode;
1429
- }
1430
- /**
1431
- * Props of the Detail.Metadata.Item React component.
1432
- */
1433
- export interface ItemProps {
1434
- /**
1435
- * The title shown above the item.
1436
- */
1437
- title: string;
1438
- }
1275
+ export type Props = MetadataProps;
1439
1276
  export namespace Label {
1440
1277
  /**
1441
1278
  * Props of the {@link Detail.Metadata.Label} React component.
1442
1279
  */
1443
- export interface Props extends ItemProps {
1444
- /**
1445
- * An icon to illustrate the value of the item.
1446
- */
1447
- icon?: Image.ImageLike;
1448
- /**
1449
- * The text value of the item.
1450
- */
1451
- text?: string;
1452
- }
1280
+ export type Props = LabelProps;
1453
1281
  }
1454
1282
  export namespace Separator {
1455
1283
  /**
1456
1284
  * Props of the {@link Detail.Metadata.Separator} React component.
1457
1285
  */
1458
- export interface Props {
1459
- }
1286
+ export type Props = SeparatorProps;
1460
1287
  }
1461
1288
  export namespace Link {
1462
1289
  /**
1463
1290
  * Props of the {@link Detail.Metadata.Link} React component.
1464
1291
  */
1465
- export interface Props extends ItemProps {
1466
- /**
1467
- * The target of the link.
1468
- */
1469
- target: string;
1470
- /**
1471
- * The text value of the item.
1472
- */
1473
- text: string;
1474
- }
1292
+ export type Props = LinkProps;
1475
1293
  }
1476
1294
  export namespace TagList {
1477
1295
  /**
1478
1296
  * Props of the {@link Detail.Metadata.TagList} React component.
1479
1297
  */
1480
- export interface Props extends ItemProps {
1481
- /**
1482
- * The tags contained in the TagList.
1483
- */
1484
- children: ReactNode;
1485
- }
1298
+ export type Props = TagListProps;
1486
1299
  export namespace Item {
1487
1300
  /**
1488
1301
  * Props of the {@link Detail.Metadata.TagList.Item} React component.
1489
1302
  */
1490
- export interface Props {
1491
- /**
1492
- * An optional icon in front of the text of the tag.
1493
- */
1494
- icon?: Image.ImageLike;
1495
- /**
1496
- * The text of the tag.
1497
- */
1498
- text: string;
1499
- /**
1500
- * Changes the text color to the provided color and sets a transparent background with the same color.
1501
- */
1502
- color?: Color.ColorLike;
1503
- }
1303
+ export type Props = TagListItemProps;
1504
1304
  }
1505
1305
  }
1506
1306
  }
1507
1307
  }
1508
1308
 
1509
1309
  /**
1510
- * See {@link Detail.Metadata}
1310
+ * See {@link List.Item.Detail}
1311
+ */
1312
+ declare const Detail_2: FunctionComponent<DetailProps_3>;
1313
+
1314
+ declare interface DetailMembers {
1315
+ /**
1316
+ * A Metadata view that will be shown in the right-hand-side of the `Detail`.
1317
+ *
1318
+ * Use it to display additional structured data about the main content shown in the `Detail` view.
1319
+ */
1320
+ Metadata: typeof Metadata;
1321
+ }
1322
+
1323
+ /**
1324
+ * @deprecated Use {@link Detail.Props} instead.
1511
1325
  */
1512
- declare function DetailMetadata(props: Detail.Metadata.Props): ReactElement<Detail.Metadata.Props>;
1513
-
1514
- declare namespace DetailMetadata {
1515
- var propTypes: {};
1516
- var displayName: string;
1326
+ export declare interface DetailProps extends Detail.Props {
1517
1327
  }
1518
1328
 
1519
- declare namespace DetailMetadata {
1329
+ declare interface DetailProps_2 extends ActionsInterface, NavigationChildInterface {
1520
1330
  /**
1521
- * A single value with an optional icon.
1331
+ * The CommonMark string to be rendered.
1522
1332
  */
1523
- const Label: typeof DetailMetadataLabel;
1333
+ markdown?: string | null;
1524
1334
  /**
1525
- * A metadata item that shows a separator line. Use it for grouping and visually separating metadata items.
1335
+ * The `Detail.Metadata` to be rendered in the right side area
1526
1336
  */
1527
- const Separator: typeof DetailMetadataSeparator;
1337
+ metadata?: ReactNode;
1338
+ }
1339
+
1340
+ declare interface DetailProps_3 {
1528
1341
  /**
1529
- * An item to display a link.
1342
+ * Indicates whether a loading bar should be shown or hidden above the detail
1343
+ *
1344
+ * @defaultValue false
1530
1345
  */
1531
- const Link: typeof DetailMetadataLink;
1346
+ isLoading?: boolean;
1532
1347
  /**
1533
- * A list of {@link Detail.Metadata.TagList.Item} displayed in a row.
1348
+ * The CommonMark string to be rendered in the right side area when the parent List is showing details and the item is selected.
1534
1349
  */
1535
- const TagList: typeof DetailMetadataTagList;
1350
+ markdown?: string | null;
1536
1351
  }
1537
1352
 
1538
1353
  /**
1539
- * See {@link Detail.Metadata.Label}
1354
+ * See {@link Form.Dropdown}
1540
1355
  */
1541
- declare function DetailMetadataLabel(props: Detail.Metadata.Label.Props): ReactElement<Detail.Metadata.Label.Props> | null;
1542
-
1543
- declare namespace DetailMetadataLabel {
1544
- var propTypes: {
1545
- title: PropTypes.Validator<string>;
1546
- icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
1547
- fileIcon: PropTypes.Validator<string>;
1548
- }>> | Required<PropTypes.InferProps<{
1549
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
1550
- light: PropTypes.Validator<string>;
1551
- dark: PropTypes.Validator<string>;
1552
- }>>>;
1553
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
1554
- light: PropTypes.Validator<string>;
1555
- dark: PropTypes.Validator<string>;
1556
- }>>>;
1557
- mask: PropTypes.Requireable<Image.Mask>;
1558
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
1559
- light: PropTypes.Validator<string>;
1560
- dark: PropTypes.Validator<string>;
1561
- adjustContrast: PropTypes.Requireable<boolean>;
1562
- }>>>;
1563
- }>>>;
1564
- text: PropTypes.Requireable<string>;
1565
- };
1566
- var displayName: string;
1567
- }
1356
+ declare const Dropdown: ForwardRefExoticComponent<DropdownProps & RefAttributes<FormItemRef>> & DropdownMembers;
1568
1357
 
1569
1358
  /**
1570
- * See {@link Detail.Metadata.Link}
1359
+ * See {@link List.Dropdown}
1571
1360
  */
1572
- declare function DetailMetadataLink(props: Detail.Metadata.Link.Props): ReactElement<Detail.Metadata.Link.Props>;
1573
-
1574
- declare namespace DetailMetadataLink {
1575
- var propTypes: {
1576
- title: PropTypes.Validator<string>;
1577
- target: PropTypes.Validator<string>;
1578
- text: PropTypes.Validator<string>;
1579
- };
1580
- var displayName: string;
1581
- }
1361
+ declare const Dropdown_2: FunctionComponent<DropdownProps_2> & DropdownMembers_2;
1582
1362
 
1583
1363
  /**
1584
- * See {@link Detail.Metadata.Separator}
1364
+ * See {@link Form.Dropdown.Item}
1585
1365
  */
1586
- declare function DetailMetadataSeparator(props: Detail.Metadata.Separator.Props): ReactElement<Detail.Metadata.Separator.Props>;
1587
-
1588
- declare namespace DetailMetadataSeparator {
1589
- var propTypes: {};
1590
- var displayName: string;
1591
- }
1366
+ declare const DropdownItem: FunctionComponent<DropdownItemProps>;
1592
1367
 
1593
1368
  /**
1594
- * See {@link Detail.Metadata.TagList}
1369
+ * See {@link List.Dropdown.Item}
1595
1370
  */
1596
- declare function DetailMetadataTagList(props: Detail.Metadata.TagList.Props): ReactElement<Detail.Metadata.TagList.Props>;
1597
-
1598
- declare namespace DetailMetadataTagList {
1599
- var propTypes: {
1600
- title: PropTypes.Validator<string>;
1601
- children: PropTypes.Requireable<PropTypes.ReactNodeLike>;
1602
- };
1603
- var displayName: string;
1604
- }
1605
-
1606
- declare namespace DetailMetadataTagList {
1607
- /**
1608
- * A Tag in a {@link Detail.Metadata.TagList}.
1609
- */
1610
- const Item: typeof DetailMetadataTagListItem;
1611
- }
1371
+ declare const DropdownItem_2: FunctionComponent<DropdownItemProps_2>;
1612
1372
 
1613
1373
  /**
1614
- * See {@link Detail.Metadata.TagList.Item}
1374
+ * See {@link Form.Dropdown.Item.Props}
1615
1375
  */
1616
- declare function DetailMetadataTagListItem(props: Detail.Metadata.TagList.Item.Props): ReactElement<Detail.Metadata.TagList.Item.Props>;
1617
-
1618
- declare namespace DetailMetadataTagListItem {
1619
- var propTypes: {
1620
- text: PropTypes.Validator<string>;
1621
- icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
1622
- fileIcon: PropTypes.Validator<string>;
1623
- }>> | Required<PropTypes.InferProps<{
1624
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
1625
- light: PropTypes.Validator<string>;
1626
- dark: PropTypes.Validator<string>;
1627
- }>>>;
1628
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
1629
- light: PropTypes.Validator<string>;
1630
- dark: PropTypes.Validator<string>;
1631
- }>>>;
1632
- mask: PropTypes.Requireable<Image.Mask>;
1633
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
1634
- light: PropTypes.Validator<string>;
1635
- dark: PropTypes.Validator<string>;
1636
- adjustContrast: PropTypes.Requireable<boolean>;
1637
- }>>>;
1638
- }>>>;
1639
- color: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
1640
- light: PropTypes.Validator<string>;
1641
- dark: PropTypes.Validator<string>;
1642
- adjustContrast: PropTypes.Requireable<boolean>;
1643
- }>>>;
1644
- };
1645
- var displayName: string;
1376
+ declare interface DropdownItemProps {
1377
+ /**
1378
+ * Value of the dropdown item.
1379
+ * Make sure to assign each unique value for each item.
1380
+ */
1381
+ value: string;
1382
+ /**
1383
+ * The title displayed for the item.
1384
+ */
1385
+ title: string;
1386
+ /**
1387
+ * A optional icon displayed for the item.
1388
+ */
1389
+ icon?: Image.ImageLike;
1646
1390
  }
1647
1391
 
1648
- /**
1649
- * @deprecated Use {@link Detail.Props} instead.
1650
- */
1651
- export declare interface DetailProps extends Detail.Props {
1392
+ declare interface DropdownItemProps_2 {
1393
+ /**
1394
+ * Value of the dropdown item.
1395
+ * Make sure to assign each unique value for each item.
1396
+ */
1397
+ value: string;
1398
+ /**
1399
+ * The title displayed for the item.
1400
+ */
1401
+ title: string;
1402
+ /**
1403
+ * An optional icon displayed for the item.
1404
+ */
1405
+ icon?: Image.ImageLike | undefined | null;
1652
1406
  }
1653
1407
 
1654
- /**
1655
- * See {@link Form.Dropdown}
1656
- */
1657
- declare const Dropdown: ForwardRefExoticComponent<DropdownProps & RefAttributes<FormItemRef>> & {
1408
+ declare interface DropdownMembers {
1658
1409
  /**
1659
1410
  * Visually separated group of dropdown items.
1660
1411
  *
@@ -1715,30 +1466,61 @@ declare const Dropdown: ForwardRefExoticComponent<DropdownProps & RefAttributes<
1715
1466
  * ```
1716
1467
  */
1717
1468
  Item: typeof DropdownItem;
1718
- };
1719
-
1720
- /**
1721
- * See {@link Form.Dropdown.Item}
1722
- */
1723
- declare const DropdownItem: FunctionComponent<DropdownItemProps>;
1469
+ }
1724
1470
 
1725
- /**
1726
- * See {@link Form.Dropdown.Item.Props}
1727
- */
1728
- declare interface DropdownItemProps {
1729
- /**
1730
- * Value of the dropdown item.
1731
- * Make sure to assign each unique value for each item.
1732
- */
1733
- value: string;
1471
+ declare interface DropdownMembers_2 {
1734
1472
  /**
1735
- * The title displayed for the item.
1473
+ * Visually separated group of dropdown items in a {@link List.Dropdown}.
1474
+ *
1475
+ * @remarks
1476
+ * Use sections to group related dropdown items together.
1477
+ *
1478
+ * @example
1479
+ * ```typescript
1480
+ * import { List } from "@raycast/api";
1481
+ *
1482
+ * export default function Command() {
1483
+ * return (
1484
+ * <List searchBarAccessory={
1485
+ * <List.Dropdown tooltip="Dropdown With Sections">
1486
+ * <List.Dropdown.Section title="First Section">
1487
+ * <List.Dropdown.Item title="One" value="one" />
1488
+ * </List.Dropdown.Section>
1489
+ * <List.Dropdown.Section title="Second Section">
1490
+ * <List.Dropdown.Item title="Two" value="two" />
1491
+ * </List.Dropdown.Section>
1492
+ * </List.Dropdown>
1493
+ * }>
1494
+ * <List.Item title="Item in the Main List">
1495
+ * </List>
1496
+ * );
1497
+ * }
1498
+ * ```
1736
1499
  */
1737
- title: string;
1500
+ Section: typeof DropdownSection_2;
1738
1501
  /**
1739
- * A optional icon displayed for the item.
1502
+ * A dropdown item in a {@link List.Dropdown}
1503
+ *
1504
+ * @example
1505
+ * ```typescript
1506
+ * import { List } from "@raycast/api";
1507
+ *
1508
+ * export default function Command() {
1509
+ * return (
1510
+ * <List searchBarAccessory={
1511
+ * <List.Dropdown tooltip="Dropdown With Items">
1512
+ * <List.Dropdown.Item title="One" value="one" />
1513
+ * <List.Dropdown.Item title="Two" value="two" />
1514
+ * <List.Dropdown.Item title="Three" value="three" />
1515
+ * </List.Dropdown>
1516
+ * }>
1517
+ * <List.Item title="Item in the Main List">
1518
+ * </List>
1519
+ * );
1520
+ * }
1521
+ * ```
1740
1522
  */
1741
- icon?: Image.ImageLike;
1523
+ Item: typeof DropdownItem_2;
1742
1524
  }
1743
1525
 
1744
1526
  /**
@@ -1751,6 +1533,48 @@ declare interface DropdownProps extends FormItemProps_2<string> {
1751
1533
  children?: ReactNode;
1752
1534
  }
1753
1535
 
1536
+ declare interface DropdownProps_2 {
1537
+ /**
1538
+ * ID of the dropdown.
1539
+ */
1540
+ id?: string;
1541
+ /**
1542
+ * Tooltip displayed when hovering the dropdown.
1543
+ */
1544
+ tooltip: string;
1545
+ /**
1546
+ * Placeholder text that will be shown in the dropdown search field.
1547
+ *
1548
+ * @defaultValue Search...
1549
+ */
1550
+ placeholder?: string;
1551
+ /**
1552
+ * Indicates whether the value of the dropdown should be persisted after selection, and restored next time the dropdown is rendered.
1553
+ */
1554
+ storeValue?: boolean | undefined;
1555
+ /**
1556
+ * The currently value of the dropdown.
1557
+ */
1558
+ value?: string;
1559
+ /**
1560
+ * The default value of the dropdown.
1561
+ * Keep in mind that `defaultValue` will be configured once per component lifecycle. This means that if a user changes the value, `defaultValue` won't be configured on re-rendering.
1562
+ *
1563
+ * **If you're using `storeValue` and configured it as `true` _and_ a {@link List.Dropdown.Item} with the same value exists, then it will be selected.**
1564
+ *
1565
+ * **If you configure `value` at the same time as `defaultValue`, the `value` will have precedence over `defaultValue`.**
1566
+ */
1567
+ defaultValue?: string;
1568
+ /**
1569
+ * List sections or items. If {@link List.Dropdown.Item} elements are specified, a default section is automatically created.
1570
+ */
1571
+ children?: ReactNode;
1572
+ /**
1573
+ * Callback triggered when the list item selection changes.
1574
+ */
1575
+ onChange?: (newValue: string) => void;
1576
+ }
1577
+
1754
1578
  /**
1755
1579
  * Form.Dropdown Ref type.
1756
1580
  */
@@ -1761,6 +1585,11 @@ declare type DropdownRef = FormItemRef;
1761
1585
  */
1762
1586
  declare const DropdownSection: FunctionComponent<DropdownSectionProps>;
1763
1587
 
1588
+ /**
1589
+ * See {@link List.Dropdown.Section}
1590
+ */
1591
+ declare const DropdownSection_2: FunctionComponent<DropdownSectionProps_2>;
1592
+
1764
1593
  /**
1765
1594
  * See {@link Form.Dropdown.Section.Props}
1766
1595
  */
@@ -1775,11 +1604,43 @@ declare interface DropdownSectionProps {
1775
1604
  title?: string;
1776
1605
  }
1777
1606
 
1607
+ declare interface DropdownSectionProps_2 {
1608
+ /**
1609
+ * The item elements of the section.
1610
+ */
1611
+ children?: ReactNode;
1612
+ /**
1613
+ * Title displayed above the section
1614
+ */
1615
+ title?: string;
1616
+ }
1617
+
1778
1618
  /**
1779
1619
  * @deprecated Use {@link Color.Dynamic} instead
1780
1620
  */
1781
1621
  export declare type DynamicColor = Color.Dynamic;
1782
1622
 
1623
+ declare const EmptyView: FunctionComponent<EmptyViewProps>;
1624
+
1625
+ declare interface EmptyViewProps extends ActionsInterface {
1626
+ /**
1627
+ * An icon displayed in the center of the EmptyView.
1628
+ *
1629
+ * @remarks
1630
+ * If an SVG is used, its longest side will be 128 pixels. Other images will be up/downscaled proportionally so that the longest side is between 64 and 256 pixels.
1631
+ * If not specified, Raycast's default `EmptyView` icon will be used.
1632
+ */
1633
+ icon?: Image.ImageLike | undefined | null;
1634
+ /**
1635
+ * The main title displayed for the Empty View.
1636
+ */
1637
+ title?: string;
1638
+ /**
1639
+ * An optional description for why the empty view is shown.
1640
+ */
1641
+ description?: string;
1642
+ }
1643
+
1783
1644
  /**
1784
1645
  * Holds data about the environment the command is running in. Use the global {@link environment} object to retrieve values.
1785
1646
  */
@@ -1871,7 +1732,7 @@ export declare interface FileSystemItem {
1871
1732
  /**
1872
1733
  * Shows a list of form items such as {@link Form.TextField}, {@link Form.Checkbox} or {@link Form.Dropdown}.
1873
1734
  */
1874
- export declare const Form: FunctionComponent<FormProps_2> & FormItems & DeprecatedFormItems;
1735
+ export declare const Form: FunctionComponent<FormProps_2> & FormMembers & DeprecatedFormMembers;
1875
1736
 
1876
1737
  export declare namespace Form {
1877
1738
  export type ItemProps<T extends FormValue_2> = FormItemProps_2<T>;
@@ -1880,7 +1741,7 @@ export declare namespace Form {
1880
1741
  export type Props = FormProps_2;
1881
1742
  /**
1882
1743
  * A Ref Type for the {@link Form.TextField}.
1883
- * Use refs to control your Form by calling {@link Form.TextField.focus()} or {@link Form.TextField.reset()} functions.
1744
+ * Use refs to control your Form by calling `Form.TextField.focus()` or `Form.TextField.reset()` functions.
1884
1745
  *
1885
1746
  * @example
1886
1747
  * Using Ref to focus {@link Form.TextField}.
@@ -1953,7 +1814,7 @@ export declare namespace Form {
1953
1814
  }
1954
1815
  /**
1955
1816
  * A Ref Type for the {@link Form.PasswordField}.
1956
- * Use refs to control your Form by calling {@link Form.PasswordField.focus()} or {@link Form.PasswordField.reset()} functions.
1817
+ * Use refs to control your Form by calling `Form.PasswordField.focus()` or `Form.PasswordField.reset()` functions.
1957
1818
  *
1958
1819
  * @example
1959
1820
  * Using Ref to focus {@link Form.PasswordField}.
@@ -2026,7 +1887,7 @@ export declare namespace Form {
2026
1887
  }
2027
1888
  /**
2028
1889
  * A Ref Type for the {@link Form.TextArea}.
2029
- * Use refs to control your Form by calling {@link Form.TextArea.focus()} or {@link Form.TextArea.reset()} functions.
1890
+ * Use refs to control your Form by calling `Form.TextArea.focus()` or `Form.TextArea.reset()` functions.
2030
1891
  *
2031
1892
  * @example
2032
1893
  * Using Ref to focus {@link Form.TextArea}.
@@ -2111,7 +1972,7 @@ export declare namespace Form {
2111
1972
  }
2112
1973
  /**
2113
1974
  * A Ref Type for the {@link Form.Checkbox}.
2114
- * Use refs to control your Form by calling {@link Form.Checkbox.focus()} or {@link Form.Checkbox.reset()} functions.
1975
+ * Use refs to control your Form by calling `Form.Checkbox.focus()` or `Form.Checkbox.reset()` functions.
2115
1976
  *
2116
1977
  * @example
2117
1978
  * Using Ref to focus {@link Form.Checkbox}.
@@ -2186,7 +2047,7 @@ export declare namespace Form {
2186
2047
  }
2187
2048
  /**
2188
2049
  * A Ref Type for the {@link Form.DatePicker}.
2189
- * Use refs to control your Form by calling {@link Form.DatePicker.focus()} or {@link Form.DatePicker.reset()} functions.
2050
+ * Use refs to control your Form by calling `Form.DatePicker.focus()` or `Form.DatePicker.reset()` functions.
2190
2051
  *
2191
2052
  * @example
2192
2053
  * Using Ref to focus {@link Form.DatePicker}.
@@ -2261,7 +2122,7 @@ export declare namespace Form {
2261
2122
  }
2262
2123
  /**
2263
2124
  * A Ref Type for the {@link Form.Dropdown}.
2264
- * Use refs to control your Form by calling {@link Form.Dropdown.focus()} or {@link Form.Dropdown.reset()} functions.
2125
+ * Use refs to control your Form by calling `Form.Dropdown.focus()` or `Form.Dropdown.reset()` functions.
2265
2126
  *
2266
2127
  * @example
2267
2128
  * Using Ref to focus {@link Form.Dropdown}.
@@ -2356,7 +2217,7 @@ export declare namespace Form {
2356
2217
  }
2357
2218
  /**
2358
2219
  * A Ref Type for the {@link Form.TagPicker}.
2359
- * Use refs to control your Form by calling {@link Form.TagPicker.focus()} or {@link Form.TagPicker.reset()} functions.
2220
+ * Use refs to control your Form by calling `Form.TagPicker.focus()` or `Form.TagPicker.reset()` functions.
2360
2221
  *
2361
2222
  * @example
2362
2223
  * Using Ref to focus {@link Form.TagPicker}.
@@ -2561,10 +2422,84 @@ declare interface FormItemProps_2<T extends FormValue_2> {
2561
2422
  /**
2562
2423
  * The callback which will be triggered on the {@link Form.Item.Props.value} change for the item.
2563
2424
  */
2564
- onChange?: (newValue: T & FormValue_2) => void;
2425
+ onChange?: (newValue: T & FormValue_2) => void;
2426
+ }
2427
+
2428
+ /**
2429
+ * Interface describing common functions and props that Form.Item Refs has.
2430
+ */
2431
+ declare interface FormItemRef {
2432
+ /**
2433
+ * Makes the item focused
2434
+ *
2435
+ * @example
2436
+ * ```typescript
2437
+ * import { Form, ActionPanel, Action } from "@raycast/api";
2438
+ * import { useRef } from "react";
2439
+ *
2440
+ * export default function Command() {
2441
+ * const textFieldRef = useRef<Form.TextField>(null);
2442
+ *
2443
+ * return (
2444
+ * <Form
2445
+ * actions={
2446
+ * <ActionPanel>
2447
+ * <Action.SubmitForm
2448
+ * title="Submit"
2449
+ * onSubmit={(values) => {
2450
+ * textFieldRef.current?.focus();
2451
+ * console.log("Values", values);
2452
+ * }}
2453
+ * />
2454
+ * </ActionPanel>
2455
+ * }
2456
+ * >
2457
+ * <Form.TextField id="textField" title="Your Name" placeholder="César" ref={textFieldRef} />
2458
+ * <Form.TextArea id="textArea" title="About" placeholder="Enter something about you" />
2459
+ * </Form>
2460
+ * );
2461
+ * }
2462
+ * ```
2463
+ */
2464
+ focus: () => void;
2465
+ /**
2466
+ * Resets value of the item
2467
+ * @remarks
2468
+ * In case if {@link FormItemProps.defaultValue} is defined, calling the `.reset()` function will drop the value to the provided one.
2469
+ *
2470
+ * @example
2471
+ * ```typescript
2472
+ * import { Form, ActionPanel, Action } from "@raycast/api";
2473
+ * import { useRef } from "react";
2474
+ *
2475
+ * export default function Command() {
2476
+ * const textFieldRef = useRef<Form.TextField>(null);
2477
+ *
2478
+ * return (
2479
+ * <Form
2480
+ * actions={
2481
+ * <ActionPanel>
2482
+ * <Action.SubmitForm
2483
+ * title="Submit"
2484
+ * onSubmit={(values) => {
2485
+ * textFieldRef.current?.focus();
2486
+ * console.log("Values", values);
2487
+ * }}
2488
+ * />
2489
+ * </ActionPanel>
2490
+ * }
2491
+ * >
2492
+ * <Form.TextField id="textField" title="Your Name" placeholder="César" ref={textFieldRef} />
2493
+ * <Form.TextArea id="textArea" title="About" placeholder="Enter something about you" />
2494
+ * </Form>
2495
+ * );
2496
+ * }
2497
+ * ```
2498
+ */
2499
+ reset: () => void;
2565
2500
  }
2566
2501
 
2567
- declare interface FormItems {
2502
+ declare interface FormMembers {
2568
2503
  /**
2569
2504
  * A form item with a checkbox.
2570
2505
  *
@@ -3497,6 +3432,106 @@ export declare const ImageMask: typeof Image.Mask;
3497
3432
  */
3498
3433
  export declare type ImageSource = Image.Source;
3499
3434
 
3435
+ /**
3436
+ * See {@link List.Item}
3437
+ */
3438
+ declare const Item: FunctionComponent<ItemProps> & ItemMembers;
3439
+
3440
+ declare interface ItemAccessory {
3441
+ /**
3442
+ * An optional text that will be used as the label.
3443
+ */
3444
+ text?: string | undefined | null;
3445
+ /**
3446
+ * An optional {@link Image.ImageLike} that will be used as the icon.
3447
+ * @remarks
3448
+ * An image will be shown in front of the text if {@link List.Item.Accessory.text} is specified.
3449
+ */
3450
+ icon?: Image.ImageLike | undefined | null;
3451
+ /**
3452
+ * An optional tooltip shown when the accessory is hovered.
3453
+ */
3454
+ tooltip?: string | undefined | null;
3455
+ }
3456
+
3457
+ declare interface ItemMembers {
3458
+ /**
3459
+ * A Detail view that will be shown in the right-hand-side of the List.
3460
+ *
3461
+ * @example
3462
+ * ```typescript
3463
+ * import { List } from "@raycast/api";
3464
+ *
3465
+ * export default function Command() {
3466
+ * return (
3467
+ * <List isShowingDetail>
3468
+ * <List.Item
3469
+ * title="Pikachu"
3470
+ * subtitle="Electric"
3471
+ * detail={<List.Item.Detail markdown="![Illustration](https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/25.png)" />}
3472
+ * />
3473
+ * </List>
3474
+ * );
3475
+ * }
3476
+ * ```
3477
+ */
3478
+ Detail: typeof Detail_2;
3479
+ }
3480
+
3481
+ declare interface ItemProps extends ActionsInterface {
3482
+ /**
3483
+ * ID of the item. This string is passed to the `onSelectionChange` handler of the {@link List} when the item is selected.
3484
+ * Make sure to assign each item a unique ID or a UUID will be auto generated.
3485
+ */
3486
+ id?: string;
3487
+ /**
3488
+ * The main title displayed for that item, optionally with a tooltip.
3489
+ */
3490
+ title: string | {
3491
+ value: string;
3492
+ tooltip: string;
3493
+ };
3494
+ /**
3495
+ * An optional subtitle displayed next to the main title, optionally with a tooltip.
3496
+ */
3497
+ subtitle?: string | {
3498
+ value: string;
3499
+ tooltip: string;
3500
+ };
3501
+ /**
3502
+ * An optional property used for providing additional indexable strings for search.
3503
+ * When filtering the list in Raycast through the search bar, the keywords will be searched in addition to the title.
3504
+ */
3505
+ keywords?: string[];
3506
+ /**
3507
+ * An optional icon displayed for the list item.
3508
+ */
3509
+ icon?: Image.ImageLike | {
3510
+ value: Image.ImageLike;
3511
+ tooltip: string;
3512
+ };
3513
+ /**
3514
+ * @deprecated Use `accessories={[ { icon: ... } ]}` instead.
3515
+ */
3516
+ accessoryIcon?: Image.ImageLike;
3517
+ /**
3518
+ * @deprecated Use `accessories={[ { text: ... } ]}` instead.
3519
+ */
3520
+ accessoryTitle?: string;
3521
+ /**
3522
+ * An optional array of {@link List.Item.Accessory} items displayed on the right side in a List.Item.
3523
+ */
3524
+ accessories?: ItemAccessory[] | undefined | null;
3525
+ /**
3526
+ * An {@link ActionPanel} that will be updated for the selected list item.
3527
+ */
3528
+ actions?: ReactNode | null;
3529
+ /**
3530
+ * The `List.Item.Detail` to be rendered in the right side area when the parent List is showing details and the item is selected.
3531
+ */
3532
+ detail?: ReactNode;
3533
+ }
3534
+
3500
3535
  export declare namespace Keyboard {
3501
3536
  /**
3502
3537
  * A keyboard shortcut is defined by one or more modifier keys (command, control, etc.) and a single key equivalent (a character or special key).
@@ -3573,291 +3608,122 @@ export declare type KeyEquivalent = Keyboard.KeyEquivalent;
3573
3608
  export declare type KeyModifier = Keyboard.KeyModifier;
3574
3609
 
3575
3610
  /**
3576
- * Displays {@link List.Section} or {@link List.Item}, optionally {@link List.Dropdown}.
3577
- *
3578
- * @remarks
3579
- * The list uses built-in filtering by indexing the title of list items and additionally keywords.
3580
- *
3581
- * @example
3582
- * ```typescript
3583
- * import { List } from "@raycast/api";
3584
- *
3585
- * function DrinkDropdown(props: DrinkDropdownProps) {
3586
- * const { isLoading = false, drinkTypes, onDrinkTypeChange } = props;
3587
- * return (
3588
- * <List.Dropdown
3589
- * tooltip="Select Drink Type"
3590
- * storeValue={true}
3591
- * onChange={(newValue) => {
3592
- * onDrinkTypeChange(newValue);
3593
- * }}
3594
- * >
3595
- * <List.Dropdown.Section title="Alcoholic Beverages">
3596
- * {drinkTypes.map((drinkType) => (
3597
- * <List.Dropdown.Item key={drinkType.id} title={{ value: drinkType.name, tooltip: drinkType.definition }} value={drinkType.id} />
3598
- * ))}
3599
- * </List.Dropdown.Section>
3600
- * </List.Dropdown>
3601
- * );
3602
- * }
3603
- *
3604
- * export default function Command() {
3605
- * const drinkTypes = [
3606
- * { id: 1, name: 'Beer', definition: "an alcoholic drink made from yeast-fermented malt flavoured with hops" },
3607
- * { id: 2, name: 'Wine', definition: "an alcoholic drink made from fermented grape juice" }];
3608
- * const onDrinkTypeChange = (newValue) => {
3609
- * console.log(newValue);
3610
- * }
3611
- * return (
3612
- * <List
3613
- * navigationTitle="Search Beers"
3614
- * searchBarPlaceholder="Search your favorite drink"
3615
- * searchBarAccessory={<DrinkDropdown drinkTypes={drinkTypes} onDrinkTypeChange={onDrinkTypeChange} />}
3616
- * >
3617
- * <List.Item title="Augustiner Helles" />
3618
- * <List.Item title="Camden Hells" />
3619
- * <List.Item title="Leffe Blonde" />
3620
- * <List.Item title="Sierra Nevada IPA" />
3621
- * </List>
3622
- * );
3623
- * }
3624
- * ```
3625
- */
3626
- export declare function List(props: List.Props): ReactElement<List.Props>;
3627
-
3628
- export declare namespace List {
3629
- var propTypes: {
3630
- onSelectionChange: PropTypes.Requireable<(...args: any[]) => any>;
3631
- searchBarAccessory: PropTypes.Requireable<PropTypes.ReactNodeLike>;
3632
- searchText: PropTypes.Requireable<string>;
3633
- enableFiltering: PropTypes.Requireable<boolean>;
3634
- searchBarPlaceholder: PropTypes.Requireable<string>;
3635
- selectedItemId: PropTypes.Requireable<string>;
3636
- throttle: PropTypes.Requireable<boolean>;
3637
- onSearchTextChange: PropTypes.Requireable<(...args: any[]) => any>;
3638
- isLoading: PropTypes.Requireable<boolean>;
3639
- navigationTitle: PropTypes.Requireable<string>;
3640
- actions: PropTypes.Requireable<PropTypes.ReactNodeLike>;
3641
- };
3642
- var displayName: string;
3643
- }
3644
-
3645
- export declare namespace List {
3646
- /**
3647
- * A view to display when there aren't any items available. Use to greet users with a friendly message if the
3648
- * extension requires user input before it can show any list items e.g. when searching for a package, an article etc.
3649
- *
3650
- * @remarks
3651
- * Raycast provides a default `EmptyView` that will be displayed if the {@link List} component either has no children,
3652
- * or if it has children, but none of them match the query in the search bar. This too can be overridden by passing
3653
- * an empty view alongside the other `List.Item`s.
3654
- *
3655
- * @example
3656
- * ```typescript
3657
- * import { useState } from "react";
3658
- * import { List } from "@raycast/api";
3659
- *
3660
- * export default function CommandWithCustomEmptyState() {
3661
- * const [state, setState] = useState({ searchText: "", items: [] });
3662
- *
3663
- * useEffect(() => {
3664
- * // perform an API call that eventually populates `items`.
3665
- * }, [state.searchText])
3666
- *
3667
- * return (
3668
- * <List
3669
- * onSearchTextChange={(newValue) =>
3670
- * setState((previous) => ({ ...previous, searchText: newValue }))
3671
- * }
3672
- * >
3673
- * {state.searchText === "" && state.items.length === 0 ? (
3674
- * <List.EmptyView
3675
- * icon={{ source: "https://placekitten.com/500/500" }}
3676
- * title="Type something to get started"
3677
- * />
3678
- * ) : (
3679
- * state.items.map((item) => <List.Item key={item} title={item} />)
3680
- * )}
3681
- * </List>
3682
- * );
3683
- * }
3684
- * ```
3685
- */
3686
- const EmptyView: typeof ListEmptyView;
3687
- /**
3688
- * A item in the {@link List}.
3689
- *
3690
- * @remarks
3691
- * This is one of the foundational UI components of Raycast. A list item represents a single entity. It can be a
3692
- * GitHub pull request, a file, or anything else. You most likely want to perform actions on this item, so make it clear
3693
- * to the user what this list item is about.
3694
- *
3695
- * @example
3696
- * ```typescript
3697
- * import { Icon, List } from "@raycast/api";
3698
- *
3699
- * export default function Command() {
3700
- * return (
3701
- * <List>
3702
- * <List.Item icon={Icon.Star} title="Augustiner Helles" subtitle="0,5 Liter" accessories={[{ text: "Germany" }]} />
3703
- * </List>
3704
- * );
3705
- * }
3706
- * ```
3707
- */
3708
- const Item: typeof ListItem_2;
3709
- /**
3710
- * A group of related {@link List.Item}.
3711
- *
3712
- * @remarks
3713
- * Sections are a great way to structure your list. For example, group GitHub issues with the same status and order them by priority.
3714
- * This way, users can quickly access what is most relevant.
3715
- *
3716
- * @example
3717
- * ```typescript
3718
- * import { List } from "@raycast/api";
3719
- *
3720
- * export default function Command() {
3721
- * return (
3722
- * <List>
3723
- * <List.Section title="Lager">
3724
- * <List.Item title="Camden Hells" />
3725
- * </List.Section>
3726
- * <List.Section title="IPA">
3727
- * <List.Item title="Sierra Nevada IPA" />
3728
- * </List.Section>
3729
- * </List>
3730
- * );
3731
- * }
3732
- * ```
3733
- */
3734
- const Section: typeof ListSection_2;
3735
- /**
3736
- * A dropdown menu that will be shown in the right-hand-side of the search bar.
3737
- *
3738
- * @example
3739
- * ```typescript
3740
- * import { List } from "@raycast/api";
3741
- *
3742
- * function DrinkDropdown(props: DrinkDropdownProps) {
3743
- * const { isLoading = false, drinkTypes, onDrinkTypeChange } = props;
3744
- * return (
3745
- * <List.Dropdown
3746
- * tooltip="Select Drink Type"
3747
- * disabled={isLoading}
3748
- * storeValue={true}
3749
- * onChange={(newValue) => {
3750
- * onDrinkTypeChange(newValue);
3751
- * }}
3752
- * >
3753
- * <List.Dropdown.Section title="Alcoholic Beverages">
3754
- * {drinkTypes.map((drinkType) => (
3755
- * <List.Dropdown.Item key={drinkType.id} title={drinkType.name} value={drinkType.id} />
3756
- * ))}
3757
- * </List.Dropdown.Section>
3758
- * </List.Dropdown>
3759
- * );
3760
- * }
3761
- *
3762
- * export default function Command() {
3763
- * const drinkTypes = [{ id: 1, name: 'Beer' }, { id: 2, name: 'Wine' }];
3764
- * const onDrinkTypeChange = (newValue) => {
3765
- * console.log(newValue);
3766
- * }
3767
- * return (
3768
- * <List
3769
- * navigationTitle="Search Beers"
3770
- * searchBarPlaceholder="Search your favorite drink"
3771
- * searchBarAccessory={<DrinkDropdown drinkTypes={drinkTypes} onDrinkTypeChange={onDrinkTypeChange} />}
3772
- * >
3773
- * <List.Item title="Augustiner Helles" />
3774
- * <List.Item title="Camden Hells" />
3775
- * <List.Item title="Leffe Blonde" />
3776
- * <List.Item title="Sierra Nevada IPA" />
3777
- * </List>
3778
- * );
3779
- * }
3780
- * ```
3611
+ * See {@link Detail.Metadata.Label}
3612
+ */
3613
+ declare const Label: FunctionComponent<LabelProps>;
3614
+
3615
+ declare interface LabelProps {
3616
+ /**
3617
+ * The title shown above the item.
3618
+ */
3619
+ title: string;
3620
+ /**
3621
+ * An icon to illustrate the value of the item.
3622
+ */
3623
+ icon?: Image.ImageLike | undefined | null;
3624
+ /**
3625
+ * The text value of the item.
3626
+ */
3627
+ text?: string;
3628
+ }
3629
+
3630
+ /**
3631
+ * See {@link Detail.Metadata.Link}
3632
+ */
3633
+ declare const Link: FunctionComponent<LinkProps>;
3634
+
3635
+ declare interface LinkProps {
3636
+ /**
3637
+ * The title shown above the item.
3781
3638
  */
3782
- const Dropdown: typeof ListDropdown;
3639
+ title: string;
3640
+ /**
3641
+ * The target of the link.
3642
+ */
3643
+ target: string;
3644
+ /**
3645
+ * The text value of the item.
3646
+ */
3647
+ text: string;
3648
+ }
3649
+
3650
+ /**
3651
+ * Displays {@link List.Section} or {@link List.Item}, optionally {@link List.Dropdown}.
3652
+ *
3653
+ * @remarks
3654
+ * The list uses built-in filtering by indexing the title of list items and additionally keywords.
3655
+ *
3656
+ * @example
3657
+ * ```typescript
3658
+ * import { List } from "@raycast/api";
3659
+ *
3660
+ * function DrinkDropdown(props: DrinkDropdownProps) {
3661
+ * const { isLoading = false, drinkTypes, onDrinkTypeChange } = props;
3662
+ * return (
3663
+ * <List.Dropdown
3664
+ * tooltip="Select Drink Type"
3665
+ * storeValue={true}
3666
+ * onChange={(newValue) => {
3667
+ * onDrinkTypeChange(newValue);
3668
+ * }}
3669
+ * >
3670
+ * <List.Dropdown.Section title="Alcoholic Beverages">
3671
+ * {drinkTypes.map((drinkType) => (
3672
+ * <List.Dropdown.Item key={drinkType.id} title={{ value: drinkType.name, tooltip: drinkType.definition }} value={drinkType.id} />
3673
+ * ))}
3674
+ * </List.Dropdown.Section>
3675
+ * </List.Dropdown>
3676
+ * );
3677
+ * }
3678
+ *
3679
+ * export default function Command() {
3680
+ * const drinkTypes = [
3681
+ * { id: 1, name: 'Beer', definition: "an alcoholic drink made from yeast-fermented malt flavoured with hops" },
3682
+ * { id: 2, name: 'Wine', definition: "an alcoholic drink made from fermented grape juice" }];
3683
+ * const onDrinkTypeChange = (newValue) => {
3684
+ * console.log(newValue);
3685
+ * }
3686
+ * return (
3687
+ * <List
3688
+ * navigationTitle="Search Beers"
3689
+ * searchBarPlaceholder="Search your favorite drink"
3690
+ * searchBarAccessory={<DrinkDropdown drinkTypes={drinkTypes} onDrinkTypeChange={onDrinkTypeChange} />}
3691
+ * >
3692
+ * <List.Item title="Augustiner Helles" />
3693
+ * <List.Item title="Camden Hells" />
3694
+ * <List.Item title="Leffe Blonde" />
3695
+ * <List.Item title="Sierra Nevada IPA" />
3696
+ * </List>
3697
+ * );
3698
+ * }
3699
+ * ```
3700
+ */
3701
+ export declare const List: FunctionComponent<ListProps_2> & ListMembers;
3702
+
3703
+ export declare namespace List {
3783
3704
  /**
3784
3705
  * Props of the {@link List} React component.
3785
3706
  */
3786
- export interface Props extends ActionsInterface, NavigationChildInterface {
3787
- /**
3788
- * List sections or items. If {@link List.Item} elements are specified, a default section is automatically created.
3789
- */
3790
- children?: ReactNode;
3791
- /**
3792
- * Callback triggered when the item selection in the list changes.
3793
- */
3794
- onSelectionChange?: (id?: string) => void;
3795
- /**
3796
- * {@link List.Dropdown} that will be shown in the right-hand-side of the search bar.
3797
- */
3798
- searchBarAccessory?: ReactElement<List.Dropdown.Props> | null | boolean;
3799
- /**
3800
- * The text that will be displayed in the search bar.
3801
- */
3802
- searchText?: string;
3803
- /**
3804
- * Toggles Raycast filtering. When `true`, Raycast will use the query in the search bar to filter list
3805
- * items. When `false`, the extension needs to take care of the filtering.
3806
- *
3807
- * @remarks
3808
- * Having this enabled when filtering items in the extension is unspecified behaviour.
3809
- *
3810
- * @defaultValue false when `onSearchTextChange` is specified, true otherwise.
3811
- */
3812
- enableFiltering?: boolean;
3813
- /**
3814
- * Placeholder text that will be shown in the search bar.
3815
- *
3816
- * @defaultValue Search value...
3817
- */
3818
- searchBarPlaceholder?: string;
3819
- /**
3820
- * Selects the item with the specified id.
3821
- */
3822
- selectedItemId?: string;
3823
- /**
3824
- * Defines whether the {@link List.Props.onSearchTextChange} will be triggered on every keyboard press or with a delay for throttling the events.
3825
- * Recommended to set to `true` when using custom filtering logic with asynchronous operations (e.g. network requests).
3826
- * @defaultValue false
3827
- */
3828
- throttle?: boolean;
3829
- /**
3830
- * Callback triggered when the search bar text changes.
3831
- *
3832
- * @remarks
3833
- * Specifying this implicitly toggles `enableFiltering` to false. To enable native filtering when using `onSearchTextChange`, explicitly set `enableFiltering` to true.
3834
- */
3835
- onSearchTextChange?: (text: string) => void;
3707
+ export type Props = ListProps_2;
3708
+ export namespace EmptyView {
3709
+ export type Props = EmptyViewProps;
3710
+ }
3711
+ export namespace Dropdown {
3836
3712
  /**
3837
- * Whether the List should have an area on the right side of the items to show additional details about the selected item.
3838
- *
3839
- * When true, it is recommended not to show any accessories on the `List.Item` and instead show the additional information in the `List.Item.Detail` view.
3713
+ * Props of the {@link List.Dropdown} React component.
3840
3714
  */
3841
- isShowingDetail?: boolean;
3842
- }
3843
- export namespace EmptyView {
3844
- export interface Props extends ActionsInterface {
3845
- /**
3846
- * An icon displayed in the center of the EmptyView.
3847
- *
3848
- * @remarks
3849
- * If an SVG is used, its longest side will be 128 pixels. Other images will be up/downscaled proportionally so that the longest side is between 64 and 256 pixels.
3850
- * If not specified, Raycast's default `EmptyView` icon will be used.
3851
- */
3852
- icon?: Image.ImageLike;
3715
+ export type Props = DropdownProps_2;
3716
+ export namespace Item {
3853
3717
  /**
3854
- * The main title displayed for the Empty View.
3718
+ * Props of the {@link List.Dropdown.Item} React component.
3855
3719
  */
3856
- title?: string;
3720
+ export type Props = DropdownItemProps_2;
3721
+ }
3722
+ export namespace Section {
3857
3723
  /**
3858
- * An optional description for why the empty view is shown.
3724
+ * Props of the {@link List.Dropdown.Section} React component.
3859
3725
  */
3860
- description?: string;
3726
+ export type Props = DropdownSectionProps_2;
3861
3727
  }
3862
3728
  }
3863
3729
  export namespace Item {
@@ -3877,495 +3743,175 @@ export declare namespace List {
3877
3743
  * }
3878
3744
  * ```
3879
3745
  */
3880
- export interface Accessory {
3881
- /**
3882
- * An optional text that will be used as the label.
3883
- */
3884
- text?: string;
3885
- /**
3886
- * An optional {@link Image.ImageLike} that will be used as the icon.
3887
- * @remarks
3888
- * An image will be shown in front of the text if {@link List.Item.Accessory.text} is specified.
3889
- */
3890
- icon?: Image.ImageLike;
3891
- /**
3892
- * An optional tooltip shown when the accessory is hovered.
3893
- */
3894
- tooltip?: string;
3895
- }
3746
+ export type Accessory = ItemAccessory;
3896
3747
  /**
3897
3748
  * Props of the {@link List.Item} React component.
3898
3749
  */
3899
- export interface Props extends ActionsInterface {
3900
- /**
3901
- * ID of the item.
3902
- * Make sure to assign each item a unique ID or a UUID will be auto generated.
3903
- */
3904
- id?: string;
3905
- /**
3906
- * The main title displayed for that item, optionally with a tooltip.
3907
- */
3908
- title: string | {
3909
- value: string;
3910
- tooltip: string;
3911
- };
3912
- /**
3913
- * An optional subtitle displayed next to the main title, optionally with a tooltip.
3914
- */
3915
- subtitle?: string | {
3916
- value: string;
3917
- tooltip: string;
3918
- };
3919
- /**
3920
- * An optional property used for providing additional indexable strings for search.
3921
- * When filtering the list in Raycast through the search bar, the keywords will be searched in addition to the title.
3922
- */
3923
- keywords?: string[];
3924
- /**
3925
- * An optional icon displayed for the list item.
3926
- */
3927
- icon?: Image.ImageLike | {
3928
- value: Image.ImageLike;
3929
- tooltip: string;
3930
- };
3931
- /**
3932
- * @deprecated Use `accessories={[ { icon: ... } ]}` instead.
3933
- */
3934
- accessoryIcon?: Image.ImageLike;
3935
- /**
3936
- * @deprecated Use `accessories={[ { text: ... } ]}` instead.
3937
- */
3938
- accessoryTitle?: string;
3939
- /**
3940
- * An optional array of {@link List.Item.Accessory} items displayed on the right side in a List.Item.
3941
- */
3942
- accessories?: Accessory[];
3943
- /**
3944
- * An {@link ActionPanel} that will be updated for the selected list item.
3945
- */
3946
- actions?: ReactNode | null;
3947
-
3948
- /**
3949
- * The `List.Item.Detail` to be rendered in the right side area when the parent List is showing details and the item is selected.
3950
- */
3951
- detail?: ReactNode;
3952
- }
3750
+ export type Props = ItemProps;
3953
3751
  export namespace Detail {
3954
3752
  /**
3955
3753
  * Props of the {@link List.Item.Detail} React component.
3956
3754
  */
3957
- export interface Props {
3958
- /**
3959
- * Indicates whether a loading bar should be shown or hidden above the detail
3960
- *
3961
- * @defaultValue false
3962
- */
3963
- isLoading?: boolean;
3964
- /**
3965
- * The CommonMark string to be rendered in the right side area when the parent List is showing details and the item is selected.
3966
- */
3967
- markdown?: string | null;
3968
- }
3755
+ export type Props = DetailProps_3;
3969
3756
  }
3970
3757
  }
3971
3758
  export namespace Section {
3972
3759
  /**
3973
3760
  * Props of the {@link List.Section} React component.
3974
3761
  */
3975
- export interface Props {
3976
- /**
3977
- * The {@link List.Item} elements of the section.
3978
- */
3979
- children?: ReactNode;
3980
- /**
3981
- * ID of the section.
3982
- * Make sure to assign each section a unique ID or a UUID will be auto generated.
3983
- */
3984
- id?: string;
3985
- /**
3986
- * Title displayed above the section.
3987
- */
3988
- title?: string;
3989
- /**
3990
- * An optional subtitle displayed next to the title of the section.
3991
- */
3992
- subtitle?: string;
3993
- }
3994
- }
3995
- export namespace Dropdown {
3996
- /**
3997
- * Props of the {@link List.Dropdown} React component.
3998
- */
3999
- export interface Props {
4000
- /**
4001
- * ID of the dropdown.
4002
- */
4003
- id?: string;
4004
- /**
4005
- * Tooltip displayed when hovering the dropdown.
4006
- */
4007
- tooltip: string;
4008
- /**
4009
- * Placeholder text that will be shown in the dropdown search field.
4010
- *
4011
- * @defaultValue Search...
4012
- */
4013
- placeholder?: string;
4014
- /**
4015
- * Indicates whether the value of the dropdown should be persisted after selection, and restored next time the dropdown is rendered.
4016
- */
4017
- storeValue?: boolean;
4018
- /**
4019
- * The currently value of the dropdown.
4020
- */
4021
- value?: string;
4022
- /**
4023
- * The default value of the dropdown.
4024
- * Keep in mind that `defaultValue` will be configured once per component lifecycle. This means that if a user changes the value, `defaultValue` won't be configured on re-rendering.
4025
- *
4026
- * **If you're using `storeValue` and configured it as `true` _and_ a {@link List.Dropdown.Item} with the same value exists, then it will be selected.**
4027
- *
4028
- * **If you configure `value` at the same time as `defaultValue`, the `value` will have precedence over `defaultValue`.**
4029
- */
4030
- defaultValue?: string;
4031
- /**
4032
- * List sections or items. If {@link List.Dropdown.Item} elements are specified, a default section is automatically created.
4033
- */
4034
- children?: ReactNode;
4035
- /**
4036
- * Callback triggered when the list item selection changes.
4037
- */
4038
- onChange?: (newValue: string) => void;
4039
- }
4040
- export namespace Section {
4041
- /**
4042
- * Props of the {@link List.Dropdown.Section} React component.
4043
- */
4044
- export interface Props {
4045
- /**
4046
- * The item elements of the section.
4047
- */
4048
- children?: ReactNode;
4049
- /**
4050
- * Title displayed above the section
4051
- */
4052
- title?: string;
4053
- }
4054
- }
4055
- export namespace Item {
4056
- /**
4057
- * Props of the {@link List.Dropdown.Item} React component.
4058
- */
4059
- export interface Props {
4060
- /**
4061
- * Value of the dropdown item.
4062
- * Make sure to assign each unique value for each item.
4063
- */
4064
- value: string;
4065
- /**
4066
- * The title displayed for the item.
4067
- */
4068
- title: string;
4069
- /**
4070
- * An optional icon displayed for the item.
4071
- */
4072
- icon?: Image.ImageLike;
4073
- }
4074
- }
3762
+ export type Props = SectionProps_2;
4075
3763
  }
4076
3764
  }
4077
3765
 
4078
3766
  /**
4079
- * See {@link List.Dropdown}
3767
+ * @deprecated Use {@link List.item} instead.
4080
3768
  */
4081
- declare function ListDropdown(props: List.Dropdown.Props): ReactElement<List.Dropdown.Props>;
3769
+ export declare const ListItem: typeof List.Item;
4082
3770
 
4083
- declare namespace ListDropdown {
4084
- var propTypes: {
4085
- id: PropTypes.Requireable<string>;
4086
- tooltip: PropTypes.Validator<string>;
4087
- storeValue: (props: List.Dropdown.Props, propName: keyof List.Dropdown.Props, componentName: string, location: string, propFullName: string) => Error;
4088
- value: PropTypes.Requireable<string>;
4089
- defaultValue: PropTypes.Requireable<string>;
4090
- onChange: PropTypes.Requireable<(...args: any[]) => any>;
4091
- };
4092
- var displayName: string;
3771
+ /**
3772
+ * @deprecated Use {@link List.Item.Props} instead.
3773
+ */
3774
+ export declare interface ListItemProps extends List.Item.Props {
4093
3775
  }
4094
3776
 
4095
- declare namespace ListDropdown {
3777
+ declare interface ListMembers {
4096
3778
  /**
4097
- * Visually separated group of dropdown items in a {@link List.Dropdown}.
3779
+ * A view to display when there aren't any items available. Use to greet users with a friendly message if the
3780
+ * extension requires user input before it can show any list items e.g. when searching for a package, an article etc.
4098
3781
  *
4099
3782
  * @remarks
4100
- * Use sections to group related dropdown items together.
3783
+ * Raycast provides a default `EmptyView` that will be displayed if the {@link List} component either has no children,
3784
+ * or if it has children, but none of them match the query in the search bar. This too can be overridden by passing
3785
+ * an empty view alongside the other `List.Item`s.
3786
+ *
3787
+ * @example
3788
+ * ```typescript
3789
+ * import { useState } from "react";
3790
+ * import { List } from "@raycast/api";
3791
+ *
3792
+ * export default function CommandWithCustomEmptyState() {
3793
+ * const [state, setState] = useState({ searchText: "", items: [] });
3794
+ *
3795
+ * useEffect(() => {
3796
+ * // perform an API call that eventually populates `items`.
3797
+ * }, [state.searchText])
3798
+ *
3799
+ * return (
3800
+ * <List
3801
+ * onSearchTextChange={(newValue) =>
3802
+ * setState((previous) => ({ ...previous, searchText: newValue }))
3803
+ * }
3804
+ * >
3805
+ * {state.searchText === "" && state.items.length === 0 ? (
3806
+ * <List.EmptyView
3807
+ * icon={{ source: "https://placekitten.com/500/500" }}
3808
+ * title="Type something to get started"
3809
+ * />
3810
+ * ) : (
3811
+ * state.items.map((item) => <List.Item key={item} title={item} />)
3812
+ * )}
3813
+ * </List>
3814
+ * );
3815
+ * }
3816
+ * ```
3817
+ */
3818
+ EmptyView: typeof EmptyView;
3819
+ /**
3820
+ * A item in the {@link List}.
3821
+ *
3822
+ * @remarks
3823
+ * This is one of the foundational UI components of Raycast. A list item represents a single entity. It can be a
3824
+ * GitHub pull request, a file, or anything else. You most likely want to perform actions on this item, so make it clear
3825
+ * to the user what this list item is about.
4101
3826
  *
4102
3827
  * @example
4103
3828
  * ```typescript
4104
- * import { List } from "@raycast/api";
3829
+ * import { Icon, List } from "@raycast/api";
4105
3830
  *
4106
3831
  * export default function Command() {
4107
3832
  * return (
4108
- * <List searchBarAccessory={
4109
- * <List.Dropdown tooltip="Dropdown With Sections">
4110
- * <List.Dropdown.Section title="First Section">
4111
- * <List.Dropdown.Item title="One" value="one" />
4112
- * </List.Dropdown.Section>
4113
- * <List.Dropdown.Section title="Second Section">
4114
- * <List.Dropdown.Item title="Two" value="two" />
4115
- * </List.Dropdown.Section>
4116
- * </List.Dropdown>
4117
- * }>
4118
- * <List.Item title="Item in the Main List">
3833
+ * <List>
3834
+ * <List.Item icon={Icon.Star} title="Augustiner Helles" subtitle="0,5 Liter" accessories={[{ text: "Germany" }]} />
4119
3835
  * </List>
4120
3836
  * );
4121
3837
  * }
4122
3838
  * ```
4123
3839
  */
4124
- const Section: typeof ListDropdownSection;
3840
+ Item: typeof Item;
4125
3841
  /**
4126
- * A dropdown item in a {@link List.Dropdown}
3842
+ * A group of related {@link List.Item}.
3843
+ *
3844
+ * @remarks
3845
+ * Sections are a great way to structure your list. For example, group GitHub issues with the same status and order them by priority.
3846
+ * This way, users can quickly access what is most relevant.
4127
3847
  *
4128
3848
  * @example
4129
3849
  * ```typescript
4130
3850
  * import { List } from "@raycast/api";
4131
3851
  *
4132
3852
  * export default function Command() {
4133
- * return (
4134
- * <List searchBarAccessory={
4135
- * <List.Dropdown tooltip="Dropdown With Items">
4136
- * <List.Dropdown.Item title="One" value="one" />
4137
- * <List.Dropdown.Item title="Two" value="two" />
4138
- * <List.Dropdown.Item title="Three" value="three" />
4139
- * </List.Dropdown>
4140
- * }>
4141
- * <List.Item title="Item in the Main List">
4142
- * </List>
3853
+ * return (
3854
+ * <List>
3855
+ * <List.Section title="Lager">
3856
+ * <List.Item title="Camden Hells" />
3857
+ * </List.Section>
3858
+ * <List.Section title="IPA">
3859
+ * <List.Item title="Sierra Nevada IPA" />
3860
+ * </List.Section>
3861
+ * </List>
4143
3862
  * );
4144
3863
  * }
4145
3864
  * ```
4146
3865
  */
4147
- const Item: typeof ListDropdownItem;
4148
- }
4149
-
4150
- /**
4151
- * See {@link List.Dropdown.Item}
4152
- */
4153
- declare function ListDropdownItem(props: List.Dropdown.Item.Props): ReactElement<List.Dropdown.Item.Props>;
4154
-
4155
- declare namespace ListDropdownItem {
4156
- var propTypes: {
4157
- value: PropTypes.Requireable<string>;
4158
- title: PropTypes.Validator<string>;
4159
- icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4160
- fileIcon: PropTypes.Validator<string>;
4161
- }>> | Required<PropTypes.InferProps<{
4162
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
4163
- light: PropTypes.Validator<string>;
4164
- dark: PropTypes.Validator<string>;
4165
- }>>>;
4166
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4167
- light: PropTypes.Validator<string>;
4168
- dark: PropTypes.Validator<string>;
4169
- }>>>;
4170
- mask: PropTypes.Requireable<Image.Mask>;
4171
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4172
- light: PropTypes.Validator<string>;
4173
- dark: PropTypes.Validator<string>;
4174
- adjustContrast: PropTypes.Requireable<boolean>;
4175
- }>>>;
4176
- }>>>;
4177
- };
4178
- var displayName: string;
4179
- }
4180
-
4181
- /**
4182
- * See {@link List.Dropdown.Section}
4183
- */
4184
- declare function ListDropdownSection(props: List.Dropdown.Section.Props): ReactElement<List.Dropdown.Section.Props>;
4185
-
4186
- declare namespace ListDropdownSection {
4187
- var propTypes: {
4188
- title: PropTypes.Requireable<string>;
4189
- };
4190
- var displayName: string;
4191
- }
4192
-
4193
- declare function ListEmptyView(props: List.EmptyView.Props): ReactElement<List.EmptyView.Props>;
4194
-
4195
- declare namespace ListEmptyView {
4196
- var propTypes: {
4197
- id: PropTypes.Requireable<string>;
4198
- icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4199
- fileIcon: PropTypes.Validator<string>;
4200
- }>> | Required<PropTypes.InferProps<{
4201
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
4202
- light: PropTypes.Validator<string>;
4203
- dark: PropTypes.Validator<string>;
4204
- }>>>;
4205
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4206
- light: PropTypes.Validator<string>;
4207
- dark: PropTypes.Validator<string>;
4208
- }>>>;
4209
- mask: PropTypes.Requireable<Image.Mask>;
4210
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4211
- light: PropTypes.Validator<string>;
4212
- dark: PropTypes.Validator<string>;
4213
- adjustContrast: PropTypes.Requireable<boolean>;
4214
- }>>>;
4215
- }>>>;
4216
- title: PropTypes.Requireable<string>;
4217
- description: PropTypes.Requireable<string>;
4218
- actions: PropTypes.Requireable<PropTypes.ReactNodeLike>;
4219
- };
4220
- var displayName: string;
4221
- }
4222
-
4223
- /**
4224
- * @deprecated Use {@link List.item} instead.
4225
- */
4226
- export declare const ListItem: typeof List.Item;
4227
-
4228
- /**
4229
- * See {@link List.Item}
4230
- */
4231
- declare function ListItem_2(props: List.Item.Props): ReactElement<List.Item.Props>;
4232
-
4233
- declare namespace ListItem_2 {
4234
- var propTypes: {
4235
- id: PropTypes.Requireable<string>;
4236
- title: PropTypes.Validator<string | Required<PropTypes.InferProps<{
4237
- value: PropTypes.Validator<string>;
4238
- tooltip: PropTypes.Validator<string>;
4239
- }>>>;
4240
- subtitle: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4241
- value: PropTypes.Validator<string>;
4242
- tooltip: PropTypes.Validator<string>;
4243
- }>>>;
4244
- keywords: PropTypes.Requireable<string[]>;
4245
- icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4246
- fileIcon: PropTypes.Validator<string>;
4247
- }>> | Required<PropTypes.InferProps<{
4248
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
4249
- light: PropTypes.Validator<string>;
4250
- dark: PropTypes.Validator<string>;
4251
- }>>>;
4252
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4253
- light: PropTypes.Validator<string>;
4254
- dark: PropTypes.Validator<string>;
4255
- }>>>;
4256
- mask: PropTypes.Requireable<Image.Mask>;
4257
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4258
- light: PropTypes.Validator<string>;
4259
- dark: PropTypes.Validator<string>;
4260
- adjustContrast: PropTypes.Requireable<boolean>;
4261
- }>>>;
4262
- }>> | Required<PropTypes.InferProps<{
4263
- value: PropTypes.Validator<string | Required<PropTypes.InferProps<{
4264
- fileIcon: PropTypes.Validator<string>;
4265
- }>> | Required<PropTypes.InferProps<{
4266
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
4267
- light: PropTypes.Validator<string>;
4268
- dark: PropTypes.Validator<string>;
4269
- }>>>;
4270
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4271
- light: PropTypes.Validator<string>;
4272
- dark: PropTypes.Validator<string>;
4273
- }>>>;
4274
- mask: PropTypes.Requireable<Image.Mask>;
4275
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4276
- light: PropTypes.Validator<string>;
4277
- dark: PropTypes.Validator<string>;
4278
- adjustContrast: PropTypes.Requireable<boolean>;
4279
- }>>>;
4280
- }>>>;
4281
- tooltip: PropTypes.Validator<string>;
4282
- }>>>;
4283
- accessoryTitle: PropTypes.Requireable<string>;
4284
- accessoryIcon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4285
- fileIcon: PropTypes.Validator<string>;
4286
- }>> | Required<PropTypes.InferProps<{
4287
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
4288
- light: PropTypes.Validator<string>;
4289
- dark: PropTypes.Validator<string>;
4290
- }>>>;
4291
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4292
- light: PropTypes.Validator<string>;
4293
- dark: PropTypes.Validator<string>;
4294
- }>>>;
4295
- mask: PropTypes.Requireable<Image.Mask>;
4296
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4297
- light: PropTypes.Validator<string>;
4298
- dark: PropTypes.Validator<string>;
4299
- adjustContrast: PropTypes.Requireable<boolean>;
4300
- }>>>;
4301
- }>>>;
4302
- accessories: PropTypes.Requireable<Required<PropTypes.InferProps<{
4303
- text: PropTypes.Requireable<string>;
4304
- icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4305
- fileIcon: PropTypes.Validator<string>;
4306
- }>> | Required<PropTypes.InferProps<{
4307
- source: PropTypes.Validator<string | Required<PropTypes.InferProps<{
4308
- light: PropTypes.Validator<string>;
4309
- dark: PropTypes.Validator<string>;
4310
- }>>>;
4311
- fallback: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4312
- light: PropTypes.Validator<string>;
4313
- dark: PropTypes.Validator<string>;
4314
- }>>>;
4315
- mask: PropTypes.Requireable<Image.Mask>;
4316
- tintColor: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
4317
- light: PropTypes.Validator<string>;
4318
- dark: PropTypes.Validator<string>;
4319
- adjustContrast: PropTypes.Requireable<boolean>;
4320
- }>>>;
4321
- }>>>;
4322
- tooltip: PropTypes.Requireable<string>;
4323
- }>>[]>;
4324
- };
4325
- var displayName: string;
4326
- }
4327
-
4328
- declare namespace ListItem_2 {
3866
+ Section: typeof Section_2;
4329
3867
  /**
4330
- * A Detail view that will be shown in the right-hand-side of the List.
3868
+ * A dropdown menu that will be shown in the right-hand-side of the search bar.
4331
3869
  *
4332
3870
  * @example
4333
3871
  * ```typescript
4334
3872
  * import { List } from "@raycast/api";
4335
3873
  *
3874
+ * function DrinkDropdown(props: DrinkDropdownProps) {
3875
+ * const { isLoading = false, drinkTypes, onDrinkTypeChange } = props;
3876
+ * return (
3877
+ * <List.Dropdown
3878
+ * tooltip="Select Drink Type"
3879
+ * disabled={isLoading}
3880
+ * storeValue={true}
3881
+ * onChange={(newValue) => {
3882
+ * onDrinkTypeChange(newValue);
3883
+ * }}
3884
+ * >
3885
+ * <List.Dropdown.Section title="Alcoholic Beverages">
3886
+ * {drinkTypes.map((drinkType) => (
3887
+ * <List.Dropdown.Item key={drinkType.id} title={drinkType.name} value={drinkType.id} />
3888
+ * ))}
3889
+ * </List.Dropdown.Section>
3890
+ * </List.Dropdown>
3891
+ * );
3892
+ * }
3893
+ *
4336
3894
  * export default function Command() {
3895
+ * const drinkTypes = [{ id: 1, name: 'Beer' }, { id: 2, name: 'Wine' }];
3896
+ * const onDrinkTypeChange = (newValue) => {
3897
+ * console.log(newValue);
3898
+ * }
4337
3899
  * return (
4338
- * <List isShowingDetail>
4339
- * <List.Item
4340
- * title="Pikachu"
4341
- * subtitle="Electric"
4342
- * detail={<List.Item.Detail markdown="![Illustration](https://raw.githubusercontent.com/PokeAPI/sprites/master/sprites/pokemon/25.png)" />}
4343
- * />
3900
+ * <List
3901
+ * navigationTitle="Search Beers"
3902
+ * searchBarPlaceholder="Search your favorite drink"
3903
+ * searchBarAccessory={<DrinkDropdown drinkTypes={drinkTypes} onDrinkTypeChange={onDrinkTypeChange} />}
3904
+ * >
3905
+ * <List.Item title="Augustiner Helles" />
3906
+ * <List.Item title="Camden Hells" />
3907
+ * <List.Item title="Leffe Blonde" />
3908
+ * <List.Item title="Sierra Nevada IPA" />
4344
3909
  * </List>
4345
3910
  * );
4346
3911
  * }
4347
3912
  * ```
4348
3913
  */
4349
- const Detail: typeof ListItemDetail;
4350
- }
4351
-
4352
- /**
4353
- * See {@link List.Item.Detail}
4354
- */
4355
- declare function ListItemDetail(props: List.Item.Detail.Props): ReactElement<List.Item.Detail.Props>;
4356
-
4357
- declare namespace ListItemDetail {
4358
- var propTypes: {
4359
- isLoading: PropTypes.Requireable<boolean>;
4360
- markdown: PropTypes.Requireable<string>;
4361
- };
4362
- var displayName: string;
4363
- }
4364
-
4365
- /**
4366
- * @deprecated Use {@link List.Item.Props} instead.
4367
- */
4368
- export declare interface ListItemProps extends List.Item.Props {
3914
+ Dropdown: typeof Dropdown_2;
4369
3915
  }
4370
3916
 
4371
3917
  /**
@@ -4374,25 +3920,69 @@ export declare interface ListItemProps extends List.Item.Props {
4374
3920
  export declare interface ListProps extends List.Props {
4375
3921
  }
4376
3922
 
3923
+ declare interface ListProps_2 extends ActionsInterface, NavigationChildInterface {
3924
+ /**
3925
+ * List sections or items. If {@link List.Item} elements are specified, a default section is automatically created.
3926
+ */
3927
+ children?: ReactNode;
3928
+ /**
3929
+ * Callback triggered when the item selection in the list changes.
3930
+ */
3931
+ onSelectionChange?: (id?: string) => void;
3932
+ /**
3933
+ * {@link List.Dropdown} that will be shown in the right-hand-side of the search bar.
3934
+ */
3935
+ searchBarAccessory?: ReactElement<DropdownProps_2> | undefined | null;
3936
+ /**
3937
+ * The text that will be displayed in the search bar.
3938
+ */
3939
+ searchText?: string;
3940
+ /**
3941
+ * Toggles Raycast filtering. When `true`, Raycast will use the query in the search bar to filter list
3942
+ * items. When `false`, the extension needs to take care of the filtering.
3943
+ *
3944
+ * @remarks
3945
+ * Having this enabled when filtering items in the extension is unspecified behaviour.
3946
+ *
3947
+ * @defaultValue false when `onSearchTextChange` is specified, true otherwise.
3948
+ */
3949
+ enableFiltering?: boolean;
3950
+ /**
3951
+ * Placeholder text that will be shown in the search bar.
3952
+ *
3953
+ * @defaultValue Search value...
3954
+ */
3955
+ searchBarPlaceholder?: string;
3956
+ /**
3957
+ * Selects the item with the specified id.
3958
+ */
3959
+ selectedItemId?: string;
3960
+ /**
3961
+ * Defines whether the {@link List.Props.onSearchTextChange} will be triggered on every keyboard press or with a delay for throttling the events.
3962
+ * Recommended to set to `true` when using custom filtering logic with asynchronous operations (e.g. network requests).
3963
+ * @defaultValue false
3964
+ */
3965
+ throttle?: boolean;
3966
+ /**
3967
+ * Callback triggered when the search bar text changes.
3968
+ *
3969
+ * @remarks
3970
+ * Specifying this implicitly toggles `enableFiltering` to false. To enable native filtering when using `onSearchTextChange`, explicitly set `enableFiltering` to true.
3971
+ */
3972
+ onSearchTextChange?: (text: string) => void;
3973
+ /**
3974
+ * Whether the List should have an area on the right side of the items to show additional details about the selected item.
3975
+ *
3976
+ * When true, it is recommended not to show any accessories on the `List.Item` and instead show the additional information in the `List.Item.Detail` view.
3977
+ */
3978
+ isShowingDetail?: boolean;
3979
+ }
3980
+
4377
3981
  /**
4378
3982
  * @deprecated Use {@link List.Section} instead.
4379
3983
  */
4380
3984
  export declare const ListSection: typeof List.Section;
4381
3985
 
4382
- /**
4383
- * See {@link List.Section}
4384
- */
4385
- declare function ListSection_2(props: List.Section.Props): ReactElement<List.Section.Props>;
4386
-
4387
- declare namespace ListSection_2 {
4388
- var propTypes: {
4389
- id: PropTypes.Requireable<string>;
4390
- title: PropTypes.Requireable<string>;
4391
- subtitle: PropTypes.Requireable<string>;
4392
- };
4393
- var displayName: string;
4394
- }
4395
-
4396
3986
  /**
4397
3987
  * @deprecated Use {@link List.Section.Props} instead.
4398
3988
  */
@@ -4530,6 +4120,37 @@ export declare type LocalStorageValue = LocalStorage.Value;
4530
4120
  export declare interface LocalStorageValues extends LocalStorage.Values {
4531
4121
  }
4532
4122
 
4123
+ /**
4124
+ * See {@link Detail.Metadata}
4125
+ */
4126
+ declare const Metadata: FunctionComponent<MetadataProps> & MetadataMembers;
4127
+
4128
+ declare interface MetadataMembers {
4129
+ /**
4130
+ * A single value with an optional icon.
4131
+ */
4132
+ Label: typeof Label;
4133
+ /**
4134
+ * A metadata item that shows a separator line. Use it for grouping and visually separating metadata items.
4135
+ */
4136
+ Separator: typeof Separator_2;
4137
+ /**
4138
+ * An item to display a link.
4139
+ */
4140
+ Link: typeof Link;
4141
+ /**
4142
+ * A list of {@link Detail.Metadata.TagList.Item} displayed in a row.
4143
+ */
4144
+ TagList: typeof TagList;
4145
+ }
4146
+
4147
+ declare interface MetadataProps {
4148
+ /**
4149
+ * The Detail.Metadata.Item elements of the Metadata view.
4150
+ */
4151
+ children: ReactNode;
4152
+ }
4153
+
4533
4154
  /**
4534
4155
  * Return type of the {@link useNavigation} hook to perform push and pop actions.
4535
4156
  */
@@ -4689,7 +4310,7 @@ export declare namespace OAuth {
4689
4310
  /**
4690
4311
  * Use this type for a URI-style app scheme that directly opens Raycast.
4691
4312
  * In the OAuth app, configure `com.raycast:/oauth?package_name=Extension`
4692
- * (Note the single slash Google, for example, would require this flavor for an OAuth app where the Bundle ID is `com.raycast`)
4313
+ * (Note the single slash - Google, for example, would require this flavor for an OAuth app where the Bundle ID is `com.raycast`)
4693
4314
  */
4694
4315
  AppURI = "appURI"
4695
4316
  }
@@ -4804,6 +4425,7 @@ export declare namespace OAuth {
4804
4425
  updatedAt: Date;
4805
4426
  /**
4806
4427
  * A convenience method for checking whether the access token has expired.
4428
+ * The method factors in some seconds of "buffer", so it returns true a couple of seconds before the actual expiration time.
4807
4429
  * This requires the `expiresIn` parameter to be set.
4808
4430
  */
4809
4431
  isExpired(): boolean;
@@ -4862,100 +4484,50 @@ export declare namespace OAuth {
4862
4484
  }
4863
4485
 
4864
4486
  /**
4865
- * Opens a target with the default application or specified application.
4866
- *
4867
- * @param target - The file, folder or URL to open.
4868
- * @param application - The application name to use for opening the file. If no application is specified, the default application as determined by the system
4869
- * is used to open the specified file. Note that you can use the application name, app identifier, or absolute path to the app.
4870
- * @returns A Promise that resolves when the target has been opened.
4871
- *
4872
- * @example
4873
- * ```typescript
4874
- * import { open } from "@raycast/api";
4875
- *
4876
- * export default async () => {
4877
- * await open("https://www.raycast.com", "com.google.Chrome");
4878
- * };
4879
- * ```
4880
- */
4881
- export declare function open(target: string, application?: Application | string): Promise<void>;
4882
-
4883
- /**
4884
- * @deprecated Use {@link Action.Open} instead.
4885
- */
4886
- export declare const OpenAction: OpenAction_2;
4887
-
4888
- /**
4889
- * See {@link Action.Open}
4890
- */
4891
- declare function OpenAction_2(props: OpenActionProps_2): ReactElement<OpenActionProps_2>;
4892
-
4893
- declare namespace OpenAction_2 {
4894
- var displayName: string;
4895
- }
4896
-
4897
- /**
4898
- * @deprecated Use {@link Action.Open.Props} instead.
4899
- */
4900
- export declare interface OpenActionProps extends Action.Open.Props {
4901
- }
4902
-
4903
- /**
4904
- * See {@link Action.Open.Props}
4905
- */
4906
- declare interface OpenActionProps_2 {
4907
- /**
4908
- * The file, folder or URL to open.
4909
- */
4910
- target: string;
4911
- /**
4912
- * The application name to use for opening the file.
4913
- *
4914
- * @remarks
4915
- * If no application is specified, the default application as determined by the system is used to open the
4916
- * specified file. Note that you can use the application name, app identifier, or absolute path to the app.
4917
- */
4918
- application?: Application | string;
4919
- /**
4920
- * The title for the action.
4921
- */
4922
- title: string;
4923
- /**
4924
- * The icon displayed for the action.
4925
- * @defaultValue {@link Icon.Finder}
4926
- */
4927
- icon?: Image.ImageLike;
4928
- /**
4929
- * The keyboard shortcut for the action.
4930
- */
4931
- shortcut?: Keyboard.Shortcut;
4932
- /**
4933
- * Callback when the file or folder was opened.
4934
- *
4935
- * @remarks
4936
- * This is handy when you want to act on an opened file or folder, e.g. store a history of opened items.
4937
- */
4938
- onOpen?: (target: string) => void;
4939
- }
4940
-
4941
- /**
4942
- * @deprecated Use {@link Action.OpenInBrowser} instead.
4487
+ * See {@link Action.Open}
4943
4488
  */
4944
- export declare const OpenInBrowserAction: OpenInBrowserAction_2;
4489
+ declare const Open: FunctionComponent<OpenProps>;
4945
4490
 
4946
4491
  /**
4947
- * See {@link Action.OpenInBrowser}
4492
+ * Opens a target with the default application or specified application.
4493
+ *
4494
+ * @param target - The file, folder or URL to open.
4495
+ * @param application - The application name to use for opening the file. If no application is specified, the default application as determined by the system
4496
+ * is used to open the specified file. Note that you can use the application name, app identifier, or absolute path to the app.
4497
+ * @returns A Promise that resolves when the target has been opened.
4498
+ *
4499
+ * @example
4500
+ * ```typescript
4501
+ * import { open } from "@raycast/api";
4502
+ *
4503
+ * export default async () => {
4504
+ * await open("https://www.raycast.com", "com.google.Chrome");
4505
+ * };
4506
+ * ```
4948
4507
  */
4949
- declare function OpenInBrowserAction_2(props: OpenInBrowserActionProps_2): ReactElement<OpenInBrowserActionProps_2>;
4508
+ export declare function open(target: string, application?: Application | string): Promise<void>;
4950
4509
 
4951
- declare namespace OpenInBrowserAction_2 {
4952
- var displayName: string;
4953
- }
4510
+ /**
4511
+ * @deprecated Use {@link Action.Open} instead.
4512
+ */
4513
+ export declare const OpenAction: FunctionComponent<OpenProps>;
4954
4514
 
4955
- declare namespace OpenInBrowserAction_2 {
4956
- type Props = OpenInBrowserActionProps_2;
4515
+ /**
4516
+ * @deprecated Use {@link Action.Open.Props} instead.
4517
+ */
4518
+ export declare interface OpenActionProps extends Action.Open.Props {
4957
4519
  }
4958
4520
 
4521
+ /**
4522
+ * See {@link Action.OpenInBrowser}
4523
+ */
4524
+ declare const OpenInBrowser: FunctionComponent<OpenInBrowserProps>;
4525
+
4526
+ /**
4527
+ * @deprecated Use {@link Action.OpenInBrowser} instead.
4528
+ */
4529
+ export declare const OpenInBrowserAction: FunctionComponent<OpenInBrowserProps>;
4530
+
4959
4531
  /**
4960
4532
  * @deprecated Use {@link Action.OpenInBrowser.Props} instead.
4961
4533
  */
@@ -4965,7 +4537,7 @@ export declare interface OpenInBrowserActionProps extends Action.OpenInBrowser.P
4965
4537
  /**
4966
4538
  * See {@link Action.OpenInBrowser.Props}
4967
4539
  */
4968
- declare interface OpenInBrowserActionProps_2 {
4540
+ declare interface OpenInBrowserProps {
4969
4541
  /**
4970
4542
  * The URL to open.
4971
4543
  */
@@ -4994,18 +4566,52 @@ declare interface OpenInBrowserActionProps_2 {
4994
4566
  }
4995
4567
 
4996
4568
  /**
4997
- * @deprecated Use {@link Action.OpenWith} instead.
4569
+ * See {@link Action.Open.Props}
4998
4570
  */
4999
- export declare const OpenWithAction: OpenWithAction_2;
4571
+ declare interface OpenProps {
4572
+ /**
4573
+ * The file, folder or URL to open.
4574
+ */
4575
+ target: string;
4576
+ /**
4577
+ * The application name to use for opening the file.
4578
+ *
4579
+ * @remarks
4580
+ * If no application is specified, the default application as determined by the system is used to open the
4581
+ * specified file. Note that you can use the application name, app identifier, or absolute path to the app.
4582
+ */
4583
+ application?: Application | string;
4584
+ /**
4585
+ * The title for the action.
4586
+ */
4587
+ title: string;
4588
+ /**
4589
+ * The icon displayed for the action.
4590
+ * @defaultValue {@link Icon.Finder}
4591
+ */
4592
+ icon?: Image.ImageLike;
4593
+ /**
4594
+ * The keyboard shortcut for the action.
4595
+ */
4596
+ shortcut?: Keyboard.Shortcut;
4597
+ /**
4598
+ * Callback when the file or folder was opened.
4599
+ *
4600
+ * @remarks
4601
+ * This is handy when you want to act on an opened file or folder, e.g. store a history of opened items.
4602
+ */
4603
+ onOpen?: (target: string) => void;
4604
+ }
5000
4605
 
5001
4606
  /**
5002
4607
  * See {@link Action.OpenWith}
5003
4608
  */
5004
- declare function OpenWithAction_2(props: OpenWithActionProps_2): ReactElement<OpenWithActionProps_2>;
4609
+ declare const OpenWith: FunctionComponent<OpenWithProps>;
5005
4610
 
5006
- declare namespace OpenWithAction_2 {
5007
- var displayName: string;
5008
- }
4611
+ /**
4612
+ * @deprecated Use {@link Action.OpenWith} instead.
4613
+ */
4614
+ export declare const OpenWithAction: FunctionComponent<OpenWithProps>;
5009
4615
 
5010
4616
  /**
5011
4617
  * @deprecated Use {@link Action.OpenWith.Props} instead.
@@ -5016,7 +4622,7 @@ export declare interface OpenWithActionProps extends Action.OpenWith.Props {
5016
4622
  /**
5017
4623
  * See {@link Action.OpenWith.Props}
5018
4624
  */
5019
- declare interface OpenWithActionProps_2 {
4625
+ declare interface OpenWithProps {
5020
4626
  /**
5021
4627
  * The path to open.
5022
4628
  */
@@ -5065,18 +4671,14 @@ declare interface PasswordFieldProps extends FormItemProps_2<string> {
5065
4671
  declare type PasswordFieldRef = FormItemRef;
5066
4672
 
5067
4673
  /**
5068
- * @deprecated Use {@link Action.Paste} instead.
4674
+ * See {@link Action.Paste.Props}
5069
4675
  */
5070
- export declare const PasteAction: PasteAction_2;
4676
+ declare const Paste: FunctionComponent<PasteProps>;
5071
4677
 
5072
4678
  /**
5073
- * See {@link Action.Paste.Props}
4679
+ * @deprecated Use {@link Action.Paste} instead.
5074
4680
  */
5075
- declare function PasteAction_2(props: PasteActionProps_2): ReactElement<PasteActionProps_2>;
5076
-
5077
- declare namespace PasteAction_2 {
5078
- var displayName: string;
5079
- }
4681
+ export declare const PasteAction: FunctionComponent<PasteProps>;
5080
4682
 
5081
4683
  /**
5082
4684
  * @deprecated Use {@link Action.Paste.Props} instead.
@@ -5087,7 +4689,7 @@ export declare interface PasteActionProps extends Action.Paste.Props {
5087
4689
  /**
5088
4690
  * See {@link Action.Paste.Props}
5089
4691
  */
5090
- declare interface PasteActionProps_2 {
4692
+ declare interface PasteProps {
5091
4693
  /**
5092
4694
  * The contents that will be written to the clipboard as string.
5093
4695
  */
@@ -5148,7 +4750,7 @@ export declare function popToRoot(options?: {
5148
4750
  }): Promise<void>;
5149
4751
 
5150
4752
  /**
5151
- * @deprecated Use {@link getPreferenceValues()} instead.
4753
+ * @deprecated Use {@link getPreferenceValues} instead.
5152
4754
  */
5153
4755
  export declare interface Preference extends Preference_2 {
5154
4756
  }
@@ -5220,12 +4822,12 @@ declare interface Preference_2 {
5220
4822
  }
5221
4823
 
5222
4824
  /**
5223
- * @deprecated Use {@link getPreferenceValues()} instead.
4825
+ * @deprecated Use {@link getPreferenceValues} instead.
5224
4826
  */
5225
4827
  export declare type Preferences = Preferences_2;
5226
4828
 
5227
4829
  /**
5228
- * @deprecated Use {@link getPreferenceValues()} instead.
4830
+ * @deprecated Use {@link getPreferenceValues} instead.
5229
4831
  */
5230
4832
  export declare const preferences: Preferences_2;
5231
4833
 
@@ -5242,18 +4844,14 @@ export declare interface PreferenceValues {
5242
4844
  }
5243
4845
 
5244
4846
  /**
5245
- * @deprecated Use {@link Action.Push} instead.
4847
+ * See {@link Action.Push.Props}
5246
4848
  */
5247
- export declare const PushAction: PushAction_2;
4849
+ declare const Push: FunctionComponent<PushProps>;
5248
4850
 
5249
4851
  /**
5250
- * See {@link Action.Push.Props}
4852
+ * @deprecated Use {@link Action.Push} instead.
5251
4853
  */
5252
- declare function PushAction_2(props: PushActionProps_2): ReactElement<PushActionProps_2>;
5253
-
5254
- declare namespace PushAction_2 {
5255
- var displayName: string;
5256
- }
4854
+ export declare const PushAction: FunctionComponent<PushProps>;
5257
4855
 
5258
4856
  /**
5259
4857
  * @deprecated Use {@link Action.Push.Props} instead.
@@ -5264,7 +4862,7 @@ export declare interface PushActionProps extends Action.Push.Props {
5264
4862
  /**
5265
4863
  * See {@link Action.Push.Props}
5266
4864
  */
5267
- declare interface PushActionProps_2 {
4865
+ declare interface PushProps {
5268
4866
  /**
5269
4867
  * The title displayed for the item.
5270
4868
  */
@@ -5308,7 +4906,7 @@ declare interface Quicklink {
5308
4906
  /**
5309
4907
  * @deprecated Add `nanoid` as a dependency and use it instead.
5310
4908
  */
5311
- export declare const randomId: typeof randomId_2;
4909
+ export declare const randomId: any;
5312
4910
 
5313
4911
  /**
5314
4912
  * @deprecated Use {@link LocalStorage.removeItem} instead
@@ -5318,19 +4916,73 @@ export declare const removeLocalStorageItem: typeof LocalStorage.removeItem;
5318
4916
  /**
5319
4917
  * @deprecated Use `export default function Command() { ... }` instead
5320
4918
  */
5321
- export declare const render: typeof render_2;
4919
+ export declare const render: any;
4920
+
4921
+ /**
4922
+ * See {@link ActionPanel.Section}
4923
+ */
4924
+ declare const Section: FunctionComponent<SectionProps>;
4925
+
4926
+ /**
4927
+ * See {@link List.Section}
4928
+ */
4929
+ declare const Section_2: FunctionComponent<SectionProps_2>;
4930
+
4931
+ declare type SectionChildren = ReactElement<ActionProps> | ReactElement<ActionProps>[] | ReactElement<SubmenuProps> | Array<ReactElement<SubmenuProps>> | Array<ReactElement<SubmenuProps> | ReactElement<ActionProps>> | null;
4932
+
4933
+ /**
4934
+ * See {@link ActionPanel.Section}.
4935
+ */
4936
+ declare interface SectionProps {
4937
+ /**
4938
+ * The item elements of the section.
4939
+ */
4940
+ children?: ReactNode;
4941
+ /**
4942
+ * Title displayed above the section
4943
+ */
4944
+ title?: string;
4945
+ }
4946
+
4947
+ declare interface SectionProps_2 {
4948
+ /**
4949
+ * The {@link List.Item} elements of the section.
4950
+ */
4951
+ children?: ReactNode;
4952
+ /**
4953
+ * ID of the section.
4954
+ * @deprecated - This is an internal prop which not not have been exposed. You can safely remove it.
4955
+ */
4956
+ id?: string;
4957
+ /**
4958
+ * Title displayed above the section.
4959
+ */
4960
+ title?: string;
4961
+ /**
4962
+ * An optional subtitle displayed next to the title of the section.
4963
+ */
4964
+ subtitle?: string;
4965
+ }
5322
4966
 
5323
4967
  /**
5324
4968
  * See {@link Form.Separator}
5325
4969
  */
5326
4970
  declare const Separator: FunctionComponent<SeparatorProps>;
5327
4971
 
4972
+ /**
4973
+ * See {@link Detail.Metadata.Separator}
4974
+ */
4975
+ declare const Separator_2: FunctionComponent<SeparatorProps_2>;
4976
+
5328
4977
  /**
5329
4978
  * See {@link Form.Separator.Props}
5330
4979
  */
5331
4980
  declare interface SeparatorProps {
5332
4981
  }
5333
4982
 
4983
+ declare interface SeparatorProps_2 {
4984
+ }
4985
+
5334
4986
  /**
5335
4987
  * @deprecated Use {@link LocalStorage.setItem} instead
5336
4988
  */
@@ -5353,6 +5005,11 @@ export declare const setLocalStorageItem: typeof LocalStorage.setItem;
5353
5005
  */
5354
5006
  export declare function showHUD(title: string): Promise<void>;
5355
5007
 
5008
+ /**
5009
+ * See {@link Action.ShowInFinder.Props}
5010
+ */
5011
+ declare const ShowInFinder: FunctionComponent<ShowInFinderProps>;
5012
+
5356
5013
  /**
5357
5014
  * Utils
5358
5015
  */
@@ -5375,16 +5032,7 @@ export declare function showInFinder(path: PathLike): Promise<void>;
5375
5032
  /**
5376
5033
  * @deprecated Use {@link Action.ShowInFinder} instead.
5377
5034
  */
5378
- export declare const ShowInFinderAction: ShowInFinderAction_2;
5379
-
5380
- /**
5381
- * See {@link Action.ShowInFinder.Props}
5382
- */
5383
- declare function ShowInFinderAction_2(props: ShowInFinderActionProps_2): ReactElement<ShowInFinderActionProps_2>;
5384
-
5385
- declare namespace ShowInFinderAction_2 {
5386
- var displayName: string;
5387
- }
5035
+ export declare const ShowInFinderAction: FunctionComponent<ShowInFinderProps>;
5388
5036
 
5389
5037
  /**
5390
5038
  * @deprecated Use {@link Action.ShowInFinder.Props} instead.
@@ -5395,7 +5043,7 @@ export declare interface ShowInFinderActionProps extends Action.ShowInFinder.Pro
5395
5043
  /**
5396
5044
  * See {@link Action.ShowInFinder.Props}
5397
5045
  */
5398
- declare interface ShowInFinderActionProps_2 {
5046
+ declare interface ShowInFinderProps {
5399
5047
  /**
5400
5048
  * The path to open.
5401
5049
  */
@@ -5489,21 +5137,68 @@ declare interface Snippet {
5489
5137
  /**
5490
5138
  * @deprecated Use the key directly
5491
5139
  */
5492
- export declare const specialKeys: Record<string, string>;
5140
+ export declare const specialKeys: any;
5493
5141
 
5494
5142
  /**
5495
- * @deprecated Use {@link Action.SubmitForm} instead.
5143
+ * See {@link ActionPanel.Submenu}
5144
+ */
5145
+ declare const Submenu: FunctionComponent<SubmenuProps>;
5146
+
5147
+ declare type SubmenuChildren = ReactElement<SectionProps> | ReactElement<SectionProps>[] | SectionChildren | null;
5148
+
5149
+ /**
5150
+ * See {@link ActionPanel.Submenu.Props}.
5496
5151
  */
5497
- export declare const SubmitFormAction: SubmitFormAction_2;
5152
+ declare interface SubmenuProps {
5153
+ /**
5154
+ * ID of the submenu.
5155
+ * @deprecated - This is an internal prop which not not have been exposed. You can safely remove it.
5156
+ */
5157
+ id?: string;
5158
+ /**
5159
+ * The title displayed for submenu.
5160
+ */
5161
+ title: string;
5162
+ /**
5163
+ * The icon displayed for the submenu.
5164
+ */
5165
+ icon?: Image.ImageLike;
5166
+ /**
5167
+ * The keyboard shortcut for the submenu.
5168
+ */
5169
+ shortcut?: Keyboard.Shortcut;
5170
+ /**
5171
+ * Items of the submenu.
5172
+ *
5173
+ * @example
5174
+ * ```typescript
5175
+ * <ActionPanel.Submenu title="Submenu">
5176
+ * <Action title="Just an action" />
5177
+ * </ActionPanel.Submenu>
5178
+ * ```
5179
+ *
5180
+ * @remarks
5181
+ * If {@link Action} elements are specified, a default section is automatically created.
5182
+ * Use {@link ActionPanel.Submenu} as parent when specifying sub-menu's children to make code is more readable.
5183
+ */
5184
+ children?: ReactNode;
5185
+ }
5498
5186
 
5499
5187
  /**
5500
5188
  * See {@link Action.SubmitForm.Props}
5501
5189
  */
5502
- declare function SubmitFormAction_2<Values extends Form.Values = Form.Values>(props: SubmitFormActionProps_2<Values>): ReactElement<SubmitFormActionProps_2<Values>>;
5190
+ declare const SubmitForm: {
5191
+ <T extends FormValues_2>(props: SubmitFormProps<T>): JSX.Element;
5192
+ displayName: string;
5193
+ };
5503
5194
 
5504
- declare namespace SubmitFormAction_2 {
5505
- var displayName: string;
5506
- }
5195
+ /**
5196
+ * @deprecated Use {@link Action.SubmitForm} instead.
5197
+ */
5198
+ export declare const SubmitFormAction: {
5199
+ <T extends FormValues_2>(props: SubmitFormProps<T>): JSX.Element;
5200
+ displayName: string;
5201
+ };
5507
5202
 
5508
5203
  /**
5509
5204
  * @deprecated Use {@link Action.SunmitForm.Props} instead.
@@ -5514,7 +5209,7 @@ export declare interface SubmitFormActionProps<T> extends Action.SubmitForm.Prop
5514
5209
  /**
5515
5210
  * See {@link Action.SubmitForm.Props}
5516
5211
  */
5517
- declare interface SubmitFormActionProps_2<Values> {
5212
+ declare interface SubmitFormProps<T extends Form.Values> {
5518
5213
  /**
5519
5214
  * The title displayed for the item.
5520
5215
  * @defaultValue Submit Form
@@ -5533,13 +5228,82 @@ declare interface SubmitFormActionProps_2<Values> {
5533
5228
  * Use the handler to perform custom validation logic and call other Raycast API methods.
5534
5229
  * The handler receives a the values object containing the user input.
5535
5230
  */
5536
- onSubmit?: (input: Values) => void;
5231
+ onSubmit?: (input: T) => void;
5232
+ }
5233
+
5234
+ /**
5235
+ * See {@link Detail.Metadata.TagList}
5236
+ */
5237
+ declare const TagList: FunctionComponent<TagListProps> & TagListMembers;
5238
+
5239
+ /**
5240
+ * See {@link Detail.Metadata.TagList.Item}
5241
+ */
5242
+ declare const TagListItem: FunctionComponent<TagListItemProps>;
5243
+
5244
+ declare interface TagListItemProps {
5245
+ /**
5246
+ * An optional icon in front of the text of the tag.
5247
+ */
5248
+ icon?: Image.ImageLike | undefined | null;
5249
+ /**
5250
+ * The text of the tag.
5251
+ */
5252
+ text: string;
5253
+ /**
5254
+ * Changes the text color to the provided color and sets a transparent background with the same color.
5255
+ */
5256
+ color?: Color.ColorLike | undefined | null;
5257
+ }
5258
+
5259
+ declare interface TagListMembers {
5260
+ /**
5261
+ * A Tag in a {@link Detail.Metadata.TagList}.
5262
+ */
5263
+ Item: typeof TagListItem;
5264
+ }
5265
+
5266
+ declare interface TagListProps {
5267
+ /**
5268
+ * The title shown above the item.
5269
+ */
5270
+ title: string;
5271
+ /**
5272
+ * The tags contained in the TagList.
5273
+ */
5274
+ children: ReactNode;
5537
5275
  }
5538
5276
 
5539
5277
  /**
5540
5278
  * See {@link Form.TagPicker}
5541
5279
  */
5542
- declare const TagPicker: ForwardRefExoticComponent<TagPickerProps & RefAttributes<FormItemRef>> & {
5280
+ declare const TagPicker: ForwardRefExoticComponent<TagPickerProps & RefAttributes<FormItemRef>> & TagPickerMembers;
5281
+
5282
+ /**
5283
+ * See {@link Form.TagPicker.Item}
5284
+ */
5285
+ declare const TagPickerItem: FunctionComponent<TagPickerItemProps>;
5286
+
5287
+ /**
5288
+ * See {@link Form.TagPicker.Item.Props}
5289
+ */
5290
+ declare interface TagPickerItemProps {
5291
+ /**
5292
+ * Value of the tag.
5293
+ * Make sure to assign unique value for each item.
5294
+ */
5295
+ value: string;
5296
+ /**
5297
+ * The display title of the tag.
5298
+ */
5299
+ title: string;
5300
+ /**
5301
+ * An icon to show in the tag.
5302
+ */
5303
+ icon?: Image.ImageLike;
5304
+ }
5305
+
5306
+ declare interface TagPickerMembers {
5543
5307
  /**
5544
5308
  * A tag picker item in a {@link Form.TagPicker}.
5545
5309
  *
@@ -5567,30 +5331,6 @@ declare const TagPicker: ForwardRefExoticComponent<TagPickerProps & RefAttribute
5567
5331
  * ```
5568
5332
  */
5569
5333
  Item: typeof TagPickerItem;
5570
- };
5571
-
5572
- /**
5573
- * See {@link Form.TagPicker.Item}
5574
- */
5575
- declare const TagPickerItem: FunctionComponent<TagPickerItemProps>;
5576
-
5577
- /**
5578
- * See {@link Form.TagPicker.Item.Props}
5579
- */
5580
- declare interface TagPickerItemProps {
5581
- /**
5582
- * Value of the tag.
5583
- * Make sure to assign unique value for each item.
5584
- */
5585
- value: string;
5586
- /**
5587
- * The display title of the tag.
5588
- */
5589
- title: string;
5590
- /**
5591
- * An icon to show in the tag.
5592
- */
5593
- icon?: Image.ImageLike;
5594
5334
  }
5595
5335
 
5596
5336
  /**
@@ -5795,6 +5535,11 @@ export declare interface ToastOptions extends Toast.Options {
5795
5535
  */
5796
5536
  export declare const ToastStyle: typeof Toast.Style;
5797
5537
 
5538
+ /**
5539
+ * See {@link Action.Trash}
5540
+ */
5541
+ declare const Trash: FunctionComponent<TrashProps>;
5542
+
5798
5543
  /**
5799
5544
  * Moves a file or directory to the Trash.
5800
5545
  *
@@ -5819,16 +5564,7 @@ export declare function trash(path: PathLike | PathLike[]): Promise<void>;
5819
5564
  /**
5820
5565
  * @deprecated Use {@link Action.Trash} instead.
5821
5566
  */
5822
- export declare const TrashAction: TrashAction_2;
5823
-
5824
- /**
5825
- * See {@link Action.Trash}
5826
- */
5827
- declare function TrashAction_2(props: TrashActionProps_2): ReactElement<TrashActionProps_2>;
5828
-
5829
- declare namespace TrashAction_2 {
5830
- var displayName: string;
5831
- }
5567
+ export declare const TrashAction: FunctionComponent<TrashProps>;
5832
5568
 
5833
5569
  /**
5834
5570
  * @deprecated Use {@link Action.Trash.Props} instead.
@@ -5839,7 +5575,7 @@ export declare interface TrashActionProps extends Action.Trash.Props {
5839
5575
  /**
5840
5576
  * See {@link Action.Trash.Props}
5841
5577
  */
5842
- declare interface TrashActionProps_2 {
5578
+ declare interface TrashProps {
5843
5579
  /**
5844
5580
  * The item or items to move to the trash.
5845
5581
  */
@@ -5876,7 +5612,7 @@ export declare function useActionPanel(): ActionPanelState;
5876
5612
  /**
5877
5613
  * @deprecated Use `useRef` with `nanoid`
5878
5614
  */
5879
- export declare const useId: typeof useId_2;
5615
+ export declare const useId: any;
5880
5616
 
5881
5617
  /**
5882
5618
  * A hook that lets you push and pop view components in the navigation stack.