clean up type definitions

components/ContactForm/ContactForm.module.css

@@ -62,8 +62,11 @@
   background-color: var(--link);
 }
 
-.btn_submit .send_icon {
-  margin-right: var(--rounded-edge-radius);
+.send_icon {
+  width: 1.2em;
+  height: 1.2em;
+  vertical-align: -0.2em;
+  margin-right: 0.4em;
 }
 
 .result_icon {

components/Figure/Figure.tsx

@@ -9,7 +9,6 @@ import styles from "./Figure.module.css";
 type Props = Omit<NextImageProps, "alt"> &
   PropsWithChildren<{
     alt?: string; // becomes optional -- pulled from plaintext-ified caption if missing
-    className?: string;
   }>;
 
 const Figure = ({ children, alt, className, ...imageProps }: Props) => {

components/Heading/Heading.tsx

@@ -5,8 +5,6 @@ import styles from "./Heading.module.css";
 
 type Props = HTMLAttributes<HTMLHeadingElement> & {
   as: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
-  id?: string;
-  className?: string;
 };
 
 const Heading = ({ as: Component, id, className, children, ...rest }: Props) => {

components/HorizontalRule/HorizontalRule.tsx

@@ -1,10 +1,9 @@
 import classNames from "classnames";
+import type { HTMLAttributes } from "react";
 
 import styles from "./HorizontalRule.module.css";
 
-type Props = {
-  className?: string;
-};
+type Props = HTMLAttributes<HTMLHRElement>;
 
 const HorizontalRule = ({ className, ...rest }: Props) => <hr className={classNames(styles.hr, className)} {...rest} />;
 

components/IFrame/IFrame.tsx

@@ -1,15 +1,13 @@
 import classNames from "classnames";
+import { IframeHTMLAttributes } from "react";
 
 import styles from "./IFrame.module.css";
 
-type Props = {
-  src: string;
-  title?: string;
+type Props = IframeHTMLAttributes<HTMLElement> & {
   height: number;
   width?: number; // defaults to 100%
   allowScripts?: boolean;
   noScroll?: boolean;
-  className?: string;
 };
 
 const IFrame = ({ src, title, height, width, allowScripts, noScroll, className, ...rest }: Props) => (

components/Link/Link.tsx

@@ -9,10 +9,7 @@ import styles from "./Link.module.css";
 export type Props = Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "href"> &
   LinkProps &
   PropsWithChildren<{
-    target?: string;
-    rel?: string;
     forceNewWindow?: boolean;
-    className?: string;
   }>;
 
 const CustomLink = ({

components/List/List.tsx

@@ -1,20 +1,16 @@
 import classNames from "classnames";
-import type { PropsWithChildren } from "react";
+import type { HTMLAttributes } from "react";
 
 import styles from "./List.module.css";
 
-type Props = PropsWithChildren<{
-  className?: string;
-}>;
-
-export const UnorderedList = ({ className, ...rest }: Props) => (
+export const UnorderedList = ({ className, ...rest }: HTMLAttributes<HTMLUListElement>) => (
   <ul className={classNames(styles.unordered, className)} {...rest} />
 );
-export const OrderedList = ({ className, ...rest }: Props) => (
+export const OrderedList = ({ className, ...rest }: HTMLAttributes<HTMLOListElement>) => (
   <ol className={classNames(styles.ordered, className)} {...rest} />
 );
 
 // TODO: this is based on good faith that the children are all `<li>`s...
-export const ListItem = ({ className, ...rest }: Props) => (
+export const ListItem = ({ className, ...rest }: HTMLAttributes<HTMLLIElement>) => (
   <li className={classNames(styles.item, className)} {...rest} />
 );