import { __assign } from '../../node_modules/tslib/tslib.es6.js';
import React from 'react';
import { chakra } from '@chakra-ui/react';
import HighlightedText from '../text/HighlightedText.js';
import GridItem from '../grid/GridItem.js';
import Grid from '../grid/index.js';
import Checkbox from '../checkbox/index.js';

var addThousandSeparatorToNumber = function (value) {
    return new Intl.NumberFormat('de-CH').format(value);
};
function CheckboxWithFacet(_a) {
    var item = _a.item, onApply = _a.onApply, contentRight = _a.contentRight, _b = _a.isIndeterminate, isIndeterminate = _b === void 0 ? false : _b, _c = _a.indentFacet, indentFacet = _c === void 0 ? false : _c;
    var renderFacet = function (facet) {
        if (typeof facet !== 'number')
            return null;
        return (React.createElement(chakra.span, { ml: "sm", color: "gray.400", minW: "7ch", textAlign: "right" }, addThousandSeparatorToNumber(facet)));
    };
    return (React.createElement(Grid, { width: "full", marginBottom: "lg", templateColumns: contentRight || indentFacet ? '1fr 34px' : '1fr' },
        React.createElement(Checkbox, { variant: (item === null || item === void 0 ? void 0 : item.image) ? 'alignCenter' : 'alignTop', name: "filter_".concat(item.key, "_").concat(item.label), isChecked: item.isChecked, value: item.key, fullWidth: true, isIndeterminate: isIndeterminate, label: (item === null || item === void 0 ? void 0 : item.image) ? (React.createElement(chakra.span, { display: "flex", alignItems: "center" },
                item.image,
                React.createElement(chakra.span, { w: "full", display: "flex", justifyContent: "space-between", marginLeft: "sm" },
                    React.createElement(HighlightedText, { text: item.label, highlightIndices: item.highlightIndices, wordBreak: "break-word" }),
                    renderFacet(item.facet)))) : (React.createElement(chakra.span, { width: "full", display: "flex", justifyContent: "space-between" },
                React.createElement(HighlightedText, { text: item.label, highlightIndices: item.highlightIndices, w: "full", wordBreak: "break-word" }),
                renderFacet(item.facet))), onChange: function (event) {
                var isChecked = event.target.checked;
                onApply(__assign(__assign({}, item), { isChecked: isChecked }));
            } }),
        contentRight ? React.createElement(GridItem, null, contentRight) : null));
}

export { CheckboxWithFacet as default };
//# sourceMappingURL=CheckboxWithFacet.js.map
