|
191 | 191 | },{ |
192 | 192 | name: `button`, |
193 | 193 | desc: `**Buttons** dienen dazu, Benutzer:innen Auswahlmöglichkeiten für Aktionen anzuzeigen und diese in einer klaren Hierarchie anzuordnen. Sie helfen Nutzer:innen, die wichtigsten Aktionen einer Seite oder innerhalb eines Viewports zu finden und ermöglichen es ihnen, diese Aktionen auszuführen. Die Beschriftung des Buttons wird verwendet, um Nutzer:innen klar anzuzeigen, welche Aktion ausgelöst wird. Buttons ermöglichen es Nutzer:innen, eine Änderung zu bestätigen, Schritte in einer Aufgabe abzuschließen oder Entscheidungen zu treffen.`, |
194 | | - props: `_access-key, _aria-controls, _aria-current, _aria-expanded, _aria-label, _aria-selected, _custom-class, _disabled, _hide-label, _icon, _icon-align, _icon-only, _id, _label, _role, _tab-index, _tooltip-align, _type, _variant` |
| 194 | + props: `_access-key, _aria-controls, _aria-current, _aria-expanded, _aria-label, _aria-selected, _custom-class, _disabled, _hide-label, _icon, _icon-align, _icon-only, _id, _label, _role, _tab-index, _tooltip-align, _type, _value, _variant` |
195 | 195 | },{ |
196 | 196 | name: `button-group-wc`, |
197 | 197 | desc: `**Buttons** dienen dazu, Nutzer:innen Auswahlmöglichkeiten für Aktionen anzuzeigen und diese in einer klaren Hierarchie anzuordnen. Sie helfen den Nutzer:innen, die wichtigsten Aktionen einer Seite oder innerhalb eines Applikation zu finden und ermöglichen es ihm, diese Aktionen auszuführen. |
|
209 | 209 | Bei einem Link gibt es das Property 'target', welches ggf. den Link in einem neuen Fenster/Tab öffnet. Das Verhalten ist aktuell noch nicht umgesetzt. |
210 | 210 |
|
211 | 211 | Da der Link, nicht wie der Button, in mehrere Varianten ('primary' oder 'secondary' usw.) angeboten wird, stehen die Properties '_customClass' und '_variant' nicht zur Verfügung.`, |
212 | | - props: `_access-key, _aria-controls, _aria-current, _aria-expanded, _aria-label, _aria-selected, _disabled, _hide-label, _icon, _icon-only, _id, _label, _role, _tab-index, _tooltip-align, _type` |
| 212 | + props: `_access-key, _aria-controls, _aria-current, _aria-expanded, _aria-label, _aria-selected, _disabled, _hide-label, _icon, _icon-only, _id, _label, _role, _tab-index, _tooltip-align, _type, _value` |
213 | 213 | },{ |
214 | 214 | name: `card`, |
215 | 215 | desc: `Um einzelne Bereiche Ihrer Webseite optisch hervorzuheben, bietet sich die **Card**-Komponente an. Mit ihrer Hilfe können Sie Ihre Inhalte sehr einfach strukturieren. |
|
363 | 363 | },{ |
364 | 364 | name: `split-button`, |
365 | 365 | desc: `> <kol-badge _label="untested"></kol-badge> Diese neue Komponente wird als ungetestet markiert, da der vollständige Barrierefreiheitstest noch aussteht. Der vollständige Test kann bei neuen Komponenten und Funktionalitäten auch erst nach einem abgeschlossenen Release erfolgen.`, |
366 | | - props: `_access-key, _aria-controls, _aria-current, _aria-expanded, _aria-label, _aria-selected, _custom-class, _disabled, _hide-label, _icon, _icon-only, _label, _role, _show-dropdown, _tab-index, _tooltip-align, _type, _variant` |
| 366 | + props: `_access-key, _aria-controls, _aria-current, _aria-expanded, _aria-label, _aria-selected, _custom-class, _disabled, _hide-label, _icon, _icon-only, _label, _role, _show-dropdown, _tab-index, _tooltip-align, _type, _value, _variant` |
367 | 367 | },{ |
368 | 368 | name: `symbol`, |
369 | 369 | desc: `Die **Symbol**-Komponente ermöglicht das Rendern beliebiger Symbole mit steuerbarer Ausgabe durch den Screenreader.`, |
|
462 | 462 | desc: `Setzt die Iconklasse (z.B.: `_icon="codicon codicon-home`).`, |
463 | 463 | types: `KoliBriHorizontalIcon & KoliBriVerticalIcon | string, string, string | { checked: string; indeterminate?: string; unchecked?: string; } & { checked?: string; indeterminate: string; unchecked?: string; } & { checked?: string; indeterminate?: string; unchecked: string; }, string | { right?: IconOrIconClass; left?: IconOrIconClass; }`, |
464 | 464 | comps: `badge, button, button-link, icon, input-checkbox, input-color, input-date, input-email, input-file, input-number, input-password, input-range, input-text, link, link-button, select, split-button` |
| 465 | +},{ |
| 466 | + name: `_value`, |
| 467 | + desc: `Gibt an, wie weit die Anzeige fortgeschritten ist.`, |
| 468 | + types: `Date | `${number}-${number}-${number}T${number}:${number}:${number}` | `${number}-${number}-${number}T${number}:${number}` | `${number}-${number}-${number}` | `${number}-${number}` | `${number}-W${number}` | `${number}:${number}:${number}` | `${number}:${number}` | null, W3CInputValue[] | string, `${number}-${number}-${number}T${number}:${number}:${number}` | `${number}-${number}-${number}T${number}:${number}` | `${number}-${number}-${number}` | `${number}-${number}` | `${number}-W${number}` | `${number}:${number}:${number}` | `${number}:${number}` | null | number, boolean | null | number | object | string, number, number | string, string`, |
| 469 | + comps: `button, button-link, input-checkbox, input-color, input-date, input-email, input-file, input-number, input-password, input-radio, input-range, input-text, progress, select, split-button, textarea` |
465 | 470 | },{ |
466 | 471 | name: `_id`, |
467 | | - desc: `Gibt die interne ID des primären Elements in der Komponente an.`, |
| 472 | + desc: `Defines the internal ID of the primary component element.`, |
468 | 473 | types: `string`, |
469 | 474 | comps: `button, button-link, input-checkbox, input-color, input-date, input-email, input-file, input-number, input-password, input-radio, input-range, input-text, select, textarea, tooltip` |
470 | 475 | },{ |
|
477 | 482 | desc: `Gibt an, mit welcher Tastenkombination man das interaktive Element der Komponente auslösen oder fokussieren kann.`, |
478 | 483 | types: `string`, |
479 | 484 | comps: `button, button-link, input-checkbox, input-color, input-date, input-email, input-file, input-number, input-password, input-radio, input-range, input-text, select, split-button, textarea` |
480 | | -},{ |
481 | | - name: `_value`, |
482 | | - desc: `Gibt an, wie weit die Anzeige fortgeschritten ist.`, |
483 | | - types: `Date | `${number}-${number}-${number}T${number}:${number}:${number}` | `${number}-${number}-${number}T${number}:${number}` | `${number}-${number}-${number}` | `${number}-${number}` | `${number}-W${number}` | `${number}:${number}:${number}` | `${number}:${number}` | null, W3CInputValue[] | string, `${number}-${number}-${number}T${number}:${number}:${number}` | `${number}-${number}-${number}T${number}:${number}` | `${number}-${number}-${number}` | `${number}-${number}` | `${number}-W${number}` | `${number}:${number}:${number}` | `${number}:${number}` | null | number, boolean | null | number | object | string, number, number | string, string`, |
484 | | - comps: `input-checkbox, input-color, input-date, input-email, input-file, input-number, input-password, input-radio, input-range, input-text, progress, select, textarea` |
485 | 485 | },{ |
486 | 486 | name: `_touched`, |
487 | 487 | desc: `Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde.`, |
|
525 | 525 | },{ |
526 | 526 | name: `_smart-button`, |
527 | 527 | desc: `Ermöglicht eine Schaltfläche in das Eingabefeld mit einer beliebigen Aktion zu einzufügen (ohne label).`, |
528 | | - types: `string | { _label: LabelWithExpertSlotPropType; } & { _ariaControls?: string; _ariaExpanded?: boolean; _ariaSelected?: boolean; _disabled?: boolean; _icon?: Stringified<KoliBriIconProp>; _iconAlign?: Align; _iconOnly?: boolean; _role?: AlternativButtonLinkRole; _tabIndex?: number; _tooltipAlign?: Align; _ariaCurrent?: AriaCurrent; _ariaLabel?: string; _hideLabel?: boolean; _accessKey?: string; _id?: string; _on?: KoliBriButtonCallbacks<unknown>; _type?: KoliBriButtonType; _value?: unknown; _label?: LabelWithExpertSlotPropType; _variant?: KoliBriButtonVariant; _customClass?: string; }`, |
| 528 | + types: `string | { _label: LabelWithExpertSlotPropType; } & { _ariaControls?: string; _ariaExpanded?: boolean; _ariaSelected?: boolean; _disabled?: boolean; _icon?: Stringified<KoliBriIconProp>; _iconAlign?: Align; _iconOnly?: boolean; _role?: AlternativButtonLinkRole; _tabIndex?: number; _tooltipAlign?: Align; _ariaCurrent?: AriaCurrent; _ariaLabel?: string; _hideLabel?: boolean; _accessKey?: string; _id?: string; _on?: KoliBriButtonCallbacks<StencilUnknown>; _type?: KoliBriButtonType; _value?: Stringified<StencilUnknown>; _label?: LabelWithExpertSlotPropType; _variant?: KoliBriButtonVariant; _customClass?: string; }`, |
529 | 529 | comps: `badge, input-color, input-date, input-email, input-file, input-number, input-password, input-text` |
530 | 530 | },{ |
531 | 531 | name: `_list`, |
|
0 commit comments