feat(label-row,info-tooltip): new components #515 by mart-sessman · Pull Request #525 · TEDI-Design-System/angular

mart-sessman · 2026-07-06T07:19:52Z

New input: added hideOnScroll to Select
updated label stories to use label-row and info-tooltip

Summary by CodeRabbit

New Features
- Added tedi-label-row for inline label layouts with projected trailing siblings.
- Added tedi-info-tooltip with configurable position, open behavior, max width, color, and ariaLabel.
- Enhanced tedi-select with hideOnScroll to close the dropdown on page scroll.
- Enabled formatted tedi-select tooltip templates via tediSelectTooltip (template takes precedence over the tooltip string).
Documentation
- Updated component references and Storybook examples to reflect the new label row + info tooltip pattern and select tooltip/scroll behavior.
Tests
- Added and expanded unit tests covering tedi-label-row, tedi-info-tooltip, tooltip template precedence, and hideOnScroll.

* New input: added hideOnScroll to Select * updated label stories to use label-row and info-tooltip

coderabbitai · 2026-07-06T07:20:11Z

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro

Run ID: 4b39e587-e74c-4e09-b22b-244aa4e9bd80

📥 Commits

Reviewing files that changed from the base of the PR and between 77a9d72 and afe4995.

📒 Files selected for processing (1)

tedi/components/form/select/select.stories.ts

📝 Walkthrough

Walkthrough

Adds standalone LabelRow and InfoTooltip components, integrates them into select labels and tooltips, adds projected tooltip templates and a hideOnScroll dropdown option, and updates related tests, Storybook examples, and reference documentation.

Changes

LabelRow, InfoTooltip, and select integration

Layer / File(s)	Summary
LabelRow component implementation `tedi/components/form/label-row/*`, `tedi/components/form/index.ts`	Adds `LabelRowComponent` with projected content, inline-flex layout, public re-exports, and unit tests.
InfoTooltip component implementation `tedi/components/overlay/info-tooltip/*`, `tedi/components/overlay/index.ts`	Adds `InfoTooltipComponent` with tooltip primitives, configurable inputs, styling, tests, public re-exports, and Storybook stories.
Select label and tooltip rendering `tedi/components/form/select/select-templates.directive.ts`, `tedi/components/form/select/select.component.*`	Adds projected tooltip template support, switches select label markup to `tedi-label-row`, uses `tedi-info-tooltip`, and tests template precedence.
Select hideOnScroll behavior `tedi/components/form/select/select.component.*`, `tedi/components/form/select/select.stories.ts`	Adds the `hideOnScroll` input, scroll listener setup and cleanup, destroy teardown, tests, and Storybook controls.
Stories and reference documentation `tedi/components/form/label/label.stories.ts`, `tedi/components/form/select/select.stories.ts`, `skills/tedi-angular/references/components.md`	Updates component examples and documents LabelRow, InfoTooltip, formatted select tooltips, and hideOnScroll.

Estimated code review effort: 3 (Moderate) | ~25 minutes

Sequence Diagram(s)

sequenceDiagram
  participant HostTemplate
  participant SelectTooltipTemplateDirective
  participant SelectComponent
  participant InfoTooltipComponent
  HostTemplate->>SelectTooltipTemplateDirective: project ng-template with tediSelectTooltip
  SelectTooltipTemplateDirective->>SelectComponent: expose TemplateRef through tooltipTemplate
  SelectComponent->>InfoTooltipComponent: render tooltip shell and projected content
  HostTemplate->>SelectComponent: provide tooltip string or projected template

sequenceDiagram
  participant User
  participant SelectComponent
  participant Document
  User->>SelectComponent: openDropdown
  SelectComponent->>Document: register scroll listener when hideOnScroll is enabled
  User->>Document: scroll
  Document->>SelectComponent: dispatch scroll event
  SelectComponent->>SelectComponent: closeDropdown
  SelectComponent->>Document: remove scroll listener

Possibly related PRs

TEDI-Design-System/angular#343: Introduces the select component behavior extended by this PR.
TEDI-Design-System/angular#509: Contains related select label tooltip changes.

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title correctly highlights the main change: adding the new label-row and info-tooltip components.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

Create stacked PR
Commit on current branch

🧪 Generate unit tests (beta)

Create PR with unit tests
Commit unit tests in branch feat/515-label-tooltip-support

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

_{Comment @coderabbitai help to get the list of available commands.}

codecov · 2026-07-06T07:24:08Z

Codecov Report

✅ All modified and coverable lines are covered by tests.

📢 Thoughts on this report? Let us know!

# [7.1.0-rc.10](angular-7.1.0-rc.9...angular-7.1.0-rc.10) (2026-07-23) ### Features * **label-row,info-tooltip:** new components [#515](#515) ([#525](#525)) ([1e33865](1e33865))

