@thecb/components 5.0.0-beta.8 → 5.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thecb/components",
-  "version": "5.0.0-beta.8",
+  "version": "5.2.0",
   "description": "Common lib for CityBase react components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -18,6 +18,10 @@
   "bugs": {
     "url": "https://github.com/CityBaseInc/cb-components/issues"
   },
+  "files": [
+    "dist",
+    "src"
+  ],
   "homepage": "https://github.com/CityBaseInc/cb-components#readme",
   "devDependencies": {
     "@babel/core": "^7.0.0-0",
@@ -74,13 +78,13 @@
   },
   "dependencies": {
     "@babel/runtime": "^7.15.4",
-    "formatted-input": "^0.1.3",
+    "formatted-input": "^1.0.0",
     "framer-motion": "^1.11.0",
     "numeral": "^2.0.6",
     "polished": "^4.0.3",
     "ramda": "^0.27.0",
     "react-aria-modal": "^4.0.0",
     "react-pose": "^4.0.10",
-    "redux-freeform": "^5.1.0-beta.5"
+    "redux-freeform": "^5.2.0"
   }
 }

package/src/components/atoms/icons/CashIcon.js

@@ -0,0 +1,21 @@
+import React from "react";
+
+const CashIcon = () => {
+  return (
+    <svg
+      xmlns="http://www.w3.org/2000/svg"
+      width="36"
+      height="24"
+      fill="none"
+      viewBox="0 0 36 24"
+    >
+      <rect width="36" height="24" fill="#E8FFEF" rx="1"></rect>
+      <path
+        fill="#317D4F"
+        d="M17.178 5.464v1.372c-1.799.294-3.115 1.407-3.094 3.08.021 1.645 1.05 2.597 2.611 2.884l1.617.308c.924.182 1.365.406 1.365 1.085 0 .609-.553 1.092-1.484 1.092-1.036 0-1.743-.455-1.932-1.267l-2.478.021c.175 1.834 1.414 2.8 3.374 3.038v1.197h2.023V17.07c1.876-.266 3.024-1.33 3.024-2.877 0-1.617-.798-2.751-2.702-3.178l-1.603-.357c-.994-.231-1.267-.497-1.267-1.029 0-.546.511-1.015 1.596-1.015 1.015 0 1.302.511 1.393 1.267l2.415-.014c.05-1.484-1.043-2.695-2.835-3.024V5.464h-2.023z"
+      ></path>
+    </svg>
+  );
+};
+
+export default CashIcon;

package/src/components/atoms/icons/index.js

@@ -54,6 +54,7 @@ import ResetPasswordIcon from "./ResetPasswordIcon";
 import PeriscopeFailedIcon from "./PeriscopeFailedIcon";
 import CheckIcon from "./CheckIcon";
 import WarningIconXS from "./WarningIconXS";
