add ability to pass href to sub components

[madhums]

I'd like to be able to pass props to child components viz

const itemTypeToComponent = {
  [ITEM_TYPES.PAGE]: PageLink,
  [ITEM_TYPES.ELLIPSIS]: Ellipsis,
  [ITEM_TYPES.FIRST_PAGE_LINK]: FirstPageLink,
  [ITEM_TYPES.PREVIOUS_PAGE_LINK]: () => null,
  [ITEM_TYPES.NEXT_PAGE_LINK]: () => null,
  [ITEM_TYPES.LAST_PAGE_LINK]: LastPageLink
};

Right now I use a hook within each of these. For example:

// Custom hook to create a href without loosing any query params of the page
// Takes queryparam and it's value as an argument
function useQueryParam(name, value) {
  const pathname = usePathname();
  const searchParams = useSearchParams();
  const params = new URLSearchParams(searchParams);
  params.set(name, value);
  const href = pathname + '?' + params.toString();
  return [href];
}

const PageLink = ({ onClick, isActive, value }) => {
  const [href] = useQueryParam('page', value);         // <------------- using a hook here to get the href
  return (
    <li className="page-item">
      <a
        className={clsx('page-link', isActive && 'disabled')}
        href={href}
        onClick={withPreventDefault(onClick)}>
        {value}
      </a>
    </li>
  );
};

const Ellipsis = ({ onClick, isActive, value }) => {
  const [href] = useQueryParam('page', value);         // <------------- using a hook here to get the href
  return (
    <li className="page-item">
      <a
        className={clsx('page-link', isActive && 'disabled')}
        href={href}
        onClick={withPreventDefault(onClick)}>
        ...
      </a>
    </li>
  );
};

It would be cool if a href can be generated and passed through. Would it be possible? Has anyone been using this library with a href?