Main pnpm

.github/workflows/gh-pages.yaml

@@ -17,10 +17,10 @@ jobs:
             group: ${{ github.workflow }}-${{ github.ref }}
         steps:
             - name: ⬇️ Checkout repo
-              uses: actions/checkout@v3
+              uses: actions/checkout@v4
 
             - name: ⎔ Setup node
-              uses: actions/setup-node@v3
+              uses: actions/setup-node@v4
               with:
                   node-version: 20
 
@@ -33,13 +33,13 @@ jobs:
 
             - name: 🥖 Build the React App
               run: |
-                  yarn
-                  yarn build --filter demo
+                  pnpm install
+                  pnpm build --filter @crystallize/demo-app
 
             - name: 🍿 Deploy
               uses: peaceiris/actions-gh-pages@v3
               if: ${{ github.ref == 'refs/heads/main' }}
               with:
                   github_token: ${{ secrets.GITHUB_TOKEN }}
-                  publish_dir: ./apps/demo/build
+                  publish_dir: ./apps/demo/dist
                   keep_files: true

.github/workflows/main-ci.yaml

@@ -12,11 +12,10 @@ jobs:
         runs-on: ubuntu-latest
         steps:
             - name: ⬇️ Checkout repo
-              uses: actions/checkout@v3
+              uses: actions/checkout@v4
 
-            - uses: actionsx/prettier@v2
+            - uses: actionsx/prettier@v3
               with:
-                  # prettier CLI arguments.
                   args: --check .
 
     test:
@@ -31,81 +30,51 @@ jobs:
             TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
         steps:
             - name: 🛑 Cancel Previous Runs
-              uses: styfle/cancel-workflow-action@0.9.1
+              uses: styfle/cancel-workflow-action@0.12.1
 
             - name: ⬇️ Checkout repo
-              uses: actions/checkout@v3
+              uses: actions/checkout@v4
 
             - name: ⎔ Setup node
-              uses: actions/setup-node@v3
+              uses: actions/setup-node@v4
               with:
                   node-version: ${{ matrix.node }}
 
+            - name: ⎔ Set up pnpm
+              uses: pnpm/action-setup@v4
+              with:
+                  version: 9.5.0
+
             - name: 📥 Download deps
               run: |
                   echo ::group::..:: Mono Repo Tests ::..
-                  yarn
+                  pnpm install
                   echo ::endgroup::
 
             - name: 🏄 Run the tests
               run: |
                   echo ::group::..:: Mono Repo Tests ::..
-                  yarn test
+                  pnpm run test
                   echo ::endgroup::
-
-    builds:
-        name: 👀 Test Standalone Builds
-        runs-on: ubuntu-latest
-        needs: [lint]
-        strategy:
-            matrix:
-                node: [18, 20]
-        env:
-            TURBO_TOKEN: ${{ secrets.TURBO_TOKEN }}
-            TURBO_TEAM: ${{ secrets.TURBO_TEAM }}
-        steps:
-            - name: 🛑 Cancel Previous Runs
-              uses: styfle/[email protected]
-
-            - name: ⬇️ Checkout repo
-              uses: actions/checkout@v3
-
-            - name: ⎔ Setup node
-              uses: actions/setup-node@v3
-              with:
-                  node-version: ${{ matrix.node }}
-
-            - name: 📥 Download deps and builds folder by folder
-              run: |
-                  rm -f package.json
-                  rm -f yarn.lock
-                  rm -rf node_modules
-                  for COMPONENT in `ls components`; do
-                      if [ -d "components/${COMPONENT}" ]; then
-                        echo ::group::..:: ${COMPONENT} ::..
-                        cd components/${COMPONENT} && yarn install && yarn build && cd -;
-                        echo ::endgroup::
-                      fi  
-                  done
     sync:
         name: 🍿 Sync Doc to Crystallize
         if: github.event_name == 'push' && github.ref_name == 'main'
         runs-on: ubuntu-latest
-        needs: [lint, test, builds]
+        needs: [lint, test]
         steps:
             - name: 🛑 Cancel Previous Runs
-              uses: styfle/[email protected]
+              uses: styfle/[email protected]
+
+            - name: ⬇️ Checkout repo
+              uses: actions/checkout@v4
 
             - name: ⎔ Setup node
-              uses: actions/setup-node@v3
+              uses: actions/setup-node@v4
               with:
                   node-version: 20
 
-            - name: ⬇️ Checkout repo
-              uses: actions/checkout@v3
-
             - name: 📥 Download deps
-              run: yarn install && yarn build
+              run: pnpm install && pnpm run build
 
             - name: 🚀 Sync it!
               env:

.vscode/settings.json

