import { PharosElement } from '../base/pharos-element'; import type { TemplateResult, CSSResultArray, PropertyValues } from 'lit'; import type { HeadingLevel } from '../heading/pharos-heading'; export type { HeadingLevel }; import { PharosHeading } from '../heading/pharos-heading'; import { PharosLink } from '../link/pharos-link'; import { PharosIcon } from '../icon/pharos-icon'; import { PharosButton } from '../button/pharos-button'; import { PharosCheckbox } from '../checkbox/pharos-checkbox'; export type ImageCardVariant = 'base' | 'collection' | 'promotional' | 'selectable' | 'selectable-collection'; declare const PharosImageCard_base: typeof PharosElement; /** * Pharos image card component. * * @tag pharos-image-card * * @slot image - Contains the image to display on the card. * @slot metadata - Contains the metadata for the item. * @slot title - Contains the title for the item (renders if title prop is not set). * @slot action-button - Contains the action-button for the item (renders if action-menu prop is not set). * */ export declare class PharosImageCard extends PharosImageCard_base { static elementDefinitions: { 'pharos-heading': typeof PharosHeading; 'pharos-link': typeof PharosLink; 'pharos-icon': typeof PharosIcon; 'pharos-button': typeof PharosButton; 'pharos-checkbox': typeof PharosCheckbox; }; /** * Indicates the title of the item presented in the card. * @attr title */ title: string; /** * Indicates the item type of the source content represented by the card. * @attr source-type */ sourceType?: string; /** * Indicates the link to apply to the title and image. * @attr link * @type {string | null} */ link: string | null; /** * @deprecated * Indicates the label to apply to the image link. * @attr image-link-label */ imageLinkLabel?: string; /** * Indicates the variant of card. * @attr variant */ variant: ImageCardVariant; /** * Indicates if the image is not available or accessible. * @attr error */ error: boolean; /** * Indicates if the metadata should only show on hover of the image. * @attr subtle */ subtle: boolean; /** * Indicates the action menu id to be passed to the action button. * @attr action-menu */ actionMenu?: string; /** * The heading level to use for the card title when using the title property. * @attr heading-level * @type {HeadingLevel | undefined} */ headingLevel?: HeadingLevel; /** * Indicates subtler styling for the selectable card variant and that the card is only selectable by clicking on the checkbox. * @attr subtle-select */ subtleSelect?: boolean; /** * Indicates if the image card is selected * @attr selected */ _isSelected: boolean; /** * Indicates if the image card is in a disabled state * @attr selected */ disabled: boolean; /** * Indicates if the image card title link should render the visited link styling. * @attr indicate-link-visited */ indicateLinkVisited: boolean; private _isSelectableHovered; private _title?; private _checkbox; static get styles(): CSSResultArray; protected update(changedProperties: PropertyValues): void; private _isSelectable; private _handleClick; private _handleImageMouseEnter; private _handleImageMouseLeave; private _handleMouseEnterSelectable; private _handleMouseLeaveSelectable; private _renderCollectionImageLinkContent; private _renderCollectionImage; private _renderLinkContent; private _renderHoverMetadata; private _renderBaseImage; private _renderImage; private _chooseHeadingPreset; private _hasTitle; private _renderTitle; private _renderActionButton; private _renderSourceType; private _renderMetadata; protected render(): TemplateResult; private _cardToggleSelect; private _isSubtleSelectHover; private _showSubtleOverlay; private _isSelectableCardHover; private _isSelectableViaCard; private _isDisabledSelectable; private _renderCheckbox; } //# sourceMappingURL=pharos-image-card.d.ts.map