@conectate/ct-dialog/ct-confirm.d.ts

HTML dialog made with Web Components

/**
 @license
 Copyright (c) 2020 Herberth Obregón. All rights reserved.
 This code may only be used under the BSD style license found at
 https://open.grupoconectate.com/LICENSE.txt The complete set of authors may be found at
 https://open.grupoconectate.com/AUTHORS.txt The complete set of contributors may be
 found at https://open.grupoconectate.com/CONTRIBUTORS.txt Code distributed by Herberth Obregón as
 part of the Conectate Open Source Project is also subject to an additional IP rights grant
 found at https://open.grupoconectate.com/PATENTS.txt
 */
import "@conectate/ct-button";
import "@conectate/ct-card";
import { CtLit } from "@conectate/ct-lit";
import { CtDialog } from "./ct-dialog.js";
/**
 * Displays a confirmation dialog with standard Material Design styling
 *
 * @param {string} title - Dialog title
 * @param {string} body - Content to display in the dialog (supports HTML)
 * @param {string} [ok="Ok"] - Text for the positive button
 * @param {string} [cancel] - Text for the negative button (will not display if not provided)
 * @param {string} [neutral] - Text for the neutral button (will not display if not provided)
 * @param {Object} [options] - Additional options
 * @param {boolean} [options.history=true] - Whether to use browser history for the dialog
 * @returns {Promise<boolean|null|undefined>} Promise that resolves with true (ok), false (cancel), or null (neutral)
 *
 * @example
 * ```javascript
 * // Basic confirmation dialog
 * const confirmed = await showCtConfirm(
 *   "Confirm Action",
 *   "Are you sure you want to proceed?",
 *   "Yes",
 *   "No"
 * );
 *
 * if (confirmed) {
 *   // User clicked "Yes"
 * } else {
 *   // User clicked "No" or dismissed the dialog
 * }
 *
 * // Three-option dialog
 * const result = await showCtConfirm(
 *   "Choose Action",
 *   "What would you like to do?",
 *   "Save",
 *   "Delete",
 *   "Cancel"
 * );
 *
 * if (result === true) {
 *   // User clicked "Save"
 * } else if (result === false) {
 *   // User clicked "Delete"
 * } else {
 *   // User clicked "Cancel"
 * }
 * ```
 */
export declare function showCtConfirm(title: string, body: string, ok?: string, cancel?: string, neutral?: string, options?: {
    history?: boolean;
}): Promise<boolean>;
/**
 * Displays a confirmation dialog with iOS-style design (Cupertino)
 *
 * @param {string} title - Dialog title
 * @param {string} body - Content to display in the dialog (supports HTML)
 * @param {string} [ok="Ok"] - Text for the positive button
 * @param {string} [cancel="Cancel"] - Text for the negative button
 * @param {string} [neutral] - Text for the neutral button (will not display if not provided)
 * @returns {Promise<boolean|null|undefined>} Promise that resolves with true (ok), false (cancel), or null (neutral)
 *
 * @example
 * ```javascript
 * // iOS-style confirmation dialog
 * const confirmed = await showCtConfirmCupertino(
 *   "Confirm Action",
 *   "Are you sure you want to proceed?",
 *   "Yes",
 *   "No"
 * );
 * ```
 */
export declare function showCtConfirmCupertino(title: string, body: string, ok?: string, cancel?: string, neutral?: string): Promise<boolean>;
/**
 * ## `ct-confirm`
 * A dialog component that displays a confirmation with customizable buttons.
 *
 * This component is typically used through the `showCtConfirm` function rather than directly.
 *
 * @group ct-elements
 * @element ct-confirm
 */
export declare class CTConfirm extends CtLit {
    /**
     * Content to display in the dialog
     */
    body: string;
    /**
     * Dialog title text
     */
    ttl: string;
    /**
     * Text for the positive button
     */
    ok: string;
    /**
     * Text for the neutral button (not displayed if empty)
     */
    neutral: string;
    /**
     * Text for the negative button (not displayed if empty)
     */
    cancel: string;
    /**
     * Function to reject the promise
     * @private
     */
    reject: (reason?: any) => void;
    /**
     * Function to resolve the promise
     * @private
     */
    solve: (param: boolean | null | undefined) => void;
    /**
     * Reference to the dialog instance
     */
    dialog: CtDialog;
    render(): import("lit").TemplateResult<1>;
    static get properties(): {
        body: {
            type: StringConstructor;
        };
        ttl: {
            type: StringConstructor;
        };
        ok: {
            type: StringConstructor;
        };
        neutral: {
            type: StringConstructor;
        };
        cancel: {
            type: StringConstructor;
        };
    };
    $cancel: HTMLElement;
    $neutral: HTMLElement;
    confirmBody: HTMLElement;
    buttons: HTMLElement;
    firstUpdated(): void;
    computeBtns(ok: string, neutral: string, cancel: string): void;
    computeBody(body: string): string;
    okbtn(e: Event): Promise<void>;
    cancelbtn(e: Event): Promise<void>;
    neutralbtn(e: Event): Promise<void>;
    onResult(): Promise<boolean | undefined>;
}
export declare class CTConfirmCupertino extends CtLit {
    body: string;
    ttl: string;
    ok: string;
    neutral: string;
    cancel: string;
    reject: (reason?: any) => void;
    solve: (param: boolean | null | undefined) => void;
    dialog: CtDialog;
    $cancel: HTMLElement;
    $neutral: HTMLElement;
    confirmBody: HTMLElement;
    buttons: HTMLElement;
    render(): import("lit").TemplateResult<1>;
    static get properties(): {
        body: {
            type: StringConstructor;
        };
        ttl: {
            type: StringConstructor;
        };
        ok: {
            type: StringConstructor;
        };
        neutral: {
            type: StringConstructor;
        };
        cancel: {
            type: StringConstructor;
        };
    };
    firstUpdated(): void;
    computeBtns(ok: string, neutral: string, cancel: string): void;
    computeBody(body: string): string;
    okbtn(e: Event): Promise<void>;
    cancelbtn(e: Event): Promise<void>;
    neutralbtn(e: Event): Promise<void>;
    onResult(): Promise<boolean | undefined>;
}
declare global {
    interface HTMLElementTagNameMap {
        "ct-confirm-cupertino": CTConfirmCupertino;
        "ct-confirm": CTConfirm;
    }
}