feat: add prettier config and test npm script

.github/workflows/ci.yml

@@ -0,0 +1,16 @@
+name: CI
+on: pull_request
+jobs:
+  ci:
+    name: CI
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+        with:
+          fetch-depth: 0
+      - uses: moonrepo/setup-moon-action@v1
+      - run: moon ci
+      - uses: 'moonrepo/run-report-action@v1'
+        if: success() || failure()
+        with:
+          access-token: ${{ secrets.MOON_GH_TOKEN }}

.gitignore

@@ -1,12 +1,13 @@
 dist/
 node_modules/
 npm-debug.log*
-yarn-debug.log*
-yarn-error.log*
 .nyc_output/
 .cache/
 .DS_Store
 # moon
 .moon/cache
 .moon/docker
 .parcel-cache
+
+# husky
+.husky/_

.gitmodules

@@ -1,6 +1,6 @@
 [submodule "packages/contrast-colors/SAPC-APCA"]
 	path = packages/contrast-colors/SAPC-APCA
 	url = [email protected]:Myndex/SAPC-APCA.git
-[submodule "packages/ui/src/c3"]
-	path = packages/ui/src/c3
+[submodule "docs/ui/src/c3"]
+	path = docs/ui/src/c3
 	url = [email protected]:StanfordHCI/c3.git

.husky/.gitignore

@@ -0,0 +1 @@
+_

.moon/toolchain.yml

@@ -1,5 +1,5 @@
 # https://moonrepo.dev/docs/config/toolchain
-$schema: "https://moonrepo.dev/schemas/toolchain.json"
+$schema: 'https://moonrepo.dev/schemas/toolchain.json'
 
 # Extend and inherit an external configuration file. Must be a valid HTTPS URL or file system path.
 # extends: './shared/toolchain.yml'
@@ -10,15 +10,15 @@ $schema: "https://moonrepo.dev/schemas/toolchain.json"
 node:
   # The version to use. Must be a semantic version that includes major, minor, and patch.
   # We suggest using the latest active LTS version: https://nodejs.org/en/about/releases
-  version: "20.0.0"
+  version: '^20.0.0'
 
   # The package manager to use when managing dependencies.
   # Accepts "npm" (default), "pnpm", or "yarn".
-  packageManager: "pnpm"
+  packageManager: 'pnpm'
 
   # The version of the package manager (above) to use.
   pnpm:
-    version: "8.15.1"
+    version: '8.15.4'
 
   # Add `node.version` as a constraint in the root `package.json` `engines`.
   addEnginesConstraint: true

.moon/workspace.yml

@@ -12,7 +12,7 @@ $schema: "https://moonrepo.dev/schemas/workspace.json"
 # path to the project folder as the map value. File paths are relative from the workspace root,
 # and cannot reference projects located outside the workspace boundary.
 projects:
-  - "apps/*"
+  - "docs/*"
   - "packages/*"
 
 # Configures the version control system to utilize within the workspace. A VCS

.prettierignore

@@ -0,0 +1,4 @@
+node_modules/
+*.min.js
+*.map
+*.snap

.prettierrc

@@ -0,0 +1,7 @@
+{
+  "tabWidth": 2,
+  "printWidth": 256,
+  "singleQuote": true,
+  "bracketSpacing": false,
+  "trailingComma": "none"
+}

README.md

