Changelog und Roadmap
Was neu ist und was kommt, in sechs Aufbauten: Zeitleiste der Versionen, Roadmap-Spalten, Versionskarte mit Bild, filterbare Liste, Abstimmung über Wünsche und Abo-Fläche.
Kategorie wechseln
Marketing
- Hero17
- Features15
- Logo Clouds8
- Stats8
- Pricing11
- Testimonials11
- Call to Action11
- FAQ7
- Newsletter12
- Banners9
- Popups und Consent7
- Services7
- Use Cases6
- Security und Trust7
- Changelog und Roadmap6
- Launch und Waitlist6
- Product Tour6
- Press und Awards10
- AI Features6
- App Download5
- Spenden und Unterstützen4
- Problem und Lösung5
- Einwände5
- Rechner10
- Quiz und Produktberater5
- Kostenlos testen5
- Empfehlung und Partner10
- Community5
- Open Source5
- Manifest5
- Angebot5
- Lead-Magnet4
- Scroll-Geschichten20
- Scroll-Reisen13
- Scroll-Effekte13
- Scroll-Reveals und Übergänge15
Content
- Blog16
- Gallery7
- Team8
- About11
- Content8
- Process7
- Contact8
- Comparison5
- Integrations5
- Error Pages5
- Careers7
- Case Studies6
- Portfolio6
- Events und Webinars6
- Help Center6
- Rechtstexte5
- Dokumentation4
- Suchergebnisse5
- Ressourcen und Downloads4
- Podcast4
- Redaktion15
- Autoren und Interviews10
- Glossar5
- Rezepte5
- Datengeschichten10
- Long Reads5
- Umfragen und Feedback14
- Formularzustände12
- Anfrageformulare16
- Bewerbungen und Anmeldungen13
- Adresse, Zahlung und Einwilligung12
App
- Auth9
- Dashboards6
- Tables6
- Settings5
- AI und Chat16
- Calendar5
- Inbox und Messages5
- Notifications6
- Files6
- Projects6
- Profiles6
- Onboarding6
- Billing und Usage10
- Developer Settings15
- Security und Zugriff10
- Import, Export und Verlauf15
- Automation und Builder14
- KI-Antworten18
- KI-Schreiben und Erstellen13
- KI-Einrichtung14
- KI-Assistenten9
E-Commerce
Industries
- Menus7
- Appointments6
- Listings6
- Courses6
- Rooms und Stays5
- Classes und Schedules6
- Arztpraxis5
- Kanzlei5
- Salon und Spa5
- Autohaus5
- Reisen5
- Sportverein5
- Coworking5
- Museum5
- Kino5
- Schule5
- Handwerk5
- Versicherung5
- Bank5
- Personal Brand15
- Speaker und Media Kits10
- Creator15
- Coaching und Beratung10
- Kunst und Musik15
- Zahnarztpraxis5
- Tierarztpraxis5
- Therapiepraxis5
- Hochzeiten und Events5
- Architekturbüro5
- Steuerberatung5
- Immobilienmakler5
- Blumenladen5
- Weingut5
- Kita5
- Fahrschule5
- Pflege5
- Festival5
Elements
- Buttons20
- Forms und Inputs22
- Picker und Auswahlfelder21
- Spezielle Eingabefelder20
- Cards10
- Overlays21
- Navigation15
- Menüleisten und Umschalter14
- Data Display15
- Fortschritt und Zustände13
- Listen, Bäume und Timelines17
- Charts22
- Vergleichs-Charts22
- Statistik-Charts20
- KPI-, Live- und Karten-Charts22
- Text Effects15
- Textakzente16
- Backgrounds19
- Beams, Partikel und Bewegung18
- Media19
- Code und JSON8
- Panels und Splitter4
Neuigkeiten und Roadmap
Details
Was Neuigkeiten und Roadmap mitbringt, aus Registry und Quellcode gelesen.
- Bereich
- Marketing
- Variants
- 6
- Version
- 1.0.0 · seit 1.0.0
- Datei
- components/ui/changelog.tsx
- npm-Pakete
- Keine
- Sprachen
- Englisch und Deutsch, 31 eigene Texte
- Mit KI bauen
- Per MCP in Claude, Cursor, Copilot und Codex
Props
Die Schnittstelle ChangelogProps aus components/ui/changelog.tsx. Beschreibungen stammen aus den Kommentaren im Code und sind auf Englisch.
variantoptionalChangelogVarianttimelineroadmaprelease-cardcompactvotingsubscribe
eyebrowoptionalReact.ReactNodetitleoptionalReact.ReactNodedescriptionoptionalReact.ReactNodeactionsoptionalReact.ReactNodereleasesoptionalChangelogRelease[]timeline, release-card, compact, subscribe. Newest first.
roadmapoptionalRoadmapItem[]roadmap
requestsoptionalFeatureRequest[]voting
onVoteoptional(id: string, voted: boolean) => voidvoting: called on every vote change
onSubscribeoptional(email: string) => voidsubscribe: called with the email address
Eingebaute Texte
Diese Texte schreibt Neuigkeiten und Roadmap selbst. Die Sprache folgt dem KitProvider, über die Prop labels ersetzt du einzelne.
Alle 31 Texte anzeigen
| Schlüssel | Englisch | Deutsch |
|---|---|---|
| new | Englisch New | Deutsch Neu |
| improved | Englisch Improved | Deutsch Verbessert |
| fixed | Englisch Fixed | Deutsch Behoben |
| security | Englisch Security | Deutsch Sicherheit |
| all | Englisch All | Deutsch Alle |
| planned | Englisch Planned | Deutsch Geplant |
| progress | Englisch In progress | Deutsch In Arbeit |
| done | Englisch Done | Deutsch Fertig |
| open | Englisch Open | Deutsch Offen |
| readMore | Englisch Read the release notes | Deutsch Versionshinweise lesen |
| earlier | Englisch Earlier releases | Deutsch Frühere Versionen |
| latest | Englisch Latest release | Deutsch Neueste Version |
| vote | Englisch Vote for | Deutsch Stimme geben für |
| voted | Englisch Remove vote for | Deutsch Stimme zurückziehen für |
| top | Englisch Top | Deutsch Beliebt |
| newest | Englisch Newest | Deutsch Neueste |
| votes | Englisch votes | Deutsch Stimmen |
| comments | Englisch comments | Deutsch Kommentare |
| suggest | Englisch Suggest a feature | Deutsch Funktion vorschlagen |
| suggestPh | Englisch What would help you? | Deutsch Was würde dir helfen? |
| add | Englisch Add | Deutsch Hinzufügen |
| added | Englisch Added. Thanks for the idea. | Deutsch Hinzugefügt. Danke für die Idee. |
| Englisch Email address | Deutsch E-Mail-Adresse | |
| emailPh | Englisch you@company.com | Deutsch du@firma.de |
| subscribe | Englisch Subscribe | Deutsch Abonnieren |
| subscribed | Englisch You are on the list. The next update lands in your inbox. | Deutsch Du stehst auf der Liste. Das nächste Update kommt in dein Postfach. |
| invalid | Englisch Please enter a valid email address. | Deutsch Bitte gib eine gültige E-Mail-Adresse ein. |
| filter | Englisch Filter by type | Deutsch Nach Art filtern |
| roadmap | Englisch Roadmap | Deutsch Roadmap |
| items | Englisch items | Deutsch Einträge |
| changes | Englisch changes | Deutsch Änderungen |
Barrierefreiheit
Aus dem Quellcode der Component abgeleitet.
- Neuigkeiten und Roadmap reagiert selbst auf die Tasten Pfeil links, Pfeil rechts und Leertaste.
- Setzt aria-controls, aria-describedby, aria-invalid, aria-label, aria-labelledby, aria-live, aria-pressed und aria-selected, damit Screenreader Zweck und Zustand ansagen.
- Nutzt die Rollen group, status, tab, tablist und tabpanel.
- Meldet Änderungen über eine Live-Region, ohne den Fokus zu verschieben.
- Jedes Feld hat ein Label, sichtbar oder für Screenreader.
- Ergänzt Text für Screenreader, wo Icons und Grafiken allein stehen.
- Zeigt bei Bedienung mit der Tastatur einen sichtbaren Fokusring.
- Der Server rendert den Startzustand vollständig, JavaScript ergänzt nur die Interaktion.
Bewegung
- Erscheint beim ersten Sichtkontakt mit einem kurzen Auftritt (kit-rise, useInView).
- Bewegt sich mit dem Scrollen, der Fortschritt folgt der Position auf der Seite.
- Bringt eigene Animationen mit, ruhig getaktet und ohne Wackeln.
- Bei reduzierter Bewegung (prefers-reduced-motion) bleibt sie ruhig. 9 Stellen im Code schalten Bewegung dann ab.
Häufige Fragen
Wie installiere ich Neuigkeiten und Roadmap?
Mit aiw add @ai-website/changelog. Der Befehl legt die Datei components/ui/changelog.tsx in dein Projekt, der Code gehört danach dir. Mit dabei sind icon, section, button und reveal. Weitere npm-Pakete braucht sie nicht.
Welche Varianten hat Neuigkeiten und Roadmap?
6 Varianten, Zeitleiste der Versionen, Roadmap-Spalten, Versionskarte mit Bild, Kompakte Liste, Abstimmung über Wünsche und Neueste mit Abo. Du wählst sie mit der Prop variant, zum Beispiel variant="roadmap".
Kann ich die Texte von Neuigkeiten und Roadmap übersetzen?
Ja. Neuigkeiten und Roadmap bringt 31 eigene Texte auf Deutsch und Englisch mit, etwa „Neu“, „Verbessert“ und „Behoben“. Die Sprache folgt dem KitProvider, einzelne Texte ersetzt du über die Prop labels.
Kann ein KI-Assistent Neuigkeiten und Roadmap einbauen?
Ja. Über den MCP-Server der aiw CLI finden Claude, Cursor, GitHub Copilot, Windsurf, Codex und Gemini Neuigkeiten und Roadmap mit aiw_components und installieren sie mit aiw_add @ai-website/changelog. Nenn im Prompt die Variante, etwa variant="timeline", dann schreibt der Assistent deine Inhalte direkt in die Props.
Kann ich Neuigkeiten und Roadmap ohne Code anpassen?
Ja, im Studio. Alle 6 Varianten lassen sich dort bearbeiten, Texte, Listen und Schalter. Das Studio schreibt den passenden Changelog-Code zum Kopieren.
Ähnliche Components, Wird oft kombiniert mit
Ähnliche Components
Mehr aus Marketing, demselben Bereich des Kits.
- Security und TrustZertifikate, Datenschutz, Uptime und Garantien.
- Use CasesEin Angebot, gezeigt für die Menschen, die es nutzen.
- ServicesWas du anbietest, als Cards, Listen und Detail Rows.
- Press und AwardsBerichte, Awards und Media Kits.
- Alles aus MarketingSections, die verkaufen. Heroes, Features, Pricing, Social Proof und Calls to Action.
Wird oft kombiniert mit
Sections, die auf einer Seite meist neben Changelog und Roadmap stehen.
Quellcode lädt