Skip to content

Commit a720d12

Browse files
wenlngwenlng
committed
update code
1 parent f2eda3d commit a720d12

36 files changed

+374
-209
lines changed

‎.gitattributes

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,2 +1,2 @@
11
*.ts linguist-language=typescript
2-
*.tsx linguist-language=typescript
2+
*.tsx linguist-language=react

‎README.md

Lines changed: 93 additions & 15 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,11 @@
11
# Go Captcha React Package
22

3+
<p> ⭐️ If it helps you, please give a star.</p>
4+
<img src="http://47.104.180.148/go-captcha/go-captcha-v2.jpg" alt="Poster">
5+
6+
<br/>
7+
8+
## Install
39
```shell
410
yarn add go-captcha-react
511
# or
@@ -19,31 +25,33 @@ import GoCaptcha from 'go-captcha-react';
1925
/>
2026
```
2127

22-
### params
28+
### Parameter Reference
2329
```ts
2430
// config = {}
25-
interface Config {
31+
interface ClickConfig {
2632
width?: number;
2733
height?: number;
2834
thumbWidth?: number;
2935
thumbHeight?: number;
3036
verticalPadding?: number;
3137
horizontalPadding?: number;
3238
showTheme?: boolean;
39+
title?: string;
40+
buttonText?: string;
3341
}
3442

3543
// data = {}
36-
interface Data {
44+
interface ClickData {
3745
image: string;
3846
thumb: string;
3947
}
4048

4149
// events = {}
42-
interface Events {
50+
interface ClickEvents {
4351
click?: (x: number, y: number) => void;
4452
refresh?: () => void;
4553
close?: () => void;
46-
confirm?: (dots: Array<CaptchaDot>) => boolean;
54+
confirm?: (dots: Array<ClickDot>) => boolean;
4755
}
4856
```
4957

