@bauer-group/accessibility-widget-nextjs
v2.1.0
Published
Next.js App Router Wrapper (Client Component) für das BAUER GROUP Accessibility Widget.
Maintainers
karl.bauerReadme
@bauer-group/accessibility-widget-nextjs
Next.js App Router wrapper with the
'use client'directive.
🇬🇧 English · 🇩🇪 Deutsch
Installation
npm install @bauer-group/accessibility-widget-nextjsNo assets to host — the widget loads from the BAUER GROUP CDN (floating v1 tag) and stays current automatically.
Usage
Zero-config — drop the client component into your root layout:
// app/layout.tsx
import { AccessibilityWidgetClient } from '@bauer-group/accessibility-widget-nextjs';
export default function Layout({ children }: { children: React.ReactNode }) {
return (
<html lang="de">
<body>
{children}
<AccessibilityWidgetClient />
</body>
</html>
);
}Configuration
AccessibilityWidgetClient forwards the React wrapper's props; the config prop is fully typed (WidgetConfig) and accepts every option of window.AccessibilityWidgetConfig — appearance, behaviour, content and the 15 accessibility features (initialFeatures / disabledFeatures). Full list (types, defaults, EN/DE): configuration reference.
<AccessibilityWidgetClient
config={{ position: 'bottom-left', locale: 'de', initialFeatures: { contrast: true } }}
/>To self-host instead of the CDN, set loaderSrc, coreSrc and cssHref to your own asset URLs (e.g. under public/accessibility-widget/*).
License
MIT · © 2026 BAUER GROUP — the widget loaded at runtime is separately licensed (AGPL-3.0-only or commercial).
🇩🇪 Deutsch
Next.js-App-Router-Wrapper mit
'use client'-Direktive.
🇬🇧 English · 🇩🇪 Deutsch
Installation
npm install @bauer-group/accessibility-widget-nextjsKeine Assets zu hosten — das Widget lädt vom BAUER GROUP CDN (floating v1-Tag) und bleibt automatisch aktuell.
Nutzung
Zero-Config — die Client-Komponente ins Root-Layout einbinden:
// app/layout.tsx
import { AccessibilityWidgetClient } from '@bauer-group/accessibility-widget-nextjs';
export default function Layout({ children }: { children: React.ReactNode }) {
return (
<html lang="de">
<body>
{children}
<AccessibilityWidgetClient />
</body>
</html>
);
}Konfiguration
AccessibilityWidgetClient reicht die Props des React-Wrappers durch; die config-Prop ist vollständig typisiert (WidgetConfig) und akzeptiert jede Option von window.AccessibilityWidgetConfig — Darstellung, Verhalten, Inhalt und die 15 Barrierefreiheits-Funktionen (initialFeatures / disabledFeatures). Komplette Liste (Typen, Defaults, EN/DE): Konfigurations-Referenz.
<AccessibilityWidgetClient
config={{ position: 'bottom-left', locale: 'de', initialFeatures: { contrast: true } }}
/>Zum Self-Hosting statt CDN loaderSrc, coreSrc und cssHref auf eigene Asset-URLs setzen (z. B. unter public/accessibility-widget/*).
Lizenz
MIT · © 2026 BAUER GROUP — das zur Laufzeit geladene Widget ist separat lizenziert (AGPL-3.0-only oder kommerziell).