@prosopo/procaptcha-react 0.1.0 → 0.1.4

package/README.md

@@ -0,0 +1,36 @@
+# React Prosopo Procaptcha Component Library
+
+React components for integrating the Prosopo [procaptcha](https://github.com/prosopo-io/procaptcha) into a React app.
+
+Prosopo is a distributed human verification service that can be used to stop bots from interacting with smart contracts. Sign up to be a network [alpha tester](https://5b06hrhtlmh.typeform.com/to/vNpyOUfg).
+
+## Installation
+
+You can install this library with:
+
+```bash
+npm install @prosopo/procaptcha-react --save
+```
+
+## Basic Usage
+
+See the [client example](https://github.com/prosopo-io/client-example) for a minimal example of these components being used in a frontend app.
+
+```typescript
+<Box className={"App"}>
+
+  
+      <CaptchaContextManager.Provider value={manager}>
+        {showCaptchas &&
+          <CaptchaComponent {...{ clientInterface }} />}
+      </CaptchaContextManager.Provider>
+
+      {!showCaptchas &&
+        <Button onClick={showCaptchaClick} className={"iAmHumanButton"}>
+          <Typography className={"iAmHumanButtonLabel"}>
+            I am human
+          </Typography>
+        </Button>}
+
+    </Box>
+```

package/dist/components/CaptchaComponent.d.ts

@@ -0,0 +1,6 @@
+import { ProsopoCaptchaClient } from "@prosopo/procaptcha";
+export declare function CaptchaComponent({ clientInterface }: {
+    clientInterface: ProsopoCaptchaClient;
+}): JSX.Element;
+export default CaptchaComponent;
+//# sourceMappingURL=CaptchaComponent.d.ts.map

package/dist/components/CaptchaComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaptchaComponent.d.ts","sourceRoot":"","sources":["../../src/components/CaptchaComponent.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAEH,oBAAoB,EAGvB,MAAM,qBAAqB,CAAC;AAQ7B,wBAAgB,gBAAgB,CAAC,EAAE,eAAe,EAAE,EAAE;IAAE,eAAe,EAAE,oBAAoB,CAAA;CAAE,eA+E9F;AAED,eAAe,gBAAgB,CAAC"}

package/{src/components/CaptchaComponent.tsx → dist/components/CaptchaComponent.js}

@@ -1,3 +1,4 @@
+import { jsxs as _jsxs, jsx as _jsx } from "react/jsx-runtime";
 // Copyright (C) 2021-2022 Prosopo (UK) Ltd.
 // This file is part of procaptcha-react <https://github.com/prosopo-io/procaptcha-react>.
 //
@@ -15,38 +16,21 @@
 // along with procaptcha-react.  If not, see <http://www.gnu.org/licenses/>.
 import { useEffect, useContext, useReducer } from "react";
 import { Box, Button, Typography } from "@mui/material";
-import {
-    ICaptchaContextReducer,
-    ProsopoCaptchaClient,
-    ProsopoCaptchaStateClient,
-    captchaStateReducer
-} from "@prosopo/procaptcha";
-
+import { ProsopoCaptchaStateClient, captchaStateReducer } from "@prosopo/procaptcha";
 import { CaptchaContextManager } from "./CaptchaManager";
 import { CaptchaWidget } from "./CaptchaWidget";
-
 import { useStyles } from "../styles";
-
-
-export function CaptchaComponent({ clientInterface }: { clientInterface: ProsopoCaptchaClient }) {
-
+export function CaptchaComponent({ clientInterface }) {
     const classes = useStyles();
-
-    const manager: ICaptchaContextReducer = useContext(CaptchaContextManager);
+    const manager = useContext(CaptchaContextManager);
     const [state, update] = useReducer(captchaStateReducer, { captchaIndex: 0, captchaSolution: [] });
-
     const { account, contractAddress } = manager.state;
     const { captchaChallenge, captchaIndex, captchaSolution } = state;
     const totalCaptchas = captchaChallenge?.captchas.length ?? 0;
-
     const stateClientInterface = new ProsopoCaptchaStateClient(clientInterface, { state, update });
-
     useEffect(() => {
-
         clientInterface.onLoad();
-
     }, []);
-
     useEffect(() => {
         const extension = clientInterface.getExtension();
         if (contractAddress && extension) {
@@ -57,56 +41,18 @@ export function CaptchaComponent({ clientInterface }: { clientInterface: Prosopo
             }
         }
     }, [contractAddress]);
-
     useEffect(() => {
         if (account && !captchaChallenge) {
             stateClientInterface.onLoadCaptcha()
                 .catch(error => {
-                    clientInterface.status.update({ error });
-                });
+                clientInterface.status.update({ error });
+            });
         }
     }, [account]);
-
     // TODO text strings
     // https://www.npmjs.com/package/i18next
-
-    return (
-        <Box className={classes.root}>
-
-            {account && captchaChallenge &&
-                <Box className={classes.captchasContainer}>
-
-                    <Box className={classes.captchasHeader}>
-                        <Typography className={classes.captchasHeaderLabel}>
-                            Select all images with {captchaChallenge.captchas[captchaIndex].captcha.target}
-                        </Typography>
-                    </Box>
-
-                    <Box className={classes.captchasBody}>
-
-                        <CaptchaWidget challenge={captchaChallenge.captchas[captchaIndex]} solution={captchaSolution[captchaIndex] || []}
-                            onChange={stateClientInterface.onChange.bind(stateClientInterface)} />
-
-                        <Box className={classes.dotsContainer}>
-                            {captchaChallenge?.captchas.map((_, index) =>
-                                <Box key={index} className={captchaIndex === index ? classes.dot : classes.dotActive} />)}
-                        </Box>
-
-                    </Box>
-
-                    <Box className={classes.captchasFooter}>
-                        <Button onClick={() => stateClientInterface.onCancel()} variant="text">
-                            Cancel
-                        </Button>
-                        <Button onClick={() => stateClientInterface.onSubmit()} variant="contained">
-                            {captchaIndex + 1 < totalCaptchas ? "Next" : "Submit"}
-                        </Button>
-                    </Box>
-
-                </Box>
-            }
-        </Box>
-    );
+    return (_jsx(Box, { className: classes.root, children: account && captchaChallenge &&
+            _jsxs(Box, { className: classes.captchasContainer, children: [_jsx(Box, { className: classes.captchasHeader, children: _jsxs(Typography, { className: classes.captchasHeaderLabel, children: ["Select all images with ", captchaChallenge.captchas[captchaIndex].captcha.target] }) }), _jsxs(Box, { className: classes.captchasBody, children: [_jsx(CaptchaWidget, { challenge: captchaChallenge.captchas[captchaIndex], solution: captchaSolution[captchaIndex] || [], onChange: stateClientInterface.onChange.bind(stateClientInterface) }), _jsx(Box, { className: classes.dotsContainer, children: captchaChallenge?.captchas.map((_, index) => _jsx(Box, { className: captchaIndex === index ? classes.dot : classes.dotActive }, index)) })] }), _jsxs(Box, { className: classes.captchasFooter, children: [_jsx(Button, { onClick: () => stateClientInterface.onCancel(), variant: "text", children: "Cancel" }), _jsx(Button, { onClick: () => stateClientInterface.onSubmit(), variant: "contained", children: captchaIndex + 1 < totalCaptchas ? "Next" : "Submit" })] })] }) }));
 }
-
 export default CaptchaComponent;
+//# sourceMappingURL=CaptchaComponent.js.map

package/dist/components/CaptchaComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaptchaComponent.js","sourceRoot":"","sources":["../../src/components/CaptchaComponent.tsx"],"names":[],"mappings":"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"}

package/dist/components/CaptchaManager.d.ts

@@ -0,0 +1,5 @@
+/// <reference types="react" />
+import { ICaptchaContextState, ICaptchaContextReducer, ProsopoCaptchaClient, CaptchaEventCallbacks } from "@prosopo/procaptcha";
+export declare function useCaptcha(defaultContext: ICaptchaContextState, callbacks?: CaptchaEventCallbacks): ProsopoCaptchaClient;
+export declare const CaptchaContextManager: import("react").Context<ICaptchaContextReducer>;
+//# sourceMappingURL=CaptchaManager.d.ts.map

package/dist/components/CaptchaManager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaptchaManager.d.ts","sourceRoot":"","sources":["../../src/components/CaptchaManager.ts"],"names":[],"mappings":";AAiBA,OAAO,EACH,oBAAoB,EAGpB,sBAAsB,EACtB,oBAAoB,EACpB,qBAAqB,EACxB,MAAM,qBAAqB,CAAC;AAG7B,wBAAgB,UAAU,CAAC,cAAc,EAAE,oBAAoB,EAAE,SAAS,CAAC,EAAE,qBAAqB,GAAG,oBAAoB,CAIxH;AAED,eAAO,MAAM,qBAAqB,iDAWN,CAAC"}

package/{src/components/CaptchaManager.ts → dist/components/CaptchaManager.js}

@@ -13,31 +13,23 @@
 //
 // You should have received a copy of the GNU General Public License
 // along with procaptcha-react.  If not, see <http://www.gnu.org/licenses/>.
-
 import { createContext, useReducer } from "react";
-import {
-    ICaptchaContextState,
-    captchaContextReducer,
-    captchaStatusReducer,
-    ICaptchaContextReducer,
-    ProsopoCaptchaClient,
-    CaptchaEventCallbacks,
-} from "@prosopo/procaptcha";
-
-
-export function useCaptcha(defaultContext: ICaptchaContextState, callbacks?: CaptchaEventCallbacks): ProsopoCaptchaClient {
+import { captchaContextReducer, captchaStatusReducer, ProsopoCaptchaClient, } from "@prosopo/procaptcha";
+export function useCaptcha(defaultContext, callbacks) {
     const [context, updateContext] = useReducer(captchaContextReducer, defaultContext);
     const [status, updateStatus] = useReducer(captchaStatusReducer, {});
     return new ProsopoCaptchaClient({ state: context, update: updateContext }, { state: status, update: updateStatus }, callbacks);
 }
-
 export const CaptchaContextManager = createContext({
     state: {
         config: {
             "providerApi.baseURL": "",
             "providerApi.prefix": "",
-            "dappAccount": ""
+            "dappAccount": "",
+            "dappUrl": "",
+            "solutionThreshold": 0
         }
-    }, 
-    update: () => {},
-} as ICaptchaContextReducer);
+    },
+    update: () => { },
+});
+//# sourceMappingURL=CaptchaManager.js.map

package/dist/components/CaptchaManager.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaptchaManager.js","sourceRoot":"","sources":["../../src/components/CaptchaManager.ts"],"names":[],"mappings":"AAAA,4CAA4C;AAC5C,0FAA0F;AAC1F,EAAE;AACF,2EAA2E;AAC3E,uEAAuE;AACvE,oEAAoE;AACpE,sCAAsC;AACtC,EAAE;AACF,sEAAsE;AACtE,iEAAiE;AACjE,gEAAgE;AAChE,+CAA+C;AAC/C,EAAE;AACF,oEAAoE;AACpE,4EAA4E;AAE5E,OAAO,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AAClD,OAAO,EAEH,qBAAqB,EACrB,oBAAoB,EAEpB,oBAAoB,GAEvB,MAAM,qBAAqB,CAAC;AAG7B,MAAM,UAAU,UAAU,CAAC,cAAoC,EAAE,SAAiC;IAC9F,MAAM,CAAC,OAAO,EAAE,aAAa,CAAC,GAAG,UAAU,CAAC,qBAAqB,EAAE,cAAc,CAAC,CAAC;IACnF,MAAM,CAAC,MAAM,EAAE,YAAY,CAAC,GAAG,UAAU,CAAC,oBAAoB,EAAE,EAAE,CAAC,CAAC;IACpE,OAAO,IAAI,oBAAoB,CAAC,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,EAAE,aAAa,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,EAAE,YAAY,EAAE,EAAE,SAAS,CAAC,CAAC;AACnI,CAAC;AAED,MAAM,CAAC,MAAM,qBAAqB,GAAG,aAAa,CAAC;IAC/C,KAAK,EAAE;QACH,MAAM,EAAE;YACJ,qBAAqB,EAAE,EAAE;YACzB,oBAAoB,EAAE,EAAE;YACxB,aAAa,EAAE,EAAE;YACjB,SAAS,EAAE,EAAE;YACb,mBAAmB,EAAE,CAAC;SACzB;KACJ;IACD,MAAM,EAAE,GAAG,EAAE,GAAE,CAAC;CACO,CAAC,CAAC"}

package/dist/components/CaptchaWidget.d.ts

@@ -0,0 +1,8 @@
+import { CaptchaResponseCaptcha } from "@prosopo/procaptcha";
+export declare function CaptchaWidget({ challenge, solution, onChange }: {
+    challenge: CaptchaResponseCaptcha;
+    solution: number[];
+    onChange: (index: number) => void;
+}): JSX.Element;
+export default CaptchaWidget;
+//# sourceMappingURL=CaptchaWidget.d.ts.map

package/dist/components/CaptchaWidget.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaptchaWidget.d.ts","sourceRoot":"","sources":["../../src/components/CaptchaWidget.tsx"],"names":[],"mappings":"AAgBA,OAAO,EAAE,sBAAsB,EAAE,MAAM,qBAAqB,CAAC;AAK7D,wBAAgB,aAAa,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAC3D;IAAC,SAAS,EAAE,sBAAsB,CAAC;IAAC,QAAQ,EAAE,MAAM,EAAE,CAAC;IAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CAAC,eAkB3F;AAED,eAAe,aAAa,CAAC"}

package/{src/components/CaptchaWidget.tsx → dist/components/CaptchaWidget.js}

@@ -1,3 +1,4 @@
+import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 // Copyright (C) 2021-2022 Prosopo (UK) Ltd.
 // This file is part of procaptcha-react <https://github.com/prosopo-io/procaptcha-react>.
 //
@@ -14,30 +15,14 @@
 // You should have received a copy of the GNU General Public License
 // along with procaptcha-react.  If not, see <http://www.gnu.org/licenses/>.
 import { Avatar } from "@mui/material";
-import { CaptchaResponseCaptcha } from "@prosopo/procaptcha";
-
 import { useStyles } from "../styles";
-
-
-export function CaptchaWidget({ challenge, solution, onChange }:
-    {challenge: CaptchaResponseCaptcha, solution: number[], onChange: (index: number) => void}) {
+export function CaptchaWidget({ challenge, solution, onChange }) {
     // TODO challenge.items
     //const items = Array.from(Array(9).keys());
     console.log("CHALLENGE", challenge);
     const items = challenge.captcha.items;
     const classes = useStyles();
-
-    return (
-      <>
-        {items.map((item, index) => <Avatar
-          key={index}
-          src={item.path} // TODO challenge.items[].path...
-          variant="square"
-          className={classes.captchaItem + " " + (solution.includes(index) ? " selected" : "")}
-          onClick={() => onChange(index)} />
-        )}
-      </>
-    );
-  }
-
-  export default CaptchaWidget;
+    return (_jsx(_Fragment, { children: items.map((item, index) => _jsx(Avatar, { src: item.path, variant: "square", className: classes.captchaItem + " " + (solution.includes(index) ? " " + classes.captchaItemSelected : ""), onClick: () => onChange(index) }, index)) }));
+}
+export default CaptchaWidget;
+//# sourceMappingURL=CaptchaWidget.js.map

package/dist/components/CaptchaWidget.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"CaptchaWidget.js","sourceRoot":"","sources":["../../src/components/CaptchaWidget.tsx"],"names":[],"mappings":";AAAA,4CAA4C;AAC5C,0FAA0F;AAC1F,EAAE;AACF,2EAA2E;AAC3E,uEAAuE;AACvE,oEAAoE;AACpE,sCAAsC;AACtC,EAAE;AACF,sEAAsE;AACtE,iEAAiE;AACjE,gEAAgE;AAChE,+CAA+C;AAC/C,EAAE;AACF,oEAAoE;AACpE,4EAA4E;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,eAAe,CAAC;AAGvC,OAAO,EAAE,SAAS,EAAE,MAAM,WAAW,CAAC;AAGtC,MAAM,UAAU,aAAa,CAAC,EAAE,SAAS,EAAE,QAAQ,EAAE,QAAQ,EACiC;IAC1F,uBAAuB;IACvB,4CAA4C;IAC5C,OAAO,CAAC,GAAG,CAAC,WAAW,EAAE,SAAS,CAAC,CAAC;IACpC,MAAM,KAAK,GAAG,SAAS,CAAC,OAAO,CAAC,KAAK,CAAC;IACtC,MAAM,OAAO,GAAG,SAAS,EAAE,CAAC;IAE5B,OAAO,CACL,4BACG,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,KAAC,MAAM,IAEjC,GAAG,EAAE,IAAI,CAAC,IAAI,EACd,OAAO,EAAC,QAAQ,EAChB,SAAS,EAAE,OAAO,CAAC,WAAW,GAAG,GAAG,GAAG,CAAC,QAAQ,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,GAAG,GAAG,OAAO,CAAC,mBAAmB,CAAC,CAAC,CAAC,EAAE,CAAC,EAC1G,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,IAJzB,KAAK,CAIwB,CACnC,GACA,CACJ,CAAC;AACJ,CAAC;AAED,eAAe,aAAa,CAAC"}

