First commit

.eslintignore

@@ -0,0 +1,2 @@
+*.css
+*.scss

.eslintrc.json

@@ -0,0 +1,36 @@
+{
+    "extends": [
+        "eslint:recommended",
+        "plugin:react/recommended",
+        "plugin:@typescript-eslint/recommended",
+        "prettier/@typescript-eslint",
+        "plugin:prettier/recommended"
+    ],
+    "plugins": ["react", "@typescript-eslint", "prettier"],
+    "env": {
+        "browser": true,
+        "jasmine": true,
+        "jest": true,
+        "es6": true
+    },
+    "rules": {
+        "prettier/prettier": ["error"],
+        "@typescript-eslint/array-type": "off",
+        "@typescript-eslint/camelcase": "off",
+        "@typescript-eslint/explicit-function-return-type": "off",
+        "@typescript-eslint/explicit-member-accessibility": "off",
+        "@typescript-eslint/no-explicit-any": "off",
+        "@typescript-eslint/no-var-requires": "off",
+        "react/no-unescaped-entities": "off"
+    },
+    "settings": {
+        "react": {
+            "pragma": "React",
+            "version": "detect"
+        }
+    },
+    "parser": "@typescript-eslint/parser",
+    "parserOptions": {
+        "project": "./tsconfig.json"
+    }
+}

.github/dependabot.yml

@@ -0,0 +1,11 @@
+# To get started with Dependabot version updates, you'll need to specify which
+# package ecosystems to update and where the package manifests are located.
+# Please see the documentation for all configuration options:
+# https://help.github.com/github/administering-a-repository/configuration-options-for-dependency-updates
+
+version: 2
+updates:
+  - package-ecosystem: "npm" # See documentation for possible values
+    directory: "/" # Location of package manifests
+    schedule:
+      interval: "daily"

.github/workflows/build.yml

@@ -0,0 +1,26 @@
+name: Build
+on: [push, pull_request]
+env:
+  CI: true
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [12.x]
+    steps:
+    - uses: actions/checkout@v2
+    - name: Use Node.js (NPMJS) ${{ matrix.node-version }}
+      uses: actions/setup-node@v1
+      with:
+        node-version: ${{ matrix.node-version }}
+        registry-url: 'https://registry.npmjs.org'
+    - name: Install dependencies
+      run: npm ci
+    - name: Test
+      run: npm test
+    - name: Code coverage reporting
+      uses: coverallsapp/github-action@master
+      with:
+        github-token: ${{ secrets.GITHUB_TOKEN }}
+        path-to-lcov: ./js-coverage/lcov.info

.github/workflows/publish.yml

