import { LinkTarget } from '../../common/types'; import { DdsElement } from '../../internal/dds-hu-element.js'; /** * `dap-ds-breadcrumb-item` custom element. * @element dap-ds-breadcrumb-item * @summary A breadcrumb item is a secondary navigation scheme that reveals the user's location in a website or Web application. * @title - Breadcrumb item * @group breadcrumb * * @slot - The content of the breadcrumb item. * @slot separator - The separator between breadcrumb items. Default is an arrow-right-s-line icon. * * @csspart base - The main breadcrumb item container. The li element. * @csspart link - The link of the breadcrumb item. The dds-link component. * @csspart link-base - The base part of the link part. The dds-link components base part. * @csspart item-nolink - The item of the breadcrumb item without a link. The span element. * @csspart separator - The separator of the breadcrumb item. * * @cssproperty --dds-breadcrumb-item-display - The display property of the breadcrumb item (default: inline-flex) * @cssproperty --dds-breadcrumb-item-flex-wrap - The flex-wrap property of the breadcrumb item (default: nowrap) * @cssproperty --dds-breadcrumb-item-align-items - The align-items property of the breadcrumb item (default: center) * @cssproperty --dds-breadcrumb-item-color - The text color of the breadcrumb item (default: var(--dds-text-neutral-base)) * @cssproperty --dds-breadcrumb-item-transition - The transition property for the breadcrumb item (default: all 0.2s ease-in-out) * @cssproperty --dds-breadcrumb-item-gap - The gap between the breadcrumb item and the separator (default: var(--dds-spacing-200)) * @cssproperty --dds-breadcrumb-item-padding - The padding of the breadcrumb item (default: var(--dds-spacing-200)) * @cssproperty --dds-breadcrumb-item-font-size - The font size of the breadcrumb item (default: var(--dds-font-sm)) * @cssproperty --dds-breadcrumb-item-font-weight - The font weight of the breadcrumb item (default: var(--dds-font-weight-medium)) * @cssproperty --dds-breadcrumb-item-font-weight-bold - The bold font weight of the breadcrumb item (default: var(--dds-font-weight-bold)) * @cssproperty --dds-breadcrumb-item-separator-color - The color of the separator (default: var(--dds-text-neutral-disabled)) * @cssproperty --dds-breadcrumb-item-link-color - The color of the link (default: var(--dds-link-neutral-enabled)) * @cssproperty --dds-breadcrumb-item-inverted-color - The text color when inverted (default: var(--dds-text-neutral-inverted)) * @cssproperty --dds-breadcrumb-item-inverted-link-color - The link color when inverted (default: var(--dds-text-neutral-inverted)) */ export default class DapDSBreadcrumbItem extends DdsElement { /** The URL of the breadcrumb item. */ href?: string; /** The target of the breadcrumb item. * @type {'_blank' | '_self' | '_parent' | '_top'} */ target?: LinkTarget; /** The rel of the breadcrumb item link. */ rel: string; /** Whether the breadcrumb item is disabled. */ disabled: boolean; /** The variant of the breadcrumb item. * @type {'normal' | 'inverted'} */ variant: string; static readonly styles: import('lit').CSSResult; render(): import('lit-html').TemplateResult<1>; private _shouldIncludeRel; }