package/dist/components/ExtensionAccountSelect.d.ts

@@ -0,0 +1,8 @@
+import { TExtensionAccount } from "@prosopo/procaptcha";
+export declare const ExtensionAccountSelect: ({ value, options, onChange }: {
+    value?: import("@polkadot/extension-inject/types").InjectedAccountWithMeta | undefined;
+    options: TExtensionAccount[];
+    onChange: (value: TExtensionAccount | null) => void;
+}) => JSX.Element;
+export default ExtensionAccountSelect;
+//# sourceMappingURL=ExtensionAccountSelect.d.ts.map

package/dist/components/ExtensionAccountSelect.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExtensionAccountSelect.d.ts","sourceRoot":"","sources":["../../src/components/ExtensionAccountSelect.tsx"],"names":[],"mappings":"AAiBA,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AAGxD,eAAO,MAAM,sBAAsB;;aACU,iBAAiB,EAAE;sBAAoB,iBAAiB,GAAG,IAAI,KAAK,IAAI;iBAcpH,CAAA;AAED,eAAe,sBAAsB,CAAC"}

package/dist/components/ExtensionAccountSelect.js

@@ -0,0 +1,8 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { Autocomplete, TextField } from "@mui/material";
+export const ExtensionAccountSelect = ({ value, options, onChange }) => {
+    return (_jsx(Autocomplete, { disablePortal: true, id: "select-accounts" // TODO
+        , options: options, value: value, isOptionEqualToValue: (option, value) => option.address === value.address, onChange: (event, value) => onChange(value), sx: { width: 550 }, getOptionLabel: (option) => `${option.meta.name}\n${option.address}`, renderInput: (props) => _jsx(TextField, { ...props, label: "Select account" }) }));
+};
+export default ExtensionAccountSelect;
+//# sourceMappingURL=ExtensionAccountSelect.js.map

