@raycast/api 1.31.0 → 1.32.0

package/types/api/components/Form.d.ts

@@ -1,1016 +0,0 @@
-import { ReactElement, ReactNode } from "react";
-import { Image } from "../ui";
-import { ActionsInterface, NavigationChildInterface } from "./types";
-import PropTypes from "prop-types";
-/**
- * Shows a list of form items such as {@link Form.TextField}, {@link Form.Checkbox} or {@link Form.Dropdown}.
- */
-export declare function Form(props: Form.Props): ReactElement<Form.Props>;
-export declare namespace Form {
-    var propTypes: {
-        submitTitle: PropTypes.Requireable<string>;
-        navigationTitle: PropTypes.Requireable<string>;
-        isLoading: PropTypes.Requireable<boolean>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.TextField}
- */
-declare function FormTextField(props: Form.TextField.Props): ReactElement<Form.TextField.Props>;
-declare namespace FormTextField {
-    var propTypes: {
-        id: PropTypes.Validator<string>;
-        title: PropTypes.Requireable<string>;
-        storeValue: PropTypes.Requireable<boolean>;
-        value: PropTypes.Requireable<string>;
-        defaultValue: PropTypes.Requireable<string>;
-        placeholder: PropTypes.Requireable<string>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.PasswordField}
- */
-declare function FormPasswordField(props: Form.PasswordField.Props): ReactElement<Form.PasswordField.Props>;
-declare namespace FormPasswordField {
-    var propTypes: {
-        id: PropTypes.Validator<string>;
-        title: PropTypes.Requireable<string>;
-        storeValue: PropTypes.Requireable<boolean>;
-        value: PropTypes.Requireable<string>;
-        defaultValue: PropTypes.Requireable<string>;
-        placeholder: PropTypes.Requireable<string>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.TextArea}
- */
-declare function FormTextArea(props: Form.TextArea.Props): ReactElement<Form.TextArea.Props>;
-declare namespace FormTextArea {
-    var propTypes: {
-        id: PropTypes.Validator<string>;
-        title: PropTypes.Requireable<string>;
-        storeValue: PropTypes.Requireable<boolean>;
-        value: PropTypes.Requireable<string>;
-        defaultValue: PropTypes.Requireable<string>;
-        placeholder: PropTypes.Requireable<string>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.Checkbox}
- */
-declare function FormCheckbox(props: Form.Checkbox.Props): ReactElement<Form.Checkbox.Props>;
-declare namespace FormCheckbox {
-    var propTypes: {
-        id: PropTypes.Validator<string>;
-        title: PropTypes.Requireable<string>;
-        storeValue: PropTypes.Requireable<boolean>;
-        value: PropTypes.Requireable<boolean>;
-        defaultValue: PropTypes.Requireable<boolean>;
-        label: PropTypes.Requireable<string>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.DatePicker}
- */
-declare function FormDatePicker(props: Form.DatePicker.Props): ReactElement<Form.DatePicker.Props>;
-declare namespace FormDatePicker {
-    var propTypes: {
-        id: PropTypes.Validator<string>;
-        title: PropTypes.Requireable<string>;
-        storeValue: PropTypes.Requireable<boolean>;
-        value: PropTypes.Requireable<Date>;
-        defaultValue: PropTypes.Requireable<Date>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.Separator}
- */
-declare function FormSeparator(): ReactElement<Form.Separator.Props>;
-declare namespace FormSeparator {
-    var displayName: string;
-}
-/**
- * See {@link Form.Description}
- */
-declare function FormDescription(props: Form.Description.Props): ReactElement<Form.Description.Props>;
-declare namespace FormDescription {
-    var propTypes: {
-        text: PropTypes.Requireable<string>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.Dropdown}
- */
-declare function FormDropdown(props: Form.Dropdown.Props): ReactElement<Form.Dropdown.Props>;
-declare namespace FormDropdown {
-    var propTypes: {
-        id: PropTypes.Validator<string>;
-        title: PropTypes.Requireable<string>;
-        storeValue: PropTypes.Requireable<boolean>;
-        value: PropTypes.Requireable<string>;
-        defaultValue: PropTypes.Requireable<string>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.Dropdown.Section}
- */
-declare function FormDropdownSection(props: Form.Dropdown.Section.Props): ReactElement<Form.Dropdown.Section.Props>;
-declare namespace FormDropdownSection {
-    var propTypes: {
-        title: PropTypes.Requireable<string>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.Dropdown.Item}
- */
-declare function FormDropdownItem(props: Form.Dropdown.Item.Props): ReactElement<Form.Dropdown.Item.Props>;
-declare namespace FormDropdownItem {
-    var propTypes: {
-        value: PropTypes.Requireable<string>;
-        title: PropTypes.Validator<string>;
-        icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
-            fileIcon: PropTypes.Validator<string>;
-        }>> | PropTypes.InferProps<{
-            source: PropTypes.Requireable<string | PropTypes.InferProps<{
-                light: PropTypes.Validator<string>;
-                dark: PropTypes.Validator<string>;
-            }>>;
-            fallback: PropTypes.Requireable<string | PropTypes.InferProps<{
-                light: PropTypes.Validator<string>;
-                dark: PropTypes.Validator<string>;
-            }>>;
-            mask: PropTypes.Requireable<Image.Mask>;
-            tintColor: PropTypes.Requireable<string | PropTypes.InferProps<{
-                light: PropTypes.Validator<string>;
-                dark: PropTypes.Validator<string>;
-                adjustContrast: PropTypes.Requireable<boolean>;
-            }>>;
-        }>>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.TagPicker}
- */
-declare function FormTagPicker(props: Form.TagPicker.Props): ReactElement<Form.TagPicker.Props>;
-declare namespace FormTagPicker {
-    var propTypes: {
-        id: PropTypes.Validator<string>;
-        title: PropTypes.Requireable<string>;
-        storeValue: PropTypes.Requireable<boolean>;
-        placeholder: PropTypes.Requireable<string>;
-        value: PropTypes.Requireable<string[]>;
-        defaultValue: PropTypes.Requireable<string[]>;
-        onChange: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    var displayName: string;
-}
-/**
- * See {@link Form.TagPicker.Item}
- */
-declare function FormTagPickerItem(props: Form.TagPicker.Item.Props): ReactElement<Form.TagPicker.Item.Props>;
-declare namespace FormTagPickerItem {
-    var propTypes: {
-        value: PropTypes.Validator<string>;
-        title: PropTypes.Validator<string>;
-        icon: PropTypes.Requireable<string | Required<PropTypes.InferProps<{
-            fileIcon: PropTypes.Validator<string>;
-        }>> | PropTypes.InferProps<{
-            source: PropTypes.Requireable<string | PropTypes.InferProps<{
-                light: PropTypes.Validator<string>;
-                dark: PropTypes.Validator<string>;
-            }>>;
-            fallback: PropTypes.Requireable<string | PropTypes.InferProps<{
-                light: PropTypes.Validator<string>;
-                dark: PropTypes.Validator<string>;
-            }>>;
-            mask: PropTypes.Requireable<Image.Mask>;
-            tintColor: PropTypes.Requireable<string | PropTypes.InferProps<{
-                light: PropTypes.Validator<string>;
-                dark: PropTypes.Validator<string>;
-                adjustContrast: PropTypes.Requireable<boolean>;
-            }>>;
-        }>>;
-    };
-    var displayName: string;
-}
-declare namespace FormDropdown {
-    /**
-     * Visually separated group of dropdown items.
-     *
-     * @remarks
-     * Use sections to group related menu items together.
-     *
-     * @example
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Favorite" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.Dropdown id="food" title="Favorite Food">
-     *         <Form.Dropdown.Section title="Fruits">
-     *           <Form.Dropdown.Item value="apple" title="Apple" icon="🍎" />
-     *           <Form.Dropdown.Item value="banana" title="Banana" icon="🍌" />
-     *         </Form.Dropdown.Section>
-     *         <Form.Dropdown.Section title="Vegetables">
-     *           <Form.Dropdown.Item value="broccoli" title="Broccoli" icon="🥦" />
-     *           <Form.Dropdown.Item value="carrot" title="Carrot" icon="🥕" />
-     *         </Form.Dropdown.Section>
-     *       </Form.Dropdown>
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const Section: typeof FormDropdownSection;
-    /**
-     * A dropdown item in a {@link Form.Dropdown}
-     *
-     * @example
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Icon" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.Dropdown id="icon" title="Icon">
-     *         <Form.Dropdown.Item value="circle" title="Cirlce" icon={Icon.Circle} />
-     *       </Form.Dropdown>
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const Item: typeof FormDropdownItem;
-}
-declare namespace FormTagPicker {
-    /**
-     * A tag picker item in a {@link Form.TagPicker}.
-     *
-     * @example
-     * ```typescript
-     * import { ActionPanel, Color, Form, Icon, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Color" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.TagPicker id="color" title="Color">
-     *         <Form.TagPicker.Item value="red" title="Red" icon={{ source: Icon.Circle, tintColor: Color.Red }} />
-     *         <Form.TagPicker.Item value="green" title="Green" icon={{ source: Icon.Circle, tintColor: Color.Green }} />
-     *         <Form.TagPicker.Item value="blue" title="Blue" icon={{ source: Icon.Circle, tintColor: Color.Blue }} />
-     *       </Form.TagPicker>
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const Item: typeof FormTagPickerItem;
-}
-declare enum FormDatePickerType {
-    /**
-     * Only year, month, and day can be picked
-     */
-    Date = "date",
-    /**
-     * hour and second can be picked in addition to year, month and day
-     */
-    DateTime = "date_time"
-}
-declare namespace FormDatePicker {
-    /**
-     * The types of date components the user can pick
-     * * `Date` – only year, month, and day can be picked
-     * * `DateTime` – hour and second can be picked in addition to year, month and day
-     */
-    const Type: typeof FormDatePickerType;
-}
-export declare namespace Form {
-    /**
-     * @deprecated Use `Form.Dropdown.Section` instead.
-     */
-    const DropdownSection: typeof FormDropdownSection;
-    /**
-     * @deprecated Use `Form.Dropdown.Item` instead.
-     */
-    const DropdownItem: typeof FormDropdownItem;
-    /**
-     * @deprecated Use `Form.TagPicker.Item` instead.
-     */
-    const TagPickerItem: typeof FormTagPickerItem;
-    /**
-     * A form item with a text field for input.
-     *
-     * @example
-     * Uncontrolled text field
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Name" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.TextField id="name" defaultValue="Steve" />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     *
-     * @example
-     * Controlled text field
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     * import { useState } from "react";
-     *
-     * export default function Command() {
-     *   const [name, setName] = useState<string>();
-     *
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Name" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.TextField id="name" value={name} onChange={setName} />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const TextField: typeof FormTextField;
-    /**
-     * A form item with a text area for input.
-     * The item supports multiline text entry.
-     *
-     * @example
-     * Uncontrolled text area
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * const DESCRIPTION =
-     *   "We spend too much time staring at loading indicators. The Raycast team is dedicated to make everybody interact faster with their computers.";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Description" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.TextArea id="description" defaultValue={DESCRIPTION} />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     *
-     * @example
-     * Controlled text area
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     * import { useState } from "react";
-     *
-     * export default function Command() {
-     *   const [description, setDescription] = useState<string>();
-     *
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Description" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.TextArea id="description" value={description} onChange={setDescription} />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const TextArea: typeof FormTextArea;
-    /**
-     * A form item with a checkbox.
-     *
-     * @example
-     * Uncontrolled checkbox
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Answer" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.Checkbox id="answer" label="Are you happy?" defaultValue={true} />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     *
-     * @example
-     * Controlled checkbox
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     * import { useState } from "react";
-     *
-     * export default function Command() {
-     *   const [checked, setChecked] = useState(true);
-     *
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Answer" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.Checkbox id="answer" label="Do you like orange juice?" value={checked} onChange={setChecked} />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const Checkbox: typeof FormCheckbox;
-    /**
-     * A form item with a date picker.
-     *
-     * @example
-     * Uncontrolled date picker
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Form" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.DatePicker id="dateOfBirth" title="Date of Birth" defaultValue={new Date(1955, 1, 24)} />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     *
-     * @example
-     * Controlled date picker
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     * import { useState } from "react";
-     *
-     * export default function Command() {
-     *   const [date, setDate] = useState<Date>();
-     *
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Form" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.DatePicker id="launchDate" title="Launch Date" value={date} onChange={setDate} />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const DatePicker: typeof FormDatePicker;
-    /**
-     * A form item that shows a separator line.
-     * Use for grouping and visually separating form items.
-     *
-     * @example
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Form" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.TextField id="textfield" />
-     *       <Form.Separator />
-     *       <Form.TextArea id="textarea" />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const Separator: typeof FormSeparator;
-    /**
-     * A form item with a dropdown menu.
-     *
-     * @example
-     * Uncontrolled dropdown
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Favorite" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.Dropdown id="emoji" title="Favorite Emoji" defaultValue="lol">
-     *         <Form.Dropdown.Item value="poop" title="Pile of poop" icon="💩" />
-     *         <Form.Dropdown.Item value="rocket" title="Rocket" icon="🚀" />
-     *         <Form.Dropdown.Item value="lol" title="Rolling on the floor laughing face" icon="🤣" />
-     *       </Form.Dropdown>
-     *     </Form>
-     *   );
-     * }
-     * ```
-     *
-     * @example
-     * Controlled dropdown
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     * import { useState } from "react";
-     *
-     * export default function Command() {
-     *   const [programmingLanguage, setProgrammingLanguage] = useState<string>("typescript");
-     *
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Favorite" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.Dropdown
-     *         id="dropdown"
-     *         title="Favorite Language"
-     *         value={programmingLanguage}
-     *         onChange={setProgrammingLanguage}
-     *       >
-     *         <Form.Dropdown.Item value="cpp" title="C++" />
-     *         <Form.Dropdown.Item value="javascript" title="JavaScript" />
-     *         <Form.Dropdown.Item value="ruby" title="Ruby" />
-     *         <Form.Dropdown.Item value="python" title="Python" />
-     *         <Form.Dropdown.Item value="swift" title="Swift" />
-     *         <Form.Dropdown.Item value="typescript" title="TypeScript" />
-     *       </Form.Dropdown>
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const Dropdown: typeof FormDropdown;
-    /**
-     * A form item with a tag picker that allows the user to select multiple items.
-     *
-     * @example
-     * Uncontrolled tag picker
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Favorite" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.TagPicker id="sports" title="Favorite Sports" defaultValue={["football"]}>
-     *         <Form.TagPicker.Item value="basketball" title="Basketball" icon="🏀" />
-     *         <Form.TagPicker.Item value="football" title="Football" icon="⚽️" />
-     *         <Form.TagPicker.Item value="tennis" title="Tennis" icon="🎾" />
-     *       </Form.TagPicker>
-     *     </Form>
-     *   );
-     * }
-     * ```
-     *
-     * @example
-     * Controlled tag picker
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     * import { useState } from "react";
-     *
-     * export default function Command() {
-     *   const [countries, setCountries] = useState<string[]>(["ger", "ned", "pol"]);
-     *
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Countries" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.TagPicker id="countries" title="Visited Countries" value={countries} onChange={setCountries}>
-     *         <Form.TagPicker.Item value="ger" title="Germany" icon="🇩🇪" />
-     *         <Form.TagPicker.Item value="ind" title="India" icon="🇮🇳" />
-     *         <Form.TagPicker.Item value="ned" title="Netherlands" icon="🇳🇱" />
-     *         <Form.TagPicker.Item value="nor" title="Norway" icon="🇳🇴" />
-     *         <Form.TagPicker.Item value="pol" title="Poland" icon="🇵🇱" />
-     *         <Form.TagPicker.Item value="rus" title="Russia" icon="🇷🇺" />
-     *         <Form.TagPicker.Item value="sco" title="Scotland" icon="🏴󠁧󠁢󠁳󠁣󠁴󠁿" />
-     *       </Form.TagPicker>
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const TagPicker: typeof FormTagPicker;
-    /**
-     * A form item with a secure text field for password-entry in which the entered characters must be kept secret.
-     *
-     * @example
-     * Uncontrolled password field
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitFormAction title="Submit Password" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.PasswordField id="password" title="Enter Password" />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     *
-     * @example
-     * Controlled password field
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     * import { useState } from "react";
-     *
-     * export default function Command() {
-     *   const [password, setPassword] = useState<string>();
-     *
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit Password" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.PasswordField id="password" value={password} onChange={setPassword} />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const PasswordField: typeof FormPasswordField;
-    /**
-     * A form item with a simple text label.
-     *
-     * @remarks Do *not* use this component to show validation messages for other form fields.
-     *
-     * @example
-     * Label
-     *
-     * ```typescript
-     * import { ActionPanel, Form, Action } from "@raycast/api";
-     *
-     * export default function Command() {
-     *   return (
-     *     <Form
-     *       actions={
-     *         <ActionPanel>
-     *           <Action.SubmitForm title="Submit" onSubmit={(values) => console.log(values)} />
-     *         </ActionPanel>
-     *       }
-     *     >
-     *       <Form.Description title="Import / Export" text="Exporting will back-up your preferences, quicklinks, snippets, floating notes, script-command folder paths, aliases, hotkeys, favorites and other data." />
-     *     </Form>
-     *   );
-     * }
-     * ```
-     */
-    const Description: typeof FormDescription;
-    /**
-     * Props of the {@link Form} React component.
-     *
-     * @category User Interface
-     * @subcategory Form
-     */
-    interface Props extends ActionsInterface, NavigationChildInterface {
-        /**
-         * The Form.Item elements of the form.
-         */
-        children?: ReactNode;
-    }
-    /**
-     * A possible form item value that will be used as an input for the submit callback of a form.
-     */
-    type Value = string | number | boolean | string[] | number[] | Date | null;
-    /**
-     * Values of items in the form.
-     *
-     * @remarks
-     * For type-safe form values, you can define your own interface. Use the ID's of the form items
-     * as the property names. See the example for more details.
-     *
-     * @example
-     * ```typescript
-     * import { Form, Action } from "@raycast/api";
-     *
-     * interface Values {
-     *   todo: string;
-     *   due?: Date;
-     * }
-     *
-     * export default function Command() {
-     *   function handleSubmit(values: Values) {
-     *     console.log(values);
-     *   }
-     *
-     *   return (
-     *     <Form
-     *        actions={
-     *          <ActionPanel>
-     *            <Action.SubmitForm title="Submit" onSubmit={handleSubmit} />
-     *          </ActionPanel>
-     *        }
-     *     >
-     *       <Form.TextField id="todo" title="Todo" />
-     *       <Form.DatePicker id="due" title="Due Date" />
-     *     </Form>
-     *   );
-     * };
-     * ```
-     */
-    interface Values {
-        /**
-         * The form value of a given item.
-         */
-        [item: string]: any;
-    }
-    /**
-     * Props of the Form.Item React component.
-     */
-    interface ItemProps<Value extends Form.Value> {
-        /**
-         * ID of the form item.
-         * Make sure to assign each form item a unique id.
-         */
-        id: string;
-        /**
-         * The title displayed on the left side of the item.
-         */
-        title?: string;
-        /**
-         * Indicates whether the value of the item should be persisted after submitting, and restored next time the form is rendered.
-         */
-        storeValue?: boolean;
-        /**
-         * The current value of the item.
-         */
-        value?: Value;
-        /**
-         * The default value of the item.
-         * 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.
-         * @important If you're using {@link Form.Item.Props.storeValue} and configured it as `true` then the stored value will be set.
-         * @important If you configure {@link Form.Item.Props.value} at the same time with {@link Form.Item.Props.defaultValue}, the `value` will be set instead of `defaultValue`.
-         */
-        defaultValue?: Value;
-        /**
-         * The callback which will be triggered on the {@link Form.Item.Props.value} change for the item.
-         */
-        onChange?: (newValue: Value) => void;
-    }
-    namespace TextField {
-        /**
-         * Props of the {@link Form.TextField} React component.
-         */
-        interface Props extends Form.ItemProps<string> {
-            /**
-             * Placeholder text shown in the text field.
-             */
-            placeholder?: string;
-        }
-    }
-    namespace TextArea {
-        /**
-         * Props of the {@link Form.TextArea} React component.
-         */
-        interface Props extends Form.ItemProps<string> {
-            /**
-             * Placeholder text shown in the text area.
-             */
-            placeholder?: string;
-        }
-    }
-    namespace Dropdown {
-        /**
-         * Props of the {@link Form.Dropdown} React component.
-         * The {@link Form.Dropdown.Props.value} here is ID ({@link Form.Dropdown.Item.Props.id}) of the default selected item.
-         */
-        interface Props extends Form.ItemProps<string> {
-            /**
-             * Sections or items. If {@link Form.Dropdown.Item} elements are specified, a default section is automatically created.
-             */
-            children?: ReactNode;
-        }
-        namespace Section {
-            /**
-             * Props of the {@link Form.Dropdown.Section} React component.
-             */
-            interface Props {
-                /**
-                 * The item elements of the section.
-                 */
-                children?: ReactNode;
-                /**
-                 * Title displayed above the section
-                 */
-                title?: string;
-            }
-        }
-        namespace Item {
-            /**
-             * Props of the {@link Form.Dropdown.Item} React component.
-             */
-            interface Props {
-                /**
-                 * Value of the dropdown item.
-                 * Make sure to assign each unique value for each item.
-                 */
-                value: string;
-                /**
-                 * The title displayed for the item.
-                 */
-                title: string;
-                /**
-                 * A optional icon displayed for the item.
-                 */
-                icon?: Image.ImageLike;
-            }
-        }
-    }
-    namespace Checkbox {
-        /**
-         * Props of the {@link Form.Checkbox} React component.
-         */
-        interface Props extends Form.ItemProps<boolean> {
-            /**
-             * The label displayed on the right side of the checkbox.
-             */
-            label: string;
-        }
-    }
-    namespace DatePicker {
-        /**
-         * Props of the {@link Form.DatePicker} React component.
-         */
-        interface Props extends Form.ItemProps<Date> {
-            /**
-             * Indicates what types of date components can be picked
-             *
-             * @default Form.DatePicker.Type.DateTime
-             */
-            type?: FormDatePickerType;
-        }
-    }
-    namespace Separator {
-        /**
-         * Props of the {@link Form.Separator} React component.
-         */
-        interface Props {
-        }
-    }
-    namespace TagPicker {
-        /**
-         * Props of the {@link Form.TagPicker} React component.
-         * The {@link Form.TagPicker.Props.value} here is the IDs ({@link Form.TagPicker.Item.Props.id}) of the default selected items.
-         */
-        interface Props extends Form.ItemProps<string[]> {
-            /**
-             * The list of tags.
-             */
-            children?: ReactNode;
-            /**
-             * Placeholder text shown in the token field.
-             */
-            placeholder?: string;
-        }
-        namespace Item {
-            /**
-             * Props of the {@link Form.TagPicker.Item} React component.
-             */
-            interface Props {
-                /**
-                 * Value of the tag.
-                 * Make sure to assign unique value for each item.
-                 */
-                value: string;
-                /**
-                 * The display title of the tag.
-                 */
-                title: string;
-                /**
-                 * An icon to show in the tag.
-                 */
-                icon?: Image.ImageLike;
-            }
-        }
-    }
-    namespace PasswordField {
-        /**
-         * Props of the {@link Form.PasswordField} React component.
-         */
-        interface Props extends Form.ItemProps<string> {
-            /**
-             * Placeholder text shown in the password field.
-             */
-            placeholder?: string;
-        }
-    }
-    namespace Description {
-        /**
-         * Props of the {@link Form.Description} React component.
-         */
-        interface Props {
-            /**
-             * The display title of the left side from the description item.
-             */
-            title?: string;
-            /**
-             * Text that will be displayed in the middle.
-             */
-            text: string;
-        }
-    }
-}
-export {};