Andreas/LibreChat
1
0
Fork 0
mirror of https://github.com/danny-avila/LibreChat.git synced 2025-12-16 16:30:15 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 6

⌨️ style(a11y): kb access for LLM endpoint menu; refactor: style (#3714)

Browse source
This commit is contained in:
Marco Beretta 2024-08-22 00:19:33 +02:00 • committed by GitHub
parent 98b437edd5
commit 0c5568b80b
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
6 changed files with 48 additions and 50 deletions
Download patch file Download diff file Expand all files Collapse all files

29
client/src/components/Chat/Menus/UI/TitleButton.tsx
View file

@ -1,32 +1,25 @@
import { useState } from 'react';
import { ChevronDown } from 'lucide-react';
import { Trigger } from '@radix-ui/react-popover';
export default function TitleButton({ primaryText = '', secondaryText = '' }) {
const [isExpanded, setIsExpanded] = useState(false);
return (
<Trigger asChild>
<button
className="group flex cursor-pointer items-center gap-1 rounded-xl px-3 py-2 text-lg font-medium hover:bg-gray-50 radix-state-open:bg-gray-50 dark:hover:bg-gray-700 dark:radix-state-open:bg-gray-700"
type="button"
className="group flex cursor-pointer items-center gap-2 rounded-lg px-3 py-1.5 text-lg font-medium transition-colors duration-200 hover:bg-surface-hover radix-state-open:bg-surface-hover"
aria-label={`Select ${primaryText}`}
aria-haspopup="dialog"
aria-expanded={isExpanded}
aria-controls="radix-:r6:"
onClick={() => setIsExpanded(!isExpanded)}
>
<div>
{primaryText}{' '}
<span className="text-token-text-secondary"> {primaryText} </span>
{!!secondaryText && <span className="text-token-text-secondary">{secondaryText}</span>}
</div>
<svg
width="16"
height="17"
viewBox="0 0 16 17"
fill="none"
className="text-token-text-tertiary"
>
<path
d="M11.3346 7.83203L8.00131 11.1654L4.66797 7.83203"
stroke="currentColor"
strokeWidth="2"
strokeLinecap="round"
strokeLinejoin="round"
/>
</svg>
<ChevronDown className="text-token-text-secondary size-4" />
</button>
</Trigger>
);