package/dist/components/ExtensionAccountSelect.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ExtensionAccountSelect.js","sourceRoot":"","sources":["../../src/components/ExtensionAccountSelect.tsx"],"names":[],"mappings":";AAgBA,OAAO,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAIxD,MAAM,CAAC,MAAM,sBAAsB,GAAG,CAAC,EAAC,KAAK,EAAE,OAAO,EAAE,QAAQ,EACsD,EAAE,EAAE;IACtH,OAAO,CACH,KAAC,YAAY,IACT,aAAa,QACb,EAAE,EAAC,iBAAiB,CAAC,OAAO;UAC5B,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,KAAK,EACZ,oBAAoB,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,EAAE,CAAC,MAAM,CAAC,OAAO,KAAK,KAAK,CAAC,OAAO,EACzE,QAAQ,EAAE,CAAC,KAAqC,EAAE,KAA+B,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,EACrG,EAAE,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,EAClB,cAAc,EAAE,CAAC,MAAW,EAAE,EAAE,CAAC,GAAG,MAAM,CAAC,IAAI,CAAC,IAAI,KAAK,MAAM,CAAC,OAAO,EAAE,EACzE,WAAW,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,KAAC,SAAS,OAAK,KAAK,EAAE,KAAK,EAAC,gBAAgB,GAAG,GACzE,CACL,CAAC;AACN,CAAC,CAAA;AAED,eAAe,sBAAsB,CAAC"}