@@ -63,21 +71,22 @@ import GoCaptcha from 'go-captcha-react';
6371
events={{}}
6472
/>
6573
```
66-
### params
74+
### Parameter Reference
6775
```ts
6876
// config = {}
69-
interface Config {
77+
interface SlideConfig {
7078
width?: number;
7179
height?: number;
7280
thumbWidth?: number;
7381
thumbHeight?: number;
7482
verticalPadding?: number;
7583
horizontalPadding?: number;
7684
showTheme?: boolean;
85+
title?: string;
7786
}
7887

7988
// data = {}
80-
interface Data {
89+
interface SlideData {
8190
thumbX: number;
8291
thumbY: number;
8392
thumbWidth: number;
@@ -87,11 +96,43 @@ interface Data {
8796
}
8897

8998
// events = {}
90-
interface Events {
99+
interface SlideEvents {
91100
move?: (x: number, y: number) => void;
92101
refresh?: () => void;
93102
close?: () => void;
94-
confirm?: (point: CaptchaPoint) => boolean;
103+
confirm?: (point: SlidePoint) => boolean;
104+
}
105+
```
106+
107+
```ts
108+
// config = {}
109+
interface SlideRegionConfig {
110+
width?: number;
111+
height?: number;
112+
thumbWidth?: number;
113+
thumbHeight?: number;
114+
verticalPadding?: number;
115+
horizontalPadding?: number;
116+
showTheme?: boolean;
117+
title?: string;
118+
}
119+
120+
// data = {}
121+
interface SlideRegionData {
122+
thumbX: number;
123+
thumbY: number;
124+
thumbWidth: number;
125+
thumbHeight: number;
126+
image: string;
127+
thumb: string;
128+
}
129+
130+
// events = {}
131+
interface SlideRegionEvents {
132+
move?: (x: number, y: number) => void;
133+
refresh?: () => void;
134+
close?: () => void;
135+
confirm?: (point: SlideRegionPoint) => boolean;
95136
}
96137
```
97138

@@ -107,31 +148,68 @@ import GoCaptcha from 'go-captcha-react';
107148
/>
108149
```
109150

110-
### params
151+
### Parameter Reference
111152
```ts
112153
// config = {}
113-
interface Config {
154+
interface RotateConfig {
114155
width?: number;
115156
height?: number;
116157
thumbWidth?: number;
117158
thumbHeight?: number;
118159
verticalPadding?: number;
119160
horizontalPadding?: number;
120161
showTheme?: boolean;
162+
title?: string;
121163
}
122164

123165
// data = {}
124-
interface Data {
166+
interface RotateData {
125167
angle: number;
126168
image: string;
127169
thumb: string;
128170
}
129171

130172
// events = {}
131-
interface Events {
173+
interface RotateEvents {
132174
rotate?: (angle: number) => void;
133175
refresh?: () => void;
134176
close?: () => void;
135177
confirm?: (angle: number) => boolean;
136178
}
137-
```
179+
```
180+
181+
182+
## 🖖 Button
183+
```jsx
184+
import GoCaptcha from 'go-captcha-react';
185+
186+
<GoCaptcha.Button />
187+
```
188+
189+
### Parameter Reference
190+
```ts
191+
interface _ {
192+
config?: ButtonConfig;
193+
clickEvent?: () => void;
194+
disabled?: boolean;
195+
type?: "default" | "warn" | "error" | "success";
196+
title?: string;
197+
}
198+
199+
export interface ButtonConfig {
200+
width?: number;
201+
height?: number;
202+
verticalPadding?: number;
203+
horizontalPadding?: number;
204+
}
205+
```
206+
207+
<br/>
208+
209+
## 🍹 Buy me a coffee
210+
<div>
211+
<a href="http://witkeycode.com/sponsor" target="_blank"><img src="http://47.104.180.148/payment-code/wxpay.png" alt="Buy Me A Coffee" style="width: 217px !important;" ></a>
212+
<a href="http://witkeycode.com/sponsor" target="_blank"><img src="http://47.104.180.148/payment-code/alipay.png" alt="Buy Me A Coffee" style="width: 217px !important;" ></a>
213+
</div>
214+
215+
<br/>

‎package.json

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,10 @@
11
{
22
"name": "go-captcha-react",
3-
"version": "2.0.0",
4-
"author": "Awen",
3+
"version": "1.0.0",
54
"license": "MIT",
65
"private": false,
76
"email": "[email protected]",
7+
"author": "Awen <[email protected]>",
88
"description": "This is the react package for go-captcha",
99
"keywords": [
1010
"go-captcha-react",
@@ -22,6 +22,7 @@
2222
"type": "git",
2323
"url": "git+https://github.com/wenlng/go-captcha-react.git"
2424
},
25+
"homepage": "https://github.com/wenlng/go-captcha-react",
2526
"module": "dist/go-captcha-react.esm.js",
2627
"main": "dist/index.js",
2728
"typings": "dist/index.d.ts",

‎src/components/Button/Index.tsx

Lines changed: 11 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,25 @@
1+
/**
2+
* @Author Awen
3+
* @Date 2024/06/01
4+
* @Email [email protected]
5+
**/
6+
17
import React, {FC} from "react";
2-
import {CaptchaConfig, defaultConfig} from "./meta/config";
8+
import {ButtonConfig, defaultConfig} from "./meta/config";
39
import styles from './index.module.less'
410
import BtnDefaultIcon from "../../assets/icons/BtnDefaultIcon";
511
import BtnErrorIcon from "../../assets/icons/BtnErrorIcon";
612
import BtnWarnIcon from "../../assets/icons/BtnWarnIcon";
713
import BtnSuccessIcon from "../../assets/icons/BtnSuccessIcon";
814
import classnames from "classnames";
915

16+
export type ButtonType = "default" | "warn" | "error" | "success";
17+
1018
export interface Props extends React.HTMLAttributes<HTMLElement> {
11-
config?: CaptchaConfig;
19+
config?: ButtonConfig;
1220
clickEvent?: () => void;
1321
disabled?: boolean;
14-
type?: "default" | "warn" | "error" | "success";
22+
type?: ButtonType;
1523
title?: string;
1624
}
1725

‎src/components/Button/index.module.less

Lines changed: 25 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/**
22
* @Author Awen
3-
* @Date 2024/05/25
3+
* @Date 2024/06/01
44
* @Email [email protected]
55
**/
66

@@ -52,34 +52,38 @@
5252
}
5353

5454
.default{
55-
color: #3e7cff;
55+
color: var(--go-captcha-theme-default-color);
5656
border: 1px solid #50a1ff;
57-
background: #ecf5ff;
57+
border-color: var(--go-captcha-theme-default-border-color);
58+
background-color: var(--go-captcha-theme-default-bg-color);
5859
cursor: pointer;
5960

6061
&:hover{
61-
background: #e0efff !important;
62+
background-color: var(--go-captcha-theme-default-hover-color) !important;
6263
}
6364
}
6465

6566
.error{
6667
cursor: pointer;
67-
color: #ed4630;
68-
background: #fef0f0;
68+
color: var(--go-captcha-theme-error-color);
69+
background-color: var(--go-captcha-theme-error-bg-color);
6970
border: 1px solid #ff5a34;
71+
border-color: var(--go-captcha-theme-error-border-color);
7072
}
7173

7274
.warn{
7375
cursor: pointer;
74-
color: #ffa000;
75-
background: #fdf6ec;
76+
color: var(--go-captcha-theme-warn-color);
77+
background-color: var(--go-captcha-theme-warn-bg-color);
7678
border: 1px solid #ffbe09;
79+
border-color: var(--go-captcha-theme-warn-border-color);
7780
}
7881

7982
.success{
80-
color: #5eaa2f;
81-
background: #f0f9eb;
83+
color: var(--go-captcha-theme-success-color);
84+
background-color: var(--go-captcha-theme-success-bg-color);
8285
border: 1px solid #8bc640;
86+
border-color: var(--go-captcha-theme-success-border-color);
8387
pointer-events: none;
8488
}
8589

@@ -99,26 +103,30 @@
99103
:global {
100104
svg {
101105
position: relative;
102-
z-index: 10;
106+
z-index: 2;
103107
}
104108
}
105109

110+
& > *{
111+
z-index: 2;
112+
}
113+
106114
&::after {
107-
background: #409eff;
115+
background-color: var(--go-captcha-theme-default-border-color);
108116
-webkit-border-radius: 50px;
109117
-moz-border-radius: 50px;
110118
border-radius: 50px;
111119
content: "";
112120
display: block;
113-
width: 20px;
114-
height: 20px;
121+
width: 21px;
122+
height: 21px;
115123
opacity: 0;
116124
position: absolute;
117125
top: 50%;
118126
left: 50%;
119-
margin-top: -10px;
120-
margin-left: -10px;
121-
z-index: 9;
127+
margin-top: -11px;
128+
margin-left: -11px;
129+
z-index: 1;
122130

123131
animation: ripple 1.3s infinite;
124132
-moz-animation: ripple 1.3s infinite;

‎src/components/Button/meta/config.ts

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,17 +1,17 @@
11
/**
22
* @Author Awen
3-
* @Date 2024/05/25
3+
* @Date 2024/06/01
44
* @Email [email protected]
55
**/
66

7-
export interface CaptchaConfig {
7+
export interface ButtonConfig {
88
width?: number;
99
height?: number;
1010
verticalPadding?: number;
1111
horizontalPadding?: number;
1212
}
1313

14-
export const defaultConfig = ():CaptchaConfig => ({
14+
export const defaultConfig = ():ButtonConfig => ({
1515
width: 330,
1616
height: 44,
1717
verticalPadding: 12,

0 commit comments

Comments
 (0)