@itwin/imodel-components-react 4.0.0-dev.9 → 4.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.
Files changed (374) hide show
  1. package/CHANGELOG.md +161 -1
  2. package/README.md +2 -2
  3. package/lib/cjs/imodel-components-react/UiIModelComponents.d.ts +28 -28
  4. package/lib/cjs/imodel-components-react/UiIModelComponents.d.ts.map +1 -1
  5. package/lib/cjs/imodel-components-react/UiIModelComponents.js +75 -79
  6. package/lib/cjs/imodel-components-react/UiIModelComponents.js.map +1 -1
  7. package/lib/cjs/imodel-components-react/color/AlphaSlider.d.ts +36 -36
  8. package/lib/cjs/imodel-components-react/color/AlphaSlider.js +190 -186
  9. package/lib/cjs/imodel-components-react/color/AlphaSlider.js.map +1 -1
  10. package/lib/cjs/imodel-components-react/color/AlphaSlider.scss +63 -63
  11. package/lib/cjs/imodel-components-react/color/ColorPickerButton.d.ts +37 -37
  12. package/lib/cjs/imodel-components-react/color/ColorPickerButton.d.ts.map +1 -1
  13. package/lib/cjs/imodel-components-react/color/ColorPickerButton.js +112 -107
  14. package/lib/cjs/imodel-components-react/color/ColorPickerButton.js.map +1 -1
  15. package/lib/cjs/imodel-components-react/color/ColorPickerButton.scss +90 -90
  16. package/lib/cjs/imodel-components-react/color/ColorPickerDialog.d.ts +23 -23
  17. package/lib/cjs/imodel-components-react/color/ColorPickerDialog.js +78 -74
  18. package/lib/cjs/imodel-components-react/color/ColorPickerDialog.js.map +1 -1
  19. package/lib/cjs/imodel-components-react/color/ColorPickerPopup.d.ts +44 -44
  20. package/lib/cjs/imodel-components-react/color/ColorPickerPopup.d.ts.map +1 -1
  21. package/lib/cjs/imodel-components-react/color/ColorPickerPopup.js +143 -137
  22. package/lib/cjs/imodel-components-react/color/ColorPickerPopup.js.map +1 -1
  23. package/lib/cjs/imodel-components-react/color/ColorPickerPopup.scss +62 -63
  24. package/lib/cjs/imodel-components-react/color/HueSlider.d.ts +22 -22
  25. package/lib/cjs/imodel-components-react/color/HueSlider.js +203 -199
  26. package/lib/cjs/imodel-components-react/color/HueSlider.js.map +1 -1
  27. package/lib/cjs/imodel-components-react/color/HueSlider.scss +61 -61
  28. package/lib/cjs/imodel-components-react/color/SaturationPicker.d.ts +20 -20
  29. package/lib/cjs/imodel-components-react/color/SaturationPicker.js +217 -213
  30. package/lib/cjs/imodel-components-react/color/SaturationPicker.js.map +1 -1
  31. package/lib/cjs/imodel-components-react/color/SaturationPicker.scss +35 -35
  32. package/lib/cjs/imodel-components-react/color/Swatch.d.ts +22 -22
  33. package/lib/cjs/imodel-components-react/color/Swatch.js +64 -60
  34. package/lib/cjs/imodel-components-react/color/Swatch.js.map +1 -1
  35. package/lib/cjs/imodel-components-react/color/Swatch.scss +22 -23
  36. package/lib/cjs/imodel-components-react/color/getCSSColorFromDef.d.ts +6 -6
  37. package/lib/cjs/imodel-components-react/color/getCSSColorFromDef.js +23 -23
  38. package/lib/cjs/imodel-components-react/color/getCSSColorFromDef.js.map +1 -1
  39. package/lib/cjs/imodel-components-react/editors/ColorEditor.d.ts +44 -44
  40. package/lib/cjs/imodel-components-react/editors/ColorEditor.js +155 -151
  41. package/lib/cjs/imodel-components-react/editors/ColorEditor.js.map +1 -1
  42. package/lib/cjs/imodel-components-react/editors/ColorEditor.scss +18 -18
  43. package/lib/cjs/imodel-components-react/editors/WeightEditor.d.ts +47 -47
  44. package/lib/cjs/imodel-components-react/editors/WeightEditor.js +164 -160
  45. package/lib/cjs/imodel-components-react/editors/WeightEditor.js.map +1 -1
  46. package/lib/cjs/imodel-components-react/editors/WeightEditor.scss +16 -16
  47. package/lib/cjs/imodel-components-react/inputs/QuantityInput.d.ts +25 -25
  48. package/lib/cjs/imodel-components-react/inputs/QuantityInput.js +100 -96
  49. package/lib/cjs/imodel-components-react/inputs/QuantityInput.js.map +1 -1
  50. package/lib/cjs/imodel-components-react/inputs/QuantityNumberInput.d.ts +44 -44
  51. package/lib/cjs/imodel-components-react/inputs/QuantityNumberInput.d.ts.map +1 -1
  52. package/lib/cjs/imodel-components-react/inputs/QuantityNumberInput.js +272 -265
  53. package/lib/cjs/imodel-components-react/inputs/QuantityNumberInput.js.map +1 -1
  54. package/lib/cjs/imodel-components-react/inputs/QuantityNumberInput.scss +106 -107
  55. package/lib/cjs/imodel-components-react/lineweight/Swatch.d.ts +33 -33
  56. package/lib/cjs/imodel-components-react/lineweight/Swatch.js +89 -85
  57. package/lib/cjs/imodel-components-react/lineweight/Swatch.js.map +1 -1
  58. package/lib/cjs/imodel-components-react/lineweight/Swatch.scss +48 -48
  59. package/lib/cjs/imodel-components-react/lineweight/WeightPickerButton.d.ts +60 -60
  60. package/lib/cjs/imodel-components-react/lineweight/WeightPickerButton.js +163 -159
  61. package/lib/cjs/imodel-components-react/lineweight/WeightPickerButton.js.map +1 -1
  62. package/lib/cjs/imodel-components-react/lineweight/WeightPickerButton.scss +51 -52
  63. package/lib/cjs/imodel-components-react/navigationaids/Cube.d.ts +45 -45
  64. package/lib/cjs/imodel-components-react/navigationaids/Cube.js +131 -127
  65. package/lib/cjs/imodel-components-react/navigationaids/Cube.js.map +1 -1
  66. package/lib/cjs/imodel-components-react/navigationaids/Cube.scss +19 -19
  67. package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.d.ts +154 -174
  68. package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.d.ts.map +1 -1
  69. package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.js +626 -634
  70. package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.js.map +1 -1
  71. package/lib/cjs/imodel-components-react/navigationaids/CubeNavigationAid.scss +178 -182
  72. package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.d.ts +145 -145
  73. package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.d.ts.map +1 -1
  74. package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.js +657 -647
  75. package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.js.map +1 -1
  76. package/lib/cjs/imodel-components-react/navigationaids/DrawingNavigationAid.scss +135 -134
  77. package/lib/cjs/imodel-components-react/quantityformat/FormatPanel.d.ts +26 -26
  78. package/lib/cjs/imodel-components-react/quantityformat/FormatPanel.js +103 -99
  79. package/lib/cjs/imodel-components-react/quantityformat/FormatPanel.js.map +1 -1
  80. package/lib/cjs/imodel-components-react/quantityformat/FormatPanel.scss +59 -63
  81. package/lib/cjs/imodel-components-react/quantityformat/FormatPrecision.d.ts +17 -17
  82. package/lib/cjs/imodel-components-react/quantityformat/FormatPrecision.js +56 -53
  83. package/lib/cjs/imodel-components-react/quantityformat/FormatPrecision.js.map +1 -1
  84. package/lib/cjs/imodel-components-react/quantityformat/FormatSample.d.ts +18 -18
  85. package/lib/cjs/imodel-components-react/quantityformat/FormatSample.d.ts.map +1 -1
  86. package/lib/cjs/imodel-components-react/quantityformat/FormatSample.js +88 -83
  87. package/lib/cjs/imodel-components-react/quantityformat/FormatSample.js.map +1 -1
  88. package/lib/cjs/imodel-components-react/quantityformat/FormatType.d.ts +17 -17
  89. package/lib/cjs/imodel-components-react/quantityformat/FormatType.js +89 -86
  90. package/lib/cjs/imodel-components-react/quantityformat/FormatType.js.map +1 -1
  91. package/lib/cjs/imodel-components-react/quantityformat/FormatUnitLabel.d.ts +17 -17
  92. package/lib/cjs/imodel-components-react/quantityformat/FormatUnitLabel.js +112 -109
  93. package/lib/cjs/imodel-components-react/quantityformat/FormatUnitLabel.js.map +1 -1
  94. package/lib/cjs/imodel-components-react/quantityformat/FormatUnits.d.ts +19 -19
  95. package/lib/cjs/imodel-components-react/quantityformat/FormatUnits.js +133 -133
  96. package/lib/cjs/imodel-components-react/quantityformat/FormatUnits.js.map +1 -1
  97. package/lib/cjs/imodel-components-react/quantityformat/MiscFormatOptions.d.ts +21 -21
  98. package/lib/cjs/imodel-components-react/quantityformat/MiscFormatOptions.js +187 -184
  99. package/lib/cjs/imodel-components-react/quantityformat/MiscFormatOptions.js.map +1 -1
  100. package/lib/cjs/imodel-components-react/quantityformat/QuantityFormatPanel.d.ts +22 -22
  101. package/lib/cjs/imodel-components-react/quantityformat/QuantityFormatPanel.js +149 -145
  102. package/lib/cjs/imodel-components-react/quantityformat/QuantityFormatPanel.js.map +1 -1
  103. package/lib/cjs/imodel-components-react/quantityformat/misc/DecimalPrecision.d.ts +17 -17
  104. package/lib/cjs/imodel-components-react/quantityformat/misc/DecimalPrecision.js +63 -59
  105. package/lib/cjs/imodel-components-react/quantityformat/misc/DecimalPrecision.js.map +1 -1
  106. package/lib/cjs/imodel-components-react/quantityformat/misc/DecimalSeparator.d.ts +17 -17
  107. package/lib/cjs/imodel-components-react/quantityformat/misc/DecimalSeparator.js +51 -47
  108. package/lib/cjs/imodel-components-react/quantityformat/misc/DecimalSeparator.js.map +1 -1
  109. package/lib/cjs/imodel-components-react/quantityformat/misc/FractionPrecision.d.ts +16 -16
  110. package/lib/cjs/imodel-components-react/quantityformat/misc/FractionPrecision.js +58 -54
  111. package/lib/cjs/imodel-components-react/quantityformat/misc/FractionPrecision.js.map +1 -1
  112. package/lib/cjs/imodel-components-react/quantityformat/misc/ScientificType.d.ts +18 -18
  113. package/lib/cjs/imodel-components-react/quantityformat/misc/ScientificType.js +52 -48
  114. package/lib/cjs/imodel-components-react/quantityformat/misc/ScientificType.js.map +1 -1
  115. package/lib/cjs/imodel-components-react/quantityformat/misc/SignOption.d.ts +17 -17
  116. package/lib/cjs/imodel-components-react/quantityformat/misc/SignOption.js +54 -50
  117. package/lib/cjs/imodel-components-react/quantityformat/misc/SignOption.js.map +1 -1
  118. package/lib/cjs/imodel-components-react/quantityformat/misc/StationSeparatorSelector.d.ts +17 -17
  119. package/lib/cjs/imodel-components-react/quantityformat/misc/StationSeparatorSelector.js +62 -58
  120. package/lib/cjs/imodel-components-react/quantityformat/misc/StationSeparatorSelector.js.map +1 -1
  121. package/lib/cjs/imodel-components-react/quantityformat/misc/StationSizeSelector.d.ts +17 -17
  122. package/lib/cjs/imodel-components-react/quantityformat/misc/StationSizeSelector.js +51 -47
  123. package/lib/cjs/imodel-components-react/quantityformat/misc/StationSizeSelector.js.map +1 -1
  124. package/lib/cjs/imodel-components-react/quantityformat/misc/ThousandsSelector.d.ts +17 -17
  125. package/lib/cjs/imodel-components-react/quantityformat/misc/ThousandsSelector.js +60 -56
  126. package/lib/cjs/imodel-components-react/quantityformat/misc/ThousandsSelector.js.map +1 -1
  127. package/lib/cjs/imodel-components-react/quantityformat/misc/ThousandsSeparator.d.ts +17 -17
  128. package/lib/cjs/imodel-components-react/quantityformat/misc/ThousandsSeparator.js +98 -95
  129. package/lib/cjs/imodel-components-react/quantityformat/misc/ThousandsSeparator.js.map +1 -1
  130. package/lib/cjs/imodel-components-react/quantityformat/misc/UnitDescr.d.ts +23 -23
  131. package/lib/cjs/imodel-components-react/quantityformat/misc/UnitDescr.js +123 -119
  132. package/lib/cjs/imodel-components-react/quantityformat/misc/UnitDescr.js.map +1 -1
  133. package/lib/cjs/imodel-components-react/timeline/BaseSolarDataProvider.d.ts +52 -52
  134. package/lib/cjs/imodel-components-react/timeline/BaseSolarDataProvider.d.ts.map +1 -1
  135. package/lib/cjs/imodel-components-react/timeline/BaseSolarDataProvider.js +142 -143
  136. package/lib/cjs/imodel-components-react/timeline/BaseSolarDataProvider.js.map +1 -1
  137. package/lib/cjs/imodel-components-react/timeline/BaseTimelineDataProvider.d.ts +31 -31
  138. package/lib/cjs/imodel-components-react/timeline/BaseTimelineDataProvider.js +69 -69
  139. package/lib/cjs/imodel-components-react/timeline/BaseTimelineDataProvider.js.map +1 -1
  140. package/lib/cjs/imodel-components-react/timeline/InlineEdit.d.ts +27 -27
  141. package/lib/cjs/imodel-components-react/timeline/InlineEdit.js +85 -81
  142. package/lib/cjs/imodel-components-react/timeline/InlineEdit.js.map +1 -1
  143. package/lib/cjs/imodel-components-react/timeline/InlineEdit.scss +26 -26
  144. package/lib/cjs/imodel-components-react/timeline/PlayerButton.d.ts +33 -33
  145. package/lib/cjs/imodel-components-react/timeline/PlayerButton.d.ts.map +1 -1
  146. package/lib/cjs/imodel-components-react/timeline/PlayerButton.js +99 -91
  147. package/lib/cjs/imodel-components-react/timeline/PlayerButton.js.map +1 -1
  148. package/lib/cjs/imodel-components-react/timeline/PlayerButton.scss +28 -31
  149. package/lib/cjs/imodel-components-react/timeline/Scrubber.d.ts +54 -54
  150. package/lib/cjs/imodel-components-react/timeline/Scrubber.js +195 -191
  151. package/lib/cjs/imodel-components-react/timeline/Scrubber.js.map +1 -1
  152. package/lib/cjs/imodel-components-react/timeline/Scrubber.scss +105 -112
  153. package/lib/cjs/imodel-components-react/timeline/SolarTimeline.d.ts +77 -77
  154. package/lib/cjs/imodel-components-react/timeline/SolarTimeline.d.ts.map +1 -1
  155. package/lib/cjs/imodel-components-react/timeline/SolarTimeline.js +432 -424
  156. package/lib/cjs/imodel-components-react/timeline/SolarTimeline.js.map +1 -1
  157. package/lib/cjs/imodel-components-react/timeline/SolarTimeline.scss +359 -356
  158. package/lib/cjs/imodel-components-react/timeline/SpeedTimeline.d.ts +15 -15
  159. package/lib/cjs/imodel-components-react/timeline/SpeedTimeline.js +58 -54
  160. package/lib/cjs/imodel-components-react/timeline/SpeedTimeline.js.map +1 -1
  161. package/lib/cjs/imodel-components-react/timeline/SpeedTimeline.scss +39 -39
  162. package/lib/cjs/imodel-components-react/timeline/Timeline.scss +164 -164
  163. package/lib/cjs/imodel-components-react/timeline/TimelineComponent.d.ts +130 -133
  164. package/lib/cjs/imodel-components-react/timeline/TimelineComponent.d.ts.map +1 -1
  165. package/lib/cjs/imodel-components-react/timeline/TimelineComponent.js +398 -358
  166. package/lib/cjs/imodel-components-react/timeline/TimelineComponent.js.map +1 -1
  167. package/lib/cjs/imodel-components-react/timeline/TimelineComponent.scss +178 -164
  168. package/lib/cjs/imodel-components-react/timeline/interfaces.d.ts +145 -174
  169. package/lib/cjs/imodel-components-react/timeline/interfaces.d.ts.map +1 -1
  170. package/lib/cjs/imodel-components-react/timeline/interfaces.js +45 -45
  171. package/lib/cjs/imodel-components-react/timeline/interfaces.js.map +1 -1
  172. package/lib/cjs/imodel-components-react/viewport/ViewportComponent.d.ts +42 -42
  173. package/lib/cjs/imodel-components-react/viewport/ViewportComponent.d.ts.map +1 -1
  174. package/lib/cjs/imodel-components-react/viewport/ViewportComponent.js +276 -274
  175. package/lib/cjs/imodel-components-react/viewport/ViewportComponent.js.map +1 -1
  176. package/lib/cjs/imodel-components-react/viewport/ViewportComponentEvents.d.ts +106 -106
  177. package/lib/cjs/imodel-components-react/viewport/ViewportComponentEvents.js +105 -105
  178. package/lib/cjs/imodel-components-react/viewport/ViewportComponentEvents.js.map +1 -1
  179. package/lib/cjs/imodel-components-react.d.ts +81 -82
  180. package/lib/cjs/imodel-components-react.d.ts.map +1 -1
  181. package/lib/cjs/imodel-components-react.js +104 -101
  182. package/lib/cjs/imodel-components-react.js.map +1 -1
  183. package/lib/esm/imodel-components-react/UiIModelComponents.d.ts +28 -28
  184. package/lib/esm/imodel-components-react/UiIModelComponents.d.ts.map +1 -1
  185. package/lib/esm/imodel-components-react/UiIModelComponents.js +72 -75
  186. package/lib/esm/imodel-components-react/UiIModelComponents.js.map +1 -1
  187. package/lib/esm/imodel-components-react/color/AlphaSlider.d.ts +36 -36
  188. package/lib/esm/imodel-components-react/color/AlphaSlider.js +160 -160
  189. package/lib/esm/imodel-components-react/color/AlphaSlider.js.map +1 -1
  190. package/lib/esm/imodel-components-react/color/AlphaSlider.scss +63 -63
  191. package/lib/esm/imodel-components-react/color/ColorPickerButton.d.ts +37 -37
  192. package/lib/esm/imodel-components-react/color/ColorPickerButton.d.ts.map +1 -1
  193. package/lib/esm/imodel-components-react/color/ColorPickerButton.js +83 -82
  194. package/lib/esm/imodel-components-react/color/ColorPickerButton.js.map +1 -1
  195. package/lib/esm/imodel-components-react/color/ColorPickerButton.scss +90 -90
  196. package/lib/esm/imodel-components-react/color/ColorPickerDialog.d.ts +23 -23
  197. package/lib/esm/imodel-components-react/color/ColorPickerDialog.js +51 -51
  198. package/lib/esm/imodel-components-react/color/ColorPickerDialog.js.map +1 -1
  199. package/lib/esm/imodel-components-react/color/ColorPickerPopup.d.ts +44 -44
  200. package/lib/esm/imodel-components-react/color/ColorPickerPopup.d.ts.map +1 -1
  201. package/lib/esm/imodel-components-react/color/ColorPickerPopup.js +114 -112
  202. package/lib/esm/imodel-components-react/color/ColorPickerPopup.js.map +1 -1
  203. package/lib/esm/imodel-components-react/color/ColorPickerPopup.scss +62 -63
  204. package/lib/esm/imodel-components-react/color/HueSlider.d.ts +22 -22
  205. package/lib/esm/imodel-components-react/color/HueSlider.js +173 -173
  206. package/lib/esm/imodel-components-react/color/HueSlider.js.map +1 -1
  207. package/lib/esm/imodel-components-react/color/HueSlider.scss +61 -61
  208. package/lib/esm/imodel-components-react/color/SaturationPicker.d.ts +20 -20
  209. package/lib/esm/imodel-components-react/color/SaturationPicker.js +187 -187
  210. package/lib/esm/imodel-components-react/color/SaturationPicker.js.map +1 -1
  211. package/lib/esm/imodel-components-react/color/SaturationPicker.scss +35 -35
  212. package/lib/esm/imodel-components-react/color/Swatch.d.ts +22 -22
  213. package/lib/esm/imodel-components-react/color/Swatch.js +34 -34
  214. package/lib/esm/imodel-components-react/color/Swatch.js.map +1 -1
  215. package/lib/esm/imodel-components-react/color/Swatch.scss +22 -23
  216. package/lib/esm/imodel-components-react/color/getCSSColorFromDef.d.ts +6 -6
  217. package/lib/esm/imodel-components-react/color/getCSSColorFromDef.js +19 -19
  218. package/lib/esm/imodel-components-react/color/getCSSColorFromDef.js.map +1 -1
  219. package/lib/esm/imodel-components-react/editors/ColorEditor.d.ts +44 -44
  220. package/lib/esm/imodel-components-react/editors/ColorEditor.js +124 -124
  221. package/lib/esm/imodel-components-react/editors/ColorEditor.js.map +1 -1
  222. package/lib/esm/imodel-components-react/editors/ColorEditor.scss +18 -18
  223. package/lib/esm/imodel-components-react/editors/WeightEditor.d.ts +47 -47
  224. package/lib/esm/imodel-components-react/editors/WeightEditor.js +133 -133
  225. package/lib/esm/imodel-components-react/editors/WeightEditor.js.map +1 -1
  226. package/lib/esm/imodel-components-react/editors/WeightEditor.scss +16 -16
  227. package/lib/esm/imodel-components-react/inputs/QuantityInput.d.ts +25 -25
  228. package/lib/esm/imodel-components-react/inputs/QuantityInput.js +70 -70
  229. package/lib/esm/imodel-components-react/inputs/QuantityInput.js.map +1 -1
  230. package/lib/esm/imodel-components-react/inputs/QuantityNumberInput.d.ts +44 -44
  231. package/lib/esm/imodel-components-react/inputs/QuantityNumberInput.d.ts.map +1 -1
  232. package/lib/esm/imodel-components-react/inputs/QuantityNumberInput.js +243 -240
  233. package/lib/esm/imodel-components-react/inputs/QuantityNumberInput.js.map +1 -1
  234. package/lib/esm/imodel-components-react/inputs/QuantityNumberInput.scss +106 -107
  235. package/lib/esm/imodel-components-react/lineweight/Swatch.d.ts +33 -33
  236. package/lib/esm/imodel-components-react/lineweight/Swatch.js +59 -59
  237. package/lib/esm/imodel-components-react/lineweight/Swatch.js.map +1 -1
  238. package/lib/esm/imodel-components-react/lineweight/Swatch.scss +48 -48
  239. package/lib/esm/imodel-components-react/lineweight/WeightPickerButton.d.ts +60 -60
  240. package/lib/esm/imodel-components-react/lineweight/WeightPickerButton.js +134 -133
  241. package/lib/esm/imodel-components-react/lineweight/WeightPickerButton.js.map +1 -1
  242. package/lib/esm/imodel-components-react/lineweight/WeightPickerButton.scss +51 -52
  243. package/lib/esm/imodel-components-react/navigationaids/Cube.d.ts +45 -45
  244. package/lib/esm/imodel-components-react/navigationaids/Cube.js +100 -100
  245. package/lib/esm/imodel-components-react/navigationaids/Cube.js.map +1 -1
  246. package/lib/esm/imodel-components-react/navigationaids/Cube.scss +19 -19
  247. package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.d.ts +154 -174
  248. package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.d.ts.map +1 -1
  249. package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.js +596 -606
  250. package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.js.map +1 -1
  251. package/lib/esm/imodel-components-react/navigationaids/CubeNavigationAid.scss +178 -182
  252. package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.d.ts +145 -145
  253. package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.d.ts.map +1 -1
  254. package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.js +627 -620
  255. package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.js.map +1 -1
  256. package/lib/esm/imodel-components-react/navigationaids/DrawingNavigationAid.scss +135 -134
  257. package/lib/esm/imodel-components-react/quantityformat/FormatPanel.d.ts +26 -26
  258. package/lib/esm/imodel-components-react/quantityformat/FormatPanel.js +76 -76
  259. package/lib/esm/imodel-components-react/quantityformat/FormatPanel.js.map +1 -1
  260. package/lib/esm/imodel-components-react/quantityformat/FormatPanel.scss +59 -63
  261. package/lib/esm/imodel-components-react/quantityformat/FormatPrecision.d.ts +17 -17
  262. package/lib/esm/imodel-components-react/quantityformat/FormatPrecision.js +29 -30
  263. package/lib/esm/imodel-components-react/quantityformat/FormatPrecision.js.map +1 -1
  264. package/lib/esm/imodel-components-react/quantityformat/FormatSample.d.ts +18 -18
  265. package/lib/esm/imodel-components-react/quantityformat/FormatSample.d.ts.map +1 -1
  266. package/lib/esm/imodel-components-react/quantityformat/FormatSample.js +61 -60
  267. package/lib/esm/imodel-components-react/quantityformat/FormatSample.js.map +1 -1
  268. package/lib/esm/imodel-components-react/quantityformat/FormatType.d.ts +17 -17
  269. package/lib/esm/imodel-components-react/quantityformat/FormatType.js +62 -63
  270. package/lib/esm/imodel-components-react/quantityformat/FormatType.js.map +1 -1
  271. package/lib/esm/imodel-components-react/quantityformat/FormatUnitLabel.d.ts +17 -17
  272. package/lib/esm/imodel-components-react/quantityformat/FormatUnitLabel.js +82 -83
  273. package/lib/esm/imodel-components-react/quantityformat/FormatUnitLabel.js.map +1 -1
  274. package/lib/esm/imodel-components-react/quantityformat/FormatUnits.d.ts +19 -19
  275. package/lib/esm/imodel-components-react/quantityformat/FormatUnits.js +106 -110
  276. package/lib/esm/imodel-components-react/quantityformat/FormatUnits.js.map +1 -1
  277. package/lib/esm/imodel-components-react/quantityformat/MiscFormatOptions.d.ts +21 -21
  278. package/lib/esm/imodel-components-react/quantityformat/MiscFormatOptions.js +157 -158
  279. package/lib/esm/imodel-components-react/quantityformat/MiscFormatOptions.js.map +1 -1
  280. package/lib/esm/imodel-components-react/quantityformat/QuantityFormatPanel.d.ts +22 -22
  281. package/lib/esm/imodel-components-react/quantityformat/QuantityFormatPanel.js +122 -122
  282. package/lib/esm/imodel-components-react/quantityformat/QuantityFormatPanel.js.map +1 -1
  283. package/lib/esm/imodel-components-react/quantityformat/misc/DecimalPrecision.d.ts +17 -17
  284. package/lib/esm/imodel-components-react/quantityformat/misc/DecimalPrecision.js +36 -36
  285. package/lib/esm/imodel-components-react/quantityformat/misc/DecimalPrecision.js.map +1 -1
  286. package/lib/esm/imodel-components-react/quantityformat/misc/DecimalSeparator.d.ts +17 -17
  287. package/lib/esm/imodel-components-react/quantityformat/misc/DecimalSeparator.js +24 -24
  288. package/lib/esm/imodel-components-react/quantityformat/misc/DecimalSeparator.js.map +1 -1
  289. package/lib/esm/imodel-components-react/quantityformat/misc/FractionPrecision.d.ts +16 -16
  290. package/lib/esm/imodel-components-react/quantityformat/misc/FractionPrecision.js +31 -31
  291. package/lib/esm/imodel-components-react/quantityformat/misc/FractionPrecision.js.map +1 -1
  292. package/lib/esm/imodel-components-react/quantityformat/misc/ScientificType.d.ts +18 -18
  293. package/lib/esm/imodel-components-react/quantityformat/misc/ScientificType.js +25 -25
  294. package/lib/esm/imodel-components-react/quantityformat/misc/ScientificType.js.map +1 -1
  295. package/lib/esm/imodel-components-react/quantityformat/misc/SignOption.d.ts +17 -17
  296. package/lib/esm/imodel-components-react/quantityformat/misc/SignOption.js +27 -27
  297. package/lib/esm/imodel-components-react/quantityformat/misc/SignOption.js.map +1 -1
  298. package/lib/esm/imodel-components-react/quantityformat/misc/StationSeparatorSelector.d.ts +17 -17
  299. package/lib/esm/imodel-components-react/quantityformat/misc/StationSeparatorSelector.js +35 -35
  300. package/lib/esm/imodel-components-react/quantityformat/misc/StationSeparatorSelector.js.map +1 -1
  301. package/lib/esm/imodel-components-react/quantityformat/misc/StationSizeSelector.d.ts +17 -17
  302. package/lib/esm/imodel-components-react/quantityformat/misc/StationSizeSelector.js +24 -24
  303. package/lib/esm/imodel-components-react/quantityformat/misc/StationSizeSelector.js.map +1 -1
  304. package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSelector.d.ts +17 -17
  305. package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSelector.js +33 -33
  306. package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSelector.js.map +1 -1
  307. package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSeparator.d.ts +17 -17
  308. package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSeparator.js +68 -69
  309. package/lib/esm/imodel-components-react/quantityformat/misc/ThousandsSeparator.js.map +1 -1
  310. package/lib/esm/imodel-components-react/quantityformat/misc/UnitDescr.d.ts +23 -23
  311. package/lib/esm/imodel-components-react/quantityformat/misc/UnitDescr.js +96 -96
  312. package/lib/esm/imodel-components-react/quantityformat/misc/UnitDescr.js.map +1 -1
  313. package/lib/esm/imodel-components-react/timeline/BaseSolarDataProvider.d.ts +52 -52
  314. package/lib/esm/imodel-components-react/timeline/BaseSolarDataProvider.d.ts.map +1 -1
  315. package/lib/esm/imodel-components-react/timeline/BaseSolarDataProvider.js +138 -139
  316. package/lib/esm/imodel-components-react/timeline/BaseSolarDataProvider.js.map +1 -1
  317. package/lib/esm/imodel-components-react/timeline/BaseTimelineDataProvider.d.ts +31 -31
  318. package/lib/esm/imodel-components-react/timeline/BaseTimelineDataProvider.js +65 -65
  319. package/lib/esm/imodel-components-react/timeline/BaseTimelineDataProvider.js.map +1 -1
  320. package/lib/esm/imodel-components-react/timeline/InlineEdit.d.ts +27 -27
  321. package/lib/esm/imodel-components-react/timeline/InlineEdit.js +55 -55
  322. package/lib/esm/imodel-components-react/timeline/InlineEdit.js.map +1 -1
  323. package/lib/esm/imodel-components-react/timeline/InlineEdit.scss +26 -26
  324. package/lib/esm/imodel-components-react/timeline/PlayerButton.d.ts +33 -33
  325. package/lib/esm/imodel-components-react/timeline/PlayerButton.d.ts.map +1 -1
  326. package/lib/esm/imodel-components-react/timeline/PlayerButton.js +68 -64
  327. package/lib/esm/imodel-components-react/timeline/PlayerButton.js.map +1 -1
  328. package/lib/esm/imodel-components-react/timeline/PlayerButton.scss +28 -31
  329. package/lib/esm/imodel-components-react/timeline/Scrubber.d.ts +54 -54
  330. package/lib/esm/imodel-components-react/timeline/Scrubber.js +164 -164
  331. package/lib/esm/imodel-components-react/timeline/Scrubber.js.map +1 -1
  332. package/lib/esm/imodel-components-react/timeline/Scrubber.scss +105 -112
  333. package/lib/esm/imodel-components-react/timeline/SolarTimeline.d.ts +77 -77
  334. package/lib/esm/imodel-components-react/timeline/SolarTimeline.d.ts.map +1 -1
  335. package/lib/esm/imodel-components-react/timeline/SolarTimeline.js +402 -398
  336. package/lib/esm/imodel-components-react/timeline/SolarTimeline.js.map +1 -1
  337. package/lib/esm/imodel-components-react/timeline/SolarTimeline.scss +359 -356
  338. package/lib/esm/imodel-components-react/timeline/SpeedTimeline.d.ts +15 -15
  339. package/lib/esm/imodel-components-react/timeline/SpeedTimeline.js +28 -28
  340. package/lib/esm/imodel-components-react/timeline/SpeedTimeline.js.map +1 -1
  341. package/lib/esm/imodel-components-react/timeline/SpeedTimeline.scss +39 -39
  342. package/lib/esm/imodel-components-react/timeline/Timeline.scss +164 -164
  343. package/lib/esm/imodel-components-react/timeline/TimelineComponent.d.ts +130 -133
  344. package/lib/esm/imodel-components-react/timeline/TimelineComponent.d.ts.map +1 -1
  345. package/lib/esm/imodel-components-react/timeline/TimelineComponent.js +368 -332
  346. package/lib/esm/imodel-components-react/timeline/TimelineComponent.js.map +1 -1
  347. package/lib/esm/imodel-components-react/timeline/TimelineComponent.scss +178 -164
  348. package/lib/esm/imodel-components-react/timeline/interfaces.d.ts +145 -174
  349. package/lib/esm/imodel-components-react/timeline/interfaces.d.ts.map +1 -1
  350. package/lib/esm/imodel-components-react/timeline/interfaces.js +42 -42
  351. package/lib/esm/imodel-components-react/timeline/interfaces.js.map +1 -1
  352. package/lib/esm/imodel-components-react/viewport/ViewportComponent.d.ts +42 -42
  353. package/lib/esm/imodel-components-react/viewport/ViewportComponent.d.ts.map +1 -1
  354. package/lib/esm/imodel-components-react/viewport/ViewportComponent.js +249 -251
  355. package/lib/esm/imodel-components-react/viewport/ViewportComponent.js.map +1 -1
  356. package/lib/esm/imodel-components-react/viewport/ViewportComponentEvents.d.ts +106 -106
  357. package/lib/esm/imodel-components-react/viewport/ViewportComponentEvents.js +96 -95
  358. package/lib/esm/imodel-components-react/viewport/ViewportComponentEvents.js.map +1 -1
  359. package/lib/esm/imodel-components-react.d.ts +81 -82
  360. package/lib/esm/imodel-components-react.d.ts.map +1 -1
  361. package/lib/esm/imodel-components-react.js +86 -87
  362. package/lib/esm/imodel-components-react.js.map +1 -1
  363. package/lib/public/locales/en/UiIModelComponents.json +139 -139
  364. package/package.json +35 -37
  365. package/lib/cjs/imodel-components-react/color/ColorPickerPanel.d.ts +0 -22
  366. package/lib/cjs/imodel-components-react/color/ColorPickerPanel.d.ts.map +0 -1
  367. package/lib/cjs/imodel-components-react/color/ColorPickerPanel.js +0 -146
  368. package/lib/cjs/imodel-components-react/color/ColorPickerPanel.js.map +0 -1
  369. package/lib/cjs/imodel-components-react/color/ColorPickerPanel.scss +0 -94
  370. package/lib/esm/imodel-components-react/color/ColorPickerPanel.d.ts +0 -22
  371. package/lib/esm/imodel-components-react/color/ColorPickerPanel.d.ts.map +0 -1
  372. package/lib/esm/imodel-components-react/color/ColorPickerPanel.js +0 -123
  373. package/lib/esm/imodel-components-react/color/ColorPickerPanel.js.map +0 -1
  374. package/lib/esm/imodel-components-react/color/ColorPickerPanel.scss +0 -94