package/dist/components/index.d.ts

@@ -0,0 +1,5 @@
+export * from './CaptchaManager';
+export * from './CaptchaWidget';
+export * from './CaptchaComponent';
+export * from './ExtensionAccountSelect';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAeA,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC"}

package/{src/components/index.ts → dist/components/index.js}

@@ -17,3 +17,4 @@ export * from './CaptchaManager';
 export * from './CaptchaWidget';
 export * from './CaptchaComponent';
 export * from './ExtensionAccountSelect';
+//# sourceMappingURL=index.js.map

package/dist/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,4CAA4C;AAC5C,0FAA0F;AAC1F,EAAE;AACF,2EAA2E;AAC3E,uEAAuE;AACvE,oEAAoE;AACpE,sCAAsC;AACtC,EAAE;AACF,sEAAsE;AACtE,iEAAiE;AACjE,gEAAgE;AAChE,+CAA+C;AAC/C,EAAE;AACF,oEAAoE;AACpE,4EAA4E;AAC5E,cAAc,kBAAkB,CAAC;AACjC,cAAc,iBAAiB,CAAC;AAChC,cAAc,oBAAoB,CAAC;AACnC,cAAc,0BAA0B,CAAC"}

package/dist/index.d.ts

@@ -0,0 +1,3 @@
+export * from './components';
+export * from './styles';
+//# sourceMappingURL=index.d.ts.map

