Oce Editor Tools

Bible resources editor tools

• using Proskomma underneath

View Demo and examples

Report Bug · Request Feature

---

Features

• Various underlying components assembled together and made available in an easy to use library.
• These tools are organized in three packages, each one tailored to various use-cases, depending on your needs.

Documentation

This project is organized as a mono-repository. The packages defined in this repo are published to npm individually. Here are the links and descriptions:

Local Package	📦 NPM Package	Demo	✏️ Description
mui-core	@oce-editor-tools/mui-core	Core Styleguidist	Various editor and preview components - the core library used by other packages
pk	@oce-editor-tools/pk	Pk Styleguidist	Designed to make it easy to have access to various Proskomma functions
simple	@oce-editor-tools/simple	Simple Styleguidist	A simplified implementation completely hiding Proskomma (while also loosing some repository handling as a result of this)

---

Setup

run yarn install on the root of the repository

Support

Having trouble? Get help in the official Open Components Ecosystem Discord.

• See a diagram of the dependencies of the projects.

nx graph  

• enable remote caching and make CI faster.

npx nx connect-to-nx-cloud

About The Project

Purpose

• Multiple re-usable editor and preview components packaged into a library (monorepo). These are meant to be integrated into applications for editing scripture text in USFM format.

Scope

This package library contains various wrappers for other components. All parts are designed to hide underlying complexity and make it easy to use, as "tools". Just choose what tools to use from the most suitable package, depending on your use cases.

These are some of the underlying components:

• the XELAH text editor. oce-editor-tools supplies additional UI parts, a toolbar, etc and XELAH supplies the text editor.

• Epitelete-html HTML handling in Epitelete - as a derived sub-class. All the original Epitelete parent functions are inherited and then extended with more functions for generating and parsing Html.

• proskomma-core An implementation of the Proskomma Scripture Processing Model.

(back to top)

Built With

• React.js

(back to top)

Getting Started

Here is an example of how you may set up your project locally.

To get a local copy up and running follow these simple example steps.

Installation/First Steps

If you wish to use a package from this library in your app you will need to add it as a dependency with, for example:

npm install @oce-editor-tools/mui-core

OR

yarn add @oce-editor-tools/mui-core

(just replace mui-core above with mui-pk or mui-simple in order to install one of the other packages)

Also you will need to add the peer dependencies:

npm install @mui/material @mui/styles @mui/icons-material  @mui/styled-engine npm:@mui/styled-engine-sc@latest react react-dom 

OR

yarn add @mui/material @mui/styles @mui/icons-material  @mui/styled-engine npm:@mui/styled-engine-sc@latest react react-dom 

(back to top)

Usage/Integration

See Styleguidist link for many usage examples.

Other examples here:

• mui-pk - with access to Proskomma features

and

• mui-simple - for simple usage

(back to top)

Roadmap

See the open issues for a full list of proposed features (and any known issues).

(back to top)

Contributing

The open source community is an amazing place to learn, inspire, and create. So, any contributions you make are greatly appreciated. Guidelines for rcl development and general information.

You can, for instance, simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

If you would like to fork the repo and create a pull request.

1. Fork the Project
2. Clone the repo

   git clone https://github.com/unfoldingWord/oce-editor-tools.git

3. Delete .yarnrc.yml
4. Confirm which version of yarn is running on this project

   yarn -v

   If 3.x then add interactive-tools. (If 4.x then skip this step as interactive tools are already included.)

   yarn plugin import interactive-tools

5. Define linker for installing Node packages

   yarn config set nodeLinker node-modules

6. Install NPM packages

   yarn install

7. Run a package locally, for instance:

   yarn nx start @oce-editor-tools/mui-simple

8. Create your feature branch (git checkout -b feature/AmazingFeature)
9. Make your changes, then update what will be committed (git add <file>)
10. Commit your changes with comment (git commit -m "Add some AmazingFeature")
11. Change the remote url to your fork (git remote set-url origin https://github.com/(YourFork)/oce-editor-tools.git)
12. Push to the Branch
13. Open a Pull Request

(back to top)

License

Distributed under the MIT License. See LICENSE for more information.

(back to top)