Style commit text area to match input tokens and fix disabled state (#6339)

* Style commit text area to match input tokens and fix disabled state

- Update borders and shadows to match standard input tokens.
- Style the disabled state explicitly to prevent Chromium's user-agent
  styles from washing out the field outline.
- Add dark mode background styling overrides.

* Improve timeline items assertions in work-item-details test

Extract timelineItems to a local variable and add an explicit null check to prevent TypeScript compilation errors when calling the .at method.
This commit is contained in:
Jinjing
2026-06-25 01:18:31 -07:00
committed by GitHub
parent f864fc5bc6
commit 35c3f86c82
2 changed files with 10 additions and 4 deletions
+7 -3
View File
@@ -283,9 +283,13 @@ describe('getWorkItemDetails', () => {
call[0].includes('repos/acme/widgets/issues/923/timeline?per_page=100&page=7')
)
).toBe(false)
expect(details?.timelineItems).toHaveLength(300)
expect(details?.timelineItems.at(0)).toMatchObject({ assignee: 'assignee-3-0' })
expect(details?.timelineItems.at(-1)).toMatchObject({ assignee: 'assignee-6-89' })
const timelineItems = details?.timelineItems
expect(timelineItems).toHaveLength(300)
if (!timelineItems) {
throw new Error('Expected timeline items to be present')
}
expect(timelineItems.at(0)).toMatchObject({ assignee: 'assignee-3-0' })
expect(timelineItems.at(-1)).toMatchObject({ assignee: 'assignee-6-89' })
})
it('falls back to REST + GraphQL when the collapsed issue query fails', async () => {
@@ -6501,7 +6501,9 @@ export function CommitArea({
aria-describedby={describedBy || undefined}
// Why: reserve right padding so typed text does not slide under the
// absolute-positioned Generate icon in the top-right corner.
className={`mt-0.5 min-h-14 w-full resize-none rounded-md border border-border bg-background px-2 py-1.5 text-xs text-foreground outline-none placeholder:text-muted-foreground/70 focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 ${
// Why: match Input surface tokens and pin disabled:border-input so
// Chromium's UA disabled styles don't wash out the field outline.
className={`mt-0.5 min-h-14 w-full resize-none appearance-none rounded-md border border-input bg-background shadow-xs px-2 py-1.5 text-xs text-foreground outline-none placeholder:text-muted-foreground/70 focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:border-input disabled:bg-background disabled:text-foreground disabled:shadow-xs dark:bg-input/30 dark:disabled:bg-input/30 ${
showGenerate ? 'pr-8' : ''
}`}
/>