"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const Context_1 = require("../../Context");
const react_loadable_1 = tslib_1.__importDefault(require("react-loadable"));
const react_1 = tslib_1.__importDefault(require("react"));
const ReactLoadableLoading_1 = require("../ReactLoadableLoading");
/**
 * # 🎣 BlueBaseFilter
 *
 * Since filters in BlueBase are based on promises, it may be tedious to handle loading state,
 * error state, etc. It may also become a repetitive task.
 *
 * To solve this issue, we ship BlueBaseFilter component. Just pass name of filter, initial value,
 * and filter arguments as props. The final filtered value will be passed to the children function.
 * This component will handle loading and error states itself.
 *
 * ## Usage
 * ```jsx
 * <BlueBaseFilter filter="math" value={5} args={{ op: 'add' }} children={(val: number) => {
 * 	return <Text>{val}</Text>;
 * }} />
 * ```
 */
class BlueBaseFilter extends react_1.default.PureComponent {
    render() {
        const { filter, value, args, children } = this.props;
        const BB = this.context;
        const AsyncBlueBaseFilter = react_loadable_1.default({
            loader: () => BB.Filters.run(filter, value, args),
            loading: ReactLoadableLoading_1.ReactLoadableLoading,
            render(loadedValue) {
                return children(loadedValue);
            }
        });
        return react_1.default.createElement(AsyncBlueBaseFilter, null);
    }
}
BlueBaseFilter.contextType = Context_1.BlueBaseContext;
BlueBaseFilter.defaultProps = {
    args: {}
};
exports.BlueBaseFilter = BlueBaseFilter;
