@craftercms/studio-ui
Version:
Services, components, models & utils to build CrafterCMS authoring extensions.
75 lines (73 loc) • 2.81 kB
JavaScript
/*
* Copyright (C) 2007-2022 Crafter Software Corporation. All Rights Reserved.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Lesser General Public License version 3 as published by
* the Free Software Foundation.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Lesser General Public License for more details.
*
* You should have received a copy of the GNU Lesser General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
/*
* Copyright (C) 2007-2022 Crafter Software Corporation. All Rights Reserved.
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU General Public License version 3 as published by
* the Free Software Foundation.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU General Public License for more details.
*
* You should have received a copy of the GNU General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
*/
import FormGroup from '@mui/material/FormGroup';
import FormControlLabel from '@mui/material/FormControlLabel';
import Checkbox from '@mui/material/Checkbox';
import React from 'react';
import { makeStyles } from 'tss-react/mui';
const useStyles = makeStyles()(() => ({
checkboxLabel: {
width: '100%',
overflow: 'hidden',
display: '-webkit-box',
WebkitLineClamp: 1,
WebkitBoxOrient: 'vertical'
},
checkboxRoot: {
marginRight: '5px'
}
}));
export function SiteSearchFilterCheckboxes(props) {
const { facetData, facet, handleCheckboxClick, checkedFilters, facetLabelLookup } = props;
const items = facetData.values;
const { classes } = useStyles();
return React.createElement(
FormGroup,
null,
Object.keys(items).map((key) => {
var _a;
return React.createElement(FormControlLabel, {
key: key,
name: key,
control: React.createElement(Checkbox, {
color: 'primary',
checked: (checkedFilters && checkedFilters[facet] && checkedFilters[facet][key]) || false,
value: key,
onChange: (e) => handleCheckboxClick(key, e.target.checked, facet)
}),
label: `${(_a = facetLabelLookup[key]) !== null && _a !== void 0 ? _a : key} (${items[key]})`,
labelPlacement: 'start',
classes: { root: classes.checkboxRoot, label: classes.checkboxLabel }
});
})
);
}
export default SiteSearchFilterCheckboxes;