@@ -84,27 +84,27 @@ Contributions are welcomed! Read the [Contributing Guide](./.github/CONTRIBUTING
 
 To get started [developing Leonardo UI](packages/ui#development):
 
-_Note: [Yarn](https://yarnpkg.com/) must be installed on your machine_
+_Note: [Pnpm](https://pnpm.io/installation) must be installed on your machine_
 
 ```sh
 # Install dependencies
-yarn install
+pnpm install
 
 # Change directory to Leonardo UI
-cd packages/ui
+cd docs/ui/
 
 # Run local server
-yarn dev
+pnpm dev
 ```
 
 To get started [developing Leonardo `contrast-colors` package](packages/contrast-colors#development):
 
 ```sh
 # From root, change directory to contrast-colors
-cd packages/contrast-colors
+cd packages/contrast-colors/
 
 # Run tests and watch for changes
-yarn dev
+pnpm dev
 ```
 
 Then, visit the live reloading web UIs here:

docs/ui/README.md

@@ -14,10 +14,10 @@ To get started developing Leonardo's UI:
 
 ```sh
 # Install dependencies
-yarn install
+pnpm install
 
 # Run local server
-yarn dev
+pnpm dev
 ```
 
 Then, visit the live reloading web UIs here:
@@ -28,30 +28,29 @@ http://localhost:1234/tools.html
 
 ### Cross-package development
 
-When making updates to `@adobe/leonardo-contrast-colors` while also developing the user interface, some issues may occur while linking the local dependancy. Follow these steps **every time you install or update an npm or yarn dependancy**:
+When making updates to `@adobe/leonardo-contrast-colors` while also developing the user interface, some issues may occur while linking the local dependency. 
+Follow these steps **every time you install or update an npm dependency**:
 
-1. Install your new dependancy
+1. Install your new dependency
 
 ```sh
-yarn install my-new-package
-// or
-npm install my-new-package
+pnpm add my-new-package
 ```
 
-2. Delete the cache
+2. Delete the cache (if it exists)
 
 ```
-leonardo/packages/ui/.cache
+rm -rf <leonardo-root>/.parcel-cache
 ```
 
 3. Link local Leonardo
 
 ```sh
-cd packages/contrast-colors
-npm link
-cd ..
-cd ui
-npm link @adobe/leonardo-contrast-colors
+cd packages/contrast-colors/
+pnpm link --global
+cd ../../
+cd docs/ui/
+pnpm link --global @adobe/leonardo-contrast-colors
 ```
 
 If you do not properly remove the cache and re-link the local `@adobe/leonardo-contrast-colors` package, things won't work right.

docs/ui/moon.yml

@@ -1,3 +1,3 @@
-$schema: "https://moonrepo.dev/schemas/project.json"
+$schema: 'https://moonrepo.dev/schemas/project.json'
 dependsOn:
   - contrast-colors

docs/ui/package.json

@@ -6,16 +6,16 @@
   "repository": "[email protected]:adobe/leonardo.git",
   "author": "Nate Baldwin <[email protected]>",
   "scripts": {
-    "serve": "npx parcel src/index.html src/theme.html src/scales.html src/tools.html src/demo.html --no-hmr",
+    "serve": "pnpm parcel src/index.html src/theme.html src/scales.html src/tools.html src/demo.html --no-hmr",
     "clean": "rm -rf dist/*",
     "dev": "pnpm copyIcons && pnpm serve",
     "copyIcons": "mkdir -p dist && pnpm copyWorkflowIcons && pnpm copyUIIcons",
     "copyWorkflowIcons": "cp -r node_modules/@adobe/spectrum-css-workflow-icons/dist/spectrum-icons.svg dist/",
     "copyUIIcons": "cp -r node_modules/@spectrum-css/icon/dist/spectrum-css-icons.svg dist/",
     "copyCNAME": "cp -r src/CNAME dist/CNAME",
     "postPublish": "pnpm deploySite",
-    "buildSite": "npx parcel build --no-optimize src/index.html src/scales.html src/tools.html src/theme.html src/demo.html --public-url ./ && pnpm copyCNAME && pnpm copyIcons",
-    "deploySite": "pnpm clean && pnpm buildSite && npx gh-pages -d dist"
+    "buildSite": "pnpm parcel build --no-optimize src/index.html src/scales.html src/tools.html src/theme.html src/demo.html --public-url ./ && pnpm copyCNAME && pnpm copyIcons",
+    "deploySite": "pnpm clean && pnpm buildSite && pnpm gh-pages -d dist"
   },
   "keywords": [
     "accessibility",