@brizy/media-gallery
Version:
62 lines (61 loc) • 2.69 kB
JavaScript
import React, { useCallback, useRef } from "react";
import { Button } from "@brizy/ui/lib/Button";
import { SelectOption } from "@brizy/ui/lib/Select/SelectOption";
import { Select } from "@brizy/ui/lib/Select";
import { Divider } from "@brizy/ui/lib/Divider";
import { FileTypes } from "../../../pages/mediaLibrary/types/types";
import { useTranslation } from "../../../locale/useTranslation";
import { translateTypes } from "../common/utils";
import { Inline } from "@brizy/ui/lib/Inline";
import { Card } from "@brizy/ui/lib/Card";
export var ContentHeader = function(param) {
var selectValue = param.selectValue, isAllSelected = param.isAllSelected, isDisabledBulkSelected = param.isDisabledBulkSelected, onSelectValue = param.onSelectValue, onBulkSelectClick = param.onBulkSelectClick, onSelectAllClick = param.onSelectAllClick;
var t = useTranslation().t;
var contentRef = useRef(null);
var getContainer = useCallback(function() {
var _contentRef_current;
return (_contentRef_current = contentRef.current) !== null && _contentRef_current !== void 0 ? _contentRef_current : window.parent.document.body;
}, []);
var color = isDisabledBulkSelected ? "gray-mid" : "gray";
return /*#__PURE__*/ React.createElement(Inline, {
alignY: "center",
align: "between"
}, /*#__PURE__*/ React.createElement(Card, {
size: 0,
width: "163px",
borderStyle: "none"
}, /*#__PURE__*/ React.createElement(Select, {
value: selectValue,
onChange: onSelectValue,
checkMark: true,
getContainer: getContainer
}, Object.values(FileTypes).map(function(option) {
return /*#__PURE__*/ React.createElement(SelectOption, {
key: option,
value: option
}, translateTypes(option, t));
})), /*#__PURE__*/ React.createElement("div", {
className: "brz-media-gallery__select--content",
ref: contentRef
})), /*#__PURE__*/ React.createElement(Inline, {
alignY: "center",
align: "right"
}, /*#__PURE__*/ React.createElement(Button, {
type: "link",
size: "large",
color: color,
hoverColor: "dark",
onClick: onBulkSelectClick,
disabled: isDisabledBulkSelected
}, t("Bulk Select")), /*#__PURE__*/ React.createElement(Divider, {
color: "gray",
type: "vertical"
}), /*#__PURE__*/ React.createElement(Button, {
type: "link",
size: "large",
color: color,
hoverColor: "dark",
onClick: onSelectAllClick,
disabled: isDisabledBulkSelected
}, isAllSelected ? t("Deselect All") : t("Select All"))));
};