@thecb/components 5.0.0-beta.14 → 5.0.0-beta.3

package/.eslintrc.json

@@ -0,0 +1,29 @@
+{
+  "extends": ["plugin:prettier/recommended", "plugin:react/recommended"],
+  "plugins": ["babel", "prettier"],
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "parser": "babel-eslint",
+  "rules": {
+    "react/jsx-filename-extension": 0,
+    "react/prop-types": 0,
+    "react/display-name": 0,
+    "prettier/prettier": "error",
+    "no-unused-vars": 2,
+    "babel/camelcase": 0,
+    "camelcase": ["off"]
+  },
+  "env": {
+    "browser": true
+  },
+  "parserOptions": {
+    "ecmaVersion": 11,
+    "sourceType": "module",
+    "ecmaFeatures": {
+      "jsx": true
+    }
+  }
+}

package/.github/PULL_REQUEST_TEMPLATE.md

@@ -0,0 +1,18 @@
+## Description
+A brief description of the changes and purpose of the PR.
+
+## List of changes to be aware of:
+- [x] ....
+- [x] ....
+
+## Dev Tasks
+- [ ] specs
+- [ ] storys
+- [ ] lint
+- [ ] export component in ~/src/index.js
+
+## JIRA Task
+[ABCD-123](https://citybase.atlassian.net/browse/ABCD-123)
+
+## Screenshots
+(optional)

package/.github/stale.yml

@@ -0,0 +1,17 @@
+# Number of days of inactivity before an issue becomes stale
+daysUntilStale: 30
+# Number of days of inactivity before a stale issue is closed
+daysUntilClose: 7
+# Issues with these labels will never be considered stale
+exemptLabels:
+  - "Don't close"
+# Label to use when marking an issue as stale
+staleLabel: stale
+# Comment to post when marking an issue as stale. Set to `false` to disable
+markComment: >
+  This issue has been automatically marked as stale because it has not had
+  recent activity. It will be closed within seven days if no further activity
+  occurs. If it needs to remain open, add the "Don't close" label.
+# Comment to post when closing a stale issue. Set to `false` to disable
+closeComment: >
+  This issue has been automatically closed because it was stale.

package/.github/workflows/bump-version.yml

@@ -0,0 +1,30 @@
+name: Bump Package Version
+on:
+  push:
+    branches:
+      - "master"
+    
+jobs:
+  bump-version:
+    name: Bump version on master
+    runs-on: ubuntu-latest
+    
+    steps:
+      - name: Checkout source code
+        uses: actions/checkout@v2
+        with:
+          ref: ${{ github.ref }}
+      - name: "cat package.json"
+        run: cat ./package.json
+      - name: Setup Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: 12
+      - name: Automated version bump
+        uses: phips28/gh-action-bump-version@master
+        with:
+          tag-prefix: ''
+        env:
+          GITHUB_TOKEN: ${{ secrets.REPO_ACCESS_TOKEN }}
+      - name: "cat package.json"
+        run: cat ./package.json

package/.github/workflows/create-release/build-body.sh

@@ -0,0 +1,35 @@
+#!/usr/bin/env bash
+
+# The output is a Markdown table with columns for the PR (with a link),
+# a branch, and JIRA ticket with link (if available).
+#
+# If the branch name starts with an id for a JIRA ticket (e.g.,
+# PLAT-123), then a link to the ticket is created.  Otherwise this
+# column is blank.
+#
+# A link to the branch isn't valuable because they are usually
+# deleted after merging.
+
+from_tag=${FROM_TAG}
+to_tag=${TAG##*/}
+
+echo "## Changes"
+echo ""
+echo "### PRs"
+# all merge commits, only merge commits
+git --no-pager log --merges --format='%s' ${from_tag}..${to_tag} | \
+    # only pull-request merges
+    grep "Merge pull request" | \
+    gawk 'BEGIN { print "| PR | Branch | Ticket |" ;
+                  print "| -- | ------ | ------ |" }
+          {if (match($0,/(#[0-9]+).*CityBaseInc\/(([A-Z]+-[0-9]+)\S+)/,m))
+            printf "| %s | %s | [%s](https://citybase.atlassian.net/browse/%s) |\n", m[1], m[2], m[3], m[3] }
+          {if (match($0,/(#[0-9]+).*CityBaseInc\/([a-z]\S+)/,m))
+            print "|", m[1], "|", m[2], "|", "|"}'
+
+echo ""
+echo "### Code Diff"
+echo "https://github.com/${REPO}/compare/${from_tag}..${to_tag}"
+echo ""
+
+git show ${to_tag} --format=short | grep Tagger

package/.github/workflows/create-release.yml

@@ -0,0 +1,52 @@
+on:
+  push:
+    tags:
+      - '*'
+
+
+name: Create Release
+
+jobs:
+  build:
+    name: Create Release
+    runs-on: ubuntu-latest
+    env:
+      REPO: ${{ github.repository }}
+      TAG: ${{ github.ref }}
+    steps:
+      - uses: actions/checkout@v2
+      - name: Get latest release
+        id: get_latest
+        run: |
+          tag_name=$(curl --silent --request GET \
+          --url https://api.github.com/repos/${{ github.repository }}/releases/latest \
+          --header "authorization: Bearer ${{ secrets.GITHUB_TOKEN }}" \
+          --header "content-type: applicatoin/json" | jq -r .tag_name)
+          echo "::set-output name=tag_name::$tag_name"
+      - name: Fetch branches
+        run: git fetch --all --prune --unshallow
+      - name: Fetch tags
+        run: git fetch --unshallow origin +refs/tags/*:refs/tags/*
+      - name: Checkout master
+        run: git checkout master
+      - name: Build body
+        id: build_body
+        env:
+          FROM_TAG: ${{ steps.get_latest.outpus.tag_name}}
+        run: |
+          body=$(sh ./.github/workflows/create-release/build-body.sh)
+          body="${body//'%'/'%25'}"
+          body="${body//$'\n'/'%0A'}"
+          body="${body//$'\r'/'%0D'}"
+          echo "::set-output name=body::$body"
+      - name: Create Release
+        id: create_release
+        uses: actions/create-release@4d1b6075ce7561b672b8552148edec2f27584fe9
+        env:
+          GITHUB_TOKEN: ${{ secrets.REPO_ACCESS_TOKEN }}
+        with: 
+          tag_name: ${{ github.ref }}
+          release_name: Release ${{ github.ref }}
+          body: ${{ steps.build_body.outputs.body }}
+          draft: false
+          prerelease: false

package/.github/workflows/disabled-workflows/publish-update.yml

@@ -0,0 +1,73 @@
+name: Publish and Update
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  build:
+    name: Build
+    runs-on: ubuntu-latest
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+        with:
+          ref: master
+
+      - name: Set up Node.js
+        uses: actions/setup-node@v1.2.0
+        with:
+          node-version: "10.x"
+
+      - name: Install dependencies
+        run: yarn install --silent
+
+      - name: Compile build
+        run: yarn build --silent
+
+      - name: Commit changes
+        uses: EndBug/add-and-commit@v2.1.0
+        with:
+          author_name: CB Feeps
+          author_email: feeps@thecitybase.com
+          message: "[auto] Update dist"
+          path: dist
+          pattern: "*.*"
+          force: true
+          ref: deploy
+        env:
+          GITHUB_TOKEN: ${{ secrets.REPO_ACCESS_TOKEN }}
+
+  publish:
+    name: Publish to NPM Registry
+    runs-on: ubuntu-latest
+    needs: build
+
+    steps:
+      - name: Checkout repository
+        uses: actions/checkout@v2
+        with:
+          ref: deploy
+
+      - name: Set up Node.js for NPM
+        if: steps.check.outputs.changed == 'true'
+        uses: actions/setup-node@v1.2.0
+        with:
+          node-version: "10.x"
+          registry-url: "https://registry.npmjs.org"
+          scope: "@thecb"
+
+      - name: Install dependencies
+        if: steps.check.outputs.changed == 'true'
+        run: yarn install
+
+      - name: Create build
+        if: steps.check.outputs.changed == 'true'
+        run: yarn build
+
+      - name: Publish package to NPM
+        if: steps.check.outputs.changed == 'true'
+        run: yarn publish
+        env:
+          NODE_AUTH_TOKEN: ${{ secrets.NPM_TOKEN }}

package/.prettierignore

@@ -0,0 +1,3 @@
+node_modules/
+dist/
+.storybook/

package/.storybook/main.js

@@ -0,0 +1,4 @@
+module.exports = {
+    stories: ['../src/**/*.stories.[tj]s'],
+    addons: ['@storybook/addon-knobs/register', '@storybook/addon-a11y']
+};

package/.storybook/page.js

@@ -0,0 +1,64 @@
+import React from "react"
+import { ThemeProvider } from "styled-components"
+import { withKnobs, select, radios, text } from "@storybook/addon-knobs";
+import { withA11y } from "@storybook/addon-a11y";
+import { Provider } from 'react-redux';
+import { createStore } from "redux";
+import { Router } from "react-router-dom";
+import { createBrowserHistory } from "history";
+
+import ResizingContainer from "../src/components/atoms/layouts/examples/ResizingContainer";
+import { SFTheme, APCTheme } from "./themes";
+
+const themesLabel = "Theme";
+const themes = {
+  SF: SFTheme,
+  APC: APCTheme,
+  None: {},
+};
+const defaultValue = SFTheme;
+const groupId = "Theme";
+
+const animateLabel = "Animate";
+const animateOptions = {
+  play: "play",
+  pause: "pause"
+};
+const animateDefaultValue = "pause";
+const animateGroupID = "Container";
+
+const themeDecorator = storyFn => (
+  <ThemeProvider theme={select(themesLabel, themes, defaultValue, groupId)}>{storyFn()}</ThemeProvider>
+)
+
+export default ({ title, Component, height, reducer = () => { }, containerMax = "40rem", containerMin = "20rem" }) => {
+  const history = createBrowserHistory();
+  const store =createStore(
+    reducer,
+    window.__REDUX_DEVTOOLS_EXTENSION__ && window.__REDUX_DEVTOOLS_EXTENSION__()
+  )
+  return {
+    title,
+    component: Component,
+    decorators: [
+      themeDecorator,
+      withKnobs,
+      withA11y,
+      storyFn => (
+        <Router history={history} >
+          <Provider store={store}>
+              <div style={{ height: "max-content", display: "flex", justifyContent: "center", flexDirection: "column" }}>
+                <ResizingContainer
+                  height={height}
+                  animate={radios(animateLabel, animateOptions, animateDefaultValue, animateGroupID)}
+                  containerMax={text("Container Max", containerMax, animateGroupID)}
+                  containerMin={text("Container Min", containerMin, animateGroupID)}>
+                  {storyFn()}
+                </ResizingContainer >
+              </div>
+          </Provider>
+        </Router>
+      )
+    ]
+  }
+};

package/.storybook/themes/apc.theme.js

@@ -0,0 +1 @@
+export const APCTheme = {values: {"Button":{"active":{"primary":"background-color: #C8171E; border: 2px solid #C8171E; box-shadow: 0 0 10px #E30100;","secondary":"background-color: #F58D91; color: #FF0000; box-shadow: 0 0 10px #FF0000","smallPrimary":"background-color: #C8171E; border: 2px solid #C8171E;  box-shadow: 0 0 10px #E30100","smallSecondary":"background-color: #F58D91; color: #FF0000; box-shadow: 0 0 10px #FF0000"},"backgroundColor":{"primary":"#EC1C24","secondary":"#F6F6F9","smallPrimary":"#EC1C24","smallSecondary":"#F6F6F9"},"border":{"primary":"2px solid #EC1C24;","secondary":"2px solid #EC1C24;","smallPrimary":"2px solid %#EC1C24;","smallSecondary":"2px solid #EC1C24;"},"color":{"primary":"#F6F6F9","secondary":"#EC1C24","smallPrimary":"#F6F6F9","smallSecondary":"#EC1C24"},"focus":{"primary":"outline: none; background-color: #C8171E; border: 2px solid #C8171E; box-shadow: 0 0 10px #E30100","secondary":"outline: none; background-color: #F58D91; color: #FF0000; box-shadow: 0 0 10px #FF0000;","smallPrimary":"outline: none; background-color: #C8171E; border: 2px solid #C8171E; box-shadow: 0 0 10px #E30100","smallSecondary":"outline: none; background-color: #F58D91; color: #FF0000; box-shadow: 0 0 10px #FF0000;"},"hover":{"primary":"cursor: pointer; background-color: #E30100; border: 2px solid #E30100; box-shadow: 0 0 10px #E30100;","secondary":"cursor: pointer; background-color: #FBD9D9; box-shadow: 0 0 10px #EC1C24; color: #EC1C24;","smallPrimary":"cursor: pointer; background-color: #E30100; border: 2px solid #E30100; box-shadow: 0 0 10px #E30100;","smallSecondary":"cursor: pointer; background-color: #FBD9D9; box-shadow: 0 0 10px #EC1C24; color: #EC1C24;"}},"Footer":{"backgroundColor":"#56575B"},"Header":{"backgroundColor":"#FFFFFF"},"HighlightTabRow":{"backgroundColor":"#215B9E"},"linkColor":"#15749D","logo":"logo.png","primaryColor":"#3B414D","secondaryColor":"#E5E7EC","textColor":"#000000"}}

package/.storybook/themes/index.js

@@ -0,0 +1,2 @@
+export { SFTheme } from "./sf.theme"
+export { APCTheme } from "./apc.theme"

package/.storybook/themes/sf.theme.js

@@ -0,0 +1 @@
+export const SFTheme = {values: {"AmountCallout":{"color":"#347BB2"},"Breadcrumb":{"color":"#347BB2"},"Button":{"active":{"danger":"background-color: #870000; border: 2px solid #870000; box-shadow: 0 0 10px #ED125F;","ghost":"background-color: $(transparent)s; color: #001952; box-shadow: none;","primary":"background-color: #001952; border: 2px solid #001952; box-shadow: 0 0 10px #347BB2","secondary":"background-color: #D8E5F2; box-shadow: 0 0 10px #D8E5F2;","smallGhost":"background-color: $(transparent)s; color: #001952; box-shadow: none;","smallPrimary":"background-color: #001952; border: 2px solid #001952; box-shadow: 0 0 10px #347BB2;","smallSecondary":"background-color: #D8E5F2; box-shadow: 0 0 10px #D8E5F2;"},"backgroundColor":{"danger":"#ED125F","ghost":"transparent","primary":"#347BB2","secondary":"transparent","smallGhost":"transparent","smallPrimary":"#347BB2","smallSecondary":"transparent"},"border":{"danger":"2px solid #ED125F;","ghost":"none","primary":"2px solid #347BB2;","secondary":"2px solid #347BB2;","smallGhost":"none","smallPrimary":"2px solid #347BB2;","smallSecondary":"2px solid #347BB2;"},"color":{"danger":"#FFFFFF","ghost":"#347BB2","primary":"#FFFFFF","secondary":"#347BB2","smallGhost":"#347BB2","smallPrimary":"#FFFFFF","smallSecondary":"#347BB2"},"disabled":{"danger":"background-color: #6E727E; border: 2px solid #6E727E; &:focus { box-shadow: 0 0 10px #6E727E; }","ghost":"color: #6E727E; border: none","primary":"background-color: #6E727E; border: 2px solid #6E727E; &:focus { box-shadow: 0 0 10px #6E727E; }","secondary":"background-color: #6E727E; border: 2px solid #6E727E; &:focus { box-shadow: 0 0 10px #6E727E; }","smallGhost":"color: #6E727E; border: none;","smallPrimary":"background-color: #6E727E; border: 2px solid #6E727E; &:focus { box-shadow: 0 0 10px #6E727E; }","smallSecondary":"background-color: #6E727E; border: 2px solid #6E727E; &:focus { box-shadow: 0 0 10px #6E727E; }"},"focus":{"danger":"outline: none; background-color: #BA002C; border: 2px solid #BA002C; box-shadow: 0 0 10px #ED125F","ghost":"outline: none; box-shadow: none; color: #024C85;","primary":"outline: none; background-color: #024C85; border: 2px solid #024C85; box-shadow: 0 0 10px #347BB2","secondary":"outline: none; background-color: #EAF2F8; box-shadow: 0 0 10px #EAF2F8;","smallGhost":"outline: none; box-shadow: none; color: #024C85;","smallPrimary":"outline: none; background-color: #024C85; border: 2px solid #024C85; box-shadow: 0 0 10px #347BB2","smallSecondary":"outline: none; background-color: #EAF2F8; box-shadow: 0 0 10px #EAF2F8;"},"hover":{"danger":"background-color: #BA002C; border: 2px solid #BA002C; box-shadow: 0 0 10px #ED125F;","ghost":"cursor: pointer; color: #024C85;","primary":"cursor: pointer; background-color: #024C85; border: 2px solid #024C85; box-shadow: 0 0 10px #347BB2","secondary":"cursor: pointer; background-color: #EAF2F8; box-shadow: 0 0 10px #EAF2F8;","smallGhost":"cursor: pointer; color: #024C85;","smallPrimary":"cursor: pointer; background-color: #024C85; border: 2px solid #024C85; box-shadow: 0 0 10px #347BB2","smallSecondary":"cursor: pointer; background-color: #EAF2F8; box-shadow: 0 0 10px #EAF2F8;"}},"Checkbox":{"boxShadow":{"default":"0 0 0 3px #D8E5F2;"},"checkedStyles":{"default":"background: #347BB2; border: 1px solid #347BB2;"}},"Dropdown":{"hoverColor":"#EFFAFF","selectedColor":"#347BB2"},"Footer":{"backgroundColor":"#182848","logoHeight":"52px","subfooterColor":"#347BB2"},"FormInput":{"hoverFocusStyles":{"default":"outline: none; text-decoration: underline; color: #024C85;"},"linkColor":{"default":"#347BB2"}},"Global":{"baseFontSize":"16px","baseMobileFontSize":"14px","pageBackground":"#F6F6F9"},"Header":{"backgroundColor":"#347BB2"},"Icons":{"accentColor":{"error":"#3B414D","info":"#3B414D","success":"#3B414D"},"primaryColor":{"error":"#FFFFFF","info":"#FFFFFF","success":"#FFFFFF"},"singleIconColor":{"darkMode":"#FFFFFF","primary":"#347BB2","secondary":"#3B414D"},"subIconColor":{"error":"#ED125F","info":"#347BB2","success":"#317D4F"}},"ModalLink":{"linkColor":"#347BB2"},"NavMenu":{"backgroundColor":"#347BB2"},"ProfileTab":{"activeTabAccent":"#347BB2","activeTabBackground":"#FFFFFF","activeTabHover":"#D8E5F2"},"RadioButton":{"activeColor":"#347BB2"},"Spinner":{"color":"#347BB2"},"ToggleSwitch":{"onBackground":"#347BB2"},"Workflow":{"accentColor":"#214566","fontFamily":"Open Sans, sans-serif","linkColor":"#214566","primaryButtonColor":"#347BB2","secondaryButtonColor":"#347BB2","textColor":"#091325","workflowFooterColor":"#182848","workflowHeaderColor":"#347BB2"},"linkColor":"#15749D","logo":"logo.png","primaryColor":"#3B414D","secondaryColor":"#E5E7EC","textColor":"#000000"}}

package/.tool-versions

@@ -0,0 +1 @@
+nodejs 15.8.0