import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import classNames from 'classnames';
import { useState } from 'react';
import { useComponentTelemetry } from '../../../../lib/telemetry/index.js';
import { withRequiredCommonProps, } from '../../../../lib/seam/components/common-props.js';
import { SupportedDeviceContent } from '../../../../lib/seam/components/SupportedDeviceTable/SupportedDeviceContent.js';
import { SupportedDeviceFilterArea } from '../../../../lib/seam/components/SupportedDeviceTable/SupportedDeviceFilterArea.js';
export const NestedSupportedDeviceTable = withRequiredCommonProps(SupportedDeviceTable);
export function SupportedDeviceTable({ disableFilter = false, cannotFilter, brands = null, excludedBrands = [], className, } = {}) {
    useComponentTelemetry('SupportedDeviceTable');
    const [filterValue, setFilterValue] = useState('');
    const [filters, setFilters] = useState({
        supportedOnly: true,
        brand: null,
    });
    const hideFilter = cannotFilter ?? disableFilter;
    return (_jsxs("div", { className: classNames('seam-supported-device-table-content-wrap', className), children: [!hideFilter && (_jsx(SupportedDeviceFilterArea, { filterValue: filterValue, setFilterValue: setFilterValue, filters: filters, setFilters: setFilters, brands: brands, excludedBrands: excludedBrands })), _jsx(SupportedDeviceContent, { resetFilterValue: () => {
                    setFilterValue('');
                }, filterValue: filterValue, filters: filters, brands: brands, excludedBrands: excludedBrands })] }));
}
//# sourceMappingURL=SupportedDeviceTable.js.map