@googleworkspace/drive-picker-element/dist/index.d.ts

A web component for Google Drive Picker

/**
 * The `drive-picker-docs-view` element is used to define a [`google.picker.DocsView`](https://developers.google.com/drive/picker/reference/picker.docsview).
 *
 * @element drive-picker-docs-view
 * @attr {"default"|"true"|"false"} enable-drives - Whether to allow the user to select files from shared drives. See [`DocsView.enableDrives`](https://developers.google.com/drive/picker/reference/picker.docsview.setenabledrives).
 * @attr {"default"|"true"|"false"} include-folders - Whether to include folders in the view. See [`DocsView.includeFolders`](https://developers.google.com/drive/picker/reference/picker.docsview.setincludefolders).
 * @attr {string} mime-types - A comma-separated list of MIME types to filter the view. See [`View.setMimeTypes`](https://developers.google.com/drive/picker/reference/picker.view.setmimetypes).
 * @attr {string} file-ids - A comma-separated list of file IDs to filter the view. See [`View.setFileIds`](https://developers.google.com/workspace/drive/picker/reference/picker.docsview.setfileids).
 * @attr {string} mode - The mode of the view. See [`DocsViewMode`](https://developers.google.com/drive/picker/reference/picker.docsviewmode).
 * @attr {"default"|"true"|"false"} owned-by-me - Whether to show files owned by the user. See [`DocsView.ownedByMe`](https://developers.google.com/drive/picker/reference/picker.docsview.setownedbyme).
 * @attr {string} parent - The ID of the folder to view. See [`DocsView.setParent`](https://developers.google.com/drive/picker/reference/picker.docsview.setparent).
 * @attr {string} query - The query string to filter the view. See [`View.setQuery`](https://developers.google.com/drive/picker/reference/picker.view.setquery).
 * @attr {"default"|"true"|"false"} select-folder-enabled - Whether to allow the user to select folders. See [`DocsView.selectFolderEnabled`](https://developers.google.com/drive/picker/reference/picker.docsview.setselectfolderenabled).
 * @attr {"default"|"true"|"false"} starred - Whether to show starred files. See [`DocsView.starred`](https://developers.google.com/drive/picker/reference/picker.docsview.setstarred).
 * @attr {string} view-id - The `keyof typeof google.picker.ViewId`. For example, `"DOCS"`, which is equivalent to `google.picker.ViewId.DOCS`. See [`ViewId`](https://developers.google.com/drive/picker/reference/picker.viewid).
 *
 * @example
 *
 * ```html
 * <drive-picker-docs-view ownedByMe=""></drive-picker-docs-view>
 * ```
 *
 * @see https://developers.google.com/drive/picker/reference/picker.docsview
 *
 */
declare class DrivePickerDocsViewElement extends HTMLElement {
    static get observedAttributes(): string[];
    /**
     * Gets the Google Drive Picker view based on the current attribute values.
     * @returns {google.picker.DocsView} The Google Drive picker view.
     */
    get view(): google.picker.DocsView;
    private get viewId();
}

