{"id":15559588,"url":"https://github.com/c-w/mathquill4quill","last_synced_at":"2025-04-05T07:06:03.127Z","repository":{"id":46630271,"uuid":"79165393","full_name":"c-w/mathquill4quill","owner":"c-w","description":"Power-up Quill's formula editing via the MathQuill editor","archived":false,"fork":false,"pushed_at":"2024-05-10T02:01:51.000Z","size":12087,"stargazers_count":142,"open_issues_count":5,"forks_count":34,"subscribers_count":8,"default_branch":"master","last_synced_at":"2025-03-29T06:06:22.192Z","etag":null,"topics":["hacktoberfest","latex","mathquill","quill","wysiwyg"],"latest_commit_sha":null,"homepage":"https://justamouse.com/mathquill4quill","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/c-w.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE.txt","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2017-01-16T22:28:23.000Z","updated_at":"2025-03-23T17:01:06.000Z","dependencies_parsed_at":"2023-01-22T10:30:08.983Z","dependency_job_id":"7d68c0fa-25ab-498a-a495-36d06429949c","html_url":"https://github.com/c-w/mathquill4quill","commit_stats":{"total_commits":144,"total_committers":12,"mean_commits":12.0,"dds":"0.41666666666666663","last_synced_commit":"f96f4ab34acc9cb3b2c7e8e90301e8c3bfc320df"},"previous_names":[],"tags_count":19,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-w%2Fmathquill4quill","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-w%2Fmathquill4quill/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-w%2Fmathquill4quill/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/c-w%2Fmathquill4quill/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/c-w","download_url":"https://codeload.github.com/c-w/mathquill4quill/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":247299832,"owners_count":20916190,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hacktoberfest","latex","mathquill","quill","wysiwyg"],"created_at":"2024-10-02T15:53:07.390Z","updated_at":"2025-04-05T07:06:03.111Z","avatar_url":"https://github.com/c-w.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# MathQuill 4 Quill\n\n[![Build Status](https://github.com/c-w/mathquill4quill/workflows/CI/badge.svg)](https://github.com/c-w/mathquill4quill/actions?query=workflow%3Aci)\n[![Version](https://img.shields.io/npm/v/mathquill4quill.svg)](https://www.npmjs.com/package/mathquill4quill)\n[![Code Style: prettier](https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square)](https://github.com/prettier/prettier)\n[![License](https://img.shields.io/badge/License-Apache_2.0-blue.svg)](https://github.com/c-w/mathquill4quill/blob/master/LICENSE.txt)\n\n## What's this?\n\nThis module adds support for rich math authoring to the [Quill](http://quilljs.com/) editor.\n\n\u003cimg src=\"https://user-images.githubusercontent.com/1086421/60978795-afb8e100-a2ff-11e9-8a4a-6f77e24001c9.gif\" width=\"450\" alt=\"Basic demo of mathquill4quill\"\u003e\n\n[Live demo](https://c-w.github.io/mathquill4quill/)\n\n## Usage example\n\n### Plain Javascript\n\nThis module depends on [MathQuill](https://docs.mathquill.com/en/latest/Getting_Started/#download-and-load), [Quill](https://quilljs.com/docs/quickstart/) and [KaTeX](https://katex.org/docs/browser.html#starter-template), so you'll need to add references to their JS and CSS files in addition to adding a reference to `mathquill4quill.js` and `mathquill4quill.css`. Official builds as well as minified assets can be found on the [releases page](https://github.com/c-w/mathquill4quill/releases).\n\nNext, initialize your Quill object and load the formula module:\n\n```javascript\n// setup quill with formula support\n\nvar quill = new Quill('#editor', {\n  modules: {\n    formula: true,\n    toolbar: [['formula']]\n  },\n  theme: 'snow'\n});\n```\n\nLast step: replace Quill's native formula authoring with MathQuill.\n\n```javascript\n// enable mathquill formula editor\n\nvar enableMathQuillFormulaAuthoring = mathquill4quill();\nenableMathQuillFormulaAuthoring(quill);\n```\n\nA working demo application can be found [here](./index.html) ([live](https://justamouse.com/mathquill4quill)).\n\n### React\n\nA demo application integrating this module with [react-quill](https://github.com/zenoamaro/react-quill) can be found [here](./reactjs) ([live](https://justamouse.com/mathquill4quill/reactjs)). A demo for [NextJS](https://nextjs.org/) can be found [here](./nextjs).\n\n## Optional features\n\n### Custom operator buttons\n\nYou can also add in operator buttons (buttons that allow users not familiar with latex to add in operators/functions like square roots) to the editor by passing the `operators` option to the `enableMathQuillFormulaAuthoring()` function. Example:\n\n```javascript\nenableMathQuillFormulaAuthoring(quill, {\n  operators: [[\"\\\\sqrt[n]{x}\", \"\\\\nthroot\"], [\"\\\\frac{x}{y}\",\"\\\\frac\"]]\n});\n```\n\nThe operators variable is an array of arrays. The outside array contains all of the different arrays which describe the operator buttons. The arrays inside of the main array consist of two values. The first value is the latex that gets rendered as the value on the button, and the second value is the latex that gets inserted into the MathQuill editor.\n\n\u003cimg src=\"https://user-images.githubusercontent.com/1086421/60978823-b8a9b280-a2ff-11e9-990a-ffba2b4ff394.gif\" width=\"450\" alt=\"Demo of mathquill4quill with custom operator buttons\"\u003e\n\n### List of previous formulas\n\nPrevious formulas can be saved and re-used. The available related configurations are:\n\n```javascript\nenableMathQuillFormulaAuthoring(quill, {\n  displayHistory: true, // defaults to false\n  historyCacheKey: '__my_app_math_history_cachekey_', // optional\n  historySize: 20 // optional (defaults to 10)\n});\n```\n\nThis works by saving formula to a list (and local storage by default) everytime a new formula is used. Then displaying this list when a user opens the formula tooltip.\n\n\u003cimg src=\"https://user-images.githubusercontent.com/31671215/75315157-c96b5200-5816-11ea-99c2-f5414ee8e241.gif\" width=\"450\" alt=\"Demo of mathquill4quill with formula history\"\u003e\n\n### Autofocus\n\nFor user convenience, mathquill4quill defaults to focusing the math input field when the formula button is pressed. You can disable this behavior via the `autofocus` option in the `enableMathQuillFormulaAuthoring()` function. Example:\n\n```javascript\nenableMathQuillFormulaAuthoring(quill, {\n  autofocus: false\n});\n```\n\n## Development setup\n\nFirst, install the development dependencies:\n\n```bash\nnpm install\n```\n\nYou can now start the development server using `npm start`, verify code style compliance with `npm run lint` and run the tests with `npm test`.\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fc-w%2Fmathquill4quill","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fc-w%2Fmathquill4quill","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fc-w%2Fmathquill4quill/lists"}