dap-design-system/dist/components/link/link.component.d.ts

Official design system for the DÁP (dap.gov.hu)

import { LinkSize, LinkTarget, LinkVariant } from '../../common/types';
import { DdsElement } from '../../internal/dds-hu-element';
/**
 * `dap-ds-link`
 * @summary A link is a reference to a web resource.
 * @element dap-ds-link
 * @title - Link
 *
 * @event {{ event: Event }} dds-click - Emitted when the link is clicked.
 *
 * @slot - The text of the link.
 * @slot link - A router link element (e.g. Next.js Link) used for SPA navigation.
 *   Rendered outside the visible link so it is always accessible to programmatic clicks.
 *
 * @csspart base - The main link container.
 * @csspart text - The text of the link.
 *
 * @cssproperty --dds-link-color - The color of the link text (default: var(--dds-link-enabled)).
 * @cssproperty --dds-link-hover-color - The color of the link text on hover (default: var(--dds-link-hover)).
 * @cssproperty --dds-link-active-color - The color of the link text when active (default: var(--dds-link-pressed)).
 * @cssproperty --dds-link-visited-color - The color of the visited link text (default: var(--dds-link-pressed)).
 * @cssproperty --dds-link-font-size - The font size of the link text (default: var(--dds-font-base)).
 * @cssproperty --dds-link-line-height - The line height of the link text (default: var(--dds-font-line-height-xlarge)).
 * @cssproperty --dds-link-font-weight - The font weight of the link text (default: var(--dds-font-weight-medium)).
 * @cssproperty --dds-link-text-decoration - The text decoration of the link (default: underline).
 *
 * @cssproperty --dds-link-neutral-color - The color of the neutral variant link (default: var(--dds-link-neutral-enabled)).
 * @cssproperty --dds-link-neutral-hover-color - The hover color of the neutral variant link (default: var(--dds-link-neutral-hover)).
 * @cssproperty --dds-link-neutral-active-color - The active color of the neutral variant link (default: var(--dds-link-neutral-pressed)).
 * @cssproperty --dds-link-neutral-visited-color - The visited color of the neutral variant link (default: var(--dds-link-neutral-pressed)).
 *
 * @cssproperty --dds-link-brand-color - The color of the brand variant link (default: var(--dds-link-enabled)).
 * @cssproperty --dds-link-brand-hover-color - The hover color of the brand variant link (default: var(--dds-link-hover)).
 * @cssproperty --dds-link-brand-active-color - The active color of the brand variant link (default: var(--dds-link-pressed)).
 * @cssproperty --dds-link-brand-visited-color - The visited color of the brand variant link (default: var(--dds-link-pressed)).
 *
 * @cssproperty --dds-link-inverted-color - The color of the inverted variant link (default: var(--dds-link-inverted-enabled)).
 * @cssproperty --dds-link-inverted-hover-color - The hover color of the inverted variant link (default: var(--dds-link-inverted-hover)).
 * @cssproperty --dds-link-inverted-active-color - The active color of the inverted variant link (default: var(--dds-link-inverted-pressed)).
 * @cssproperty --dds-link-inverted-visited-color - The visited color of the inverted variant link (default: var(--dds-link-inverted-visited)).
 *
 * @cssproperty --dds-link-warning-color - The color of the warning variant link (default: var(--dds-banner-action-inverted-enabled)).
 * @cssproperty --dds-link-warning-hover-color - The hover color of the warning variant link (default: var(--dds-banner-action-inverted-hover)).
 * @cssproperty --dds-link-warning-active-color - The active color of the warning variant link (default: var(--dds-banner-action-inverted-pressed)).
 * @cssproperty --dds-link-warning-visited-color - The visited color of the warning variant link (default: var(--dds-banner-action-inverted-enabled)).
 *
 * @cssproperty --dds-link-disabled-color - The color of the disabled link (default: var(--dds-text-neutral-disabled)).
 * @cssproperty --dds-link-disabled-hover-color - The hover color of the disabled link (default: var(--dds-text-neutral-disabled)).
 * @cssproperty --dds-link-disabled-active-color - The active color of the disabled link (default: var(--dds-text-neutral-disabled)).
 * @cssproperty --dds-link-disabled-visited-color - The visited color of the disabled link (default: var(--dds-text-neutral-disabled)).
 *
 * @cssproperty --dds-link-lg-font-size - The font size of the large link (default: var(--dds-font-lg)).
 * @cssproperty --dds-link-lg-line-height - The line height of the large link (default: var(--dds-font-line-height-xlarge)).
 * @cssproperty --dds-link-md-font-size - The font size of the medium link (default: var(--dds-font-base)).
 * @cssproperty --dds-link-md-line-height - The line height of the medium link (default: var(--dds-font-line-height-xlarge)).
 * @cssproperty --dds-link-sm-font-size - The font size of the small link (default: var(--dds-font-sm)).
 * @cssproperty --dds-link-sm-line-height - The line height of the small link (default: var(--dds-font-line-height-xlarge)).
 * @cssproperty --dds-link-xs-font-size - The font size of the extra small link (default: var(--dds-font-xs)).
 * @cssproperty --dds-link-xs-line-height - The line height of the extra small link (default: var(--dds-font-line-height-xlarge)).
 *
 * @cssproperty --dds-link-normal-font-weight - The font weight of the normal link (default: var(--dds-font-weight-medium)).
 * @cssproperty --dds-link-bold-font-weight - The font weight of the bold link (default: var(--dds-font-weight-bold)).
 *
 * @cssproperty --dds-link-no-underline-text-decoration - The text decoration when underline is removed (default: none).
 */
export default class DapDSLink extends DdsElement {
    static tagName: string;
    /** The size of the link
     * @type {'lg' | 'md' | 'sm' | 'xs'}
     */
    size?: LinkSize;
    /** The theme of the link
     * @type {'neutral' | 'brand' | 'inverted' | 'warning'}
     */
    variant: LinkVariant;
    /** The target of the link.
     * @type {'_blank' | '_self' | '_parent' | '_top'}
     */
    target: LinkTarget;
    /** Bold link style */
    bold: boolean;
    /** Removes underline style */
    noUnderline: boolean;
    /** The href / URL of the link */
    href: string;
    /** Disabled state of the link */
    disabled: boolean;
    /** The rel of the link */
    rel: string;
    /** The download attribute of the link */
    download: boolean;
    /** The text for the target blank link, applicable when target is _blank. PRO TIP: Use parenthesis to wrap the text */
    targetBlankText: string;
    static readonly styles: import('lit').CSSResult;
    private hasLink;
    private _getLinkElement;
    private _handleLinkSlotChange;
    private handleClick;
    focus(): void;
    render(): import('lit-html').TemplateResult;
}