@bosonprotocol/react-kit 0.29.0-alpha.14 → 0.29.0-alpha.15

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.
@@ -1,7 +1,9 @@
1
1
  import React from "react";
2
+ import { CSSProperties } from "styled-components";
2
3
  export type PurchaseOverviewProps = {
3
4
  lookAndFeel: "regular" | "modal";
4
5
  hideModal: () => void;
6
+ modalMargin?: CSSProperties["margin"];
5
7
  };
6
8
  export declare const PurchaseOverview: React.FC<PurchaseOverviewProps>;
7
9
  //# sourceMappingURL=PurchaseOverview.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"PurchaseOverview.d.ts","sourceRoot":"","sources":["../../../../../../src/components/modal/components/PurchaseOverview/PurchaseOverview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,MAAM,qBAAqB,GAAG;IAClC,WAAW,EAAE,SAAS,GAAG,OAAO,CAAC;IACjC,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAiB5D,CAAC"}
1
+ {"version":3,"file":"PurchaseOverview.d.ts","sourceRoot":"","sources":["../../../../../../src/components/modal/components/PurchaseOverview/PurchaseOverview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAC;AAKtD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAGlD,MAAM,MAAM,qBAAqB,GAAG;IAClC,WAAW,EAAE,SAAS,GAAG,OAAO,CAAC;IACjC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;CACvC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA8B5D,CAAC"}
@@ -1,20 +1,47 @@
1
1
  "use strict";
2
+ var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
3
+ if (k2 === undefined) k2 = k;
4
+ var desc = Object.getOwnPropertyDescriptor(m, k);
5
+ if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
6
+ desc = { enumerable: true, get: function() { return m[k]; } };
7
+ }
8
+ Object.defineProperty(o, k2, desc);
9
+ }) : (function(o, m, k, k2) {
10
+ if (k2 === undefined) k2 = k;
11
+ o[k2] = m[k];
12
+ }));
13
+ var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
14
+ Object.defineProperty(o, "default", { enumerable: true, value: v });
15
+ }) : function(o, v) {
16
+ o["default"] = v;
17
+ });
18
+ var __importStar = (this && this.__importStar) || function (mod) {
19
+ if (mod && mod.__esModule) return mod;
20
+ var result = {};
21
+ if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
22
+ __setModuleDefault(result, mod);
23
+ return result;
24
+ };
2
25
  var __importDefault = (this && this.__importDefault) || function (mod) {
3
26
  return (mod && mod.__esModule) ? mod : { "default": mod };
4
27
  };
5
28
  Object.defineProperty(exports, "__esModule", { value: true });
6
29
  exports.PurchaseOverview = void 0;
7
- const react_1 = __importDefault(require("react"));
30
+ const react_1 = __importStar(require("react"));
8
31
  const PurchaseOverviewView_1 = require("../common/StepsOverview/PurchaseOverviewView");
9
32
  const NonModal_1 = __importDefault(require("../../nonModal/NonModal"));
10
33
  const BosonFooter_1 = require("../common/BosonFooter");
11
34
  const theme_1 = require("../../../../theme");
12
35
  const colors = theme_1.theme.colors.light;
