@tevui/checkbox 1.0.0
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.
- package/README.md +76 -0
- package/package.json +45 -0
package/README.md
ADDED
|
@@ -0,0 +1,76 @@
|
|
|
1
|
+
# Checkout Component
|
|
2
|
+
|
|
3
|
+
A customizable React checkout component.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
Use the package manager [npm](https://www.npmjs.com/)
|
|
8
|
+
|
|
9
|
+
```bash
|
|
10
|
+
npm install @tevui/checkout
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Props
|
|
14
|
+
|
|
15
|
+
The `Checkout` component accepts the following properties:
|
|
16
|
+
|
|
17
|
+
| Prop | Type | Description |
|
|
18
|
+
| -------------- | --------------- | -------------------------------------- |
|
|
19
|
+
| dataTestId | `string` | Default - tevui-checkout-datatestid |
|
|
20
|
+
| disabled | `boolean` | |
|
|
21
|
+
| required | `boolean` | |
|
|
22
|
+
| label | `string` | Button label. |
|
|
23
|
+
| labelSize | `number` | |
|
|
24
|
+
| baseColor | `string` | RGB or hexadecimal |
|
|
25
|
+
| baseColorError | `string` | RGB or hexadecimal |
|
|
26
|
+
| id | `string` | The HTML `id` attribute for the button |
|
|
27
|
+
| ariaLabel | `string` | aria-label to the button |
|
|
28
|
+
| onClick | `function` | |
|
|
29
|
+
| onChange | `function` | |
|
|
30
|
+
| onBlur | `function` | |
|
|
31
|
+
| tip | `InputTextProp` | |
|
|
32
|
+
| error | `InputTextProp` | RGB or hexadecimal |
|
|
33
|
+
|
|
34
|
+
## Usage
|
|
35
|
+
|
|
36
|
+
```jsx
|
|
37
|
+
import React from "react";
|
|
38
|
+
import { Checkout } from "@tevui/checkout";
|
|
39
|
+
|
|
40
|
+
const ExampleComponent = () => {
|
|
41
|
+
const handleButtonClick = () => {
|
|
42
|
+
// Logic to handle the button click event
|
|
43
|
+
};
|
|
44
|
+
| id | `string` | The HTML `id` attribute for the button |
|
|
45
|
+
| ariaLabel | `string` | aria-label to the button |
|
|
46
|
+
| onClick | `function` | |
|
|
47
|
+
| onChange | `function` | |
|
|
48
|
+
| onBlur | `function` | |
|
|
49
|
+
|
|
50
|
+
return (
|
|
51
|
+
<Checkout
|
|
52
|
+
dataTestId="tevui-checkout-datatestid"
|
|
53
|
+
disabled={false}
|
|
54
|
+
disabled={true}
|
|
55
|
+
label="Checkout text"
|
|
56
|
+
labelSize={14}
|
|
57
|
+
baseColor="#545454"
|
|
58
|
+
baseColorError="#e73333"
|
|
59
|
+
id="tevui-input-id"
|
|
60
|
+
onClick={console.log}
|
|
61
|
+
onChange={console.log}
|
|
62
|
+
onBlur={console.log}
|
|
63
|
+
tip={
|
|
64
|
+
size: 10,
|
|
65
|
+
text: "Checkout text tip",
|
|
66
|
+
}
|
|
67
|
+
error={
|
|
68
|
+
size: 10,
|
|
69
|
+
text: "Error message here",
|
|
70
|
+
}
|
|
71
|
+
/>
|
|
72
|
+
);
|
|
73
|
+
};
|
|
74
|
+
|
|
75
|
+
export default ExampleComponent;
|
|
76
|
+
```
|
package/package.json
ADDED
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
{
|
|
2
|
+
"name": "@tevui/checkbox",
|
|
3
|
+
"version": "1.0.0",
|
|
4
|
+
"description": "",
|
|
5
|
+
"main": "./dist/index.umd.js",
|
|
6
|
+
"exports": {
|
|
7
|
+
".": {
|
|
8
|
+
"import": "./dist/index.es.js",
|
|
9
|
+
"require": "./dist/index.umd.js",
|
|
10
|
+
"types": "./dist/index.d.ts"
|
|
11
|
+
}
|
|
12
|
+
},
|
|
13
|
+
"files": [
|
|
14
|
+
"dist"
|
|
15
|
+
],
|
|
16
|
+
"publishConfig": {
|
|
17
|
+
"access": "public"
|
|
18
|
+
},
|
|
19
|
+
"scripts": {
|
|
20
|
+
"build": "vite build"
|
|
21
|
+
},
|
|
22
|
+
"keywords": [],
|
|
23
|
+
"author": "",
|
|
24
|
+
"license": "ISC",
|
|
25
|
+
"types": "./dist/index.d.ts",
|
|
26
|
+
"module": "./dist/index.es.js",
|
|
27
|
+
"devDependencies": {
|
|
28
|
+
"@types/react": "^19.2.18",
|
|
29
|
+
"@types/react-dom": "^19.2.4",
|
|
30
|
+
"@typescript/typescript6": "^6.0.2",
|
|
31
|
+
"react": "^19.2.8",
|
|
32
|
+
"react-dom": "^19.2.8",
|
|
33
|
+
"ts-loader": "^9.6.2",
|
|
34
|
+
"typescript": "^7.0.2",
|
|
35
|
+
"vite": "^8.2.1",
|
|
36
|
+
"vite-plugin-dts": "^5.0.3"
|
|
37
|
+
},
|
|
38
|
+
"peerDependencies": {
|
|
39
|
+
"react": "^18.0.0 || ^19.0.0",
|
|
40
|
+
"react-dom": "^18.0.0 || ^19.0.0"
|
|
41
|
+
},
|
|
42
|
+
"dependencies": {
|
|
43
|
+
"@vitejs/plugin-react": "^6.0.5"
|
|
44
|
+
}
|
|
45
|
+
}
|