Initial commit

.dockerignore

@@ -0,0 +1 @@
+node_modules

.eslintignore

@@ -0,0 +1,8 @@
+node_modules
+dist
+dist-storybook
+coverage
+docs
+kubernetes
+public
+site/static

.eslintrc.js

@@ -0,0 +1,77 @@
+module.exports = {
+  extends: [
+    'airbnb-typescript',
+    'plugin:prettier/recommended',
+    'prettier/@typescript-eslint',
+  ],
+  plugins: ['cup', 'header', 'prettier', 'react-hooks'],
+  env: {
+    jest: true,
+  },
+  globals: {
+    page: true,
+    browser: true,
+    context: true,
+    cy: true,
+    Cypress: true,
+  },
+  rules: {
+    'react/prop-types': 'off',
+    'react/forbid-prop-types': 'error',
+    'react-hooks/rules-of-hooks': 'error',
+    'react-hooks/exhaustive-deps': 'warn',
+    'import/no-extraneous-dependencies': [
+      'error',
+      {optionalDependencies: false, devDependencies: true},
+    ],
+    'import/prefer-default-export': 'off',
+    'arrow-body-style': ['error', 'as-needed'],
+    'react/jsx-one-expression-per-line': 'off',
+    '@typescript-eslint/no-explicit-any': 'error',
+    'import/no-unresolved': ['error', {ignore: ['csstype']}],
+    'prettier/prettier': [
+      'error',
+      {
+        singleQuote: true,
+        trailingComma: 'all',
+        bracketSpacing: false,
+      },
+    ],
+  },
+  overrides: [
+    {
+      files: ['*.js'],
+      rules: {
+        '@typescript-eslint/no-var-requires': 'off',
+      },
+    },
+    {
+      files: ['*.tsx'],
+      env: {
+        browser: true,
+      },
+    },
+    {
+      files: ['*.test.ts', '*.test.tsx'],
+      rules: {
+        '@typescript-eslint/no-explicit-any': 'off',
+      },
+    },
+    {
+      files: ['src/!(test)/*.ts', 'src/!(test)/*.tsx'],
+      rules: {
+        'import/no-extraneous-dependencies': [
+          'error',
+          {optionalDependencies: false, devDependencies: false},
+        ],
+      },
+    },
+    {
+      files: ['site/**/*.ts', 'site/**/*.tsx'],
+      rules: {
+        'react/display-name': 'off',
+        'import/no-unresolved': ['error', {ignore: ['newskit', 'csstype', '@components/page-title']}],
+      },
+    },
+  ],
+};

.github/CODEOWNERS

@@ -0,0 +1,3 @@
+# Learn how to add code owners here:
+# https://help.github.com/en/articles/about-code-owners
+*                 @nialloc9 @jps @lhaggar @parkjh @webondevices @mdcruz @Xin00163 @todorRadkov @pdimova

