chore(docs, package resolutions, and script aliases.): 📝 Implement new CONTRIBUTING.md. Add aliases to pnpm workspace scripts for better dx. Modify resolutions for refractor to match react-syntax-highlighter. Implement gacp for better conventional commits.

Added new CONTRIBUTING.MD doc.

Added new dependency "gacp" for automating semantic commits. Commits can be formatted from the terminal using the following script:
```
pnpm commit
```

Reinstalled via pnpm to fix lockfile issues.

Added `rcb` alias to root package.json scripts for better dx:
```
pnpm rcb run storybook
```

Added `demo` alias to root package.json scripts. Still a WIP!

Demo can still be run and installed individually via
```
cd demo
pnpm i
pnpm run start
```

refractor now resolves to version "^3.6.0".

Author: Raj

CONTRIBUTING.md

@@ -1,2 +1,81 @@
-# WIP
+# Contributing to React Code Blocks
 
+First off, thank you for considering contributing to React Code Blocks. It's people like you that make React Code Blocks such a great tool.
+
+### Where do I go from here?
+
+If you've noticed a bug or have a question, [search the issue tracker](https://github.com/rajinwonderland/react-code-blocks/issues) to see if someone else in the community has already created a ticket. If not, go ahead and make one!
+
+### Fork & create a branch
+
+If this is something you think you can fix, then [fork React Code Blocks](https://github.com/rajinwonderland/react-code-blocks/fork) and create a branch with a descriptive name.
+
+A good branch name would be (where issue #325 is the ticket you're working on):
+
+```bash
+git checkout -b 325-add-language-support
+```
+
+### Working on the code
+
+We use `pnpm workspaces` to house all of our demos and packages.
+
+The `react-code-blocks` package is located under [`packages/react-code-blocks`](packages/react-code-blocks).
+
+You can run the following command from the root of the project to start storybook:
+
+```bash
+pnpm rcb run storybook
+```
+
+### Implement your fix or feature
+
+At this point, you're ready to make your changes! Feel free to ask for help; everyone is a beginner at first 😸
+
+### Committing Your Changes
+
+We follow a set of conventions for commit messages to make the history easier to understand and to facilitate the creation of changelogs. To help with this process, we use `gacp` (Git Automated Commit and Push), which is a tool that helps to format commit messages according to the conventional commit format.
+
+Before committing, make sure to stage your changes. You can do this with:
+
+```bash
+git add .
+```
+
+Instead of using git commit, we use an automated process via the command:
+
+```bash
+pnpm commit
+```
+
+This command will prompt you to fill out any required commit fields at commit time. No need to worry about the commit message format as gacp will guide you through the process.
+
+### Make a Pull Request
+
+At this point, you should switch back to your master branch and make sure it's up to date with React Code Blocks's master branch:
+
+```bash
+git remote add upstream https://github.com/rajinwonderland/react-code-blocks.git
+git checkout master
+git pull upstream master
+```
+
+Then update your feature branch from your local copy of master, and push it!
+
+```bash
+git checkout 325-add-language-support
+git rebase master
+git push --set-upstream origin 325-add-language-support
+```
+
+Finally, go to GitHub and [make a Pull Request](https://github.com/rajinwonderland/react-code-blocks/compare) 🎉
+
+### Keeping your Pull Request updated
+
+If a maintainer asks you to "rebase" your Pull Request, they're saying that a lot of code has changed, and that you need to update your branch so it's easier to merge.
+
+Here's a great article on rebasing, which basically just means getting the latest version of master and then putting your branch on top of it.
+
+### Questions?
+
+Feel free to contact either [@rajinwonderland](https://github.com/rajinwonderland) or [@thomasmost](https://github.com/thomasmost) if you have any questions about contributing.

package.json

@@ -5,9 +5,12 @@
   "author": "",
   "private": true,
   "scripts": {
-    "start:demo": "pnpm start demo",
+    "rcb": "pnpm -r --filter react-code-blocks",
+    "demo": "pnpm -r --filter demo",
+    "start:demo": "pnpm demo run start",
     "test": "pnpm test",
-    "nuke": "rm -rf node_modules rm -rf pnpm-lock.yaml"
+    "nuke": "rm -rf node_modules rm -rf pnpm-lock.yaml",
+    "commit": "gacp"
   },
   "workspaces": [
     "packages/*",
@@ -20,7 +23,7 @@
   "resolutions": {
     "react": "^16.11.0",
     "react-dom": "^16.11.0",
-    "refractor": "^4.8.1",
+    "refractor": "^3.6.0",
     "react-syntax-highlighter": "^15.5.0"
   },
   "homepage": "https://react-code-blocks.rajinwonderland.vercel.app",
@@ -83,5 +86,14 @@
       "postcss@<8.4.31": ">=8.4.31",
       "@babel/traverse@<7.23.2": ">=7.23.2"
     }
+  },
+  "gacp": {
+    "add": false,
+    "push": true,
+    "emoji": "emoji",
+    "editor": true
+  },
+  "devDependencies": {
+    "gacp": "^3.0.3"
   }
 }

packages/react-code-blocks/README.md

@@ -68,7 +68,7 @@ npm i react-code-blocks
 > Updated usage instructions can be found [here](https://react-code-blocks.rajinwonderland.vercel.app/)
 
 ```js
-import { CopyBlock } from "react-code-blocks";
+import { CopyBlock } from 'react-code-blocks';
 ```
 
 ```js
@@ -91,7 +91,7 @@ function MyCodeComponent(props) {
 A simple code block component
 
 ```js
-import { CodeBlock, dracula } from "react-code-blocks";
+import { CodeBlock, dracula } from 'react-code-blocks';
 
 function MyCoolCodeBlock({ code, language, showLineNumbers }) {
   return (
@@ -126,7 +126,7 @@ function MyCoolCodeBlock({ code, language, showLineNumbers }) {
 A code block component with a little copy button for copying a snippet.
 
 ```jsx
-import { CopyBlock, dracula } from "react-code-blocks";
+import { CopyBlock, dracula } from 'react-code-blocks';
 
 function MyCoolCodeBlock({ code, language, showLineNumbers }) {
   <CopyBlock
@@ -203,6 +203,5 @@ _This README was generated with ❤️ by [readme-md-generator](https://github.c
 <img src="packages/assets/rajinwonderland.png" height="175px" />
 </div>
 
-- Website: https://novvum.io
 - Twitter: [@rajinwonderland](https://twitter.com/rajinwonderland)
 - Github: [@rajinwonderland](https://github.com/rajinwonderland)

packages/react-code-blocks/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-code-blocks",
-  "description": "Modified Atlaskit's Code Block to support more languages (i.e graphql, reasonml, etc) and theme (i.e railscast, darcula, monokai, etc) code snippets!",
+  "description": "Modified Atlaskit's Code Block to support more languages (i.e graphql, reasonml, etc) and theme (i.e railscast, dracula, monokai, etc) code snippets!",
   "keywords": [
     "code-snippets",
     "code-blocks",
@@ -81,9 +81,8 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.10.4",
-    "@types/react-syntax-highlighter": "^15.5.7",
     "react-syntax-highlighter": "^15.5.0",
-		"styled-components": "^6.1.0",
+    "styled-components": "^6.1.0",
     "tslib": "^2.6.0"
   }
 }