Using 3rd party libraries

A 3rd party library may have useful functionality that isn't offered by the Views component library. Views are React apps and allow 3rd party libraries to be installed.
In the following example, we install the react-confetti package by running:
bash
Copied
1
npm install react-confetti
Once the component is installed, it can be imported and used in the view.
tsx
Copied
1
import { Checkbox, Stack, Title, useComponentState } from "@airplane/views";
2
import Confetti from "react-confetti";
3
4
const ConfettiParty = () => {
5
const shouldRainConfetti = useComponentState();
6
7
return (
8
<Stack style={{ padding: 200 }}>
9
<Stack align="center">
10
<Title>Airplane views party</Title>
11
<Checkbox label="Celebrate" id={shouldRainConfetti.id} />
12
</Stack>
13
{/* 🌟 Enable the custom <Confetti> component when the checkbox is checked. */}
14
{shouldRainConfetti.checked && <Confetti />}
15
</Stack>
16
);
17
};
18
19
export default ConfettiParty;

Up next

Learn how to style your components to give your view a consistent and high quality look and feel.