13
- const PurchaseOverview = ({ lookAndFeel, hideModal }) => {
14
- return (react_1.default.createElement(NonModal_1.default, { hideModal: hideModal, footerComponent: react_1.default.createElement(BosonFooter_1.BosonFooter, null), contentStyle: {
15
- background: colors.white
16
- }, lookAndFeel: lookAndFeel, showConnectButton: false },
17
- react_1.default.createElement(PurchaseOverviewView_1.PurchaseOverviewView, null)));
36
+ const PurchaseOverview = ({ lookAndFeel, hideModal, modalMargin }) => {
37
+ const Wrapper = (0, react_1.useCallback)(({ children }) => {
38
+ return lookAndFeel === "regular" ? (react_1.default.createElement(react_1.default.Fragment, null, children)) : (react_1.default.createElement("div", { style: { margin: modalMargin } }, children));
39
+ }, [lookAndFeel, modalMargin]);
40
+ return (react_1.default.createElement(Wrapper, null,
41
+ react_1.default.createElement(NonModal_1.default, { hideModal: hideModal, footerComponent: react_1.default.createElement(BosonFooter_1.BosonFooter, null), contentStyle: {
42
+ background: colors.white
43
+ }, lookAndFeel: lookAndFeel, showConnectButton: false },
44
+ react_1.default.createElement(PurchaseOverviewView_1.PurchaseOverviewView, null))));
18
45
  };
19
46
  exports.PurchaseOverview = PurchaseOverview;
20
47
  //# sourceMappingURL=PurchaseOverview.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PurchaseOverview.js","sourceRoot":"","sources":["../../../../../../src/components/modal/components/PurchaseOverview/PurchaseOverview.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,uFAAoF;AACpF,uEAA+C;AAC/C,uDAAoD;AACpD,6CAA0C;AAC1C,MAAM,MAAM,GAAG,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AAO3B,MAAM,gBAAgB,GAAoC,CAAC,EAChE,WAAW,EACX,SAAS,EACV,EAAE,EAAE;IACH,OAAO,CACL,8BAAC,kBAAQ,IACP,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,8BAAC,yBAAW,OAAG,EAChC,YAAY,EAAE;YACZ,UAAU,EAAE,MAAM,CAAC,KAAK;SACzB,EACD,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,KAAK;QAExB,8BAAC,2CAAoB,OAAG,CACf,CACZ,CAAC;AACJ,CAAC,CAAC;AAjBW,QAAA,gBAAgB,oBAiB3B"}
1
+ {"version":3,"file":"PurchaseOverview.js","sourceRoot":"","sources":["../../../../../../src/components/modal/components/PurchaseOverview/PurchaseOverview.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAAsD;AACtD,uFAAoF;AACpF,uEAA+C;AAC/C,uDAAoD;AACpD,6CAA0C;AAE1C,MAAM,MAAM,GAAG,aAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AAQ3B,MAAM,gBAAgB,GAAoC,CAAC,EAChE,WAAW,EACX,SAAS,EACT,WAAW,EACZ,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,IAAA,mBAAW,EACzB,CAAC,EAAE,QAAQ,EAA2B,EAAE,EAAE;QACxC,OAAO,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,CACjC,8DAAG,QAAQ,CAAI,CAChB,CAAC,CAAC,CAAC,CACF,uCAAK,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,IAAG,QAAQ,CAAO,CACtD,CAAC;IACJ,CAAC,EACD,CAAC,WAAW,EAAE,WAAW,CAAC,CAC3B,CAAC;IACF,OAAO,CACL,8BAAC,OAAO;QACN,8BAAC,kBAAQ,IACP,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,8BAAC,yBAAW,OAAG,EAChC,YAAY,EAAE;gBACZ,UAAU,EAAE,MAAM,CAAC,KAAK;aACzB,EACD,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,KAAK;YAExB,8BAAC,2CAAoB,OAAG,CACf,CACH,CACX,CAAC;AACJ,CAAC,CAAC;AA9BW,QAAA,gBAAgB,oBA8B3B"}
@@ -1,7 +1,9 @@
1
1
  import React from "react";
2
+ import { CSSProperties } from "styled-components";
2
3
  export type PurchaseOverviewProps = {
3
4
  lookAndFeel: "regular" | "modal";
4
5
  hideModal: () => void;
6
+ modalMargin?: CSSProperties["margin"];
5
7
  };
6
8
  export declare const PurchaseOverview: React.FC<PurchaseOverviewProps>;
7
9
  //# sourceMappingURL=PurchaseOverview.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"PurchaseOverview.d.ts","sourceRoot":"","sources":["../../../../../../src/components/modal/components/PurchaseOverview/PurchaseOverview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAO1B,MAAM,MAAM,qBAAqB,GAAG;IAClC,WAAW,EAAE,SAAS,GAAG,OAAO,CAAC;IACjC,SAAS,EAAE,MAAM,IAAI,CAAC;CACvB,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CAiB5D,CAAC"}
1
+ {"version":3,"file":"PurchaseOverview.d.ts","sourceRoot":"","sources":["../../../../../../src/components/modal/components/PurchaseOverview/PurchaseOverview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAiC,MAAM,OAAO,CAAC;AAKtD,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAGlD,MAAM,MAAM,qBAAqB,GAAG;IAClC,WAAW,EAAE,SAAS,GAAG,OAAO,CAAC;IACjC,SAAS,EAAE,MAAM,IAAI,CAAC;IACtB,WAAW,CAAC,EAAE,aAAa,CAAC,QAAQ,CAAC,CAAC;CACvC,CAAC;AAEF,eAAO,MAAM,gBAAgB,EAAE,KAAK,CAAC,EAAE,CAAC,qBAAqB,CA8B5D,CAAC"}
@@ -1,13 +1,17 @@
1
- import React from "react";
1
+ import React, { useCallback } from "react";
2
2
  import { PurchaseOverviewView } from "../common/StepsOverview/PurchaseOverviewView";
3
3
  import NonModal from "../../nonModal/NonModal";
4
4
  import { BosonFooter } from "../common/BosonFooter";
5
5
  import { theme } from "../../../../theme";
6
6
  const colors = theme.colors.light;
7
- export const PurchaseOverview = ({ lookAndFeel, hideModal }) => {
8
- return (React.createElement(NonModal, { hideModal: hideModal, footerComponent: React.createElement(BosonFooter, null), contentStyle: {
9
- background: colors.white
10
- }, lookAndFeel: lookAndFeel, showConnectButton: false },
11
- React.createElement(PurchaseOverviewView, null)));
7
+ export const PurchaseOverview = ({ lookAndFeel, hideModal, modalMargin }) => {
8
+ const Wrapper = useCallback(({ children }) => {
9
+ return lookAndFeel === "regular" ? (React.createElement(React.Fragment, null, children)) : (React.createElement("div", { style: { margin: modalMargin } }, children));
10
+ }, [lookAndFeel, modalMargin]);
11
+ return (React.createElement(Wrapper, null,
12
+ React.createElement(NonModal, { hideModal: hideModal, footerComponent: React.createElement(BosonFooter, null), contentStyle: {
13
+ background: colors.white
14
+ }, lookAndFeel: lookAndFeel, showConnectButton: false },
15
+ React.createElement(PurchaseOverviewView, null))));
12
16
  };
13
17
  //# sourceMappingURL=PurchaseOverview.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"PurchaseOverview.js","sourceRoot":"","sources":["../../../../../../src/components/modal/components/PurchaseOverview/PurchaseOverview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAC1B,OAAO,EAAE,oBAAoB,EAAE,MAAM,8CAA8C,CAAC;AACpF,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC1C,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AAOlC,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAChE,WAAW,EACX,SAAS,EACV,EAAE,EAAE;IACH,OAAO,CACL,oBAAC,QAAQ,IACP,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,oBAAC,WAAW,OAAG,EAChC,YAAY,EAAE;YACZ,UAAU,EAAE,MAAM,CAAC,KAAK;SACzB,EACD,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,KAAK;QAExB,oBAAC,oBAAoB,OAAG,CACf,CACZ,CAAC;AACJ,CAAC,CAAC"}
1
+ {"version":3,"file":"PurchaseOverview.js","sourceRoot":"","sources":["../../../../../../src/components/modal/components/PurchaseOverview/PurchaseOverview.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,EAAa,WAAW,EAAE,MAAM,OAAO,CAAC;AACtD,OAAO,EAAE,oBAAoB,EAAE,MAAM,8CAA8C,CAAC;AACpF,OAAO,QAAQ,MAAM,yBAAyB,CAAC;AAC/C,OAAO,EAAE,WAAW,EAAE,MAAM,uBAAuB,CAAC;AACpD,OAAO,EAAE,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAE1C,MAAM,MAAM,GAAG,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC;AAQlC,MAAM,CAAC,MAAM,gBAAgB,GAAoC,CAAC,EAChE,WAAW,EACX,SAAS,EACT,WAAW,EACZ,EAAE,EAAE;IACH,MAAM,OAAO,GAAG,WAAW,CACzB,CAAC,EAAE,QAAQ,EAA2B,EAAE,EAAE;QACxC,OAAO,WAAW,KAAK,SAAS,CAAC,CAAC,CAAC,CACjC,0CAAG,QAAQ,CAAI,CAChB,CAAC,CAAC,CAAC,CACF,6BAAK,KAAK,EAAE,EAAE,MAAM,EAAE,WAAW,EAAE,IAAG,QAAQ,CAAO,CACtD,CAAC;IACJ,CAAC,EACD,CAAC,WAAW,EAAE,WAAW,CAAC,CAC3B,CAAC;IACF,OAAO,CACL,oBAAC,OAAO;QACN,oBAAC,QAAQ,IACP,SAAS,EAAE,SAAS,EACpB,eAAe,EAAE,oBAAC,WAAW,OAAG,EAChC,YAAY,EAAE;gBACZ,UAAU,EAAE,MAAM,CAAC,KAAK;aACzB,EACD,WAAW,EAAE,WAAW,EACxB,iBAAiB,EAAE,KAAK;YAExB,oBAAC,oBAAoB,OAAG,CACf,CACH,CACX,CAAC;AACJ,CAAC,CAAC"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bosonprotocol/react-kit",
3
3
  "description": "React toolkit with smart components and hooks for building on top of the Boson Protocol.",
4
- "version": "0.29.0-alpha.14",
4
+ "version": "0.29.0-alpha.15",
5
5
  "main": "./dist/cjs/index.js",
6
6
  "module": "./dist/esm/index.js",
7
7
  "types": "./dist/cjs/index.d.ts",
@@ -15,8 +15,8 @@
15
15
  "license": "Apache-2.0",
16
16
  "dependencies": {
17
17
  "@bosonprotocol/chat-sdk": "^1.3.1-alpha.9",
18
- "@bosonprotocol/core-sdk": "^1.40.0-alpha.14",
19
- "@bosonprotocol/ethers-sdk": "^1.14.0-alpha.14",
18
+ "@bosonprotocol/core-sdk": "^1.40.0-alpha.15",
19
+ "@bosonprotocol/ethers-sdk": "^1.14.0-alpha.15",
20
20
  "@bosonprotocol/ipfs-storage": "^1.11.2",
21
21
  "@davatar/react": "1.11.1",
22
22
  "@ethersproject/units": "5.6.0",
@@ -169,5 +169,5 @@
169
169
  "overrides": {
170
170
  "typescript": "^5.1.6"
171
171
  },
172
- "gitHead": "a5579c902cce2a5a96e923af8b05f9a4bd3a7ef4"
172
+ "gitHead": "76ad7aa2afb9e70da4e9b1b3cefc373f4099a0e8"
173
173
  }
@@ -1,30 +1,45 @@
1
- import React from "react";
1
+ import React, { ReactNode, useCallback } from "react";
2
2
  import { PurchaseOverviewView } from "../common/StepsOverview/PurchaseOverviewView";
3
3
  import NonModal from "../../nonModal/NonModal";
4
4
  import { BosonFooter } from "../common/BosonFooter";
5
5
  import { theme } from "../../../../theme";
6
+ import { CSSProperties } from "styled-components";
6
7
  const colors = theme.colors.light;
7
8
 
8
9
  export type PurchaseOverviewProps = {
9
10
  lookAndFeel: "regular" | "modal";
10
11
  hideModal: () => void;
12
+ modalMargin?: CSSProperties["margin"];
11
13
  };
12
14
 
13
15
  export const PurchaseOverview: React.FC<PurchaseOverviewProps> = ({
14
16
  lookAndFeel,
15
- hideModal
17
+ hideModal,
18
+ modalMargin
16
19
  }) => {
20
+ const Wrapper = useCallback(
21
+ ({ children }: { children: ReactNode }) => {
22
+ return lookAndFeel === "regular" ? (
23
+ <>{children}</>
24
+ ) : (
25
+ <div style={{ margin: modalMargin }}>{children}</div>
26
+ );
27
+ },
28
+ [lookAndFeel, modalMargin]
29
+ );
17
30
  return (
18
- <NonModal
19
- hideModal={hideModal}
20
- footerComponent={<BosonFooter />}
21
- contentStyle={{
22
- background: colors.white
23
- }}
24
- lookAndFeel={lookAndFeel}
25
- showConnectButton={false}
26
- >
27
- <PurchaseOverviewView />
28
- </NonModal>
31
+ <Wrapper>
32
+ <NonModal
33
+ hideModal={hideModal}
34
+ footerComponent={<BosonFooter />}
35
+ contentStyle={{
36
+ background: colors.white
37
+ }}
38
+ lookAndFeel={lookAndFeel}
39
+ showConnectButton={false}
40
+ >
41
+ <PurchaseOverviewView />
42
+ </NonModal>
43
+ </Wrapper>
29
44
  );
30
45
  };
@@ -24,5 +24,6 @@ export const Base: ComponentStory<typeof PurchaseOverview> = Template.bind({});
24
24
  // More on args: https://storybook.js.org/docs/react/writing-stories/args
25
25
  Base.args = {
26
26
  hideModal: () => console.log("hideModal"),
27
- lookAndFeel: "modal"
27
+ lookAndFeel: "modal",
28
+ modalMargin: "2%"
28
29
  };