S7.1: Replace div onClick with semantic button in DialogTrigger.tsx
S7.2: Replace role="button" divs with native <button> elements in 12 files
(PlaylistCard, TrackCard, ConversationItem, NotificationMenuItem,
AudioPlayerTrackInfo, SearchPageResults, ProjectsManagerAddCard,
ProjectsManagerCard, GearInventoryGrid, UploadModal, dropdown.tsx,
LibraryPageGrid)
S7.3: Add focus-visible:ring-2 to 14 form inputs with outline-none across
9 modal files (CreateGroupModal, DataExportModal, EditPlaylistModal,
AddToPlaylistModal, BanUserModal, RefundRequestModal, FlashSaleModal,
TipStreamerModal, CreatePostModal)
S7.4: Add semantic landmarks — <section> in DashboardPage, <article> in
PostCard and CourseCard
Co-authored-by: Cursor <cursoragent@cursor.com>
23 lines
608 B
TypeScript
23 lines
608 B
TypeScript
import React from 'react';
|
|
import type { DialogTriggerProps } from './types';
|
|
|
|
export function DialogTrigger({
|
|
children,
|
|
asChild,
|
|
onClick,
|
|
}: DialogTriggerProps) {
|
|
if (asChild && React.isValidElement(children)) {
|
|
return React.cloneElement(children, {
|
|
onClick: onClick || (children.props as { onClick?: () => void }).onClick,
|
|
} as Record<string, unknown>);
|
|
}
|
|
return (
|
|
<button
|
|
type="button"
|
|
onClick={onClick}
|
|
className="inline-flex appearance-none bg-transparent border-0 p-0 cursor-pointer text-inherit font-inherit"
|
|
>
|
|
{children}
|
|
</button>
|
|
);
|
|
}
|