.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,43 @@
+[PPDSC-XXX](https://nidigitalsolutions.jira.com/browse/PPDSC-XXX)
+
+**What**
+<!---
+1. Background - why this is needed
+2. What did you do
+3. What does the reviewers should expect
+--->
+
+**I have:**
+ - [ ] Written unit tests against changes
+ - [ ] Written end to end/visual regression tests against changes
+ - [ ] All the linting and tests are passing
+ - [ ] Updated relevant documentation
+ - [ ] Discussed with QA and/or design about any visual changes
+ - [ ] Completed manual testing tasks outline [here](../docs/testing.md#manual-checks)
+
+<!---
+Below sections are optional
+--->
+
+**Before**
+<!--- Drag and Drop your screenshot's here --->
+
+**After:**
+<!--- Drag and Drop your screenshot's here --->
+
+**Who should review this PR**
+<!---
+If you know someone is a domain expert for your PR,
+someone who is deeply involved in the story,
+ask them explicitly to review the PR.
+--->
+
+**How to test**
+<!--
+If it's not immediately obvious how to test this PR, give instructions.
+It's mandatory to update README.MD or development documentation if existing test strategy had changed.
+-->
+
+<!--
+More info about raising an good PR: https://nidigitalsolutions.jira.com/wiki/spaces/NPP/pages/1319370846/Pull+Request
+-->

.gitignore

@@ -0,0 +1,34 @@
+node_modules
+.DS_STORE
+/.eslintcache
+build
+*.log
+dist
+stats.html
+storybook-static
+coverage
+/e2e/dist/index.js
+.vscode
+.idea
+*.sublime-project
+*.sublime-workspace
+.fusion
+reports
+vrt/latest
+vrt/diff
+.cache
+site/.next
+site/posts.js
+public
+.*code
+.terraform
+.webpack
+artifacts
+tfplan
+*.todo
+*.history
+*.tgz
+*.DS_Store
+cypress/screenshots/
+__diff_output__/
+dist-storybook

.markdownlint.json

@@ -0,0 +1,7 @@
+{
+  "MD004": {
+    "style": "asterisk"
+  },
+  "MD033": false,
+  "line-length": false
+}

.npmignore

@@ -0,0 +1,2 @@
+__tests__
+test

.prettierignore

@@ -0,0 +1,5 @@
+node_modules
+dist
+coverage
+proposals
+*.md

.prettierrc

@@ -0,0 +1,5 @@
+{
+  "singleQuote": true,
+  "bracketSpacing": false,
+  "trailingComma": "all"
+}

.storybook/config.js

@@ -0,0 +1,21 @@
+import * as React from 'react';
+import {configure, addDecorator} from '@storybook/react';
+
+import {ThemeProvider} from 'emotion-theming';
+import {newskitLightTheme, theSunTheme, theTimesTheme} from '../src/themes';
+
+const getThemeFromContext = ({kind}) =>
+  [
+    ['sun', theSunTheme],
+    ['times', theTimesTheme],
+    ['', newskitLightTheme],
+  ].find(([name, theme]) =>
+    kind.toLowerCase().includes(name) ? theme : false,
+  )[1];
+
+// Add providers for theme and styled components
+addDecorator((story, context) => (
+  <ThemeProvider theme={getThemeFromContext(context)}>{story()}</ThemeProvider>
+));
+
+configure(() => require('./load-stories.js'), module);

.storybook/load-stories.js

@@ -0,0 +1,21 @@
+/* global module */
+import {storiesOf} from '@storybook/react';
+
+const req = require.context('../src', true, /\.scenario\.tsx$/);
+
+const scenarios = req.keys().map(req);
+
+scenarios.reduce(
+  (stories, scenario) => stories.add(scenario.name, scenario.component),
+  storiesOf('NewsKit Light', module),
+);
+
+scenarios.reduce(
+  (stories, scenario) => stories.add(scenario.name, scenario.component),
+  storiesOf('The Sun Theme', module),
+);
+
+scenarios.reduce(
+  (stories, scenario) => stories.add(scenario.name, scenario.component),
+  storiesOf('The Times Theme', module),
+);

.storybook/webpack.config.js

@@ -0,0 +1,32 @@
+const path = require('path');
+
+module.exports = {
+  optimization: {
+    minimize: false,
+  },
+  resolve: {
+    extensions: ['.ts', '.tsx'],
+  },
+  module: {
+    rules: [
+      {
+        test: /\.tsx?$/,
+        loader: 'ts-loader',
+      },
+      {
+        test: /\.js$/,
+        enforce: 'pre',
+        loader: 'import-glob',
+        include: [path.resolve(__dirname)],
+      },
+      {
+        test: /\.(png|jpe?g|gif)$/,
+        use: [
+          {
+            loader: 'file-loader',
+          },
+        ],
+      },
+    ],
+  },
+};

Dockerfile

@@ -0,0 +1,12 @@
+# slim image used simply to reduce build download time, if problems arise just use non-slim variant.
+FROM node:10.16-jessie-slim
+
+WORKDIR /app
+
+RUN yarn add http-server
+
+COPY package.json ./
+COPY dist-storybook ./dist-storybook
+COPY public ./public
+
+EXPOSE 6006 8081

Makefile

@@ -0,0 +1,91 @@
+DOCKER_REGISTRY_URL ?= ncu-product-platforms
+DOCKER_REPO ?= design-system-site
+DOCKER_TAG ?= latest
+CIRCLE_SHA1 ?= 0000000000
+SHORT_GIT_HASH := $(shell echo ${CIRCLE_SHA1} | cut -c -9)
+
+# CURRENT BRANCH CHECKED OUT
+CURRENT_BRANCH = $(shell git symbolic-ref --short -q HEAD)
+
+# patch/minor/major
+UPDATE_TYPE = ${shell echo ${CURRENT_BRANCH}| cut -d'-' -f 3}
+
+# VERSION NUMBER IN PACKAGE JSON
+PKG_VERSION = ${shell node -p "require('./package.json').version"}
+
+# RELEASE BRANCH NAME TO CREATE PULL REQUESTS INTO DEVELOP AND MASTER
+RELEASE_BRANCH = release/${INITIAL_UPDATE_TYPE}-${PKG_VERSION}
+
+# PR TITLES
+RELEASE_PR_MASTER_TITLE = release/master-${INITIAL_UPDATE_TYPE}-${PKG_VERSION}
+RELEASE_PR_DEVELOP_TITLE = release/develop-${INITIAL_UPDATE_TYPE}-${PKG_VERSION}
+
+install:
+	yarn install --frozen-lockfile;
+
+install_cypress:
+	yarn global add [email protected];
+
+build_components:
+	yarn build:comps
+
+build_storybook:
+	yarn build:storybook
+
+build_docs:
+	yarn build:docs
+
+unit_test:
+	yarn test:ci
+
+e2e_test_build:
+	yarn e2e:build;
+
+e2e_test:
+	(yarn serve:docs &);
+	(yarn e2e:serve &);
+	yarn e2e:test;
+
+publish_npm_dev:
+	cd dist; yarn publish --no-git-tag-version --new-version 0.0.0-${SHORT_GIT_HASH} --tag unstable;
+
+publish_npm:
+	cd dist; yarn publish --no-git-tag-version;
+
+build_docker:
+	docker build -t ncu-newskit .
+
+push_docker:
+	docker tag ncu-newskit:latest $(DOCKER_REGISTRY_URL)/$(DOCKER_REPO):$(DOCKER_TAG)
+	docker push $(DOCKER_REGISTRY_URL)/$(DOCKER_REPO):$(DOCKER_TAG)
+
+set_git_identity:
+	git config --global user.email "[email protected]"
+	git config --global user.name "Product Platforms Service"
+
+install_hub:
+	wget https://github.com/github/hub/releases/download/v2.12.4/hub-linux-amd64-2.12.4.tgz
+	tar zxvf hub-linux-amd64-2.12.4.tgz
+	sudo cp hub-linux-amd64-2.12.4/bin/hub /usr/bin/hub
+
+# UPDATE PACKAGE VERSION BASED ON UPDATE TYPE IN BRANCH TRIGGER NAME
+create_release_candidate:
+	git fetch origin
+	git checkout -f develop
+	echo "Creating new ${UPDATE_TYPE} version"
+	yarn version --${UPDATE_TYPE}
+	make INITIAL_UPDATE_TYPE=${UPDATE_TYPE} push_release
+
+# CREATE RELEASE BRANCH AND PULL REQUESTS BEFORE DELETING ORIGINAL TRIGGER BRANCH
+push_release:
+	echo "Creating branch $(RELEASE_BRANCH)"
+	git checkout -b $(RELEASE_BRANCH)
+	#We don't care about any changes on master we force the current HEAD onto master 
+	echo "Merge our release branch"
+	git merge -s ours origin/master --no-edit
+	git push --set-upstream origin $(RELEASE_BRANCH)
+	echo "Create PR into develop"
+	hub pull-request -p --base develop --head $(RELEASE_BRANCH) -m $(RELEASE_PR_DEVELOP_TITLE)
+	echo "Create PR into master"
+	hub pull-request --base master --head $(RELEASE_BRANCH) -m $(RELEASE_PR_MASTER_TITLE)
+	git push origin --delete "trigger-release-${INITIAL_UPDATE_TYPE}"