Merge pull request #10 from com-pas/restructuring_docops

feat: restructure of compas docops

.github/workflows/test-on-pr-branch.yml

@@ -11,13 +11,18 @@ jobs:
       - name: Set up Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: '16'
+          node-version: "16"
 
       - name: Install dependencies
-        run: npm ci
+        run: |
+          npm i @nx/nx-linux-x64-gnu
+          npm ci
 
       - name: Install playwright browsers
         run: npx playwright install --with-deps
 
-      - name: Run tests
-        run: npm run-script test
+      - name: Build project
+        run: npm run build
+
+      - name: Run tests for compas-docops
+        run: npx lerna run test

.github/workflows/test.yml

@@ -11,16 +11,22 @@ jobs:
       - name: Set up Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: '16'
+          node-version: "16"
 
       - name: Install dependencies
-        run: npm ci
+        run: |
+          npm i @nx/nx-linux-x64-gnu
+          npm ci
 
       - name: Install playwright browsers
         run: npx playwright install --with-deps
 
-      - name: Run unit tests
-        run: npm run-script test:unit
+      - name: Build project
+        run: npm run build
+
+      - name: Run unit tests for compas-docops
+        run: npx lerna run test:unit
+
   visual:
     runs-on: ubuntu-latest
     steps:
@@ -30,24 +36,31 @@ jobs:
       - name: Set up Node.js
         uses: actions/setup-node@v3
         with:
-          node-version: '16'
+          node-version: "16"
 
       - name: Install dependencies
-        run: npm ci
+        run: |
+          npm i @nx/nx-linux-x64-gnu
+          npm ci
 
       - name: Install playwright browsers
         run: npx playwright install --with-deps
 
-      - name: Run visual test
+      - name: Build project
+        run: npm run build
+
+      - name: Run visual test for compas-open
+        working-directory: ./components/compas-open
         run: npm run-script test:visual
 
-      - name: Update screenshots
+      - name: Update screenshots for compas-open
         if: failure()
+        working-directory: ./components/compas-open
         run: npm run test:update
 
       - name: Commit changes
         if: failure()
         uses: EndBug/add-and-commit@v9
         with:
-          message: 'ci: update screenshots'
-          add: 'screenshots'
+          message: "ci: update screenshots"
+          add: "components/compas-open/screenshots"

.gitignore

@@ -1,28 +1,3 @@
-## editors
-/.idea
-/.vscode
-
-## system files
-.DS_Store
-
-## npm
-/node_modules/
-/npm-debug.log
-
-## testing
-/coverage/
-
-## failed screenshots
-/screenshots/*/failed/
-
-## temp folders
-/.tmp/
-
-# build
-/_site/
-/dist/
-/out-tsc/
-/.rollup.cache/
-
-storybook-static
-custom-elements.json
+node_modules/
+**/.tsbuildinfo
+lerna-debug.log

README.md

@@ -1,81 +0,0 @@
-# \<compas-open>
-
-This webcomponent follows the [open-wc](https://github.com/open-wc/open-wc) recommendation.
-
-## Installation
-
-```bash
-npm i compas-open
-```
-
-## Usage
-
-```html
-<script type="module">
-  import 'compas-open';
-</script>
-
-<compas-open></compas-open>
-```
-
-## Linting and formatting
-
-To scan the project for linting and formatting errors, run
-
-```bash
-npm run lint
-```
-
-To automatically fix linting and formatting errors, run
-
-```bash
-npm run format
-```
-
-## Testing with Web Test Runner
-
-To execute a single test run:
-
-```bash
-npm run test
-```
-
-To run the tests in interactive watch mode run:
-
-```bash
-npm run test:watch
-```
-
-## Demoing with Storybook
-
-To run a local instance of Storybook for your component, run
-
-```bash
-npm run storybook
-```
-
-To build a production version of Storybook, run
-
-```bash
-npm run storybook:build
-```
-
-## Tooling configs
-
-For most of the tools, the configuration is in the `package.json` to reduce the amount of files in your project.
-
-If you customize the configuration a lot, you can consider moving them to individual files.
-
-## Local Demo with `web-dev-server`
-
-```bash
-npm start
-```
-
-To run a local development server that serves the basic demo located in `demo/index.html`
-
-
-
-
-
-&copy; 1970 THE AUTHORS

.editorconfig → components/compas-loading/.editorconfig

@@ -26,4 +26,4 @@ indent_size = 2
 [*.{html,js,md}]
 block_comment_start = /**
 block_comment = *
-block_comment_end = */
+block_comment_end = */

.eslintrc → components/compas-loading/.eslintrc

@@ -13,4 +13,4 @@
   "plugins": ["@typescript-eslint"],
   "root": true,
   "ignorePatterns": ["**/*.html", "*.config.js"]
-}
+}

components/compas-loading/.gitignore

@@ -0,0 +1,26 @@
+## editors
+/.idea
+/.vscode
+
+## system files
+.DS_Store
+
+## npm
+/node_modules/
+/npm-debug.log
+
+## local debug
+/.npmrc
+
+## temp folders
+/.tmp/
+
+# build
+/_site/
+/dist/
+/out-tsc/
+/.tsbuildinfo
+
+custom-elements.json
+
+.rollup.cache/