/**
 * Copyright 2024 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
type OAuthErrorEvent = CustomEvent<google.accounts.oauth2.ClientConfigError | google.accounts.oauth2.TokenResponse>;
type OAuthResponseEvent = CustomEvent<google.accounts.oauth2.TokenResponse>;
type PickerCanceledEvent = CustomEvent<google.picker.ResponseObject>;
type PickerPickedEvent = CustomEvent<google.picker.ResponseObject>;
type PickerErrorEvent = CustomEvent<unknown>;
declare global {
    interface GlobalEventHandlersEventMap {
        /** @deprecated - Use "picker-oauth-error" */
        "picker:authenticated": CustomEvent<{
            token: string;
        }>;
        /** @deprecated - Use "picker-oauth-error" */
        "picker:oauth:error": OAuthErrorEvent;
        "picker-oauth-error": OAuthErrorEvent;
        /** @deprecated - Use "picker-oauth-response" */
        "picker:oauth:response": OAuthResponseEvent;
        "picker-oauth-response": OAuthResponseEvent;
        /** @deprecated - Use "picker-canceled" */
        "picker:canceled": PickerCanceledEvent;
        "picker-canceled": PickerCanceledEvent;
        /** @deprecated - Use "picker-picked" */
        "picker:picked": PickerPickedEvent;
        "picker-picked": PickerPickedEvent;
        /** @deprecated - Use "picker-error" */
        "picker:error": PickerErrorEvent;
        "picker-error": PickerErrorEvent;
    }
}
/**
 * The `drive-picker` web component provides a convenient way to declaratively
 * build
 * [`google.picker.Picker`](https://developers.google.com/drive/picker/reference/picker)
 * by using the component attributes mapped to the corresponding methods of
 * [`google.picker.PickerBuilder`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder).
 *
 * @element drive-picker
 *
 * @fires {PickerCanceledEvent} picker-canceled - Triggered when the user cancels the picker dialog. See [`ResponseObject`](https://developers.google.com/drive/picker/reference/picker.responseobject).
 * @fires {PickerPickedEvent} picker-picked - Triggered when the user picks one or more items. See [`ResponseObject`](https://developers.google.com/drive/picker/reference/picker.responseobject).
 * @fires {PickerErrorEvent} picker-error - Triggered when an error occurs. See [`ResponseObject`](https://developers.google.com/drive/picker/reference/picker.responseobject).
 * @fires {OAuthErrorEvent} picker-oauth-error - Triggered when an error occurs in the OAuth flow. See the [error guide](https://developers.google.com/identity/oauth2/web/guides/error). Note that the `TokenResponse` object can have error fields.
 * @fires {OAuthResponseEvent} picker-oauth-response - Triggered when an OAuth flow completes. See the [token model guide](https://developers.google.com/identity/oauth2/web/guides/use-token-model).
 *
 * @slot - The default slot contains View elements to display in the picker.
 * Each View element should implement a property `view` of type
 * `google.picker.View`.
 * @attr {string} app-id - The Google Drive app ID. See [`PickerBuilder.setAppId`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setappid).
 * @attr {string} client-id - The OAuth 2.0 client ID. See [Using OAuth 2.0 to Access Google APIs](https://developers.google.com/identity/protocols/oauth2).
 * @attr {string} developer-key - The API key for accessing Google Picker API. See [`PickerBuilder.setDeveloperKey`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setdeveloperkey).
 * @attr {number} [debounce-delay=0] - The debounce delay in milliseconds before building the picker after an attribute change.
 * @attr {"default"|"true"|"false"} hide-title-bar - Hides the title bar of the
 * picker if set to true. See [`PickerBuilder.hideTitleBar`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.hidetitlebar).
 * @attr {string} locale - The locale to use for the picker. See [`PickerBuilder.setLocale`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setlocale).
 * @attr {number} max-items - The maximum number of items that can be selected. See [`PickerBuilder.setMaxItems`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setmaxitems).
 * @attr {boolean} mine-only - If set to true, only shows files owned by the
 * user. See [`PickerBuilder.enableFeature`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.enablefeature).
 * @attr {boolean} multiselect - Enables multiple file selection if set to true. See [`PickerBuilder.enableFeature`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.enablefeature).
 * @attr {boolean} nav-hidden - Hides the navigation pane if set to true. See [`PickerBuilder.enableFeature`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.enablefeature).
 * @attr {string} oauth-token - The OAuth 2.0 token for authentication. See [`PickerBuilder.setOAuthToken`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setoauthtoken).
 * @attr {string} origin - The origin parameter for the picker. See [`PickerBuilder.setOrigin`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setorigin).
 * @attr {string} relay-url - The relay URL for the picker. See [`PickerBuilder.setRelayUrl`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setrelayurl).
 * @attr {string} scope - The OAuth 2.0 scope for the picker. The default is `https://www.googleapis.com/auth/drive.file`. See [Drive API scopes](https://developers.google.com/drive/api/guides/api-specific-auth#drive-scopes).
 * @attr {string} title - The title of the picker. See [`PickerBuilder.setTitle`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.settitle).
 * @attr {string} hd - The hosted domain to restrict sign-in to.  (Optional)  See the `hd` field in the OpenID Connect docs.
 * @attr {boolean} include-granted-scopes - Enables applications to use incremental authorization. See [`TokenClientConfig.include_granted_scopes`](https://developers.google.com/identity/oauth2/web/reference/js-reference#TokenClientConfig).
 * @attr {string} login-hint - An email address or an ID token 'sub' value. Google will use the value as a hint of which user to sign in. See the `login_hint` field in the OpenID Connect docs.
 * @attr {""|"none"|"consent"|"select_account"} prompt - A space-delimited, case-sensitive list of prompts to present the user.  See [`TokenClientConfig.prompt`](https://developers.google.com/identity/oauth2/web/reference/js-reference#TokenClientConfig)
 *
 * @example
 *
 *```html
 *<drive-picker
 *  app-id="246724281745"
 *  client-id="246724281745-v9ouai8ood5o69r3ug29aaqeqflomijd.apps.googleusercontent.com"
 *>
 *  <drive-picker-docs-view></drive-picker-docs-view>
 *</drive-picker>
 *```
 *
 */
