@visns-studio/visns-components 5.9.5 → 5.9.7
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/package.json +2 -1
- package/src/components/crm/BusinessCardOcr.jsx +1089 -0
- package/src/components/crm/DataGrid.jsx +21 -8
- package/src/components/crm/Navigation.jsx +37 -0
- package/src/components/crm/styles/BusinessCardOcr.module.scss +646 -0
- package/src/components/crm/styles/Notification.module.scss +0 -1
- package/src/components/crm/styles/global-datagrid.css +1 -1
- package/src/components/test/TooltipTest.jsx +104 -0
- package/src/index.js +2 -0
|
@@ -0,0 +1,104 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import SystemTooltip from '../utils/SystemTooltip';
|
|
3
|
+
|
|
4
|
+
const TooltipTest = () => {
|
|
5
|
+
return (
|
|
6
|
+
<div style={{ padding: '20px', fontFamily: 'Arial, sans-serif' }}>
|
|
7
|
+
<h1>SystemTooltip Test Component</h1>
|
|
8
|
+
|
|
9
|
+
<p>This component tests the SystemTooltip functionality. Hover over the elements below:</p>
|
|
10
|
+
|
|
11
|
+
<div style={{ margin: '20px 0' }}>
|
|
12
|
+
<button
|
|
13
|
+
style={{
|
|
14
|
+
background: '#007bff',
|
|
15
|
+
color: 'white',
|
|
16
|
+
border: 'none',
|
|
17
|
+
padding: '10px 20px',
|
|
18
|
+
borderRadius: '4px',
|
|
19
|
+
cursor: 'pointer',
|
|
20
|
+
margin: '10px'
|
|
21
|
+
}}
|
|
22
|
+
data-tooltip-content="This is a test button tooltip"
|
|
23
|
+
>
|
|
24
|
+
Test Button
|
|
25
|
+
</button>
|
|
26
|
+
|
|
27
|
+
<div
|
|
28
|
+
style={{
|
|
29
|
+
width: '30px',
|
|
30
|
+
height: '30px',
|
|
31
|
+
background: '#28a745',
|
|
32
|
+
borderRadius: '50%',
|
|
33
|
+
display: 'inline-block',
|
|
34
|
+
margin: '10px',
|
|
35
|
+
cursor: 'pointer'
|
|
36
|
+
}}
|
|
37
|
+
data-tooltip-content="This is a test icon tooltip"
|
|
38
|
+
></div>
|
|
39
|
+
|
|
40
|
+
<span
|
|
41
|
+
style={{
|
|
42
|
+
background: '#f8f9fa',
|
|
43
|
+
padding: '10px',
|
|
44
|
+
border: '1px solid #dee2e6',
|
|
45
|
+
borderRadius: '4px',
|
|
46
|
+
margin: '10px',
|
|
47
|
+
display: 'inline-block',
|
|
48
|
+
cursor: 'pointer'
|
|
49
|
+
}}
|
|
50
|
+
data-tooltip-content="This is a test text tooltip with some longer content to see how it wraps"
|
|
51
|
+
>
|
|
52
|
+
Test Text Element
|
|
53
|
+
</span>
|
|
54
|
+
</div>
|
|
55
|
+
|
|
56
|
+
<div style={{ margin: '20px 0' }}>
|
|
57
|
+
<p data-tooltip-content="This paragraph has a tooltip">
|
|
58
|
+
Paragraph with tooltip
|
|
59
|
+
</p>
|
|
60
|
+
|
|
61
|
+
<div data-tooltip-content="Nested element test">
|
|
62
|
+
<span>Nested content</span>
|
|
63
|
+
</div>
|
|
64
|
+
</div>
|
|
65
|
+
|
|
66
|
+
<div style={{ margin: '20px 0' }}>
|
|
67
|
+
<input
|
|
68
|
+
type="text"
|
|
69
|
+
placeholder="Input field"
|
|
70
|
+
data-tooltip-content="This is an input field tooltip"
|
|
71
|
+
style={{ margin: '10px' }}
|
|
72
|
+
/>
|
|
73
|
+
|
|
74
|
+
<select
|
|
75
|
+
data-tooltip-content="This is a select dropdown tooltip"
|
|
76
|
+
style={{ margin: '10px' }}
|
|
77
|
+
>
|
|
78
|
+
<option>Option 1</option>
|
|
79
|
+
<option>Option 2</option>
|
|
80
|
+
</select>
|
|
81
|
+
</div>
|
|
82
|
+
|
|
83
|
+
<div style={{ margin: '20px 0' }}>
|
|
84
|
+
<div
|
|
85
|
+
data-tooltip-content="HTML content test: <strong>Bold text</strong><br/>Line break<br/>Another line"
|
|
86
|
+
style={{
|
|
87
|
+
background: '#ffc107',
|
|
88
|
+
padding: '10px',
|
|
89
|
+
borderRadius: '4px',
|
|
90
|
+
cursor: 'pointer',
|
|
91
|
+
display: 'inline-block'
|
|
92
|
+
}}
|
|
93
|
+
>
|
|
94
|
+
Element with HTML content tooltip
|
|
95
|
+
</div>
|
|
96
|
+
</div>
|
|
97
|
+
|
|
98
|
+
{/* Include SystemTooltip component */}
|
|
99
|
+
<SystemTooltip />
|
|
100
|
+
</div>
|
|
101
|
+
);
|
|
102
|
+
};
|
|
103
|
+
|
|
104
|
+
export default TooltipTest;
|
package/src/index.js
CHANGED
|
@@ -8,6 +8,7 @@ import SortableList from './components/cms/sorting/List';
|
|
|
8
8
|
import AsyncSelect from './components/crm/AsyncSelect';
|
|
9
9
|
import Autocomplete from './components/crm/Autocomplete';
|
|
10
10
|
import Breadcrumb from './components/crm/Breadcrumb';
|
|
11
|
+
import BusinessCardOcr from './components/crm/BusinessCardOcr';
|
|
11
12
|
import Call from './components/crm/Call';
|
|
12
13
|
import CustomFetch from './components/crm/Fetch';
|
|
13
14
|
import Download from './components/crm/Download';
|
|
@@ -59,6 +60,7 @@ export {
|
|
|
59
60
|
AuditLogs,
|
|
60
61
|
Autocomplete,
|
|
61
62
|
Breadcrumb,
|
|
63
|
+
BusinessCardOcr,
|
|
62
64
|
Call,
|
|
63
65
|
ClientLogin,
|
|
64
66
|
ClientOTPVerify,
|