@wulperstudio/cms
Version:
Wulper Studio Library Components CMS
170 lines • 6.48 kB
JavaScript
var _TextFieldV5LabelOut, _Icon, _Icon2, _Icon3, _Icon4, _Icon5, _TextFieldV5LabelOut2, _InputTrueFalse;
/* eslint-disable no-nested-ternary */
import React from 'react';
import { Icon } from '@iconify/react';
import { Checkbox, FormControlLabel, FormGroup, Stack, useTheme } from '@mui/material';
import { ChipOutput, HeaderDrawer, TextFieldV5LabelOut, InputTrueFalse, TextForLinesOutput } from '../../../../index';
import { ContainerDrawer } from './styled';
import { WrapperDrawerFilter } from '../WrapperDrawerFilter';
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
export var DrawerFilters = function DrawerFilters(_ref) {
var _onClose = _ref.onClose,
openDrawer = _ref.openDrawer,
isResponsive = _ref.isResponsive;
var theme = useTheme();
return /*#__PURE__*/_jsx(WrapperDrawerFilter, {
openDrawer: openDrawer,
isResponsive: isResponsive,
children: /*#__PURE__*/_jsxs(ContainerDrawer, {
children: [/*#__PURE__*/_jsx(HeaderDrawer, {
titleHeader: "Filters",
hideEditIcon: true,
hideBackIcon: true,
hideCloseIcon: !isResponsive,
onClose: function onClose() {
return _onClose && _onClose();
},
backgroundColor: "transparent"
}), /*#__PURE__*/_jsxs(Stack, {
rowGap: "10px",
sx: {
height: '100%',
overflow: 'auto',
padding: '0px 10px'
},
children: [_TextFieldV5LabelOut || (_TextFieldV5LabelOut = /*#__PURE__*/_jsx(TextFieldV5LabelOut, {
size: "small",
variant: "filled",
backgroundColor: "#EFF3FE"
})), /*#__PURE__*/_jsxs("div", {
children: [/*#__PURE__*/_jsx(TextForLinesOutput, {
clines: 1,
text: "Status",
color: theme.palette.text.primary,
fontWeight: "700",
fontSize: "14px"
}), /*#__PURE__*/_jsxs(FormGroup, {
sx: {
padding: '0px 10px'
},
children: [/*#__PURE__*/_jsx(FormControlLabel, {
control: /*#__PURE__*/_jsx(Checkbox, {
icon: _Icon || (_Icon = /*#__PURE__*/_jsx(Icon, {
icon: "carbon:radio-button",
width: "25px",
height: "25px"
})),
checkedIcon: /*#__PURE__*/_jsx(Icon, {
icon: "akar-icons:circle-check-fill",
color: theme.palette.primary.main,
width: "25px",
height: "25px"
})
}),
label: "All"
}), /*#__PURE__*/_jsx(FormControlLabel, {
control: /*#__PURE__*/_jsx(Checkbox, {
icon: _Icon2 || (_Icon2 = /*#__PURE__*/_jsx(Icon, {
icon: "carbon:radio-button",
width: "25px",
height: "25px"
})),
checkedIcon: /*#__PURE__*/_jsx(Icon, {
icon: "akar-icons:circle-check-fill",
color: theme.palette.primary.main,
width: "25px",
height: "25px"
})
}),
label: "Published"
}), /*#__PURE__*/_jsx(FormControlLabel, {
control: /*#__PURE__*/_jsx(Checkbox, {
icon: _Icon3 || (_Icon3 = /*#__PURE__*/_jsx(Icon, {
icon: "carbon:radio-button",
width: "25px",
height: "25px"
})),
checkedIcon: /*#__PURE__*/_jsx(Icon, {
icon: "akar-icons:circle-check-fill",
color: theme.palette.primary.main,
width: "25px",
height: "25px"
})
}),
label: "Drafts"
}), /*#__PURE__*/_jsx(FormControlLabel, {
control: /*#__PURE__*/_jsx(Checkbox, {
icon: _Icon4 || (_Icon4 = /*#__PURE__*/_jsx(Icon, {
icon: "carbon:radio-button",
width: "25px",
height: "25px"
})),
checkedIcon: /*#__PURE__*/_jsx(Icon, {
icon: "akar-icons:circle-check-fill",
color: theme.palette.primary.main,
width: "25px",
height: "25px"
})
}),
label: "in revision"
}), /*#__PURE__*/_jsx(FormControlLabel, {
control: /*#__PURE__*/_jsx(Checkbox, {
icon: _Icon5 || (_Icon5 = /*#__PURE__*/_jsx(Icon, {
icon: "carbon:radio-button",
width: "25px",
height: "25px"
})),
checkedIcon: /*#__PURE__*/_jsx(Icon, {
icon: "akar-icons:circle-check-fill",
color: theme.palette.primary.main,
width: "25px",
height: "25px"
})
}),
label: "Media aproval"
})]
})]
}), /*#__PURE__*/_jsxs("div", {
children: [/*#__PURE__*/_jsx(TextForLinesOutput, {
clines: 1,
text: "Date",
color: theme.palette.text.primary,
fontWeight: "700",
fontSize: "14px",
sx: {
mb: 2
}
}), _TextFieldV5LabelOut2 || (_TextFieldV5LabelOut2 = /*#__PURE__*/_jsx(TextFieldV5LabelOut, {
size: "small",
variant: "outlined"
}))]
}), /*#__PURE__*/_jsxs("div", {
children: [/*#__PURE__*/_jsx(TextForLinesOutput, {
clines: 1,
text: "Tags",
color: theme.palette.text.primary,
fontWeight: "700",
fontSize: "14px"
}), /*#__PURE__*/_jsx(ChipOutput, {
backgroundColor: "transparent",
listChip: [{
label: 'In progress'
}, {
label: 'lorem'
}]
})]
}), /*#__PURE__*/_jsxs("div", {
children: [/*#__PURE__*/_jsx(TextForLinesOutput, {
clines: 1,
text: "Other filters",
color: theme.palette.text.primary,
fontWeight: "700",
fontSize: "14px"
}), _InputTrueFalse || (_InputTrueFalse = /*#__PURE__*/_jsx(InputTrueFalse, {
label: "Hide irrelevant posts"
}))]
})]
})]
})
});
};