migrate to vite and vitest (#240)

* migrate to vite and vitest

* re-add the demo and update the vite configs

* Update the start script docs

Author: jamesrweb

.gitattributes

@@ -200,4 +200,4 @@ Procfile          text
 *.*rc             text
 
 # Ignore files (like .npmignore or .gitignore)
-*.*ignore         text
+*.*ignore         text

.github/SECURITY.md

@@ -2,19 +2,20 @@
 
 ## Supported Versions
 
-| Version | Supported          | Supported Until               |
-| ------- | ------------------ | ----------------------------- |
-| > 4.0.0 | :white_check_mark: | Next major version + 6 months |
-| > 3.0.0 | :white_check_mark: | 01.06.22                      |
-| < 3.0.0 | :x:                | N / A                         |
+| Version  | Supported          | Supported Until               |
+| -------- | ------------------ | ----------------------------- |
+| >= 5.0.0 | :white_check_mark: | Next major version + 6 months |
+| >= 4.0.0 | :white_check_mark: | Next major version + 6 months |
+| >= 3.0.0 | :white_check_mark: | 01.06.22                      |
+| <= 3.0.0 | :x:                | N / A                         |
 
 ## Reporting a Vulnerability
 
 To report a security vulnerability please
-[open a new issue](https://github.com/jamesrweb/react-p5-wrapper/issues/new)
-with the label `security`. Security issues are a priority and we aim to resolve
-them within 48 hours. If a security vulnerability cannot be resolved by us, we
-will raise the issue upstream with relevant parties such as 3rd party package
+[open a new issue](https://github.com/p5-wrapper/react/issues/new) with the
+label `security`. Security issues are a priority, and we aim to resolve them
+within 48 hours. If a security vulnerability cannot be resolved by us, we will
+raise the issue upstream with relevant parties such as 3rd party package
 managers.
 
 ## Contacts

.github/SUPPORT.md

@@ -4,29 +4,29 @@ This repository is maintained by the @jamesrweb and the community, who all
 volunteer their time.
 
 We track bugs, user questions, suggestions and requests through
-[issues](https://github.com/jamesrweb/react-p5-wrapper/issues) raised via the
-project repository issues tab.
+[issues](https://github.com/p5-wrapper/react/issues) raised via the project
+repository issues tab.
 
 ## Need help with something?
 
 All questions should be raised in
-[an issue](https://github.com/jamesrweb/react-p5-wrapper/issues/new) with the
-`question` tag and the `help wanted` tag added to the issue.
+[an issue](https://github.com/p5-wrapper/react/issues/new) with the `question`
+tag and the `help wanted` tag added to the issue.
 
 ## Found a bug?
 
 All bugs should be raised in
-[an issue](https://github.com/jamesrweb/react-p5-wrapper/issues/new) with the
-`bug` tag added to the issue.
+[an issue](https://github.com/p5-wrapper/react/issues/new) with the `bug` tag
+added to the issue.
 
 ## Though of a cool new feature?
 
 All bugs should be raised in
-[an issue](https://github.com/jamesrweb/react-p5-wrapper/issues/new) with the
+[an issue](https://github.com/p5-wrapper/react/issues/new) with the
 `enhancement` tag added to the issue.
 
 ## Have questions about the project?
 
 All questions should be raised in
-[an issue](https://github.com/jamesrweb/react-p5-wrapper/issues/new) with the
-`question` tag added to the issue.
+[an issue](https://github.com/p5-wrapper/react/issues/new) with the `question`
+tag added to the issue.

.github/workflows/CD.yml

@@ -29,9 +29,10 @@ jobs:
         with:
           token: ${{ secrets.GH_TOKEN }}
 
-      - name: Build the components
-        run: pnpm build:components
+      - name: Build the component
+        run: pnpm build:component
 
       - uses: JS-DevTools/npm-publish@v1
         with:
+          access: "public"
           token: ${{ secrets.NPM_TOKEN }}

.gitignore

@@ -1,7 +1,27 @@
+# Logs
+logs
 *.log
-coverage
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
+
 node_modules
 dist
-.DS_Store
+dist-ssr
+coverage
+*.local
+yarn.lock
 package-lock.json
-.idea
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

.npmrc

@@ -0,0 +1 @@
+auto-install-peers = true

LICENSE

@@ -18,4 +18,4 @@ FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
-SOFTWARE.
+SOFTWARE.

README.md

@@ -39,7 +39,7 @@ To try them out for yourself fork the repository, be sure you have
 git clone [email protected]:<your username>/react.git
 cd react
 pnpm install
-pnpm start
+pnpm preview
 ```
 
 Then just open `http://localhost:3001` in a browser.
@@ -58,7 +58,7 @@ package manager:
 ### Javascript
 
 ```jsx
-import React from "react";
+import * as React from "react";
 import { ReactP5Wrapper } from "react-p5-wrapper";
 
 function sketch(p5) {
@@ -93,7 +93,7 @@ first and only argument.
 #### Option 1: Declaring a sketch using the `P5CanvasInstance` type
 
 ```tsx
-import React from "react";
+import * as React from "react";
 import { P5CanvasInstance, ReactP5Wrapper } from "react-p5-wrapper";
 
 function sketch(p5: P5CanvasInstance) {
@@ -129,7 +129,7 @@ that is that the `p5` argument passed to the sketch function is auto-typed as a
 > in a regular `function` declaration.
 
 ```tsx
-import React from "react";
+import * as React from "react";
 import { ReactP5Wrapper, Sketch } from "react-p5-wrapper";
 
 const sketch: Sketch = p5 => {
@@ -285,7 +285,7 @@ export function App() {
 ### Using abstracted setup and draw functions
 
 ```jsx
-import React from "react";
+import * as React from "react";
 import { ReactP5Wrapper } from "react-p5-wrapper";
 
 function setup(p5) {
@@ -575,5 +575,5 @@ To build, watch and serve the examples which will also watch the component
 source, run:
 
 ```sh
-  pnpm start
+  pnpm preview
 ```