Introductie
RayCraft is een bibliotheek van Blazor-besturingselementen (.NET 10: Server, WebAssembly en Auto) met lichte, donkere en compacte thema's, Engelse en Bulgaarse teksten en ondersteuning voor toetsenbord en schermlezers. RayCraft Free is nu beschikbaar; RayCraft Complete is nu beschikbaar.
Installatie
Voeg het pakket toe met:
dotnet add package RayCraft.BlazorZie Aan de slag voor de installatiestappen. Werkende voorbeelden staan in de openbare GitHub-repository, die alleen voorbeeld- en democode bevat, niet de code van de bibliotheek.
Besturingselementen
Knoppen
Button (Free)
Activeert een actie, of navigeert wanneer Href is ingesteld (de knop wordt dan als een link met hetzelfde uiterlijk getoond).
Pagina van het besturingselement
IconButton (Free)
Knop die alleen een pictogram toont. Label is verplicht: het wordt de toegankelijke naam en de tip.
Pagina van het besturingselement
ButtonGroup (Free)
Voegt knoppen samen tot één gesegmenteerde besturing, horizontaal of verticaal. Combineer met ToggleButton voor een weergaveschakelaar.
Pagina van het besturingselement
ToggleButton (Free)
Knop die een aan/uit-toestand bewaart en die met aria-pressed beschikbaar maakt.
Pagina van het besturingselement
SplitButton (Free)
Een hoofdactie met een menu van verwante acties. Dezelfde MenuItem-elementen als Menu worden gebruikt.
Pagina van het besturingselement
FloatingActionButton (Free)
Een vierkante knop vast in een hoek van het scherm voor de hoofdactie. Extended toont de tekst naast het pictogram; de tekst is altijd de toegankelijke naam.
Pagina van het besturingselement
SpeedDial (Free)
Een zwevende knop die een korte lijst met acties opent. Esc sluit de lijst; elke actie is een echte knop in de tabvolgorde.
Pagina van het besturingselement
ProgressButton (Free)
Een knop die lopend werk toont: een indicator zolang Progress niet is ingesteld, een balk langs de onderrand en een uitgesproken percentage wanneer dat wel zo is.
Pagina van het besturingselement
CopyButton (Free)
Kopieert tekst naar het klembord en bevestigt dat met een vinkje. Heeft een beveiligde context nodig (https of localhost).
Pagina van het besturingselement
Tekst en getallen
TextField (Free)
Eenregelige tekstinvoer. Werkt met EditForm en DataAnnotations; de foutmelding verschijnt onder het veld.
Pagina van het besturingselement
NumericField (Free)
Getalinvoer voor elk numeriek type (int, decimal, double, nullable-versies). Waarden buiten Min en Max worden begrensd en de knoppen stappen met Step.
Pagina van het besturingselement
PercentField (Free)
Getalveld dat de gebruiker als percentage typt (12.5) terwijl de waarde als breuk (0.125) wordt opgeslagen.
Pagina van het besturingselement
MoneyField (Free)
Bedragveld voor decimal- en decimal?-waarden. De tekst wordt opgemaakt en gelezen met de huidige cultuur (zowel 1,234.50 als 1.234,50 worden begrepen), afgerond op Decimals en binnen Min en Max gehouden.
Pagina van het besturingselement
MaskedInput (Free)
Tekstveld dat wat je typt opmaakt volgens een masker: 0 is een cijfer, a een letter, * een letter of cijfer, elk ander teken een vast scheidingsteken (laat een maskerteken ontsnappen met een backslash).
Pagina van het besturingselement
OtpInput (Free)
Eén vak per teken voor verificatiecodes. Typen gaat naar het volgende vak, Backspace naar het vorige en een geplakte code vult alle vakken.
Pagina van het besturingselement
SearchBox (Free)
Zoekveld met pictogram en wisknop. OnSearch draait bij Enter, bij de wisknop en (optioneel) bij elke toetsaanslag; Esc wist de tekst.
Pagina van het besturingselement
PasswordStrength (Free)
Toont hoe sterk een wachtwoord is met vier balken, een woord en een lijst van de regels waaraan het voldoet.
Pagina van het besturingselement
InPlaceEditor (Free)
Toont een waarde als tekst; een klik verandert het in een veld met opslaan- en annuleerknoppen.
Pagina van het besturingselement
Keuze uit lijst
Select (Free)
Keuzelijst om één item te kiezen. TValue kan elk type zijn, ook je eigen records.
Pagina van het besturingselement
DropDownList (Free)
Een combobox voor zeer lange lijsten. Alleen de zichtbare opties worden getekend, dus 100.000 items openen direct; typen verkleint de lijst.
Pagina van het besturingselement
MultiSelect (Free)
Keuzelijst met selectievakjes om meerdere items te kiezen. De knop vat de selectie samen; Alles selecteren en Wissen zijn ingebouwd.
Pagina van het besturingselement
ListBox (Free)
Altijd zichtbare lijst voor één keuze (radioknoppen eronder) of meerdere (selectievakjes).
Pagina van het besturingselement
Autocomplete (Free)
Tekstveld dat een lijst filtert terwijl je typt. Ondersteunt de pijltoetsen, Enter en Esc en volgt het ARIA-combobox-patroon.
Pagina van het besturingselement
MultiColumnComboBox (Free)
Een Autocomplete waarvan de lijst meerdere kolommen met een kopregel toont. Typen zoekt in alle kolommen.
Pagina van het besturingselement
Cascader (Free)
Kies één waarde uit een hiërarchie: een kolom met keuzes opent een kolom met subkeuzes.
Pagina van het besturingselement
DropDownTree (Free)
Een keuzeveld dat een boom opent om één knooppunt te kiezen. Het is gebouwd uit TreeView en Popover en behoudt hun toetsenbordgedrag.
Pagina van het besturingselement
TagInput (Free)
Vrije lijst van tags. Enter of een komma voegt de getypte tekst toe, Backspace in een leeg veld verwijdert de laatste tag en elke tag heeft een verwijderknop.
Pagina van het besturingselement
Mention (Free)
Een tekstvak dat namen voorstelt na een triggerteken (standaard @). Pijltoetsen en Enter kiezen; de gekozen naam wordt met de trigger ingevoegd.
Pagina van het besturingselement
Schuifregelaars en beoordeling
Slider (Free)
Sleep om een getal in een bereik te kiezen.
Pagina van het besturingselement
RangeSlider (Free)
Schuifregelaar met twee knoppen om een onder- en een bovenwaarde te kiezen. Beide knoppen zijn native range-invoer, dus de pijltoetsen werken.
Pagina van het besturingselement
RangeSelector (Free)
Een strook met twee handvatten die een interval van een reeks selecteert; een klein voorbeeld van de gegevens ligt achter de handvatten.
Pagina van het besturingselement
Rating (Free)
Sterrenbeoordeling. Klik opnieuw op de huidige ster om te wissen.
Pagina van het besturingselement
RatingDisplay (Free)
Alleen-lezen sterren met breuken (4.5 toont vier en een halve), een optioneel getal en het aantal reviews.
Pagina van het besturingselement
Kleur en bestand
ColorPicker (Free)
Kleurveld met de native kleurkiezer, een hex-tekstvak en optionele voorgedefinieerde stalen.
Pagina van het besturingselement
ColorPalette (Free)
Een raster van kleurstalen dat als radiogroep werkt: één tabstop, de pijltoetsen, Home en End bewegen en kiezen.
Pagina van het besturingselement
ColorButton (Free)
Een werkbalkknop voor een kleur: een pictogram met een balk in de gekozen kleur eronder. Klikken opent de kleurkiezer van de browser.
Pagina van het besturingselement
FileUpload (Free)
Neerzetgebied en bestandskiezer. Het controleert grootte, type en aantal, toont de geaccepteerde bestanden en activeert FilesChanged; het lezen van de inhoud is aan jou (IBrowserFile.OpenReadStream).
Pagina van het besturingselement
SignaturePad (Free)
Tekenvlak voor een handtekening met muis, vinger of pen. De waarde is een PNG als data-URL.
Pagina van het besturingselement
Editors
MarkdownEditor (Free)
Tekstgebied met opmaakwerkbalk en live voorbeeld, voor mensen die Markdown schrijven in plaats van opgemaakte tekst.
Pagina van het besturingselement
AddressField (Free)
Een ontvangersveld voor e-mail: elk adres wordt een chip. Typ of plak een lijst, kies uit suggesties uit je gegevensbron, dubbelklik op een chip om die te bewerken en zie meteen welke adressen ongeldig zijn.
Pagina van het besturingselement
Keuze
Checkbox (Free)
Booleaanse invoer met label.
Pagina van het besturingselement
CheckboxGroup (Free)
Een groep selectievakjes om meerdere items uit een lijst te kiezen, binnen een fieldset met legenda zodat schermlezers de groepsnaam aankondigen.
Pagina van het besturingselement
Radio (Free)
Pagina van het besturingselement
RadioGroup (Free)
Eén keuze uit een korte lijst. Gebruik Items voor simpele lijsten of Radio-kinderen voor eigen labels.
Pagina van het besturingselement
Switch (Free)
Booleaanse schakelaar, voor hulptechnologie aangekondigd als switch.
Pagina van het besturingselement
Chip (Free)
Compact label, optioneel verwijderbaar.
Pagina van het besturingselement
ChipSet (Free)
Chips die geselecteerd kunnen worden, voor filters en tags. Standaard één keuze, meerdere met Multiple.
Pagina van het besturingselement
ToggleGroup (Free)
Gesegmenteerde besturing voor één keuze (radiogroep) of meerdere (schakelknoppen). Gebruik het voor weergaveschakelaars en opmaakschakelaars.
Pagina van het besturingselement
TransferList (Free)
Twee lijsten met knoppen om items ertussen te verplaatsen, om een deelverzameling uit een lange lijst te kiezen.
Pagina van het besturingselement
Datum en tijd
Calendar (Free)
Maandraster dat DatePicker en DateTimeRangePicker gebruiken. Gebruik het alleen voor inline datumselectie.
Pagina van het besturingselement
DatePicker (Free)
Datumveld met kalender. Maand- en dagnamen, de eerste dag van de week en het datumformaat (ook gebruikt als standaardplaatshouder) volgen de huidige RayCraft-taal.
Pagina van het besturingselement
DateTimePicker (Free)
Eén veld voor datum en tijd: een DatePicker en een TimePicker naast elkaar die samen een DateTime binden.
Pagina van het besturingselement
DateTimeRangePicker (Free)
Periode met begin en einde, gekozen op één kalender met twee maanden naast elkaar (Months) (de eerste klik stelt het begin in, de tweede het einde) en per veld getypt of aangepast.
Pagina van het besturingselement
MonthPicker (Free)
Kiest een maand en een jaar. De waarde is de eerste dag van de maand.
Pagina van het besturingselement
YearPicker (Free)
Kiest een jaar uit een raster van twaalf jaar met knoppen voor eerdere en latere pagina's.
Pagina van het besturingselement
WeekPicker (Free)
Kiest een hele week. De waarde is de eerste dag van de week van de huidige taal; het veld toont het ISO-weeknummer en de data.
Pagina van het besturingselement
TimeField (Free)
Het kale tijdvak waarop TimePicker, TimeRangePicker en DateTimeRangePicker gebouwd zijn.
Pagina van het besturingselement
TimePicker (Free)
Tijdveld geschreven in het formaat van de huidige RayCraft-taal (9:30 AM in het Engels, 9:30 in het Bulgaars), zodat het in elke browser hetzelfde oogt.
Pagina van het besturingselement
TimeRangePicker (Free)
Begin- en eindtijd in één veld, elk geschreven in het formaat van de huidige taal zoals TimePicker.
Pagina van het besturingselement
TimeSpanPicker (Free)
Voert een duur in als dagen, uren, minuten en seconden. De waarde is een TimeSpan.
Pagina van het besturingselement
EventCalendar (Free)
Maandweergave met afspraken. Afspraken van meerdere dagen verschijnen op elke dag; een dag toont tot MaxEventsPerDay en een link +n meer.
Pagina van het besturingselement
Formulieren
ErrorSummary (Free)
Toont alle validatieberichten van het omringende EditForm in één blok. Plaats het in een EditForm met een validator.
Pagina van het besturingselement
FormLayout (Free)
Rangschikt labels en velden in een responsief raster van twaalf kolommen, met sectiekoppen.
Pagina van het besturingselement
FormState (Free)
Vergrendelt elk RayCraft-veld erin met één parameter: Disabled blokkeert ze volledig, ReadOnly toont de waarden zonder wijzigingen toe te staan.
Pagina van het besturingselement
LoginForm (Free)
Kant-en-klaar inlogformulier met gelokaliseerde validatie. Het activeert OnSubmit met het ingevulde LoginModel en laat het eigenlijke inloggen aan jou.
Pagina van het besturingselement
RegisterForm (Free)
Kant-en-klaar registratieformulier: naam, e-mail, wachtwoord en bevestiging, met gelokaliseerde validatie.
Pagina van het besturingselement
Captcha (Free)
Eenvoudige menselijke controle met een kleine rekenvraag. Het houdt alleen basisbots buiten; controleer echte bescherming op de server (bijvoorbeeld met een daarvoor gemaakte dienst).
Pagina van het besturingselement
FormBuilder (Free)
Bouwt een formulier uit velddefinities: tekst, e-mail, wachtwoord, getal, datum, tekstgebied, keuzelijst, radio, selectievakje en schakelaar.
Pagina van het besturingselement
Lay-out
Container (Free)
Centreert inhoud en beperkt de breedte. De standaardbreedte volgt de breekpunten (540, 720, 960, 1140 en 1320 px).
Pagina van het besturingselement
Stack (Free)
Rangschikt kinderen in een rij of kolom met een consistente tussenruimte.
Pagina van het besturingselement
Grid (Free)
Raster van 12 kolommen. Span stelt de breedte van een item op elk scherm in, en Sm, Md, Lg, Xl en Xxl wijzigen die vanaf dat breekpunt (dezelfde als op de pagina Breakpoints).
Pagina van het besturingselement
GridItem (Free)
Pagina van het besturingselement
Spacer (Free)
Leeg element dat groeit om de vrije ruimte in een flexrij te vullen en volgende items naar het einde duwt.
Pagina van het besturingselement
Divider (Free)
Dunne lijn die inhoud scheidt, horizontaal of verticaal.
Pagina van het besturingselement
Card (Free)
Container met optionele koptekst en voettekst.
Pagina van het besturingselement
Panel (Free)
Sectie met titel en optionele inklapknop en acties in de koptekst.
Pagina van het besturingselement
Fieldset (Free)
Groepeert verwante formulierbesturingen onder een legenda. Disabled schakelt elke besturing erin uit.
Pagina van het besturingselement
Toolbar (Free)
Rij gereedschapsknoppen met role=toolbar.
Pagina van het besturingselement
Splitter (Free)
Twee aanpasbare vensters. Sleep de balk met muis of aanraking, of geef hem focus en gebruik de pijltoetsen (Shift voor grotere stappen, Home en End voor de grenzen).
Pagina van het besturingselement
Accordion (Free)
Uitklapbare secties. Standaard sluit het openen van de ene de andere; stel Multiple in om er meerdere toe te staan.
Pagina van het besturingselement
Collapse (Free)
Toont of verbergt zijn inhoud. Koppel Expanded aan een willekeurige knop; KeepMounted houdt de inhoud in de pagina terwijl die verborgen is.
Pagina van het besturingselement
TagCloud (Free)
Woorden in groottes die hun gewicht volgen. Tags kunnen links, selecterende knoppen of platte tekst zijn.
Pagina van het besturingselement
TitleIndex (Free)
Een lijst gegroepeerd op beginletter met een lettersbalk bovenaan. Een letter verplaatst de focus (en het beeld) naar zijn sectie; letters zonder items zijn uitgeschakeld.
Pagina van het besturingselement
Navigatie
AppBar (Free)
Bovenbalk voor de titel en de belangrijkste acties. Zet links in NavContent en ze staan op brede schermen in de balk en klappen onder 768 px weg achter een menuknop.
Pagina van het besturingselement
Drawer (Free)
Zijpaneel. Tijdelijke panelen zweven met een achtergrond over de pagina, sluiten met Esc en verplaatsen de focus naar het paneel; stel Temporary=false in voor een permanente zijbalk.
Pagina van het besturingselement
NavMenu (Free)
Verticale navigatie met markering van de actieve pagina (gebouwd op NavLink) en inklapbare groepen.
Pagina van het besturingselement
NavItem (Free)
Pagina van het besturingselement
NavGroup (Free)
Pagina van het besturingselement
Tabs (Free)
Wisselt tussen panelen. Ondersteunt de pijltoetsen, Home en End.
Pagina van het besturingselement
Stepper (Free)
Leidt de gebruiker door een reeks stappen met knoppen Terug en Volgende.
Pagina van het besturingselement
Wizard (Free)
Een begeleide stroom in stappen. Elke stap kan valideren voordat de gebruiker doorgaat, een stap kan optioneel zijn, afgeronde stappen kunnen heropend worden en het resultaat kan een eigen pagina tonen.
Pagina van het besturingselement
Breadcrumbs (Free)
Toont het pad naar de huidige pagina. Het laatste item is de huidige pagina.
Pagina van het besturingselement
Menu (Free)
Knop die een lijst met acties opent. Sluit bij selectie, Esc of een klik erbuiten.
Pagina van het besturingselement
MenuItem (Free)
Pagina van het besturingselement
ContextMenu (Free)
Menu dat met de rechtermuisknop of de contextmenutoets boven zijn inhoud wordt geopend.
Pagina van het besturingselement
MenuBar (Free)
Een horizontale menubalk voor toepassingen: menu's op het hoogste niveau met opdrachten, sneltoetsen, vinkjes, pictogrammen en submenu's.
Pagina van het besturingselement
CommandContextMenu (Free)
Een contextmenu gebouwd uit MenuCommand-gegevens, met submenu's, vinkjes, sneltoetsen en dezelfde toetsenbordafhandeling als MenuBar.
Pagina van het besturingselement
TextContextMenu (Free)
Het rechtsklikmenu van een bewerkbaar tekstelement: ongedaan maken, opnieuw, knippen, kopiëren, plakken en alles selecteren, plus opdrachten die je toevoegt.
Pagina van het besturingselement
ProfileMenu (Free)
Avatar, naam en een menu voor de aangemelde gebruiker, gebouwd uit dezelfde MenuItem-elementen als Menu.
Pagina van het besturingselement
Pagination (Free)
Paginakiezer met weglatingstekens voor lange bereiken.
Pagina van het besturingselement
TreeView (Free)
Hiërarchische lijst volgens het ARIA-tree-patroon. Pijltoetsen bewegen en klappen uit, Home en End springen, Enter of Spatie selecteert.
Pagina van het besturingselement
ScrollSpy (Free)
Een inhoudsopgave op de pagina die de kop markeert die momenteel bovenaan het scherm staat.
Pagina van het besturingselement
Overlays
Dialog (Free)
Modaal venster. De focus gaat erin en blijft erin tot het sluit (Esc, de sluitknop of een klik op de achtergrond); daarna keert de focus terug naar het vorige element.
Pagina van het besturingselement
DialogHost (Free)
Pagina van het besturingselement
Popover (Free)
Zwevend paneel dat door een activator wordt geopend. Sluit met Esc of een klik erbuiten.
Pagina van het besturingselement
Tooltip (Free)
Korte tip bij aanwijzen en bij toetsenbordfocus. Pure CSS, dus het werkt ook voordat de pagina interactief wordt.
Pagina van het besturingselement
Overlay (Free)
Verduistert de pagina (of, met Absolute, het gepositioneerde bovenliggende element) en kan inhoud zoals een laadindicator tonen.
Pagina van het besturingselement
Lightbox (Free)
Pagina van het besturingselement
Tour (Free)
Stap-voor-stap-introductie die pagina-elementen markeert die via een CSS-selector gekozen zijn. Stappen zonder passend element verschijnen in het midden.
Pagina van het besturingselement
ColorDialog (Free)
Pagina van het besturingselement
FontDialog (Free)
Pagina van het besturingselement
SnackbarHost (Free)
Pagina van het besturingselement
Feedback
Alert (Free)
Inline bericht gekleurd naar ernst, met een passend pictogram. Stel Dismissible in om een sluitknop te tonen; gebruik bind-Visible of OnDismiss om te reageren bij sluiten.
Pagina van het besturingselement
Badge (Free)
Klein statuslabel.
Pagina van het besturingselement
BusyOverlay (Free)
Omsluit een gebied en verduistert het, zolang Busy waar is, met een laadindicator erbovenop. De afdekking blokkeert de muis, markeert het gebied met aria-busy en kondigt het label aan.
Pagina van het besturingselement
CookieConsent (Free)
Een banner die vraagt welke cookies zijn toegestaan. Het onthoudt het antwoord in lokale opslag, biedt Alles accepteren, Alleen noodzakelijke en een keuze per categorie, en blokkeert de pagina niet.
Pagina van het besturingselement
EmptyState (Free)
Bericht voor lijsten en pagina's zonder inhoud, met pictogram, uitleg en optionele acties.
Pagina van het besturingselement
NotificationCenter (Free)
Een belknop met het aantal ongelezen meldingen en een paneel dat ze toont. Mensen kunnen ze lezen, wegklikken en wissen; het aantal wordt aan schermlezers aangekondigd.
Pagina van het besturingselement
ProgressBar (Free)
Toont voortgang van 0 tot Max. Zonder Value is die onbepaald.
Pagina van het besturingselement
ProgressCircular (Free)
Ring die een bepaalde voortgangswaarde toont. Gebruik Spinner voor onbekende duur.
Pagina van het besturingselement
ResultPage (Free)
Een bericht op volledige pagina voor een uitkomst: gelukt, fout, informatie, waarschuwing, pagina niet gevonden, geen toegang en serverfout, met pictogram, titel, tekst en knoppen.
Pagina van het besturingselement
Skeleton (Free)
Plaatshouder die getoond wordt terwijl inhoud laadt.
Pagina van het besturingselement
SkeletonPreset (Free)
Kant-en-klare laadplaatshouders: kaart, lijst, tabel, profiel en alinea. Ze kondigen een bezige toestand aan schermlezers aan.
Pagina van het besturingselement
Spinner (Free)
Onbepaalde laadindicator met een gelokaliseerde toegankelijke naam.
Pagina van het besturingselement
Content
Typography (Free)
Koppen, lopende tekst, bijschriften en overlines met het lettertype en de groottes van het thema. Koppen renderen echte h1- tot h6-elementen.
Pagina van het besturingselement
Icon (Free)
Een bibliotheek van gangbare pictogrammen in één consistente stijl: 16-px-raster, lijnen van 1,5 px, vierkante uiteinden.
Pagina van het besturingselement
Image (Free)
Afbeelding met verplichte alternatieve tekst, aanpassingsmodi, optionele rand en bijschrift. Uitgesteld laden staat standaard aan.
Pagina van het besturingselement
ImageGallery (Free)
Raster van miniaturen dat een viewer op volledig scherm (Lightbox) opent met vorige- en volgende-knoppen, de pijltoetsen en Esc.
Pagina van het besturingselement
Avatar (Free)
Vierkante gebruikersbadge: afbeelding, uit een naam berekende initialen of een standaard gebruikerspictogram.
Pagina van het besturingselement
AvatarGroup (Free)
Overlappende avatars voor een team of de mensen bij een item. Meer dan Max personen klappen in tot een +n-avatar waarvan de tip de namen toont.
Pagina van het besturingselement
Link (Free)
Vormgegeven anker. Externe links openen in een nieuw tabblad met rel="noopener noreferrer" en tonen een pictogram.
Pagina van het besturingselement
Statistic (Free)
Groot getal met een label, een optionele trend en extra inhoud zoals een Sparkline.
Pagina van het besturingselement
Descriptions (Free)
Sleutel-waardeparen in een raster, voor de details van een record. De kolommen klappen op smalle schermen samen tot één.
Pagina van het besturingselement
Timeline (Free)
Verticale reeks gebeurtenissen met markering, tijd en optionele ernstkleur.
Pagina van het besturingselement
Carousel (Free)
Dia's met vorige- en volgende-knoppen en indicatoren. Automatisch afspelen is optioneel; het pauzeert bij aanwijzen en focus en heeft een pauzeknop, zoals WCAG vereist.
Pagina van het besturingselement
Countdown (Free)
Telt af naar een moment en activeert OnFinished wanneer het bereikt is.
Pagina van het besturingselement
Highlighter (Free)
Markeert elk voorkomen van een zoektekst in een tekenreeks, hoofdletterongevoelig tenzij CaseSensitive is ingesteld.
Pagina van het besturingselement
Marquee (Free)
Bewegende strook voor korte mededelingen. Het pauzeert bij aanwijzen en focus, heeft een pauzeknop (WCAG 2.2.2) en stopt volledig wanneer het systeem om verminderde beweging vraagt.
Pagina van het besturingselement
CodeBlock (Free)
Toont broncode met lichte syntaxiskleuring (C#, JavaScript, TypeScript, JSON, HTML, SCSS, SQL en shell), optionele regelnummers en een kopieerknop.
Pagina van het besturingselement
Markdown (Free)
Toont Markdown-tekst: koppen, nadruk, links, afbeeldingen, lijsten (genest), citaten, code, tabellen en lijnen.
Pagina van het besturingselement
QrCode (Free)
Tekent een QR-code als gewone SVG, zonder afbeeldingsdienst of script. Tekst tot 2331 bytes (alle 40 versies, foutcorrectieniveau M).
Pagina van het besturingselement
Barcode (Free)
Tekent Code 128 (alle afdrukbare ASCII, cijfers worden in paren verpakt), Code 39 (hoofdletters, cijfers en - . $ / + % spatie), EAN-13, EAN-8 en UPC-A (het controlecijfer wordt toegevoegd, of gecontroleerd als het is opgegeven) als gewone SVG.
Pagina van het besturingselement
PricingTable (Free)
Plankaarten met prijs, functielijst en knop, met een optionele schakelaar tussen maandelijkse en jaarlijkse facturering.
Pagina van het besturingselement
CommentThread (Free)
Opmerkingen met reacties, een vak voor een nieuwe opmerking en de opdrachten Reageren en Verwijderen. Tekst wordt getoond zoals getypt (regeleinden blijven, niets wordt als HTML behandeld).
Pagina van het besturingselement
ActivityFeed (Free)
Een lijst van wat er gebeurd is en wie het deed, nieuwste eerst, gegroepeerd per dag, met een pictogram of de initialen van de actor en een optionele detailregel.
Pagina van het besturingselement
Lichte gegevens
Table (Free)
Eenvoudige vormgegeven HTML-tabel voor statische gegevens. Gebruik DataGrid wanneer je sorteren, filteren of pagineren nodig hebt.
Pagina van het besturingselement
List (Free)
Verticale lijst van items met pictogram, twee tekstregels en een afsluitende actie. Items worden links of knoppen wanneer Href of OnClick is ingesteld.
Pagina van het besturingselement
Repeater (Free)
Toont een lijst items met je eigen sjabloon. Het voegt toe wat een gewone lus mist: een koptekst, een lege toestand, een raster met vast aantal kolommen en optionele paginering (PageSize).
Pagina van het besturingselement
VirtualList (Free)
Een scrollende lijst die alleen de zichtbare rijen tekent, voor honderdduizenden items.
Pagina van het besturingselement
PropertyGrid (Free)
Bewerkt de openbare eigenschappen van elk object, gegroepeerd op Category en gelabeld met DisplayName.
Pagina van het besturingselement
Slepen
Sortable (Free)
Lijst die door slepen, of met de verplaatsknoppen voor toetsenbord en aanraking, herordend kan worden.
Pagina van het besturingselement
Voorkeuren
ThemeToggle (Free)
Kant-en-klare schakelaars voor de thema's Light, Dark, Slate en Slate Dark (ThemeToggle loopt ze één voor één langs), de comfortabele/compacte dichtheid (DensityToggle) en de taal en-US/bg-BG (LanguageToggle).
Pagina van het besturingselement
ThemeMenu (Free)
Eén keuzelijst voor thema en dichtheid: Slate, Slate Dark, Desktop, Desktop Dark, Mist, Mist Dark, Dark en Light, elk in normale en compacte dichtheid.
Pagina van het besturingselement
DensityToggle (Free)
Pagina van het besturingselement
LanguageToggle (Free)
Pagina van het besturingselement
Hulpmiddelen
BreakpointObserver (Free)
Vertelt je code in welk benoemd breekpunt (Xs tot Xxl) het venster zit en rendert opnieuw wanneer het verandert.
Pagina van het besturingselement
Fullscreen (Free)
Voegt een knop toe die zijn inhoud op volledig scherm toont. Het gebruikt de Fullscreen-API en een venstervullende laag in browsers zonder (sommige telefoons).
Pagina van het besturingselement
Hotkey (Free)
Onzichtbaar onderdeel dat een callback uitvoert voor een sneltoets zoals alt+k of mod+shift+l (mod is Ctrl op Windows en Cmd op macOS).
Pagina van het besturingselement
InfiniteScroll (Free)
Laadt meer inhoud wanneer het einde van een lijst in beeld komt. Het gebruikt IntersectionObserver (met scrollterugval) en activeert OnLoadMore; stel Loading in tijdens het ophalen en HasMore op false aan het einde.
Pagina van het besturingselement
ScrollToTop (Free)
Zwevende knop die verschijnt na naar beneden scrollen en terugkeert naar de bovenkant van de pagina.
Pagina van het besturingselement
Gegevens
DataGrid (Complete)
Tabel met sorteren (klik op een kop: oplopend, aflopend, uit), filters per kolom, paginering, rijselectie en sjablonen.
Pagina van het besturingselement
TreeList (Complete)
Een boom waarvan de knooppunten tabelrijen zijn. Uit- en inklappen, sorteren, filteren en kolommen kiezen; het toetsenbord volgt het WAI-ARIA-treegrid-patroon.
Pagina van het besturingselement
PivotGrid (Complete)
Vat een lijst samen in een kruistabel: velden op de rijen, velden over de kolommen en cijfers in de cellen, met subtotalen, eindtotalen en een veldkiezer.
Pagina van het besturingselement
QueryBuilder (Complete)
Bouwt een query uit geneste groepen voorwaarden, elke groep gecombineerd met AND of OR.
Pagina van het besturingselement
DataFilter (Complete)
Bouwt een filter uit voorwaarden (veld, operator, waarde) en geeft het terug als predicaat, zodat het met elke lijst en met de items van DataGrid werkt.
Pagina van het besturingselement
FileExplorer (Complete)
Bestandsbrowser voor een opslag die je code levert (een database, een schijf of de cloud).
Pagina van het besturingselement
FileManager (Complete)
Mappenboom, pad en een lijst- of tegelweergave van de bestanden in de huidige map, met zoeken, sorteren, nieuwe map, hernoemen, verwijderen en uploaden.
Pagina van het besturingselement
Grafieken
LineChart (Complete)
Lijndiagram met meerdere reeksen, optionele afvlakking en vlakvulling. Klik op een legenda-item om een reeks te verbergen of te tonen.
Pagina van het besturingselement
AreaChart (Complete)
Gestapelde, procentuele en overlappende vlakken. Gestapelde en procentuele vlakken zijn massief zodat het totaal en de aandelen makkelijk te lezen zijn.
Pagina van het besturingselement
BarChart (Complete)
Gegroepeerde of gestapelde balken, verticaal of horizontaal, met negatieve waarden ondersteund in gegroepeerde modus.
Pagina van het besturingselement
ComboChart (Complete)
Balken en lijnen op gedeelde assen. Markeer een reeks met AsLine om die als lijn te tekenen.
Pagina van het besturingselement
PieChart (Complete)
Taart- of donutdiagram. Segmenten met waarde nul of lager worden overgeslagen en legenda-items verbergen segmenten.
Pagina van het besturingselement
RadarChart (Complete)
Vergelijkt meerdere maten voor elke reeks op spaken rond een middelpunt.
Pagina van het besturingselement
ScatterChart (Complete)
Punten op twee numerieke assen. Klik op een legenda-item om een reeks te verbergen; de gegevens zijn ook beschikbaar als verborgen tabel voor schermlezers.
Pagina van het besturingselement
BubbleChart (Complete)
Een spreidingsdiagram met een derde dimensie: de oppervlakte van elke vierkante markering volgt de grootte-waarde.
Pagina van het besturingselement
Histogram (Complete)
Aantallen waarden in gelijke bereiken, getekend als aansluitende balken. Kies het aantal klassen of de klassebreedte en toon aantallen of aandelen.
Pagina van het besturingselement
BoxPlot (Complete)
De spreiding van een groep getallen. De doos is de middelste helft, de lijn de mediaan, de snorharen reiken tot de verste waarde binnen 1,5 keer de doosgrootte, en losse vierkantjes zijn uitschieters.
Pagina van het besturingselement
HeatmapChart (Complete)
Raster van cellen waarvan de intensiteit de waarde toont. Tekst en intensiteit zijn zo gekozen dat het contrast in beide thema's behouden blijft.
Pagina van het besturingselement
CalendarHeatmap (Complete)
Een jaar aan dagen als kleine vierkantjes, één kolom per week, donkerder waar de waarde hoger is.
Pagina van het besturingselement
TreemapChart (Complete)
Rechthoeken waarvan de oppervlaktes evenredig zijn met de waarden, ingedeeld met het squarified-algoritme.
Pagina van het besturingselement
SunburstChart (Complete)
Hiërarchie als concentrische ringen: elke ring is één niveau en de hoek van een boog is evenredig met zijn totaal.
Pagina van het besturingselement
SankeyChart (Complete)
Stroomdiagram: knooppunten staan in kolommen volgens hun pad en de linkbreedtes zijn evenredig met de hoeveelheid.
Pagina van het besturingselement
FunnelChart (Complete)
Fasen die versmallen volgens hun waarden, met het aandeel van de eerste fase.
Pagina van het besturingselement
WaterfallChart (Complete)
Een lopend totaal met stijgingen, dalingen en totalen. Groen en rood worden ook onderscheiden door het teken +/- op elke balk en in de gegevenstabel.
Pagina van het besturingselement
CandlestickChart (Complete)
Opening, hoogste, laagste en slot van elke periode, met optioneel volume. Een stijgende periode heeft een holle kaars en een dalende een gevulde, zodat de betekenis niet alleen van kleur afhangt.
Pagina van het besturingselement
Sparkline (Complete)
Piepkleine trendlijn zonder assen, op maat om in tekst of tabelcellen te passen.
Pagina van het besturingselement
Gauge (Complete)
Boogmeter voor één waarde met optionele gekleurde banden. Voor hulptechnologie beschikbaar als een afbeelding met de waarde als label.
Pagina van het besturingselement
LinearGauge (Complete)
Rechte meter voor één waarde, horizontaal of verticaal, met optionele gekleurde banden.
Pagina van het besturingselement
BulletChart (Complete)
Compacte voortgang ten opzichte van een doel: één balk per maat met kwalitatieve bereiken en een doelmarkering.
Pagina van het besturingselement
Map (Complete)
Een kaart getekend als gewone SVG uit GeoJSON. Regio's kunnen op waarde gekleurd worden, markeringen staan op coördinaten en de gebruiker kan een regio selecteren, zoomen en verschuiven.
Pagina van het besturingselement
ChartDataTable (Complete)
Pagina van het besturingselement
ChartLegend (Complete)
Pagina van het besturingselement
ChartToolbar (Complete)
Pagina van het besturingselement
Diagrammen
Diagram (Complete)
Stroomdiagrammen en organigrammen getekend als SVG. Vakken worden automatisch in niveaus geplaatst op basis van hun verbindingen, of op de X en Y die je opgeeft.
Pagina van het besturingselement
Planning
Scheduler (Complete)
Dag-, week-, maand-, agenda-, jaar- en tijdlijnweergaven met afspraken geplaatst op tijd, overlappende afspraken naast elkaar, slepen en neerzetten om een afspraak te verplaatsen, Shift met de pijltoetsen als toetsenbordmanier.
Pagina van het besturingselement
SchedulerEventEditor (Complete)
Het formulier van het afsprakendialoog van de Scheduler: titel, beschrijving, plaats, hele dag, begin en einde, bron, kleur, herinnering, tijdzone en herhaling.
Pagina van het besturingselement
RecurrenceEditor (Complete)
Bewerkt een herhaalregel (iCalendar RRULE): dagelijks, wekelijks op gekozen dagen, maandelijks op een dag of op de n-de weekdag, jaarlijks; elke N perioden; nooit, na een aantal keren of tot een datum.
Pagina van het besturingselement
Gantt (Complete)
Een projectplan: links een takenlijst, rechts balken op een tijdschaal, met subtaken, voortgang, mijlpalen en einde-begin-afhankelijkheden.
Pagina van het besturingselement
Werkruimte
Ribbon (Complete)
De opdrachtbalk in Office-stijl: tabbladen met groepen opdrachten, contextuele tabbladen, een snelle-toegangsstrook en een geminimaliseerde modus.
Pagina van het besturingselement
DockLayout (Complete)
Een werkruimte van panelen. Panelen docken links, rechts, boven, onder of in het midden, delen een gebied als tabbladen, klappen in tot een rail of zweven boven de lay-out.
Pagina van het besturingselement
Window (Complete)
Een zwevend, niet-modaal venster: verplaats, vergroot, minimaliseer, maximaliseer en open er meerdere tegelijk.
Pagina van het besturingselement
DashboardLayout (Complete)
Raster van tegels die de gebruiker met muis, aanraking of toetsenbord verplaatst en vergroot (Alt met pijltoetsen verplaatst, Alt met Shift past de grootte aan).
Pagina van het besturingselement
DesktopShell (Complete)
Een toepassingsschil met een achtergrondlaag en een taakbalk onderaan. De vier bureaubladthema's (Desktop, Desktop Dark, Mist, Mist Dark) geven het afgeronde hoeken, zachte schaduwen en doorschijnende vlakken.
Pagina van het besturingselement
Taskbar (Complete)
De balk onderaan de pagina met een startgebied, de modulenaam, een middengebied en een systeemvak.
Pagina van het besturingselement
Kanban (Complete)
Bord met kolommen. Kaarten bewegen door slepen of met de pijlknoppen; het bord activeert OnMove en jij werkt je gegevens bij, zodat het altijd jouw toestand weerspiegelt.
Pagina van het besturingselement
Chat (Complete)
Berichtenlijst met invoerveld. De lijst is een live-gebied dat naar het nieuwste bericht scrolt, tekst wordt altijd als platte tekst getoond, Enter verzendt en Shift+Enter voegt een nieuwe regel toe (MultiLine=false maakt er één regel van).
Pagina van het besturingselement
MailView (Complete)
Toont de HTML van een e-mailbericht dat van buiten komt. De HTML draait in een afgeschermd frame zonder scripts, met een strikt inhoudsbeveiligingsbeleid, zodat het de pagina van de toepassing niet kan aanraken.
Pagina van het besturingselement
MessageEditor (Complete)
Een lichte editor om een bericht te schrijven: vet, cursief, onderstreept, lijsten, citaat, link en opmaak wissen, met een schakelaar naar platte tekst.
Pagina van het besturingselement
Office
PdfViewer (Complete)
Een viewer voor elke pdf-versie tot 2.0 (ISO 32000-2): doorlopende pagina's, zoomen en draaien, miniaturen, bladwijzers, zoeken, tekstselectie, links, annotaties, formuliervelden, lagen, bijlagen.
Pagina van het besturingselement
PdfCompare (Complete)
Vergelijkt de tekst van twee versies van een pdf pagina voor pagina en toont naast elkaar wat is toegevoegd, verwijderd en gewijzigd.
Pagina van het besturingselement
DocumentEditor (Complete)
Een tekstverwerker die .docx (en het oudere .doc), Rich Text Format (.rtf) en OpenDocument (.odt) opent en opslaat.
Pagina van het besturingselement
RichTextEditor (Complete)
Een compacte editor voor opgemaakte tekst in een formulier: het heeft een Value zoals een tekstvak, maar de tekst kan vet, cursief, een lijst, een link, een afbeelding of een tabel zijn.
Pagina van het besturingselement
PresentationEditor (Complete)
Een presentatie-editor die .pptx (en het oudere .ppt) en OpenDocument (.odp) opent en opslaat.
Pagina van het besturingselement
Spreadsheet (Complete)
Een volledige spreadsheet: formules en functies, opmaak, samengevoegde cellen, vastgezette vensters, grafieken, voorwaardelijke opmaak, gegevensvalidatie, meerdere bladen, ongedaan maken en opnieuw, kopiëren en plakken, doorvoeren, sorteren.
Pagina van het besturingselement
ProofingPanel (Complete)
De lijst met spelling-, grammatica- en logicaproblemen die de pdf-viewer, de documenteditor, de spreadsheet en de presentatie-editor tonen.
Pagina van het besturingselement
DataGridSpreadsheetButton (Complete)
Een werkbalkknop voor een DataGrid die de rijen van het raster (alle pagina's, na filteren en sorteren, alleen zichtbare kolommen) als .xlsx-bestand opslaat.
Pagina van het besturingselement
DataGridPdfButton (Complete)
Pagina van het besturingselement
SchedulerPdfButton (Complete)
Pagina van het besturingselement
ReportButton (Complete)
Pagina van het besturingselement
SlideView (Complete)
Pagina van het besturingselement
PasswordPrompt (Complete)
Pagina van het besturingselement
AI-assistenten
RayCraft heeft geen eigen AI-functies. De documentatie is zo gebouwd dat AI-codeerassistenten er goed mee uit de voeten kunnen:
- Beschrijvende namen van besturingselementen, bijvoorbeeld DatePicker, Autocomplete en Dialog.
- Eén pagina per besturingselement met een samenvatting in gewone taal en, bij de meeste, een kort voorbeeld.
- Een index in platte tekst van elk besturingselement op llms.txt.
- Gestructureerde gegevens (JSON-LD) en een beschrijving op elke pagina.
Controleer gegenereerde code aan de hand van de pagina van het besturingselement: een assistent kan nog steeds fouten maken.