findr is a set of utility libraries for building find and replace UIs in Javascript.
| 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 |
Join the Open Components Ecosystem Discord for help.
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-pgThis 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, saystart, 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