Socket
Socket
Sign inDemoInstall

@hcaptcha/vue3-hcaptcha

Package Overview
Dependencies
Maintainers
4
Versions
8
Alerts
File Explorer

Advanced tools

Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

@hcaptcha/vue3-hcaptcha - npm Package Compare versions

Comparing version 1.0.1 to 1.1.0

./dist/hcaptcha-vue3.umd.js

15

dist/hcaptcha-vue3.es.js

@@ -175,2 +175,17 @@ import { openBlock, createElementBlock } from "vue";

},
executeAsync() {
if (this.widgetId) {
this.onExecuted();
return this.hcaptcha.execute(this.widgetId, { async: true });
}
let resolveFn2;
const promiseFn = new Promise((resolve) => {
resolveFn2 = resolve;
});
this.renderedCb = () => {
this.renderedCb = null;
resolveFn2();
};
return promiseFn.then(this.executeAsync);
},
reset() {

@@ -177,0 +192,0 @@ if (this.widgetId) {

2

dist/hcaptcha-vue3.umd.js

@@ -1,1 +0,1 @@

(function(d,r){typeof exports=="object"&&typeof module!="undefined"?module.exports=r(require("vue")):typeof define=="function"&&define.amd?define(["vue"],r):(d=typeof globalThis!="undefined"?globalThis:d||self,d.VueHcaptcha=r(d.Vue))})(this,function(d){"use strict";const r="hcaptcha-api-script-id",h="_hcaptchaOnLoad";let a,c;const o=new Promise((t,e)=>{a=t,c=e});function p(t){if(window.hcaptcha)return a(),o;if(document.getElementById(r))return o;window[h]=a;const e=l(t),i=document.createElement("script");return i.id=r,i.src=e,i.async=!0,i.defer=!0,i.onerror=s=>{console.error("Failed to load api: "+e,s),c("Failed to load api.js")},document.head.appendChild(i),o}function l(t){let e=t.apiEndpoint;return e=n(e,"render","explicit"),e=n(e,"onload",h),e=n(e,"recaptchacompat",t.reCaptchaCompat===!1?"off":null),e=n(e,"hl",t.language),e=n(e,"sentry",t.sentry),e=n(e,"endpoint",t.endpoint),e=n(e,"assethost",t.assethost),e=n(e,"imghost",t.imghost),e=n(e,"reportapi",t.reportapi),e}function n(t,e,i){if(i!=null){const s=t.includes("?")?"&":"?";return t+s+e+"="+encodeURIComponent(i)}return t}var u=(t,e)=>{for(const[i,s]of e)t[i]=s;return t};const f={name:"VueHcaptcha",props:{sitekey:{type:String,required:!0},theme:{type:String,default:void 0},size:{type:String,default:void 0},tabindex:{type:String,default:void 0},language:{type:String,default:void 0},reCaptchaCompat:{type:Boolean,default:!0},challengeContainer:{type:String,default:void 0},rqdata:{type:String,default:void 0},sentry:{type:Boolean,default:!0},apiEndpoint:{type:String,default:"https://hcaptcha.com/1/api.js"},endpoint:{type:String,default:void 0},reportapi:{type:String,default:void 0},assethost:{type:String,default:void 0},imghost:{type:String,default:void 0}},data:()=>({widgetId:null,hcaptcha:null,renderedCb:null}),mounted(){return p(this.$props).then(this.onApiLoaded).catch(this.onError)},unmounted(){this.teardown()},destroyed(){this.teardown()},methods:{teardown(){this.widgetId&&(this.hcaptcha.reset(this.widgetId),this.hcaptcha.remove(this.widgetId))},onApiLoaded(){this.hcaptcha=window.hcaptcha;const t={sitekey:this.sitekey,theme:this.theme,size:this.size,tabindex:this.tabindex,callback:this.onVerify,"expired-callback":this.onExpired,"chalexpired-callback":this.onChallengeExpired,"error-callback":this.onError,"open-callback":this.onOpen,"close-callback":this.onClose};this.challengeContainer&&(t["challenge-container"]=this.challengeContainer),this.widgetId=this.hcaptcha.render(this.$el,t),this.rqdata&&this.hcaptcha.setData(this.widgetId,{rqdata:this.rqdata}),this.onRendered()},execute(){this.widgetId?(this.hcaptcha.execute(this.widgetId),this.onExecuted()):this.renderedCb=()=>{this.renderedCb=null,this.execute()}},reset(){this.widgetId?(this.hcaptcha.reset(this.widgetId),this.onReset()):this.$emit("error","Element is not rendered yet and thus cannot reset it. Wait for `rendered` event to safely call reset.")},onRendered(){this.$emit("rendered"),this.renderedCb&&this.renderedCb()},onExecuted(){this.$emit("executed")},onReset(){this.$emit("reset")},onError(t){this.$emit("error",t),this.reset()},onVerify(){const t=this.hcaptcha.getResponse(this.widgetId),e=this.hcaptcha.getRespKey(this.widgetId);this.$emit("verify",t,e)},onExpired(){this.$emit("expired")},onChallengeExpired(){this.$emit("challengeExpired")},onOpen(){this.$emit("opened")},onClose(){this.$emit("closed")}}},m={id:"hcap-script"};function g(t,e,i,s,w,x){return d.openBlock(),d.createElementBlock("div",m)}var y=u(f,[["render",g]]);return y});
(function(r,d){typeof exports=="object"&&typeof module!="undefined"?module.exports=d(require("vue")):typeof define=="function"&&define.amd?define(["vue"],d):(r=typeof globalThis!="undefined"?globalThis:r||self,r.VueHcaptcha=d(r.Vue))})(this,function(r){"use strict";const d="hcaptcha-api-script-id",h="_hcaptchaOnLoad";let a,c;const o=new Promise((t,e)=>{a=t,c=e});function p(t){if(window.hcaptcha)return a(),o;if(document.getElementById(d))return o;window[h]=a;const e=l(t),i=document.createElement("script");return i.id=d,i.src=e,i.async=!0,i.defer=!0,i.onerror=s=>{console.error("Failed to load api: "+e,s),c("Failed to load api.js")},document.head.appendChild(i),o}function l(t){let e=t.apiEndpoint;return e=n(e,"render","explicit"),e=n(e,"onload",h),e=n(e,"recaptchacompat",t.reCaptchaCompat===!1?"off":null),e=n(e,"hl",t.language),e=n(e,"sentry",t.sentry),e=n(e,"endpoint",t.endpoint),e=n(e,"assethost",t.assethost),e=n(e,"imghost",t.imghost),e=n(e,"reportapi",t.reportapi),e}function n(t,e,i){if(i!=null){const s=t.includes("?")?"&":"?";return t+s+e+"="+encodeURIComponent(i)}return t}var u=(t,e)=>{for(const[i,s]of e)t[i]=s;return t};const f={name:"VueHcaptcha",props:{sitekey:{type:String,required:!0},theme:{type:String,default:void 0},size:{type:String,default:void 0},tabindex:{type:String,default:void 0},language:{type:String,default:void 0},reCaptchaCompat:{type:Boolean,default:!0},challengeContainer:{type:String,default:void 0},rqdata:{type:String,default:void 0},sentry:{type:Boolean,default:!0},apiEndpoint:{type:String,default:"https://hcaptcha.com/1/api.js"},endpoint:{type:String,default:void 0},reportapi:{type:String,default:void 0},assethost:{type:String,default:void 0},imghost:{type:String,default:void 0}},data:()=>({widgetId:null,hcaptcha:null,renderedCb:null}),mounted(){return p(this.$props).then(this.onApiLoaded).catch(this.onError)},unmounted(){this.teardown()},destroyed(){this.teardown()},methods:{teardown(){this.widgetId&&(this.hcaptcha.reset(this.widgetId),this.hcaptcha.remove(this.widgetId))},onApiLoaded(){this.hcaptcha=window.hcaptcha;const t={sitekey:this.sitekey,theme:this.theme,size:this.size,tabindex:this.tabindex,callback:this.onVerify,"expired-callback":this.onExpired,"chalexpired-callback":this.onChallengeExpired,"error-callback":this.onError,"open-callback":this.onOpen,"close-callback":this.onClose};this.challengeContainer&&(t["challenge-container"]=this.challengeContainer),this.widgetId=this.hcaptcha.render(this.$el,t),this.rqdata&&this.hcaptcha.setData(this.widgetId,{rqdata:this.rqdata}),this.onRendered()},execute(){this.widgetId?(this.hcaptcha.execute(this.widgetId),this.onExecuted()):this.renderedCb=()=>{this.renderedCb=null,this.execute()}},executeAsync(){if(this.widgetId)return this.onExecuted(),this.hcaptcha.execute(this.widgetId,{async:!0});let t;const e=new Promise(i=>{t=i});return this.renderedCb=()=>{this.renderedCb=null,t()},e.then(this.executeAsync)},reset(){this.widgetId?(this.hcaptcha.reset(this.widgetId),this.onReset()):this.$emit("error","Element is not rendered yet and thus cannot reset it. Wait for `rendered` event to safely call reset.")},onRendered(){this.$emit("rendered"),this.renderedCb&&this.renderedCb()},onExecuted(){this.$emit("executed")},onReset(){this.$emit("reset")},onError(t){this.$emit("error",t),this.reset()},onVerify(){const t=this.hcaptcha.getResponse(this.widgetId),e=this.hcaptcha.getRespKey(this.widgetId);this.$emit("verify",t,e)},onExpired(){this.$emit("expired")},onChallengeExpired(){this.$emit("challengeExpired")},onOpen(){this.$emit("opened")},onClose(){this.$emit("closed")}}},m={id:"hcap-script"};function g(t,e,i,s,x,w){return r.openBlock(),r.createElementBlock("div",m)}var y=u(f,[["render",g]]);return y});
{
"name": "@hcaptcha/vue3-hcaptcha",
"version": "1.0.1",
"version": "1.1.0",
"author": "hCaptcha team and contributors",

@@ -55,3 +55,3 @@ "homepage": "https://github.com/hCaptcha/vue-hcaptcha",

},
"gitHead": "23213787f03d24c65b871540c1936db914e3eac2"
"gitHead": "e7b0cf45b2cada847d8b34ede9d025444732c59b"
}

@@ -17,3 +17,3 @@ # Vue.js hCaptcha Component Library

```
<script src="https://unpkg.com/vue"></script>
<script src="https://unpkg.com/vue@2"></script>
<script src="https://unpkg.com/@hcaptcha/vue-hcaptcha"></script>

@@ -23,3 +23,3 @@ ```

```
<script src="https://unpkg.com/vue@next"></script>
<script src="https://unpkg.com/vue@3"></script>
<script src="https://unpkg.com/@hcaptcha/vue3-hcaptcha"></script>

@@ -51,3 +51,3 @@ ```

<script setup>
import VueHcaptcha from '@hcaptcha/vue-hcaptcha';
import VueHcaptcha from '@hcaptcha/vue3-hcaptcha';
</script>

@@ -63,18 +63,18 @@ ```

|Name|Values/Type|Required|Default|Description|
|---|---|---|---|---|
|`sitekey`|String|**Yes**|`-`|Your sitekey. Please visit [hCaptcha](https://www.hcaptcha.com) and sign up to get a sitekey.|
|`size`|String (normal, compact, invisible)|No|`normal`|This specifies the "size" of the checkbox. hCaptcha allows you to decide how big the component will appear on render. Defaults to normal.|
|`theme`|String (light, dark)|No|`light`|hCaptcha supports both a light and dark theme. If no theme is set, the API will default to light.|
|`tabindex`|Integer|No|`0`|Set the tabindex of the widget and popup. When appropriate, this can make navigation of your site more intuitive.|
|`language`|String (ISO 639-2 code)|No|`auto`|hCaptcha auto-detects language via the user's browser. This overrides that to set a default UI language.|
|`reCaptchaCompat`|Boolean|No|`true`|Disable drop-in replacement for reCAPTCHA with `false` to prevent hCaptcha from injecting into window.grecaptcha.|
|`challengeContainer`|String|No|`-`|A custom element ID to render the hCaptcha challenge.|
|`rqdata`|String|No|-|See Enterprise docs.|
|`sentry`|Boolean|No|-|See Enterprise docs.|
|`apiEndpoint`|String|No|-|See Enterprise docs.|
|`endpoint`|String|No|-|See Enterprise docs.|
|`reportapi`|String|No|-|See Enterprise docs.|
|`assethost`|String|No|-|See Enterprise docs.|
|`imghost`|String|No|-|See Enterprise docs.|
| Name | Values/Type | Required | Default | Description |
|----------------------|-------------------------------------|-----------|----------|-------------------------------------------------------------------------------------------------------------------------------------------|
| `sitekey` | String | **Yes** | `-` | Your sitekey. Please visit [hCaptcha](https://www.hcaptcha.com) and sign up to get a sitekey. |
| `size` | String (normal, compact, invisible) | No | `normal` | This specifies the "size" of the checkbox. hCaptcha allows you to decide how big the component will appear on render. Defaults to normal. |
| `theme` | String (light, dark) | No | `light` | hCaptcha supports both a light and dark theme. If no theme is set, the API will default to light. |
| `tabindex` | Integer | No | `0` | Set the tabindex of the widget and popup. When appropriate, this can make navigation of your site more intuitive. |
| `language` | String (ISO 639-2 code) | No | `auto` | hCaptcha auto-detects language via the user's browser. This overrides that to set a default UI language. |
| `reCaptchaCompat` | Boolean | No | `true` | Disable drop-in replacement for reCAPTCHA with `false` to prevent hCaptcha from injecting into window.grecaptcha. |
| `challengeContainer` | String | No | `-` | A custom element ID to render the hCaptcha challenge. |
| `rqdata` | String | No | - | See Enterprise docs. |
| `sentry` | Boolean | No | - | See Enterprise docs. |
| `apiEndpoint` | String | No | - | See Enterprise docs. |
| `endpoint` | String | No | - | See Enterprise docs. |
| `reportapi` | String | No | - | See Enterprise docs. |
| `assethost` | String | No | - | See Enterprise docs. |
| `imghost` | String | No | - | See Enterprise docs. |

@@ -84,20 +84,21 @@

|Event|Params|Description|
|---|---|---|
|`error`|`err`|When an error occurs. Component will reset immediately after an error.|
|`verify`|`token, eKey`|When challenge is completed. The `token` and an `eKey` are passed along.|
|`expired`|-|When the current token expires.|
|`challengeExpired`|-|When the unfinished challenge expires.|
|`opened`|-|When the challenge is opened.|
|`closed`|-|When the challenge is closed.|
|`reset`|-|When the challenge is reset.|
|`rendered`|-|When the challenge is rendered.|
|`executed`|-|When the challenge is executed.|
| Event | Params | Description |
|--------------------|---------------|--------------------------------------------------------------------------|
| `error` | `err` | When an error occurs. Component will reset immediately after an error. |
| `verify` | `token, eKey` | When challenge is completed. The `token` and an `eKey` are passed along. |
| `expired` | - | When the current token expires. |
| `challengeExpired` | - | When the unfinished challenge expires. |
| `opened` | - | When the challenge is opened. |
| `closed` | - | When the challenge is closed. |
| `reset` | - | When the challenge is reset. |
| `rendered` | - | When the challenge is rendered. |
| `executed` | - | When the challenge is executed. |
### Methods
|Method|Description|
|---|---|
|`execute()`|Programmatically trigger a challenge request|
|`reset()`|Reset the current challenge|
| Method | Description |
|------------------|--------------------------------------------------|
| `execute()` | Programmatically trigger a challenge request |
| `executeAsync()` | Similar to `execute` but it returns a `Promise`. |
| `reset()` | Reset the current challenge |

@@ -104,0 +105,0 @@ ### FAQ

SocketSocket SOC 2 Logo

Product

  • Package Alerts
  • Integrations
  • Docs
  • Pricing
  • FAQ
  • Roadmap
  • Changelog

Packages

npm

Stay in touch

Get open source security insights delivered straight into your inbox.


  • Terms
  • Privacy
  • Security

Made with ⚡️ by Socket Inc