@public-ui/components 1.1.17 → 1.2.0-rc.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/cheat-sheet.html +7 -7
- package/custom-elements.json +8 -10
- package/dist/cjs/{app-globals-958b1701.js → app-globals-8085d570.js} +1 -1
- package/dist/cjs/{index-75dd272b.js → index-4befe569.js} +1 -1
- package/dist/cjs/kol-abbr.cjs.entry.js +1 -1
- package/dist/cjs/kol-accordion.cjs.entry.js +1 -1
- package/dist/cjs/kol-alert.cjs.entry.js +1 -1
- package/dist/cjs/kol-badge.cjs.entry.js +1 -1
- package/dist/cjs/kol-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-group-wc.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-group.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-link.cjs.entry.js +1 -1
- package/dist/cjs/kol-button-wc_2.cjs.entry.js +1 -1
- package/dist/cjs/kol-button.cjs.entry.js +1 -1
- package/dist/cjs/kol-card.cjs.entry.js +1 -1
- package/dist/cjs/kol-color.cjs.entry.js +1 -1
- package/dist/cjs/kol-counter.cjs.entry.js +1 -1
- package/dist/cjs/kol-details.cjs.entry.js +1 -1
- package/dist/cjs/kol-form.cjs.entry.js +1 -1
- package/dist/cjs/kol-heading-wc_2.cjs.entry.js +1 -1
- package/dist/cjs/kol-heading.cjs.entry.js +1 -1
- package/dist/cjs/kol-icon-font-awesome.cjs.entry.js +1 -1
- package/dist/cjs/kol-icon-icofont.cjs.entry.js +1 -1
- package/dist/cjs/kol-icon.cjs.entry.js +1 -1
- package/dist/cjs/kol-indented-text.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-adapter-leanup.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-color.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-date.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-email.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-file.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-number.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-password.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-radio-group.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-radio.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-range.cjs.entry.js +1 -1
- package/dist/cjs/kol-input-text.cjs.entry.js +1 -1
- package/dist/cjs/kol-kolibri.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-button.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-group.cjs.entry.js +1 -1
- package/dist/cjs/kol-link-wc.cjs.entry.js +1 -1
- package/dist/cjs/kol-link.cjs.entry.js +1 -1
- package/dist/cjs/kol-logo.cjs.entry.js +1 -1
- package/dist/cjs/kol-modal.cjs.entry.js +1 -1
- package/dist/cjs/kol-nav.cjs.entry.js +1 -1
- package/dist/cjs/kol-pagination.cjs.entry.js +1 -1
- package/dist/cjs/kol-progress.cjs.entry.js +1 -1
- package/dist/cjs/kol-select.cjs.entry.js +1 -1
- package/dist/cjs/kol-skip-nav.cjs.entry.js +1 -1
- package/dist/cjs/kol-span.cjs.entry.js +1 -1
- package/dist/cjs/kol-spin.cjs.entry.js +1 -1
- package/dist/cjs/kol-symbol.cjs.entry.js +1 -1
- package/dist/cjs/kol-table.cjs.entry.js +1 -1
- package/dist/cjs/kol-tabs.cjs.entry.js +1 -1
- package/dist/cjs/kol-textarea.cjs.entry.js +1 -1
- package/dist/cjs/kol-toast.cjs.entry.js +1 -1
- package/dist/cjs/kol-tooltip.cjs.entry.js +1 -1
- package/dist/cjs/kol-version.cjs.entry.js +1 -1
- package/dist/cjs/kolibri.cjs.js +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/components/component10.js +1 -1
- package/dist/components/component12.js +1 -1
- package/dist/components/component2.js +1 -1
- package/dist/components/component8.js +1 -1
- package/dist/components/component9.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/kol-button-link.js +1 -1
- package/dist/components/kol-input-adapter-leanup.js +1 -1
- package/dist/components/kol-input-color.js +1 -1
- package/dist/components/kol-input-email.js +1 -1
- package/dist/components/kol-input-file.js +1 -1
- package/dist/components/kol-input-password.js +1 -1
- package/dist/components/kol-input-range.js +1 -1
- package/dist/components/kol-input-text.js +1 -1
- package/dist/components/kol-link-button.js +1 -1
- package/dist/components/kol-nav.js +1 -1
- package/dist/components/kol-tabs.js +1 -1
- package/dist/components/kol-textarea.js +1 -1
- package/dist/components/shadow.js +1 -1
- package/dist/components/shadow2.js +1 -1
- package/dist/esm/{app-globals-07e8427e.js → app-globals-c08c9f2f.js} +1 -1
- package/dist/esm/{index-91d029fd.js → index-a398b9f4.js} +1 -1
- package/dist/esm/kol-abbr.entry.js +1 -1
- package/dist/esm/kol-accordion.entry.js +1 -1
- package/dist/esm/kol-alert.entry.js +1 -1
- package/dist/esm/kol-badge.entry.js +1 -1
- package/dist/esm/kol-breadcrumb.entry.js +1 -1
- package/dist/esm/kol-button-group-wc.entry.js +1 -1
- package/dist/esm/kol-button-group.entry.js +1 -1
- package/dist/esm/kol-button-link.entry.js +1 -1
- package/dist/esm/kol-button-wc_2.entry.js +1 -1
- package/dist/esm/kol-button.entry.js +1 -1
- package/dist/esm/kol-card.entry.js +1 -1
- package/dist/esm/kol-color.entry.js +1 -1
- package/dist/esm/kol-counter.entry.js +1 -1
- package/dist/esm/kol-details.entry.js +1 -1
- package/dist/esm/kol-form.entry.js +1 -1
- package/dist/esm/kol-heading-wc_2.entry.js +1 -1
- package/dist/esm/kol-heading.entry.js +1 -1
- package/dist/esm/kol-icon-font-awesome.entry.js +1 -1
- package/dist/esm/kol-icon-icofont.entry.js +1 -1
- package/dist/esm/kol-icon.entry.js +1 -1
- package/dist/esm/kol-indented-text.entry.js +1 -1
- package/dist/esm/kol-input-adapter-leanup.entry.js +1 -1
- package/dist/esm/kol-input-checkbox.entry.js +1 -1
- package/dist/esm/kol-input-color.entry.js +1 -1
- package/dist/esm/kol-input-date.entry.js +1 -1
- package/dist/esm/kol-input-email.entry.js +1 -1
- package/dist/esm/kol-input-file.entry.js +1 -1
- package/dist/esm/kol-input-number.entry.js +1 -1
- package/dist/esm/kol-input-password.entry.js +1 -1
- package/dist/esm/kol-input-radio-group.entry.js +1 -1
- package/dist/esm/kol-input-radio.entry.js +1 -1
- package/dist/esm/kol-input-range.entry.js +1 -1
- package/dist/esm/kol-input-text.entry.js +1 -1
- package/dist/esm/kol-kolibri.entry.js +1 -1
- package/dist/esm/kol-link-button.entry.js +1 -1
- package/dist/esm/kol-link-group.entry.js +1 -1
- package/dist/esm/kol-link-wc.entry.js +1 -1
- package/dist/esm/kol-link.entry.js +1 -1
- package/dist/esm/kol-logo.entry.js +1 -1
- package/dist/esm/kol-modal.entry.js +1 -1
- package/dist/esm/kol-nav.entry.js +1 -1
- package/dist/esm/kol-pagination.entry.js +1 -1
- package/dist/esm/kol-progress.entry.js +1 -1
- package/dist/esm/kol-select.entry.js +1 -1
- package/dist/esm/kol-skip-nav.entry.js +1 -1
- package/dist/esm/kol-span.entry.js +1 -1
- package/dist/esm/kol-spin.entry.js +1 -1
- package/dist/esm/kol-symbol.entry.js +1 -1
- package/dist/esm/kol-table.entry.js +1 -1
- package/dist/esm/kol-tabs.entry.js +1 -1
- package/dist/esm/kol-textarea.entry.js +1 -1
- package/dist/esm/kol-toast.entry.js +1 -1
- package/dist/esm/kol-tooltip.entry.js +1 -1
- package/dist/esm/kol-version.entry.js +1 -1
- package/dist/esm/kolibri.js +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/kolibri/{app-globals-07e8427e.js → app-globals-c08c9f2f.js} +1 -1
- package/dist/kolibri/assets/icofont/demo.html +18870 -18873
- package/dist/kolibri/{index-91d029fd.js → index-a398b9f4.js} +2 -2
- package/dist/kolibri/kol-abbr.entry.js +1 -1
- package/dist/kolibri/kol-accordion.entry.js +1 -1
- package/dist/kolibri/kol-alert.entry.js +1 -1
- package/dist/kolibri/kol-badge.entry.js +1 -1
- package/dist/kolibri/kol-breadcrumb.entry.js +1 -1
- package/dist/kolibri/kol-button-group-wc.entry.js +1 -1
- package/dist/kolibri/kol-button-group.entry.js +1 -1
- package/dist/kolibri/kol-button-link.entry.js +1 -1
- package/dist/kolibri/kol-button-wc_2.entry.js +1 -1
- package/dist/kolibri/kol-button.entry.js +1 -1
- package/dist/kolibri/kol-card.entry.js +1 -1
- package/dist/kolibri/kol-color.entry.js +1 -1
- package/dist/kolibri/kol-counter.entry.js +1 -1
- package/dist/kolibri/kol-details.entry.js +1 -1
- package/dist/kolibri/kol-form.entry.js +1 -1
- package/dist/kolibri/kol-heading-wc_2.entry.js +1 -1
- package/dist/kolibri/kol-heading.entry.js +1 -1
- package/dist/kolibri/kol-icon-font-awesome.entry.js +1 -1
- package/dist/kolibri/kol-icon-icofont.entry.js +1 -1
- package/dist/kolibri/kol-icon.entry.js +1 -1
- package/dist/kolibri/kol-indented-text.entry.js +1 -1
- package/dist/kolibri/kol-input-adapter-leanup.entry.js +1 -1
- package/dist/kolibri/kol-input-checkbox.entry.js +1 -1
- package/dist/kolibri/kol-input-color.entry.js +1 -1
- package/dist/kolibri/kol-input-date.entry.js +1 -1
- package/dist/kolibri/kol-input-email.entry.js +1 -1
- package/dist/kolibri/kol-input-file.entry.js +1 -1
- package/dist/kolibri/kol-input-number.entry.js +1 -1
- package/dist/kolibri/kol-input-password.entry.js +1 -1
- package/dist/kolibri/kol-input-radio-group.entry.js +1 -1
- package/dist/kolibri/kol-input-radio.entry.js +1 -1
- package/dist/kolibri/kol-input-range.entry.js +1 -1
- package/dist/kolibri/kol-input-text.entry.js +1 -1
- package/dist/kolibri/kol-kolibri.entry.js +1 -1
- package/dist/kolibri/kol-link-button.entry.js +1 -1
- package/dist/kolibri/kol-link-group.entry.js +1 -1
- package/dist/kolibri/kol-link-wc.entry.js +1 -1
- package/dist/kolibri/kol-link.entry.js +1 -1
- package/dist/kolibri/kol-logo.entry.js +1 -1
- package/dist/kolibri/kol-modal.entry.js +1 -1
- package/dist/kolibri/kol-nav.entry.js +1 -1
- package/dist/kolibri/kol-pagination.entry.js +1 -1
- package/dist/kolibri/kol-progress.entry.js +1 -1
- package/dist/kolibri/kol-select.entry.js +1 -1
- package/dist/kolibri/kol-skip-nav.entry.js +1 -1
- package/dist/kolibri/kol-span.entry.js +1 -1
- package/dist/kolibri/kol-spin.entry.js +1 -1
- package/dist/kolibri/kol-symbol.entry.js +1 -1
- package/dist/kolibri/kol-table.entry.js +1 -1
- package/dist/kolibri/kol-tabs.entry.js +1 -1
- package/dist/kolibri/kol-textarea.entry.js +1 -1
- package/dist/kolibri/kol-toast.entry.js +1 -1
- package/dist/kolibri/kol-tooltip.entry.js +1 -1
- package/dist/kolibri/kol-version.entry.js +1 -1
- package/dist/kolibri/kolibri.esm.js +1 -1
- package/dist/types/components/button/component.d.ts +4 -2
- package/dist/types/components/button/shadow.d.ts +2 -1
- package/dist/types/components/button-link/component.d.ts +2 -1
- package/dist/types/components/link/component.d.ts +2 -1
- package/dist/types/components/link/shadow.d.ts +1 -1
- package/dist/types/components/link-button/component.d.ts +3 -2
- package/dist/types/components/tabs/component.d.ts +2 -1
- package/dist/types/components.d.ts +44 -14
- package/dist/types/types/button-link.d.ts +14 -10
- package/dist/types/utils/prop.validators.d.ts +3 -3
- package/doc/badge.md +1 -1
- package/doc/button-link.md +2 -1
- package/doc/button.md +2 -1
- package/doc/icon-font-awesome.md +1 -1
- package/doc/icon-icofont.md +1 -1
- package/doc/input-color.md +18 -18
- package/doc/input-date.md +24 -24
- package/doc/input-email.md +25 -25
- package/doc/input-file.md +19 -19
- package/doc/input-number.md +25 -25
- package/doc/input-password.md +23 -23
- package/doc/input-text.md +25 -25
- package/doc/link-button.md +2 -1
- package/doc/link.md +2 -2
- package/doc/tabs.md +7 -7
- package/jest-test-results.json +1 -1
- package/package.json +1 -1
- package/vscode-custom-data.json +199 -199
package/doc/input-number.md
CHANGED
|
@@ -63,31 +63,31 @@ Die Icons in der Komponente sind per Tab-Taste nicht erreichbar. Die Auswahlhilf
|
|
|
63
63
|
|
|
64
64
|
## Properties
|
|
65
65
|
|
|
66
|
-
| Property | Attribute | Description | Type
|
|
67
|
-
| ------------------ | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
|
|
68
|
-
| `_accessKey` | `_access-key` | Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann. | `string \| undefined`
|
|
69
|
-
| `_alert` | `_alert` | Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt. | `boolean \| undefined`
|
|
70
|
-
| `_autoComplete` | `_auto-complete` | Gibt an, ob das Eingabefeld autovervollständigt werden kann. | `"off" \| "on" \| undefined`
|
|
71
|
-
| `_disabled` | `_disabled` | Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist. | `boolean \| undefined`
|
|
72
|
-
| `_error` | `_error` | Gibt den Text für eine Fehlermeldung an. | `string \| undefined`
|
|
73
|
-
| `_hideLabel` | `_hide-label` | Gibt an, ob das Eingabefeld kein sichtbares Label haben soll. | `boolean \| undefined`
|
|
74
|
-
| `_hint` | `_hint` | Gibt den Text für eine Hinweistext an. | `string \| undefined`
|
|
75
|
-
| `_icon` | `_icon` | Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes. | `string \| undefined \| { right: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { right?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }`
|
|
76
|
-
| `_id` _(required)_ | `_id` | Gibt die technische ID des Eingabefeldes an. | `string`
|
|
77
|
-
| `_list` | `_list` | Gibt die Liste der Vorschlagszahlen an. | `string \| string[] \| undefined`
|
|
78
|
-
| `_max` | `_max` | Gibt den größtmöglichen Zahlenwert an. | ``${number}-${number}-${number}T${number}:${number}:${number}.${number}` \| `${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}.${number}` \| `${number}:${number}:${number}` \| number \| undefined`
|
|
79
|
-
| `_min` | `_min` | Gibt den kleinstmöglichen Zahlenwert an. | ``${number}-${number}-${number}T${number}:${number}:${number}.${number}` \| `${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}.${number}` \| `${number}:${number}:${number}` \| number \| undefined`
|
|
80
|
-
| `_name` | `_name` | Gibt den technischen Namen des Eingabefeldes an. | `string \| undefined`
|
|
81
|
-
| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined`
|
|
82
|
-
| `_placeholder` | `_placeholder` | Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist. | `string \| undefined`
|
|
83
|
-
| `_readOnly` | `_read-only` | Gibt an, ob das Eingabefeld nur lesend ist. | `boolean \| undefined`
|
|
84
|
-
| `_required` | `_required` | Gibt an, ob das Eingabefeld ein Pflichtfeld ist. | `boolean \| undefined`
|
|
85
|
-
| `_smartButton` | -- | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only). | `undefined \| { _label: string; } & { _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: Alignment \| undefined; _iconOnly?: boolean \| undefined; _role?: "tab" \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: TooltipAlignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks \| undefined; _type?: KoliBriButtonType \| undefined; _customClass?: string \| undefined; _variant?: KoliBriButtonVariant \| undefined; }` | `undefined` |
|
|
86
|
-
| `_step` | `_step` | Gibt die Schrittweite der Wertveränderung an | `number \| undefined`
|
|
87
|
-
| `_tabIndex` | `_tab-index` | Gibt an, welchen Tab-Index dieses Input hat. | `number \| undefined`
|
|
88
|
-
| `_touched` | `_touched` | Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde. | `boolean \| undefined`
|
|
89
|
-
| `_type` | `_type` | <span class="text-red-500">**[DEPRECATED]**</span> Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.<br/><br/>Gibt an, ob es ein DateTime-, Date-, Month-, Week-, Time-, DateTime-Local-, Number-Eingabefeld ist. | `"date" \| "datetime-local" \| "month" \| "number" \| "time" \| "week" \| undefined`
|
|
90
|
-
| `_value` | `_value` | Gibt den Wert des Eingabefeldes an. | ``${number}-${number}-${number}T${number}:${number}:${number}.${number}` \| `${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}.${number}` \| `${number}:${number}:${number}` \| number \| undefined`
|
|
66
|
+
| Property | Attribute | Description | Type | Default |
|
|
67
|
+
| ------------------ | ---------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
|
|
68
|
+
| `_accessKey` | `_access-key` | Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann. | `string \| undefined` | `undefined` |
|
|
69
|
+
| `_alert` | `_alert` | Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt. | `boolean \| undefined` | `true` |
|
|
70
|
+
| `_autoComplete` | `_auto-complete` | Gibt an, ob das Eingabefeld autovervollständigt werden kann. | `"off" \| "on" \| undefined` | `undefined` |
|
|
71
|
+
| `_disabled` | `_disabled` | Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist. | `boolean \| undefined` | `undefined` |
|
|
72
|
+
| `_error` | `_error` | Gibt den Text für eine Fehlermeldung an. | `string \| undefined` | `undefined` |
|
|
73
|
+
| `_hideLabel` | `_hide-label` | Gibt an, ob das Eingabefeld kein sichtbares Label haben soll. | `boolean \| undefined` | `undefined` |
|
|
74
|
+
| `_hint` | `_hint` | Gibt den Text für eine Hinweistext an. | `string \| undefined` | `''` |
|
|
75
|
+
| `_icon` | `_icon` | Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes. | `string \| undefined \| { right: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { right?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }` | `undefined` |
|
|
76
|
+
| `_id` _(required)_ | `_id` | Gibt die technische ID des Eingabefeldes an. | `string` | `undefined` |
|
|
77
|
+
| `_list` | `_list` | Gibt die Liste der Vorschlagszahlen an. | `string \| string[] \| undefined` | `undefined` |
|
|
78
|
+
| `_max` | `_max` | Gibt den größtmöglichen Zahlenwert an. | ``${number}-${number}-${number}T${number}:${number}:${number}.${number}` \| `${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}.${number}` \| `${number}:${number}:${number}` \| number \| undefined` | `undefined` |
|
|
79
|
+
| `_min` | `_min` | Gibt den kleinstmöglichen Zahlenwert an. | ``${number}-${number}-${number}T${number}:${number}:${number}.${number}` \| `${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}.${number}` \| `${number}:${number}:${number}` \| number \| undefined` | `undefined` |
|
|
80
|
+
| `_name` | `_name` | Gibt den technischen Namen des Eingabefeldes an. | `string \| undefined` | `undefined` |
|
|
81
|
+
| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` |
|
|
82
|
+
| `_placeholder` | `_placeholder` | Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist. | `string \| undefined` | `undefined` |
|
|
83
|
+
| `_readOnly` | `_read-only` | Gibt an, ob das Eingabefeld nur lesend ist. | `boolean \| undefined` | `undefined` |
|
|
84
|
+
| `_required` | `_required` | Gibt an, ob das Eingabefeld ein Pflichtfeld ist. | `boolean \| undefined` | `undefined` |
|
|
85
|
+
| `_smartButton` | -- | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only). | `undefined \| { _label: string; } & { _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: Alignment \| undefined; _iconOnly?: boolean \| undefined; _role?: "tab" \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: TooltipAlignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks<unknown> \| undefined; _type?: KoliBriButtonType \| undefined; _value?: unknown; _customClass?: string \| undefined; _variant?: KoliBriButtonVariant \| undefined; }` | `undefined` |
|
|
86
|
+
| `_step` | `_step` | Gibt die Schrittweite der Wertveränderung an | `number \| undefined` | `undefined` |
|
|
87
|
+
| `_tabIndex` | `_tab-index` | Gibt an, welchen Tab-Index dieses Input hat. | `number \| undefined` | `undefined` |
|
|
88
|
+
| `_touched` | `_touched` | Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde. | `boolean \| undefined` | `false` |
|
|
89
|
+
| `_type` | `_type` | <span class="text-red-500">**[DEPRECATED]**</span> Das W3C hat die Date-Typen in eine eigene Gruppe zusammengefasst. Verwende hierfür die InputDate-Komponente.<br/><br/>Gibt an, ob es ein DateTime-, Date-, Month-, Week-, Time-, DateTime-Local-, Number-Eingabefeld ist. | `"date" \| "datetime-local" \| "month" \| "number" \| "time" \| "week" \| undefined` | `'number'` |
|
|
90
|
+
| `_value` | `_value` | Gibt den Wert des Eingabefeldes an. | ``${number}-${number}-${number}T${number}:${number}:${number}.${number}` \| `${number}-${number}-${number}T${number}:${number}:${number}` \| `${number}-${number}-${number}` \| `${number}-${number}` \| `${number}-W${number}` \| `${number}:${number}:${number}.${number}` \| `${number}:${number}:${number}` \| number \| undefined` | `undefined` |
|
|
91
91
|
|
|
92
92
|
|
|
93
93
|
## Dependencies
|
package/doc/input-password.md
CHANGED
|
@@ -41,29 +41,29 @@ Der Input-Typ **Password** erzeugt ein Eingabefeld für Passwörter. Die Eingabe
|
|
|
41
41
|
|
|
42
42
|
## Properties
|
|
43
43
|
|
|
44
|
-
| Property | Attribute | Description | Type
|
|
45
|
-
| ------------------ | ---------------- | -------------------------------------------------------------------------------------------------------- |
|
|
46
|
-
| `_accessKey` | `_access-key` | Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann. | `string \| undefined`
|
|
47
|
-
| `_alert` | `_alert` | Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt. | `boolean \| undefined`
|
|
48
|
-
| `_autoComplete` | `_auto-complete` | Gibt an, ob das Eingabefeld autovervollständigt werden kann. | `"off" \| "on" \| undefined`
|
|
49
|
-
| `_disabled` | `_disabled` | Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist. | `boolean \| undefined`
|
|
50
|
-
| `_error` | `_error` | Gibt den Text für eine Fehlermeldung an. | `string \| undefined`
|
|
51
|
-
| `_hideLabel` | `_hide-label` | Gibt an, ob das Eingabefeld kein sichtbares Label haben soll. | `boolean \| undefined`
|
|
52
|
-
| `_hint` | `_hint` | Gibt den Text für eine Hinweistext an. | `string \| undefined`
|
|
53
|
-
| `_icon` | `_icon` | Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes. | `string \| undefined \| { right: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { right?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }`
|
|
54
|
-
| `_id` _(required)_ | `_id` | Gibt die technische ID des Eingabefeldes an. | `string`
|
|
55
|
-
| `_maxLength` | `_max-length` | Gibt an, wie viele Zeichen man maximal eingeben kann. | `number \| undefined`
|
|
56
|
-
| `_name` | `_name` | Gibt den technischen Namen des Eingabefeldes an. | `string \| undefined`
|
|
57
|
-
| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined`
|
|
58
|
-
| `_pattern` | `_pattern` | Gibt ein Prüfpattern für das Eingabefeld an. | `string \| undefined`
|
|
59
|
-
| `_placeholder` | `_placeholder` | Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist. | `string \| undefined`
|
|
60
|
-
| `_readOnly` | `_read-only` | Gibt an, ob die Eingabefeld nur lesend ist. | `boolean \| undefined`
|
|
61
|
-
| `_required` | `_required` | Gibt an, ob das Eingabefeld ein Pflichtfeld ist. | `boolean \| undefined`
|
|
62
|
-
| `_size` | `_size` | Gibt an, wie viele Zeichen man eingeben kann. | `number \| undefined`
|
|
63
|
-
| `_smartButton` | -- | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only). | `undefined \| { _label: string; } & { _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: Alignment \| undefined; _iconOnly?: boolean \| undefined; _role?: "tab" \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: TooltipAlignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks \| undefined; _type?: KoliBriButtonType \| undefined; _customClass?: string \| undefined; _variant?: KoliBriButtonVariant \| undefined; }` | `undefined` |
|
|
64
|
-
| `_tabIndex` | `_tab-index` | Gibt an, welchen Tab-Index dieses Input hat. | `number \| undefined`
|
|
65
|
-
| `_touched` | `_touched` | Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde. | `boolean \| undefined`
|
|
66
|
-
| `_value` | `_value` | Gibt den Wert des Eingabefeldes an. | `string \| undefined`
|
|
44
|
+
| Property | Attribute | Description | Type | Default |
|
|
45
|
+
| ------------------ | ---------------- | -------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
|
|
46
|
+
| `_accessKey` | `_access-key` | Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann. | `string \| undefined` | `undefined` |
|
|
47
|
+
| `_alert` | `_alert` | Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt. | `boolean \| undefined` | `true` |
|
|
48
|
+
| `_autoComplete` | `_auto-complete` | Gibt an, ob das Eingabefeld autovervollständigt werden kann. | `"off" \| "on" \| undefined` | `undefined` |
|
|
49
|
+
| `_disabled` | `_disabled` | Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist. | `boolean \| undefined` | `undefined` |
|
|
50
|
+
| `_error` | `_error` | Gibt den Text für eine Fehlermeldung an. | `string \| undefined` | `undefined` |
|
|
51
|
+
| `_hideLabel` | `_hide-label` | Gibt an, ob das Eingabefeld kein sichtbares Label haben soll. | `boolean \| undefined` | `undefined` |
|
|
52
|
+
| `_hint` | `_hint` | Gibt den Text für eine Hinweistext an. | `string \| undefined` | `''` |
|
|
53
|
+
| `_icon` | `_icon` | Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes. | `string \| undefined \| { right: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { right?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }` | `undefined` |
|
|
54
|
+
| `_id` _(required)_ | `_id` | Gibt die technische ID des Eingabefeldes an. | `string` | `undefined` |
|
|
55
|
+
| `_maxLength` | `_max-length` | Gibt an, wie viele Zeichen man maximal eingeben kann. | `number \| undefined` | `undefined` |
|
|
56
|
+
| `_name` | `_name` | Gibt den technischen Namen des Eingabefeldes an. | `string \| undefined` | `undefined` |
|
|
57
|
+
| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` |
|
|
58
|
+
| `_pattern` | `_pattern` | Gibt ein Prüfpattern für das Eingabefeld an. | `string \| undefined` | `undefined` |
|
|
59
|
+
| `_placeholder` | `_placeholder` | Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist. | `string \| undefined` | `undefined` |
|
|
60
|
+
| `_readOnly` | `_read-only` | Gibt an, ob die Eingabefeld nur lesend ist. | `boolean \| undefined` | `undefined` |
|
|
61
|
+
| `_required` | `_required` | Gibt an, ob das Eingabefeld ein Pflichtfeld ist. | `boolean \| undefined` | `undefined` |
|
|
62
|
+
| `_size` | `_size` | Gibt an, wie viele Zeichen man eingeben kann. | `number \| undefined` | `undefined` |
|
|
63
|
+
| `_smartButton` | -- | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only). | `undefined \| { _label: string; } & { _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: Alignment \| undefined; _iconOnly?: boolean \| undefined; _role?: "tab" \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: TooltipAlignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks<unknown> \| undefined; _type?: KoliBriButtonType \| undefined; _value?: unknown; _customClass?: string \| undefined; _variant?: KoliBriButtonVariant \| undefined; }` | `undefined` |
|
|
64
|
+
| `_tabIndex` | `_tab-index` | Gibt an, welchen Tab-Index dieses Input hat. | `number \| undefined` | `undefined` |
|
|
65
|
+
| `_touched` | `_touched` | Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde. | `boolean \| undefined` | `false` |
|
|
66
|
+
| `_value` | `_value` | Gibt den Wert des Eingabefeldes an. | `string \| undefined` | `undefined` |
|
|
67
67
|
|
|
68
68
|
|
|
69
69
|
## Dependencies
|
package/doc/input-text.md
CHANGED
|
@@ -47,31 +47,31 @@ Texteingabe
|
|
|
47
47
|
|
|
48
48
|
## Properties
|
|
49
49
|
|
|
50
|
-
| Property | Attribute | Description | Type
|
|
51
|
-
| ------------------ | ---------------- | -------------------------------------------------------------------------------------------------------- |
|
|
52
|
-
| `_accessKey` | `_access-key` | Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann. | `string \| undefined`
|
|
53
|
-
| `_alert` | `_alert` | Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt. | `boolean \| undefined`
|
|
54
|
-
| `_autoComplete` | `_auto-complete` | Gibt an, ob das Eingabefeld autovervollständigt werden kann. | `"off" \| "on" \| undefined`
|
|
55
|
-
| `_disabled` | `_disabled` | Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist. | `boolean \| undefined`
|
|
56
|
-
| `_error` | `_error` | Gibt den Text für eine Fehlermeldung an. | `string \| undefined`
|
|
57
|
-
| `_hideLabel` | `_hide-label` | Gibt an, ob das Eingabefeld kein sichtbares Label haben soll. | `boolean \| undefined`
|
|
58
|
-
| `_hint` | `_hint` | Gibt den Text für eine Hinweistext an. | `string \| undefined`
|
|
59
|
-
| `_icon` | `_icon` | Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes. | `string \| undefined \| { right: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { right?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }`
|
|
60
|
-
| `_id` _(required)_ | `_id` | Gibt die technische ID des Eingabefeldes an. | `string`
|
|
61
|
-
| `_list` | `_list` | Gibt die Liste der Vorschlagswörter an. | `string \| string[] \| undefined`
|
|
62
|
-
| `_maxLength` | `_max-length` | Gibt an, wie viele Zeichen man maximal eingeben kann. | `number \| undefined`
|
|
63
|
-
| `_name` | `_name` | Gibt den technischen Namen des Eingabefeldes an. | `string \| undefined`
|
|
64
|
-
| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined`
|
|
65
|
-
| `_pattern` | `_pattern` | Gibt ein Prüfpattern für das Eingabefeld an. | `string \| undefined`
|
|
66
|
-
| `_placeholder` | `_placeholder` | Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist. | `string \| undefined`
|
|
67
|
-
| `_readOnly` | `_read-only` | Gibt an, ob die Eingabefeld nur lesend ist. | `boolean \| undefined`
|
|
68
|
-
| `_required` | `_required` | Gibt an, ob das Eingabefeld ein Pflichtfeld ist. | `boolean \| undefined`
|
|
69
|
-
| `_size` | `_size` | Gibt an, wie viele Zeichen man eingeben kann. | `number \| undefined`
|
|
70
|
-
| `_smartButton` | -- | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only). | `undefined \| { _label: string; } & { _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: Alignment \| undefined; _iconOnly?: boolean \| undefined; _role?: "tab" \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: TooltipAlignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks \| undefined; _type?: KoliBriButtonType \| undefined; _customClass?: string \| undefined; _variant?: KoliBriButtonVariant \| undefined; }` | `undefined` |
|
|
71
|
-
| `_tabIndex` | `_tab-index` | Gibt an, welchen Tab-Index dieses Input hat. | `number \| undefined`
|
|
72
|
-
| `_touched` | `_touched` | Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde. | `boolean \| undefined`
|
|
73
|
-
| `_type` | `_type` | Gibt an, ob es ein Text-, Suche-, URL- oder Telefon-Eingabefeld ist. | `"search" \| "tel" \| "text" \| "url" \| undefined`
|
|
74
|
-
| `_value` | `_value` | Gibt den Wert des Eingabefeldes an. | `string \| undefined`
|
|
50
|
+
| Property | Attribute | Description | Type | Default |
|
|
51
|
+
| ------------------ | ---------------- | -------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
|
|
52
|
+
| `_accessKey` | `_access-key` | Gibt an, mit welcher Tastenkombination man das Input auslösen oder fokussieren kann. | `string \| undefined` | `undefined` |
|
|
53
|
+
| `_alert` | `_alert` | Gibt an, ob die Fehlermeldung vorgelesen werden soll, wenn es eine gibt. | `boolean \| undefined` | `true` |
|
|
54
|
+
| `_autoComplete` | `_auto-complete` | Gibt an, ob das Eingabefeld autovervollständigt werden kann. | `"off" \| "on" \| undefined` | `undefined` |
|
|
55
|
+
| `_disabled` | `_disabled` | Gibt an, ob das Eingabefeld aktiviert oder deaktiviert ist. | `boolean \| undefined` | `undefined` |
|
|
56
|
+
| `_error` | `_error` | Gibt den Text für eine Fehlermeldung an. | `string \| undefined` | `undefined` |
|
|
57
|
+
| `_hideLabel` | `_hide-label` | Gibt an, ob das Eingabefeld kein sichtbares Label haben soll. | `boolean \| undefined` | `undefined` |
|
|
58
|
+
| `_hint` | `_hint` | Gibt den Text für eine Hinweistext an. | `string \| undefined` | `''` |
|
|
59
|
+
| `_icon` | `_icon` | Ermöglicht das Anzeigen von Icons links und/oder rechts am Rand des Eingabefeldes. | `string \| undefined \| { right: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { right?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }` | `undefined` |
|
|
60
|
+
| `_id` _(required)_ | `_id` | Gibt die technische ID des Eingabefeldes an. | `string` | `undefined` |
|
|
61
|
+
| `_list` | `_list` | Gibt die Liste der Vorschlagswörter an. | `string \| string[] \| undefined` | `undefined` |
|
|
62
|
+
| `_maxLength` | `_max-length` | Gibt an, wie viele Zeichen man maximal eingeben kann. | `number \| undefined` | `undefined` |
|
|
63
|
+
| `_name` | `_name` | Gibt den technischen Namen des Eingabefeldes an. | `string \| undefined` | `undefined` |
|
|
64
|
+
| `_on` | -- | Gibt die EventCallback-Funktionen für das Input-Event an. | `InputTypeOnBlur & InputTypeOnClick & InputTypeOnChange & InputTypeOnFocus \| undefined` | `undefined` |
|
|
65
|
+
| `_pattern` | `_pattern` | Gibt ein Prüfpattern für das Eingabefeld an. | `string \| undefined` | `undefined` |
|
|
66
|
+
| `_placeholder` | `_placeholder` | Gibt den Platzhalter des Eingabefeldes an, wenn es leer ist. | `string \| undefined` | `undefined` |
|
|
67
|
+
| `_readOnly` | `_read-only` | Gibt an, ob die Eingabefeld nur lesend ist. | `boolean \| undefined` | `undefined` |
|
|
68
|
+
| `_required` | `_required` | Gibt an, ob das Eingabefeld ein Pflichtfeld ist. | `boolean \| undefined` | `undefined` |
|
|
69
|
+
| `_size` | `_size` | Gibt an, wie viele Zeichen man eingeben kann. | `number \| undefined` | `undefined` |
|
|
70
|
+
| `_smartButton` | -- | Ermöglicht einen Schalter ins das Eingabefeld mit einer beliebigen Aktion zu einzufügen (nur Icon-Only). | `undefined \| { _label: string; } & { _ariaControls?: string \| undefined; _ariaCurrent?: AriaCurrent \| undefined; _ariaExpanded?: boolean \| undefined; _ariaLabel?: string \| undefined; _ariaSelected?: boolean \| undefined; _disabled?: boolean \| undefined; _icon?: Stringified<KoliBriIconProp> \| undefined; _iconAlign?: Alignment \| undefined; _iconOnly?: boolean \| undefined; _role?: "tab" \| undefined; _tabIndex?: number \| undefined; _tooltipAlign?: TooltipAlignment \| undefined; _accessKey?: string \| undefined; _id?: string \| undefined; _on?: KoliBriButtonCallbacks<unknown> \| undefined; _type?: KoliBriButtonType \| undefined; _value?: unknown; _customClass?: string \| undefined; _variant?: KoliBriButtonVariant \| undefined; }` | `undefined` |
|
|
71
|
+
| `_tabIndex` | `_tab-index` | Gibt an, welchen Tab-Index dieses Input hat. | `number \| undefined` | `undefined` |
|
|
72
|
+
| `_touched` | `_touched` | Gibt an, ob dieses Eingabefeld von Nutzer:innen einmal besucht/berührt wurde. | `boolean \| undefined` | `false` |
|
|
73
|
+
| `_type` | `_type` | Gibt an, ob es ein Text-, Suche-, URL- oder Telefon-Eingabefeld ist. | `"search" \| "tel" \| "text" \| "url" \| undefined` | `'text'` |
|
|
74
|
+
| `_value` | `_value` | Gibt den Wert des Eingabefeldes an. | `string \| undefined` | `undefined` |
|
|
75
75
|
|
|
76
76
|
|
|
77
77
|
## Dependencies
|
package/doc/link-button.md
CHANGED
|
@@ -44,10 +44,11 @@ Ein Button hat aus UX-Sicht mehrere Varianten (`primary` oder `secondary` usw.).
|
|
|
44
44
|
| `_ariaSelected` | `_aria-selected` | Gibt an, ob Element ausgewählt ist (role=tab). (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` |
|
|
45
45
|
| `_customClass` | `_custom-class` | Gibt an, welche Custom-Class übergeben werden soll, wenn _variant="custom" gesetzt ist. | `string \| undefined` | `undefined` |
|
|
46
46
|
| `_disabled` | `_disabled` | Gibt an, ob der Link deaktiviert ist. | `boolean \| undefined` | `false` |
|
|
47
|
-
| `_href`
|
|
47
|
+
| `_href` _(required)_ | `_href` | Gibt die Ziel-Url des Links an. | `string` | `undefined` |
|
|
48
48
|
| `_icon` | `_icon` | Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/) | `string \| undefined \| { top: string \| KoliBriCustomIcon; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right: string \| KoliBriCustomIcon; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }` | `undefined` |
|
|
49
49
|
| `_iconOnly` | `_icon-only` | Gibt an, ob nur das Icon angezeigt wird. | `boolean \| undefined` | `false` |
|
|
50
50
|
| `_label` _(required)_ | `_label` | Gibt einen beschreibenden Text für das Text-Element an. | `string` | `undefined` |
|
|
51
|
+
| `_on` | -- | Gibt die EventCallback-Funktionen für den Link an. | `undefined \| { onClick?: EventValueCallback<Event, string> \| undefined; }` | `undefined` |
|
|
51
52
|
| `_role` | `_role` | Gibt an, welche Role der Schalter hat. | `"tab" \| undefined` | `undefined` |
|
|
52
53
|
| `_tabIndex` | `_tab-index` | Gibt an, welchen Tab-Index der Button hat. (https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/tabindex) | `number \| undefined` | `undefined` |
|
|
53
54
|
| `_target` | `_target` | Definiert das Verhalten, bei dem der Link geöffnet werden soll. | `string \| undefined` | `undefined` |
|
package/doc/link.md
CHANGED
|
@@ -102,12 +102,12 @@ Eingabe von Leerzeichen eingefügt werden. Zusätzliche Leerzeichen vergrößern
|
|
|
102
102
|
| `_ariaSelected` | `_aria-selected` | Gibt an, ob der Link gerade ausgewählt ist. (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-selected) | `boolean \| undefined` | `undefined` |
|
|
103
103
|
| `_disabled` | `_disabled` | Gibt an, ob der Link deaktiviert ist. | `boolean \| undefined` | `false` |
|
|
104
104
|
| `_fill` | `_fill` | <span class="text-red-500">**[DEPRECATED]**</span> Das Styling sollte stets über CSS erfolgen.<br/><br/>Gibt an, ob der Link die gesamte zur Verfügung stehende Breite ausfüllt. | `boolean \| undefined` | `false` |
|
|
105
|
-
| `_href`
|
|
105
|
+
| `_href` _(required)_ | `_href` | Gibt die Ziel-Url des Links an. | `string` | `undefined` |
|
|
106
106
|
| `_icon` | `_icon` | Gibt den Class-Identifier eines Icons eine eingebunden Icofont an. (z.B. https://icofont.com/) | `string \| undefined \| { top: string \| KoliBriCustomIcon; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right: string \| KoliBriCustomIcon; bottom?: string \| KoliBriCustomIcon \| undefined; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom: string \| KoliBriCustomIcon; left?: string \| KoliBriCustomIcon \| undefined; } \| { top?: string \| KoliBriCustomIcon \| undefined; right?: string \| KoliBriCustomIcon \| undefined; bottom?: string \| KoliBriCustomIcon \| undefined; left: string \| KoliBriCustomIcon; }` | `undefined` |
|
|
107
107
|
| `_iconAlign` | `_icon-align` | <span style="color:red">**[DEPRECATED]**</span> Wird durch das neue flexibleren Icon-Typ abgedeckt.<br/><br/>Gibt an, ob das Icon entweder links oder rechts dargestellt werden soll. | `"left" \| "right" \| undefined` | `'left'` |
|
|
108
108
|
| `_iconOnly` | `_icon-only` | Gibt an, ob nur das Icon angezeigt wird. | `boolean \| undefined` | `false` |
|
|
109
109
|
| `_label` _(required)_ | `_label` | Gibt den Label für die Beschriftung der Schaltfläche an. | `string` | `undefined` |
|
|
110
|
-
| `_on` | -- |
|
|
110
|
+
| `_on` | -- | Gibt die EventCallback-Funktionen für den Link an. | `undefined \| { onClick?: EventValueCallback<Event, string> \| undefined; }` | `undefined` |
|
|
111
111
|
| `_part` | `_part` | <span style="color:red">**[DEPRECATED]**</span> Das Styling sollte stets über CSS erfolgen.<br/><br/>Gibt den Identifier für den CSS-Part an, um das Icon von Außen ändern zu können. (https://meowni.ca/posts/part-theme-explainer/) /** | `string \| undefined` | `undefined` |
|
|
112
112
|
| `_role` | `_role` | Gibt an, welche Role der Schalter hat. | `"tab" \| undefined` | `undefined` |
|
|
113
113
|
| `_selector` | `_selector` | <span style="color:red">**[DEPRECATED]**</span> Das Styling sollte stets über CSS erfolgen.<br/><br/>Gibt die ID eines DOM-Elements, zu dem gesprungen werden soll, aus. | `string \| undefined` | `undefined` |
|
package/doc/tabs.md
CHANGED
|
@@ -116,13 +116,13 @@ W3C-Samples:
|
|
|
116
116
|
|
|
117
117
|
## Properties
|
|
118
118
|
|
|
119
|
-
| Property | Attribute | Description | Type
|
|
120
|
-
| ------------------------- | ------------- | ------------------------------------------------------------------------------------- |
|
|
121
|
-
| `_ariaLabel` _(required)_ | `_aria-label` | Gibt den Text an, der die Navigation von anderen Navigationen differenziert. | `string`
|
|
122
|
-
| `_on` | -- | Gibt die Liste der Callback-Funktionen an, die auf Events aufgerufen werden sollen. | `undefined \| { onCreate?: EventCallback<Event> \| { label: string; callback: EventCallback<Event>; } \| undefined; } & { onSelect?: EventValueCallback<KeyboardEvent \| PointerEvent \| CustomEvent<any>, number> \| undefined; }` | `undefined` |
|
|
123
|
-
| `_selected` | `_selected` | Gibt an, welches Tab selektiert sein soll. | `number \| undefined`
|
|
124
|
-
| `_tabs` _(required)_ | `_tabs` | Gibt die geordnete Liste der Seitenhierarchie in Links an. | `TabButtonProps[] \| string`
|
|
125
|
-
| `_tabsAlign` | `_tabs-align` | Gibt an, ob die Tab-Schalter entweder oben, rechts, unten oder links angeordnet sind. | `"bottom" \| "left" \| "right" \| "top" \| undefined`
|
|
119
|
+
| Property | Attribute | Description | Type | Default |
|
|
120
|
+
| ------------------------- | ------------- | ------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ----------- |
|
|
121
|
+
| `_ariaLabel` _(required)_ | `_aria-label` | Gibt den Text an, der die Navigation von anderen Navigationen differenziert. | `string` | `undefined` |
|
|
122
|
+
| `_on` | -- | Gibt die Liste der Callback-Funktionen an, die auf Events aufgerufen werden sollen. | `undefined \| { onCreate?: EventCallback<Event> \| { label: string; callback: EventCallback<Event>; } \| undefined; } & { onSelect?: EventValueCallback<MouseEvent \| KeyboardEvent \| PointerEvent \| CustomEvent<any>, number> \| undefined; }` | `undefined` |
|
|
123
|
+
| `_selected` | `_selected` | Gibt an, welches Tab selektiert sein soll. | `number \| undefined` | `0` |
|
|
124
|
+
| `_tabs` _(required)_ | `_tabs` | Gibt die geordnete Liste der Seitenhierarchie in Links an. | `TabButtonProps[] \| string` | `undefined` |
|
|
125
|
+
| `_tabsAlign` | `_tabs-align` | Gibt an, ob die Tab-Schalter entweder oben, rechts, unten oder links angeordnet sind. | `"bottom" \| "left" \| "right" \| "top" \| undefined` | `'top'` |
|
|
126
126
|
|
|
127
127
|
|
|
128
128
|
## Dependencies
|