styled-components propsを渡したい

Question

styled-componentsにpropsを渡したいのですがうまく行きません。やりたいこととしてはpageを指定して、その要素のみと最初最後を有効にしたいです。解決策をご存知の方はよろしくお願いします

  return (
    <>
      <Wrapper className={classes.root} page={10}>
        <List onChange={onChange} /> //liがたくさん並ぶ
      </Wrapper>
    </>
  );
};

const Wrapper = styled.div`
  p {
    display: none;
  }
  p:first-child,
  p:last-child,
  p:nth-child(${props => props.page}) {
    display: block;
  }
`;
//Property 'page' does not exist on type