Rubin Observatory Education & Public Outreach team React scientific and educational widgets.
React widgets for Rubin Observatory Education & Public Outreach projects
Install from npm.
yarn add @rubin-epo/epo-widget-lib
EPO React Library has 5 peer dependencies required to pull it in to your application.
yarn add react react-dom styled-components i18next react-i18next
After installing the package library, the global styles from epo-react-lib will need to be added to your application
``
import { GlobalStyles } from "@rubin-epo/epo-react-lib/styles";
Import localeStrings from @rubin-epo/epo-widget-lib, it contains individual locales that can be added to your project's i18next setup.
This project uses Vite in library mode to package the contents of /packages/epo-widget-lib/src into modules located in /packages/epo-widget-lib/dist/epo-widget-lib.[es|umd].js and TypeScript typings in /packages/epo-widget-lib/dist/index.d.ts
To build from source:
`
cd packages/epo-widget-lib
yarn
yarn build # production build
`
Storybook is used to create an interactive display of the components in the EPO React Library.
Stories from component folders following the \\.stories.[t|j]sx will be included in the Storybook bundle.
To run Storybook:
``
yarn build
yarn storybook
`
Each component in EPO Widget Library contains a Jest unit test. Tests should be co-located with component code and their stories and follow the **.test.[t|j]sx naming format.
`
yarn test
`
To add a unit test to it's Storybook page add the filename of the unit test to the parameters property of the story
`
export const Primary: StoryObj
args: {
disabled: false,
children: "Hello",
},
parameters: {
jest: "DemoButton.test.tsx",
},
};
`
``