diff --git a/packages/react-components/react-nav-preview/src/components/Nav/renderNav.tsx b/packages/react-components/react-nav-preview/src/components/Nav/renderNav.tsx index 0e7231d90cbb77..ce54e9ceee61d5 100644 --- a/packages/react-components/react-nav-preview/src/components/Nav/renderNav.tsx +++ b/packages/react-components/react-nav-preview/src/components/Nav/renderNav.tsx @@ -2,15 +2,15 @@ /** @jsx createElement */ import { createElement } from '@fluentui/react-jsx-runtime'; -import { getSlotsNext } from '@fluentui/react-utilities'; +import { assertSlots } from '@fluentui/react-utilities'; import type { NavState, NavSlots } from './Nav.types'; /** * Render the final JSX of Nav */ export const renderNav_unstable = (state: NavState) => { - const { slots, slotProps } = getSlotsNext(state); + assertSlots(state); // TODO Add additional slots in the appropriate place - return ; + return ; }; diff --git a/packages/react-components/react-nav-preview/src/components/Nav/useNav.ts b/packages/react-components/react-nav-preview/src/components/Nav/useNav.ts index 3d2015de51f068..ef2eb8bd50afa9 100644 --- a/packages/react-components/react-nav-preview/src/components/Nav/useNav.ts +++ b/packages/react-components/react-nav-preview/src/components/Nav/useNav.ts @@ -1,5 +1,5 @@ import * as React from 'react'; -import { getNativeElementProps } from '@fluentui/react-utilities'; +import { getNativeElementProps, slot } from '@fluentui/react-utilities'; import type { NavProps, NavState } from './Nav.types'; /** @@ -20,9 +20,12 @@ export const useNav_unstable = (props: NavProps, ref: React.Ref): N }, // TODO add appropriate slots, for example: // mySlot: resolveShorthand(props.mySlot), - root: getNativeElementProps('div', { - ref, - ...props, - }), + root: slot.always( + getNativeElementProps('div', { + ref, + ...props, + }), + { elementType: 'div' }, + ), }; };