@chayns-components/devalue-slider 5.0.33 → 5.0.34
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/AI_USAGE.md +107 -0
- package/package.json +5 -4
package/AI_USAGE.md
ADDED
|
@@ -0,0 +1,107 @@
|
|
|
1
|
+
# @chayns-components/devalue-slider
|
|
2
|
+
|
|
3
|
+
React component package providing `DevalueSlider` for chayns applications.
|
|
4
|
+
|
|
5
|
+
Documented components: `DevalueSlider`.
|
|
6
|
+
|
|
7
|
+
## Import
|
|
8
|
+
|
|
9
|
+
```ts
|
|
10
|
+
import { DevalueSlider } from '@chayns-components/devalue-slider';
|
|
11
|
+
```
|
|
12
|
+
|
|
13
|
+
## Typical Usage
|
|
14
|
+
|
|
15
|
+
```tsx
|
|
16
|
+
<DevalueSlider />
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
## DevalueSlider
|
|
20
|
+
|
|
21
|
+
This is a slider component that can be devalued.
|
|
22
|
+
|
|
23
|
+
For a normal devalue the user will drag the slider to the right and release it. It will show a loading cursor and call the onDevalue handler. If the onDevalue handler does not give asuccessfully response the thumb will snap back to the left. This gives feedback to the user and the person who validates the devalue.
|
|
24
|
+
|
|
25
|
+
The developer should care about the some additional security measures to prevent fraud. For example this could be an offline detection. For this you can disable the Slider with the isDisabled prop. This will also cancel the current user drag.
|
|
26
|
+
|
|
27
|
+
### Import
|
|
28
|
+
|
|
29
|
+
```ts
|
|
30
|
+
import { DevalueSlider } from '@chayns-components/devalue-slider';
|
|
31
|
+
```
|
|
32
|
+
|
|
33
|
+
### Examples
|
|
34
|
+
|
|
35
|
+
#### General
|
|
36
|
+
|
|
37
|
+
```tsx
|
|
38
|
+
<DevalueSlider />
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
#### Custom Colors
|
|
42
|
+
|
|
43
|
+
```tsx
|
|
44
|
+
<DevalueSlider
|
|
45
|
+
color={'blue'}
|
|
46
|
+
devalueColor={'yellow'}
|
|
47
|
+
/>
|
|
48
|
+
```
|
|
49
|
+
|
|
50
|
+
#### Devalued Slider
|
|
51
|
+
|
|
52
|
+
```tsx
|
|
53
|
+
<DevalueSlider
|
|
54
|
+
devalueTime={new Date(Date.now() - 5000)}
|
|
55
|
+
/>
|
|
56
|
+
```
|
|
57
|
+
|
|
58
|
+
#### Live Update
|
|
59
|
+
|
|
60
|
+
```tsx
|
|
61
|
+
<DevalueSlider />
|
|
62
|
+
```
|
|
63
|
+
|
|
64
|
+
#### Failing Devalue
|
|
65
|
+
|
|
66
|
+
```tsx
|
|
67
|
+
<DevalueSlider />
|
|
68
|
+
```
|
|
69
|
+
|
|
70
|
+
#### Success Devalue
|
|
71
|
+
|
|
72
|
+
```tsx
|
|
73
|
+
<DevalueSlider />
|
|
74
|
+
```
|
|
75
|
+
|
|
76
|
+
#### Early Devalue Time
|
|
77
|
+
|
|
78
|
+
```tsx
|
|
79
|
+
<DevalueSlider
|
|
80
|
+
devalueTime={subHours(new Date(), 3)}
|
|
81
|
+
/>
|
|
82
|
+
```
|
|
83
|
+
|
|
84
|
+
#### Custom Label
|
|
85
|
+
|
|
86
|
+
```tsx
|
|
87
|
+
<DevalueSlider
|
|
88
|
+
label={'ENTWERTEN'}
|
|
89
|
+
/>
|
|
90
|
+
```
|
|
91
|
+
|
|
92
|
+
### Props
|
|
93
|
+
|
|
94
|
+
No prop documentation available.
|
|
95
|
+
|
|
96
|
+
### Types
|
|
97
|
+
|
|
98
|
+
No additional exported types documented.
|
|
99
|
+
|
|
100
|
+
### Usage Notes
|
|
101
|
+
|
|
102
|
+
- Import `DevalueSlider` directly from `@chayns-components/devalue-slider` instead of internal source paths.
|
|
103
|
+
- Start with one of the documented Storybook examples and adapt the props incrementally for your use case.
|
|
104
|
+
|
|
105
|
+
### Anti Patterns
|
|
106
|
+
|
|
107
|
+
- Avoid imports from internal paths such as `@chayns-components/devalue-slider/src/...`; always use the public package export.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@chayns-components/devalue-slider",
|
|
3
|
-
"version": "5.0.
|
|
3
|
+
"version": "5.0.34",
|
|
4
4
|
"description": "A slider to devalue something.",
|
|
5
5
|
"siteEffects": false,
|
|
6
6
|
"browserslist": [
|
|
@@ -33,7 +33,8 @@
|
|
|
33
33
|
"test": "__tests__"
|
|
34
34
|
},
|
|
35
35
|
"files": [
|
|
36
|
-
"lib"
|
|
36
|
+
"lib",
|
|
37
|
+
"AI_USAGE.md"
|
|
37
38
|
],
|
|
38
39
|
"repository": {
|
|
39
40
|
"type": "git",
|
|
@@ -52,7 +53,7 @@
|
|
|
52
53
|
"url": "https://github.com/TobitSoftware/chayns-components/issues"
|
|
53
54
|
},
|
|
54
55
|
"dependencies": {
|
|
55
|
-
"@chayns-components/core": "^5.0.
|
|
56
|
+
"@chayns-components/core": "^5.0.34",
|
|
56
57
|
"@react-hook/size": "^2.1.2"
|
|
57
58
|
},
|
|
58
59
|
"devDependencies": {
|
|
@@ -82,5 +83,5 @@
|
|
|
82
83
|
"publishConfig": {
|
|
83
84
|
"access": "public"
|
|
84
85
|
},
|
|
85
|
-
"gitHead": "
|
|
86
|
+
"gitHead": "7c7c2d7dacbc7c8031f3bcef885e4f63b8f49b1a"
|
|
86
87
|
}
|