patternfly / patternfly/patternfly-react

Truncate - Update Truncate to pass in custom `tooltipContent`.

Offen
#12,033 3 Kommentare 0 Reaktionen 0 zugewiesene Personen Auf GitHub ansehen

Dieses Issue hat noch niemand übernommen.

Stale
Vorherrschende Sprache
TypeScript
Sterne
862
Forks
392
Ø Merge
4 T. 8 Std.
Gemergte PRs (30 T.)
9

Beschreibung

Is this a new component or an extension of an existing one?
The existing component is the [Truncate /] component.

Describe the feature
The feature is an enhancement to the PatternFly [Truncate /] component that allows a developer to customize or override the content of the tooltip that the component automatically provides.

Any other information?
The existing [Truncate /] component automatically adds a tooltip that displays the full, un-truncated text when the user hovers over the truncated element. This creates an issue when the developer needs to provide a custom tooltip (like one with a description and the full name) because it results in two tooltips appearing simultaneously. This blocks RHCLOUD-41396

The expected behavior is to add a new prop to [Truncate /]}}—perhaps called {{tooltipContent or a function prop that overrides it—that accepts either a string or an element as its value. When this new prop is used, the [Truncate /] component should display the custom content in its tooltip instead of the default un-truncated text. This allows for a single, customized tooltip to be shown when the text is truncated.

Are there visuals for this feature? If applicable, please include examples for each state and for varying widths
Include screenshots or links to Marvel or other mockups.

Example in use:

image


Jira Issue: PF-2757

Beitragsleitfaden

Beitragsleitfaden öffnen

Erste Schritte

  1. Lies das ganze Issue und danach den Beitragsleitfaden des Projekts.
  2. Schreib ins Issue, dass du es übernimmst — das erspart doppelte Arbeit.
  3. Forke das Repository und arbeite in einem Branch.
  4. Öffne einen Pull Request, der die Issue-Nummer nennt.

Rechercherichtung

Lokalisieren Sie die vorhandene PatternFly Truncate-Komponente und ihre Tests und lesen Sie anschließend, wie der automatische Tooltip derzeit konfiguriert ist. Fügen Sie die angeforderte API für benutzerdefinierte Tooltip-Inhalte für Werte vom Typ string oder element hinzu, und verifizieren Sie, dass benutzerdefinierte Inhalte den standardmäßigen vollständigen Text ersetzen, ohne zwei Tooltips zu erzeugen.

Vom Indexierungsmodell aus dem Issue-Text verfasst.

Bewertung

Tech-Stack
react, typescript
Bereich
frontend
Issue-Typ
Feature
Schwierigkeit
3/5
Geschätzter Aufwand
1-2 Tage
Aktivitätsstatus
Ruhig
Klarheit
Größtenteils klar
Anfängerfreundlichkeit
68/100

Neue Issues direkt in Ihr Postfach

Eine kurze Übersicht über anfängerfreundliche GitHub-Issues.