feat(AmharicDatePicker): add width prop to align input fields in filter bar

This commit is contained in:
estifanos
2026-08-05 10:21:56 +00:00
parent 7ba760d74b
commit c79e4cc5fa
2 changed files with 7 additions and 0 deletions

View File

@@ -501,12 +501,14 @@ export function LicenseQueuePage() {
value={urlFilter.submittedFrom ?? ''} value={urlFilter.submittedFrom ?? ''}
onChange={(v) => setFacet({ submittedFrom: v || undefined })} onChange={(v) => setFacet({ submittedFrom: v || undefined })}
dateFormat="date" dateFormat="date"
w={220}
/> />
<AmharicDatePicker <AmharicDatePicker
label={t('queue.submittedTo', 'Submitted to')} label={t('queue.submittedTo', 'Submitted to')}
value={urlFilter.submittedTo ?? ''} value={urlFilter.submittedTo ?? ''}
onChange={(v) => setFacet({ submittedTo: v || undefined })} onChange={(v) => setFacet({ submittedTo: v || undefined })}
dateFormat="date" dateFormat="date"
w={220}
/> />
{hasFacets && ( {hasFacets && (
<Button <Button

View File

@@ -167,6 +167,9 @@ export interface AmharicDatePickerProps {
size?: MantineSize; size?: MantineSize;
name?: string; name?: string;
onBlur?: () => void; onBlur?: () => void;
/** Width of the input, same as Mantine's `w` on TextInput/Select — needed
* to line this field up with siblings in a filter bar. */
w?: number | string;
/** Show a time-of-day field alongside the calendar. Off by default — /** Show a time-of-day field alongside the calendar. Off by default —
* most callers only need a calendar day. */ * most callers only need a calendar day. */
withTime?: boolean; withTime?: boolean;
@@ -188,6 +191,7 @@ export function AmharicDatePicker({
size, size,
name, name,
onBlur, onBlur,
w,
withTime = false, withTime = false,
dateFormat = 'iso', dateFormat = 'iso',
}: AmharicDatePickerProps) { }: AmharicDatePickerProps) {
@@ -232,6 +236,7 @@ export function AmharicDatePicker({
disabled={disabled} disabled={disabled}
size={size} size={size}
name={name} name={name}
w={w}
error={error} error={error}
placeholder={placeholder} placeholder={placeholder}
onClick={() => !disabled && toggle()} onClick={() => !disabled && toggle()}