UNPKG

@synergy-design-system/components

Version:

This package provides the base of the Synergy Design System as native web components. It uses [lit](https://www.lit.dev) and parts of [shoelace](https://shoelace.style/). Synergy officially supports the latest two versions of all major browsers (as define

40 lines (39 loc) 1.47 kB
/** * --------------------------------------------------------------------- * 🔒 AUTOGENERATED BY VENDORISM * Removing this comment will prevent it from being managed by it. * --------------------------------------------------------------------- */ import SynergyElement from '../../internal/synergy-element.js'; import SynIconButton from '../icon-button/icon-button.component.js'; import type { CSSResultGroup } from 'lit'; /** * @summary Tags are used as labels to organize things or to indicate a selection. * @documentation https://synergy-design-system.github.io/?path=/docs/components-syn-tag--docs * @status stable * @since 2.0 * * @dependency syn-icon-button * * @slot - The tag's content. * * @event syn-remove - Emitted when the remove button is activated. * * @csspart base - The component's base wrapper. * @csspart content - The tag's content. * @csspart remove-button - The tag's remove button, an `<syn-icon-button>`. * @csspart remove-button__base - The remove button's exported `base` part. */ export default class SynTag extends SynergyElement { static styles: CSSResultGroup; static dependencies: { 'syn-icon-button': typeof SynIconButton; }; private readonly localize; /** The tag's size. */ size: 'small' | 'medium' | 'large'; /** Makes the tag removable and shows a remove button. */ removable: boolean; private handleRemoveClick; render(): import("lit").TemplateResult<1>; }