Komponenten-Bibliothek für die Barrierefreiheit

KoliBri - The accessible component library

Last update: Jan 3, 2023

Overview

Willkommen bei KoliBri

KoliBri steht für Komponenten-Bibliothek für die Barrierefreiheit

Weiter zur Dokumentation…

Vision

Wir stellen gemeinsam wiederverwendbare Webkomponenten zur Verfügung, die die Barrierefreiheit und Usability für webbasierte Benutzeroberflächen der Bundesverwaltung sicherstellen.

Mission

KoliBri baut direkt auf den Webstandards des W3C auf (Framework-agnostisch), ist dabei eine generische Referenzimplementierung des WCAG-Standards und der BITV für die Barrierefreiheit und als eine Multi-Theming-fähige Präsentationsschicht umgesetzt. Es gibt keinerlei fachlichen Bezug und keine Datenübertragungsfunktionalitäten. Damit ist KoliBri für die Realisierung statischer Webseiten als auch dynamischer Webanwendungen unterschiedlicher Corporate Designs und Styleguides gleichermaßen wiederverwendbar und somit für Open Source sehr interessant.

Lizenz

KoliBri wird unter der EUROPEAN UNION PUBLIC LICENCE v. 1.2 Open Source freigegeben. Folgende Aspekte sind insbesondere dadurch berücksichtigt:

Zugänglichmachung: Die Artefakte und der Quellcode können von jedem frei und kostenlos wiederverwendet werden. Hierdurch leistet der ITZBund einen Beitrag im Sinne von "Public Money - Public Code".
Gewährleistungs- und Haftungsausschluss: Mit der Wiederverwendung gehen keinerlei Gewährleistung und Haftungsansprüche einher.
„Copyleft“-Klausel: Copyleft besagt, dass jede Kopie von KoliBri (Fork) wieder unter der selben oder einer kompatiblen Open Source-Lizenz veröffentlicht werden muss.

Anwendung erstellen

Im folgenden Video sehen Sie, wie Sie ganz einfach eine Webanwendung auf KoliBri-Basis erstellen können.

Befehl: npm init kolibri@latest my-app

Aktuell können Sie eine statische Webseite oder Webanwendungen für die Frameworks React, Preact, Solid, Next.js, Astro und Angular generieren.

Abgrenzung

KoliBri stellt die Barrierefreiheit auf Ebene der webbasierten Komponenten sicher und bietet die ideale Grundlage zur Realisierung barrierefreier Benutzeroberflächen.

KoliBri ist kein CSS-Framework und auch kein Design System. KoliBri dient jedoch als konkrete Implementierung semantisch korrekter Komponenten für Styleguides und Design Systeme.

KoliBri kombiniert (technisch) die barrierefrei abgestimmten und standardisierten Komponenten mit beliebigen Designs zu jeweils robusten und kundenspezifischen Komponenten für dynamische Webanwendungen und statische Webseiten.

Versionierung

KoliBri folgt den Prinzipien des semantischen Versionierens.

Aufbau einer Version:

besteht in der Regel aus 3 Teilen (z.B. 1.0.2)
- Major, hier die 1
- Minor, hier die 0
- Patch, hier die 2
für die Härtungsphase einer Version, kann man zusätzlich Labels verwenden (z.B. 1.0.3-rc.2)
- Label, hier die rc.2

Folgende Hauptprinzipien kommen dabei zur Anwendung:

Patch: Beinhaltet Änderungen die den aktuellen Funktionsumfang verbessern und in seiner Verwendung nicht ändern.
Minor: Beinhaltet Änderungen die den Funktionsumfang erweitern und den bestehenden Funktionsumfang in seiner Verwendung nicht ändern.
Major: Beinhaltet Änderungen die eine architektonische Neuausrichtung ermöglichen und den bestehenden Funktionsumfang in seiner Verwendung ändern dürfen.

Ausführliche Version der SemVer finden Sie hier: https://semver.org

Qualitätsziele

In der folgenden Tabelle werden die priorisierten Qualitäten von KoliBri aufgelistet:

