8f075f1792
Skeleton, Breadcrumbs, Link, Button, Image, Meter, NumberField Floating components: Tooltip (hover/focus), Popover (click, with focus trap and dismiss), HoverCard (hover with safe area). Simple components: Alert (role=alert), Badge (role=status), Skeleton (loading placeholder with data attributes). Navigation: Breadcrumbs (nav>ol>li with separators), Link (accessible anchor with disabled), Button (with disabled click suppression). Data/Form: Image (Img+Fallback with loading status), Meter (like Progress for known ranges), NumberField (spinbutton with inc/dec). 302 tests across 46 files, typecheck clean, build produces 176 files.
17 lines
460 B
TypeScript
17 lines
460 B
TypeScript
import type { JSX } from "solid-js";
|
|
import { splitProps } from "solid-js";
|
|
|
|
export interface AlertProps extends JSX.HTMLAttributes<HTMLDivElement> {
|
|
children?: JSX.Element;
|
|
}
|
|
|
|
/** An alert element that announces important messages to screen readers via role="alert". */
|
|
export function Alert(props: AlertProps): JSX.Element {
|
|
const [local, rest] = splitProps(props, ["children"]);
|
|
return (
|
|
<div role="alert" {...rest}>
|
|
{local.children}
|
|
</div>
|
|
);
|
|
}
|