Float Toolkit for React

A React hook wrapper for Float Toolkit

Get started

Installation

To add Float Toolkit to your React app, run this command:

npm install @float-toolkit/react

Usage

The package export is a React hook called useFloatToolkit. It returns an object with an output state, as well as FloatToolkit methods that also serve as setters for the output.

import { useEffect } from "react";
import useFloatToolkit from "@float-toolkit/react";

function Sum({ x, y }) {
	const { add, output } = useFloatToolkit();

	useEffect(() => {
		add([x, y]);
	}, [x, y]);

	return <span className="number">{output}</span>;
}

TypeScript

Just like its parent package, Float Toolkit for React is written in TypeScript. The ReactFT namespace contains all the type definitions used by the package.

import { FC, useEffect } from "react";
import useFloatToolkit, { ReactFT } from "@float-toolkit/react";

interface Props {
	numbers: number[];
	precision?: ReactFT.Precision;
}

const Sum: FC<Props> = props => {
	const { add, output } = useFloatToolkit(props.precision);

	useEffect(() => {
		add(props.numbers);
	}, [props.numbers]);

	return <span className="number">{output}</span>;
};

Support

Need help using Float Toolkit? Don't hesitate to reach out on GitHub Discussions!

Links

• FloatToolkit documentation (Vanilla JS)
• GitHub
• npm

Contributing

Before creating an issue, please consider the following:

• Read the documentation and this file carefully to make sure the error is actually a bug and not a mistake of your own.
• Make sure the issue hasn't already been reported or suggested.
• After following these steps, you can file an issue using one of our templates. Please make sure to follow our Code of Conduct.
• If you wish to submit a pull request alongside your issue, please follow our contribution guidelines.