Skip to content

chore(Kb): kb for add tooltip to each chip in chiplist #3082

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: master
Choose a base branch
from

Conversation

Tsvetomir-Hr
Copy link
Contributor

No description provided.

@Tsvetomir-Hr Tsvetomir-Hr self-assigned this Jul 2, 2025
@Tsvetomir-Hr Tsvetomir-Hr added the merge-to-production Use this label to get a comment to choose whether to merge the PR to production label Jul 2, 2025
@Tsvetomir-Hr Tsvetomir-Hr requested a review from a team as a code owner July 2, 2025 13:47
Copy link
Contributor

github-actions bot commented Jul 2, 2025

Hello @Tsvetomir-Hr,

Check the below option if you would like to automatically generate PR to production. The automation uses the branch for the cherry-pick, and then will delete the branch. Please, do not delete it manually.

  • create PR to production

@@ -0,0 +1,84 @@
---
title: Adding Tooltips for Chips in a ChipList
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Consider "Add" instead of "Adding". You don't google with "-ing"


## Description

You can display additional information for each chip in the [ChipList](slug:chiplist-overview) by showing a tooltip. This approach helps you keep the chip text concise while providing more details on hover.
Copy link
Contributor

@dimodi dimodi Jul 3, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can also link to the Tooltip Overview here.

Suggested change
You can display additional information for each chip in the [ChipList](slug:chiplist-overview) by showing a tooltip. This approach helps you keep the chip text concise while providing more details on hover.
You can display additional information for each chip in the [ChipList](slug:chiplist-overview) by showing a Tooltip. This approach helps you keep the chip text concise while providing more details on hover.


## Solution

To add tooltips to chips in the ChipList, use the `ItemTemplate` to customize chip rendering and set a tooltip for each chip. Follow these steps:
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Link to ChipList Templates here.

public class ChipModel
{
public string Text { get; set; }
public ISvgIcon Icon { get; set; }
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

You can make this compatible with both SVG and Font icons.

Suggested change
public ISvgIcon Icon { get; set; }
public object? Icon { get; set; }

page_title: How to Display Tooltips for Chips in Telerik Blazor ChipList
meta_title: How to Display Tooltips for Chips in Telerik Blazor ChipList
slug: add-tooltips-chips-chiplist
tags: blazor, chiplist, tooltip, itemtemplate
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Suggested change
tags: blazor, chiplist, tooltip, itemtemplate
tags: blazor, chiplist, tooltip, template

type: how-to
page_title: How to Display Tooltips for Chips in Telerik Blazor ChipList
meta_title: How to Display Tooltips for Chips in Telerik Blazor ChipList
slug: add-tooltips-chips-chiplist
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The slug is normally the same as the md file, but there is -kb- between the main component name and the rest.

Suggested change
slug: add-tooltips-chips-chiplist
slug: chiplist-kb-add-chip-tooltips

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
merge-to-production Use this label to get a comment to choose whether to merge the PR to production
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants