Zum Inhalt springen
Fieldbook
Menü
Anmelden
DE

Eingabefelder

Multi-Date Picker

Multi-Date Picker: Ein Zweimonatskalender zur Auswahl einer Handvoll einzelner, nicht aufeinanderfolgender Daten bis zu einer maximalen Anzahl, wobei jede Auswahl als eigener ausgefüllter Tag angezeigt wird.

Multi-Date Picker verwenden

Multi-Date Picker verwendet das Vorschauformat „breit“ mit der Theme-Einstellung „hell/dunkel“.

Vorschau anpassen

Diese Einstellungen werden an die Demo übergeben. Standardwerte und Grenzen gelten für die Vorschau; die vollständige Props-API steht in der Implementierung.

EinstellungTypStandardwertVorschaugrenzen
accentcolor#F5C542Keine weitere Grenze in den Metadaten.
maxDatesnumber5Von 1 bis 10; Schrittweite 1
startMonthnumber6Von 1 bis 12; Schrittweite 1
startYearnumber2025Von 2020 bis 2030; Schrittweite 1
Für welche Frameworks ist Multi-Date Picker verfügbar?

Multi-Date Picker ist für React, Vue, Svelte, Astro, HTML verfügbar. Die Live-Vorschau verwendet React; die folgenden Quellcode-Beobachtungen beziehen sich auf index.tsx. Prüfe die gewählte Portierung auf die benötigten Interaktionen.

Welche Abhängigkeiten hat Multi-Date Picker?

Die React-Metadaten nennen keine zusätzlichen npm-Abhängigkeiten neben React.

Welche Details zur Barrierefreiheit sind in Multi-Date Picker erkennbar?

Der React-Quellcode von Multi-Date Picker enthält: native Elemente (button); Attribute und Ereignisbehandler (aria-disabled, aria-hidden, aria-label, aria-pressed, onKeyDown, tabIndex); Tastenvergleiche (ArrowDown, ArrowLeft, ArrowRight, ArrowUp). Dies sind Beobachtungen am Quellcode. Prüfe zugängliche Namen, Fokusreihenfolge und Tastaturverhalten auf der zusammengesetzten Seite.

Wie berücksichtigt Multi-Date Picker reduzierte Bewegung?

Die Quellcode-Analyse fand in der index.tsx von Multi-Date Picker keine direkte Abfrage über useReducedMotion() oder matchMedia. Prüfe die vollständige Implementierung, gemeinsame Stile und die gewählte Portierung mit aktivierter Bewegungsreduktion; diese Beobachtungen belegen keinen vollständigen Animationsstopp.

Verbinde deinen Agenten

Verwandte offene Komponenten

Standbild der UI-Komponente Appointment Range Card von Fieldbook aus der Kategorie Eingabefelder.
2108Appointment Range CardEingabefelderEine Karte, die ein Datumsraster für einen Monat mit einem Feld für Startzeit und Endzeit darunter kombiniert, um einen Tag und ein Zeitfenster in einem kompakten Block auszuwählen.
Standbild der UI-Komponente Birthdate popover picker von Fieldbook aus der Kategorie Eingabefelder.
2305Birthdate popover pickerEingabefelderEine beschriftete Schaltfläche, die einen schwebenden Kalender mit Dropdown-Listen für Monat und Jahr öffnet, um schnell zu einem Geburtsjahr zu gelangen, und sich selbst schließt, sobald ein Tag ausgewählt wird.
Standbild der UI-Komponente Mobile date drawer von Fieldbook aus der Kategorie Eingabefelder.
2388Mobile date drawerEingabefelderEin für die Berührung gestaltetes Datumsfeld, das seinen Kalender als unteres Blatt öffnet, das vom Rand des Rahmens nach oben gleitet, und nicht als kleines schwebendes Popover.
Standbild der UI-Komponente Multi select toggle row von Fieldbook aus der Kategorie Eingabefelder.
2002Multi select toggle rowEingabefelderEine Reihe unabhängiger Umschalttasten, wie Textformatierungsoptionen, bei denen eine beliebige Zahl gleichzeitig gedrückt bleiben kann.
Standbild der UI-Komponente Natural Language Date Field von Fieldbook aus der Kategorie Eingabefelder.
2389Natural Language Date FieldEingabefelderEin Textfeld, das Sätze wie „in 2 Tagen“ oder „nächsten Freitag“ als echtes Datum liest, mit einem Kalender-Popover und einem Live-Vorschausatz darunter.
Standbild der UI-Komponente Stacked option checklist von Fieldbook aus der Kategorie Eingabefelder.
2782Stacked option checklistEingabefelderEine gestapelte Liste beschrifteter Kontrollkästchen, die eine gemeinsame Auswahl haben, mit einer laufenden Zählung der Anzahl ausgewählter Elemente.