package/dist/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAeA,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC"}

package/{src/index.ts → dist/index.js}

@@ -15,3 +15,4 @@
 // along with procaptcha-react.  If not, see <http://www.gnu.org/licenses/>.
 export * from './components';
 export * from './styles';
+//# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,4CAA4C;AAC5C,0FAA0F;AAC1F,EAAE;AACF,2EAA2E;AAC3E,uEAAuE;AACvE,oEAAoE;AACpE,sCAAsC;AACtC,EAAE;AACF,sEAAsE;AACtE,iEAAiE;AACjE,gEAAgE;AAChE,+CAA+C;AAC/C,EAAE;AACF,oEAAoE;AACpE,4EAA4E;AAC5E,cAAc,cAAc,CAAC;AAC7B,cAAc,UAAU,CAAC"}

package/dist/styles.d.ts

@@ -0,0 +1,2 @@
+export declare const useStyles: (props?: any) => import("@mui/styles").ClassNameMap<"root" | "dot" | "captchasContainer" | "captchasHeader" | "captchasBody" | "captchasFooter" | "captchaItem" | "captchaItemSelected" | "captchasHeaderLabel" | "dotsContainer" | "dotActive">;
+//# sourceMappingURL=styles.d.ts.map

package/dist/styles.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.d.ts","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AA0BA,eAAO,MAAM,SAAS,kPAiEpB,CAAC"}

