react-core-ts 2.0.0 → 2.0.1
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/dist/AutoCompleteWithTreeStructure.js +3 -3
- package/dist/AutoCompleteWithTreeStructure.js.map +1 -1
- package/dist/commontypes.d.ts +1 -0
- package/dist/styles/styles/components/autocomplete.css +717 -0
- package/dist/styles/styles/components/selectedautocomplete.css +179 -0
- package/dist/styles/styles/components/tooltip.css +497 -0
- package/dist/styles/styles/components/treedropdown.css +97 -0
- package/dist/styles/styles/global.css +8 -0
- package/package.json +1 -1
- package/src/AutoCompleteWithTreeStructure.tsx +4 -8
- package/src/commontypes.ts +1 -0
|
@@ -0,0 +1,97 @@
|
|
|
1
|
+
.qbs-tree-list-container {
|
|
2
|
+
display: flex;
|
|
3
|
+
flex-direction: column;
|
|
4
|
+
}
|
|
5
|
+
.qbs-tree-list-container-sub {
|
|
6
|
+
display: flex;
|
|
7
|
+
flex-direction: row;
|
|
8
|
+
align-items: flex-start;
|
|
9
|
+
gap: 7px;
|
|
10
|
+
}
|
|
11
|
+
|
|
12
|
+
.qbs-tree-list-container-sub .no-children {
|
|
13
|
+
margin-left: 1.75rem; /* Corresponds to ml-7 in Tailwind */
|
|
14
|
+
}
|
|
15
|
+
.qbs-tree-list-container-sub-icon {
|
|
16
|
+
margin-top: 0.25rem; /* Corresponds to mt-1 in Tailwind */
|
|
17
|
+
cursor: pointer;
|
|
18
|
+
padding-top: 0.5rem; /* Corresponds to py-2 in Tailwind */
|
|
19
|
+
padding-bottom: 0.5rem;
|
|
20
|
+
transition: transform 0.3s ease; /* Smooth rotation transition */
|
|
21
|
+
color: #003c71;
|
|
22
|
+
}
|
|
23
|
+
|
|
24
|
+
.qbs-tree-list-container-sub-icon.expanded {
|
|
25
|
+
transform: rotate(90deg); /* Corresponds to rotate-90 in Tailwind */
|
|
26
|
+
}
|
|
27
|
+
.qbs-tree-list-container-sub-container {
|
|
28
|
+
display: flex;
|
|
29
|
+
gap: 15px; /* Corresponds to gap-2 in Tailwind */
|
|
30
|
+
padding: 0.5rem; /* Corresponds to p-2 in Tailwind */
|
|
31
|
+
flex-direction: row; /* Corresponds to flex-row in Tailwind */
|
|
32
|
+
width: 100%; /* Corresponds to w-full in Tailwind */
|
|
33
|
+
color: #3d414a;
|
|
34
|
+
}
|
|
35
|
+
.qbs-tree-list-container-sub-container-hideicon {
|
|
36
|
+
display: flex;
|
|
37
|
+
gap: 6px; /* Corresponds to gap-2 in Tailwind */
|
|
38
|
+
padding: 0.5rem; /* Corresponds to p-2 in Tailwind */
|
|
39
|
+
flex-direction: row; /* Corresponds to flex-row in Tailwind */
|
|
40
|
+
width: 100%; /* Corresponds to w-full in Tailwind */
|
|
41
|
+
color: #3d414a;
|
|
42
|
+
}
|
|
43
|
+
.qbs-tree-list-container-sub-container-hideicon:hover {
|
|
44
|
+
color: #003c71;
|
|
45
|
+
background-color: rgba(141, 194, 240, 0.15) !important;
|
|
46
|
+
}
|
|
47
|
+
.qbs-tree-list-container-sub-container:hover {
|
|
48
|
+
color: #003c71;
|
|
49
|
+
background-color: rgba(141, 194, 240, 0.15) !important;
|
|
50
|
+
}
|
|
51
|
+
.qbs-tree-list-container-sub-container.qbs-expanded-child {
|
|
52
|
+
color: #003c71;
|
|
53
|
+
}
|
|
54
|
+
.qbs-tree-list-container-sub-text.qbs-expanded-child {
|
|
55
|
+
color: #003c71;
|
|
56
|
+
}
|
|
57
|
+
.qbs-tree-list-container-sub-text:hover {
|
|
58
|
+
color: #003c71;
|
|
59
|
+
/* background-color: rgba(141, 194, 240, 0.15) !important; */
|
|
60
|
+
}
|
|
61
|
+
|
|
62
|
+
.qbs-tree-list-container-sub-container.checked,
|
|
63
|
+
.qbs-tree-list-container-sub-container-hideicon.checked {
|
|
64
|
+
color: #003c71;
|
|
65
|
+
background-color: rgba(
|
|
66
|
+
141,
|
|
67
|
+
194,
|
|
68
|
+
240,
|
|
69
|
+
0.15
|
|
70
|
+
) !important; /* Corresponds to bg-green-200 in Tailwind */
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
.marginLeft {
|
|
74
|
+
margin-left: 28px; /* Corresponds to ml-2 in Tailwind */
|
|
75
|
+
}
|
|
76
|
+
.lightmarginLeft {
|
|
77
|
+
margin-left: 19px; /* Corresponds to ml-2 in Tailwind */
|
|
78
|
+
}
|
|
79
|
+
.qbs-tree-list-container-sub- {
|
|
80
|
+
line-height: 18px; /* Corresponds to leading-[18px] in Tailwind */
|
|
81
|
+
font-size: 0.875rem; /* Corresponds to text-sm in Tailwind (14px) */
|
|
82
|
+
}
|
|
83
|
+
.qbs-tree-list-container-child {
|
|
84
|
+
margin-left: 1rem; /* Corresponds to ml-4 in Tailwind */
|
|
85
|
+
margin-top: 0.5rem; /* Corresponds to mt-2 in Tailwind */
|
|
86
|
+
display: flex; /* Corresponds to flex in Tailwind */
|
|
87
|
+
flex-direction: column; /* Corresponds to flex-col in Tailwind */
|
|
88
|
+
gap: 0.5rem; /* Corresponds to gap-2 in Tailwind */
|
|
89
|
+
}
|
|
90
|
+
.qbs-tree-list-container-sub-text {
|
|
91
|
+
line-height: 18px; /* Corresponds to leading-[18px] in Tailwind */
|
|
92
|
+
font-size: 14px; /* Corresponds to text-sm in Tailwind (14px) */
|
|
93
|
+
font-weight: 500;
|
|
94
|
+
letter-spacing: 0.28px;
|
|
95
|
+
font-family: 'Noto Sans';
|
|
96
|
+
/* color: #3d414a; */
|
|
97
|
+
}
|
package/package.json
CHANGED
|
@@ -1,11 +1,4 @@
|
|
|
1
|
-
import React, {
|
|
2
|
-
forwardRef,
|
|
3
|
-
useCallback,
|
|
4
|
-
useEffect,
|
|
5
|
-
useImperativeHandle,
|
|
6
|
-
useRef,
|
|
7
|
-
useState,
|
|
8
|
-
} from 'react';
|
|
1
|
+
import React, { forwardRef, useCallback, useEffect, useImperativeHandle, useRef, useState } from 'react';
|
|
9
2
|
import ReactDOM from 'react-dom';
|
|
10
3
|
|
|
11
4
|
import { AutoSuggestionInputProps } from './commontypes';
|
|
@@ -73,6 +66,7 @@ const AutoCompleteWithTreeStructure = forwardRef<
|
|
|
73
66
|
inputType = 'text',
|
|
74
67
|
onFocusTreeDropdown,
|
|
75
68
|
filterCondition,
|
|
69
|
+
singleSelectIcon,
|
|
76
70
|
},
|
|
77
71
|
ref
|
|
78
72
|
) => {
|
|
@@ -454,6 +448,7 @@ const AutoCompleteWithTreeStructure = forwardRef<
|
|
|
454
448
|
updateNode={updateNode}
|
|
455
449
|
desc={desc}
|
|
456
450
|
descId={descId}
|
|
451
|
+
singleSelectIcon={singleSelectIcon}
|
|
457
452
|
toggleExpand={toggleExpand}
|
|
458
453
|
>
|
|
459
454
|
{node.expanded &&
|
|
@@ -769,6 +764,7 @@ const AutoCompleteWithTreeStructure = forwardRef<
|
|
|
769
764
|
hasDisableSelection={hasDisableSelection?.(suggestion)}
|
|
770
765
|
updateNode={updateNode}
|
|
771
766
|
desc={desc}
|
|
767
|
+
singleSelectIcon={singleSelectIcon}
|
|
772
768
|
descId={descId}
|
|
773
769
|
toggleExpand={toggleExpand}
|
|
774
770
|
>
|
package/src/commontypes.ts
CHANGED
|
@@ -97,6 +97,7 @@ export interface AutoSuggestionInputProps {
|
|
|
97
97
|
toolTabClearSwitch?: boolean;
|
|
98
98
|
onToolTabChange?: (value?: ValueProps | ValueProps[]) => void;
|
|
99
99
|
autoRefreshMainDropdown?: boolean;
|
|
100
|
+
singleSelectIcon?: any;
|
|
100
101
|
}
|
|
101
102
|
export interface IconsProps {
|
|
102
103
|
name: any;
|