function ResultsPerPage()

in packages/react-search-ui-views/src/ResultsPerPage.tsx [48:86]


function ResultsPerPage({
  className,
  onChange,
  options,
  value: selectedValue,
  ...rest
}: ResultsPerPageViewProps) {
  let selectedOption = null;

  if (selectedValue) {
    selectedOption = wrapOption(selectedValue);

    if (!options.includes(selectedValue)) options = [selectedValue, ...options];
  }

  return (
    <div
      className={appendClassName("sui-results-per-page", className)}
      {...rest}
    >
      <div className="sui-results-per-page__label">Show</div>
      <Select
        className="sui-select sui-select--inline"
        classNamePrefix="sui-select"
        value={selectedOption}
        onChange={(o) => onChange(o.value)}
        options={options.map(wrapOption)}
        isSearchable={false}
        styles={setDefaultStyle}
        components={{
          Option: (props) => {
            props.innerProps["data-transaction-name"] = `results per page`;
            return Option(props);
          }
        }}
      />
    </div>
  );
}