import { EventEmitter } from "../../stencil-public-runtime";
import { ThemeableComponent } from "../../common";
import { DuetCardHeadingLevel, DuetColor, DuetIconName, DuetMargin, DuetTheme } from "../../common-types";
import { DuetBreakpoints } from "../../utils/token-utils";
export type DuetCardVariation = "default" | "info" | "plain";
export type DuetCardPadding = "x-large" | "large" | "medium" | "small" | "x-small" | "xx-small" | "none";
export type DuetCardToggleEvent = {
    component: "duet-card";
    originalEvent: KeyboardEvent | MouseEvent;
};
/**
 * @slot unnamed default slot - The component’s primary content. All child nodes that do not have a slot attribute defined are inserted into this primary slot.
 * @slot heading - This is a slot for heading content inside the card component.
 * @slot below-heading - Below heading content.
 * @slot footer - Footer content.
 */
export declare class DuetCard implements ThemeableComponent {
    /**
     * Own Properties.
     */
    private hasHeadingSlot;
    private hasFooter?;
    private cardId;
    private nativeCard?;
    /**
     * Reference to host HTML element.
     */
    element: HTMLElement;
    /**
     * Adds accessible label for the card that is only shown for screen readers.
     * Typically, this label text is used when the whole card is made clickable to
     * create a label text for users who use assistive technology.
     */
    accessibleLabel: string;
    /**
     * The content for the card heading. If empty, both heading and collapse
     * functionality will be hidden.
     */
    heading: string;
    /**
     * Additional content for the card heading. If empty, both heading and collapse
     * functionality will be hidden.
     */
    secondaryHeading: string;
    /**
     * Style variation of the card.
     */
    variation: DuetCardVariation;
    /**
     * Makes the card expand and collapse when the collapse/expand arrow in the
     * heading is clicked or tapped. This option only works together with the
     * heading option, meaning that you also need to set the heading for this
     * functionality to show up.
     */
    collapsible: boolean;
    /**
     * If the card is collapsible, this property controls whether the card is open or closed.
     */
    open: boolean;
    /**
     * The actual heading level used for the heading in html markup. This setting
     * exists for accessibility reasons. It doesn’t change the style visually.
     * This setting is only used if the heading property is set.
     * If you provide your own heading(s) in the slot, you should set this to neutral "div"
     * in order to avoid nested headings.
     */
    headingLevel: DuetCardHeadingLevel;
    /**
     * Custom color to be used for the card's heading background, as a design token entered in
     * camelCase or kebab-case. Example: "primary".
     */
    headingBackground: DuetColor | undefined;
    /**
     * Icon to display on the left side of heading. Example: "form-location"
     */
    icon: DuetIconName;
    /**
     * Custom color to be used for the icon, as a design token entered in camelCase
     * or kebab-case. Example: "color-primary". This property can also be set to
     * "currentColor".
     */
    iconColor: DuetColor;
    /**
     * Image to display in the card. The image aspect ratio can be anything as
     * images are resized to fit 100% width of the card. Example:
     * "https://cdn.duetds.com/api/assets/illustrations/placeholder-image.jpg"
     */
    image: string;
    /**
     * Alt attribute text for the image. If not provided, image is assigned presentation role.
     */
    imageAlt: string;
    /**
     * Custom color to be used for the card background, as a design token entered in
     * camelCase or kebab-case. Example: "primary".
     */
    background: DuetColor;
    /**
     * The padding for the card. Please note that the card padding values don’t directly
     * translate to similar space token names, but instead the card uses it’s own
     * derived defaults.
     */
    padding: DuetCardPadding;
    /**
     * Controls the margin of the component.
     */
    margin: DuetMargin;
    /**
     * Theme of the card.
     */
    theme: DuetTheme;
    /**
     * A destination to link to, rendered in the href attribute of a link.
     */
    url: string;
    /**
     * Breakpoint used to remove shadow around card. These match to
     * similar media query tokens: $media-query-small and $media-query-medium.
     */
    shadowBreakpoint?: DuetBreakpoints;
    /**
     * Event emitted when opened/closed
     */
    duetToggle: EventEmitter<DuetCardToggleEvent>;
    /**
     * Component lifecycle events.
     */
    componentWillLoad(): void;
    connectedCallback(): void;
    disconnectedCallback(): void;
    /**
     * Local methods.
     */
    private togglePanel;
    private handleKeyDown;
    private renderHeading;
    /**
     * Sets focus on underlying a element.
     * Available only when url attribute is used.
     * Use this method instead of the native `focus()`.
     */
    setFocus(options?: FocusOptions): Promise<void>;
    /**
     * render() function
     * Always the last one in the class.
     */
    render(): any;
}