declare class DrivePickerElement extends HTMLElement {
    static get observedAttributes(): string[];
    private picker;
    private observer;
    private google;
    private loading;
    private debounceTimer;
    /**
     * The visibility of the picker.
     */
    get visible(): boolean;
    /**
     * Controls the visibility of the picker after the picker dialog has been
     * closed. If any of the attributes change, the picker will be rebuilt and
     * the visibility will be reset.
     */
    set visible(value: boolean);
    get tokenClientConfig(): Omit<google.accounts.oauth2.TokenClientConfig, "callback" | "error_callback">;
    attributeChangedCallback(): void;
    private scheduleBuild;
    private build;
    /**
     * The `google.Picker.View` objects to display in the picker as defined by the slot elements.
     */
    private get views();
    connectedCallback(): Promise<void>;
    private callbackToDispatchEvent;
    private requestAccessToken;
    disconnectedCallback(): void;
}

/**
 * Copyright 2025 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */
interface DrivePickerElementProps {
    /** The Google Drive app ID. See [`PickerBuilder.setAppId`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setappid).*/
    "app-id"?: string;
    /** The OAuth 2.0 client ID. See [Using OAuth 2.0 to Access Google APIs](https://developers.google.com/identity/protocols/oauth2).*/
    "client-id"?: string;
    /** The debounce delay in milliseconds before building the picker after an attribute change.*/
    "debounce-delay"?: number;
    /** The API key for accessing Google Picker API. See [`PickerBuilder.setDeveloperKey`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setdeveloperkey).*/
    "developer-key"?: string;
    /** Hides the title bar of the picker if set to true. See [`PickerBuilder.hideTitleBar`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.hidetitlebar).*/
    "hide-title-bar"?: "default" | "true" | "false";
    /** The locale to use for the picker. See [`PickerBuilder.setLocale`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setlocale).*/
    locale?: string;
    /** The maximum number of items that can be selected. See [`PickerBuilder.setMaxItems`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setmaxitems).*/
    "max-items"?: number;
    /** If set to true, only shows files owned by the user. See [`PickerBuilder.enableFeature`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.enablefeature).*/
    "mine-only"?: boolean;
    /** Enables multiple file selection if set to true. See [`PickerBuilder.enableFeature`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.enablefeature).*/
    multiselect?: boolean;
    /** Hides the navigation pane if set to true. See [`PickerBuilder.enableFeature`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.enablefeature).*/
    "nav-hidden"?: boolean;
    /** The OAuth 2.0 token for authentication. See [`PickerBuilder.setOAuthToken`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setoauthtoken).*/
    "oauth-token"?: string;
    /** The origin parameter for the picker. See [`PickerBuilder.setOrigin`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setorigin).*/
    origin?: string;
    /** The relay URL for the picker. See [`PickerBuilder.setRelayUrl`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.setrelayurl).*/
    "relay-url"?: string;
    /** The OAuth 2.0 scope for the picker. The default is `https://www.googleapis.com/auth/drive.file`. See [Drive API scopes](https://developers.google.com/drive/api/guides/api-specific-auth#drive-scopes).*/
    scope?: string;
    /** The title of the picker. See [`PickerBuilder.setTitle`](https://developers.google.com/drive/picker/reference/picker.pickerbuilder.settitle).*/
    title?: string;
    /** The hosted domain to restrict sign-in to.  (Optional)  See the `hd` field in the OpenID Connect docs.*/
    hd?: string;
    /** Enables applications to use incremental authorization. See [`TokenClientConfig.include_granted_scopes`](https://developers.google.com/identity/oauth2/web/reference/js-reference#TokenClientConfig).*/
    "include-granted-scopes"?: boolean;
    /** An email address or an ID token 'sub' value. Google will use the value as a hint of which user to sign in. See the `login_hint` field in the OpenID Connect docs.*/
    "login-hint"?: string;
    /** A space-delimited, case-sensitive list of prompts to present the user.  See [`TokenClientConfig.prompt`](https://developers.google.com/identity/oauth2/web/reference/js-reference#TokenClientConfig)*/
    prompt?: "" | "none" | "consent" | "select_account";
}
interface DrivePickerDocsViewElementProps {
    /** Whether to allow the user to select files from shared drives. See [`DocsView.enableDrives`](https://developers.google.com/drive/picker/reference/picker.docsview.setenabledrives).*/
    "enable-drives"?: "default" | "true" | "false";
    /** A comma-separated list of file IDs to filter the view. See [`View.setFileIds`](https://developers.google.com/workspace/drive/picker/reference/picker.docsview.setfileids).*/
    "file-ids"?: string;
    /** Whether to include folders in the view. See [`DocsView.includeFolders`](https://developers.google.com/drive/picker/reference/picker.docsview.setincludefolders).*/
    "include-folders"?: "default" | "true" | "false";
    /** A comma-separated list of MIME types to filter the view. See [`View.setMimeTypes`](https://developers.google.com/drive/picker/reference/picker.view.setmimetypes).*/
    "mime-types"?: string;
    /** The mode of the view. See [`DocsViewMode`](https://developers.google.com/drive/picker/reference/picker.docsviewmode).*/
    mode?: string;
    /** Whether to show files owned by the user. See [`DocsView.ownedByMe`](https://developers.google.com/drive/picker/reference/picker.docsview.setownedbyme).*/
    "owned-by-me"?: "default" | "true" | "false";
    /** The ID of the folder to view. See [`DocsView.setParent`](https://developers.google.com/drive/picker/reference/picker.docsview.setparent).*/
    parent?: string;
    /** The query string to filter the view. See [`View.setQuery`](https://developers.google.com/drive/picker/reference/picker.view.setquery).*/
    query?: string;
    /** Whether to allow the user to select folders. See [`DocsView.selectFolderEnabled`](https://developers.google.com/drive/picker/reference/picker.docsview.setselectfolderenabled).*/
    "select-folder-enabled"?: "default" | "true" | "false";
    /** Whether to show starred files. See [`DocsView.starred`](https://developers.google.com/drive/picker/reference/picker.docsview.setstarred).*/
    starred?: "default" | "true" | "false";
    /** The `keyof typeof google.picker.ViewId`. For example, `"DOCS"`, which is equivalent to `google.picker.ViewId.DOCS`. See [`ViewId`](https://developers.google.com/drive/picker/reference/picker.viewid).*/
    "view-id"?: string;
}

/**
 * Copyright 2024 Google LLC
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 *     http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

declare global {
    interface HTMLElementTagNameMap {
        "drive-picker": DrivePickerElement;
    }
    interface HTMLElementTagNameMap {
        "drive-picker-docs-view": DrivePickerDocsViewElement;
    }
}

export { DrivePickerDocsViewElement, type DrivePickerDocsViewElementProps, DrivePickerElement, type DrivePickerElementProps, type OAuthErrorEvent, type OAuthResponseEvent, type PickerCanceledEvent, type PickerErrorEvent, type PickerPickedEvent };