dap-design-system
Version:
Official design system for the DÁP (dap.gov.hu)
37 lines (36 loc) • 1.76 kB
TypeScript
import { DdsElement } from '../../internal/dds-hu-element';
import { default as DapDSLink } from '../link/link.component';
import { TypographyVariant } from '../typography/typography.component';
export type HeadingVariant = Extract<TypographyVariant, 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'>;
/**
* `dap-ds-anchor-heading`
* @summary Anchor heading is a heading with an anchor link.
* @element dap-ds-anchor-heading
* @title - Anchor heading
*
* @attribute {'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6'} variant - The variant of the heading. Default is `h2`. Can be `h1`, `h2`, `h3`, `h4`, `h5`, or `h6`.
* @attribute {string} label - The label of the heading.
*
* @csspart base - The main anchor heading container.
* @csspart link - The link of the anchor heading. dap-ds-link element.
* @csspart link-base - The base of the link part.
* @csspart text - The text of the anchor heading.
*
* @cssproperty --dds-anchor-link-color - The color of the anchor link (default: var(--dds-color-primary))
* @cssproperty --dds-anchor-link-opacity - The opacity of the anchor link when not hovered (default: 0)
* @cssproperty --dds-anchor-link-hover-opacity - The opacity of the anchor link when hovered (default: 1)
* @cssproperty --dds-anchor-link-transition - The transition property for the anchor link opacity (default: opacity 0.2s ease-in-out)
*/
export default class DapDSAnchorHeading extends DdsElement {
static tagName: string;
static dependencies: {
'dap-ds-link': typeof DapDSLink;
};
variant: HeadingVariant;
label: string;
static readonly styles: import('lit').CSSResult[];
createRenderRoot(): this;
get elementId(): string;
get anchorTitle(): string;
render(): import('lit-html').TemplateResult;
}