# [7.1.0](angular-7.0.1...angular-7.1.0) (2026-08-06) ### Bug Fixes * **date-field:** changed min and max date defaults, exposed inputs [#590](#590) ([#591](#591)) ([30edbb3](30edbb3)) * **date-field:** date-field now passes value correctly to text-field [#592](#592) ([#593](#593)) ([5bc496e](5bc496e)) * **date-picker:** fix DatePicker focus ring [#560](#560) ([#574](#574)) ([17f675d](17f675d)) * **dropdown:** skip close on certain events [#544](#544) ([#545](#545)) ([f9be659](f9be659)) * **form-field,date-field,text-field,time-field:** value no longer cuts early [#561](#561) ([#571](#571)) ([17322fc](17322fc)) * **pagination:** community pagination results rendered twice [#548](#548) ([2ba2bb3](2ba2bb3)) * **popover,search,header:** fix Header a11y violations and document HeaderTop [#601](#601) ([#602](#602)) ([86312a9](86312a9)) * **popover:** fixed popover outside-click inside modal being registered as inside [#582](#582) ([#583](#583)) ([139406b](139406b)) * **select,dropdown,popover:** hideOnScroll no longer closes overlay when scrolling its content [#562](#562) ([#567](#567)) ([3120825](3120825)) * **select:** keep typed text and tags in view while searching [#566](#566) ([#584](#584)) ([6afc148](6afc148)) * **select:** truncate over-wide tags in a single row [#586](#586) ([#598](#598)) ([68dcb27](68dcb27)) * **table:** scrollable table now scrolls top on page change [#549](#549) ([#550](#550)) ([9771fc3](9771fc3)) * **tabs:** added anchor support [#594](#594) ([#597](#597)) ([c9a3a98](c9a3a98)) * **text-field,time-field:** caret no longer clipped at the start of the input [#575](#575) ([#576](#576)) ([644d3f5](644d3f5)) * **text-field:** support bare disabled attribute via booleanAttribute transform [#558](#558) ([#559](#559)) ([fad56f8](fad56f8)) * **textgroup:** label doesn't shrink when width is fixed [#506](#506) ([#531](#531)) ([4e9d713](4e9d713)) ### Features * **breadcrumbs:** new TEDI-ready component [#512](#512) ([#518](#518)) ([6691cd2](6691cd2)) * **date-field:** added hideOnScroll [#563](#563) ([#595](#595)) ([0dfad0f](0dfad0f)) * **header:** add Header top [#311](#311) ([#504](#504)) ([1e2eff2](1e2eff2)) * **info-button:** focus ring offset reduced [#517](#517) ([#521](#521)) ([b7d06d3](b7d06d3)) * **input-group:** new TEDI-ready component [#18](#18) ([#532](#532)) ([c1728c0](c1728c0)) * **label-row,info-tooltip:** new components [#515](#515) ([#525](#525)) ([1e33865](1e33865)) * **popover:** add Header popover variant under Popover [#442](#442) ([#523](#523)) ([a668b55](a668b55)) * **search:** add new TEDI-ready component [#524](#524) ([#539](#539)) ([f637542](f637542)) * **select:** added virtual scroll [#552](#552) ([#553](#553)) ([26e10ee](26e10ee)) * **slider:** new TEDI-ready component [#3](#3) ([#526](#526)) ([d2bf13a](d2bf13a)) * **table:** added getRowId and clearFilters [#565](#565) ([#589](#589)) ([1cf94a1](1cf94a1))

feat(label-row,info-tooltip): new components #515

604db06

* New input: added hideOnScroll to Select * updated label stories to use label-row and info-tooltip

mart-sessman requested a review from ly-tempel-bitweb July 6, 2026 07:19

mart-sessman had a problem deploying to github-pages July 6, 2026 07:21 — with GitHub Actions Failure

mart-sessman temporarily deployed to github-pages July 6, 2026 07:22 — with GitHub Actions Inactive

ly-tempel-bitweb reviewed Jul 8, 2026

View reviewed changes

Comment thread tedi/components/form/label/label.stories.ts Outdated

Comment thread tedi/components/overlay/info-tooltip/info-tooltip.stories.ts Outdated

feat(label-row,info-tooltip): story translate #515

3a4e059

mart-sessman temporarily deployed to github-pages July 8, 2026 11:53 — with GitHub Actions Inactive

mart-sessman requested a review from ly-tempel-bitweb July 8, 2026 11:56

feat(select): tooltip content template #515

77a9d72

mart-sessman temporarily deployed to github-pages July 9, 2026 06:05 — with GitHub Actions Inactive

ly-tempel-bitweb reviewed Jul 9, 2026

View reviewed changes

Comment thread tedi/components/form/select/select.stories.ts

chore: updated Select stories #515

afe4995

mart-sessman temporarily deployed to github-pages July 14, 2026 08:21 — with GitHub Actions Inactive

mart-sessman requested a review from ly-tempel-bitweb July 17, 2026 06:12

ly-tempel-bitweb approved these changes Jul 23, 2026

View reviewed changes

ly-tempel-bitweb linked an issue Jul 23, 2026 that may be closed by this pull request

[Label]: add tooltip support #515

Closed

ly-tempel-bitweb merged commit 1e33865 into rc Jul 23, 2026
22 checks passed

ly-tempel-bitweb deleted the feat/515-label-tooltip-support branch July 23, 2026 07:11

This was referenced Jul 28, 2026

fix(select,dropdown,popover): hideOnScroll no longer closes overlay when scrolling its content #562 #567

Merged

fix(select): keep typed text and tags in view while searching #566 #584

Merged

Navigation Menu

Uh oh!

feat(label-row,info-tooltip): new components #515 - #525

feat(label-row,info-tooltip): new components #515#525
ly-tempel-bitweb merged 4 commits into
rcfrom
feat/515-label-tooltip-support

mart-sessman commented Jul 6, 2026 •

edited by coderabbitai Bot

Loading

Uh oh!

coderabbitai Bot commented Jul 6, 2026 •

edited

Loading

Walkthrough

Changes

Sequence Diagram(s)

Uh oh!

codecov Bot commented Jul 6, 2026

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

Uh oh!

Conversation

mart-sessman commented Jul 6, 2026 • edited by coderabbitai Bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by CodeRabbit

Uh oh!

coderabbitai Bot commented Jul 6, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Walkthrough

Changes

Sequence Diagram(s)

Uh oh!

codecov Bot commented Jul 6, 2026

Codecov Report

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

2 participants

mart-sessman commented Jul 6, 2026 •

edited by coderabbitai Bot

Loading

coderabbitai Bot commented Jul 6, 2026 •

edited

Loading