RolePicker

Eine Rolle wählen: erst eingebaute, dann eigene, jede mit einem Satz; nicht vergebbare Rollen sagen, warum.

Integrierte Rollen

OwnerEverything, including deleting the organizationOnly an owner can make someone an ownerAdmin29 rightsEverything except ownership and deletionBilling8 rightsUsage, costs and the planDeveloper7 rightsCreate projects, see provider keys and usageMember2 rightsSee the organization and its members

Eigene Rollen

Support lead9 rightsRead logs and usage across projects to help customersFinance6 rightsCosts, budgets and invoices

function List() {
  const [role, setRole] = useState("developer");
  return <RolePicker className="w-480" aria-label="Role in the organization" roles={ORG_ROLES} value={role} onValueChange={setRole} />;
}

import { RolePicker } from "@logicplanes/kaeso-ui";

Props

appearance
"list" | "select" = list
Eine Liste mit der Beschreibung jeder Rolle oder eine kompakte Auswahl.
aria-label
string
Der zugängliche Name, wenn es keine sichtbare Beschriftung gibt.
disabled
boolean
Schaltet es aus: Es lässt sich nicht verwenden und wirkt abgeblendet.
fullWidth
boolean
Nur Select: füllt den Container.
label
string
Die sichtbare Beschriftung der Auswahl; eine Liste wird über aria-label oder den Schritt um sie herum benannt.
name
string
Der Feldname, unter dem der Wert mit einem Formular gesendet wird.
onValueChange
((value: string) => void)
Wird mit der ID der gewählten Rolle aufgerufen.
roles
RoleOption[]
Die Rollen zur Auswahl.
size
"md" | "sm" = md
Die Höhe des Steuerelements.
value
string | null
Die ID der gewählten Rolle, bei gesteuertem Wert.