chore: update types

kobaltedev · Jun 3, 2024 · 8575075 · 8575075
1 parent cddc92b
commit 8575075
Show file tree

Hide file tree

Showing 5 changed files with 44 additions and 34 deletions.
diff --git a/packages/core/src/navigation-menu/navigation-menu-arrow.tsx b/packages/core/src/navigation-menu/navigation-menu-arrow.tsx
@@ -9,7 +9,7 @@ import {
 } from "solid-js";
 
 import { useMenubarContext } from "../menubar/menubar-context";
-import { PolymorphicProps } from "../polymorphic";
+import { ElementOf, PolymorphicProps } from "../polymorphic";
 import {
 	PopperArrowCommonProps,
 	PopperArrowOptions,
@@ -20,22 +20,24 @@ import { useNavigationMenuContext } from "./navigation-menu-context";
 
 export interface NavigationMenuArrowOptions extends PopperArrowOptions {}
 
-export interface NavigationMenuArrowCommonProps
-	extends PopperArrowCommonProps {}
+export interface NavigationMenuArrowCommonProps<T extends HTMLElement = HTMLElement>
+	extends PopperArrowCommonProps<T> {}
 
 export interface NavigationMenuArrowRenderProps
 	extends NavigationMenuArrowCommonProps,
 		PopperArrowRenderProps {}
 
-export type NavigationMenuArrowProps = NavigationMenuArrowOptions &
-	Partial<NavigationMenuArrowCommonProps>;
+export type NavigationMenuArrowProps<
+	T extends ValidComponent | HTMLElement = HTMLElement,
+> = NavigationMenuArrowOptions &
+	Partial<NavigationMenuArrowCommonProps<ElementOf<T>>>;
 
 /**
  * An optional arrow element to render alongside the viewport content.
  * Must be rendered in the viewport.
  */
 export function NavigationMenuArrow<T extends ValidComponent = "div">(
-	props: PolymorphicProps<T, NavigationMenuArrowProps>,
+	props: PolymorphicProps<T, NavigationMenuArrowProps<T>>,
 ) {
 	let ref: HTMLElement | undefined;
 

diff --git a/packages/core/src/navigation-menu/navigation-menu-content.tsx b/packages/core/src/navigation-menu/navigation-menu-content.tsx
@@ -21,17 +21,17 @@ import {
 import { useMenuContext } from "../menu/menu-context";
 import { useMenuRootContext } from "../menu/menu-root-context";
 import { useMenubarContext } from "../menubar/menubar-context";
-import { PolymorphicProps } from "../polymorphic";
+import { ElementOf, PolymorphicProps } from "../polymorphic";
 import { useNavigationMenuContext } from "./navigation-menu-context";
 
 export type Motion = "to-start" | "to-end" | "from-start" | "from-end";
 
 export interface NavigationMenuContentOptions extends MenuContentOptions {}
 
-export interface NavigationMenuContentCommonProps
-	extends MenuContentCommonProps {
-	onPointerEnter: JSX.EventHandlerUnion<HTMLElement, PointerEvent>;
-	onPointerLeave: JSX.EventHandlerUnion<HTMLElement, PointerEvent>;
+export interface NavigationMenuContentCommonProps<T extends HTMLElement = HTMLElement>
+	extends MenuContentCommonProps<T> {
+	onPointerEnter: JSX.EventHandlerUnion<T, PointerEvent>;
+	onPointerLeave: JSX.EventHandlerUnion<T, PointerEvent>;
 }
 
 export interface NavigationMenuContentRenderProps
@@ -40,11 +40,13 @@ export interface NavigationMenuContentRenderProps
 	"data-motion"?: Motion;
 }
 
-export type NavigationMenuContentProps = NavigationMenuContentOptions &
-	Partial<NavigationMenuContentCommonProps>;
+export type NavigationMenuContentProps<
+	T extends ValidComponent | HTMLElement = HTMLElement,
+> = NavigationMenuContentOptions &
+	Partial<NavigationMenuContentCommonProps<ElementOf<T>>>;
 
 export function NavigationMenuContent<T extends ValidComponent = "div">(
-	props: PolymorphicProps<T, NavigationMenuContentProps>,
+	props: PolymorphicProps<T, NavigationMenuContentProps<T>>,
 ) {
 	const context = useNavigationMenuContext();
 	const menubarContext = useMenubarContext();

diff --git a/packages/core/src/navigation-menu/navigation-menu-root.tsx b/packages/core/src/navigation-menu/navigation-menu-root.tsx
@@ -18,7 +18,7 @@ import {
 	MenubarRootRenderProps,
 } from "../menubar";
 import { MenubarRoot } from "../menubar/menubar-root";
-import { PolymorphicProps } from "../polymorphic";
+import { ElementOf, PolymorphicProps } from "../polymorphic";
 import { Popper, PopperRootOptions } from "../popper";
 import { Placement } from "../popper/utils";
 import { createControllableSignal } from "../primitives/create-controllable-signal";
@@ -54,22 +54,24 @@ export interface NavigationMenuRootOptions
 	onAutoFocusMenuChange?: Setter<boolean>;
 }
 
-export interface NavigationMenuRootCommonProps extends MenubarRootCommonProps {
-	ref: HTMLElement | ((el: HTMLElement) => void);
+export interface NavigationMenuRootCommonProps<T extends HTMLElement = HTMLElement> extends MenubarRootCommonProps<T> {
+	ref: T | ((el: T) => void);
 }
 
 export interface NavigationMenuRootRenderProps
 	extends NavigationMenuRootCommonProps,
 		MenubarRootRenderProps {}
 
-export type NavigationMenuRootProps = NavigationMenuRootOptions &
-	Partial<NavigationMenuRootCommonProps>;
+export type NavigationMenuRootProps<
+	T extends ValidComponent | HTMLElement = HTMLElement,
+> = NavigationMenuRootOptions &
+	Partial<NavigationMenuRootCommonProps<ElementOf<T>>>;
 
 /**
  * A visually persistent menu common in desktop applications that provides quick access to a consistent set of commands.
  */
 export function NavigationMenuRoot<T extends ValidComponent = "div">(
-	props: PolymorphicProps<T, NavigationMenuRootProps>,
+	props: PolymorphicProps<T, NavigationMenuRootProps<T>>,
 ) {
 	const mergedProps = mergeDefaultProps(
 		{

diff --git a/packages/core/src/navigation-menu/navigation-menu-trigger.tsx b/packages/core/src/navigation-menu/navigation-menu-trigger.tsx
@@ -8,29 +8,31 @@ import {
 } from "../menu";
 import { useOptionalMenuContext } from "../menu/menu-context";
 import { MenubarTrigger } from "../menubar/menubar-trigger";
-import { PolymorphicProps } from "../polymorphic";
+import { ElementOf, PolymorphicProps } from "../polymorphic";
 import { useNavigationMenuContext } from "./navigation-menu-context";
 
 export interface NavigationMenuTriggerOptions extends MenuTriggerOptions {}
 
-export interface NavigationMenuTriggerCommonProps
-	extends MenuTriggerCommonProps {
-	onPointerEnter: JSX.EventHandlerUnion<HTMLElement, PointerEvent>;
-	onPointerLeave: JSX.EventHandlerUnion<HTMLElement, PointerEvent>;
+export interface NavigationMenuTriggerCommonProps<T extends HTMLElement = HTMLElement>
+	extends MenuTriggerCommonProps<T> {
+	onPointerEnter: JSX.EventHandlerUnion<T, PointerEvent>;
+	onPointerLeave: JSX.EventHandlerUnion<T, PointerEvent>;
 }
 
 export interface NavigationMenuTriggerRenderProps
 	extends NavigationMenuTriggerCommonProps,
 		MenuTriggerRenderProps {}
 
-export type NavigationMenuTriggerProps = NavigationMenuTriggerOptions &
-	Partial<NavigationMenuTriggerCommonProps>;
+export type NavigationMenuTriggerProps<
+	T extends ValidComponent | HTMLElement = HTMLElement,
+> = NavigationMenuTriggerOptions &
+	Partial<NavigationMenuTriggerCommonProps<ElementOf<T>>>;
 
 /**
  * The button that toggles the menubar menu or a menubar link.
  */
 export function NavigationMenuTrigger<T extends ValidComponent = "button">(
-	props: PolymorphicProps<T, NavigationMenuTriggerProps>,
+	props: PolymorphicProps<T, NavigationMenuTriggerProps<T>>,
 ) {
 	const context = useNavigationMenuContext();
 	const menuContext = useOptionalMenuContext();

diff --git a/packages/core/src/navigation-menu/navigation-menu-viewport.tsx b/packages/core/src/navigation-menu/navigation-menu-viewport.tsx
@@ -15,7 +15,7 @@ import {
 	DismissableLayerRenderProps,
 } from "../dismissable-layer";
 import { MenubarDataSet, useMenubarContext } from "../menubar/menubar-context";
-import { PolymorphicProps } from "../polymorphic";
+import { ElementOf, PolymorphicProps } from "../polymorphic";
 import { Popper } from "../popper";
 import {
 	FocusOutsideEvent,
@@ -51,8 +51,8 @@ export interface NavigationMenuViewportOptions {
 	onInteractOutside?: (event: InteractOutsideEvent) => void;
 }
 
-export interface NavigationMenuViewportCommonProps {
-	ref: HTMLElement | ((el: HTMLElement) => void);
+export interface NavigationMenuViewportCommonProps<T extends HTMLElement = HTMLElement> {
+	ref: T | ((el: T) => void);
 	/** The HTML styles attribute (object form only). */
 	style: JSX.CSSProperties;
 }
@@ -64,11 +64,13 @@ export interface NavigationMenuViewportRenderProps
 	"data-orientation": Orientation;
 }
 
-export type NavigationMenuViewportProps = NavigationMenuViewportOptions &
-	Partial<NavigationMenuViewportCommonProps>;
+export type NavigationMenuViewportProps<
+	T extends ValidComponent | HTMLElement = HTMLElement,
+> = NavigationMenuViewportOptions &
+	Partial<NavigationMenuViewportCommonProps<ElementOf<T>>>;
 
 export function NavigationMenuViewport<T extends ValidComponent = "div">(
-	props: PolymorphicProps<T, NavigationMenuViewportProps>,
+	props: PolymorphicProps<T, NavigationMenuViewportProps<T>>,
 ) {
 	const context = useNavigationMenuContext();
 	const menubarContext = useMenubarContext();