@keycloakify/keycloak-admin-ui
Version:
Repackaged Keycloak Admin UI
20 lines • 1.75 kB
JavaScript
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import { Card, CardBody, CardFooter, CardHeader, CardTitle, Dropdown, DropdownList, Flex, FlexItem, Label, MenuToggle, } from "@patternfly/react-core";
import { useState } from "react";
import { Link } from "react-router-dom";
import "./keycloak-card.css";
import { EllipsisVIcon } from "@patternfly/react-icons";
export const KeycloakCard = ({ title, dropdownItems, labelText, labelColor, footerText, to, }) => {
const [isDropdownOpen, setIsDropdownOpen] = useState(false);
const onDropdownToggle = () => {
setIsDropdownOpen(!isDropdownOpen);
};
return (_jsxs(Card, { isSelectable: true, isClickable: true, children: [_jsx(CardHeader, { actions: {
actions: dropdownItems ? (_jsx(Dropdown, { popperProps: {
position: "right",
}, onOpenChange: onDropdownToggle, toggle: (ref) => (_jsx(MenuToggle, { ref: ref, onClick: onDropdownToggle, variant: "plain", "data-testid": `${title}-dropdown`, children: _jsx(EllipsisVIcon, {}) })), isOpen: isDropdownOpen, children: _jsx(DropdownList, { children: dropdownItems }) })) : undefined,
hasNoOffset: false,
className: undefined,
}, children: _jsx(CardTitle, { "data-testid": "keycloak-card-title", children: _jsx(Link, { to: to, children: title }) }) }), _jsx(CardBody, {}), _jsx(CardFooter, { children: _jsxs(Flex, { children: [_jsx(FlexItem, { className: "keycloak--keycloak-card__footer", children: footerText && footerText }), _jsx(FlexItem, { children: labelText && (_jsx(Label, { color: labelColor || "gray", children: labelText })) })] }) })] }));
};
//# sourceMappingURL=KeycloakCard.js.map