@@ -0,0 +1,81 @@
+name: Publish
+on:
+  release:
+    types:
+      - created
+env:
+  CI: true
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    strategy:
+      matrix:
+        node-version: [12.x]
+    steps:
+    - uses: actions/checkout@v2
+    - name: Get the version
+      id: get_version
+      run: echo ::set-env name=RELEASE_VERSION::${GITHUB_REF/refs\/tags\//}
+    - name: Release version
+      run: |
+        echo $RELEASE_VERSION
+        echo ${{ env.RELEASE_VERSION }}
+    - name: Use Node.js (NPMJS) ${{ matrix.node-version }}
+      uses: actions/setup-node@v1
+      with:
+        node-version: ${{ matrix.node-version }}
+        always-auth: true
+        registry-url: 'https://registry.npmjs.org'
+      env:
+        NODE_AUTH_TOKEN: ${{secrets.NODE_AUTH_TOKEN}}
+    - name: Install dependencies
+      run: npm ci
+    - name: Build
+      run: npm run build:npm --if-present
+    - name: Publish NPMJS @fdmg
+      if: contains(github.ref, 'canary') == false
+      run: npm publish dist
+      env:
+        NODE_AUTH_TOKEN: ${{secrets.NODE_AUTH_TOKEN}}
+      continue-on-error: true
+    - name: Publish NPMJS @fdmg (canary)
+      if: contains(github.ref, 'canary')
+      run: npm publish dist --tag next
+      env:
+        NODE_AUTH_TOKEN: ${{secrets.NODE_AUTH_TOKEN}}
+      continue-on-error: true
+    - name: Use specific package.json for GHP
+      run: cp ./dist/package.github.json ./dist/package.json
+    - name: Publish NPMJS @fdmediagroep
+      if: contains(github.ref, 'canary') == false
+      run: npm publish dist
+      env:
+        NODE_AUTH_TOKEN: ${{secrets.NODE_AUTH_TOKEN}}
+      continue-on-error: true
+    - name: Publish NPMJS @fdmediagroep (canary)
+      if: contains(github.ref, 'canary')
+      run: npm publish dist --tag next
+      env:
+        NODE_AUTH_TOKEN: ${{secrets.NODE_AUTH_TOKEN}}
+      continue-on-error: true
+    - name: Use Node.js (GitHub) ${{ matrix.node-version }}
+      uses: actions/setup-node@v1
+      with:
+        always-auth: true
+        registry-url: 'https://npm.pkg.github.com'
+        scope: '@FDMediagroep'
+      env:
+        NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+    - name: Publish GPR
+      if: contains(github.ref, 'canary') == false
+      run: npm publish dist
+      env:
+        NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      continue-on-error: true
+    - name: Publish GPR (canary)
+      if: contains(github.ref, 'canary')
+      run: npm publish dist --tag next
+      env:
+        NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+      continue-on-error: true
+

.gitignore

@@ -0,0 +1,9 @@
+.env*
+.next
+.now
+.vscode
+analyzer
+dist*
+out/
+js-coverage
+node_modules

.npmignore

@@ -0,0 +1,22 @@
+__tests__
+.env*
+.gitignore
+.github
+.next
+.now
+.npmignore
+.prettierignore
+analyzer
+Explain.d.ts
+js-coverage
+Menu.d.ts
+next-env.d.ts
+next.config.json
+now.json
+package-lock.json
+public
+rewrites.js
+src
+Themes.d.ts
+tsconfig.*
+webpack.*

.prettierignore

@@ -0,0 +1 @@
+*.yml

.prettierrc.json

@@ -0,0 +1,8 @@
+{
+    "arrowParens": "always",
+    "trailingComma": "es5",
+    "tabWidth": 4,
+    "semi": true,
+    "singleQuote": true,
+    "endOfLine": "auto"
+}

CONTRIBUTING.md

@@ -0,0 +1,63 @@
+# Contributing
+
+How nice of you to swing by!
+This must mean that you're serious about thinking to contribute to our little OSS project.
+Let's get acquainted by allowing us to show you how we contribute to this project ourselves.
+By following these tips and guidelines you'll find that you can contribute more easily.
+
+## Adding components
+
+1. Add your component under `/src/components/<your component>/<component>.tsx`.
+1. Add your component page `/src/pages/<page name>.tsx`.
+1. Add a link to your component page in the Menu component `/src/components/Menu.tsx`.
+   E.g.: `<Link href="/input/radio"><a>Input Radio</a></Link>`
+1. Import and export your component in `/src/components/main.tsx`.
+   E.g.: `export { Radio } from './input/Radio';`
+1. Add any synonyms applicable for your component in `/rewrites.js`.
+    - Matching URL's will be directed to your component page
+      E.g.: `{source: '/(input/gaga|input/googoo)', destination: '/input/radio'}`
+1. Add entry to your component in `/webpack.config.js`.
+    - This will ensure that your component will be exported as an atomic component. Users can choose to only import your component and styles without the bloat of other components.
+      E.g.: `'/input/Radio': ['./src/components/input/Radio.tsx']`
+1. Add unit test for your component under `/__tests__/components/<component>.test.tsx`.
+1. Update README.md under heading `Components` with an example of how to use your component.
+
+## Release tagging
+
+Tagging the repository on GitHub with a release will automatically start the GitHub Actions. It currently consists of 2 workflows:
+
+* build
+* release
+
+After the build has completed the release will be run which does the actual packaging of the Component Library and publishes it to both NPMJS and GitHub Packages.
+
+Versioning convention:
+
+`v{major}.{minor}.{patch}[canary.{patch}]`
+
+Examples:
+
+* v0.3.5
+* v1.2.2
+* v1.2.3
+* v1.2.3-canary.1
+
+Canary releases are pre-releases. So version `v1.2.3-canary.1` is considered as an older release than `v1.2.3`. Canary releases are useful if you want to test it in your own application without risking other users installing it by mistake.
+
+With NPM a developer typically installs node modules like so:
+
+`npm i @fdmg/design-system`
+
+or
+
+`npm i @fdmg/design-system@latest`
+
+Let's say we haven't released `v1.2.3` yet then both these commands would automatically install `v1.2.2` and not `v1.2.3-canary.1`. Even though the latter has been packaged and released later than `v1.2.2`.
+
+In order to install `v1.2.3-canary.1` the developer could use the following commands:
+
+`npm i @fdmg/design-system@v1.2.3-canary.1`
+
+or
+
+`npm i @fdmg/design-system@next`