react-resizable 3.0.0 → 3.0.4

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.
Files changed (31) hide show
  1. package/.eslintrc +2 -1
  2. package/.flowconfig +1 -1
  3. package/CHANGELOG.md +22 -2
  4. package/README.md +60 -3
  5. package/build/Resizable.js +74 -68
  6. package/build/Resizable.js.flow +43 -34
  7. package/build/ResizableBox.js +4 -2
  8. package/build/ResizableBox.js.flow +1 -1
  9. package/dist/bundle.js +6 -0
  10. package/package.json +19 -19
  11. package/__tests__/Resizable.test.js +0 -261
  12. package/__tests__/ResizableBox.test.js +0 -99
  13. package/__tests__/__snapshots__/Resizable.test.js.snap +0 -29
  14. package/__tests__/__snapshots__/ResizableBox.test.js.snap +0 -23
  15. package/coverage/clover.xml +0 -108
  16. package/coverage/coverage-final.json +0 -5
  17. package/coverage/lcov-report/Resizable.js.html +0 -686
  18. package/coverage/lcov-report/ResizableBox.js.html +0 -374
  19. package/coverage/lcov-report/base.css +0 -224
  20. package/coverage/lcov-report/block-navigation.js +0 -79
  21. package/coverage/lcov-report/favicon.png +0 -0
  22. package/coverage/lcov-report/index.html +0 -156
  23. package/coverage/lcov-report/prettify.css +0 -1
  24. package/coverage/lcov-report/prettify.js +0 -2
  25. package/coverage/lcov-report/propTypes.js.html +0 -515
  26. package/coverage/lcov-report/sort-arrow-sprite.png +0 -0
  27. package/coverage/lcov-report/sorter.js +0 -170
  28. package/coverage/lcov-report/utils.js.html +0 -122
  29. package/coverage/lcov.info +0 -236
  30. package/flow-typed/npm/jest_v26.x.x.js +0 -1218
  31. package/setupTests/enzyme.js +0 -4
