chore(examples): move to demo subdir and eliminate rewired (pmndrs#1305)

* chore(examples): move to demo subdir and eliminate rewired

* fix some paths

* run prettier

* use v4

.github/workflows/lint-and-type.yml

@@ -17,7 +17,7 @@ jobs:
           cache: yarn
       - run: git fetch --depth=1 origin +refs/tags/*:refs/tags/*
       - run: yarn install --frozen-lockfile --check-files
-      - run: cd examples && yarn install --frozen-lockfile --check-files
+      - run: cd examples/demo && yarn install --frozen-lockfile --check-files
       - name: Prettier
         run: yarn prettier:ci
       - name: Lint

examples/package.json → examples/demo/package.json

@@ -1,9 +1,8 @@
 {
-  "name": "example",
+  "name": "demo",
   "version": "0.1.0",
   "private": true,
   "dependencies": {
-    "@babel/runtime": "^7.18.9",
     "@react-three/drei": "^9.17.1",
     "@react-three/fiber": "^8.1.0",
     "@react-three/postprocessing": "^2.4.6",
@@ -13,17 +12,19 @@
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
     "three": "^0.141.0",
-    "zustand": "^3.0.0"
+    "zustand": "^4.0.0"
   },
   "scripts": {
-    "start": "react-app-rewired start",
-    "build": "react-app-rewired build",
-    "build:analyze": "BUNDLE_ANALYZE=true yarn build",
-    "test": "react-app-rewired test",
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
     "eject": "react-scripts eject"
   },
   "eslintConfig": {
-    "extends": "react-app"
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ]
   },
   "browserslist": {
     "production": [
@@ -46,13 +47,9 @@
     "printWidth": 120
   },
   "devDependencies": {
-    "@react-three/babel": "^0.1.1",
-    "@testing-library/jest-dom": "^5.11.0",
-    "@testing-library/react": "^10.4.3",
-    "@testing-library/user-event": "^12.0.11",
-    "customize-cra": "^1.0.0",
-    "react-app-rewired": "^2.2.1",
-    "react-scripts": "^5.0.1",
-    "webpack-bundle-analyzer": "^4.5.0"
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^13.4.0",
+    "@testing-library/user-event": "^13.5.0",
+    "react-scripts": "^5.0.1"
   }
 }

examples/src/components/CopyButton.js → examples/demo/src/components/CopyButton.js

@@ -1,8 +1,8 @@
 import { useState, useCallback, useRef } from 'react'
 import { copyToClipboard } from '../utils/copy-to-clipboard'
 
-/* 
-Isolated logic for the entire copy functionality instead 
+/*
+Isolated logic for the entire copy functionality instead
 of a separate button component and with the added utility
 */
 export default function CopyButton({ code, ...props }) {

examples/src/components/Details.js → examples/demo/src/components/Details.js

@@ -3,7 +3,11 @@ export default function Details() {
     <>
       <a href="https://github.com/pmndrs/zustand" className="top-right" children="Github" />
       <div className="bottom">
-        <a href="https://github.com/pmndrs/zustand/tree/main/examples" className="bottom-right" children="<Source />" />
+        <a
+          href="https://github.com/pmndrs/zustand/tree/main/examples/demo"
+          className="bottom-right"
+          children="<Source />"
+        />
         <a
           href="https://www.instagram.com/tina.henschel/"
           className="bottom-left"