package/dist/styles.js

@@ -0,0 +1,91 @@
+// Copyright (C) 2021-2022 Prosopo (UK) Ltd.
+// This file is part of procaptcha-react <https://github.com/prosopo-io/procaptcha-react>.
+//
+// procaptcha-react is free software: you can redistribute it and/or modify
+// it under the terms of the GNU General Public License as published by
+// the Free Software Foundation, either version 3 of the License, or
+// (at your option) any later version.
+//
+// procaptcha-react is distributed in the hope that it will be useful,
+// but WITHOUT ANY WARRANTY; without even the implied warranty of
+// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+// GNU General Public License for more details.
+//
+// You should have received a copy of the GNU General Public License
+// along with procaptcha-react.  If not, see <http://www.gnu.org/licenses/>.
+import { makeStyles } from "@mui/styles";
+const dot = {
+    width: 7,
+    height: 7,
+    borderRadius: 3.5,
+    marginRight: 5,
+    border: "1px solid #CFCFCF",
+    backgroundColor: "#FFFFFF",
+};
+export const useStyles = makeStyles({
+    root: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width: "100%",
+        height: "100%"
+    },
+    captchasContainer: {
+        display: "flex",
+        flexDirection: "column",
+        background: "#FFFFFF",
+        border: "1px solid #CFCFCF",
+        boxShadow: "0px 2px 4px rgba(0, 0, 0, 0.2)"
+    },
+    captchasHeader: {
+        display: "flex",
+        alignItems: "center",
+        backgroundColor: "#bdbdbd",
+        height: 80,
+        paddingLeft: 20
+    },
+    captchasBody: {
+        display: "flex",
+        width: 460,
+        flexWrap: "wrap",
+        height: "max-content",
+        paddingTop: 10,
+        paddingLeft: 10,
+        borderBottom: "1px solid #CFCFCF"
+    },
+    captchasFooter: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "space-between",
+        height: 80,
+        paddingLeft: 20,
+        paddingRight: 20
+    },
+    captchaItem: {
+        width: "140px !important",
+        borderRadius: 2,
+        height: "140px !important",
+        marginRight: 10,
+        marginBottom: 10
+    },
+    captchaItemSelected: {
+        border: "2px solid #1976d2"
+    },
+    captchasHeaderLabel: {
+        color: "#ffffff"
+    },
+    dotsContainer: {
+        display: "flex",
+        alignItems: "center",
+        justifyContent: "center",
+        width: "100%",
+        paddingBottom: 15,
+        paddingTop: 10
+    },
+    dot,
+    dotActive: {
+        ...dot,
+        backgroundColor: "#CFCFCF"
+    },
+});
+//# sourceMappingURL=styles.js.map

