fix(Dialog): Suppress Missing Description Warning

[dustinhealy]

Why?

When Dialog.Content is used without a description prop, Radix logs a console warning:

Warning: Missing `Description` or `aria-describedby={undefined}` for {DialogContent}.

Passing aria-describedby={undefined} from the consumer side doesn't work because styled-components strips undefined props before they reach Radix's internal DialogContent.

How?

Renders a hidden <RadixDialog.Description hidden /> when no description prop is provided. This satisfies Radix's accessibility check without any visible UI change.

When description IS provided, the visible <Description> component renders as before.

Tickets?

• ClickHouse/librechat-admin-panel#13

Contribution checklist?

• You've done enough research before writing
• You have reviewed the PR

[changeset-bot]

🦋 Changeset detected

Latest commit: 120f039

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 1 package

Name	Type
@clickhouse/click-ui	Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

[github-actions]

Claude finished @dustinhealy's task in 1m 30s —— View job

---

PR Review

• Gather context
• Read changed files
• Review conventions/guidelines
• Post review

---

The fix is minimal and solves the stated problem effectively. Good changeset included. A couple of things worth noting:

♿ Accessibility — minor nuance

<RadixDialog.Description hidden /> satisfies Radix's internal useDescriptionWarning check, but it also causes Radix to wire up aria-describedby on the dialog pointing to this hidden element. Referencing a hidden element via aria-describedby was non-compliant in ARIA 1.1 (user agents were expected to ignore it), but is explicitly allowed in ARIA 1.2. In practice all major screen readers handle this gracefully and announce nothing — so this is fine for real-world use, just worth knowing.

A slightly cleaner alternative that avoids the aria-describedby→hidden-element link entirely would be forwarding through without styled-components, but the PR description already explains why the aria-describedby={undefined} path is blocked by styled-components. This is the right pragmatic call.

🧪 Tests — no new coverage for the fix

The existing test at line 48 (renders the dialog with no title) already exercises the no-description path, but doesn't assert anything about the hidden description element or warn suppression. Worth adding one assertion to prevent regressions: Fix this →

// Dialog.test.tsx — suggested addition inside the "no title" test
fireEvent.click(screen.getByText('Open Dialog'));
const hiddenDesc = document.querySelector('[data-radix-ui-dialog-description]') 
  ?? document.querySelector('[id*="radix-"]');  // adjust to actual rendered selector
expect(hiddenDesc).toBeTruthy();

---

Overall this is a clean, well-scoped fix with proper changeset. The a11y note is informational rather than blocking.

[workflow-authentication-public]

📚 Storybook Preview Deployed

✅ Preview URL: https://click-v2sfiqllq-clickhouse.vercel.app

Built from commit: d81540e73e9d62e573d90801bdd1b1e9db283af5