🐛 Bug Report

I'm trying to use the slider component from either Fluent or FAST. I can get it working by using wrap(fastSlider()) or wrap(fluentSlider()), but the resulting component does not seem to know anything about its prop types, so my code does not typecheck when I pass props like min, max, and step.

💻 Repro or Code Sample

import {
  fluentButton,
  fluentCard,
  fluentSlider,
  provideFluentDesignSystem,
} from "@fluentui/web-components";
import { provideReactWrapper } from "@microsoft/fast-react-wrapper";

const { wrap } = provideReactWrapper(React, provideFluentDesignSystem());

export const FluentCard = wrap(fluentCard());
export const FluentButton = wrap(fluentButton());
export const FluentSlider = wrap(fluentSlider());

Then, with the following code:

  return <div>
    <FluentButton onClick={() => console.log("hi")}/>
    <FluentSlider min="1" />
  </div>;

🤔 Expected Behavior

This code should type-check

😯 Current Behavior

I get a red squiggle under min="1" with the following typescript error:

Type '{ min: string; }' is not assignable to type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<ReactWrapperProps<FoundationElement, unknown>, {}, any>> & Readonly<...>'.
  Property 'min' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<ReactWrapperProps<FoundationElement, unknown>, {}, any>> & Readonly<...>'.ts(2322)

💁 Possible Solution

I'm guessing that the type definitions simply have not been implemented for Slider yet, since they are using "FoundationElement" instead of some more specific "SliderElement" or whatever.

🌍 Your Environment

I followed the instructions at https://learn.microsoft.com/en-us/fluent-ui/web-components/integrations/react to add Fluent & the fast-wrapper to my React project that is using Vite.

These are the dependencies I'm using:

    "@fluentui/web-components": "^2.5.16",
    "@microsoft/fast-element": "^1.12.0",
    "@microsoft/fast-foundation": "^2.49.4",
    "@microsoft/fast-react-wrapper": "^0.3.22",

microsoft / fast