Qualität	Priorität	Erläuterung
Kompatibilität	AAA	W3C®-Standards, Framework-agnostisch und Open Source
Gebrauchstauglichkeit	AAA	BIK BITV- und Usability-Test
Wartbarkeit	AAA	DevOps, Technologie-Stack, Modularisierung und Automatisierung
Portierbarkeit	AA	Anpassbarkeit an verschiedene Styleguides des Bundes oder anderer
Zuverlässigkeit	AA	BIK BITV-, Axe-, Unit-, Snapshot-, E2E-Tests und Developer Experience (EX)
Performance	A	KoliBri geht hier einen Kompromiss ein, da es die Entwicklung aktiv bei der Umsetzung barrierefreier Benutzeroberflächen unterstützt.
Sicherheit	A	Web Components dienen der Präsentationsschicht und beinhalten selbst keine sensitiven Informationen.

Geräte-, Betriebssystem-, Browser- und Screenreader-Anforderungen

KoliBri ist für die Umsetzung beliebiger webbasierter Benutzeroberflächen vorgesehen und soll auf allen modernen Geräten (PC, Tablet, Mobil), Betriebssystemen (Windows, Linux, MaxOS, Android, iOS) und standardkonformen Browsern eingesetzt werden können.

Der Microsoft Internet Explorer wird explizit nicht unterstützt, um das Projekt und die Entwicklung nicht durch Altlasten zu schwächen. KoliBri investiert stattdessen konziquent in die Zukunft.

Gerät	Betriebsystem	Browser	Screenreader
PC	Windows Linux MacOS	Chrome Firefox Edge Opera Safari (nur MacOS)	NVDA Jaws VoiceOver (nur MacOS)
Tablet Mobil	Android iOS	Chrome Firefox Edge Opera Safari (nur iOS)	TalkBack (nur Android)

Let's go ...

Comments

🛹 Feature: Tabs seitlich anordnen und nur Icons
Note

[x] Ich achte beim Erstellen des Issues darauf, dass ich keine fachlichen und unternehmensinternen Details preisgegebe.

Featureanfrage

Bezieht sich Ihre Feature-Anfrage auf ein Problem? Bitte beschreiben.

Nein

Beschreiben Sie die gewünschte Lösung

Wir würden es toll finden wenn die Tabs Komponente auch Vertikal platziert werden könnte. Für eine Vertikale Platzierung würden wir auch bevorzugen, die Option zu haben nur Icons, ohne Text, zu verwenden.

Beschreiben Sie Alternativen, die Sie in Betracht gezogen haben

Keine

Zusätzlicher Kontext

Beispiel von Vertikalen Tabs.
enhancement good first issue
opened by AndreasZimnas 13
chore(deps-dev): bump npm-check-updates from 16.3.11 to 16.3.16 in /packages/create-kolibri/templates/next.js
Bumps npm-check-updates from 16.3.11 to 16.3.16.

Commits

6aaf11f 16.3.16

2517241 Bump dependencies

