open-index/open-npm huggingface dataset:
npm package: @rubin-epo/epo-react-lib
Description: Rubin Observatory Education & Public Outreach team React UI library.
Author: Rubin EPO
Latest version: 3.0.0

# epo-react-lib

React UI components for Rubin Observatory Education & Public Outreach projects

## Use

### Install

Install from npm.

`yarn add @rubin-epo/epo-react-lib`

### Dependencies

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`

There is an additional optional peer dependency on `next` for components that use the Next.js router.

### Styles

After installing the package library, the global styles will need to be added to the top level of your application.

```
import { GlobalStyles } from "@rubin-epo/epo-react-lib";

const App = () => {
  return <main><GlobalStyles></main>
}
```

If you use other Rubin React libraries, this step only needs to be done once from this library. Additional imports of the global styles are not necessary.

### Translations

Import `localeStrings` from `@rubin-epo/epo-react-lib`, it contains individual locales that can be added to your project's i18next setup.

## Build

### Vite

This project uses Vite in library mode to package the contents of `/packages/epo-react-lib/src` into modules located in `/packages/epo-react-lib/dist/epo-lib.[es|umd].js` and TypeScript typings in `/packages/epo-react-lib/dist/index.d.ts`

To build from source:

```
cd packages/epo-react-lib
yarn
yarn build # production build
# yarn dev # development server
```

### Storybook

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
```

## Test

> [!WARNING]
> Be wary that the Jest config for ESM differs from the `epo-widget-lib` config

Each component EPO React 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
# yarn test:generate-output # will save to .jest-test-results.json for Storybook
```

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<typeof DemoButton> = {
  args: {
    disabled: false,
    children: "Hello",
  },
  parameters: {
    jest: "DemoButton.test.tsx",
  },
};
```
npm package: @rubin-epo/epo-widget-lib
Description: Rubin Observatory Education & Public Outreach team React scientific and educational widgets.
Author: Rubin EPO
Latest version: 2.0.3

# epo-widget-lib

React widgets for Rubin Observatory Education & Public Outreach projects

## Use

### Install

Install from npm.

`yarn add @rubin-epo/epo-widget-lib`

### Dependencies

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`

### Styles

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";
```

### Translations

Import `localeStrings` from `@rubin-epo/epo-widget-lib`, it contains individual locales that can be added to your project's i18next setup.

## Build

### Vite

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

# yarn dev # development server

```

### Storybook

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

```

## Test

> [!WARNING]
> This package's Jest config is not setup to use strict ESM, as a result if you add `"type": "module"` to the `package.json` there will be CommonJS/ESM incompatibility errors.

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

# yarn test:generate-output # will save to .jest-test-results.json for Storybook

```

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<typeof DemoButton> = {
args: {
disabled: false,
children: "Hello",
},
parameters: {
jest: "DemoButton.test.tsx",
},
};

```

```
npm package: @rubin-epo/eslint-config-react
Description: Rubin EPO shared ESLint config
Author: Rubin EPO
Latest version: 1.0.0-beta.4

# Shared ESLint configuration for React projects

This [ESLint](https://eslint.org/) configuration deactivates all formatting rules of ESLint and makes sure that [Prettier](https://prettier.io/) is used for code beautifying.

## Integrate into new project

1. Install this package as devDependency. The package uses [eslint-patch](https://www.npmjs.com/package/@rushstack/eslint-patch) to include its plugins as `devDependencies` for minimal configuration.

```sh
# with Yarn
$ yarn add -D @rubin-epo/eslint-config-react
```

2. Use ESLint config in your project

Create a `.eslintrc.js` file in project root with the following content:

```js
module.exports = {
  extends: ["@rubin-epo/eslint-config-react"],
  parserOptions: { tsconfigRootDir: __dirname },
};
```

3. Add a script to run ESLint in your `package.json`

```json
{
  "scripts": {
    "lint-js": "eslint -c .eslintrc.js \"**/*.{js,jsx,ts,tsx}\""
  }
}
```

4. Add an `.eslintignore` file to your project to exclude test directories, build directories, and other code that should not be linted.

```
node_modules/
dist/
storybook-static/
__mocks__/
```
npm package: @rubin-epo/space-surveyors
Description: Space Surveyors is built as library package using `Vite` with a built-in example application
Author: Rubin EPO
Latest version: 1.0.4

# Space Surveyors

Space Surveyors is built as library package using `Vite` with a built-in example application

## Commands

Vite scaffolds the package inside `/src`, and also sets up a playground for it inside `/example`.

The recommended workflow is to build the library in one terminal:

```bash
yarn start
```

This builds to `/dist` and runs the project in watch mode so any edits you save inside `src` causes a rebuild to `/dist`.

Then run the example inside another:

```bash
cd example

yarn # install dependencies
yarn start # or yarn start
```

The example installs the package built into `/dist` as a module. For live development, build the library using `yarn start` and `yarn link` to create a symlink between the library and example.

To do a one-off build of the library package, use `npm run prepare` or `yarn prepare`.

## Deployment

Space Surveyors is deployed using [gh-pages](https://github.com/tschaub/gh-pages) and lives at [https://lsst-epo.github.io/space-surveyors/](https://lsst-epo.github.io/space-surveyors/). To deploy a branch to Github Pages:

```bash
yarn deploy
```

A `predeploy` script will build the library and then the example and `gh-pages` will push the Parcel `example/dist` directory to the `gh-pages` branch.
npm package: @rubinsh/tracker-assist
Description: Tracker plugin for screen assistance through the WebRTC
Author: Aleksandr K
Latest version: 3.0.4-5

# OpenReplay Tracker Axios plugin

Tracker plugin for WebRTC video support at your site.

## Installation

```bash
npm i @openreplay/tracker-assist
```

## Usage

Initialize the `@openreplay/tracker` package as usual and load the plugin into it.

```js
import Tracker from '@openreplay/tracker';
import trackerAssist from '@openreplay/tracker-assist';

const tracker = new Tracker({
  projectKey: YOUR_PROJECT_KEY,
});
tracker.start();

tracker.use(trackerAssist());
```

Options:

```ts
{
  confirmText: string,
  confirmStyle: Object,
}
```
Use `confirmText` option to specify a text in the call confirmation popup.
You can specify its styles as well with  `confirmStyle` style object.

```ts
{
  background: "#555"
  color: "orange"
}

```