@furystack/shades-common-components
Version:
Common UI components for FuryStack Shades
29 lines • 1.36 kB
JavaScript
import { createComponent, Shade } from '@furystack/shades';
import { SegmentedControl } from '../../button-group.js';
import { cssVariableTheme } from '../../../services/css-variable-theme.js';
export const BooleanFilter = Shade({
customElementName: 'data-grid-boolean-filter',
css: { fontFamily: cssVariableTheme.typography.fontFamily },
render: ({ props }) => {
const { findOptions } = props;
const currentFilter = findOptions.filter?.[props.field];
const currentValue = currentFilter?.$eq === true ? 'true' : currentFilter?.$eq === false ? 'false' : 'any';
const applyFilter = (value) => {
const filter = { ...findOptions.filter };
if (value === 'any') {
delete filter[props.field];
}
else {
filter[props.field] = { $eq: value === 'true' };
}
props.onFindOptionsChange({ ...findOptions, filter, skip: 0 });
props.onClose();
};
return (createComponent(SegmentedControl, { size: "small", value: currentValue, onValueChange: (v) => applyFilter(v), options: [
{ value: 'true', label: 'True' },
{ value: 'false', label: 'False' },
{ value: 'any', label: 'Any' },
] }));
},
});
//# sourceMappingURL=boolean-filter.js.map