@activecollab/components
Version:
ActiveCollab Components
47 lines • 1.63 kB
JavaScript
import React, { useCallback, useEffect, useRef, useState } from "react";
import { StyledChildrenWrapper, StyledCollapseExpandSingleIcon, StyledDividerLine, StyledTitle, StyledWrapper } from "./Styles";
import { Button } from "../Button";
export const EntitiesHeader = _ref => {
let {
onClick,
title,
children,
expanded = true,
readOnly = false,
className
} = _ref;
const ref = useRef(null);
const [open, setOpen] = useState(expanded || readOnly);
useEffect(() => {
setOpen(expanded || readOnly);
}, [expanded, readOnly]);
const handleOnClick = useCallback(() => {
var _ref$current;
(_ref$current = ref.current) == null || _ref$current.focus();
setOpen(prev => !prev);
if (onClick) onClick();
}, [onClick]);
return /*#__PURE__*/React.createElement(StyledWrapper, {
className: className,
tabIndex: 0,
ref: ref,
$expanded: open
}, !readOnly ? /*#__PURE__*/React.createElement(Button, {
variant: "text gray",
size: "small",
onClick: handleOnClick
}, /*#__PURE__*/React.createElement(StyledCollapseExpandSingleIcon, {
$expanded: open
}), /*#__PURE__*/React.createElement(StyledTitle, {
$readOnly: readOnly,
color: "secondary",
weight: "medium"
}, title)) : /*#__PURE__*/React.createElement(StyledTitle, {
$readOnly: readOnly,
color: "secondary",
weight: "medium"
}, title), !open && /*#__PURE__*/React.createElement(StyledDividerLine, {
"data-testid": "divider-line"
}), open && /*#__PURE__*/React.createElement(StyledChildrenWrapper, null, children));
};
//# sourceMappingURL=EntitiesHeader.js.map