"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.useFilterCollapsedState = void 0;
const react_1 = __importDefault(require("react"));
const useFilterCollapsedState = (filter) => {
    // @todo use settingsCollapsedDesktop and settingsCollapsedMobile with device detection
    const [collapsed, setCollapsed] = react_1.default.useState(filter.settingsCollapsedDesktop);
    // when the filter is shown, it needs to stay rendered or when it's collapsed, the filter context
    // will be lost which isn't expected behaviour
    const [shouldRender, setShouldRender] = react_1.default.useState(!collapsed);
    // enable render when filter is uncollapsed
    react_1.default.useEffect(() => {
        if (!collapsed)
            setShouldRender(true);
    }, [collapsed]);
    return {
        collapsed,
        shouldRender,
        collapsedShow: react_1.default.useCallback(() => setCollapsed(true), []),
        collapsedHide: react_1.default.useCallback(() => setCollapsed(false), []),
        collapsedToggle: react_1.default.useCallback(() => setCollapsed((collapsed) => !collapsed), []),
    };
};
exports.useFilterCollapsedState = useFilterCollapsedState;
//# sourceMappingURL=useFilterCollapsedState.js.map