dap-design-system
Version:
Official design system for the DÁP (dap.gov.hu)
51 lines (50 loc) • 3.36 kB
TypeScript
import { EventName } from '@lit/react';
import { default as Component } from '../../components/official-website-banner/official-website-banner.js';
import { DdsOpenedEvent, DdsClosedEvent } from '../../events/events';
export type { DdsOpenedEvent } from '../../events/events';
export type { DdsClosedEvent } from '../../events/events';
/**
* `dap-ds-official-website-banner`
* @element dap-ds-official-website-banner
* @summary An official website banner is a banner that displays that the website is an official website.
* @title - Official website-banner
*
* @property { 'sm' | 'lg' } size - The size of the official website banner. Default is `sm`.
* @property {string} heading - The heading text of the accordion, this will be used as the aria label of the heading also if ariaLabel is not provided
* @property { 1 | 2 | 3 | 4 | 5 | 6 } headingLevel - The heading level of the accordion. Default is `4`.
* @property {boolean} opened - Whether the accordion is opened. Default is `false`.
* @property { 'left' | 'right' } iconLocation - The location of the icon. Default is `right`.
* @property { 'default' | 'collapsed' | 'clean' | 'clean-collapsed' } variant - The variant of the accordion.
* @property {boolean} lastItem - Whether the accordion is the last item.
*
* @event {{ void }} dds-opened - Event fired when the accordion is opened.
* @event {{ void }} dds-closed - Event fired when the accordion is closed.
*
* @slot default - The content of the accordion.
* @slot heading - The heading of the accordion.
* @slot icon-opened - The icon when the accordion is opened.
* @slot icon-closed - The icon when the accordion is closed.
*
* @csspart base - The main accordion container.
* @csspart heading - The heading of the accordion.
* @csspart button - The button of the accordion.
* @csspart content - The content of the accordion.
* @csspart content-container - The container of the accordion content.
* @csspart icon-wrapper - The icon wrapper of the accordion.
* @csspart open-icon - The icon when the accordion is opened.
* @csspart open-icon-base - The base of the icon when the accordion is opened.
* @csspart close-icon - The icon when the accordion is closed.
* @csspart close-icon-base - The base of the icon when the accordion is closed.
*
* @cssproperty --dds-official-banner-background-color - The background color of the official website banner (default: var(--dds-background-brand-medium-inverted))
* @cssproperty --dds-official-banner-text-color - The text color of the official website banner (default: var(--dds-text-neutral-on-inverted))
* @cssproperty --dds-official-banner-heading-hover-color - The heading hover color of the official website banner (default: var(--dds-background-brand-medium-inverted))
* @cssproperty --dds-official-banner-border-radius - The border radius of the official website banner (default: 0)
* @cssproperty --dds-official-banner-icon-color - The icon color of the official website banner (default: var(--dds-text-neutral-on-inverted))
* @cssproperty --dds-official-banner-icon-color-hover - The icon hover color of the opener icon official website banner (default: var(--dds-text-neutral-on-inverted))
*/
declare const reactWrapper: import('@lit/react').ReactWebComponent<Component, {
onDdsOpened: EventName<DdsOpenedEvent>;
onDdsClosed: EventName<DdsClosedEvent>;
}>;
export default reactWrapper;