Skip to content

Commit 62959d5

Browse files
author
Masakorala, Manoj
committed
minor changes
1 parent 50560b8 commit 62959d5

File tree

8 files changed

+119
-103
lines changed

8 files changed

+119
-103
lines changed

‎examples/src/js/BasicExample.js

+78-74
Original file line numberDiff line numberDiff line change
@@ -4,120 +4,124 @@ import Select from 'react-select'
44

55
const nodes = [
66
{
7-
"label": "Arise Australia 108",
87
"children": [
98
{
10-
"label": "1 Bedroom Apartment",
119
"children": [
1210
{
13-
"label": "AU 4Nt+ NonRef Direct",
14-
"value": "arise|551"
15-
},
16-
{
17-
"label": "AU NonRef Direct",
18-
"value": "arise|589"
19-
}
11+
"label": "Fully Flexible",
12+
"value": "f922f8df.140.arise-861"
13+
}
2014
],
21-
"value": 140
15+
"value": "f922f8df.140",
16+
"label": "1 Bedroom Apartment"
2217
},
2318
{
24-
"label": "1 Bedroom Skyline Apartment",
2519
"children": [
2620
{
27-
"label": "AU 7Nt+ Flexi Direct",
28-
"value": "arise|238"
21+
"label": "Long Stay 7+ Flexible",
22+
"value": "f922f8df.143.arise-863"
23+
},
24+
{
25+
"label": "Fully Flexible",
26+
"value": "f922f8df.143.arise-861"
27+
},
28+
{
29+
"label": "Stay & Save 2+ Non Refundable",
30+
"value": "f922f8df.143.arise-864"
31+
},
32+
{
33+
"label": "Stay & Save 2+ Flexible",
34+
"value": "f922f8df.143.arise-862"
2935
}
3036
],
31-
"value": 143
37+
"value": "f922f8df.143",
38+
"label": "1 Bedroom Skyline Apartment"
3239
},
3340
{
34-
"label": "2 Bedroom 1 Bathroom Apartment",
35-
"value": 146
41+
"children": [
42+
{
43+
"label": "Long Stay 7+ Flexible",
44+
"value": "f922f8df.146.arise-863"
45+
}
46+
],
47+
"value": "f922f8df.146",
48+
"label": "2 Bedroom 1 Bathroom Apartment"
3649
},
3750
{
3851
"label": "2 Bedroom 1 Bathroom Skyline Apartment",
3952
"value": 149
4053
},
4154
{
4255
"label": "2 Bedroom 2 Bathroom Apartment",
43-
4456
"value": 152
4557
},
4658
{
4759
"label": "2 Bedroom 2 Bathroom Skyline Apartment",
48-
4960
"value": 155
5061
}
5162
],
52-
"value": "f922f8df"
63+
"value": "f922f8df",
64+
"label": "Arise Australia 108"
5365
},
5466
{
55-
"label": "Brisbane One",
56-
"children": [
57-
{
58-
"label": "1 Bedroom Apartment",
59-
60-
"value": 1
61-
},
62-
{
63-
"label": "Studio Apartment",
64-
65-
"value": 4
66-
},
67-
{
68-
"label": "2 Bedroom 1 Bathroom Apartment",
69-
70-
"value": 5
71-
},
72-
{
73-
"label": "3 Bedroom 2 Bathroom Apartment",
74-
75-
"value": 12
76-
},
77-
{
78-
"label": "Compact Family Room",
79-
80-
"value": 285
81-
}
82-
],
83-
"value": "8bdc"
67+
"value": "a3fe",
68+
"label": "Brisbane One"
8469
},
8570
{
86-
"label": "Arise Harmony",
8771
"children": [
8872
{
89-
"label": "1 Bedroom Apartment",
90-
91-
"value": 2
92-
},
93-
{
94-
"label": "2 Bedroom 2 Bathroom Apartment",
95-
96-
"value": 19
73+
"children": [
74+
{
75+
"label": "Fully Flexible",
76+
"value": "245d.207.arise-861"
77+
},
78+
{
79+
"label": "Long Stay 7+ Flexible",
80+
"value": "245d.207.arise-863"
81+
},
82+
{
83+
"label": "Stay & Save 2+ Flexible",
84+
"value": "245d.207.arise-862"
85+
},
86+
{
87+
"label": "Stay & Save 2+ Non Refundable",
88+
"value": "245d.207.arise-864"
89+
},
90+
{
91+
"label": "Stay Longer 3+ Non Refundable",
92+
"value": "245d.207.arise-865"
93+
}
94+
],
95+
"value": "245d.207",
96+
"label": "BS 1 Bedroom City"
9797
},
9898
{
99-
"label": "3 Bedroom 2 Bathroom Apartment",
100-
101-
"value": 22
99+
"value": "245d.208",
100+
"label": "BS 1 Bedroom Sky High"
102101
}
103102
],
104-
"value": "8829"
103+
"value": "245d",
104+
"label": "Brisbane Skytower"
105105
},
106106
{
107-
"label": "Arise Princess Regent",
108107
"children": [
109108
{
110-
"label": "1 Bedroom Apartment",
111-
112-
"value": 107
113-
},
114-
{
115-
"label": "2 Bedrooom Apartment",
116-
117-
"value": 110
109+
"children": [
110+
{
111+
"label": "Fully Flexible",
112+
"value": "30eb.77.arise-861"
113+
}
114+
],
115+
"value": "30eb.77",
116+
"label": "AR 1 Bedroom"
118117
}
119118
],
120-
"value": "63a8"
119+
"value": "30eb",
120+
"label": "Arena"
121+
},
122+
{
123+
"value": "06db",
124+
"label": "Hedge"
121125
}
122126
];
123127
const rates = [
@@ -604,13 +608,13 @@ const nodes = [
604608
]
605609

606610
const inputSelected = [
607-
{hotel: 140, rate: 'arise|241'}, { hotel: 149, rate: 'arise|735'}
611+
{hotel: 152, rate: 'arise|722'}, { hotel: 155, rate: 'arise|519'}
608612
]
609613

610614
class BasicExample extends React.Component {
611615
state = {
612616
checked: [
613-
617+
152
614618
],
615619
expanded: [
616620

@@ -661,7 +665,7 @@ class BasicExample extends React.Component {
661665
onCheck={this.onCheck}
662666
onExpand={this.onExpand}
663667
toggelInputs
664-
rateList={ rates.map(data =>( {'value': data.id, 'label': data.name} ))}
668+
rateList={ rates.map(data =>( {'value': data.id, 'label': `${data.name} ${data.id}`} ))}
665669
inputSelected={rate}
666670
onRate={this.onRateChange}
667671
>

‎lib/index.browser.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎lib/index.js

+1-1
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎lib/react-checkbox-tree.css

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
.basic-singl-select {
2-
width: 400px;
2+
width: 300px;
33
}
44

55
.basic-singl-select input[type=text] {

‎src/js/NodeModel.js

+5-2
Original file line numberDiff line numberDiff line change
@@ -120,19 +120,22 @@ class NodeModel {
120120
}
121121

122122
serializeListInputValues(key) {
123+
123124
const list = [];
124125
// console.log('key', key);
125-
126+
// console.log("this.flatNodes: ", this.flatNodes)
126127
Object.keys(this.flatNodes).forEach((value) => {
127128
// console.log("flatNodes..", value)
128-
// console.log("val her..", this.flatNodes[value])
129+
// console.log("val her..", this.flatNodes[value])
129130
if (this.flatNodes[value].inputValue === key.value && !list.includes(key)) {
130131
list.push(key);
131132
}
132133
if (this.flatNodes[value].inputValue) {
133134
list.push({ hotel: value, rate: this.flatNodes[value].inputValue });
134135
}
135136
});
137+
138+
// console.log('list : ', list);
136139
return list;
137140
}
138141

‎src/js/TreeNode.js

+31-22
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,12 @@
11
import classNames from 'classnames';
22
import PropTypes from 'prop-types';
33
import React from 'react';
4+
import Select from 'react-select';
45

56
import Button from './Button';
67
import NativeCheckbox from './NativeCheckbox';
78
import iconsShape from './shapes/iconsShape';
89
import languageShape from './shapes/languageShape';
9-
import Select from 'react-select';
1010

1111

1212
class TreeNode extends React.Component {
@@ -76,9 +76,9 @@ class TreeNode extends React.Component {
7676
}
7777

7878
onRateChangeHandler(e) {
79-
// console.log('e', e);
8079
this.setState({ rate: e.value });
8180
const { value, onRate } = this.props;
81+
// console.log('e', e, value);
8282

8383
onRate({ hotel: value, rate: e.value });
8484
}
@@ -225,11 +225,20 @@ class TreeNode extends React.Component {
225225
treeId,
226226
value,
227227
onClick,
228+
treeDepth, toggelInputs, rateList
229+
228230
} = this.props;
231+
const {
232+
isClearable,
233+
isSearchable,
234+
isDisabled,
235+
isLoading,
236+
isRtl,
237+
} = this.state;
229238
const clickable = onClick !== null;
230239
const inputId = `${treeId}-${String(value).split(' ').join('_')}`;
231-
232240
const render = [(
241+
<>
233242
<label key={0} htmlFor={inputId} title={title} style={{ width: '100%' }}>
234243
<NativeCheckbox
235244
checked={checked === 1}
@@ -244,6 +253,25 @@ class TreeNode extends React.Component {
244253
</span>
245254
{!clickable ? children : null}
246255
</label>
256+
{ treeDepth === 1 && toggelInputs && (
257+
<span style={{ display: 'inline-flex', position: 'relative', left: '80px' }}>
258+
<span style={{padding: '4px', width: '100px' }}><b>Add rate:</b></span>
259+
<Select
260+
className="basic-singl-select"
261+
classNamePrefix="select"
262+
isDisabled={isDisabled}
263+
isLoading={isLoading}
264+
isClearable={isClearable}
265+
isRtl={isRtl}
266+
isSearchable={true}
267+
options={rateList}
268+
onChange={data => this.onRateChangeHandler(data)}
269+
value={ rateList?.find(data => data.value === this.state.rate)?.label && ({'value': this.state.rate, 'label': rateList?.find(data => data.value === this.state.rate)?.label})}
270+
/>
271+
</span>
272+
)
273+
}
274+
</>
247275
)];
248276

249277
if (clickable) {
@@ -283,25 +311,6 @@ class TreeNode extends React.Component {
283311
) : null,
284312
<span key={1} className="rct-title">
285313
{label}
286-
{
287-
treeDepth === 1 && toggelInputs && (
288-
<span style={{ display: 'inline-flex', position: 'relative', left: '80px' }}>
289-
<lable style={{padding: '4px'}}><b>Add rate:</b></lable>
290-
<Select
291-
className="basic-singl-select"
292-
classNamePrefix="select"
293-
isDisabled={isDisabled}
294-
isLoading={isLoading}
295-
isClearable={isClearable}
296-
isRtl={isRtl}
297-
isSearchable={true}
298-
options={rateList}
299-
onChange={data => this.onRateChangeHandler(data)}
300-
setValue={this.state.rate}
301-
/>
302-
</span>
303-
)
304-
}
305314
</span>,
306315
];
307316

‎src/less/react-checkbox-tree.less

+1-1
Original file line numberDiff line numberDiff line change
@@ -4,7 +4,7 @@
44
@rct-clickable-hover: rgba(red(@rct-icon-color), green(@rct-icon-color), blue(@rct-icon-color), .1);
55
@rct-clickable-focus: rgba(red(@rct-icon-color), green(@rct-icon-color), blue(@rct-icon-color), .2);
66
.basic-singl-select {
7-
width: 400px;
7+
width: 300px;
88
input[type=text] {
99
display: inline-block !important;
1010
}

‎src/scss/react-checkbox-tree.scss

+1-1
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ $rct-clickable-hover: rgba($rct-icon-color, .1) !default;
55
$rct-clickable-focus: rgba($rct-icon-color, .2) !default;
66
// sass-lint:disable-all
77
.basic-singl-select {
8-
width: 400px;
8+
width: 300px;
99
input[type=text] {
1010
display: inline-block !important; // No result reported
1111
}

0 commit comments

Comments
 (0)