Fix conflict between ListItem type and HTMLLIElement. (#932)

canonical · Jul 7, 2023 · d2afcc3 · d2afcc3
1 parent 56239ca
commit d2afcc3
Showing 1 changed file with 15 additions and 9 deletions.
diff --git a/src/components/List/List.tsx b/src/components/List/List.tsx
@@ -2,19 +2,25 @@ import classNames from "classnames";
 import React from "react";
 import type { HTMLProps, ReactNode } from "react";
 
-import type { ClassName, Headings } from "types";
+import { ClassName, Headings, PropsWithSpread } from "types";
 
 export type ListItem =
   | ReactNode
-  | ({
-      content: ReactNode;
-    } & HTMLProps<HTMLLIElement>);
+  | PropsWithSpread<
+      {
+        content: ReactNode;
+      },
+      HTMLProps<HTMLLIElement>
+    >;
 
-export type SteppedListItem = {
-  content: ReactNode;
-  title: ReactNode;
-  titleElement?: Headings;
-} & Omit<HTMLProps<HTMLLIElement>, "title" | "content">; // omit global attributes of HTMLProps since they can only be string or undefined
+export type SteppedListItem = PropsWithSpread<
+  {
+    content: ReactNode;
+    title: ReactNode;
+    titleElement?: Headings;
+  },
+  HTMLProps<HTMLLIElement>
+>;
 
 export type Props = {
   /**