@gr4vy/secure-fields-react 0.7.0 → 0.8.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,3 +1,15 @@
1
+ # v0.8.0 (Thu Oct 06 2022)
2
+
3
+ #### 🚀 Enhancement
4
+
5
+ - feat: google fonts support [#57](https://github.com/gr4vy/secure-fields/pull/57) ([@luca-gr4vy](https://github.com/luca-gr4vy))
6
+
7
+ #### Authors: 1
8
+
9
+ - Luca Allievi ([@luca-gr4vy](https://github.com/luca-gr4vy))
10
+
11
+ ---
12
+
1
13
  # v0.6.3 (Mon Oct 03 2022)
2
14
 
3
15
  #### 🏠 Internal
package/README.md CHANGED
@@ -29,6 +29,7 @@ const { SecureFields } = require(`@gr4vy/secure-fields-react`)
29
29
  gr4vyId='[GR4VY_ID]'
30
30
  sessionId='[SESSION_ID]'
31
31
  debug
32
+ font="Lato"
32
33
  onReady={(data) => console.warn('Secure Fields loaded', data)}
33
34
  onCardVaultSuccess={() =>
34
35
  console.warn('Card has been tokenized successfully!')
@@ -42,15 +43,16 @@ const { SecureFields } = require(`@gr4vy/secure-fields-react`)
42
43
  > **Note**: Replace `[GR4VY_ID]` and `[SESSION_ID]` with the ID of your instance
43
44
  > and the Session ID obtained from calling the [Checkout Sessions API](https://gr4vy.com/docs/reference#tag/Checkout-Sessions).
44
45
 
45
- | Prop Name | Description |
46
- | -------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
47
- | `environment` | Your Gr4vy environment. Can be either `sandbox` or `production` |
48
- | `gr4vyId` | Your Gr4vy ID. |
49
- | `sessionId` | The Session ID. |
50
- | `debug` | Enables / disables the debug mode |
51
- | `onReady` | Attaches an event handler to the SecureFields instance, listening for the [`READY`](../secure-fields/README.md#events) event. Accepts a callback function |
52
- | `onCardVaultSuccess` | Attaches an event handler to the SecureFields instance, listening for the [`CARD_VAULT_SUCCESS`](../secure-fields/README.md#events) event. Accepts a callback function |
53
- | `onCardVaultFailure` | Attaches an event handler to the SecureFields instance, listening for the [`CARD_VAULT_FAILURE`](../secure-fields/README.md#events) event. Accepts a callback function |
46
+ | Prop Name | Description |
47
+ | -------------------- | ----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
48
+ | `environment` | Your Gr4vy environment. Can be either `sandbox` or `production` |
49
+ | `gr4vyId` | Your Gr4vy ID. |
50
+ | `sessionId` | The Session ID. |
51
+ | `debug` | Enables / disables the debug mode |
52
+ | `font` | Loads a custom font from [Google Fonts](https://fonts.google.com/) to be used inside inputs. You can define the font family as well as styles or weights as a string (e.g. "Lato:400,600"). To use the loaded font, add the correct `fontFamily` property to the styles object when rendering fields. |
53
+ | `onReady` | Attaches an event handler to the SecureFields instance, listening for the [`READY`](../secure-fields/README.md#events) event. Accepts a callback function |
54
+ | `onCardVaultSuccess` | Attaches an event handler to the SecureFields instance, listening for the [`CARD_VAULT_SUCCESS`](../secure-fields/README.md#events) event. Accepts a callback function |
55
+ | `onCardVaultFailure` | Attaches an event handler to the SecureFields instance, listening for the [`CARD_VAULT_FAILURE`](../secure-fields/README.md#events) event. Accepts a callback function |
54
56
 
55
57
  ### Form
56
58
 
@@ -29,14 +29,15 @@ var react_1 = require("react");
29
29
  exports.SecureFieldsContext = (0, react_1.createContext)(null);
30
30
  var SecureFieldsProvider = function (_a) {
31
31
  var children = _a.children, config = __rest(_a, ["children"]);
32
- var sessionId = config.sessionId, debug = config.debug, onReady = config.onReady, onCardVaultSuccess = config.onCardVaultSuccess, onCardVaultFailure = config.onCardVaultFailure;
32
+ var sessionId = config.sessionId, debug = config.debug, font = config.font, onReady = config.onReady, onCardVaultSuccess = config.onCardVaultSuccess, onCardVaultFailure = config.onCardVaultFailure;
33
33
  var _b = (0, react_1.useState)(), secureFields = _b[0], setSecureFields = _b[1];
34
34
  (0, react_1.useEffect)(function () {
35
35
  setSecureFields(new secure_fields_1.SecureFields(config));
36
36
  // eslint-disable-next-line react-hooks/exhaustive-deps
37
37
  }, [sessionId]);
38
- (0, react_1.useEffect)(function () {
38
+ (0, react_1.useLayoutEffect)(function () {
39
39
  secureFields === null || secureFields === void 0 ? void 0 : secureFields.setDebug(debug);
40
+ font && (secureFields === null || secureFields === void 0 ? void 0 : secureFields.addFont(font));
40
41
  onReady &&
41
42
  (secureFields === null || secureFields === void 0 ? void 0 : secureFields.addEventListener(secure_fields_1.SecureFields.Events.READY, onReady));
42
43
  onCardVaultSuccess &&
@@ -1 +1 @@
1
- {"version":3,"file":"use-secure-fields.js","sourceRoot":"","sources":["../../src/hooks/use-secure-fields.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,sDAAmD;AACnD,+BAMc;AAGD,QAAA,mBAAmB,GAAG,IAAA,qBAAa,EAG7C,IAAI,CAAC,CAAA;AAED,IAAM,oBAAoB,GAAG,UAAC,EAGT;IAF1B,IAAA,QAAQ,cAAA,EACL,MAAM,cAF0B,YAGpC,CADU;IAED,IAAA,SAAS,GACf,MAAM,UADS,EAAE,KAAK,GACtB,MAAM,MADgB,EAAE,OAAO,GAC/B,MAAM,QADyB,EAAE,kBAAkB,GACnD,MAAM,mBAD6C,EAAE,kBAAkB,GACvE,MAAM,mBADiE,CACjE;IACF,IAAA,KAAkC,IAAA,gBAAQ,GAAgB,EAAzD,YAAY,QAAA,EAAE,eAAe,QAA4B,CAAA;IAEhE,IAAA,iBAAS,EAAC;QACR,eAAe,CAAC,IAAI,4BAAY,CAAC,MAAM,CAAC,CAAC,CAAA;QACzC,uDAAuD;IACzD,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;IAEf,IAAA,iBAAS,EAAC;QACR,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,QAAQ,CAAC,KAAK,CAAC,CAAA;QAC7B,OAAO;aACL,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,gBAAgB,CAAC,4BAAY,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA,CAAA;QACpE,kBAAkB;aAChB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,gBAAgB,CAC5B,4BAAY,CAAC,MAAM,CAAC,kBAAkB,EACtC,kBAAkB,CACnB,CAAA,CAAA;QACH,kBAAkB;aAChB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,gBAAgB,CAC5B,4BAAY,CAAC,MAAM,CAAC,kBAAkB,EACtC,kBAAkB,CACnB,CAAA,CAAA;QAEH,OAAO;YACL,OAAO;iBACL,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,mBAAmB,CAAC,4BAAY,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA,CAAA;YACvE,kBAAkB;iBAChB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,mBAAmB,CAC/B,4BAAY,CAAC,MAAM,CAAC,kBAAkB,EACtC,kBAAkB,CACnB,CAAA,CAAA;YACH,kBAAkB;iBAChB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,mBAAmB,CAC/B,4BAAY,CAAC,MAAM,CAAC,kBAAkB,EACtC,kBAAkB,CACnB,CAAA,CAAA;QACL,CAAC,CAAA;QACD,uDAAuD;IACzD,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;IAElB,OAAO,CACL,uBAAC,2BAAmB,CAAC,QAAQ,aAAC,KAAK,EAAE,EAAE,YAAY,cAAA,EAAE,KAAK,OAAA,EAAE,gBACzD,QAAQ,IACoB,CAChC,CAAA;AACH,CAAC,CAAA;AAlDY,QAAA,oBAAoB,wBAkDhC;AAEM,IAAM,eAAe,GAAG;IAC7B,OAAO,IAAA,kBAAU,EAAC,2BAAmB,CAAC,CAAA;AACxC,CAAC,CAAA;AAFY,QAAA,eAAe,mBAE3B"}
1
+ {"version":3,"file":"use-secure-fields.js","sourceRoot":"","sources":["../../src/hooks/use-secure-fields.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,sDAAmD;AACnD,+BAOc;AAGD,QAAA,mBAAmB,GAAG,IAAA,qBAAa,EAG7C,IAAI,CAAC,CAAA;AAED,IAAM,oBAAoB,GAAG,UAAC,EAGT;IAF1B,IAAA,QAAQ,cAAA,EACL,MAAM,cAF0B,YAGpC,CADU;IAGP,IAAA,SAAS,GAMP,MAAM,UANC,EACT,KAAK,GAKH,MAAM,MALH,EACL,IAAI,GAIF,MAAM,KAJJ,EACJ,OAAO,GAGL,MAAM,QAHD,EACP,kBAAkB,GAEhB,MAAM,mBAFU,EAClB,kBAAkB,GAChB,MAAM,mBADU,CACV;IACJ,IAAA,KAAkC,IAAA,gBAAQ,GAAgB,EAAzD,YAAY,QAAA,EAAE,eAAe,QAA4B,CAAA;IAEhE,IAAA,iBAAS,EAAC;QACR,eAAe,CAAC,IAAI,4BAAY,CAAC,MAAM,CAAC,CAAC,CAAA;QACzC,uDAAuD;IACzD,CAAC,EAAE,CAAC,SAAS,CAAC,CAAC,CAAA;IAEf,IAAA,uBAAe,EAAC;QACd,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,QAAQ,CAAC,KAAK,CAAC,CAAA;QAE7B,IAAI,KAAI,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,OAAO,CAAC,IAAI,CAAC,CAAA,CAAA;QAEnC,OAAO;aACL,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,gBAAgB,CAAC,4BAAY,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA,CAAA;QACpE,kBAAkB;aAChB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,gBAAgB,CAC5B,4BAAY,CAAC,MAAM,CAAC,kBAAkB,EACtC,kBAAkB,CACnB,CAAA,CAAA;QACH,kBAAkB;aAChB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,gBAAgB,CAC5B,4BAAY,CAAC,MAAM,CAAC,kBAAkB,EACtC,kBAAkB,CACnB,CAAA,CAAA;QAEH,OAAO;YACL,OAAO;iBACL,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,mBAAmB,CAAC,4BAAY,CAAC,MAAM,CAAC,KAAK,EAAE,OAAO,CAAC,CAAA,CAAA;YACvE,kBAAkB;iBAChB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,mBAAmB,CAC/B,4BAAY,CAAC,MAAM,CAAC,kBAAkB,EACtC,kBAAkB,CACnB,CAAA,CAAA;YACH,kBAAkB;iBAChB,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,mBAAmB,CAC/B,4BAAY,CAAC,MAAM,CAAC,kBAAkB,EACtC,kBAAkB,CACnB,CAAA,CAAA;QACL,CAAC,CAAA;QACD,uDAAuD;IACzD,CAAC,EAAE,CAAC,YAAY,CAAC,CAAC,CAAA;IAElB,OAAO,CACL,uBAAC,2BAAmB,CAAC,QAAQ,aAAC,KAAK,EAAE,EAAE,YAAY,cAAA,EAAE,KAAK,OAAA,EAAE,gBACzD,QAAQ,IACoB,CAChC,CAAA;AACH,CAAC,CAAA;AA3DY,QAAA,oBAAoB,wBA2DhC;AAEM,IAAM,eAAe,GAAG;IAC7B,OAAO,IAAA,kBAAU,EAAC,2BAAmB,CAAC,CAAA;AACxC,CAAC,CAAA;AAFY,QAAA,eAAe,mBAE3B"}
package/lib/types.d.ts CHANGED
@@ -2,6 +2,7 @@ import { Config as BaseConfig, Field as BaseField } from '@gr4vy/secure-fields';
2
2
  import { MutableRefObject } from 'react';
3
3
  export declare type Config = BaseConfig & {
4
4
  debug?: boolean;
5
+ font?: string;
5
6
  onReady?: (config: {
6
7
  version: string;
7
8
  } & BaseConfig) => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@gr4vy/secure-fields-react",
3
- "version": "0.7.0",
3
+ "version": "0.8.0",
4
4
  "description": "Gr4vy-hosted secure fields offering advanced theming, PCI compliance, event handling, and more.",
5
5
  "main": "lib/index",
6
6
  "types": "lib/index",
@@ -38,7 +38,7 @@
38
38
  "react-dom": ">=17.0.0"
39
39
  },
40
40
  "dependencies": {
41
- "@gr4vy/secure-fields": "^0.7.0"
41
+ "@gr4vy/secure-fields": "^0.8.0"
42
42
  },
43
43
  "devDependencies": {
44
44
  "@testing-library/react-hooks": "^8.0.1",
@@ -48,5 +48,5 @@
48
48
  "publishConfig": {
49
49
  "access": "public"
50
50
  },
51
- "gitHead": "3177b44cce669a3a1a8e666d02737d53fd2b687e"
51
+ "gitHead": "b5f4f0de1387377b37761fddc0ab7d4ee82a8de6"
52
52
  }