You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Added a configurable bottom sheet for dialogs and mobile experiences, with accessible headers, body and footer sections, and controls for opening, closing, collapsing, and dismissing.
Added drag-to-close and snap-point behavior, plus options for backdrop, scrolling, focus, sizing, and docked layouts.
Added guidance and interactive examples for using and configuring sheets.
The PR adds a standalone bottom-sheet component to the overlay package. It provides configurable content, accessible trigger and close controls, focus and overlay behavior, dragging, snap points, and header, body, and footer components. It also adds tests, Storybook examples, translations, and usage guidance.
Changes: Sheet component
Layer / File(s)
Summary
Public API and responsive configuration src/tedi/components/overlay/index.ts, src/tedi/components/overlay/sheet/index.ts, src/tedi/components/overlay/sheet/sheet-content.directive.ts, src/tedi/components/overlay/sheet/sheet-trigger.directive.ts, src/tedi/components/overlay/sheet/sheet-close.directive.ts, src/tedi/services/breakpoint/breakpoint.service.ts, src/tedi/services/breakpoint/breakpoint.service.spec.ts, src/tedi/services/translation/translations.ts, skills/tedi-angular/references/components.md
The overlay exports the sheet APIs. The content directive adds inputs for accessibility, focus, sizing, padding, mounting, and snap points. BreakpointService resolves breakpoint-based input values. Translations and component usage guidance are added.
Overlay lifecycle and drag behavior src/tedi/components/overlay/sheet/sheet.component.ts, src/tedi/components/overlay/sheet/sheet.component.html, src/tedi/components/overlay/sheet/sheet.component.scss, src/tedi/components/overlay/sheet/sheet.component.spec.ts
SheetComponent manages open and collapsed state, overlay attachment, focus, dismissal, pointer dragging, and snap points. The template and styles render the overlay and panel. Tests cover lifecycle, accessibility, dismissal, docked mode, collapse, dragging, and snapping.
The header supports default and custom content, title levels, collapse controls, and close controls. The body and footer add padding, alignment, and collapsed-state behavior. Stories demonstrate sheet configurations and interaction patterns.
sequenceDiagram
actor User
participant SheetTriggerDirective
participant SheetComponent
participant CDKOverlay
participant FocusTrap
User->>SheetTriggerDirective: Click trigger
SheetTriggerDirective->>SheetComponent: Toggle open state
SheetComponent->>CDKOverlay: Attach sheet template
SheetComponent->>FocusTrap: Configure focus after rendering
User->>SheetComponent: Close sheet
SheetComponent->>CDKOverlay: Detach after closing delay
Loading
Possibly related issues
TEDI-Design-System/angular issue 828: The PR adds the Sheet component referenced by the mobile-overlay requirement. This diff does not show TableOfContents or Pagination integration.
Closing sheet controls can briefly remain reachable by keyboard and assistive technology. Make the closing panel inert; otherwise the change is mergeable with this bounded accessibility risk understood.
Pre-merge checks: 5
Check name
Status
Explanation
Description Check
Check skipped - CodeRabbit’s high-level summary is enabled.
Title check
The title clearly identifies the main change: adding a new TEDI-Ready sheet component. The feat(sheet) scope is concise and relevant.
Docstring Coverage
No eligible functions found in the changed files. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff with cyclomatic complexity of at least 2. Documentat…
Linked Issues check
Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check
Check skipped because no linked issues were found for this pull request.
Full details: Docstring Coverage
Explanation
No eligible functions found in the changed files. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff with cyclomatic complexity of at least 2. Documentation-only edits and deletions within surviving functions are included; unchanged diff context and fully deleted functions are excluded. Analyzed 0 functions across 15 files. (4 skipped: 4 unsupported.)
Finishing Touches
Generate docstrings
Commit to this branch
Create a new PR
Generate unit tests (beta)
Commit to this branch
Create a new PR
Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts
Tip
🎯 Customize your risk assessments
Guide how CodeRabbit assesses merge risk and security architecture risk. Highlight sensitive changes and explain your security boundaries using Merge Risk Instructions and Security Risk Instructions in your review settings. Security architecture risk assessments require the Advanced plan or above.
✅ Automatic approvals, with your rules
Let CodeRabbit approve pull requests once required threads are resolved, pre-merge checks pass, and your risk limits are met. Enable Automatic approvals in review settings, with overrides for teams or file paths.
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.
Included review availability: This review used your included allowance. Your plan provides up to 1 included review per hour; 0 remain after this review.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
GitHub Actions
Inactive
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
Summary by CodeRabbit