@@ -1,241 +1,244 @@
1
- /*---------------------------------------------------------------------------------------------
2
- * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
3
- * See LICENSE.md in the project root for license terms and full copyright notice.
4
- *--------------------------------------------------------------------------------------------*/
5
- /** @packageDocumentation
6
- * @module Inputs
7
- */
8
- import "./QuantityNumberInput.scss";
9
- import classnames from "classnames";
10
- import * as React from "react";
11
- import { WebFontIcon } from "@itwin/core-react";
12
- import { SpecialKey } from "@itwin/appui-abstract";
13
- import { IModelApp } from "@itwin/core-frontend";
14
- import { DecimalPrecision, FormatterSpec, FormatTraits, FormatType, Parser } from "@itwin/core-quantity";
15
- import { Input } from "@itwin/itwinui-react";
16
- /** adjust formatter spec to show only primary unit without a label. */
17
- function adjustFormatterSpec(formatterSpec) {
18
- if (undefined === formatterSpec)
19
- return formatterSpec;
20
- const singleUnitConversion = [];
21
- singleUnitConversion.push(formatterSpec.unitConversions[0]);
22
- const newFormat = formatterSpec.format.clone({
23
- showOnlyPrimaryUnit: true,
24
- traits: formatterSpec.format.formatTraits & ~FormatTraits.ShowUnitLabel,
25
- type: FormatType.Decimal,
26
- precision: FormatType.Decimal !== formatterSpec.format.type ? DecimalPrecision.Four : formatterSpec.format.precision,
27
- });
28
- return new FormatterSpec("single-value", newFormat, singleUnitConversion, formatterSpec.persistenceUnit);
29
- }
30
- function convertValueFromDisplayToPersistence(value, unitConversions, unit) {
31
- // istanbul ignore next
32
- if (!unitConversions || 0 === unitConversions.length)
33
- return value;
34
- const unitConversion = unitConversions.find((spec) => spec.name === unit.name);
35
- // istanbul ignore next
36
- if (!unitConversion)
37
- return value;
38
- const convertedValue = (value * unitConversion.conversion.factor) + unitConversion.conversion.offset;
39
- return convertedValue;
40
- }
41
- function getUnitLabel(parserSpec) {
42
- if (undefined === parserSpec)
43
- return "";
44
- const format = parserSpec.format;
45
- // istanbul ignore else
46
- if (!format.units || !format.units[0])
47
- return parserSpec.outUnit.label;
48
- const [unit, label] = format.units[0];
49
- // istanbul ignore next
50
- return label !== null && label !== void 0 ? label : unit.label;
51
- }
52
- const ForwardRefQuantityNumberInput = React.forwardRef(function ForwardRefQuantityNumberInput(props, ref) {
53
- const { containerClassName, persistenceValue, min, max, onChange, onBlur, onKeyDown, step, snap, showTouchButtons, quantityType, ...otherProps } = props;
54
- const rawValueRef = React.useRef(persistenceValue);
55
- const [formatterSpec, setFormatterSpec] = React.useState(() => adjustFormatterSpec(IModelApp.quantityFormatter.findFormatterSpecByQuantityType(quantityType)));
56
- const [parserSpec, setParserSpec] = React.useState(() => IModelApp.quantityFormatter.findParserSpecByQuantityType(quantityType));
57
- const formatValue = React.useCallback((value) => {
58
- if (undefined === value)
59
- return "";
60
- // istanbul ignore else
61
- if (formatterSpec) {
62
- return formatterSpec.applyFormatting(value);
63
- }
64
- // istanbul ignore next
65
- return value.toFixed(2);
66
- }, [formatterSpec]);
67
- const lastFormattedValueRef = React.useRef(formatValue(persistenceValue));
68
- const [formattedValue, setFormattedValue] = React.useState(() => lastFormattedValueRef.current);
69
- React.useEffect(() => {
70
- const handleUnitSystemChanged = (() => {
71
- setFormatterSpec(adjustFormatterSpec(IModelApp.quantityFormatter.findFormatterSpecByQuantityType(quantityType)));
72
- setParserSpec(IModelApp.quantityFormatter.findParserSpecByQuantityType(quantityType));
73
- });
74
- IModelApp.quantityFormatter.onActiveFormattingUnitSystemChanged.addListener(handleUnitSystemChanged);
75
- return () => {
76
- IModelApp.quantityFormatter.onActiveFormattingUnitSystemChanged.removeListener(handleUnitSystemChanged);
77
- };
78
- }, [quantityType]);
79
- React.useEffect(() => {
80
- const handleUnitSystemChanged = ((args) => {
81
- const quantityKey = IModelApp.quantityFormatter.getQuantityTypeKey(quantityType);
82
- // istanbul ignore else
83
- if (args.quantityType === quantityKey) {
84
- setFormatterSpec(adjustFormatterSpec(IModelApp.quantityFormatter.findFormatterSpecByQuantityType(quantityType)));
85
- setParserSpec(IModelApp.quantityFormatter.findParserSpecByQuantityType(quantityType));
86
- }
87
- });
88
- IModelApp.quantityFormatter.onQuantityFormatsChanged.addListener(handleUnitSystemChanged);
89
- return () => {
90
- IModelApp.quantityFormatter.onQuantityFormatsChanged.removeListener(handleUnitSystemChanged);
91
- };
92
- }, [quantityType]);
93
- const unitLabel = getUnitLabel(parserSpec);
94
- // See if new initialValue props have changed since component mounted
95
- React.useEffect(() => {
96
- rawValueRef.current = persistenceValue;
97
- const currentFormattedValue = formatValue(rawValueRef.current);
98
- setFormattedValue(currentFormattedValue);
99
- }, [formatValue, persistenceValue]);
100
- // this is the unprocessed input from user, it is not processed until blur or enter key press
101
- const handleDisplayValueChange = React.useCallback((event) => {
102
- setFormattedValue(event.currentTarget.value);
103
- }, []);
104
- const updateValue = React.useCallback((newValue) => {
105
- let persistedValue = newValue;
106
- // istanbul ignore else
107
- if (parserSpec) {
108
- // convert value from display unit to persistence unit
109
- const [unit] = parserSpec.format.units ? parserSpec.format.units[0] : /* istanbul ignore next */ [parserSpec.outUnit];
110
- persistedValue = convertValueFromDisplayToPersistence(newValue, parserSpec.unitConversions, unit);
111
- rawValueRef.current = persistedValue;
112
- }
113
- const newFormattedVal = formatValue(persistedValue);
114
- onChange && onChange(persistedValue);
115
- setFormattedValue(newFormattedVal);
116
- }, [formatValue, onChange, parserSpec]);
117
- /**
118
- * Used internally to parse the argument x to it's numeric representation.
119
- * If the argument cannot be converted to finite number returns 0; If a
120
- * "precision" prop is specified uses it round the number with that
121
- * precision (no fixed precision here because the return value is float, not
122
- * string).
123
- */
124
- const parseInternal = React.useCallback((x) => {
125
- if (!x)
126
- return 0;
127
- let n = parseFloat(x);
128
- // istanbul ignore next
129
- if (isNaN(n) || !isFinite(n)) {
130
- n = 0;
131
- }
132
- const localPrecision = 6; // TODO get a reasonable value from format
133
- const q = Math.pow(10, localPrecision);
134
- const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;
135
- const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;
136
- n = Math.min(Math.max(n, localMin), localMax);
137
- n = Math.round(n * q) / q;
138
- return n;
139
- }, [min, max]);
140
- const updateValueFromString = React.useCallback((strValue) => {
141
- // istanbul ignore else
142
- if (parserSpec) {
143
- const parseResult = IModelApp.quantityFormatter.parseToQuantityValue(strValue, parserSpec);
144
- // at this point we should have a string value in persistence units without a label
145
- if (Parser.isParsedQuantity(parseResult)) {
146
- const persistedValue = parseResult.value; // in persistence units
147
- // set strValue and let it go through parseInternal which will ensure min/max limits are observed
148
- strValue = formatValue(persistedValue);
149
- }
150
- else {
151
- // istanbul ignore else
152
- if (rawValueRef.current) { // restore last known good value
153
- const lastKnownFormattedVal = formatValue(rawValueRef.current);
154
- setFormattedValue(lastKnownFormattedVal);
155
- return;
156
- }
157
- }
158
- }
159
- const newValue = parseInternal(strValue);
160
- // istanbul ignore else
161
- if (undefined !== newValue)
162
- updateValue(newValue);
163
- }, [formatValue, parseInternal, parserSpec, updateValue]);
164
- const handleBlur = React.useCallback((event) => {
165
- const newVal = parseInternal(event.target.value);
166
- onBlur && onBlur(event);
167
- updateValue(newVal);
168
- }, [parseInternal, updateValue, onBlur]);
169
- const getIncrementValue = React.useCallback((increment) => {
170
- if (typeof step === "function") {
171
- const stepVal = step(increment ? "up" : "down");
172
- return stepVal ? stepVal : 1;
173
- }
174
- return !step ? 1 : step;
175
- }, [step]);
176
- /**
177
- * The internal method that actually sets the new value on the input
178
- */
179
- const applyStep = React.useCallback((increment) => {
180
- const incrementValue = getIncrementValue(increment);
181
- let num = parseInternal(formattedValue) + (increment ? incrementValue : -incrementValue);
182
- if (snap) {
183
- num = Math.round(num / incrementValue) * incrementValue;
184
- }
185
- const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;
186
- const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;
187
- num = Math.min(Math.max(num, localMin), localMax);
188
- updateValue(num);
189
- }, [formattedValue, getIncrementValue, max, min, parseInternal, snap, updateValue]);
190
- const handleKeyDown = React.useCallback((event) => {
191
- // istanbul ignore else
192
- if (event.key === SpecialKey.Enter) {
193
- updateValueFromString(event.currentTarget.value);
194
- event.preventDefault();
195
- }
196
- else if (event.key === SpecialKey.Escape) {
197
- setFormattedValue(formatValue(rawValueRef.current));
198
- event.preventDefault();
199
- }
200
- else if (event.key === SpecialKey.ArrowDown) {
201
- applyStep(false);
202
- event.preventDefault();
203
- }
204
- else if (event.key === SpecialKey.ArrowUp) {
205
- applyStep(true);
206
- event.preventDefault();
207
- }
208
- onKeyDown && onKeyDown(event);
209
- }, [onKeyDown, updateValueFromString, formatValue, applyStep]);
210
- const handleDownClick = React.useCallback((event) => {
211
- applyStep(false);
212
- event.preventDefault();
213
- }, [applyStep]);
214
- const handleUpClick = React.useCallback((event) => {
215
- applyStep(true);
216
- event.preventDefault();
217
- }, [applyStep]);
218
- // istanbul ignore next
219
- const handleFocus = React.useCallback((event) => {
220
- event.currentTarget.select();
221
- }, []);
222
- const isDisabled = !!otherProps.disabled;
223
- const containerClasses = classnames("component-quantity-number-input-container", containerClassName, showTouchButtons && "component-number-buttons-for-touch", isDisabled && "component-quantity-number-input-disabled");
224
- return (React.createElement("div", { className: containerClasses },
225
- React.createElement("div", { className: "component-quantity-number-input-value-and-buttons-container" },
226
- React.createElement(Input, { ref: ref, value: formattedValue, onChange: handleDisplayValueChange, onKeyDown: handleKeyDown, onBlur: handleBlur, onFocus: handleFocus, size: "small", ...otherProps }),
227
- React.createElement("div", { className: classnames("component-quantity-number-input-buttons-container", showTouchButtons && "component-number-buttons-for-touch") },
228
- React.createElement("div", { className: "component-quantity-number-input-button component-quantity-number-input-button-up", tabIndex: -1, onClick: handleUpClick },
229
- React.createElement(WebFontIcon, { iconName: "icon-caret-up" })),
230
- React.createElement("div", { className: "component-quantity-number-input-button component-quantity-number-input-button-down", tabIndex: -1, onClick: handleDownClick },
231
- React.createElement(WebFontIcon, { iconName: "icon-caret-down" })))),
232
- React.createElement("span", { className: "component-quantity-number-input-suffix" }, unitLabel)));
233
- });
234
- /** The QuantityNumberInput component accepts input for quantity values. The quantity value is shown as a single numeric value and the quantity's
235
- * "display" unit is shown next to the input control. The "display" unit is determined by the active unit system as defined by the [QuantityFormatter]($frontend).
236
- * The control also display buttons to increment and decrement the "displayed" value. The value reported by via the onChange function is in "persistence"
237
- * units that can be stored in the iModel.
238
- * @beta
239
- */
240
- export const QuantityNumberInput = ForwardRefQuantityNumberInput;
1
+ /*---------------------------------------------------------------------------------------------
2
+ * Copyright (c) Bentley Systems, Incorporated. All rights reserved.
3
+ * See LICENSE.md in the project root for license terms and full copyright notice.
4
+ *--------------------------------------------------------------------------------------------*/
5
+ /** @packageDocumentation
6
+ * @module Inputs
7
+ */
8
+ import "./QuantityNumberInput.scss";
9
+ import classnames from "classnames";
10
+ import * as React from "react";
11
+ import { Icon } from "@itwin/core-react";
12
+ import { SpecialKey } from "@itwin/appui-abstract";
13
+ import { IModelApp } from "@itwin/core-frontend";
14
+ import { DecimalPrecision, FormatterSpec, FormatTraits, FormatType, Parser } from "@itwin/core-quantity";
15
+ import { Input } from "@itwin/itwinui-react";
16
+ import { SvgCaretDown, SvgCaretDownSmall, SvgCaretUp, SvgCaretUpSmall } from "@itwin/itwinui-icons-react";
17
+ /** adjust formatter spec to show only primary unit without a label. */
18
+ function adjustFormatterSpec(formatterSpec) {
19
+ if (undefined === formatterSpec)
20
+ return formatterSpec;
21
+ const singleUnitConversion = [];
22
+ singleUnitConversion.push(formatterSpec.unitConversions[0]);
23
+ const newFormat = formatterSpec.format.clone({
24
+ showOnlyPrimaryUnit: true,
25
+ traits: formatterSpec.format.formatTraits & ~FormatTraits.ShowUnitLabel,
26
+ type: FormatType.Decimal,
27
+ precision: FormatType.Decimal !== formatterSpec.format.type ? DecimalPrecision.Four : formatterSpec.format.precision,
28
+ });
29
+ return new FormatterSpec("single-value", newFormat, singleUnitConversion, formatterSpec.persistenceUnit);
30
+ }
31
+ function convertValueFromDisplayToPersistence(value, unitConversions, unit) {
32
+ // istanbul ignore next
33
+ if (!unitConversions || 0 === unitConversions.length)
34
+ return value;
35
+ const unitConversion = unitConversions.find((spec) => spec.name === unit.name);
36
+ // istanbul ignore next
37
+ if (!unitConversion)
38
+ return value;
39
+ const convertedValue = (value * unitConversion.conversion.factor) + unitConversion.conversion.offset;
40
+ return convertedValue;
41
+ }
42
+ function getUnitLabel(parserSpec) {
43
+ if (undefined === parserSpec)
44
+ return "";
45
+ const format = parserSpec.format;
46
+ // istanbul ignore else
47
+ if (!format.units || !format.units[0])
48
+ return parserSpec.outUnit.label;
49
+ const [unit, label] = format.units[0];
50
+ // istanbul ignore next
51
+ return label ?? unit.label;
52
+ }
53
+ const ForwardRefQuantityNumberInput = React.forwardRef(function ForwardRefQuantityNumberInput(props, ref) {
54
+ const { containerClassName, persistenceValue, min, max, onChange, onBlur, onKeyDown, step, snap, showTouchButtons, quantityType, ...otherProps } = props;
55
+ const rawValueRef = React.useRef(persistenceValue);
56
+ const [formatterSpec, setFormatterSpec] = React.useState(() => adjustFormatterSpec(IModelApp.quantityFormatter.findFormatterSpecByQuantityType(quantityType)));
57
+ const [parserSpec, setParserSpec] = React.useState(() => IModelApp.quantityFormatter.findParserSpecByQuantityType(quantityType));
58
+ const formatValue = React.useCallback((value) => {
59
+ if (undefined === value)
60
+ return "";
61
+ // istanbul ignore else
62
+ if (formatterSpec) {
63
+ return formatterSpec.applyFormatting(value);
64
+ }
65
+ // istanbul ignore next
66
+ return value.toFixed(2);
67
+ }, [formatterSpec]);
68
+ const lastFormattedValueRef = React.useRef(formatValue(persistenceValue));
69
+ const [formattedValue, setFormattedValue] = React.useState(() => lastFormattedValueRef.current);
70
+ React.useEffect(() => {
71
+ const handleUnitSystemChanged = (() => {
72
+ setFormatterSpec(adjustFormatterSpec(IModelApp.quantityFormatter.findFormatterSpecByQuantityType(quantityType)));
73
+ setParserSpec(IModelApp.quantityFormatter.findParserSpecByQuantityType(quantityType));
74
+ });
75
+ IModelApp.quantityFormatter.onActiveFormattingUnitSystemChanged.addListener(handleUnitSystemChanged);
76
+ return () => {
77
+ IModelApp.quantityFormatter.onActiveFormattingUnitSystemChanged.removeListener(handleUnitSystemChanged);
78
+ };
79
+ }, [quantityType]);
80
+ React.useEffect(() => {
81
+ const handleUnitSystemChanged = ((args) => {
82
+ const quantityKey = IModelApp.quantityFormatter.getQuantityTypeKey(quantityType);
83
+ // istanbul ignore else
84
+ if (args.quantityType === quantityKey) {
85
+ setFormatterSpec(adjustFormatterSpec(IModelApp.quantityFormatter.findFormatterSpecByQuantityType(quantityType)));
86
+ setParserSpec(IModelApp.quantityFormatter.findParserSpecByQuantityType(quantityType));
87
+ }
88
+ });
89
+ IModelApp.quantityFormatter.onQuantityFormatsChanged.addListener(handleUnitSystemChanged);
90
+ return () => {
91
+ IModelApp.quantityFormatter.onQuantityFormatsChanged.removeListener(handleUnitSystemChanged);
92
+ };
93
+ }, [quantityType]);
94
+ const unitLabel = getUnitLabel(parserSpec);
95
+ // See if new initialValue props have changed since component mounted
96
+ React.useEffect(() => {
97
+ rawValueRef.current = persistenceValue;
98
+ const currentFormattedValue = formatValue(rawValueRef.current);
99
+ setFormattedValue(currentFormattedValue);
100
+ }, [formatValue, persistenceValue]);
101
+ // this is the unprocessed input from user, it is not processed until blur or enter key press
102
+ const handleDisplayValueChange = React.useCallback((event) => {
103
+ setFormattedValue(event.currentTarget.value);
104
+ }, []);
105
+ const updateValue = React.useCallback((newValue) => {
106
+ let persistedValue = newValue;
107
+ // istanbul ignore else
108
+ if (parserSpec) {
109
+ // convert value from display unit to persistence unit
110
+ const [unit] = parserSpec.format.units ? parserSpec.format.units[0] : /* istanbul ignore next */ [parserSpec.outUnit];
111
+ persistedValue = convertValueFromDisplayToPersistence(newValue, parserSpec.unitConversions, unit);
112
+ rawValueRef.current = persistedValue;
113
+ }
114
+ const newFormattedVal = formatValue(persistedValue);
115
+ onChange && onChange(persistedValue);
116
+ setFormattedValue(newFormattedVal);
117
+ }, [formatValue, onChange, parserSpec]);
118
+ /**
119
+ * Used internally to parse the argument x to it's numeric representation.
120
+ * If the argument cannot be converted to finite number returns 0; If a
121
+ * "precision" prop is specified uses it round the number with that
122
+ * precision (no fixed precision here because the return value is float, not
123
+ * string).
124
+ */
125
+ const parseInternal = React.useCallback((x) => {
126
+ if (!x)
127
+ return 0;
128
+ let n = parseFloat(x);
129
+ // istanbul ignore next
130
+ if (isNaN(n) || !isFinite(n)) {
131
+ n = 0;
132
+ }
133
+ const localPrecision = 6; // TODO get a reasonable value from format
134
+ const q = Math.pow(10, localPrecision);
135
+ const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;
136
+ const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;
137
+ n = Math.min(Math.max(n, localMin), localMax);
138
+ n = Math.round(n * q) / q;
139
+ return n;
140
+ }, [min, max]);
141
+ const updateValueFromString = React.useCallback((strValue) => {
142
+ // istanbul ignore else
143
+ if (parserSpec) {
144
+ const parseResult = IModelApp.quantityFormatter.parseToQuantityValue(strValue, parserSpec);
145
+ // at this point we should have a string value in persistence units without a label
146
+ if (Parser.isParsedQuantity(parseResult)) {
147
+ const persistedValue = parseResult.value; // in persistence units
148
+ // set strValue and let it go through parseInternal which will ensure min/max limits are observed
149
+ strValue = formatValue(persistedValue);
150
+ }
151
+ else {
152
+ // istanbul ignore else
153
+ if (rawValueRef.current) { // restore last known good value
154
+ const lastKnownFormattedVal = formatValue(rawValueRef.current);
155
+ setFormattedValue(lastKnownFormattedVal);
156
+ return;
157
+ }
158
+ }
159
+ }
160
+ const newValue = parseInternal(strValue);
161
+ // istanbul ignore else
162
+ if (undefined !== newValue)
163
+ updateValue(newValue);
164
+ }, [formatValue, parseInternal, parserSpec, updateValue]);
165
+ const handleBlur = React.useCallback((event) => {
166
+ const newVal = parseInternal(event.target.value);
167
+ onBlur && onBlur(event);
168
+ updateValue(newVal);
169
+ }, [parseInternal, updateValue, onBlur]);
170
+ const getIncrementValue = React.useCallback((increment) => {
171
+ if (typeof step === "function") {
172
+ const stepVal = step(increment ? "up" : "down");
173
+ return stepVal ? stepVal : 1;
174
+ }
175
+ return !step ? 1 : step;
176
+ }, [step]);
177
+ /**
178
+ * The internal method that actually sets the new value on the input
179
+ */
180
+ const applyStep = React.useCallback((increment) => {
181
+ const incrementValue = getIncrementValue(increment);
182
+ let num = parseInternal(formattedValue) + (increment ? incrementValue : -incrementValue);
183
+ if (snap) {
184
+ num = Math.round(num / incrementValue) * incrementValue;
185
+ }
186
+ const localMin = undefined === min ? Number.MIN_SAFE_INTEGER : min;
187
+ const localMax = undefined === max ? Number.MAX_SAFE_INTEGER : max;
188
+ num = Math.min(Math.max(num, localMin), localMax);
189
+ updateValue(num);
190
+ }, [formattedValue, getIncrementValue, max, min, parseInternal, snap, updateValue]);
191
+ const handleKeyDown = React.useCallback((event) => {
192
+ // istanbul ignore else
193
+ if (event.key === SpecialKey.Enter) {
194
+ updateValueFromString(event.currentTarget.value);
195
+ event.preventDefault();
196
+ }
197
+ else if (event.key === SpecialKey.Escape) {
198
+ setFormattedValue(formatValue(rawValueRef.current));
199
+ event.preventDefault();
200
+ }
201
+ else if (event.key === SpecialKey.ArrowDown) {
202
+ applyStep(false);
203
+ event.preventDefault();
204
+ }
205
+ else if (event.key === SpecialKey.ArrowUp) {
206
+ applyStep(true);
207
+ event.preventDefault();
208
+ }
209
+ onKeyDown && onKeyDown(event);
210
+ }, [onKeyDown, updateValueFromString, formatValue, applyStep]);
211
+ const handleDownClick = React.useCallback((event) => {
212
+ applyStep(false);
213
+ event.preventDefault();
214
+ }, [applyStep]);
215
+ const handleUpClick = React.useCallback((event) => {
216
+ applyStep(true);
217
+ event.preventDefault();
218
+ }, [applyStep]);
219
+ // istanbul ignore next
220
+ const handleFocus = React.useCallback((event) => {
221
+ event.currentTarget.select();
222
+ }, []);
223
+ const isDisabled = !!otherProps.disabled;
224
+ const containerClasses = classnames("component-quantity-number-input-container", containerClassName, showTouchButtons && "component-number-buttons-for-touch", isDisabled && "component-quantity-number-input-disabled");
225
+ const caretUp = showTouchButtons ? React.createElement(SvgCaretUp, null) : React.createElement(SvgCaretUpSmall, null);
226
+ const caretDown = showTouchButtons ? React.createElement(SvgCaretDown, null) : React.createElement(SvgCaretDownSmall, null);
227
+ return (React.createElement("div", { className: containerClasses },
228
+ React.createElement("div", { className: "component-quantity-number-input-value-and-buttons-container" },
229
+ React.createElement(Input, { ref: ref, value: formattedValue, onChange: handleDisplayValueChange, onKeyDown: handleKeyDown, onBlur: handleBlur, onFocus: handleFocus, size: "small", ...otherProps }),
230
+ React.createElement("div", { className: classnames("component-quantity-number-input-buttons-container", showTouchButtons && "component-number-buttons-for-touch") },
231
+ React.createElement("div", { className: "component-quantity-number-input-button component-quantity-number-input-button-up", tabIndex: -1, onClick: handleUpClick },
232
+ React.createElement(Icon, { iconSpec: caretUp })),
233
+ React.createElement("div", { className: "component-quantity-number-input-button component-quantity-number-input-button-down", tabIndex: -1, onClick: handleDownClick },
234
+ React.createElement(Icon, { iconSpec: caretDown })))),
235
+ React.createElement("span", { className: "component-quantity-number-input-suffix" }, unitLabel)));
236
+ });
237
+ /** The QuantityNumberInput component accepts input for quantity values. The quantity value is shown as a single numeric value and the quantity's
238
+ * "display" unit is shown next to the input control. The "display" unit is determined by the active unit system as defined by the [QuantityFormatter]($frontend).
239
+ * The control also display buttons to increment and decrement the "displayed" value. The value reported by via the onChange function is in "persistence"
240
+ * units that can be stored in the iModel.
241
+ * @beta
242
+ */
243
+ export const QuantityNumberInput = ForwardRefQuantityNumberInput;
241
244
  //# sourceMappingURL=QuantityNumberInput.js.map