components/compas-loading/.npmignore

@@ -0,0 +1,22 @@
+## editors
+/.idea
+/.vscode
+
+## system files
+.DS_Store
+
+## npm
+/node_modules/
+/npm-debug.log
+
+## local debug
+/.npmrc
+
+## temp folders
+/.tmp/
+
+# build
+/_site/
+/out-tsc/
+
+custom-elements.json

components/compas-loading/package.json

@@ -0,0 +1,64 @@
+{
+  "name": "@com-pas/compas-loading",
+  "description": "Webcomponent compas-loading following open-wc recommendations",
+  "license": "Apache-2.0",
+  "author": "CoMPAS",
+  "version": "0.0.0",
+  "browser": "./dist/CompasLoading.js",
+  "module": "./dist/CompasLoading.js",
+  "types": "./dist/CompasLoading.d.ts",
+  "exports": {
+    ".": "./dist/CompasLoading.js",
+    "./compas-loading.js": "./dist/compas-loading.js"
+  },
+  "type": "module",
+  "scripts": {
+    "analyze": "cem analyze",
+    "start": "tsc && concurrently -k -r \"tsc --watch --preserveWatchOutput\" \"wds\"",
+    "build": "tsc && npm run analyze -- --exclude dist",
+    "prepublish": "tsc && npm run analyze -- --exclude dist",
+    "lint": "eslint --ext .ts,.html . --ignore-path .gitignore && prettier \"**/*.ts\" --check --ignore-path .gitignore",
+    "format": "eslint --ext .ts,.html . --fix --ignore-path .gitignore && prettier \"**/*.ts\" --write --ignore-path .gitignore",
+    "clean": "rimraf .tsbuildinfo custom-elements.json dist"
+  },
+  "dependencies": {
+    "@material/mwc-list": "^0.27.0",
+    "lit": "^2.7.4",
+    "lit-element": "2.5.1",
+    "lit-html": "1.4.1"
+  },
+  "devDependencies": {
+    "@babel/preset-env": "^7.16.4",
+    "@custom-elements-manifest/analyzer": "^0.4.17",
+    "@open-wc/building-rollup": "^2.0.2",
+    "@open-wc/eslint-config": "^9.2.1",
+    "@open-wc/testing": "^3.1.6",
+    "@rollup/plugin-typescript": "^9.0.2",
+    "@rollup/plugin-babel": "^5.3.0",
+    "@rollup/plugin-node-resolve": "^13.0.6",
+    "@typescript-eslint/eslint-plugin": "^5.48.0",
+    "@typescript-eslint/parser": "^5.48.0",
+    "@web/dev-server": "^0.1.34",
+    "@web/dev-server-storybook": "^0.5.4",
+    "@web/rollup-plugin-html": "^1.11.0",
+    "@web/rollup-plugin-import-meta-assets": "^1.0.7",
+    "@web/test-runner": "^0.14.0",
+    "babel-plugin-template-html-minifier": "^4.1.0",
+    "cem-plugin-readme": "^0.1.4",
+    "concurrently": "^5.3.0",
+    "deepmerge": "^4.2.2",
+    "eslint": "^8.31.0",
+    "eslint-config-prettier": "^8.3.0",
+    "husky": "^4.3.8",
+    "lint-staged": "^10.5.4",
+    "prettier": "^2.4.1",
+    "sinon": "^11.1.2",
+    "rimraf": "^3.0.2",
+    "rollup": "^2.60.0",
+    "rollup-plugin-esbuild": "^5.0.0",
+    "rollup-plugin-workbox": "^6.2.0",
+    "tslib": "^2.3.1",
+    "typescript": "^4.9.2"
+  },
+  "customElements": "custom-elements.json"
+}

components/compas-loading/src/CompasLoading.ts

@@ -0,0 +1,4 @@
+import { CompasLoadingElement } from "./compas-loading.js";
+
+window.customElements.define("compas-loading", CompasLoadingElement);
+export { CompasLoadingElement };

components/compas-loading/src/compas-loading.ts

@@ -0,0 +1,15 @@
+import { html, LitElement, TemplateResult, property } from "lit-element";
+import "@material/mwc-list";
+import "@material/mwc-list/mwc-list-item";
+
+export class CompasLoadingElement extends LitElement {
+  @property({ type: String }) message?: string;
+
+  render(): TemplateResult {
+    return html`
+      <mwc-list>
+        <mwc-list-item><i>${this.message ?? "Loading..."}</i></mwc-list-item>
+      </mwc-list>
+    `;
+  }
+}

tsconfig.json → components/compas-loading/tsconfig.json

@@ -10,14 +10,14 @@
     "allowSyntheticDefaultImports": true,
     "experimentalDecorators": true,
     "importHelpers": true,
-    "allowJs": true,
     "skipLibCheck": true,
     "outDir": "dist",
     "sourceMap": true,
     "inlineSources": true,
-    "rootDir": "./",
+    "rootDir": "./src",
     "declaration": true,
-    "incremental": true
+    "incremental": true,
+    "tsBuildInfoFile": ".tsbuildinfo"
   },
-  "include": ["**/*.ts"]
-}
+  "include": ["src/*.ts"]
+}