dc32589 build: add missing dependency ini (#1210)

fd2f566 16.3.15

ce06f3f Use cross-spawn for better Windows shell support (#1209)

0b871f9 build

2cbdc3e fix typo on cli help description (#1208)

0b09e03 16.3.14

51e02cb Downgrade pacote until installed-package-contents bug is fixed (#1207).

7fb223f 16.3.13

Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 12
chore(deps): bump astro from 1.5.0 to 1.6.2 in /packages/create-kolibri/templates/astro
Bumps astro from 1.5.0 to 1.6.2.

Release notes

Sourced from astro's releases.

[email protected]

Patch Changes

#5243 7d678c9ed Thanks @matthewp! - Upgrade @astrojs/compiler to 0.29.x

Updated dependencies [b6a478f37]:

@astrojs/webapi@1.1.1

[email protected]

Patch Changes

#5233 7f8987085 Thanks @bluwy! - Support rendering @motionone/solid components

#5238 26ff42905 Thanks @MoustaphaDev! - Fix not included file extension in url metadata for newly added markdown files

#5217 8c83359e3 Thanks @Princesseuh! - Fix missing types.d.ts in npm package

#5212 a609a8937 Thanks @bluwy! - Upgrade Vite to 3.2

#5206 d64d5b9b5 Thanks @Princesseuh! - Improve error messages related to CSS and compiler errors

#5212 a609a8937 Thanks @bluwy! - Allow importing public files in SSR

[email protected]

Minor Changes

#5147 0bf0758fb Thanks @natemoo-re! - Add astro/types entrypoint. These utilities can be used for common prop type patterns.

HTMLAttributes

If you would like to extend valid HTML attributes for a given HTML element, you may use the provided HTMLAttributes type—it accepts an element name and returns the valid HTML attributes for that element name.

import { HTMLAttributes } from 'astro/types'; interface Props extends HTMLAttributes<'a'> { myProp?: string; }

#5164 4a8a346ca Thanks @MoustaphaDev! - Add support for markdown files with the following extensions:

.markdown

.mdown

.mkdn

.mkd

.mdwn

#4917 ddf2f8390 Thanks @natemoo-re! - Add support for --base CLI argument, which will override the base set in your astro.config.mjs file.

astro --site https://astro.build --base /docs

... (truncated)

Changelog

Sourced from astro's changelog.

1.6.2

Patch Changes

#5243 7d678c9ed Thanks @matthewp! - Upgrade @astrojs/compiler to 0.29.x

Updated dependencies [b6a478f37]:

@astrojs/webapi@1.1.1

1.6.1

Patch Changes

#5233 7f8987085 Thanks @bluwy! - Support rendering @motionone/solid components

#5238 26ff42905 Thanks @MoustaphaDev! - Fix not included file extension in url metadata for newly added markdown files

#5217 8c83359e3 Thanks @Princesseuh! - Fix missing types.d.ts in npm package

#5212 a609a8937 Thanks @bluwy! - Upgrade Vite to 3.2

#5206 d64d5b9b5 Thanks @Princesseuh! - Improve error messages related to CSS and compiler errors

#5212 a609a8937 Thanks @bluwy! - Allow importing public files in SSR

1.6.0

Minor Changes

#5147 0bf0758fb Thanks @natemoo-re! - Add astro/types entrypoint. These utilities can be used for common prop type patterns.

HTMLAttributes

If you would like to extend valid HTML attributes for a given HTML element, you may use the provided HTMLAttributes type—it accepts an element name and returns the valid HTML attributes for that element name.

import { HTMLAttributes } from 'astro/types'; interface Props extends HTMLAttributes<'a'> { myProp?: string; }

#5164 4a8a346ca Thanks @MoustaphaDev! - Add support for markdown files with the following extensions:

.markdown

.mdown

.mkdn

.mkd

.mdwn

... (truncated)

Commits

5016166 [ci] release (#5239)

7d678c9 Upgrade compiler to latest (#5243)

5be3fde [ci] release (#5215)

26ff429 fix not omitted extension in url metadata for newly added markdown files in...

7f89870 Support rendering @motionone/solid components (#5233)

a609a89 Upgrade Vite to 3.2 (#5212)

25a6360 [ci] format

7fc5d55 Fix errors that are not instanceof Error crashing the dev server (#5216)

8c83359 Fix types.d.ts not being included in the npm package (#5217)

018cc7d [ci] format

Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
chore(deps-dev): bump npm-check-updates from 16.3.14 to 16.3.16 in /packages/create-kolibri/templates/react
Bumps npm-check-updates from 16.3.14 to 16.3.16.

Commits

6aaf11f 16.3.16

2517241 Bump dependencies

dc32589 build: add missing dependency ini (#1210)

fd2f566 16.3.15

ce06f3f Use cross-spawn for better Windows shell support (#1209)

0b871f9 build

2cbdc3e fix typo on cli help description (#1208)

See full diff in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
chore(deps-dev): bump npm-check-updates from 16.0.6 to 16.3.16 in /packages/create-kolibri/templates/solid
Bumps npm-check-updates from 16.0.6 to 16.3.16.

Release notes

Sourced from npm-check-updates's releases.

v16.3.0

Feature

Added workspace support! 🚢

Upgrade all workspaces:

ncu --workspaces ncu -ws

Upgrade a single workspace:

ncu --workspace a ncu -w a

Upgrade more than one workspace:

ncu --workspace a --workspace b ncu -w a -w b

Upgrade all workspaces AND the root project:

ncu --workspaces --root

Upgrade a single workspace AND the root project:

ncu --workspace a --root

Notes

If workspaces or --workspace is run in --interactive mode, ncu will prompt to npm install once in the root project rather than separately in each workspace (#1182).

Running --deep will not trigger workspace support.

Commits

6aaf11f 16.3.16

2517241 Bump dependencies

dc32589 build: add missing dependency ini (#1210)

fd2f566 16.3.15

ce06f3f Use cross-spawn for better Windows shell support (#1209)

0b871f9 build

2cbdc3e fix typo on cli help description (#1208)

0b09e03 16.3.14

51e02cb Downgrade pacote until installed-package-contents bug is fixed (#1207).

7fb223f 16.3.13

Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
chore(deps-dev): bump npm-check-updates from 16.3.11 to 16.3.16 in /packages/create-kolibri/templates/preact
Bumps npm-check-updates from 16.3.11 to 16.3.16.

Commits

6aaf11f 16.3.16

2517241 Bump dependencies

dc32589 build: add missing dependency ini (#1210)

fd2f566 16.3.15

ce06f3f Use cross-spawn for better Windows shell support (#1209)

0b871f9 build

2cbdc3e fix typo on cli help description (#1208)

0b09e03 16.3.14

51e02cb Downgrade pacote until installed-package-contents bug is fixed (#1207).

7fb223f 16.3.13

Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
chore(deps-dev): bump npm-check-updates from 16.3.8 to 16.3.16 in /packages/create-kolibri/templates/angular
Bumps npm-check-updates from 16.3.8 to 16.3.16.

Commits

6aaf11f 16.3.16

2517241 Bump dependencies

dc32589 build: add missing dependency ini (#1210)

fd2f566 16.3.15

ce06f3f Use cross-spawn for better Windows shell support (#1209)

0b871f9 build

2cbdc3e fix typo on cli help description (#1208)

0b09e03 16.3.14

51e02cb Downgrade pacote until installed-package-contents bug is fixed (#1207).

7fb223f 16.3.13

Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
chore(deps-dev): bump npm-check-updates from 16.3.9 to 16.3.16 in /packages/create-kolibri/templates/static
Bumps npm-check-updates from 16.3.9 to 16.3.16.

Commits

6aaf11f 16.3.16

2517241 Bump dependencies

dc32589 build: add missing dependency ini (#1210)

fd2f566 16.3.15

ce06f3f Use cross-spawn for better Windows shell support (#1209)

0b871f9 build

2cbdc3e fix typo on cli help description (#1208)

0b09e03 16.3.14

51e02cb Downgrade pacote until installed-package-contents bug is fixed (#1207).

7fb223f 16.3.13

Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
chore(deps): bump npm-check-updates from 16.3.11 to 16.3.16 in /packages/create-kolibri/templates/astro
Bumps npm-check-updates from 16.3.11 to 16.3.16.

Commits

6aaf11f 16.3.16

2517241 Bump dependencies

dc32589 build: add missing dependency ini (#1210)

fd2f566 16.3.15

ce06f3f Use cross-spawn for better Windows shell support (#1209)

0b871f9 build

2cbdc3e fix typo on cli help description (#1208)

0b09e03 16.3.14

51e02cb Downgrade pacote until installed-package-contents bug is fixed (#1207).

7fb223f 16.3.13

Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
chore(deps-dev): bump @types/react-dom from 18.0.6 to 18.0.8 in /packages/create-kolibri/templates/react
Bumps @types/react-dom from 18.0.6 to 18.0.8.

Commits

See full diff in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
chore(deps-dev): bump playwright from 1.26.1 to 1.27.1 in /packages/create-kolibri/templates/preact
Bumps playwright from 1.26.1 to 1.27.1.

Release notes

Sourced from playwright's releases.

v1.27.1

Highlights

This patch release includes the following bug fixes:

microsoft/playwright#18010 - fix(generator): generate nice locators for arbitrary selectors microsoft/playwright#17999 - chore: don't fail on undefined video/trace microsoft/playwright#17955 - [Question] Github Actions test compatibility check failed mitigation? microsoft/playwright#17960 - [BUG] Codegen 1.27 creates NUnit code that does not compile microsoft/playwright#17952 - fix: fix typo in treeitem role typing

Browser Versions

Chromium 107.0.5304.18

Mozilla Firefox 105.0.1

WebKit 16.0

This version was also tested against the following stable channels:

Google Chrome 106

Microsoft Edge 106

v1.27.0

Locators

With these new APIs, inspired by Testing Library, writing locators is a joy:

page.getByText(text, options) to locate by text content.

page.getByRole(role, options) to locate by ARIA role, ARIA attributes and accessible name.

page.getByLabel(label, options) to locate a form control by associated label's text.

page.getByPlaceholder(placeholder, options) to locate an input by placeholder.

page.getByAltText(altText, options) to locate an element, usually image, by its text alternative.

page.getByTitle(title, options) to locate an element by its title.

await page.getByLabel('User Name').fill('John'); await page.getByLabel('Password').fill('secret-password'); await page.getByRole('button', { name: 'Sign in' }).click();
await expect(page.getByText('Welcome, John!')).toBeVisible();

All the same methods are also available on Locator, FrameLocator and Frame classes.

Other highlights

workers option in the playwright.config.ts now accepts a percentage string to use some of the available CPUs. You can also pass it in the command line:
npx playwright test --workers=20%

... (truncated)

Commits

fde19c1 chore: mark 1.27.1 (#18011)

04b3b71 cherry-pick(#18010): fix(generator): generate nice locators for arbitrary sel...

3367ebd cherry-pick(#17999): chore: don't fail on undefined video/trace (#18001)

730d322 cherry-pick(#17907): docs: improve trace viewer + add video (#18000)

384b710 cherry-pick(#17942): docs(release-notes): add missing reference to Page.getBy...

df7906d cherry-pick(#17959): chore: better integrity error message

f87d6f2 cherry-pick(#17961): fix(codegen): use constants when generating C# and Java ...

4ff2f3d chery-pick(#17952): fix: fix typo in treeitem role typing (#17965)

75aaaac chery-pick(#17918): docs: AriaRole is enum (#17921)

af0d293 cherry-pick(#17912): docs: mention that exact option is ignored for regex

Additional commits viewable in compare view

Dependabot will resolve any conflicts with this PR as long as you don't alter it yourself. You can also trigger a rebase manually by commenting @dependabot rebase.

Dependabot commands and options

You can trigger Dependabot actions by commenting on this PR:

@dependabot rebase will rebase this PR

@dependabot recreate will recreate this PR, overwriting any edits that have been made to it

@dependabot merge will merge this PR after your CI passes on it

@dependabot squash and merge will squash and merge this PR after your CI passes on it

@dependabot cancel merge will cancel a previously requested merge and block automerging

@dependabot reopen will reopen this PR if it is closed

@dependabot close will close this PR and stop Dependabot recreating it. You can achieve the same result by closing it manually

@dependabot ignore this major version will close this PR and stop Dependabot creating any more for this major version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this minor version will close this PR and stop Dependabot creating any more for this minor version (unless you reopen the PR or upgrade to it yourself)

@dependabot ignore this dependency will close this PR and stop Dependabot creating any more for this dependency (unless you reopen the PR or upgrade to it yourself)

dependencies javascript
opened by dependabot[bot] 11
🛹 Feature: Cookie-Banner Component
Note

[ ] Ich achte beim Erstellen des Issues darauf, dass ich keine fachlichen und unternehmensinternen Details preisgegebe.

Featureanfrage

Bezieht sich Ihre Feature-Anfrage auf ein Problem? Bitte beschreiben.

Eine klare und präzise Beschreibung des Problems. Ex. Ich bin immer frustriert, wenn [...]

Beschreiben Sie die gewünschte Lösung

Eine klare und prägnante Beschreibung dessen, was passieren soll.

Beschreiben Sie Alternativen, die Sie in Betracht gezogen haben

Eine klare und prägnante Beschreibung aller alternativen Lösungen oder Funktionen, die Sie in Betracht gezogen haben.

Zusätzlicher Kontext

Fügen Sie hier beliebigen weiteren Kontext oder Screenshots zur Funktionsanfrage hinzu.
enhancement
opened by deleonio 0
💡 Hinweis: A11y Table noch weiter verbessern
Note

[x] Ich achte beim Erstellen des Issues darauf, dass ich keine fachlichen und unternehmensinternen Details preisgegebe.

A11y Hinweise

[ ] Pagination / Border Style fixen

[ ] Pagination in eine eigne Region packen

[ ] Anzahl füllstand in auch in die Caption einfügen
opened by deleonio 0
🐞 Bug: Spalten-Sortierungsstatus merkwürdig
Note

[ ] Ich achte beim Erstellen des Issues darauf, dass ich keine fachlichen und unternehmensinternen Details preisgegebe.

Fehlermeldung

Die Sortierung scheint durcheinander. Gemäß Algorithmus wir die Tabelle steht nach einer Spalte entweder aufwärts, abwärts oder neutral sortiert. Zwei unterschiedliche Spalten können nie in unterschiedliche Richtungen zeigen.
bug
opened by deleonio 0
🛹 Feature: Einstellungsmenü für die KolTable
Note

[ ] Ich achte beim Erstellen des Issues darauf, dass ich keine fachlichen und unternehmensinternen Details preisgegebe.

Featureanfrage

In der Tabelle könnte es ein Untermenü geben, in dem man verschiedene Dinge der Tabelle indiviudell umstellen kann.

Spaltenbreite

Spaltensortierung

usw.

enhancement
opened by deleonio 1
💡 Hinweis: Diskussionsthema / _heading nicht als zwingend ansehen
Note

[ ] Ich achte beim Erstellen des Issues darauf, dass ich keine fachlichen und unternehmensinternen Details preisgegebe.

Hilfreicher Hinweis

Bei allen Komponenten die Headings verwenden, sollte nur dann H1 ... H6 verwendet werden, wenn auch ein entsprechender _level gesetzt wurde.
opened by deleonio 0

Releases(1.1.15)

1.1.15(Dec 20, 2022)
Changelog

🔧 Table: Wenn die Tabelle leer ist, dann wird die Pagination ausgeblendet.

🚹 Table: Verbesserung der Auszeichnung bei leeren Tabellen

🔧 Select: Single-Select wählt automatisch den ersten Wert in der Liste aus.

🚹 Tabs: Optimierung der Barrierefreiheit (Axe)

🔧 Version: Icon gefixed

🌟 Badge: Der Badge wurde um einen Smart-Button, wie bei den Inputs, erweitert.

🌟 Meta-Konfiguration: Einführung eines "Experimental mode" zum Ausprobieren neuer Funktionalitäten

🔧 Textarea: Überflüssiges Aria-Hidden entfernt

🔧 Radio: Verbesserung der Value-Zuordnung (boolean, number, string, Array und Object)

🔧 Dev-Tools: Verbesserung der Consolen-Hinweise bei Validierungsfehlern

🔧 Breadcrumb & Details: Identifier für Font-Awesome korrigiert

🚹 Abbr: Verbesserung der Screenreader-Unterstützung

🔧 CLI: KoiBri-Library-Template optimiert

Source code(tar.gz)
Source code(zip)
1.1.14(Dec 6, 2022)
Changelog

❗ Themes: Theme der Hanse Stadt Hamburg "umgezogen" (@public-oss/kolibri-themes)

🔧 Table: Fix Validierung von JSON

🚹 Cheat Sheet: Optimierung der Barrierefreiheit

📚 Publiccode: Überarbeitung der publiccode.yml

Source code(tar.gz)
Source code(zip)
1.1.13(Dec 5, 2022)
Changelog

🔧 Form-Events: Event-Handling für Submit optimiert (target: HTMLFormElement)

🔧 Dev-Tools: Verbesserung der Consolen-Hinweise bei Validierungsfehlern

🔧 Register: Fehler bei der impliziten Theme-Erkennung ohne data-Attribute behoben

🔧 Table: TabIndex für das seitliche Scrollen hinzugefügt (AXE)

🔧 Tooltips: Positionierung des Tooltips optimiert (in Scroll-Zones)

🌟 Angular: Versionsspezifische Adapter notwendig (wir unterstützen v11, v12, v13, v14 und v15)

@public-ui/angular-v11

@public-ui/angular-v12

@public-ui/angular-v13

@public-ui/angular-v14

@public-ui/angular-v15

@public-ui/angular (@deprecated)

Nutzungsstatistik

🌟 Designer: Der Designer kann jetzt auch als PWA lokal installiert werden.

🌟 Storybook: Das Storybook kann jetzt auch als PWA lokal installiert werden.

🌟 Tabs: Anordnung der Tabs auch seitlich möglich (_tabsAlign)

🔧 Table: Fix Icon-Identifier für Auf- und Absortieren

📚 Cheat Sheet: Einbindung des Cheat Sheet ins Storybook

❗ Tabs: Tab-Inhalt war nach Seitenwechseln weg

Source code(tar.gz)
Source code(zip)
1.1.12(Nov 22, 2022)
Changelog

🔧 Table & Pagination: Fix Property-Reflection für _pagination

🔧 Template: Fehler in Angular-Template behoben

🔧 Textarea: Fehler beim initialen Zählen der eingebenen Zeichen behoben

🔧 CI-Pipeline: Continuous Integration optimiert

🔧 Icons: Weitere Identifier von Icons korrigiert

🚹 Logo: Alternativtext verkürzt

Source code(tar.gz)
Source code(zip)
1.1.11(Nov 21, 2022)
Changelog

👩‍🎨 Theming: Theme-Method optimiert (Handling für "übergreifendes CSS")

🔧 Inputs, Select, Textarea: Alert der Fehlermeldungen standardmäßig aktiv

❗ InputCheckbox: Umbenennung der Property _type (@deprecated) in _variant (Semantik)

🔧 Pagination: Äußere Sprung-Buttons zur ersten oder letzten Seite immer aktiv, außer aktive Seite ist entweder am Anfang oder Ende

🌟 Themes

🔧 DESY-Theme optimiert (noch nicht BITV-getestet)

🌟 Styleguide des Freistaates Thüringen (noch nicht BITV-getestet)

🌟 Select: Multi-Select erlaubt keine Auswahl (https://html.spec.whatwg.org/#attr-select-multiple)

🌟 Angular-Adapter Upgrade (v15)

🔧 InputDate, InputNumber: Validierung und Mapping von _max, _min, und _value optimiert (ISO, Float-Values)

🔧 Table: Überflüssige Aria-Auszeichnung (aria-readonly) entfernt

🔧 Nav, Table: Icon-Identifier ergänzt

📚 Cheat Sheet: Generator-Script zum Erzeugen und Synchronisieren eines Cheat-Sheet für die Entwicklung

Source code(tar.gz)
Source code(zip)
1.1.10(Nov 11, 2022)
Changelog

🔥 Badge, Link, Nav, Tabs: Alle Icofont and Font-Awesome spezifischen Typen entfernen (KoliBriIconProp)

🔧 Font Awesome: Wechseln von Icofont auf Font Awesome bei allen Default-internen Icons

🌟 Button: Zusätzlichen SPAN-Tag hinzugefügt, um den sichbaren Button kleiner darstellen zu können, obwohl die Klickfläche weiterhin mindestens 44x44px groß bleibt.

🔧 Fix Form-Submit und -Reset-Propagation (KolButton, KolButtonLink)

🔧 Button, LinkButton: Custom-Variante optimiert (entweder-oder)

🌟 CLI: Weitere Framework-Integrationen als Templates hinzugefügt

Astro

Next.js

Preact

Theme (zum Erstellen eigener Theme-Pakete)

🌟 Nav + Link: Einführung der Aria-Current-Auszeichnung

🌟 ButtonLink & LinkButton: Neue Komponenten - Button als Link oder Link als Button

🌟 Textarea: Textarea verlängert sich nach unten automatisch, je nach Textlänge

🌟 InputDate: Neue Komponente für Datum, Zeit, Wochen, Monat und lokales Datum

🌟 Tab-Index: Neues Property für Button, ButtonLink, Link und LinkButton

🔥 InputNumber: Gemäß neuer W3C-Spec beinhaltet InputNumber nicht mehr die Datumstypen (ℹ️ wird erst mit Major-Release entfernt).

🔥 Nicht required Properties erlauben null und damit das Zurücksetzen auf den Detault-Value.

🌟 "Expert"-Slot eingefügt, um mehr Flexibilität mit Eigenverantwortung zu erhalten

📚 Dokumentation: Theming-Konzept eingefügt

📚 Dokumentation: Slot-Konzept eingefügt

🔧 Storybook: Das Umschalten des Themes funktioniert jetzt ohne manuelles Neuladen

🔥 Packaging: Veraltete Theme-CSS-Dateien entfernt (aus Release 1.0)

🔥 Packaging: Aufbauseite (www/) ist für die Wiederverwendung nicht relevant und wird nicht mehr mitverpackt

👩‍🎨 Theming: BMF-, DESY- und MAPZ-Theme an Änderungen angepasst

Source code(tar.gz)
Source code(zip)
1.1.9(Oct 13, 2022)
Changelog

🔥 ESM: Build-Optimierung aller Pakete für SSG und SSR (ℹ️ JavaScript-Modules)

🔧 Aktualisierung der Abhängigkeiten aller Paket

🌟 CLI: Templates für weitere Framework-Integrationen

Angular

SolidJS

Statische HTML-Seite

🌟 Designer-Projekt ins Mono-Repository aufgenommen

🔧 DevOps: Auto-Dependency-Pipeline hinzugefügt

🔧 DevOps: Auto-Sync to OpenCoDE

Source code(tar.gz)
Source code(zip)
1.1.8(Oct 13, 2022)
Changelog

🔧 Fix: Fehlender Import im React-Template behoben (create-kolibri)

Source code(tar.gz)
Source code(zip)
1.1.7(Oct 13, 2022)
Changelog

🌟 KoliBri-Logo: Farbattribut hinzugefügt (_color)

🌟 Adapter: Vue-Adapter hinzugefügt (experimentell)

👩‍🎨 Font: Roboto-Dateien für Theme MAPZ hinzugefügt (⚠️ Assets aus Theme-Paket neu in Projekte übernehmen!)

🔥 Open Source: Es sind die Hinweise zur Open Source-Freigabe zu beachten (s.o.)!

🌟 KolModal: Schließen mit ESC

🔥 CSR: Der ToasterService ist nur client-seitig relevant und muss mit dem Document instanziiert werden.

🔧 Aktualisierung von Abhängigkeiten und Verbesserungen der Bibliothek

🌟 SSR: Entkopplung vom Window und Document für Server-Side-Rendering

🌟 Designer ist jetzt im Care-Package enthalten

🔧 InputText: Search-Event-Handling optimiert

🌟 Textarea: Textlänge-Anzeige auch bei initialem Text

🔧 Table: Backend-seitige Pagination - Lösungsweg in Dokumentation beschrieben

🔥 Pagination: Property _count ersatzlos entfernt

🔥 LeanInputAdapter: Migrationsanleitung in Komponente enthalten - Logik wurde entfernt

Source code(tar.gz)
Source code(zip)

Komponenten-Bibliothek für die Barrierefreiheit

Related tags

Overview

Willkommen bei KoliBri

Vision

Mission

Lizenz

Anwendung erstellen

Abgrenzung

Versionierung

Qualitätsziele

Geräte-, Betriebssystem-, Browser- und Screenreader-Anforderungen

Let's go ...

Comments

Featureanfrage

Bezieht sich Ihre Feature-Anfrage auf ein Problem? Bitte beschreiben.

Beschreiben Sie die gewünschte Lösung

Beschreiben Sie Alternativen, die Sie in Betracht gezogen haben

Zusätzlicher Kontext

Patch Changes

Patch Changes

Minor Changes

HTMLAttributes

1.6.2

Patch Changes

1.6.1

Patch Changes

1.6.0

Minor Changes

HTMLAttributes

v16.3.0

Feature

Notes

v1.27.1

Highlights

Browser Versions

v1.27.0

Locators

Other highlights

Featureanfrage

Bezieht sich Ihre Feature-Anfrage auf ein Problem? Bitte beschreiben.

Beschreiben Sie die gewünschte Lösung

Beschreiben Sie Alternativen, die Sie in Betracht gezogen haben

Zusätzlicher Kontext

Fehlermeldung

Featureanfrage

Releases(1.1.15)

1.1.15(Dec 20, 2022)

Changelog

1.1.14(Dec 6, 2022)

Changelog

1.1.13(Dec 5, 2022)

Changelog

1.1.12(Nov 22, 2022)

Changelog

1.1.11(Nov 21, 2022)

Changelog

1.1.10(Nov 11, 2022)

Changelog

1.1.9(Oct 13, 2022)

Changelog

1.1.8(Oct 13, 2022)

Changelog

1.1.7(Oct 13, 2022)

Changelog

Owner

KoliBri - The accessible component library

Voorbeeldimplementatie van software die werkt op basis van NEN 2660-2:2022

Memento mori (Latin for 'remember that you [have to] die'). Self-filling calendar.

Autocomplete für YForm Tabellen

Workflows für REDAXO 5 Addons

Die Regenbogenkarte ist eine interaktive Karte für das Anzeigen und Entdecken von queeren (Jugend)-Gruppen.

Voorbeeldimplementatie van software die werkt op basis van NEN 2660-2:2022

Memento mori (Latin for 'remember that you [have to] die'). Self-filling calendar.

Termbase für Übersetung in Form eines Obsidian Vault

Autocomplete für YForm Tabellen

Workflows für REDAXO 5 Addons

`HTMLAttributes`

`HTMLAttributes`