package/coverage/lcov-report/Resizable.js.html DELETED
@@ -1,686 +0,0 @@
1
-
2
- <!doctype html>
3
- <html lang="en">
4
-
5
- <head>
6
- <title>Code coverage report for Resizable.js</title>
7
- <meta charset="utf-8" />
8
- <link rel="stylesheet" href="prettify.css" />
9
- <link rel="stylesheet" href="base.css" />
10
- <link rel="shortcut icon" type="image/x-icon" href="favicon.png" />
11
- <meta name="viewport" content="width=device-width, initial-scale=1" />
12
- <style type='text/css'>
13
- .coverage-summary .sorter {
14
- background-image: url(sort-arrow-sprite.png);
15
- }
16
- </style>
17
- </head>
18
-
19
- <body>
20
- <div class='wrapper'>
21
- <div class='pad1'>
22
- <h1><a href="index.html">All files</a> Resizable.js</h1>
23
- <div class='clearfix'>
24
-
25
- <div class='fl pad1y space-right2'>
26
- <span class="strong">76.92% </span>
27
- <span class="quiet">Statements</span>
28
- <span class='fraction'>60/78</span>
29
- </div>
30
-
31
-
32
- <div class='fl pad1y space-right2'>
33
- <span class="strong">73.44% </span>
34
- <span class="quiet">Branches</span>
35
- <span class='fraction'>47/64</span>
36
- </div>
37
-
38
-
39
- <div class='fl pad1y space-right2'>
40
- <span class="strong">66.67% </span>
41
- <span class="quiet">Functions</span>
42
- <span class='fraction'>6/9</span>
43
- </div>
44
-
45
-
46
- <div class='fl pad1y space-right2'>
47
- <span class="strong">81.69% </span>
48
- <span class="quiet">Lines</span>
49
- <span class='fraction'>58/71</span>
50
- </div>
51
-
52
-
53
- </div>
54
- <p class="quiet">
55
- Press <em>n</em> or <em>j</em> to go to the next uncovered block, <em>b</em>, <em>p</em> or <em>k</em> for the previous block.
56
- </p>
57
- </div>
58
- <div class='status-line high'></div>
59
- <pre><table class="coverage">
60
- <tr><td class="line-count quiet"><a name='L1'></a><a href='#L1'>1</a>
61
- <a name='L2'></a><a href='#L2'>2</a>
62
- <a name='L3'></a><a href='#L3'>3</a>
63
- <a name='L4'></a><a href='#L4'>4</a>
64
- <a name='L5'></a><a href='#L5'>5</a>
65
- <a name='L6'></a><a href='#L6'>6</a>
66
- <a name='L7'></a><a href='#L7'>7</a>
67
- <a name='L8'></a><a href='#L8'>8</a>
68
- <a name='L9'></a><a href='#L9'>9</a>
69
- <a name='L10'></a><a href='#L10'>10</a>
70
- <a name='L11'></a><a href='#L11'>11</a>
71
- <a name='L12'></a><a href='#L12'>12</a>
72
- <a name='L13'></a><a href='#L13'>13</a>
73
- <a name='L14'></a><a href='#L14'>14</a>
74
- <a name='L15'></a><a href='#L15'>15</a>
75
- <a name='L16'></a><a href='#L16'>16</a>
76
- <a name='L17'></a><a href='#L17'>17</a>
77
- <a name='L18'></a><a href='#L18'>18</a>
78
- <a name='L19'></a><a href='#L19'>19</a>
79
- <a name='L20'></a><a href='#L20'>20</a>
80
- <a name='L21'></a><a href='#L21'>21</a>
81
- <a name='L22'></a><a href='#L22'>22</a>
82
- <a name='L23'></a><a href='#L23'>23</a>
83
- <a name='L24'></a><a href='#L24'>24</a>
84
- <a name='L25'></a><a href='#L25'>25</a>
85
- <a name='L26'></a><a href='#L26'>26</a>
86
- <a name='L27'></a><a href='#L27'>27</a>
87
- <a name='L28'></a><a href='#L28'>28</a>
88
- <a name='L29'></a><a href='#L29'>29</a>
89
- <a name='L30'></a><a href='#L30'>30</a>
90
- <a name='L31'></a><a href='#L31'>31</a>
91
- <a name='L32'></a><a href='#L32'>32</a>
92
- <a name='L33'></a><a href='#L33'>33</a>
93
- <a name='L34'></a><a href='#L34'>34</a>
94
- <a name='L35'></a><a href='#L35'>35</a>
95
- <a name='L36'></a><a href='#L36'>36</a>
96
- <a name='L37'></a><a href='#L37'>37</a>
97
- <a name='L38'></a><a href='#L38'>38</a>
98
- <a name='L39'></a><a href='#L39'>39</a>
99
- <a name='L40'></a><a href='#L40'>40</a>
100
- <a name='L41'></a><a href='#L41'>41</a>
101
- <a name='L42'></a><a href='#L42'>42</a>
102
- <a name='L43'></a><a href='#L43'>43</a>
103
- <a name='L44'></a><a href='#L44'>44</a>
104
- <a name='L45'></a><a href='#L45'>45</a>
105
- <a name='L46'></a><a href='#L46'>46</a>
106
- <a name='L47'></a><a href='#L47'>47</a>
107
- <a name='L48'></a><a href='#L48'>48</a>
108
- <a name='L49'></a><a href='#L49'>49</a>
109
- <a name='L50'></a><a href='#L50'>50</a>
110
- <a name='L51'></a><a href='#L51'>51</a>
111
- <a name='L52'></a><a href='#L52'>52</a>
112
- <a name='L53'></a><a href='#L53'>53</a>
113
- <a name='L54'></a><a href='#L54'>54</a>
114
- <a name='L55'></a><a href='#L55'>55</a>
115
- <a name='L56'></a><a href='#L56'>56</a>
116
- <a name='L57'></a><a href='#L57'>57</a>
117
- <a name='L58'></a><a href='#L58'>58</a>
118
- <a name='L59'></a><a href='#L59'>59</a>
119
- <a name='L60'></a><a href='#L60'>60</a>
120
- <a name='L61'></a><a href='#L61'>61</a>
121
- <a name='L62'></a><a href='#L62'>62</a>
122
- <a name='L63'></a><a href='#L63'>63</a>
123
- <a name='L64'></a><a href='#L64'>64</a>
124
- <a name='L65'></a><a href='#L65'>65</a>
125
- <a name='L66'></a><a href='#L66'>66</a>
126
- <a name='L67'></a><a href='#L67'>67</a>
127
- <a name='L68'></a><a href='#L68'>68</a>
128
- <a name='L69'></a><a href='#L69'>69</a>
129
- <a name='L70'></a><a href='#L70'>70</a>
130
- <a name='L71'></a><a href='#L71'>71</a>
131
- <a name='L72'></a><a href='#L72'>72</a>
132
- <a name='L73'></a><a href='#L73'>73</a>
133
- <a name='L74'></a><a href='#L74'>74</a>
134
- <a name='L75'></a><a href='#L75'>75</a>
135
- <a name='L76'></a><a href='#L76'>76</a>
136
- <a name='L77'></a><a href='#L77'>77</a>
137
- <a name='L78'></a><a href='#L78'>78</a>
138
- <a name='L79'></a><a href='#L79'>79</a>
139
- <a name='L80'></a><a href='#L80'>80</a>
140
- <a name='L81'></a><a href='#L81'>81</a>
141
- <a name='L82'></a><a href='#L82'>82</a>
142
- <a name='L83'></a><a href='#L83'>83</a>
143
- <a name='L84'></a><a href='#L84'>84</a>
144
- <a name='L85'></a><a href='#L85'>85</a>
145
- <a name='L86'></a><a href='#L86'>86</a>
146
- <a name='L87'></a><a href='#L87'>87</a>
147
- <a name='L88'></a><a href='#L88'>88</a>
148
- <a name='L89'></a><a href='#L89'>89</a>
149
- <a name='L90'></a><a href='#L90'>90</a>
150
- <a name='L91'></a><a href='#L91'>91</a>
151
- <a name='L92'></a><a href='#L92'>92</a>
152
- <a name='L93'></a><a href='#L93'>93</a>
153
- <a name='L94'></a><a href='#L94'>94</a>
154
- <a name='L95'></a><a href='#L95'>95</a>
155
- <a name='L96'></a><a href='#L96'>96</a>
156
- <a name='L97'></a><a href='#L97'>97</a>
157
- <a name='L98'></a><a href='#L98'>98</a>
158
- <a name='L99'></a><a href='#L99'>99</a>
159
- <a name='L100'></a><a href='#L100'>100</a>
160
- <a name='L101'></a><a href='#L101'>101</a>
161
- <a name='L102'></a><a href='#L102'>102</a>
162
- <a name='L103'></a><a href='#L103'>103</a>
163
- <a name='L104'></a><a href='#L104'>104</a>
164
- <a name='L105'></a><a href='#L105'>105</a>
165
- <a name='L106'></a><a href='#L106'>106</a>
166
- <a name='L107'></a><a href='#L107'>107</a>
167
- <a name='L108'></a><a href='#L108'>108</a>
168
- <a name='L109'></a><a href='#L109'>109</a>
169
- <a name='L110'></a><a href='#L110'>110</a>
170
- <a name='L111'></a><a href='#L111'>111</a>
171
- <a name='L112'></a><a href='#L112'>112</a>
172
- <a name='L113'></a><a href='#L113'>113</a>
173
- <a name='L114'></a><a href='#L114'>114</a>
174
- <a name='L115'></a><a href='#L115'>115</a>
175
- <a name='L116'></a><a href='#L116'>116</a>
176
- <a name='L117'></a><a href='#L117'>117</a>
177
- <a name='L118'></a><a href='#L118'>118</a>
178
- <a name='L119'></a><a href='#L119'>119</a>
179
- <a name='L120'></a><a href='#L120'>120</a>
180
- <a name='L121'></a><a href='#L121'>121</a>
181
- <a name='L122'></a><a href='#L122'>122</a>
182
- <a name='L123'></a><a href='#L123'>123</a>
183
- <a name='L124'></a><a href='#L124'>124</a>
184
- <a name='L125'></a><a href='#L125'>125</a>
185
- <a name='L126'></a><a href='#L126'>126</a>
186
- <a name='L127'></a><a href='#L127'>127</a>
187
- <a name='L128'></a><a href='#L128'>128</a>
188
- <a name='L129'></a><a href='#L129'>129</a>
189
- <a name='L130'></a><a href='#L130'>130</a>
190
- <a name='L131'></a><a href='#L131'>131</a>
191
- <a name='L132'></a><a href='#L132'>132</a>
192
- <a name='L133'></a><a href='#L133'>133</a>
193
- <a name='L134'></a><a href='#L134'>134</a>
194
- <a name='L135'></a><a href='#L135'>135</a>
195
- <a name='L136'></a><a href='#L136'>136</a>
196
- <a name='L137'></a><a href='#L137'>137</a>
197
- <a name='L138'></a><a href='#L138'>138</a>
198
- <a name='L139'></a><a href='#L139'>139</a>
199
- <a name='L140'></a><a href='#L140'>140</a>
200
- <a name='L141'></a><a href='#L141'>141</a>
201
- <a name='L142'></a><a href='#L142'>142</a>
202
- <a name='L143'></a><a href='#L143'>143</a>
203
- <a name='L144'></a><a href='#L144'>144</a>
204
- <a name='L145'></a><a href='#L145'>145</a>
205
- <a name='L146'></a><a href='#L146'>146</a>
206
- <a name='L147'></a><a href='#L147'>147</a>
207
- <a name='L148'></a><a href='#L148'>148</a>
208
- <a name='L149'></a><a href='#L149'>149</a>
209
- <a name='L150'></a><a href='#L150'>150</a>
210
- <a name='L151'></a><a href='#L151'>151</a>
211
- <a name='L152'></a><a href='#L152'>152</a>
212
- <a name='L153'></a><a href='#L153'>153</a>
213
- <a name='L154'></a><a href='#L154'>154</a>
214
- <a name='L155'></a><a href='#L155'>155</a>
215
- <a name='L156'></a><a href='#L156'>156</a>
216
- <a name='L157'></a><a href='#L157'>157</a>
217
- <a name='L158'></a><a href='#L158'>158</a>
218
- <a name='L159'></a><a href='#L159'>159</a>
219
- <a name='L160'></a><a href='#L160'>160</a>
220
- <a name='L161'></a><a href='#L161'>161</a>
221
- <a name='L162'></a><a href='#L162'>162</a>
222
- <a name='L163'></a><a href='#L163'>163</a>
223
- <a name='L164'></a><a href='#L164'>164</a>
224
- <a name='L165'></a><a href='#L165'>165</a>
225
- <a name='L166'></a><a href='#L166'>166</a>
226
- <a name='L167'></a><a href='#L167'>167</a>
227
- <a name='L168'></a><a href='#L168'>168</a>
228
- <a name='L169'></a><a href='#L169'>169</a>
229
- <a name='L170'></a><a href='#L170'>170</a>
230
- <a name='L171'></a><a href='#L171'>171</a>
231
- <a name='L172'></a><a href='#L172'>172</a>
232
- <a name='L173'></a><a href='#L173'>173</a>
233
- <a name='L174'></a><a href='#L174'>174</a>
234
- <a name='L175'></a><a href='#L175'>175</a>
235
- <a name='L176'></a><a href='#L176'>176</a>
236
- <a name='L177'></a><a href='#L177'>177</a>
237
- <a name='L178'></a><a href='#L178'>178</a>
238
- <a name='L179'></a><a href='#L179'>179</a>
239
- <a name='L180'></a><a href='#L180'>180</a>
240
- <a name='L181'></a><a href='#L181'>181</a>
241
- <a name='L182'></a><a href='#L182'>182</a>
242
- <a name='L183'></a><a href='#L183'>183</a>
243
- <a name='L184'></a><a href='#L184'>184</a>
244
- <a name='L185'></a><a href='#L185'>185</a>
245
- <a name='L186'></a><a href='#L186'>186</a>
246
- <a name='L187'></a><a href='#L187'>187</a>
247
- <a name='L188'></a><a href='#L188'>188</a>
248
- <a name='L189'></a><a href='#L189'>189</a>
249
- <a name='L190'></a><a href='#L190'>190</a>
250
- <a name='L191'></a><a href='#L191'>191</a>
251
- <a name='L192'></a><a href='#L192'>192</a>
252
- <a name='L193'></a><a href='#L193'>193</a>
253
- <a name='L194'></a><a href='#L194'>194</a>
254
- <a name='L195'></a><a href='#L195'>195</a>
255
- <a name='L196'></a><a href='#L196'>196</a>
256
- <a name='L197'></a><a href='#L197'>197</a>
257
- <a name='L198'></a><a href='#L198'>198</a>
258
- <a name='L199'></a><a href='#L199'>199</a>
259
- <a name='L200'></a><a href='#L200'>200</a>
260
- <a name='L201'></a><a href='#L201'>201</a>
261
- <a name='L202'></a><a href='#L202'>202</a>
262
- <a name='L203'></a><a href='#L203'>203</a></td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
263
- <span class="cline-any cline-neutral">&nbsp;</span>
264
- <span class="cline-any cline-neutral">&nbsp;</span>
265
- <span class="cline-any cline-neutral">&nbsp;</span>
266
- <span class="cline-any cline-neutral">&nbsp;</span>
267
- <span class="cline-any cline-neutral">&nbsp;</span>
268
- <span class="cline-any cline-neutral">&nbsp;</span>
269
- <span class="cline-any cline-neutral">&nbsp;</span>
270
- <span class="cline-any cline-neutral">&nbsp;</span>
271
- <span class="cline-any cline-neutral">&nbsp;</span>
272
- <span class="cline-any cline-neutral">&nbsp;</span>
273
- <span class="cline-any cline-yes">2x</span>
274
- <span class="cline-any cline-neutral">&nbsp;</span>
275
- <span class="cline-any cline-yes">2x</span>
276
- <span class="cline-any cline-neutral">&nbsp;</span>
277
- <span class="cline-any cline-neutral">&nbsp;</span>
278
- <span class="cline-any cline-neutral">&nbsp;</span>
279
- <span class="cline-any cline-neutral">&nbsp;</span>
280
- <span class="cline-any cline-neutral">&nbsp;</span>
281
- <span class="cline-any cline-neutral">&nbsp;</span>
282
- <span class="cline-any cline-neutral">&nbsp;</span>
283
- <span class="cline-any cline-neutral">&nbsp;</span>
284
- <span class="cline-any cline-neutral">&nbsp;</span>
285
- <span class="cline-any cline-yes">11x</span>
286
- <span class="cline-any cline-yes">11x</span>
287
- <span class="cline-any cline-yes">11x</span>
288
- <span class="cline-any cline-neutral">&nbsp;</span>
289
- <span class="cline-any cline-neutral">&nbsp;</span>
290
- <span class="cline-any cline-no">&nbsp;</span>
291
- <span class="cline-any cline-neutral">&nbsp;</span>
292
- <span class="cline-any cline-neutral">&nbsp;</span>
293
- <span class="cline-any cline-neutral">&nbsp;</span>
294
- <span class="cline-any cline-no">&nbsp;</span>
295
- <span class="cline-any cline-no">&nbsp;</span>
296
- <span class="cline-any cline-no">&nbsp;</span>
297
- <span class="cline-any cline-neutral">&nbsp;</span>
298
- <span class="cline-any cline-neutral">&nbsp;</span>
299
- <span class="cline-any cline-neutral">&nbsp;</span>
300
- <span class="cline-any cline-no">&nbsp;</span>
301
- <span class="cline-any cline-neutral">&nbsp;</span>
302
- <span class="cline-any cline-neutral">&nbsp;</span>
303
- <span class="cline-any cline-neutral">&nbsp;</span>
304
- <span class="cline-any cline-neutral">&nbsp;</span>
305
- <span class="cline-any cline-yes">10x</span>
306
- <span class="cline-any cline-yes">10x</span>
307
- <span class="cline-any cline-neutral">&nbsp;</span>
308
- <span class="cline-any cline-neutral">&nbsp;</span>
309
- <span class="cline-any cline-yes">10x</span>
310
- <span class="cline-any cline-no">&nbsp;</span>
311
- <span class="cline-any cline-no">&nbsp;</span>
312
- <span class="cline-any cline-no">&nbsp;</span>
313
- <span class="cline-any cline-no">&nbsp;</span>
314
- <span class="cline-any cline-no">&nbsp;</span>
315
- <span class="cline-any cline-neutral">&nbsp;</span>
316
- <span class="cline-any cline-neutral">&nbsp;</span>
317
- <span class="cline-any cline-neutral">&nbsp;</span>
318
- <span class="cline-any cline-no">&nbsp;</span>
319
- <span class="cline-any cline-no">&nbsp;</span>
320
- <span class="cline-any cline-no">&nbsp;</span>
321
- <span class="cline-any cline-neutral">&nbsp;</span>
322
- <span class="cline-any cline-neutral">&nbsp;</span>
323
- <span class="cline-any cline-neutral">&nbsp;</span>
324
- <span class="cline-any cline-yes">10x</span>
325
- <span class="cline-any cline-neutral">&nbsp;</span>
326
- <span class="cline-any cline-neutral">&nbsp;</span>
327
- <span class="cline-any cline-neutral">&nbsp;</span>
328
- <span class="cline-any cline-neutral">&nbsp;</span>
329
- <span class="cline-any cline-yes">10x</span>
330
- <span class="cline-any cline-yes">10x</span>
331
- <span class="cline-any cline-yes">10x</span>
332
- <span class="cline-any cline-neutral">&nbsp;</span>
333
- <span class="cline-any cline-yes">10x</span>
334
- <span class="cline-any cline-yes">10x</span>
335
- <span class="cline-any cline-yes">10x</span>
336
- <span class="cline-any cline-neutral">&nbsp;</span>
337
- <span class="cline-any cline-yes">10x</span>
338
- <span class="cline-any cline-yes">10x</span>
339
- <span class="cline-any cline-yes">10x</span>
340
- <span class="cline-any cline-neutral">&nbsp;</span>
341
- <span class="cline-any cline-neutral">&nbsp;</span>
342
- <span class="cline-any cline-neutral">&nbsp;</span>
343
- <span class="cline-any cline-yes">10x</span>
344
- <span class="cline-any cline-neutral">&nbsp;</span>
345
- <span class="cline-any cline-yes">10x</span>
346
- <span class="cline-any cline-neutral">&nbsp;</span>
347
- <span class="cline-any cline-neutral">&nbsp;</span>
348
- <span class="cline-any cline-neutral">&nbsp;</span>
349
- <span class="cline-any cline-neutral">&nbsp;</span>
350
- <span class="cline-any cline-neutral">&nbsp;</span>
351
- <span class="cline-any cline-neutral">&nbsp;</span>
352
- <span class="cline-any cline-neutral">&nbsp;</span>
353
- <span class="cline-any cline-neutral">&nbsp;</span>
354
- <span class="cline-any cline-neutral">&nbsp;</span>
355
- <span class="cline-any cline-yes">111x</span>
356
- <span class="cline-any cline-neutral">&nbsp;</span>
357
- <span class="cline-any cline-yes">10x</span>
358
- <span class="cline-any cline-neutral">&nbsp;</span>
359
- <span class="cline-any cline-neutral">&nbsp;</span>
360
- <span class="cline-any cline-yes">10x</span>
361
- <span class="cline-any cline-yes">10x</span>
362
- <span class="cline-any cline-neutral">&nbsp;</span>
363
- <span class="cline-any cline-yes">10x</span>
364
- <span class="cline-any cline-neutral">&nbsp;</span>
365
- <span class="cline-any cline-neutral">&nbsp;</span>
366
- <span class="cline-any cline-yes">10x</span>
367
- <span class="cline-any cline-yes">10x</span>
368
- <span class="cline-any cline-neutral">&nbsp;</span>
369
- <span class="cline-any cline-neutral">&nbsp;</span>
370
- <span class="cline-any cline-neutral">&nbsp;</span>
371
- <span class="cline-any cline-neutral">&nbsp;</span>
372
- <span class="cline-any cline-yes">10x</span>
373
- <span class="cline-any cline-yes">10x</span>
374
- <span class="cline-any cline-neutral">&nbsp;</span>
375
- <span class="cline-any cline-neutral">&nbsp;</span>
376
- <span class="cline-any cline-neutral">&nbsp;</span>
377
- <span class="cline-any cline-yes">7x</span>
378
- <span class="cline-any cline-yes">5x</span>
379
- <span class="cline-any cline-yes">5x</span>
380
- <span class="cline-any cline-neutral">&nbsp;</span>
381
- <span class="cline-any cline-yes">7x</span>
382
- <span class="cline-any cline-yes">5x</span>
383
- <span class="cline-any cline-yes">5x</span>
384
- <span class="cline-any cline-neutral">&nbsp;</span>
385
- <span class="cline-any cline-neutral">&nbsp;</span>
386
- <span class="cline-any cline-neutral">&nbsp;</span>
387
- <span class="cline-any cline-yes">10x</span>
388
- <span class="cline-any cline-neutral">&nbsp;</span>
389
- <span class="cline-any cline-neutral">&nbsp;</span>
390
- <span class="cline-any cline-yes">10x</span>
391
- <span class="cline-any cline-yes">10x</span>
392
- <span class="cline-any cline-neutral">&nbsp;</span>
393
- <span class="cline-any cline-neutral">&nbsp;</span>
394
- <span class="cline-any cline-yes">10x</span>
395
- <span class="cline-any cline-yes">10x</span>
396
- <span class="cline-any cline-neutral">&nbsp;</span>
397
- <span class="cline-any cline-neutral">&nbsp;</span>
398
- <span class="cline-any cline-yes">10x</span>
399
- <span class="cline-any cline-neutral">&nbsp;</span>
400
- <span class="cline-any cline-yes">10x</span>
401
- <span class="cline-any cline-neutral">&nbsp;</span>
402
- <span class="cline-any cline-neutral">&nbsp;</span>
403
- <span class="cline-any cline-yes">10x</span>
404
- <span class="cline-any cline-neutral">&nbsp;</span>
405
- <span class="cline-any cline-yes">10x</span>
406
- <span class="cline-any cline-yes">10x</span>
407
- <span class="cline-any cline-yes">9x</span>
408
- <span class="cline-any cline-yes">9x</span>
409
- <span class="cline-any cline-neutral">&nbsp;</span>
410
- <span class="cline-any cline-neutral">&nbsp;</span>
411
- <span class="cline-any cline-neutral">&nbsp;</span>
412
- <span class="cline-any cline-yes">10x</span>
413
- <span class="cline-any cline-neutral">&nbsp;</span>
414
- <span class="cline-any cline-neutral">&nbsp;</span>
415
- <span class="cline-any cline-neutral">&nbsp;</span>
416
- <span class="cline-any cline-neutral">&nbsp;</span>
417
- <span class="cline-any cline-neutral">&nbsp;</span>
418
- <span class="cline-any cline-yes">37x</span>
419
- <span class="cline-any cline-yes">37x</span>
420
- <span class="cline-any cline-yes">9x</span>
421
- <span class="cline-any cline-yes">4x</span>
422
- <span class="cline-any cline-neutral">&nbsp;</span>
423
- <span class="cline-any cline-yes">5x</span>
424
- <span class="cline-any cline-neutral">&nbsp;</span>
425
- <span class="cline-any cline-yes">28x</span>
426
- <span class="cline-any cline-neutral">&nbsp;</span>
427
- <span class="cline-any cline-neutral">&nbsp;</span>
428
- <span class="cline-any cline-neutral">&nbsp;</span>
429
- <span class="cline-any cline-neutral">&nbsp;</span>
430
- <span class="cline-any cline-neutral">&nbsp;</span>
431
- <span class="cline-any cline-neutral">&nbsp;</span>
432
- <span class="cline-any cline-neutral">&nbsp;</span>
433
- <span class="cline-any cline-yes">11x</span>
434
- <span class="cline-any cline-neutral">&nbsp;</span>
435
- <span class="cline-any cline-neutral">&nbsp;</span>
436
- <span class="cline-any cline-neutral">&nbsp;</span>
437
- <span class="cline-any cline-neutral">&nbsp;</span>
438
- <span class="cline-any cline-neutral">&nbsp;</span>
439
- <span class="cline-any cline-yes">11x</span>
440
- <span class="cline-any cline-neutral">&nbsp;</span>
441
- <span class="cline-any cline-neutral">&nbsp;</span>
442
- <span class="cline-any cline-neutral">&nbsp;</span>
443
- <span class="cline-any cline-neutral">&nbsp;</span>
444
- <span class="cline-any cline-neutral">&nbsp;</span>
445
- <span class="cline-any cline-neutral">&nbsp;</span>
446
- <span class="cline-any cline-yes">37x</span>
447
- <span class="cline-any cline-yes">37x</span>
448
- <span class="cline-any cline-neutral">&nbsp;</span>
449
- <span class="cline-any cline-neutral">&nbsp;</span>
450
- <span class="cline-any cline-neutral">&nbsp;</span>
451
- <span class="cline-any cline-neutral">&nbsp;</span>
452
- <span class="cline-any cline-neutral">&nbsp;</span>
453
- <span class="cline-any cline-neutral">&nbsp;</span>
454
- <span class="cline-any cline-neutral">&nbsp;</span>
455
- <span class="cline-any cline-neutral">&nbsp;</span>
456
- <span class="cline-any cline-neutral">&nbsp;</span>
457
- <span class="cline-any cline-neutral">&nbsp;</span>
458
- <span class="cline-any cline-neutral">&nbsp;</span>
459
- <span class="cline-any cline-neutral">&nbsp;</span>
460
- <span class="cline-any cline-neutral">&nbsp;</span>
461
- <span class="cline-any cline-neutral">&nbsp;</span>
462
- <span class="cline-any cline-neutral">&nbsp;</span>
463
- <span class="cline-any cline-neutral">&nbsp;</span>
464
- <span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">// @flow
465
- import * as React from 'react';
466
- import type {Node as ReactNode} from 'react';
467
- import {DraggableCore} from 'react-draggable';
468
- import {cloneElement} from './utils';
469
- import {resizableProps} from "./propTypes";
470
- import type {ResizeHandleAxis, DefaultProps, Props, ReactRef, DragCallbackData} from './propTypes';
471
- &nbsp;
472
- // The base &lt;Resizable&gt; component.
473
- // This component does not have state and relies on the parent to set its props based on callback data.
474
- export default class Resizable extends React.Component&lt;Props, void&gt; {
475
- static propTypes = resizableProps;
476
- &nbsp;
477
- static defaultProps: DefaultProps = {
478
- axis: 'both',
479
- handleSize: [20, 20],
480
- lockAspectRatio: false,
481
- minConstraints: [20, 20],
482
- maxConstraints: [Infinity, Infinity],
483
- resizeHandles: ['se'],
484
- transformScale: 1
485
- };
486
- &nbsp;
487
- handleRefs: {[key: ResizeHandleAxis]: ReactRef&lt;HTMLElement&gt;} = {};
488
- lastHandleRect: ?ClientRect = null;
489
- slack: ?[number, number] = null;
490
- &nbsp;
491
- <span class="fstat-no" title="function not covered" > co</span>mponentWillUnmount() {
492
- <span class="cstat-no" title="statement not covered" > this.resetData();</span>
493
- }
494
- &nbsp;
495
- <span class="fstat-no" title="function not covered" > lo</span>ckAspectRatio(width: number, height: number, aspectRatio: number): [number, number] {
496
- <span class="cstat-no" title="statement not covered" > height = width / aspectRatio;</span>
497
- <span class="cstat-no" title="statement not covered" > width = height * aspectRatio;</span>
498
- <span class="cstat-no" title="statement not covered" > return [width, height];</span>
499
- }
500
- &nbsp;
501
- <span class="fstat-no" title="function not covered" > re</span>setData() {
502
- <span class="cstat-no" title="statement not covered" > this.lastHandleRect = this.slack = null;</span>
503
- }
504
- &nbsp;
505
- // Clamp width and height within provided constraints
506
- runConstraints(width: number, height: number): [number, number] {
507
- const [min, max] = [this.props.minConstraints, this.props.maxConstraints];
508
- <span class="missing-if-branch" title="if path not taken" >I</span>if (!min &amp;&amp; <span class="branch-1 cbranch-no" title="branch not covered" >!max)</span> <span class="cstat-no" title="statement not covered" >return [width, height];</span>
509
- &nbsp;
510
- // If constraining to min and max, we need to also fit width and height to aspect ratio.
511
- <span class="missing-if-branch" title="if path not taken" >I</span>if (this.props.lockAspectRatio) {
512
- const resizingHorizontally = <span class="cstat-no" title="statement not covered" >height === this.props.height;</span>
513
- <span class="cstat-no" title="statement not covered" > if (resizingHorizontally) {</span>
514
- const ratio = <span class="cstat-no" title="statement not covered" >this.props.width / this.props.height;</span>
515
- <span class="cstat-no" title="statement not covered" > height = width / ratio;</span>
516
- <span class="cstat-no" title="statement not covered" > width = height * ratio;</span>
517
- } else {
518
- // Take into account vertical resize with N/S handles on locked aspect
519
- // ratio. Calculate the change height-first, instead of width-first
520
- const ratio = <span class="cstat-no" title="statement not covered" >this.props.height / this.props.width;</span>
521
- <span class="cstat-no" title="statement not covered" > width = height / ratio;</span>
522
- <span class="cstat-no" title="statement not covered" > height = width * ratio;</span>
523
- }
524
- }
525
- &nbsp;
526
- const [oldW, oldH] = [width, height];
527
- &nbsp;
528
- // Add slack to the values used to calculate bound position. This will ensure that if
529
- // we start removing slack, the element won't react to it right away until it's been
530
- // completely removed.
531
- let [slackW, slackH] = this.slack || [0, 0];
532
- width += slackW;
533
- height += slackH;
534
- &nbsp;
535
- <span class="missing-if-branch" title="else path not taken" >E</span>if (min) {
536
- width = Math.max(min[0], width);
537
- height = Math.max(min[1], height);
538
- }
539
- <span class="missing-if-branch" title="else path not taken" >E</span>if (max) {
540
- width = Math.min(max[0], width);
541
- height = Math.min(max[1], height);
542
- }
543
- &nbsp;
544
- // If the width or height changed, we must have introduced some slack. Record it for the next iteration.
545
- this.slack = [slackW + (oldW - width), slackH + (oldH - height)];
546
- &nbsp;
547
- return [width, height];
548
- }
549
- &nbsp;
550
- /**
551
- * Wrapper around drag events to provide more useful data.
552
- *
553
- * @param {String} handlerName Handler name to wrap.
554
- * @return {Function} Handler function.
555
- */
556
- resizeHandler(handlerName: 'onResize' | 'onResizeStart' | 'onResizeStop', axis: ResizeHandleAxis): Function {
557
- return (e: SyntheticEvent&lt;&gt;, {node, deltaX, deltaY}: DragCallbackData) =&gt; {
558
- // Reset data in case it was left over somehow (should not be possible)
559
- <span class="missing-if-branch" title="if path not taken" >I</span>if (handlerName === 'onResizeStart') <span class="cstat-no" title="statement not covered" >this.resetData();</span>
560
- &nbsp;
561
- // Axis restrictions
562
- const canDragX = (this.props.axis === 'both' || <span class="branch-1 cbranch-no" title="branch not covered" >this.props.axis === 'x')</span> &amp;&amp; axis !== 'n' &amp;&amp; axis !== 's';
563
- const canDragY = (this.props.axis === 'both' || <span class="branch-1 cbranch-no" title="branch not covered" >this.props.axis === 'y')</span> &amp;&amp; axis !== 'e' &amp;&amp; axis !== 'w';
564
- // No dragging possible.
565
- <span class="missing-if-branch" title="if path not taken" >I</span>if (!canDragX &amp;&amp; <span class="branch-1 cbranch-no" title="branch not covered" >!canDragY)</span> <span class="cstat-no" title="statement not covered" >return;</span>
566
- &nbsp;
567
- // Decompose axis for later use
568
- const axisV = axis[0];
569
- const axisH = axis[axis.length - 1]; // intentionally not axis[1], so that this catches axis === 'w' for example
570
- &nbsp;
571
- // Track the element being dragged to account for changes in position.
572
- // If a handle's position is changed between callbacks, we need to factor this in to the next callback.
573
- // Failure to do so will cause the element to "skip" when resized upwards or leftwards.
574
- const handleRect = node.getBoundingClientRect();
575
- if (this.lastHandleRect != null) {
576
- // If the handle has repositioned on either axis since last render,
577
- // we need to increase our callback values by this much.
578
- // Only checking 'n', 'w' since resizing by 's', 'w' won't affect the overall position on page,
579
- if (axisH === 'w') {
580
- const deltaLeftSinceLast = handleRect.left - this.lastHandleRect.left;
581
- deltaX += deltaLeftSinceLast;
582
- }
583
- if (axisV === 'n') {
584
- const deltaTopSinceLast = handleRect.top - this.lastHandleRect.top;
585
- deltaY += deltaTopSinceLast;
586
- }
587
- }
588
- // Storage of last rect so we know how much it has really moved.
589
- this.lastHandleRect = handleRect;
590
- &nbsp;
591
- // Reverse delta if using top or left drag handles.
592
- if (axisH === 'w') deltaX = -deltaX;
593
- if (axisV === 'n') deltaY = -deltaY;
594
- &nbsp;
595
- // Update w/h by the deltas. Also factor in transformScale.
596
- let width = this.props.width + (canDragX ? deltaX / this.props.transformScale : <span class="branch-1 cbranch-no" title="branch not covered" >0)</span>;
597
- let height = this.props.height + (canDragY ? deltaY / this.props.transformScale : <span class="branch-1 cbranch-no" title="branch not covered" >0)</span>;
598
- &nbsp;
599
- // Run user-provided constraints.
600
- [width, height] = this.runConstraints(width, height);
601
- &nbsp;
602
- const dimensionsChanged = width !== this.props.width || height !== this.props.height;
603
- &nbsp;
604
- // Call user-supplied callback if present.
605
- const cb = typeof this.props[handlerName] === 'function' ? this.props[handlerName] : <span class="branch-1 cbranch-no" title="branch not covered" >null;</span>
606
- // Don't call 'onResize' if dimensions haven't changed.
607
- const shouldSkipCb = handlerName === 'onResize' &amp;&amp; !dimensionsChanged;
608
- if (cb &amp;&amp; !shouldSkipCb) {
609
- <span class="missing-if-branch" title="if path not taken" >I</span>if (typeof e.persist === 'function') <span class="cstat-no" title="statement not covered" >e.persist();</span>
610
- cb(e, {node, size: {width, height}, handle: axis});
611
- }
612
- &nbsp;
613
- // Reset internal data
614
- <span class="missing-if-branch" title="if path not taken" >I</span>if (handlerName === 'onResizeStop') <span class="cstat-no" title="statement not covered" >this.resetData();</span>
615
- };
616
- }
617
- &nbsp;
618
- // Render a resize handle given an axis &amp; DOM ref.
619
- renderResizeHandle(handleAxis: ResizeHandleAxis, ref: ReactRef&lt;HTMLElement&gt;): ReactNode {
620
- const {handle} = this.props;
621
- if (handle) {
622
- if (typeof handle === 'function') {
623
- return handle(handleAxis, ref);
624
- }
625
- return React.cloneElement(handle, {ref});
626
- }
627
- return &lt;span className={`react-resizable-handle react-resizable-handle-${handleAxis}`} ref={ref} /&gt;;
628
- }
629
- &nbsp;
630
- render(): ReactNode {
631
- // Pass along only props not meant for the `&lt;Resizable&gt;`.`
632
- // eslint-disable-next-line no-unused-vars
633
- const {children, className, draggableOpts, width, height, handle, handleSize,
634
- lockAspectRatio, axis, minConstraints, maxConstraints, onResize,
635
- onResizeStop, onResizeStart, resizeHandles, transformScale, ...p} = this.props;
636
- &nbsp;
637
- // What we're doing here is getting the child of this element, and cloning it with this element's props.
638
- // We are then defining its children as:
639
- // Its original children (resizable's child's children), and
640
- // One or more draggable handles.
641
- return cloneElement(children, {
642
- ...p,
643
- className: `${className ? `${className} ` : ''}react-resizable`,
644
- children: [
645
- ...children.props.children,
646
- ...resizeHandles.map((handleAxis) =&gt; {
647
- // Create a ref to the handle so that `&lt;DraggableCore&gt;` doesn't have to use ReactDOM.findDOMNode().
648
- const ref = (this.handleRefs[handleAxis]) ?? (this.handleRefs[handleAxis] = React.createRef());
649
- return (
650
- &lt;DraggableCore
651
- {...draggableOpts}
652
- nodeRef={ref}
653
- key={`resizableHandle-${handleAxis}`}
654
- onStop={this.resizeHandler('onResizeStop', handleAxis)}
655
- onStart={this.resizeHandler('onResizeStart', handleAxis)}
656
- onDrag={this.resizeHandler('onResize', handleAxis)}
657
- &gt;
658
- {this.renderResizeHandle(handleAxis, ref)}
659
- &lt;/DraggableCore&gt;
660
- );
661
- })
662
- ]
663
- });
664
- }
665
- }
666
- &nbsp;</pre></td></tr></table></pre>
667
-
668
- <div class='push'></div><!-- for sticky footer -->
669
- </div><!-- /wrapper -->
670
- <div class='footer quiet pad2 space-top1 center small'>
671
- Code coverage generated by
672
- <a href="https://istanbul.js.org/" target="_blank">istanbul</a>
673
- at Mon May 10 2021 11:36:10 GMT-0400 (Eastern Daylight Time)
674
- </div>
675
- </div>
676
- <script src="prettify.js"></script>
677
- <script>
678
- window.onload = function () {
679
- prettyPrint();
680
- };
681
- </script>
682
- <script src="sorter.js"></script>
683
- <script src="block-navigation.js"></script>
684
- </body>
685
- </html>
686
-