@@ -2,5 +2,45 @@
     "editor.detectIndentation": false,
     "editor.tabSize": 4,
     "editor.formatOnSave": true,
-    "editor.formatOnPaste": true
+    "editor.formatOnPaste": true,
+    "typescript.suggest.paths": true,
+    "files.exclude": {
+        "**/.git": true,
+        "**/.svn": true,
+        "**/.hg": true,
+        "**/CVS": true,
+        "**/.DS_Store": true,
+        "**/Thumbs.db": true,
+        "**/node_modules": true,
+        "**/build": true,
+        "**/dist": true,
+        "**/.turbo": true,
+        "**/.cache": true
+    },
+    "files.associations": {},
+    "todo-tree.general.tags": ["@todo:", "@fixme:", "@bug:"],
+    "todo-tree.general.statusBar": "top three",
+    "todo-tree.tree.groupedByTag": true,
+    "todo-tree.general.statusBarClickBehaviour": "reveal",
+    "todo-tree.general.tagGroups": {
+        "TODOs": ["@todo:"],
+        "BUGs": ["@fixme:", "@bug:"]
+    },
+    "todo-tree.highlights.customHighlight": {
+        "TODOs": {
+            "icon": "flame",
+            "foreground": "#ff9900"
+        },
+        "BUGs": {
+            "icon": "bug",
+            "foreground": "#ff0000"
+        }
+    },
+    "favorites.resources": [
+        {
+            "filePath": "domain",
+            "group": "Default"
+        }
+    ],
+    "favorites.sortOrder": "ASC"
 }

Makefile

@@ -25,27 +25,18 @@ clean: ## Clean non-essential files
 			rm -rf components/$${COMPONENT}/dist; \
 			rm -rf components/$${COMPONENT}/build; \
 			rm -f components/$${COMPONENT}/yarn.lock; \
+			rm -f components/$${COMPONENT}/pnpm-lock.yaml; \
 		fi; \
 	done
 
 .PHONY: codeclean
 codeclean: ## Code Clean
-	@yarn prettier --write .
+	@pnpm prettier --write .
 
 .PHONY: tests
 tests: ## Run the tests
 	@echo " ..:: Mono Repo Testing ::.."
-	@yarn test
-	@yarn prettier --check .
-
-.PHONY: bump
-bump: ## Bump all components
-	@for COMPONENT in $(shell ls components); do \
-		if [ -d "components/$${COMPONENT}" ]; then \
-			echo " ..:: Bumping $${COMPONENT} ::.."; \
-			cd components/$${COMPONENT} && yarn bump $(VERSION) && cd - ;\
-		fi; \
-	done
+	@pnpm test
 
 .PHONY: add-component
 add-component: ## Create an empty structure for a new Component
@@ -71,4 +62,4 @@ add-component-compliance-files: ## Add the compliance files into all the compone
 .PHONY: start-demo-app
 start-demo-app: ## Start Demo App
 	@echo " ..:: Starting Demo App ::.."
-	@cd docs/react-app && npm start
+	@pnpm run demo

apps/demo/.eslintrc.cjs

@@ -0,0 +1,11 @@
+module.exports = {
+    root: true,
+    env: { browser: true, es2020: true },
+    extends: ['eslint:recommended', 'plugin:@typescript-eslint/recommended', 'plugin:react-hooks/recommended'],
+    ignorePatterns: ['dist', '.eslintrc.cjs'],
+    parser: '@typescript-eslint/parser',
+    plugins: ['react-refresh'],
+    rules: {
+        'react-refresh/only-export-components': ['warn', { allowConstantExport: true }],
+    },
+};

apps/demo/.gitignore

@@ -1,26 +1,24 @@
-# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
-
-# dependencies
-/node_modules
-/.pnp
-.pnp.js
-
-# testing
-/coverage
-
-# production
-/build
-
-# misc
-.DS_Store
-.env.local
-.env.development.local
-.env.test.local
-.env.production.local
-
+# Logs
+logs
+*.log
 npm-debug.log*
 yarn-debug.log*
 yarn-error.log*
+pnpm-debug.log*
+lerna-debug.log*
 
-# we don't want the lock file for this one
-package-lock.json
+node_modules
+dist
+dist-ssr
+*.local
+
+# Editor directories and files
+.vscode/*
+!.vscode/extensions.json
+.idea
+.DS_Store
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw?

apps/demo/index.html

@@ -0,0 +1,13 @@
+<!doctype html>
+<html lang="en">
+    <head>
+        <meta charset="UTF-8" />
+        <link rel="icon" type="image/svg+xml" href="/vite.svg" />
+        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+        <title>Crystallize Libraries Demo App</title>
+    </head>
+    <body>
+        <div id="root"></div>
+        <script type="module" src="/src/main.tsx"></script>
+    </body>
+</html>