Components

Every component @aweftjs/ui ships, one page each: the catalogue's example in light and dark, every state and size, and the example's source. The rules every one of them follows are on the @aweftjs/ui page.

component	what it is
`Alert`	<div role="alert"> or <div role="status"> on alert
`Avatar`	<span> on avatar, holding an <img> and a <span>
`Badge`	<span> on badge
`Breadcrumb`	a <nav> on breadcrumb around an <ol>
`Button`	<button>, or <a> with an href
`Card`	<div> on card, with the stack segment when it has parts
`Checkbox`	<input type="checkbox">
`ColorPicker`	a saturation and brightness square, the hue and the alpha as Sliders, and a swatch
`Country`	a button that opens a searched grid of every country
`DropDown`	a <details> whose <summary> wears the button theme
`Empty`	<div> on empty
`FileDrop`	a drop zone with a real file input in it
`Form`
`Icon`	<svg>
`LoadingDots`	three dots
`Markdown`	a <div> on markdown holding one element per block of a markdown string
`Menu`	a button and the list of actions it opens
`Modal`	a stage template: the act inside a native <dialog>
`Pagination`	a <nav> on pagination of quiet Buttons
`Popup`
`Progress`	<progress max="1"> on progress
`Radio`	<input type="radio">
`Region`	the same, over one country's subdivisions
`Select`	a <button role="combobox"> in a <span> with its arrow, over a hidden <select>
`Skeleton`	<div aria-hidden="true"> on skeleton
`Slider`	<input type="range">
`Table`	a <table> on table, inside a <div> on table_scroll
`Tabs`	a <div> on tabs around a <div role="tablist"> on tabs_list and the panels
`TextArea`	<textarea>
`TextField`	<input>, in a <div> on input_group when it was given an addon
`Toggle`	<input type="checkbox" role="switch">
`Tooltip`	Detached plus the hover and focus trigger
`Typography`	one run of themed text: one element on the text entry
`Validate`	a check around a control, and the message it shows