package/dist/styles.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"styles.js","sourceRoot":"","sources":["../src/styles.ts"],"names":[],"mappings":"AAAA,4CAA4C;AAC5C,0FAA0F;AAC1F,EAAE;AACF,2EAA2E;AAC3E,uEAAuE;AACvE,oEAAoE;AACpE,sCAAsC;AACtC,EAAE;AACF,sEAAsE;AACtE,iEAAiE;AACjE,gEAAgE;AAChE,+CAA+C;AAC/C,EAAE;AACF,oEAAoE;AACpE,4EAA4E;AAC5E,OAAO,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAEzC,MAAM,GAAG,GAAG;IACV,KAAK,EAAE,CAAC;IACR,MAAM,EAAE,CAAC;IACT,YAAY,EAAE,GAAG;IACjB,WAAW,EAAE,CAAC;IACd,MAAM,EAAE,mBAAmB;IAC3B,eAAe,EAAE,SAAS;CAC3B,CAAA;AAED,MAAM,CAAC,MAAM,SAAS,GAAG,UAAU,CAAC;IAClC,IAAI,EAAE;QACJ,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,KAAK,EAAE,MAAM;QACb,MAAM,EAAE,MAAM;KACf;IACD,iBAAiB,EAAE;QACjB,OAAO,EAAE,MAAM;QACf,aAAa,EAAE,QAAQ;QACvB,UAAU,EAAE,SAAS;QACrB,MAAM,EAAE,mBAAmB;QAC3B,SAAS,EAAE,gCAAgC;KAC5C;IACD,cAAc,EAAE;QACd,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,eAAe,EAAE,SAAS;QAC1B,MAAM,EAAE,EAAE;QACV,WAAW,EAAE,EAAE;KAChB;IACD,YAAY,EAAE;QACZ,OAAO,EAAE,MAAM;QACf,KAAK,EAAE,GAAG;QACV,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,aAAa;QACrB,UAAU,EAAE,EAAE;QACd,WAAW,EAAE,EAAE;QACf,YAAY,EAAE,mBAAmB;KAClC;IACD,cAAc,EAAE;QACd,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,eAAe;QAC/B,MAAM,EAAE,EAAE;QACV,WAAW,EAAE,EAAE;QACf,YAAY,EAAE,EAAE;KACjB;IACD,WAAW,EAAE;QACX,KAAK,EAAE,kBAAkB;QACzB,YAAY,EAAE,CAAC;QACf,MAAM,EAAE,kBAAkB;QAC1B,WAAW,EAAE,EAAE;QACf,YAAY,EAAE,EAAE;KACjB;IACD,mBAAmB,EAAE;QACnB,MAAM,EAAE,mBAAmB;KAC5B;IACD,mBAAmB,EAAE;QACnB,KAAK,EAAE,SAAS;KACjB;IACD,aAAa,EAAE;QACb,OAAO,EAAE,MAAM;QACf,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,KAAK,EAAE,MAAM;QACb,aAAa,EAAE,EAAE;QACjB,UAAU,EAAE,EAAE;KACf;IACD,GAAG;IACH,SAAS,EAAE;QACT,GAAG,GAAG;QACN,eAAe,EAAE,SAAS;KAC3B;CACF,CAAC,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@prosopo/procaptcha-react",
-  "version": "0.1.0",
+  "version": "0.1.4",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",
   "scripts": {
@@ -11,14 +11,14 @@
   "dependencies": {
     "@mui/material": "^5.8.3",
     "@mui/styles": "^5.8.3",
-    "@prosopo/procaptcha": "0.1.0",
+    "@prosopo/procaptcha": "0.1.4",
     "react": "^17.0.0",
     "react-dom": "^17.0.0"
   },
   "devDependencies": {
     "@types/react": "^17.0.0",
     "@types/react-dom": "^17.0.0",
-    "typescript": "^4.7.3"
+    "typescript": "^4.7.4"
   },
   "author": "",
   "license": "ISC",