@backstage/plugin-search-react 1.7.10 → 1.7.11-next.0

package/dist/index.esm.js

@@ -1,1154 +1,16 @@
-import { createApiRef, useApi, configApiRef, AnalyticsContext, useAnalytics } from '@backstage/core-plugin-api';
-import { S as SearchResultListItemExtensions, u as useSearchResultListItemExtensions, H as HigherOrderDefaultResultListItem } from './esm/extensions-COgIMweE.esm.js';
-export { b as HighlightedSearchResultText, a as SearchResultListItemExtension, c as createSearchResultListItemExtension } from './esm/extensions-COgIMweE.esm.js';
-import IconButton from '@material-ui/core/IconButton';
-import InputAdornment from '@material-ui/core/InputAdornment';
-import TextField from '@material-ui/core/TextField';
-import Button from '@material-ui/core/Button';
-import SearchIcon from '@material-ui/icons/Search';
-import React, { useContext, useState, useCallback, useEffect, forwardRef, useRef, useMemo } from 'react';
-import useDebounce from 'react-use/esm/useDebounce';
-import { isEqual, isFunction } from 'lodash';
-import useAsync from 'react-use/esm/useAsync';
-import usePrevious from 'react-use/esm/usePrevious';
-import { createVersionedContext, createVersionedValueMap } from '@backstage/version-bridge';
-import CircularProgress from '@material-ui/core/CircularProgress';
-import { makeStyles } from '@material-ui/core/styles';
-import Autocomplete from '@material-ui/lab/Autocomplete';
-import ListItemIcon from '@material-ui/core/ListItemIcon';
-import ListItemText from '@material-ui/core/ListItemText';
-import FormControl from '@material-ui/core/FormControl';
-import FormControlLabel from '@material-ui/core/FormControlLabel';
-import InputLabel from '@material-ui/core/InputLabel';
-import Checkbox from '@material-ui/core/Checkbox';
-import Select from '@material-ui/core/Select';
-import MenuItem from '@material-ui/core/MenuItem';
-import FormLabel from '@material-ui/core/FormLabel';
-import Typography from '@material-ui/core/Typography';
-import Chip from '@material-ui/core/Chip';
-import useAsyncFn from 'react-use/esm/useAsyncFn';
-import TablePagination from '@material-ui/core/TablePagination';
-import { Progress, ResponseErrorPanel, EmptyState, Link } from '@backstage/core-components';
-import List from '@material-ui/core/List';
-import qs from 'qs';
-import ListSubheader from '@material-ui/core/ListSubheader';
-import Menu from '@material-ui/core/Menu';
-import InputBase from '@material-ui/core/InputBase';
-import AddIcon from '@material-ui/icons/Add';
-import ArrowRightIcon from '@material-ui/icons/ArrowForwardIos';
-import ArrowBackIosIcon from '@material-ui/icons/ArrowBackIos';
-import '@material-ui/core/ListItem';
-import '@material-ui/core/Box';
-
-const searchApiRef = createApiRef({
-  id: "plugin.search.queryservice"
-});
-class MockSearchApi {
-  constructor(mockedResults) {
-    this.mockedResults = mockedResults;
-  }
-  query() {
-    return Promise.resolve(this.mockedResults || { results: [] });
-  }
-}
-
-const SearchContext = createVersionedContext("search-context");
-const useSearch = () => {
-  const context = useContext(SearchContext);
-  if (!context) {
-    throw new Error("useSearch must be used within a SearchContextProvider");
-  }
-  const value = context.atVersion(1);
-  if (!value) {
-    throw new Error("No SearchContext v1 found");
-  }
-  return value;
-};
-const useSearchContextCheck = () => {
-  const context = useContext(SearchContext);
-  return context !== void 0;
-};
-const defaultInitialSearchState = {
-  term: "",
-  types: [],
-  filters: {},
-  pageLimit: void 0,
-  pageCursor: void 0
-};
-const useSearchContextValue = (initialValue = defaultInitialSearchState) => {
-  var _a, _b, _c, _d;
-  const searchApi = useApi(searchApiRef);
-  const analytics = useAnalytics();
-  const [term, setTerm] = useState(initialValue.term);
-  const [types, setTypes] = useState(initialValue.types);
-  const [filters, setFilters] = useState(initialValue.filters);
-  const [pageLimit, setPageLimit] = useState(
-    initialValue.pageLimit
-  );
-  const [pageCursor, setPageCursor] = useState(
-    initialValue.pageCursor
-  );
-  const prevTerm = usePrevious(term);
-  const prevFilters = usePrevious(filters);
-  const result = useAsync(async () => {
-    var _a2, _b2;
-    const resultSet = await searchApi.query({
-      term,
-      types,
-      filters,
-      pageLimit,
-      pageCursor
-    });
-    if (term) {
-      analytics.captureEvent("search", term, {
-        value: (_b2 = (_a2 = result.value) == null ? void 0 : _a2.numberOfResults) != null ? _b2 : void 0
-      });
-    }
-    return resultSet;
-  }, [term, types, filters, pageLimit, pageCursor]);
-  const hasNextPage = !result.loading && !result.error && ((_a = result.value) == null ? void 0 : _a.nextPageCursor);
-  const hasPreviousPage = !result.loading && !result.error && ((_b = result.value) == null ? void 0 : _b.previousPageCursor);
-  const fetchNextPage = useCallback(() => {
-    var _a2;
-    setPageCursor((_a2 = result.value) == null ? void 0 : _a2.nextPageCursor);
-  }, [(_c = result.value) == null ? void 0 : _c.nextPageCursor]);
-  const fetchPreviousPage = useCallback(() => {
-    var _a2;
-    setPageCursor((_a2 = result.value) == null ? void 0 : _a2.previousPageCursor);
-  }, [(_d = result.value) == null ? void 0 : _d.previousPageCursor]);
-  useEffect(() => {
-    if (prevTerm !== void 0 && term !== prevTerm) {
-      setPageCursor(void 0);
-    }
-  }, [term, prevTerm, setPageCursor]);
-  useEffect(() => {
-    if (prevFilters !== void 0 && !isEqual(filters, prevFilters)) {
-      setPageCursor(void 0);
-    }
-  }, [filters, prevFilters, setPageCursor]);
-  const value = {
-    result,
-    term,
-    setTerm,
-    types,
-    setTypes,
-    filters,
-    setFilters,
-    pageLimit,
-    setPageLimit,
-    pageCursor,
-    setPageCursor,
-    fetchNextPage: hasNextPage ? fetchNextPage : void 0,
-    fetchPreviousPage: hasPreviousPage ? fetchPreviousPage : void 0
-  };
-  return value;
-};
-const LocalSearchContext = (props) => {
-  const { initialState, children } = props;
-  const value = useSearchContextValue(initialState);
-  return /* @__PURE__ */ React.createElement(
-    AnalyticsContext,
-    {
-      attributes: { searchTypes: value.types.sort().join(",") }
-    },
-    /* @__PURE__ */ React.createElement(SearchContext.Provider, { value: createVersionedValueMap({ 1: value }) }, children)
-  );
-};
-const SearchContextProvider = (props) => {
-  const { initialState, inheritParentContextIfAvailable, children } = props;
-  const hasParentContext = useSearchContextCheck();
-  const configApi = useApi(configApiRef);
-  const propsInitialSearchState = initialState != null ? initialState : {};
-  const configInitialSearchState = configApi.has("search.query.pageLimit") ? { pageLimit: configApi.getNumber("search.query.pageLimit") } : {};
-  const searchContextInitialState = {
-    ...defaultInitialSearchState,
-    ...propsInitialSearchState,
-    ...configInitialSearchState
-  };
-  return hasParentContext && inheritParentContextIfAvailable ? /* @__PURE__ */ React.createElement(React.Fragment, null, children) : /* @__PURE__ */ React.createElement(LocalSearchContext, { initialState: searchContextInitialState }, children);
-};
-
-function withContext$1(Component) {
-  return forwardRef((props, ref) => /* @__PURE__ */ React.createElement(SearchContextProvider, { inheritParentContextIfAvailable: true }, /* @__PURE__ */ React.createElement(Component, { ...props, ref })));
-}
-const SearchBarBase = withContext$1(
-  forwardRef((props, ref) => {
-    const {
-      onChange,
-      onKeyDown = () => {
-      },
-      onClear = () => {
-      },
-      onSubmit = () => {
-      },
-      debounceTime = 200,
-      clearButton = true,
-      fullWidth = true,
-      value: defaultValue,
-      label,
-      placeholder,
-      inputProps = {},
-      InputProps = {},
-      endAdornment,
-      ...rest
-    } = props;
-    const configApi = useApi(configApiRef);
-    const [value, setValue] = useState("");
-    const forwardedValueRef = useRef("");
-    useEffect(() => {
-      setValue((prevValue) => {
-        if (prevValue === forwardedValueRef.current) {
-          return String(defaultValue);
-        }
-        return prevValue;
-      });
-    }, [defaultValue, forwardedValueRef]);
-    useDebounce(
-      () => {
-        forwardedValueRef.current = value;
-        onChange(value);
-      },
-      debounceTime,
-      [value]
-    );
-    const handleChange = useCallback(
-      (e) => {
-        setValue(e.target.value);
-      },
-      [setValue]
-    );
-    const handleKeyDown = useCallback(
-      (e) => {
-        if (onKeyDown)
-          onKeyDown(e);
-        if (onSubmit && e.key === "Enter") {
-          onSubmit();
-        }
-      },
-      [onKeyDown, onSubmit]
-    );
-    const handleClear = useCallback(() => {
-      forwardedValueRef.current = "";
-      onChange("");
-      setValue("");
-      if (onClear) {
-        onClear();
-      }
-    }, [onChange, onClear]);
-    const ariaLabel = label ? void 0 : "Search";
-    const inputPlaceholder = placeholder != null ? placeholder : `Search in ${configApi.getOptionalString("app.title") || "Backstage"}`;
-    const startAdornment = /* @__PURE__ */ React.createElement(InputAdornment, { position: "start" }, /* @__PURE__ */ React.createElement(IconButton, { "aria-label": "Query", size: "small", disabled: true }, /* @__PURE__ */ React.createElement(SearchIcon, null)));
-    const clearButtonEndAdornment = /* @__PURE__ */ React.createElement(InputAdornment, { position: "end" }, /* @__PURE__ */ React.createElement(
-      Button,
-      {
-        "aria-label": "Clear",
-        size: "small",
-        onClick: handleClear,
-        onKeyDown: (event) => {
-          if (event.key === "Enter") {
-            event.stopPropagation();
-          }
-        }
-      },
-      "Clear"
-    ));
-    return /* @__PURE__ */ React.createElement(
-      TextField,
-      {
-        id: "search-bar-text-field",
-        "data-testid": "search-bar-next",
-        variant: "outlined",
-        margin: "normal",
-        inputRef: ref,
-        value,
-        label,
-        placeholder: inputPlaceholder,
-        InputProps: {
-          startAdornment,
-          endAdornment: clearButton ? clearButtonEndAdornment : endAdornment,
-          ...InputProps
-        },
-        inputProps: {
-          "aria-label": ariaLabel,
-          ...inputProps
-        },
-        fullWidth,
-        onChange: handleChange,
-        onKeyDown: handleKeyDown,
-        ...rest
-      }
-    );
-  })
-);
-const SearchBar = withContext$1(
-  forwardRef((props, ref) => {
-    const { value: initialValue = "", onChange, ...rest } = props;
-    const { term, setTerm } = useSearch();
-    useEffect(() => {
-      if (initialValue) {
-        setTerm(String(initialValue));
-      }
-    }, [initialValue, setTerm]);
-    const handleChange = useCallback(
-      (newValue) => {
-        if (onChange) {
-          onChange(newValue);
-        } else {
-          setTerm(newValue);
-        }
-      },
-      [onChange, setTerm]
-    );
-    return /* @__PURE__ */ React.createElement(
-      AnalyticsContext,
-      {
-        attributes: { pluginId: "search", extension: "SearchBar" }
-      },
-      /* @__PURE__ */ React.createElement(
-        SearchBarBase,
-        {
-          ...rest,
-          ref,
-          value: term,
-          onChange: handleChange
-        }
-      )
-    );
-  })
-);
-
-const useStyles$3 = makeStyles((theme) => ({
-  loading: {
-    right: theme.spacing(1),
-    position: "absolute"
-  }
-}));
-const withContext = (Component) => {
-  return (props) => /* @__PURE__ */ React.createElement(SearchContextProvider, { inheritParentContextIfAvailable: true }, /* @__PURE__ */ React.createElement(Component, { ...props }));
-};
-const SearchAutocompleteLoadingAdornment = () => {
-  const classes = useStyles$3();
-  return /* @__PURE__ */ React.createElement(
-    CircularProgress,
-    {
-      className: classes.loading,
-      "data-testid": "search-autocomplete-progressbar",
-      color: "inherit",
-      size: 20
-    }
-  );
-};
-const SearchAutocomplete = withContext(
-  function SearchAutocompleteComponent(props) {
-    const {
-      loading,
-      value,
-      onChange = () => {
-      },
-      options = [],
-      getOptionLabel = (option) => String(option),
-      inputPlaceholder,
-      inputDebounceTime,
-      freeSolo = true,
-      fullWidth = true,
-      clearOnBlur = false,
-      "data-testid": dataTestId = "search-autocomplete",
-      ...rest
-    } = props;
-    const { setTerm } = useSearch();
-    const getInputValue = useCallback(
-      (option) => {
-        if (!option)
-          return "";
-        if (typeof option === "string")
-          return option;
-        return getOptionLabel(option);
-      },
-      [getOptionLabel]
-    );
-    const inputValue = useMemo(
-      () => getInputValue(value),
-      [value, getInputValue]
-    );
-    const handleChange = useCallback(
-      (event, option, reason, details) => {
-        setTerm(getInputValue(option));
-        onChange(event, option, reason, details);
-      },
-      [getInputValue, setTerm, onChange]
-    );
-    const renderInput = useCallback(
-      ({
-        InputProps: { ref, className, endAdornment },
-        InputLabelProps,
-        ...params
-      }) => /* @__PURE__ */ React.createElement(
-        SearchBar,
-        {
-          ...params,
-          ref,
-          clearButton: false,
-          value: inputValue,
-          placeholder: inputPlaceholder,
-          debounceTime: inputDebounceTime,
-          endAdornment: loading ? /* @__PURE__ */ React.createElement(SearchAutocompleteLoadingAdornment, null) : endAdornment,
-          InputProps: { className }
-        }
-      ),
-      [loading, inputValue, inputPlaceholder, inputDebounceTime]
-    );
-    return /* @__PURE__ */ React.createElement(
-      Autocomplete,
-      {
-        ...rest,
-        "data-testid": dataTestId,
-        value,
-        onChange: handleChange,
-        options,
-        getOptionLabel,
-        renderInput,
-        freeSolo,
-        fullWidth,
-        clearOnBlur
-      }
-    );
-  }
-);
-
-const SearchAutocompleteDefaultOption = (props) => {
-  const {
-    icon,
-    primaryText,
-    primaryTextTypographyProps,
-    secondaryText,
-    secondaryTextTypographyProps,
-    disableTextTypography
-  } = props;
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, icon ? /* @__PURE__ */ React.createElement(ListItemIcon, null, icon) : null, /* @__PURE__ */ React.createElement(
-    ListItemText,
-    {
-      primary: primaryText,
-      primaryTypographyProps: primaryTextTypographyProps,
-      secondary: secondaryText,
-      secondaryTypographyProps: secondaryTextTypographyProps,
-      disableTypography: disableTextTypography
-    }
-  ));
-};
-
-const useAsyncFilterValues = (fn, inputValue, defaultValues = [], debounce = 250) => {
-  const valuesMemo = useRef({});
-  const definiteFn = fn || (() => Promise.resolve([]));
-  const [state, callback] = useAsyncFn(definiteFn, [inputValue], {
-    loading: true
-  });
-  useDebounce(
-    () => {
-      if (valuesMemo.current[inputValue] === void 0) {
-        valuesMemo.current[inputValue] = callback(inputValue).then((values) => {
-          valuesMemo.current[inputValue] = values;
-          return values;
-        });
-      }
-    },
-    debounce,
-    [callback, inputValue]
-  );
-  if (defaultValues.length) {
-    return {
-      loading: false,
-      value: defaultValues
-    };
-  }
-  const possibleValue = valuesMemo.current[inputValue];
-  if (Array.isArray(possibleValue)) {
-    return {
-      loading: false,
-      value: possibleValue
-    };
-  }
-  return state;
-};
-const useDefaultFilterValue = (name, defaultValue) => {
-  const { setFilters } = useSearch();
-  useEffect(() => {
-    if (defaultValue && [defaultValue].flat().length > 0) {
-      setFilters((prevFilters) => ({
-        ...prevFilters,
-        [name]: defaultValue
-      }));
-    }
-  }, []);
-};
-
-const AutocompleteFilter = (props) => {
-  const {
-    className,
-    defaultValue,
-    name,
-    values: givenValues,
-    valuesDebounceMs,
-    label,
-    filterSelectedOptions,
-    limitTags,
-    multiple
-  } = props;
-  const [inputValue, setInputValue] = useState("");
-  useDefaultFilterValue(name, defaultValue);
-  const asyncValues = typeof givenValues === "function" ? givenValues : void 0;
-  const defaultValues = typeof givenValues === "function" ? void 0 : givenValues;
-  const { value: values, loading } = useAsyncFilterValues(
-    asyncValues,
-    inputValue,
-    defaultValues,
-    valuesDebounceMs
-  );
-  const { filters, setFilters } = useSearch();
-  const filterValue = filters[name] || (multiple ? [] : null);
-  const handleChange = (_, newValue) => {
-    setFilters((prevState) => {
-      const { [name]: filter, ...others } = prevState;
-      if (newValue) {
-        return { ...others, [name]: newValue };
-      }
-      return { ...others };
-    });
-  };
-  const renderInput = (params) => /* @__PURE__ */ React.createElement(
-    TextField,
-    {
-      ...params,
-      name: "search",
-      variant: "outlined",
-      label,
-      fullWidth: true
-    }
-  );
-  const renderTags = (tagValue, getTagProps) => tagValue.map((option, index) => /* @__PURE__ */ React.createElement(Chip, { label: option, color: "primary", ...getTagProps({ index }) }));
-  return /* @__PURE__ */ React.createElement(
-    Autocomplete,
-    {
-      filterSelectedOptions,
-      limitTags,
-      multiple,
-      className,
-      id: `${multiple ? "multi-" : ""}select-filter-${name}--select`,
-      options: values || [],
-      loading,
-      value: filterValue,
-      onChange: handleChange,
-      onInputChange: (_, newValue) => setInputValue(newValue),
-      renderInput,
-      renderTags
-    }
-  );
-};
-
-const useStyles$2 = makeStyles({
-  label: {
-    textTransform: "capitalize"
-  },
-  checkboxWrapper: {
-    display: "flex",
-    alignItems: "center",
-    width: "100%"
-  },
-  textWrapper: {
-    overflow: "hidden",
-    textOverflow: "ellipsis",
-    whiteSpace: "nowrap"
-  }
-});
-const CheckboxFilter = (props) => {
-  const {
-    className,
-    defaultValue,
-    label,
-    name,
-    values: givenValues = [],
-    valuesDebounceMs
-  } = props;
-  const classes = useStyles$2();
-  const { filters, setFilters } = useSearch();
-  useDefaultFilterValue(name, defaultValue);
-  const asyncValues = typeof givenValues === "function" ? givenValues : void 0;
-  const defaultValues = typeof givenValues === "function" ? void 0 : givenValues;
-  const { value: values = [], loading } = useAsyncFilterValues(
-    asyncValues,
-    "",
-    defaultValues,
-    valuesDebounceMs
-  );
-  const handleChange = (e) => {
-    const {
-      target: { value, checked }
-    } = e;
-    setFilters((prevFilters) => {
-      const { [name]: filter, ...others } = prevFilters;
-      const rest = (filter || []).filter((i) => i !== value);
-      const items = checked ? [...rest, value] : rest;
-      return items.length ? { ...others, [name]: items } : others;
-    });
-  };
-  return /* @__PURE__ */ React.createElement(
-    FormControl,
-    {
-      className,
-      disabled: loading,
-      fullWidth: true,
-      "data-testid": "search-checkboxfilter-next"
-    },
-    label ? /* @__PURE__ */ React.createElement(FormLabel, { className: classes.label }, label) : null,
-    values.map((value) => {
-      var _a;
-      return /* @__PURE__ */ React.createElement(
-        FormControlLabel,
-        {
-          key: value,
-          classes: {
-            root: classes.checkboxWrapper,
-            label: classes.textWrapper
-          },
-          label: value,
-          control: /* @__PURE__ */ React.createElement(
-            Checkbox,
-            {
-              color: "primary",
-              inputProps: { "aria-labelledby": value },
-              value,
-              name: value,
-              onChange: handleChange,
-              checked: ((_a = filters[name]) != null ? _a : []).includes(value)
-            }
-          )
-        }
-      );
-    })
-  );
-};
-const SelectFilter = (props) => {
-  const {
-    className,
-    defaultValue,
-    label,
-    name,
-    values: givenValues,
-    valuesDebounceMs
-  } = props;
-  const classes = useStyles$2();
-  useDefaultFilterValue(name, defaultValue);
-  const asyncValues = typeof givenValues === "function" ? givenValues : void 0;
-  const defaultValues = typeof givenValues === "function" ? void 0 : givenValues;
-  const { value: values = [], loading } = useAsyncFilterValues(
-    asyncValues,
-    "",
-    defaultValues,
-    valuesDebounceMs
-  );
-  const { filters, setFilters } = useSearch();
-  const handleChange = (e) => {
-    const {
-      target: { value }
-    } = e;
-    setFilters((prevFilters) => {
-      const { [name]: filter, ...others } = prevFilters;
-      return value ? { ...others, [name]: value } : others;
-    });
-  };
-  return /* @__PURE__ */ React.createElement(
-    FormControl,
-    {
-      disabled: loading,
-      className,
-      variant: "filled",
-      fullWidth: true,
-      "data-testid": "search-selectfilter-next"
-    },
-    label ? /* @__PURE__ */ React.createElement(InputLabel, { className: classes.label, margin: "dense" }, label) : null,
-    /* @__PURE__ */ React.createElement(
-      Select,
-      {
-        variant: "outlined",
-        value: filters[name] || "",
-        onChange: handleChange
-      },
-      /* @__PURE__ */ React.createElement(MenuItem, { value: "" }, /* @__PURE__ */ React.createElement("em", null, "All")),
-      values.map((value) => /* @__PURE__ */ React.createElement(MenuItem, { key: value, value }, /* @__PURE__ */ React.createElement(Typography, { variant: "inherit", noWrap: true }, value)))
-    )
-  );
-};
-const SearchFilter = (props) => {
-  const { component: Element, ...elementProps } = props;
-  return /* @__PURE__ */ React.createElement(Element, { ...elementProps });
-};
-SearchFilter.Checkbox = (props) => /* @__PURE__ */ React.createElement(SearchFilter, { ...props, component: CheckboxFilter });
-SearchFilter.Select = (props) => /* @__PURE__ */ React.createElement(SearchFilter, { ...props, component: SelectFilter });
-SearchFilter.Autocomplete = (props) => /* @__PURE__ */ React.createElement(SearchFilter, { ...props, component: AutocompleteFilter });
-
-const encodePageCursor = (pageCursor) => {
-  return Buffer.from(pageCursor.toString(), "utf-8").toString("base64");
-};
-const decodePageCursor = (pageCursor) => {
-  if (!pageCursor)
-    return 0;
-  return Number(Buffer.from(pageCursor, "base64").toString("utf-8"));
-};
-const SearchPaginationBase = (props) => {
-  const {
-    total: count = -1,
-    cursor: pageCursor,
-    hasNextPage,
-    onCursorChange: onPageCursorChange,
-    limit: rowsPerPage = 25,
-    limitLabel: labelRowsPerPage = "Results per page:",
-    limitText: labelDisplayedRows = ({ from, to }) => count > 0 ? `of ${count}` : `${from}-${to}`,
-    limitOptions: rowsPerPageOptions,
-    onLimitChange: onPageLimitChange,
-    ...rest
-  } = props;
-  const page = useMemo(() => decodePageCursor(pageCursor), [pageCursor]);
-  const handlePageChange = useCallback(
-    (_, newValue) => {
-      onPageCursorChange == null ? void 0 : onPageCursorChange(encodePageCursor(newValue));
-    },
-    [onPageCursorChange]
-  );
-  const handleRowsPerPageChange = useCallback(
-    (e) => {
-      const newValue = e.target.value;
-      onPageLimitChange == null ? void 0 : onPageLimitChange(parseInt(newValue, 10));
-    },
-    [onPageLimitChange]
-  );
-  return /* @__PURE__ */ React.createElement(
-    TablePagination,
-    {
-      ...rest,
-      component: "div",
-      count,
-      page,
-      nextIconButtonProps: {
-        ...hasNextPage !== void 0 && { disabled: !hasNextPage }
-      },
-      onPageChange: handlePageChange,
-      rowsPerPage,
-      labelRowsPerPage,
-      labelDisplayedRows,
-      rowsPerPageOptions,
-      onRowsPerPageChange: handleRowsPerPageChange
-    }
-  );
-};
-const SearchPagination = (props) => {
-  const { pageLimit, setPageLimit, pageCursor, setPageCursor, fetchNextPage } = useSearch();
-  const handlePageLimitChange = useCallback(
-    (newPageLimit) => {
-      setPageLimit(newPageLimit);
-      setPageCursor(void 0);
-    },
-    [setPageLimit, setPageCursor]
-  );
-  return /* @__PURE__ */ React.createElement(
-    SearchPaginationBase,
-    {
-      ...props,
-      hasNextPage: !!fetchNextPage,
-      limit: pageLimit,
-      onLimitChange: handlePageLimitChange,
-      cursor: pageCursor,
-      onCursorChange: setPageCursor
-    }
-  );
-};
-
-const SearchResultContext = (props) => {
-  const { children } = props;
-  const context = useSearch();
-  const { result: state, ...query } = context;
-  return children(state, query);
-};
-const SearchResultApi = (props) => {
-  const { query, children } = props;
-  const searchApi = useApi(searchApiRef);
-  const state = useAsync(() => {
-    const { term = "", types = [], filters = {}, ...rest } = query;
-    return searchApi.query({ ...rest, term, types, filters });
-  }, [query]);
-  return children(state, query);
-};
-const SearchResultState = (props) => {
-  const { query, children } = props;
-  return query ? /* @__PURE__ */ React.createElement(SearchResultApi, { query }, children) : /* @__PURE__ */ React.createElement(SearchResultContext, null, children);
-};
-const SearchResultComponent = (props) => {
-  const {
-    query,
-    children,
-    noResultsComponent = /* @__PURE__ */ React.createElement(EmptyState, { missing: "data", title: "Sorry, no results were found" }),
-    ...rest
-  } = props;
-  return /* @__PURE__ */ React.createElement(SearchResultState, { query }, ({ loading, error, value }) => {
-    if (loading) {
-      return /* @__PURE__ */ React.createElement(Progress, null);
-    }
-    if (error) {
-      return /* @__PURE__ */ React.createElement(
-        ResponseErrorPanel,
-        {
-          title: "Error encountered while fetching search results",
-          error
-        }
-      );
-    }
-    if (!(value == null ? void 0 : value.results.length)) {
-      return noResultsComponent;
-    }
-    if (isFunction(children)) {
-      return children(value);
-    }
-    return /* @__PURE__ */ React.createElement(SearchResultListItemExtensions, { ...rest, results: value.results }, children);
-  });
-};
-const SearchResult = (props) => /* @__PURE__ */ React.createElement(
-  AnalyticsContext,
-  {
-    attributes: {
-      pluginId: "search",
-      extension: "SearchResult"
-    }
-  },
-  /* @__PURE__ */ React.createElement(SearchResultComponent, { ...props })
-);
-
-const SearchResultListLayout = (props) => {
-  const {
-    error,
-    loading,
-    resultItems,
-    renderResultItem = (resultItem) => /* @__PURE__ */ React.createElement(
-      HigherOrderDefaultResultListItem,
-      {
-        key: resultItem.document.location,
-        result: resultItem.document
-      }
-    ),
-    disableRenderingWithNoResults,
-    noResultsComponent = disableRenderingWithNoResults ? null : /* @__PURE__ */ React.createElement(EmptyState, { missing: "data", title: "Sorry, no results were found" }),
-    ...rest
-  } = props;
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  }
-  if (error) {
-    return /* @__PURE__ */ React.createElement(
-      ResponseErrorPanel,
-      {
-        title: "Error encountered while fetching search results",
-        error
-      }
-    );
-  }
-  if (!(resultItems == null ? void 0 : resultItems.length)) {
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, noResultsComponent);
-  }
-  return /* @__PURE__ */ React.createElement(List, { ...rest }, resultItems.map(renderResultItem));
-};
-const SearchResultList = (props) => {
-  const { query, renderResultItem, children, ...rest } = props;
-  const defaultRenderResultItem = useSearchResultListItemExtensions(children);
-  return /* @__PURE__ */ React.createElement(
-    AnalyticsContext,
-    {
-      attributes: {
-        pluginId: "search",
-        extension: "SearchResultList"
-      }
-    },
-    /* @__PURE__ */ React.createElement(SearchResultState, { query }, ({ loading, error, value }) => /* @__PURE__ */ React.createElement(
-      SearchResultListLayout,
-      {
-        ...rest,
-        error,
-        loading,
-        resultItems: value == null ? void 0 : value.results,
-        renderResultItem: renderResultItem != null ? renderResultItem : defaultRenderResultItem
-      }
-    ))
-  );
-};
-
-const useStyles$1 = makeStyles((theme) => ({
-  listSubheader: {
-    display: "flex",
-    alignItems: "center"
-  },
-  listSubheaderName: {
-    marginLeft: theme.spacing(1),
-    textTransform: "uppercase"
-  },
-  listSubheaderChip: {
-    color: theme.palette.text.secondary,
-    margin: theme.spacing(0, 0, 0, 1.5)
-  },
-  listSubheaderFilter: {
-    display: "flex",
-    color: theme.palette.text.secondary,
-    margin: theme.spacing(0, 0, 0, 1.5)
-  },
-  listSubheaderLink: {
-    marginLeft: "auto",
-    display: "flex",
-    alignItems: "center"
-  },
-  listSubheaderLinkIcon: {
-    fontSize: "inherit",
-    marginLeft: theme.spacing(0.5)
-  }
-}));
-const SearchResultGroupFilterFieldLayout = (props) => {
-  const classes = useStyles$1();
-  const { label, children, ...rest } = props;
-  return /* @__PURE__ */ React.createElement(
-    Chip,
-    {
-      ...rest,
-      className: classes.listSubheaderFilter,
-      variant: "outlined",
-      label: /* @__PURE__ */ React.createElement(React.Fragment, null, label, ": ", children)
-    }
-  );
-};
-const NullIcon = () => null;
-const useSearchResultGroupTextFilterStyles = makeStyles((theme) => ({
-  root: {
-    fontSize: "inherit",
-    "&:focus": {
-      outline: "none",
-      background: theme.palette.common.white
-    },
-    "&:not(:focus)": {
-      cursor: "pointer",
-      color: theme.palette.primary.main,
-      "&:hover": {
-        textDecoration: "underline"
-      }
-    }
-  }
-}));
-const SearchResultGroupTextFilterField = (props) => {
-  const classes = useSearchResultGroupTextFilterStyles();
-  const { label, value = "None", onChange, onDelete } = props;
-  const handleChange = useCallback(
-    (e) => {
-      onChange(e.target.value);
-    },
-    [onChange]
-  );
-  return /* @__PURE__ */ React.createElement(SearchResultGroupFilterFieldLayout, { label, onDelete }, /* @__PURE__ */ React.createElement(
-    Typography,
-    {
-      role: "textbox",
-      component: "span",
-      className: classes.root,
-      onChange: handleChange,
-      contentEditable: true,
-      suppressContentEditableWarning: true
-    },
-    value == null ? void 0 : value.toString()
-  ));
-};
-const useSearchResultGroupSelectFilterStyles = makeStyles((theme) => ({
-  root: {
-    fontSize: "inherit",
-    "&:not(:focus)": {
-      cursor: "pointer",
-      color: theme.palette.primary.main,
-      "&:hover": {
-        textDecoration: "underline"
-      }
-    },
-    "&:focus": {
-      outline: "none"
-    },
-    "&>div:first-child": {
-      padding: 0
-    }
-  }
-}));
-const SearchResultGroupSelectFilterField = (props) => {
-  const classes = useSearchResultGroupSelectFilterStyles();
-  const { label, value = "none", onChange, onDelete, children } = props;
-  const handleChange = useCallback(
-    (e) => {
-      onChange(e.target.value);
-    },
-    [onChange]
-  );
-  return /* @__PURE__ */ React.createElement(SearchResultGroupFilterFieldLayout, { label, onDelete }, /* @__PURE__ */ React.createElement(
-    Select,
-    {
-      className: classes.root,
-      value,
-      onChange: handleChange,
-      input: /* @__PURE__ */ React.createElement(InputBase, null),
-      IconComponent: NullIcon
-    },
-    /* @__PURE__ */ React.createElement(MenuItem, { value: "none" }, "None"),
-    children
-  ));
-};
-function SearchResultGroupLayout(props) {
-  const classes = useStyles$1();
-  const [anchorEl, setAnchorEl] = useState(null);
-  const {
-    error,
-    loading,
-    icon,
-    title,
-    titleProps = {},
-    link = /* @__PURE__ */ React.createElement(React.Fragment, null, "See all", /* @__PURE__ */ React.createElement(ArrowRightIcon, { className: classes.listSubheaderLinkIcon })),
-    linkProps = {},
-    filterOptions,
-    renderFilterOption = (filterOption) => /* @__PURE__ */ React.createElement(MenuItem, { key: String(filterOption), value: String(filterOption) }, String(filterOption)),
-    filterFields,
-    renderFilterField,
-    resultItems,
-    renderResultItem = (resultItem) => /* @__PURE__ */ React.createElement(
-      HigherOrderDefaultResultListItem,
-      {
-        key: resultItem.document.location,
-        result: resultItem.document
-      }
-    ),
-    disableRenderingWithNoResults,
-    noResultsComponent = disableRenderingWithNoResults ? null : /* @__PURE__ */ React.createElement(EmptyState, { missing: "data", title: "Sorry, no results were found" }),
-    ...rest
-  } = props;
-  const handleClick = useCallback((e) => {
-    setAnchorEl(e.currentTarget);
-  }, []);
-  const handleClose = useCallback(() => {
-    setAnchorEl(null);
-  }, []);
-  if (loading) {
-    return /* @__PURE__ */ React.createElement(Progress, null);
-  }
-  if (error) {
-    return /* @__PURE__ */ React.createElement(
-      ResponseErrorPanel,
-      {
-        title: "Error encountered while fetching search results",
-        error
-      }
-    );
-  }
-  if (!(resultItems == null ? void 0 : resultItems.length)) {
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, noResultsComponent);
-  }
-  return /* @__PURE__ */ React.createElement(List, { ...rest }, /* @__PURE__ */ React.createElement(ListSubheader, { className: classes.listSubheader }, icon, /* @__PURE__ */ React.createElement(
-    Typography,
-    {
-      className: classes.listSubheaderName,
-      component: "strong",
-      ...titleProps
-    },
-    title
-  ), filterOptions ? /* @__PURE__ */ React.createElement(
-    Chip,
-    {
-      className: classes.listSubheaderChip,
-      component: "button",
-      icon: /* @__PURE__ */ React.createElement(AddIcon, null),
-      variant: "outlined",
-      label: "Add filter",
-      "aria-controls": "filters-menu",
-      "aria-haspopup": "true",
-      onClick: handleClick
-    }
-  ) : null, filterOptions ? /* @__PURE__ */ React.createElement(
-    Menu,
-    {
-      id: "filters-menu",
-      anchorEl,
-      open: Boolean(anchorEl),
-      onClose: handleClose,
-      onClick: handleClose,
-      keepMounted: true
-    },
-    filterOptions.map(renderFilterOption)
-  ) : null, filterFields == null ? void 0 : filterFields.map(
-    (filterField) => {
-      var _a;
-      return (_a = renderFilterField == null ? void 0 : renderFilterField(filterField)) != null ? _a : null;
-    }
-  ), /* @__PURE__ */ React.createElement(Link, { className: classes.listSubheaderLink, to: "/search", ...linkProps }, link)), resultItems.map(renderResultItem));
-}
-function SearchResultGroup(props) {
-  const { query, children, renderResultItem, linkProps = {}, ...rest } = props;
-  const defaultRenderResultItem = useSearchResultListItemExtensions(children);
-  return /* @__PURE__ */ React.createElement(
-    AnalyticsContext,
-    {
-      attributes: {
-        pluginId: "search",
-        extension: "SearchResultGroup"
-      }
-    },
-    /* @__PURE__ */ React.createElement(SearchResultState, { query }, ({ loading, error, value }, { term, types, pageCursor, filters = {} }) => {
-      const to = `/search?${qs.stringify(
-        { term, types, filters, pageCursor, query: term },
-        { arrayFormat: "brackets" }
-      )}`;
-      return /* @__PURE__ */ React.createElement(
-        SearchResultGroupLayout,
-        {
-          ...rest,
-          error,
-          loading,
-          linkProps: { to, ...linkProps },
-          filterFields: Object.keys(filters),
-          resultItems: value == null ? void 0 : value.results,
-          renderResultItem: renderResultItem != null ? renderResultItem : defaultRenderResultItem
-        }
-      );
-    })
-  );
-}
-
-const useStyles = makeStyles((theme) => ({
-  root: {
-    display: "flex",
-    justifyContent: "space-between",
-    gap: theme.spacing(2),
-    margin: theme.spacing(2, 0)
-  }
-}));
-const SearchResultPager = () => {
-  const { fetchNextPage, fetchPreviousPage } = useSearch();
-  const classes = useStyles();
-  if (!fetchNextPage && !fetchPreviousPage) {
-    return /* @__PURE__ */ React.createElement(React.Fragment, null);
-  }
-  return /* @__PURE__ */ React.createElement("nav", { "aria-label": "pagination navigation", className: classes.root }, /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      "aria-label": "previous page",
-      disabled: !fetchPreviousPage,
-      onClick: fetchPreviousPage,
-      startIcon: /* @__PURE__ */ React.createElement(ArrowBackIosIcon, null)
-    },
-    "Previous"
-  ), /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      "aria-label": "next page",
-      disabled: !fetchNextPage,
-      onClick: fetchNextPage,
-      endIcon: /* @__PURE__ */ React.createElement(ArrowRightIcon, null)
-    },
-    "Next"
-  ));
-};
-
-export { AutocompleteFilter, CheckboxFilter, HigherOrderDefaultResultListItem as DefaultResultListItem, MockSearchApi, SearchAutocomplete, SearchAutocompleteDefaultOption, SearchBar, SearchBarBase, SearchContextProvider, SearchFilter, SearchPagination, SearchPaginationBase, SearchResult, SearchResultApi, SearchResultComponent, SearchResultContext, SearchResultGroup, SearchResultGroupFilterFieldLayout, SearchResultGroupLayout, SearchResultGroupSelectFilterField, SearchResultGroupTextFilterField, SearchResultList, SearchResultListItemExtensions, SearchResultListLayout, SearchResultPager, SearchResultState, SelectFilter, searchApiRef, useSearch, useSearchContextCheck, useSearchResultListItemExtensions };
+export { MockSearchApi, searchApiRef } from './api.esm.js';
+export { SearchResultListItemExtension, SearchResultListItemExtensions, createSearchResultListItemExtension, useSearchResultListItemExtensions } from './extensions.esm.js';
+export { HighlightedSearchResultText } from './components/HighlightedSearchResultText/HighlightedSearchResultText.esm.js';
+export { SearchBar, SearchBarBase } from './components/SearchBar/SearchBar.esm.js';
+export { SearchAutocomplete } from './components/SearchAutocomplete/SearchAutocomplete.esm.js';
+export { SearchAutocompleteDefaultOption } from './components/SearchAutocomplete/SearchAutocompleteDefaultOption.esm.js';
+export { CheckboxFilter, SearchFilter, SelectFilter } from './components/SearchFilter/SearchFilter.esm.js';
+export { AutocompleteFilter } from './components/SearchFilter/SearchFilter.Autocomplete.esm.js';
+export { SearchPagination, SearchPaginationBase } from './components/SearchPagination/SearchPagination.esm.js';
+export { SearchResult, SearchResultApi, SearchResultComponent, SearchResultContext, SearchResultState } from './components/SearchResult/SearchResult.esm.js';
+export { SearchResultList, SearchResultListLayout } from './components/SearchResultList/SearchResultList.esm.js';
+export { SearchResultGroup, SearchResultGroupFilterFieldLayout, SearchResultGroupLayout, SearchResultGroupSelectFilterField, SearchResultGroupTextFilterField } from './components/SearchResultGroup/SearchResultGroup.esm.js';
+export { SearchResultPager } from './components/SearchResultPager/SearchResultPager.esm.js';
+export { DefaultResultListItem } from './components/DefaultResultListItem/DefaultResultListItem.esm.js';
+export { SearchContextProvider, useSearch, useSearchContextCheck } from './context/SearchContext.esm.js';
 //# sourceMappingURL=index.esm.js.map