Dismissible tag component for displaying labels, categories, or filters. Renders as a list item with a label and...

Dismissible tag component for displaying labels, categories, or filters. Renders as a list item with a label and dismiss button. Tags are commonly used in search filters, tag inputs, and categorization UIs where users can remove items by clicking the close icon. ### Behavior When dismissed (close icon clicked), the tag hides itself by setting the `dismissed` property. Parent applications can listen for state changes via property observation or handle removal logic externally. ### Common usage - Search filter tags - Tag input fields - Categorization/labeling interfaces - Removable chips or tokens ### Note Tags are meant to be rendered inside a list (`<ul>` or `<ol>`). Each tag is a list item (`<li>`) for proper semantic HTML.

<ed-tag></ed-tag>

Properties

Name Type Default Description
dismissed Boolean boolean Dismissible tag component for displaying labels, categories, or filters. Renders as a list item with a label and dismiss button. Tags are commonly used in search filters, tag inputs, and categorization UIs where users can remove items by clicking the close icon. ### Behavior When dismissed (close icon clicked), the tag hides itself by setting the `dismissed` property. Parent applications can listen for state changes via property observation or handle removal logic externally. ### Common usage - Search filter tags - Tag input fields - Categorization/labeling interfaces - Removable chips or tokens ### Note Tags are meant to be rendered inside a list (`<ul>` or `<ol>`). Each tag is a list item (`<li>`) for proper semantic HTML. / export class EdTag extends EdElement { static get styles() { return unsafeCSS(styles.toString()); } /** Dismissed state. When true, the tag is hidden from view. Set internally when the user clicks the dismiss button.
text String string The tag label text displayed to the user.

Interactive Documentation

Full interactive examples, variant previews, accessibility audits, and the complete API reference are available in Storybook — generated directly from the component source code.

Source

packages/eddie-web-components/components/tag/tag.ts