+import CashIcon from "./CashIcon";
 
 export {
   AccountsIcon,
@@ -111,5 +112,6 @@ export {
   ResetPasswordIcon,
   PeriscopeFailedIcon,
   CheckIcon,
-  WarningIconXS
+  WarningIconXS,
+  CashIcon
 };

package/src/components/molecules/modal/Modal.js

@@ -15,7 +15,7 @@ Styling accomplished with our atoms / layout primitives
 
 Cancel button will (for now) always use hideModal as its action
 Continue button takes an action, if you want to navigate to
-a different route (as with a link) connect() and use "push" from connected-react-router
+a different route (as with a link) connect() and use "push" from @thecb/connected-react-router
 */
 
 const getApplicationNode = () => document.getElementById("root");

package/src/components/molecules/payment-form-card/PaymentFormCard.js

@@ -71,6 +71,7 @@ const PaymentFormCard = ({
   const expirationDateErrors = {
     [required.error]: "Expiration date is required",
     [hasLength.error]: "Expiration date is invalid",
+    [isValidMonth.error]: "Expiration month is invalid",
     [dateAfterToday.error]: "Expiration date is invalid"
   };
   const cvvErrors = {

package/src/components/molecules/payment-form-card/PaymentFormCard.state.js

@@ -5,7 +5,8 @@ import {
   hasLength,
   matchesRegex,
   validateWhen,
-  dateAfterToday
+  dateAfterToday,
+  isValidMonth
 } from "redux-freeform";
 
 //TODO: Will make zip code able to have more than 5 digits once we add in the FormattedInput because it will have issues with format of 60606-1111.
@@ -26,7 +27,8 @@ const formConfig = {
     validators: [
       required(),
       hasLength(4, 4),
-      dateAfterToday("MM/YY", "month", true)
+      isValidMonth(0),
+      dateAfterToday("MMYY", "month", true)
     ],
     constraints: [onlyIntegers(), hasLength(0, 4)]
   },

package/src/deprecated/utility/__tests__/safeConcat.spec.js

@@ -1,59 +1,61 @@
-//      
+//
 
-import safeConcat from '../safeConcat';
+import safeConcat from "../safeConcat";
 
-describe('safeConcat', () => {
+describe("safeConcat", () => {
   beforeEach(() => {
     console.error = jest.fn();
   });
 
-  describe('arg validation', () => {
-    describe('when values not an array', () => {
-      it('throws console error', () => {
-        const result = safeConcat('a', '-');
+  describe("arg validation", () => {
+    describe("when values not an array", () => {
+      it("throws console error", () => {
+        const result = safeConcat("a", "-");
 
         const errors = console.error.mock.calls;
         expect(errors.length).toEqual(1);
 
         const firstError = errors[0][0];
-        expect(firstError).toEqual('\'values\' needs to be an array. Recieved string');
+        expect(firstError).toEqual(
+          "'values' needs to be an array. Recieved string"
+        );
 
         expect(result).toEqual(undefined);
       });
     });
   });
 
-  describe('with valid values', () => {
-    it('concatinates strings with concatinator', () => {
-      const result = safeConcat(['a', 'b', 'c'], '-');
-      expect(result).toEqual('a-b-c');
+  describe("with valid values", () => {
+    it("concatinates strings with concatinator", () => {
+      const result = safeConcat(["a", "b", "c"], "-");
+      expect(result).toEqual("a-b-c");
     });
 
-    it('stringifies the concatinator', () => {
-      const result = safeConcat(['a', 'b', 'c'], 1);
-      expect(result).toEqual('a1b1c');
+    it("stringifies the concatinator", () => {
+      const result = safeConcat(["a", "b", "c"], 1);
+      expect(result).toEqual("a1b1c");
     });
 
-    it('removes falsey string values from values array', () => {
-      const result = safeConcat(['a', undefined, 'b', ''], '-');
-      expect(result).toEqual('a-b');
+    it("removes falsey string values from values array", () => {
+      const result = safeConcat(["a", undefined, "b", ""], "-");
+      expect(result).toEqual("a-b");
     });
 
-    it('does not append concatinator single values arrays', () => {
-      const result = safeConcat(['a'], '-');
-      expect(result).toEqual('a');
+    it("does not append concatinator single values arrays", () => {
+      const result = safeConcat(["a"], "-");
+      expect(result).toEqual("a");
     });
 
-    it('does not append concatinator to single truthy values', () => {
-      const result = safeConcat(['a', undefined], '-');
-      expect(result).toEqual('a');
+    it("does not append concatinator to single truthy values", () => {
+      const result = safeConcat(["a", undefined], "-");
+      expect(result).toEqual("a");
     });
   });
 
-  describe('with no valid values', () => {
-    it('returns empty string when no valid values', () => {
-      const result = safeConcat([undefined], '-');
-      expect(result).toEqual('');
+  describe("with no valid values", () => {
+    it("returns empty string when no valid values", () => {
+      const result = safeConcat([undefined], "-");
+      expect(result).toEqual("");
     });
   });
 });

package/src/deprecated/utility/__tests__/validateKeyType.spec.js

@@ -1,112 +1,128 @@
-//      
+//
 
-import validateKeyType from '../validateKeyType';
+import validateKeyType from "../validateKeyType";
 
-describe('validateKeyType', () => {
+describe("validateKeyType", () => {
   const objParam = {
     aArray: [1],
     aBoolean: true,
     aFunction: jest.fn(),
     aNumber: 1,
-    aObject: { foo: 'bar' },
-    aString: 'bar'
+    aObject: { foo: "bar" },
+    aString: "bar"
   };
 
-  describe('when obj param does not contain key param', () => {
-    it('returns false', () => {
-      const result = validateKeyType(objParam, 'wrong-key', 'string');
+  describe("when obj param does not contain key param", () => {
+    it("returns false", () => {
+      const result = validateKeyType(objParam, "wrong-key", "string");
       expect(result).toEqual(false);
     });
   });
 
-  describe('when obj param contains key param', () => {
-    describe('when obj[key] type', () => {
-      describe('matches type param', () => {
-        describe('of Array', () => {
-          it('returns true', () => {
-            const arrayResult = validateKeyType(objParam, 'aArray', 'array');
+  describe("when obj param contains key param", () => {
+    describe("when obj[key] type", () => {
+      describe("matches type param", () => {
+        describe("of Array", () => {
+          it("returns true", () => {
+            const arrayResult = validateKeyType(objParam, "aArray", "array");
             expect(arrayResult).toEqual(true);
           });
         });
 
-        describe('of Boolean', () => {
-          it('returns true', () => {
-            const arrayResult = validateKeyType(objParam, 'aBoolean', 'boolean');
+        describe("of Boolean", () => {
+          it("returns true", () => {
+            const arrayResult = validateKeyType(
+              objParam,
+              "aBoolean",
+              "boolean"
+            );
             expect(arrayResult).toEqual(true);
           });
         });
 
-        describe('of Function', () => {
-          it('returns true', () => {
-            const arrayResult = validateKeyType(objParam, 'aFunction', 'function');
+        describe("of Function", () => {
+          it("returns true", () => {
+            const arrayResult = validateKeyType(
+              objParam,
+              "aFunction",
+              "function"
+            );
             expect(arrayResult).toEqual(true);
           });
         });
 
-        describe('of Number', () => {
-          it('returns true', () => {
-            const arrayResult = validateKeyType(objParam, 'aNumber', 'number');
+        describe("of Number", () => {
+          it("returns true", () => {
+            const arrayResult = validateKeyType(objParam, "aNumber", "number");
             expect(arrayResult).toEqual(true);
           });
         });
 
-        describe('of Object', () => {
-          it('returns true', () => {
-            const arrayResult = validateKeyType(objParam, 'aObject', 'object');
+        describe("of Object", () => {
+          it("returns true", () => {
+            const arrayResult = validateKeyType(objParam, "aObject", "object");
             expect(arrayResult).toEqual(true);
           });
         });
 
-        describe('of String', () => {
-          it('returns true', () => {
-            const arrayResult = validateKeyType(objParam, 'aString', 'string');
+        describe("of String", () => {
+          it("returns true", () => {
+            const arrayResult = validateKeyType(objParam, "aString", "string");
             expect(arrayResult).toEqual(true);
           });
         });
       });
 
-      describe('does not match type param', () => {
-        describe('of Array', () => {
-          it('returns false', () => {
-            const arrayResult = validateKeyType(objParam, 'aArray', 'string');
+      describe("does not match type param", () => {
+        describe("of Array", () => {
+          it("returns false", () => {
+            const arrayResult = validateKeyType(objParam, "aArray", "string");
             expect(arrayResult).toEqual(false);
 
-            const arrayObjResult = validateKeyType(objParam, 'aArray', 'object');
+            const arrayObjResult = validateKeyType(
+              objParam,
+              "aArray",
+              "object"
+            );
             expect(arrayObjResult).toEqual(false);
           });
         });
 
-        describe('of Boolean', () => {
-          it('returns false', () => {
-            const arrayResult = validateKeyType(objParam, 'aBoolean', 'string');
+        describe("of Boolean", () => {
+          it("returns false", () => {
+            const arrayResult = validateKeyType(objParam, "aBoolean", "string");
             expect(arrayResult).toEqual(false);
           });
         });
 
-        describe('of Function', () => {
-          it('returns false', () => {
-            const arrayResult = validateKeyType(objParam, 'aFunction', 'string');
+        describe("of Function", () => {
+          it("returns false", () => {
+            const arrayResult = validateKeyType(
+              objParam,
+              "aFunction",
+              "string"
+            );
             expect(arrayResult).toEqual(false);
           });
         });
 
-        describe('of Number', () => {
-          it('returns false', () => {
-            const arrayResult = validateKeyType(objParam, 'aNumber', 'string');
+        describe("of Number", () => {
+          it("returns false", () => {
+            const arrayResult = validateKeyType(objParam, "aNumber", "string");
             expect(arrayResult).toEqual(false);
           });
         });
 
-        describe('of Object', () => {
-          it('returns false', () => {
-            const arrayResult = validateKeyType(objParam, 'aObject', 'string');
+        describe("of Object", () => {
+          it("returns false", () => {
+            const arrayResult = validateKeyType(objParam, "aObject", "string");
             expect(arrayResult).toEqual(false);
           });
         });
 
-        describe('of String', () => {
-          it('returns false', () => {
-            const arrayResult = validateKeyType(objParam, 'aString', 'number');
+        describe("of String", () => {
+          it("returns false", () => {
+            const arrayResult = validateKeyType(objParam, "aString", "number");
             expect(arrayResult).toEqual(false);
           });
         });

package/src/deprecated/utility/index.js

@@ -1,2 +1,2 @@
-export { default as safeConcat } from './safeConcat';
-export { default as validateKeyType } from './validateKeyType';
+export { default as safeConcat } from "./safeConcat";
+export { default as validateKeyType } from "./validateKeyType";

package/src/deprecated/utility/safeConcat.js

@@ -1,10 +1,10 @@
-//      
+//
 
-export default function safeConcat(values               , concatinator        ) {
+export default function safeConcat(values, concatinator) {
   if (!Array.isArray(values)) {
     console.error(`'values' needs to be an array. Recieved ${typeof values}`);
     return;
   }
 
-  return values.filter((val        ) => !!val).join(String(concatinator));
+  return values.filter(val => !!val).join(String(concatinator));
 }

package/src/deprecated/utility/validateKeyType.js

@@ -1,17 +1,15 @@
-//      
+//
 
-export default function validateKeyType(obj                         ,
-  expectedKey        ,
-  expectedType        )          {
+export default function validateKeyType(obj, expectedKey, expectedType) {
   if (!(expectedKey in obj)) {
     return false;
   }
 
-  if (expectedType === 'object' && Array.isArray(obj[expectedKey])) {
+  if (expectedType === "object" && Array.isArray(obj[expectedKey])) {
     return false;
   }
 
-  if (expectedType === 'array' && Array.isArray(obj[expectedKey])) {
+  if (expectedType === "array" && Array.isArray(obj[expectedKey])) {
     return true;
   }
 

package/.eslintrc.json

@@ -1,34 +0,0 @@
-{
-  "extends": ["plugin:prettier/recommended", "plugin:react/recommended"],
-  "plugins": ["babel", "prettier"],
-  "settings": {
-    "react": {
-      "version": "detect"
-    }
-  },
-  "parser": "@babel/eslint-parser",
-  "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
-    },
-    "babelOptions": {
-      "presets": [
-        "@babel/preset-react"
-      ]
-    }
-  }
-}

package/.github/PULL_REQUEST_TEMPLATE.md

@@ -1,18 +0,0 @@
-## 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

@@ -1,17 +0,0 @@
-# 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

@@ -1,30 +0,0 @@
-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

@@ -1,35 +0,0 @@
-#!/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

@@ -1,52 +0,0 @@
-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