feat(date-time-field): new tedi-ready component #507 - #522
Conversation
|
Warning Review limit reached
Next review available in: 53 minutes Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available. How can I continue?After more reviews become available, a review can be triggered using the To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews. How do review limits work?CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability. For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window. Please refer docs for additional details. Review details⚙️ Run configurationConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (3)
📝 WalkthroughWalkthroughAdds a standalone ChangesDateTimeField feature
Estimated code review effort: 4 (Complex) | ~60 minutes Sequence Diagram(s)sequenceDiagram
participant User
participant DateTimeFieldComponent
participant Calendar
participant TimePicker
participant FormControl
User->>DateTimeFieldComponent: Open picker
DateTimeFieldComponent->>Calendar: Render current date or range
Calendar->>DateTimeFieldComponent: Return date selection
DateTimeFieldComponent->>TimePicker: Render available times
TimePicker->>DateTimeFieldComponent: Return time selection
DateTimeFieldComponent->>FormControl: Commit date-time value
Possibly related PRs
Suggested reviewers: 🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✨ Finishing Touches🧪 Generate unit tests (beta)
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. Comment |
Codecov Report❌ Patch coverage is
📢 Thoughts on this report? Let us know! |
GitHub Actions
Inactive
GitHub Actions
Inactive
![coderabbitai[bot]](https://avatars.githubusercontent.com/in/347564?s=60&v=4){kind=small}
There was a problem hiding this comment.
Actionable comments posted: 5
🧹 Nitpick comments (2)
tedi/components/form/date-time-field/date-time-field.stories.ts (2)
327-333: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winAdd a breakpoint-specific responsive story.
The current
Modalstory only demonstratesmodal: true; add a story using a breakpoint value such asmodal: "md"orfullscreen: "sm"to demonstrate the responsive behavior.As per path instructions, stories with breakpoint-driven props must include at least one responsive demonstration story.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@tedi/components/form/date-time-field/date-time-field.stories.ts` around lines 327 - 333, The Modal story currently demonstrates only the boolean modal state; add a separate breakpoint-specific story using a responsive prop value such as modal: "md" or fullscreen: "sm", with suitable args to visibly demonstrate the responsive behavior.Source: Path instructions
120-148: 📐 Maintainability & Code Quality | 🔵 Trivial | ⚡ Quick winDefine argTypes for every public input and model.
The current configuration omits several exposed inputs, including
inputId,placeholder,size,slotColumns,selectionLevel,localeCode,inputDisabled,readOnly,required, constraint flags, and the modal/native-picker options. Add argTypes for them or explicitly disable entries that are intentionally controlled only through the form wrapper.As per path instructions, Storybook stories must define argTypes for every public input/model.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@tedi/components/form/date-time-field/date-time-field.stories.ts` around lines 120 - 148, Expand the date-time field story’s argTypes configuration to cover every public input and model, including inputId, placeholder, size, slotColumns, selectionLevel, localeCode, inputDisabled, readOnly, required, constraint flags, and modal/native-picker options. For any values intentionally managed only by the form wrapper, add explicit disabled argTypes entries instead of omitting them; update the argTypes object alongside the existing mode, layout, and timeGridVariant definitions.Source: Path instructions
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Inline comments:
In `@skills/tedi-angular/references/components.md`:
- Line 1041: Update the model documentation to use the exported
DateTimeFieldValue alias instead of Date | DateRange | null, and explicitly
state that range values contain date-time values in both from and to.
In
`@tedi/components/form/date-time-field/date-time-field-modal/date-time-field-modal.component.html`:
- Line 64: Align the no-slot native time input conditions in the single-mode and
range-mode templates, or add a brief comment documenting the intentional
breakpoint asymmetry; update the checks near the single-mode condition and
range-mode condition so their behavior is explicit and consistent with the
intended desktop layout.
In `@tedi/components/form/date-time-field/date-time-field.component.ts`:
- Around line 607-658: Prevent the modal close subscription in openModal from
surviving component destruction. Inject or use the component DestroyRef with
Angular’s takeUntilDestroyed operator, pipe ref.closed through it before
subscribing, and retain the existing cleanup and result handling in the
callback.
In `@tedi/components/form/date-time-field/date-time-field.stories.ts`:
- Around line 25-32: Replace the `DateTimeFieldStoryArgs` intersection with an
explicit interface containing the raw Storybook values for every public
input/model, excluding component signals and instance members. Update `argTypes`
to cover all remaining public inputs/models, and add a responsive story
demonstrating the breakpoint-driven props.
In `@tedi/components/form/date-time-field/index.ts`:
- Around line 2-11: Add DayAvailabilityInput, MonthPredicate, and YearPredicate
to the type exports in the date-time-field barrel alongside the existing
DateTimeField types, sourcing them from date-time-field.component so consumers
can import these public input types from the entry point.
---
Nitpick comments:
In `@tedi/components/form/date-time-field/date-time-field.stories.ts`:
- Around line 327-333: The Modal story currently demonstrates only the boolean
modal state; add a separate breakpoint-specific story using a responsive prop
value such as modal: "md" or fullscreen: "sm", with suitable args to visibly
demonstrate the responsive behavior.
- Around line 120-148: Expand the date-time field story’s argTypes configuration
to cover every public input and model, including inputId, placeholder, size,
slotColumns, selectionLevel, localeCode, inputDisabled, readOnly, required,
constraint flags, and modal/native-picker options. For any values intentionally
managed only by the form wrapper, add explicit disabled argTypes entries instead
of omitting them; update the argTypes object alongside the existing mode,
layout, and timeGridVariant definitions.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
Run ID: bd0adddb-010d-4075-819a-d13d15c22944
📒 Files selected for processing (17)
skills/tedi-angular/references/components.mdtedi/components/form/date-field/date-input/date-input.component.scsstedi/components/form/date-field/date-input/date-input.component.tstedi/components/form/date-time-field/date-time-field-modal/date-time-field-modal.component.htmltedi/components/form/date-time-field/date-time-field-modal/date-time-field-modal.component.scsstedi/components/form/date-time-field/date-time-field-modal/date-time-field-modal.component.spec.tstedi/components/form/date-time-field/date-time-field-modal/date-time-field-modal.component.tstedi/components/form/date-time-field/date-time-field.component.htmltedi/components/form/date-time-field/date-time-field.component.scsstedi/components/form/date-time-field/date-time-field.component.spec.tstedi/components/form/date-time-field/date-time-field.component.tstedi/components/form/date-time-field/date-time-field.stories.tstedi/components/form/date-time-field/date-time-field.util.tstedi/components/form/date-time-field/index.tstedi/components/form/form-field/form-field.component.htmltedi/components/form/index.tstedi/services/translation/translations.ts
|
|
||
| Form-control wrapper that pairs a typed text input with a popover holding the Calendar and a TimePicker. `side-by-side` shows both together; `multi-step` picks the date first, then advances to a separate time step. Setting `availableTimes` swaps the scroll-wheel for a grid of predefined slots. Supports `single` and `range` modes, a native `datetime-local` fallback, and a mobile modal. Like DateField it owns no label — compose with `tedi-form-field` + `tedi-label`. Inherits the same calendar options as DateField (`minDate`, `maxDate`, `disablePast`/`disableFuture`, `disabledMatchers`, `availableDays`/`unavailableDays`, `selectionLevel`, `monthYearSelectType`, `initialMonth`, `showOutsideDays`, `showWeekNumbers`). | ||
|
|
||
| **Model:** `value: Date | DateRange | null` (range carries a time on each end) |
There was a problem hiding this comment.
🗄️ Data Integrity & Integration | 🟡 Minor | ⚡ Quick win
Document the actual DateTimeFieldValue contract.
The component and stories use the exported DateTimeFieldValue type, but the documentation advertises DateRange, which can imply the calendar-only range shape. Use the public alias and explicitly describe the from/to values as date-times.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@skills/tedi-angular/references/components.md` at line 1041, Update the model
documentation to use the exported DateTimeFieldValue alias instead of Date |
DateRange | null, and explicitly state that range values contain date-time
values in both from and to.
| <span class="tedi-date-time-field-modal__heading"> | ||
| {{ data.timeHeading ?? ("date-time-field.time-heading" | tediTranslate) }} | ||
| </span> | ||
| @if (!singleSlots()?.length && useNativeTimeInput()) { |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟡 Minor | ⚡ Quick win
Inconsistent native time input condition between single and range modes.
Single mode (line 64) gates native time input on both !singleSlots()?.length && useNativeTimeInput() — i.e., no slots and below md breakpoint. Range mode (line 116) only checks !slots?.length — no slots regardless of breakpoint. On desktop with no predefined slots, single mode renders the scroll-wheel tedi-time-picker while range mode renders native <input type="time"> inputs. If this is intentional (e.g., two scroll-wheels are too wide), a brief comment explaining the asymmetry would help future maintainers.
Also applies to: 116-116
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In
`@tedi/components/form/date-time-field/date-time-field-modal/date-time-field-modal.component.html`
at line 64, Align the no-slot native time input conditions in the single-mode
and range-mode templates, or add a brief comment documenting the intentional
breakpoint asymmetry; update the checks near the single-mode condition and
range-mode condition so their behavior is explicit and consistent with the
intended desktop layout.
| private openModal(): void { | ||
| this.overlayOpen.set(true); | ||
| const data: DateTimeFieldModalData = { | ||
| value: this.value(), | ||
| currentMonth: this.currentMonth(), | ||
| mode: this.mode(), | ||
| selectionLevel: this.selectionLevel(), | ||
| localeCode: this.localeCode(), | ||
| showOutsideDays: this.showOutsideDays(), | ||
| showWeekNumbers: this.showWeekNumbers(), | ||
| numberOfMonths: this.numberOfMonthsResolved(), | ||
| monthYearSelectType: this.monthYearSelectType(), | ||
| required: this.required(), | ||
| disabledMatchers: this.resolvedDisabledMatchers(), | ||
| availableDays: this.availableDays(), | ||
| unavailableDays: this.unavailableDays(), | ||
| shouldDisableMonth: this.shouldDisableMonth(), | ||
| shouldDisableYear: this.shouldDisableYear(), | ||
| minuteStep: this.minuteStep(), | ||
| slotColumns: this.slotColumns(), | ||
| gridVariant: this.resolvedGridVariant(), | ||
| timeHeading: this.timeHeading(), | ||
| availableTimes: this.availableTimes(), | ||
| size: this.size(), | ||
| }; | ||
|
|
||
| const ref = this.modalService.open< | ||
| DateTimeFieldValue, | ||
| DateTimeFieldModalData | ||
| >(DateTimeFieldModalComponent, { | ||
| data, | ||
| size: "small", | ||
| // Non-preset width makes the overlay shrink-wrap its content, so the modal | ||
| // is exactly as wide as the calendar + time picker sit side-by-side on wide | ||
| // screens and collapses to the calendar's width once they stack (see the | ||
| // modal's responsive `__content` layout). `maxWidth` keeps it within the | ||
| // viewport on narrow screens. | ||
| width: "fit-content", | ||
| position: "center", | ||
| fullscreen: this.fullscreen(), | ||
| maxWidth: "95vw", | ||
| }); | ||
| this.modalRef = ref; | ||
|
|
||
| ref.closed.subscribe((result) => { | ||
| this.modalRef = null; | ||
| this.overlayOpen.set(false); | ||
| this.onTouched(); | ||
| if (result === undefined) return; | ||
| this.commitValue(result); | ||
| }); | ||
| } |
There was a problem hiding this comment.
🩺 Stability & Availability | 🟠 Major | ⚡ Quick win
Modal subscription leaks when the component is destroyed mid-flight.
ref.closed.subscribe() at line 651 is never unsubscribed. If the host component is removed (route change, @if toggle, parent destroy) while the modal is open, the subscription persists and the callback invokes this.overlayOpen.set(), this.onTouched(), and this.commitValue() on an already-destroyed component — risking runtime errors or silent signal writes.
🔒 Proposed fix using `takeUntilDestroyed`
import { ..., inject, ..., DestroyRef } from "`@angular/core`";
+import { takeUntilDestroyed } from "`@angular/core/rxjs-interop`";
// ...
private readonly breakpointService = inject(BreakpointService);
private readonly modalService = inject(ModalService);
private readonly hostEl = inject(ElementRef<HTMLElement>);
+ private readonly destroyRef = inject(DestroyRef);
// ...
this.modalRef = ref;
- ref.closed.subscribe((result) => {
+ ref.closed.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((result) => {
this.modalRef = null;
this.overlayOpen.set(false);
this.onTouched();
if (result === undefined) return;
this.commitValue(result);
});📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| private openModal(): void { | |
| this.overlayOpen.set(true); | |
| const data: DateTimeFieldModalData = { | |
| value: this.value(), | |
| currentMonth: this.currentMonth(), | |
| mode: this.mode(), | |
| selectionLevel: this.selectionLevel(), | |
| localeCode: this.localeCode(), | |
| showOutsideDays: this.showOutsideDays(), | |
| showWeekNumbers: this.showWeekNumbers(), | |
| numberOfMonths: this.numberOfMonthsResolved(), | |
| monthYearSelectType: this.monthYearSelectType(), | |
| required: this.required(), | |
| disabledMatchers: this.resolvedDisabledMatchers(), | |
| availableDays: this.availableDays(), | |
| unavailableDays: this.unavailableDays(), | |
| shouldDisableMonth: this.shouldDisableMonth(), | |
| shouldDisableYear: this.shouldDisableYear(), | |
| minuteStep: this.minuteStep(), | |
| slotColumns: this.slotColumns(), | |
| gridVariant: this.resolvedGridVariant(), | |
| timeHeading: this.timeHeading(), | |
| availableTimes: this.availableTimes(), | |
| size: this.size(), | |
| }; | |
| const ref = this.modalService.open< | |
| DateTimeFieldValue, | |
| DateTimeFieldModalData | |
| >(DateTimeFieldModalComponent, { | |
| data, | |
| size: "small", | |
| // Non-preset width makes the overlay shrink-wrap its content, so the modal | |
| // is exactly as wide as the calendar + time picker sit side-by-side on wide | |
| // screens and collapses to the calendar's width once they stack (see the | |
| // modal's responsive `__content` layout). `maxWidth` keeps it within the | |
| // viewport on narrow screens. | |
| width: "fit-content", | |
| position: "center", | |
| fullscreen: this.fullscreen(), | |
| maxWidth: "95vw", | |
| }); | |
| this.modalRef = ref; | |
| ref.closed.subscribe((result) => { | |
| this.modalRef = null; | |
| this.overlayOpen.set(false); | |
| this.onTouched(); | |
| if (result === undefined) return; | |
| this.commitValue(result); | |
| }); | |
| } | |
| private openModal(): void { | |
| this.overlayOpen.set(true); | |
| const data: DateTimeFieldModalData = { | |
| value: this.value(), | |
| currentMonth: this.currentMonth(), | |
| mode: this.mode(), | |
| selectionLevel: this.selectionLevel(), | |
| localeCode: this.localeCode(), | |
| showOutsideDays: this.showOutsideDays(), | |
| showWeekNumbers: this.showWeekNumbers(), | |
| numberOfMonths: this.numberOfMonthsResolved(), | |
| monthYearSelectType: this.monthYearSelectType(), | |
| required: this.required(), | |
| disabledMatchers: this.resolvedDisabledMatchers(), | |
| availableDays: this.availableDays(), | |
| unavailableDays: this.unavailableDays(), | |
| shouldDisableMonth: this.shouldDisableMonth(), | |
| shouldDisableYear: this.shouldDisableYear(), | |
| minuteStep: this.minuteStep(), | |
| slotColumns: this.slotColumns(), | |
| gridVariant: this.resolvedGridVariant(), | |
| timeHeading: this.timeHeading(), | |
| availableTimes: this.availableTimes(), | |
| size: this.size(), | |
| }; | |
| const ref = this.modalService.open< | |
| DateTimeFieldValue, | |
| DateTimeFieldModalData | |
| >(DateTimeFieldModalComponent, { | |
| data, | |
| size: "small", | |
| // Non-preset width makes the overlay shrink-wrap its content, so the modal | |
| // is exactly as wide as the calendar + time picker sit side-by-side on wide | |
| // screens and collapses to the calendar's width once they stack (see the | |
| // modal's responsive `__content` layout). `maxWidth` keeps it within the | |
| // viewport on narrow screens. | |
| width: "fit-content", | |
| position: "center", | |
| fullscreen: this.fullscreen(), | |
| maxWidth: "95vw", | |
| }); | |
| this.modalRef = ref; | |
| ref.closed.pipe(takeUntilDestroyed(this.destroyRef)).subscribe((result) => { | |
| this.modalRef = null; | |
| this.overlayOpen.set(false); | |
| this.onTouched(); | |
| if (result === undefined) return; | |
| this.commitValue(result); | |
| }); | |
| } |
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@tedi/components/form/date-time-field/date-time-field.component.ts` around
lines 607 - 658, Prevent the modal close subscription in openModal from
surviving component destruction. Inject or use the component DestroyRef with
Angular’s takeUntilDestroyed operator, pipe ref.closed through it before
subscribing, and retain the existing cleanup and result handling in the
callback.
| type DateTimeFieldStoryArgs = DateTimeFieldComponent & { | ||
| /** Story-only: text rendered in the sibling `<label tedi-label>`. */ | ||
| label?: string; | ||
| /** Story-only: text rendered in a `tedi-feedback-text` below the field. */ | ||
| feedback?: string; | ||
| /** Story-only: initial value seeded into the field's form control. */ | ||
| initialValue?: DateTimeFieldValue; | ||
| }; |
There was a problem hiding this comment.
🎯 Functional Correctness | 🟠 Major | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
set -euo pipefail
printf '\n== story file outline ==\n'
ast-grep outline tedi/components/form/date-time-field/date-time-field.stories.ts --view expanded || true
printf '\n== component file search ==\n'
fd -a 'date-time-field*.ts' tedi/components/form/date-time-field || true
printf '\n== story file with line numbers ==\n'
cat -n tedi/components/form/date-time-field/date-time-field.stories.ts | sed -n '1,380p'Repository: TEDI-Design-System/angular
Length of output: 14223
🏁 Script executed:
cat -n tedi/components/form/date-time-field/date-time-field.stories.ts | sed -n '1,380p'Repository: TEDI-Design-System/angular
Length of output: 13392
🏁 Script executed:
#!/bin/bash
set -euo pipefail
printf '\n== component outline ==\n'
ast-grep outline tedi/components/form/date-time-field/date-time-field.component.ts --view expanded || true
printf '\n== relevant declarations ==\n'
rg -n "input\\(|model\\(|output\\(|viewChild\\(|class DateTimeFieldComponent|export type DateTimeFieldValue|availableTimes|timeGridVariant|minuteStep|slotColumns|selectionLevel|monthYearSelectType|localeCode|inputDisabled|readOnly|required|disablePast|disableFuture|minDate|maxDate|showOutsideDays|useNativePicker|modal|fullscreen|size|layout|mode|placeholder|inputId" tedi/components/form/date-time-field/date-time-field.component.ts || true
printf '\n== component file excerpt ==\n'
cat -n tedi/components/form/date-time-field/date-time-field.component.ts | sed -n '1,260p'Repository: TEDI-Design-System/angular
Length of output: 27658
🏁 Script executed:
#!/bin/bash
set -euo pipefail
ast-grep outline tedi/components/form/date-time-field/date-time-field.component.ts --view expanded || true
rg -n "input\\(|model\\(|output\\(|viewChild\\(|class DateTimeFieldComponent|export type DateTimeFieldValue|availableTimes|timeGridVariant|minuteStep|slotColumns|selectionLevel|monthYearSelectType|localeCode|inputDisabled|readOnly|required|disablePast|disableFuture|minDate|maxDate|showOutsideDays|useNativePicker|modal|fullscreen|size|layout|mode|placeholder|inputId" tedi/components/form/date-time-field/date-time-field.component.ts || true
cat -n tedi/components/form/date-time-field/date-time-field.component.ts | sed -n '1,260p'Repository: TEDI-Design-System/angular
Length of output: 27574
Use raw values for DateTimeFieldStoryArgs
tedi/components/form/date-time-field/date-time-field.stories.ts:25-32 should use an explicit args interface instead of DateTimeFieldComponent in the intersection. The component exposes signals, so the current type models instances rather than the plain values Storybook passes; also cover the remaining public inputs/models in argTypes and add a responsive demo for breakpoint-driven props.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@tedi/components/form/date-time-field/date-time-field.stories.ts` around lines
25 - 32, Replace the `DateTimeFieldStoryArgs` intersection with an explicit
interface containing the raw Storybook values for every public input/model,
excluding component signals and instance members. Update `argTypes` to cover all
remaining public inputs/models, and add a responsive story demonstrating the
breakpoint-driven props.
Source: Coding guidelines
| export type { | ||
| DateTimeFieldValue, | ||
| DateTimeFieldMode, | ||
| DateTimeFieldLayout, | ||
| DateTimeFieldStep, | ||
| DateTimeFieldTimeGridVariant, | ||
| DateTimeFieldUseNativePicker, | ||
| DateTimeFieldModalInput, | ||
| DateTimeFieldAvailableTimes, | ||
| } from "./date-time-field.component"; |
There was a problem hiding this comment.
🗄️ Data Integrity & Integration | 🟡 Minor | ⚡ Quick win
🧩 Analysis chain
🏁 Script executed:
#!/bin/bash
# Check if MonthPredicate and YearPredicate are exported from any barrel
rg -n "MonthPredicate|YearPredicate" --type=ts -g '**/index.ts' -g '**/public-api.ts'Repository: TEDI-Design-System/angular
Length of output: 164
🏁 Script executed:
#!/bin/bash
set -euo pipefail
echo '--- date-time-field index.ts ---'
sed -n '1,120p' tedi/components/form/date-time-field/index.ts
echo
echo '--- search symbols in date-time-field subtree ---'
rg -n "DayAvailabilityInput|MonthPredicate|YearPredicate|availableDays|unavailableDays|shouldDisableMonth|shouldDisableYear" tedi/components/form/date-time-field -g '*.ts'
echo
echo '--- outline component/util files ---'
for f in \
tedi/components/form/date-time-field/date-time-field.component.ts \
tedi/components/form/date-time-field/date-time-field.util.ts
do
echo "### $f"
wc -l "$f"
doneRepository: TEDI-Design-System/angular
Length of output: 4307
🏁 Script executed:
#!/bin/bash
set -euo pipefail
sed -n '1,110p' tedi/components/form/date-time-field/date-time-field.component.tsRepository: TEDI-Design-System/angular
Length of output: 3673
🏁 Script executed:
#!/bin/bash
set -euo pipefail
echo '--- date-time-field package barrel chain ---'
for f in \
tedi/components/form/date-time-field/index.ts \
tedi/components/form/index.ts \
tedi/components/index.ts \
tedi/index.ts \
public-api.ts
do
if [ -f "$f" ]; then
echo "### $f"
sed -n '1,120p' "$f"
echo
fi
doneRepository: TEDI-Design-System/angular
Length of output: 2289
Export the date-time-field input types from the barrel. tedi/components/form/date-time-field/index.ts should also re-export DayAvailabilityInput, MonthPredicate, and YearPredicate so consumers can import the public input types from the entry point.
🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
In `@tedi/components/form/date-time-field/index.ts` around lines 2 - 11, Add
DayAvailabilityInput, MonthPredicate, and YearPredicate to the type exports in
the date-time-field barrel alongside the existing DateTimeField types, sourcing
them from date-time-field.component so consumers can import these public input
types from the entry point.
1 participant
Summary by CodeRabbit
New Features
Documentation
Bug Fixes