Skip to content

Commit

Permalink
feat: support dynamic js api attributes (#3)
Browse files Browse the repository at this point in the history
  • Loading branch information
DSergiu authored Apr 17, 2024
1 parent e2dd886 commit 316908c
Show file tree
Hide file tree
Showing 30 changed files with 6,982 additions and 1,503 deletions.
4 changes: 4 additions & 0 deletions .github/workflows/ci.yml
Original file line number Diff line number Diff line change
Expand Up @@ -8,6 +8,10 @@ on:
branches:
- master

concurrency:
group: ${{ github.workflow }}-${{ github.ref }}
cancel-in-progress: true

jobs:
build:
name: 'Build - Test - [Publish]'
Expand Down
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1,3 +1,4 @@
.idea
**/node_modules
**/dist
coverage
3 changes: 1 addition & 2 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -225,11 +225,10 @@ If you would like to programmatically call the `render()` method, you can set `a
### API Attributes
These attributes are optional.
These attributes are used at web component creation time and thus, cannot be dynamic.
| Attribute | Values/Type | Default | Description |
|-------------------|----------------------------|---------|--------------------------------------------------------------------------------------------------------------------|
| `reCaptchaCompat` | Boolean | `true` | Disable drop-in replacement for reCAPTCHA with `false` to prevent hCaptcha from injecting into window.grecaptcha. |
| `recaptchacompat` | Boolean | `true` | Disable drop-in replacement for reCAPTCHA with `false` to prevent hCaptcha from injecting into window.grecaptcha. |
| `hl` | String (ISO 639-2 code) | - | hCaptcha auto-detects language via the user's browser. This overrides that to set a default UI language. |
| `jsapi` | String | - | See Enterprise docs. |
| `endpoint` | String | - | See Enterprise docs. |
Expand Down
16 changes: 16 additions & 0 deletions examples/angular/.editorconfig
Original file line number Diff line number Diff line change
@@ -0,0 +1,16 @@
# Editor configuration, see https://editorconfig.org
root = true

[*]
charset = utf-8
indent_style = space
indent_size = 2
insert_final_newline = true
trim_trailing_whitespace = true

[*.ts]
quote_type = single

[*.md]
max_line_length = off
trim_trailing_whitespace = false
42 changes: 42 additions & 0 deletions examples/angular/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,42 @@
# See http://help.github.com/ignore-files/ for more about ignoring files.

# Compiled output
/dist
/tmp
/out-tsc
/bazel-out

# Node
/node_modules
npm-debug.log
yarn-error.log

# IDEs and editors
.idea/
.project
.classpath
.c9/
*.launch
.settings/
*.sublime-workspace

# Visual Studio Code
.vscode/*
!.vscode/settings.json
!.vscode/tasks.json
!.vscode/launch.json
!.vscode/extensions.json
.history/*

# Miscellaneous
/.angular/cache
.sass-cache/
/connect.lock
/coverage
/libpeerconnection.log
testem.log
/typings

# System files
.DS_Store
Thumbs.db
27 changes: 27 additions & 0 deletions examples/angular/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,27 @@
# Angular

This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 17.3.4.

## Development server

Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The application will automatically reload if you change any of the source files.

## Code scaffolding

Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.

## Build

Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory.

## Running unit tests

Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).

## Running end-to-end tests

Run `ng e2e` to execute the end-to-end tests via a platform of your choice. To use this command, you need to first add a package that implements end-to-end testing capabilities.

## Further help

To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
89 changes: 89 additions & 0 deletions examples/angular/angular.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"angular": {
"projectType": "application",
"schematics": {},
"root": "",
"sourceRoot": "src",
"prefix": "app",
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:application",
"options": {
"outputPath": "dist/angular",
"index": "src/index.html",
"browser": "src/main.ts",
"polyfills": [
"zone.js"
],
"tsConfig": "tsconfig.app.json",
"assets": [
"src/favicon.ico",
"src/assets"
],
"scripts": []
},
"configurations": {
"production": {
"budgets": [
{
"type": "initial",
"maximumWarning": "500kb",
"maximumError": "1mb"
},
{
"type": "anyComponentStyle",
"maximumWarning": "2kb",
"maximumError": "4kb"
}
],
"outputHashing": "all"
},
"development": {
"optimization": false,
"extractLicenses": false,
"sourceMap": true
}
},
"defaultConfiguration": "production"
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"configurations": {
"production": {
"buildTarget": "angular:build:production"
},
"development": {
"buildTarget": "angular:build:development"
}
},
"defaultConfiguration": "development"
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"buildTarget": "angular:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"polyfills": [
"zone.js",
"zone.js/testing"
],
"tsConfig": "tsconfig.spec.json",
"assets": [
"src/favicon.ico",
"src/assets"
],
"scripts": []
}
}
}
}
}
}
38 changes: 38 additions & 0 deletions examples/angular/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,38 @@
{
"name": "@example/angular",
"version": "1.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"watch": "ng build --watch --configuration development"
},
"private": true,
"license": "MIT",
"dependencies": {
"@angular/animations": "^17.3.0",
"@angular/common": "^17.3.0",
"@angular/compiler": "^17.3.0",
"@angular/core": "^17.3.0",
"@angular/forms": "^17.3.0",
"@angular/platform-browser": "^17.3.0",
"@angular/platform-browser-dynamic": "^17.3.0",
"@hcaptcha/vanilla-hcaptcha": "link:../../packages/vanilla-hcaptcha",
"rxjs": "~7.8.0",
"tslib": "^2.3.0",
"zone.js": "~0.14.3"
},
"devDependencies": {
"@angular-devkit/build-angular": "^17.3.4",
"@angular/cli": "^17.3.4",
"@angular/compiler-cli": "^17.3.0",
"@types/jasmine": "~5.1.0",
"jasmine-core": "~5.1.0",
"karma": "~6.4.0",
"karma-chrome-launcher": "~3.2.0",
"karma-coverage": "~2.2.0",
"karma-jasmine": "~5.1.0",
"karma-jasmine-html-reporter": "~2.1.0",
"typescript": "~5.4.2"
}
}
26 changes: 26 additions & 0 deletions examples/angular/src/app/app.component.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<main class="main">
{{token}}
<div style="margin-top: 40px">size: normal, theme: dark</div>
<h-captcha [attr.sitekey]="siteKey"
[attr.jsapi]="jsapi"
[attr.recaptchacompat]="recaptchacompat"
host="example.com"
size="normal"
theme="dark"
(verified)="onCaptchaVerified($event)"
(closed)="onCaptchaClosed()"
(error)="onCaptchaError($event)"
></h-captcha>

<div style="margin-top: 20px">size: compact, theme: light</div>
<h-captcha [attr.sitekey]="siteKey"
[attr.jsapi]="jsapi"
[attr.recaptchacompat]="recaptchacompat"
host="example.com"
size="compact"
theme="light"
(verified)="onCaptchaVerified($event)"
(closed)="onCaptchaClosed()"
(error)="onCaptchaError($event)"
></h-captcha>
</main>
28 changes: 28 additions & 0 deletions examples/angular/src/app/app.component.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,28 @@
import { Component, CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';

@Component({
selector: 'app-root',
standalone: true,
templateUrl: './app.component.html',
schemas: [CUSTOM_ELEMENTS_SCHEMA]
})
export class AppComponent {
token = '';
siteKey = '781559eb-513a-4bae-8d29-d4af340e3624';
jsapi = 'https://js.hcaptcha.com/1/api.js';
recaptchacompat = false;

onCaptchaVerified(e: Event) {
console.log('verified event', e);
// @ts-ignore
this.token = e.token;
}

onCaptchaError(e: Event) {
console.log('error event', e);
}

onCaptchaClosed() {
console.log('hCaptcha closed');
}
}
5 changes: 5 additions & 0 deletions examples/angular/src/app/app.config.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
import { ApplicationConfig } from '@angular/core';

export const appConfig: ApplicationConfig = {
providers: []
};
Binary file added examples/angular/src/favicon.ico
Binary file not shown.
13 changes: 13 additions & 0 deletions examples/angular/src/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,13 @@
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>hCaptcha - Angular Vanilla Web Component</title>
<base href="/">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<app-root></app-root>
</body>
</html>
8 changes: 8 additions & 0 deletions examples/angular/src/main.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,8 @@
import { bootstrapApplication } from '@angular/platform-browser';
import '@hcaptcha/vanilla-hcaptcha';

import { appConfig } from './app/app.config';
import { AppComponent } from './app/app.component';

bootstrapApplication(AppComponent, appConfig)
.catch((err) => console.error(err));
14 changes: 14 additions & 0 deletions examples/angular/tsconfig.app.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/app",
"types": []
},
"files": [
"src/main.ts"
],
"include": [
"src/**/*.d.ts"
]
}
32 changes: 32 additions & 0 deletions examples/angular/tsconfig.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,32 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"compileOnSave": false,
"compilerOptions": {
"outDir": "./dist/out-tsc",
"strict": true,
"noImplicitOverride": true,
"noPropertyAccessFromIndexSignature": true,
"noImplicitReturns": true,
"noFallthroughCasesInSwitch": true,
"skipLibCheck": true,
"esModuleInterop": true,
"sourceMap": true,
"declaration": false,
"experimentalDecorators": true,
"moduleResolution": "node",
"importHelpers": true,
"target": "ES2022",
"module": "ES2022",
"useDefineForClassFields": false,
"lib": [
"ES2022",
"dom"
]
},
"angularCompilerOptions": {
"enableI18nLegacyMessageIdFormat": false,
"strictInjectionParameters": true,
"strictInputAccessModifiers": true,
"strictTemplates": true
}
}
14 changes: 14 additions & 0 deletions examples/angular/tsconfig.spec.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,14 @@
/* To learn more about this file see: https://angular.io/config/tsconfig. */
{
"extends": "./tsconfig.json",
"compilerOptions": {
"outDir": "./out-tsc/spec",
"types": [
"jasmine"
]
},
"include": [
"src/**/*.spec.ts",
"src/**/*.d.ts"
]
}
Loading

0 comments on commit 316908c

Please sign in to comment.