findr

findr is a set of utility libraries for building find and replace UIs in Javascript.

Documentation

Local Package	NPM Package	Tutorial	Description
fnr-text	@findr/text	@findr/text tutorial	all the logic behind a find-and-replace feature
fnr-react	@findr/react		state management needed to build your own find-and-replace components
fnr-mui	@findr/mui		library of GUI components for find-and-replace based on @mui/material
fnr-perf	@findr/perf		Pipeline and Actions needed for find-and-replace scripture using proskomma-json-tools

All commands (and package.json scripts) should be executed from root and not from the packages directories.

Install dependencies and launch the playground:

  pnpm install
  pnpm nx preview fnr-pg

This repo is organized as a monorepo and uses the following Javascript tools:

For those new to the Nx and/or pnpm ecosystem here are common commands used in this project:

Creating a new react or javascript library, i.e:

pnpm nx g[enerate] lib[rary] --publishable --importPath=@findr/new --name=fnr-new

Creating a component in an existing react package, i.e:
```
pnpm nx g[enerate] c[omponent] --project=fnr-mui
```
Building a library, i.e:
```
pnpm nx build fnr-mui
```
Running a script from package's package.json, say start, i.e:
```
pnpm nx preview fnr-pg
```
Adding a package dependency should also be done from root, i.e:
```
pnpm add [package-name]
```
See a diagram of the dependencies of the projects:
```
nx graph  
```