@eturnity/eturnity_reusable_components 7.45.5-EPDM-11314.2 → 7.45.5-EPDM-10609.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 (368) hide show
  1. package/README.md +29 -29
  2. package/package.json +85 -85
  3. package/src/App.vue +30 -30
  4. package/src/Test.vue +128 -128
  5. package/src/assets/icons/arrow_down.svg +3 -3
  6. package/src/assets/icons/arrow_up_red.svg +3 -3
  7. package/src/assets/icons/black_spinner.svg +35 -35
  8. package/src/assets/icons/delete_icon.svg +11 -11
  9. package/src/assets/icons/delete_icon_gray.svg +11 -11
  10. package/src/assets/icons/drag_icon.svg +8 -8
  11. package/src/assets/icons/external_icon.svg +6 -6
  12. package/src/assets/icons/language_icon.svg +6 -6
  13. package/src/assets/icons/pdf_icon.svg +6 -6
  14. package/src/assets/icons/plus_button.svg +4 -4
  15. package/src/assets/icons/search_icon_black.svg +3 -3
  16. package/src/assets/icons/subposition_icon.svg +3 -3
  17. package/src/assets/icons/subposition_marker.svg +3 -3
  18. package/src/assets/icons/warning_icon.svg +3 -3
  19. package/src/assets/svgIcons/2d_active.svg +7 -7
  20. package/src/assets/svgIcons/2d_inactive.svg +8 -8
  21. package/src/assets/svgIcons/3d_active.svg +7 -7
  22. package/src/assets/svgIcons/3d_inactive.svg +8 -8
  23. package/src/assets/svgIcons/_readme.md +7 -7
  24. package/src/assets/svgIcons/accept.svg +5 -5
  25. package/src/assets/svgIcons/activate_panels_active.svg +22 -22
  26. package/src/assets/svgIcons/activate_panels_inactive.svg +20 -20
  27. package/src/assets/svgIcons/add_icon-1.svg +3 -3
  28. package/src/assets/svgIcons/add_icon.svg +4 -4
  29. package/src/assets/svgIcons/address_book.svg +3 -3
  30. package/src/assets/svgIcons/adjust_roof.svg +6 -6
  31. package/src/assets/svgIcons/after_sale_as_a_service.svg +6 -6
  32. package/src/assets/svgIcons/all_good.svg +3 -3
  33. package/src/assets/svgIcons/angle_active.svg +5 -5
  34. package/src/assets/svgIcons/angle_inactive.svg +4 -4
  35. package/src/assets/svgIcons/area_active.svg +11 -11
  36. package/src/assets/svgIcons/area_inactive.svg +26 -26
  37. package/src/assets/svgIcons/areas_tool.svg +14 -14
  38. package/src/assets/svgIcons/arrow_down.svg +3 -3
  39. package/src/assets/svgIcons/arrow_left.svg +4 -4
  40. package/src/assets/svgIcons/arrow_right.svg +4 -4
  41. package/src/assets/svgIcons/arrow_up.svg +3 -3
  42. package/src/assets/svgIcons/attachment.svg +3 -3
  43. package/src/assets/svgIcons/base_layer.svg +3 -3
  44. package/src/assets/svgIcons/battery.svg +3 -3
  45. package/src/assets/svgIcons/bell.svg +3 -3
  46. package/src/assets/svgIcons/bexio.svg +4 -4
  47. package/src/assets/svgIcons/bold.svg +3 -3
  48. package/src/assets/svgIcons/bom.svg +3 -3
  49. package/src/assets/svgIcons/bom_generation.svg +10 -10
  50. package/src/assets/svgIcons/bookmaker.svg +3 -3
  51. package/src/assets/svgIcons/bubble.svg +3 -3
  52. package/src/assets/svgIcons/bug.svg +5 -5
  53. package/src/assets/svgIcons/buildings.svg +55 -55
  54. package/src/assets/svgIcons/bullet_list.svg +8 -8
  55. package/src/assets/svgIcons/calendar.svg +7 -7
  56. package/src/assets/svgIcons/calendar_icon.svg +7 -7
  57. package/src/assets/svgIcons/call.svg +3 -3
  58. package/src/assets/svgIcons/camera.svg +3 -3
  59. package/src/assets/svgIcons/car.svg +3 -3
  60. package/src/assets/svgIcons/cart.svg +3 -3
  61. package/src/assets/svgIcons/charger_icon_white.svg +44 -44
  62. package/src/assets/svgIcons/checkbox.svg +3 -3
  63. package/src/assets/svgIcons/checkmark.svg +3 -0
  64. package/src/assets/svgIcons/clear_formatting.svg +7 -7
  65. package/src/assets/svgIcons/clickable_info.svg +4 -4
  66. package/src/assets/svgIcons/clip.svg +3 -3
  67. package/src/assets/svgIcons/clock.svg +17 -17
  68. package/src/assets/svgIcons/clock_full.svg +3 -3
  69. package/src/assets/svgIcons/close_for_modals,_tool_tips.svg +4 -4
  70. package/src/assets/svgIcons/co_branding.svg +5 -5
  71. package/src/assets/svgIcons/collapse.svg +4 -4
  72. package/src/assets/svgIcons/collections.svg +3 -3
  73. package/src/assets/svgIcons/component_library.svg +7 -7
  74. package/src/assets/svgIcons/consumption_tariffs.svg +43 -43
  75. package/src/assets/svgIcons/context_menu-1.svg +6 -6
  76. package/src/assets/svgIcons/context_menu-2.svg +5 -5
  77. package/src/assets/svgIcons/context_menu.svg +5 -5
  78. package/src/assets/svgIcons/context_menu_tabs.svg +5 -5
  79. package/src/assets/svgIcons/cross.svg +4 -4
  80. package/src/assets/svgIcons/current_variant.svg +4 -4
  81. package/src/assets/svgIcons/dashboard.svg +3 -3
  82. package/src/assets/svgIcons/data_transfer.svg +3 -3
  83. package/src/assets/svgIcons/deadline.svg +4 -4
  84. package/src/assets/svgIcons/deal_flow.svg +5 -5
  85. package/src/assets/svgIcons/delete.svg +4 -4
  86. package/src/assets/svgIcons/delete_area_active.svg +16 -16
  87. package/src/assets/svgIcons/delete_area_inactive.svg +15 -15
  88. package/src/assets/svgIcons/direction_active-1.svg +12 -12
  89. package/src/assets/svgIcons/direction_active.svg +5 -5
  90. package/src/assets/svgIcons/direction_arrow.svg +4 -4
  91. package/src/assets/svgIcons/direction_inactive.svg +4 -4
  92. package/src/assets/svgIcons/dislike.svg +3 -3
  93. package/src/assets/svgIcons/distance_tool.svg +8 -8
  94. package/src/assets/svgIcons/distances_active.svg +9 -9
  95. package/src/assets/svgIcons/distances_inactive.svg +8 -8
  96. package/src/assets/svgIcons/distort_tool.svg +10 -10
  97. package/src/assets/svgIcons/distort_tool2.svg +16 -16
  98. package/src/assets/svgIcons/document.svg +3 -3
  99. package/src/assets/svgIcons/documents.svg +4 -4
  100. package/src/assets/svgIcons/downarrow.svg +3 -3
  101. package/src/assets/svgIcons/download.svg +4 -4
  102. package/src/assets/svgIcons/drag_icon.svg +8 -8
  103. package/src/assets/svgIcons/draggable_corner.svg +5 -5
  104. package/src/assets/svgIcons/draw_tool.svg +3 -3
  105. package/src/assets/svgIcons/duplicate-1.svg +8 -8
  106. package/src/assets/svgIcons/duplicate-2.svg +5 -5
  107. package/src/assets/svgIcons/duplicate.svg +4 -4
  108. package/src/assets/svgIcons/e-mobility_configurator.svg +6 -6
  109. package/src/assets/svgIcons/e_signature.svg +5 -5
  110. package/src/assets/svgIcons/edit_button.svg +3 -3
  111. package/src/assets/svgIcons/electricity_tariff.svg +3 -3
  112. package/src/assets/svgIcons/email.svg +3 -3
  113. package/src/assets/svgIcons/ems-1.svg +3 -3
  114. package/src/assets/svgIcons/ems.svg +3 -3
  115. package/src/assets/svgIcons/end_of_the_list.svg +5 -5
  116. package/src/assets/svgIcons/erase.svg +4 -4
  117. package/src/assets/svgIcons/external_icon.svg +5 -5
  118. package/src/assets/svgIcons/fav_icon.svg +4 -4
  119. package/src/assets/svgIcons/finance.svg +3 -3
  120. package/src/assets/svgIcons/financing_for_pv-1.svg +5 -5
  121. package/src/assets/svgIcons/financing_for_pv-2.svg +3 -3
  122. package/src/assets/svgIcons/financing_for_pv.svg +6 -6
  123. package/src/assets/svgIcons/finish-1.svg +4 -4
  124. package/src/assets/svgIcons/finish.svg +3 -3
  125. package/src/assets/svgIcons/flatten.svg +11 -11
  126. package/src/assets/svgIcons/flatten_roof.svg +20 -20
  127. package/src/assets/svgIcons/folder.svg +3 -3
  128. package/src/assets/svgIcons/free_technology.svg +5 -5
  129. package/src/assets/svgIcons/handle.svg +5 -5
  130. package/src/assets/svgIcons/heat_calc.svg +7 -7
  131. package/src/assets/svgIcons/height_equalize.svg +3 -3
  132. package/src/assets/svgIcons/height_snap.svg +3 -3
  133. package/src/assets/svgIcons/house.svg +3 -3
  134. package/src/assets/svgIcons/house_3d-1.svg +7 -7
  135. package/src/assets/svgIcons/house_3d.svg +7 -7
  136. package/src/assets/svgIcons/inclination.svg +2 -2
  137. package/src/assets/svgIcons/info.svg +3 -3
  138. package/src/assets/svgIcons/initial_situation.svg +3 -3
  139. package/src/assets/svgIcons/integrations.svg +3 -3
  140. package/src/assets/svgIcons/intro-tour-1.svg +3 -3
  141. package/src/assets/svgIcons/intro-tour.svg +3 -3
  142. package/src/assets/svgIcons/inverter-1.svg +5 -5
  143. package/src/assets/svgIcons/inverter.svg +3 -3
  144. package/src/assets/svgIcons/italic.svg +3 -3
  145. package/src/assets/svgIcons/key.svg +3 -3
  146. package/src/assets/svgIcons/lake.svg +29 -29
  147. package/src/assets/svgIcons/layers_close.svg +4 -4
  148. package/src/assets/svgIcons/layers_open.svg +4 -4
  149. package/src/assets/svgIcons/lead_marketplace.svg +6 -6
  150. package/src/assets/svgIcons/lead_provider.svg +4 -4
  151. package/src/assets/svgIcons/length_2d.svg +2 -2
  152. package/src/assets/svgIcons/length_3d.svg +4 -4
  153. package/src/assets/svgIcons/length_calculator.svg +2 -2
  154. package/src/assets/svgIcons/length_in_2d_active.svg +12 -12
  155. package/src/assets/svgIcons/length_in_2d_inctive.svg +13 -13
  156. package/src/assets/svgIcons/light_bulb.svg +3 -3
  157. package/src/assets/svgIcons/like.svg +3 -3
  158. package/src/assets/svgIcons/line_graph.svg +3 -3
  159. package/src/assets/svgIcons/local_subsidies.svg +18 -18
  160. package/src/assets/svgIcons/location.svg +3 -3
  161. package/src/assets/svgIcons/lock.svg +3 -3
  162. package/src/assets/svgIcons/logout.svg +3 -3
  163. package/src/assets/svgIcons/loop.svg +3 -3
  164. package/src/assets/svgIcons/low-vegetation.svg +37 -37
  165. package/src/assets/svgIcons/lunch.svg +4 -4
  166. package/src/assets/svgIcons/magic_tool.svg +6 -6
  167. package/src/assets/svgIcons/map_icon.svg +5 -5
  168. package/src/assets/svgIcons/map_settings.svg +3 -3
  169. package/src/assets/svgIcons/margin_tool.svg +4 -4
  170. package/src/assets/svgIcons/meeting.svg +6 -6
  171. package/src/assets/svgIcons/move_copy.svg +4 -4
  172. package/src/assets/svgIcons/new_area_inactive.svg +11 -11
  173. package/src/assets/svgIcons/next.svg +4 -4
  174. package/src/assets/svgIcons/normal-tg.svg +30 -30
  175. package/src/assets/svgIcons/normal-vegetation.svg +53 -53
  176. package/src/assets/svgIcons/not_equal_to.svg +3 -3
  177. package/src/assets/svgIcons/numbered_list.svg +6 -6
  178. package/src/assets/svgIcons/obstacle_tool.svg +8 -8
  179. package/src/assets/svgIcons/obstacle_tool_origin.svg +3 -3
  180. package/src/assets/svgIcons/offset_tool.svg +8 -8
  181. package/src/assets/svgIcons/open-tg.svg +21 -21
  182. package/src/assets/svgIcons/outline_tool.svg +11 -11
  183. package/src/assets/svgIcons/pan_tool.svg +12 -12
  184. package/src/assets/svgIcons/panels_tool.svg +8 -8
  185. package/src/assets/svgIcons/pen_tool.svg +4 -4
  186. package/src/assets/svgIcons/picker_tool.svg +4 -4
  187. package/src/assets/svgIcons/picture.svg +3 -3
  188. package/src/assets/svgIcons/pin.svg +5 -5
  189. package/src/assets/svgIcons/presentation.svg +3 -3
  190. package/src/assets/svgIcons/previous.svg +4 -4
  191. package/src/assets/svgIcons/profile-1.svg +4 -4
  192. package/src/assets/svgIcons/profile.svg +4 -4
  193. package/src/assets/svgIcons/profitability.svg +3 -3
  194. package/src/assets/svgIcons/project_analysis.svg +4 -4
  195. package/src/assets/svgIcons/project_settings.svg +4 -4
  196. package/src/assets/svgIcons/protected-tg.svg +47 -47
  197. package/src/assets/svgIcons/pv.svg +3 -3
  198. package/src/assets/svgIcons/quotations.svg +6 -6
  199. package/src/assets/svgIcons/redo.svg +6 -6
  200. package/src/assets/svgIcons/resizer.svg +5 -5
  201. package/src/assets/svgIcons/roof_layer.svg +3 -3
  202. package/src/assets/svgIcons/rotate_tool.svg +3 -3
  203. package/src/assets/svgIcons/rotate_view.svg +5 -5
  204. package/src/assets/svgIcons/ruler_tool.svg +3 -3
  205. package/src/assets/svgIcons/run_simulation.svg +3 -3
  206. package/src/assets/svgIcons/save.svg +3 -3
  207. package/src/assets/svgIcons/scaling_tool.svg +8 -8
  208. package/src/assets/svgIcons/sea.svg +34 -34
  209. package/src/assets/svgIcons/search.svg +3 -3
  210. package/src/assets/svgIcons/security.svg +3 -3
  211. package/src/assets/svgIcons/settings.svg +3 -3
  212. package/src/assets/svgIcons/show_in_a_new_tab.svg +12 -12
  213. package/src/assets/svgIcons/smartphone.svg +4 -4
  214. package/src/assets/svgIcons/solar_calc.svg +13 -13
  215. package/src/assets/svgIcons/sorting.svg +4 -4
  216. package/src/assets/svgIcons/split.svg +12 -12
  217. package/src/assets/svgIcons/start_of_the_list.svg +5 -5
  218. package/src/assets/svgIcons/strikethrough.svg +4 -4
  219. package/src/assets/svgIcons/subscriptions.svg +3 -3
  220. package/src/assets/svgIcons/subsidies-1.svg +5 -5
  221. package/src/assets/svgIcons/subsidies-2.svg +3 -3
  222. package/src/assets/svgIcons/subsidies.svg +3 -3
  223. package/src/assets/svgIcons/subtract_icon.svg +3 -3
  224. package/src/assets/svgIcons/suitcase.svg +3 -3
  225. package/src/assets/svgIcons/summer.svg +3 -3
  226. package/src/assets/svgIcons/template_icon_not_clickable.svg +6 -6
  227. package/src/assets/svgIcons/transfer.svg +4 -4
  228. package/src/assets/svgIcons/trim_tool.svg +4 -4
  229. package/src/assets/svgIcons/truck.svg +3 -3
  230. package/src/assets/svgIcons/underlined.svg +3 -3
  231. package/src/assets/svgIcons/undo.svg +6 -6
  232. package/src/assets/svgIcons/uparrow.svg +3 -3
  233. package/src/assets/svgIcons/update.svg +3 -3
  234. package/src/assets/svgIcons/upload_avatar-1.svg +12 -12
  235. package/src/assets/svgIcons/upload_avatar.svg +5 -5
  236. package/src/assets/svgIcons/upload_image.svg +8 -8
  237. package/src/assets/svgIcons/upload_image_tool.svg +7 -7
  238. package/src/assets/svgIcons/variants.svg +6 -6
  239. package/src/assets/svgIcons/vertical_tool.svg +3 -3
  240. package/src/assets/svgIcons/virtual_storage.svg +4 -4
  241. package/src/assets/svgIcons/warning.svg +4 -4
  242. package/src/assets/svgIcons/way.svg +5 -5
  243. package/src/assets/svgIcons/wifi.svg +3 -3
  244. package/src/assets/svgIcons/winter.svg +3 -3
  245. package/src/assets/svgIcons/workflow_template.svg +11 -11
  246. package/src/assets/tests/__mocks__/iconCache.js +1 -1
  247. package/src/assets/tests/__mocks__/svgMock.js +1 -1
  248. package/src/assets/tests/helpers.js +12 -12
  249. package/src/assets/theme.js +45 -44
  250. package/src/components/addNewButton/AddNewButton.stories.js +17 -17
  251. package/src/components/addNewButton/addNewButton.spec.js +23 -23
  252. package/src/components/addNewButton/index.vue +62 -62
  253. package/src/components/banner/actionBanner/ActionBanner.stories.js +45 -45
  254. package/src/components/banner/actionBanner/actionBanner.spec.js +76 -76
  255. package/src/components/banner/actionBanner/index.vue +86 -86
  256. package/src/components/banner/banner/Banner.stories.js +64 -64
  257. package/src/components/banner/banner/banner.spec.js +149 -149
  258. package/src/components/banner/banner/index.vue +205 -205
  259. package/src/components/banner/infoBanner/InfoBanner.spec.js +70 -70
  260. package/src/components/banner/infoBanner/InfoBanner.stories.js +42 -42
  261. package/src/components/banner/infoBanner/index.vue +97 -97
  262. package/src/components/buttons/buttonIcon/index.vue +145 -145
  263. package/src/components/buttons/closeButton/CloseButton.stories.js +25 -25
  264. package/src/components/buttons/closeButton/index.vue +62 -62
  265. package/src/components/buttons/mainButton/MainButton.stories.js +51 -51
  266. package/src/components/buttons/mainButton/index.vue +150 -150
  267. package/src/components/buttons/mainButton/mainButton.spec.js +35 -35
  268. package/src/components/card/Card.stories.js +79 -79
  269. package/src/components/card/card.spec.js +135 -135
  270. package/src/components/card/index.vue +116 -116
  271. package/src/components/collapsableInfoText/index.vue +127 -127
  272. package/src/components/deleteIcon/DeleteIcon.stories.js +29 -29
  273. package/src/components/deleteIcon/index.vue +78 -78
  274. package/src/components/draggableInputHandle/index.vue +46 -46
  275. package/src/components/dropdown/Dropdown.stories.js +53 -53
  276. package/src/components/dropdown/index.vue +138 -138
  277. package/src/components/errorMessage/index.vue +64 -64
  278. package/src/components/filter/filterSettings.vue +669 -669
  279. package/src/components/filter/index.vue +154 -154
  280. package/src/components/filter/parentDropdown.vue +91 -91
  281. package/src/components/icon/Icons.stories.js +41 -41
  282. package/src/components/icon/iconCache.mjs +23 -23
  283. package/src/components/icon/iconCollection.vue +82 -82
  284. package/src/components/icon/index.vue +140 -140
  285. package/src/components/iconWrapper/index.vue +179 -179
  286. package/src/components/infoCard/index.vue +67 -140
  287. package/src/components/infoText/constants.js +4 -0
  288. package/src/components/infoText/index.vue +287 -190
  289. package/src/components/inputs/checkbox/Checkbox.stories.js +63 -63
  290. package/src/components/inputs/checkbox/checkbox.spec.js +109 -109
  291. package/src/components/inputs/checkbox/index.vue +225 -225
  292. package/src/components/inputs/inputNumber/InputNumber.stories.js +150 -150
  293. package/src/components/inputs/inputNumber/index.vue +789 -789
  294. package/src/components/inputs/inputNumberQuestion/index.vue +218 -218
  295. package/src/components/inputs/inputText/InputText.stories.js +75 -75
  296. package/src/components/inputs/inputText/index.vue +380 -380
  297. package/src/components/inputs/radioButton/RadioButton.stories.js +77 -77
  298. package/src/components/inputs/radioButton/defaultProps.js +33 -31
  299. package/src/components/inputs/radioButton/index.vue +309 -309
  300. package/src/components/inputs/radioButton/radioButton.spec.js +269 -269
  301. package/src/components/inputs/searchInput/SearchInput.stories.js +40 -40
  302. package/src/components/inputs/searchInput/index.vue +151 -151
  303. package/src/components/inputs/select/index.vue +910 -918
  304. package/src/components/inputs/select/option/index.vue +156 -156
  305. package/src/components/inputs/select/select.stories.js +58 -58
  306. package/src/components/inputs/slider/index.vue +126 -126
  307. package/src/components/inputs/switchField/index.vue +254 -254
  308. package/src/components/inputs/textAreaInput/TextAreaInput.stories.js +127 -127
  309. package/src/components/inputs/textAreaInput/index.vue +198 -198
  310. package/src/components/inputs/toggle/Toggle.stories.js +77 -77
  311. package/src/components/inputs/toggle/index.vue +317 -317
  312. package/src/components/inputs/toggle/toggle.spec.js +102 -102
  313. package/src/components/label/index.vue +99 -99
  314. package/src/components/markerItem/index.vue +88 -88
  315. package/src/components/modals/actionModal/index.vue +64 -64
  316. package/src/components/modals/infoModal/index.vue +52 -52
  317. package/src/components/modals/modal/index.vue +190 -196
  318. package/src/components/modals/modal/modal.stories.js +31 -31
  319. package/src/components/navigationTabs/index.vue +114 -114
  320. package/src/components/pageSubtitle/PageSubtitle.stories.js +59 -59
  321. package/src/components/pageSubtitle/index.vue +78 -78
  322. package/src/components/pageSubtitle/pageSubtitle.spec.js +46 -46
  323. package/src/components/pageTitle/PageTitle.stories.js +95 -95
  324. package/src/components/pageTitle/index.vue +91 -91
  325. package/src/components/pageTitle/pageTitle.spec.js +46 -46
  326. package/src/components/pagination/index.vue +148 -148
  327. package/src/components/progressBar/index.vue +125 -125
  328. package/src/components/projectMarker/index.vue +300 -300
  329. package/src/components/rangeSlider/Slider.vue +573 -573
  330. package/src/components/rangeSlider/index.vue +517 -517
  331. package/src/components/rangeSlider/utils/dom.js +49 -49
  332. package/src/components/rangeSlider/utils/fns.js +26 -26
  333. package/src/components/roundTabs/index.vue +107 -107
  334. package/src/components/selectedOptions/index.vue +471 -471
  335. package/src/components/selectedOptions/selectedOptions.spec.js +176 -176
  336. package/src/components/selectedOptions/selectedOptions.stories.js +155 -155
  337. package/src/components/sideMenu/index.vue +270 -270
  338. package/src/components/spinner/Spinner.stories.js +34 -34
  339. package/src/components/spinner/index.vue +85 -85
  340. package/src/components/spinner/spinner.spec.js +69 -69
  341. package/src/components/tableDropdown/index.vue +638 -638
  342. package/src/components/tables/mainTable/exampleNested.vue +328 -328
  343. package/src/components/tables/mainTable/index.vue +510 -510
  344. package/src/components/tables/viewTable/index.vue +195 -195
  345. package/src/components/tabsHeader/index.vue +83 -83
  346. package/src/components/threeDots/index.vue +413 -413
  347. package/src/components/videoThumbnail/index.vue +103 -103
  348. package/src/components/videoThumbnail/videoThumbnail.stories.js +33 -33
  349. package/src/helpers/currencyMapping.js +28 -28
  350. package/src/helpers/numberConverter.js +103 -103
  351. package/src/helpers/translateLang.js +128 -128
  352. package/src/main.js +7 -7
  353. package/src/mixins/inputValidations.js +97 -97
  354. package/src/router/dynamicRoutes.js +23 -23
  355. package/src/stories/Button.stories.js +48 -48
  356. package/src/stories/Button.vue +52 -52
  357. package/src/stories/Configure.mdx +364 -364
  358. package/src/stories/Header.stories.js +41 -41
  359. package/src/stories/Header.vue +59 -59
  360. package/src/stories/Page.stories.js +30 -30
  361. package/src/stories/Page.vue +83 -83
  362. package/src/stories/button.css +30 -30
  363. package/src/stories/header.css +32 -32
  364. package/src/stories/page.css +69 -69
  365. package/src/utils/index.js +12 -12
  366. package/src/components/infoCard/InfoCard.stories.js +0 -144
  367. package/src/components/infoCard/defaultProps.js +0 -7
  368. package/src/components/infoCard/infoCard.spec.js +0 -56
@@ -1,269 +1,269 @@
1
- import { mount, DOMWrapper } from '@vue/test-utils'
2
- import RadioButton from '@/components/inputs/radioButton'
3
- import defaultRadioButtonProps from './defaultProps'
4
- import theme from '@/assets/theme'
5
-
6
- jest.mock('@/components/icon/iconCache.mjs', () => ({
7
- // need to mock this due to how jest handles import.meta
8
- fetchIcon: jest.fn(() => Promise.resolve('mocked-icon-url.svg')),
9
- }))
10
- jest.mock('../../../assets/icons/search_icon.png', () => 'search_icon.png')
11
-
12
- describe('RadioButton.vue', () => {
13
- const radioButtons = mount(RadioButton, {
14
- props: defaultRadioButtonProps,
15
- global: {
16
- provide: {
17
- theme,
18
- },
19
- },
20
- })
21
- function findRadioWrappersByCriteria(criteria) {
22
- // criteria === ['active', ..., 'hasImage'], can include any number of criteria
23
- // This function is used for getting a list of
24
- // RadioWrapper components which matches
25
- // all the requested criteria (conjunctive filtering).
26
- // Make sure that criteria don't contradict each other.
27
- // List of possible criteria =
28
- // - active || disabled
29
- // - checked || unchecked
30
- // - hasInfoIcon
31
- // - hasImage
32
-
33
- function getParentRadioWrapper(element) {
34
- // function is used for getting a parent RadioWrapper component
35
- const radioWrapper = element.element.closest(
36
- '[data-test-id^="radioWrapper_"]'
37
- )
38
- return radioWrapper ? new DOMWrapper(radioWrapper) : null
39
- }
40
-
41
- const elementsWithTestIds = radioButtons.findAll('[data-test-id]')
42
- let resultsObject = {}
43
-
44
- criteria.forEach((criterion) => {
45
- resultsObject[criterion] = []
46
- if (criterion === 'active' || criterion === 'disabled') {
47
- const criteriaRelatedElements = elementsWithTestIds.filter((element) =>
48
- element.attributes('data-test-id').startsWith('radioInput_')
49
- )
50
- criteriaRelatedElements.forEach((el) => {
51
- const element = el.element
52
- if (criterion === 'active' ? !element.disabled : element.disabled) {
53
- resultsObject[criterion].push(getParentRadioWrapper(el))
54
- }
55
- })
56
- }
57
- if (criterion === 'checked' || criterion === 'unchecked') {
58
- const criteriaRelatedElements = elementsWithTestIds.filter((element) =>
59
- element.attributes('data-test-id').startsWith('radioInput_')
60
- )
61
- criteriaRelatedElements.forEach((el) => {
62
- const element = el.element
63
- if (criterion === 'checked' ? element.checked : !element.checked) {
64
- resultsObject[criterion].push(getParentRadioWrapper(el))
65
- }
66
- })
67
- }
68
- if (criterion === 'hasInfoIcon') {
69
- const criteriaRelatedElements = elementsWithTestIds.filter((element) =>
70
- element.attributes('data-test-id').startsWith('radioInfo_')
71
- )
72
- criteriaRelatedElements.forEach((element) => {
73
- resultsObject[criterion].push(getParentRadioWrapper(element))
74
- })
75
- }
76
- if (criterion === 'hasImage') {
77
- const criteriaRelatedElements = elementsWithTestIds.filter((element) =>
78
- element.attributes('data-test-id').startsWith('radioOpenImage_')
79
- )
80
- criteriaRelatedElements.forEach((element) => {
81
- resultsObject[criterion].push(getParentRadioWrapper(element))
82
- })
83
- }
84
- })
85
-
86
- let resultArray = []
87
- Object.keys(resultsObject).forEach((criterion, index) => {
88
- if (index === 0) {
89
- resultArray = [...resultsObject[criterion]]
90
- } else {
91
- resultArray = resultArray.filter((element) =>
92
- resultsObject[criterion]
93
- .map((item) => item.attributes('data-test-id'))
94
- .includes(element.attributes('data-test-id'))
95
- )
96
- }
97
- })
98
-
99
- return resultArray
100
- }
101
-
102
- it('Radio buttons are rendered and emit correct payload on change', async () => {
103
- //check that all the options have been rendered
104
- let radioBtnWrappers = radioButtons.findAll('[data-test-id]')
105
- radioBtnWrappers = radioBtnWrappers.filter((wrapper) =>
106
- wrapper.attributes('data-test-id').startsWith('radioWrapper_')
107
- )
108
- const numberOfOptions = radioButtons.props('options').length
109
- expect(radioBtnWrappers).toHaveLength(numberOfOptions)
110
-
111
- // check that the selected element exists and there is only a single copy of it and has correct value
112
- const checkedWrapperArray = findRadioWrappersByCriteria(['checked'])
113
- expect(checkedWrapperArray.length).toBe(1)
114
- const checkedWrapper = checkedWrapperArray[0]
115
- const checkedRadioInput = checkedWrapper.find('input[type="radio"]')
116
- const defaultValueFromProps = radioButtons.props('selectedOption')
117
- expect(checkedRadioInput.attributes('value')).toBe(
118
- defaultValueFromProps
119
- )
120
-
121
- // Log attributes to see what is rendered (commented out just for reference)
122
- // console.log('checkedRadioInput attributes', checkedRadioInput.attributes())
123
-
124
- // Test the label
125
- const labelOfDefaultValue = radioButtons
126
- .props('options')
127
- .find((option) => option.value === defaultValueFromProps).label
128
- expect(checkedWrapper.text()).toContain(labelOfDefaultValue)
129
-
130
- // Test the click on unselected active element
131
- const uncheckedWrapperArray = findRadioWrappersByCriteria([
132
- 'unchecked',
133
- 'active',
134
- ])
135
- const expectedValueOfEmittedEvent = uncheckedWrapperArray[0]
136
- .attributes('data-test-id')
137
- .replace('radioWrapper_', '')
138
- const uncheckedLabelWrapper = uncheckedWrapperArray[0].find('label')
139
- await uncheckedLabelWrapper.trigger('click')
140
- expect(radioButtons.emitted('on-radio-change')).toBeTruthy()
141
- const emittedEvents = radioButtons.emitted('on-radio-change')
142
- expect(emittedEvents).toHaveLength(1) // Check if the event was emitted exactly once
143
- // Check the payload of the event
144
- expect(emittedEvents[emittedEvents.length - 1]).toEqual([
145
- expectedValueOfEmittedEvent,
146
- ])
147
- await radioButtons.setProps({ selectedOption: expectedValueOfEmittedEvent })
148
- }),
149
- it('click on disabled element (|| selected element || info icon || image) does not emit anything', async () => {
150
- // Remember the number of emitted events before triggering clicks
151
- const initialNumberOfEvents =
152
- radioButtons.emitted('on-radio-change').length
153
-
154
- // Test RadioWrapper with disabled element
155
- const disabledWrapperArray = findRadioWrappersByCriteria(['disabled'])
156
- const disabledLabelWrapper = disabledWrapperArray[0].find('label')
157
- await disabledLabelWrapper.trigger('click')
158
- // Check if we still have the same number of emitted events as at the beginning
159
- expect(radioButtons.emitted('on-radio-change')).toHaveLength(
160
- initialNumberOfEvents
161
- )
162
-
163
- // Get RadioWrapper with selected element
164
- const checkedWrapperArray = findRadioWrappersByCriteria(['checked'])
165
- const checkedLabelWrapper = checkedWrapperArray[0].find('label')
166
- await checkedLabelWrapper.trigger('click')
167
- // Check if we still have the same number of emitted events as at the beginning
168
- expect(radioButtons.emitted('on-radio-change')).toHaveLength(
169
- initialNumberOfEvents
170
- )
171
-
172
- // Get RadioWrapper with info icon
173
- const arrayOfWrappersWithInfoIcons = findRadioWrappersByCriteria([
174
- 'active',
175
- 'unchecked',
176
- 'hasInfoIcon',
177
- ])
178
- const infoIconForClick = arrayOfWrappersWithInfoIcons[0].find(
179
- '[data-test-id="infoText_trigger"]'
180
- )
181
- await infoIconForClick.trigger('click')
182
- // Check if we still have the same number of emitted events as at the beginning
183
- expect(radioButtons.emitted('on-radio-change')).toHaveLength(
184
- initialNumberOfEvents
185
- )
186
-
187
- // Get RadioWrapper with image
188
- const arrayOfWrappersWithImage = findRadioWrappersByCriteria([
189
- 'active',
190
- 'unchecked',
191
- 'hasImage',
192
- ])
193
- const testedRadioWrapperWithImage = arrayOfWrappersWithImage[0]
194
- const openImageWrapperTestId = testedRadioWrapperWithImage
195
- .attributes('data-test-id')
196
- .replace('radioWrapper_', 'radioOpenImage_')
197
- const openImageWrapper = testedRadioWrapperWithImage.find(
198
- `[data-test-id="${openImageWrapperTestId}"]`
199
- )
200
- await openImageWrapper.trigger('click')
201
- // Check if we still have the same number of emitted events as at the beginning
202
- expect(radioButtons.emitted('on-radio-change')).toHaveLength(
203
- initialNumberOfEvents
204
- )
205
-
206
- // Since we just clicked on image miniature
207
- // lets check has the corresponding modal been opened
208
- // and is the correct image displayed
209
- const imageModalWrapperTestId = testedRadioWrapperWithImage
210
- .attributes('data-test-id')
211
- .replace('radioWrapper_', 'radioModal_')
212
- const imageModalWrapper = testedRadioWrapperWithImage.find(
213
- `[data-test-id="${imageModalWrapperTestId}"]`
214
- )
215
- expect(imageModalWrapper.attributes('class')).toContain('visible')
216
- const imageWrapperTestId = testedRadioWrapperWithImage
217
- .attributes('data-test-id')
218
- .replace('radioWrapper_', 'radioImage_')
219
- const imageWrapper = testedRadioWrapperWithImage.find(
220
- `[data-test-id="${imageWrapperTestId}"]`
221
- )
222
- const expectedImageSrc = imageWrapper.attributes('src')
223
- const modalImageSrc = imageModalWrapper.find('img').attributes('src')
224
- expect(modalImageSrc).toBe(expectedImageSrc)
225
- //Close the modal
226
- radioButtons.find('.visible .close').trigger('click')
227
- await radioButtons.vm.$nextTick()
228
- expect(imageModalWrapper.attributes('class')).toContain('hidden')
229
- }),
230
- it('test hover on Info Icon', async () => {
231
- // Get RadioWrapper with Info Icon
232
- const arrayOfWrappersWithInfoIcon = findRadioWrappersByCriteria([
233
- 'hasInfoIcon',
234
- ])
235
- //Select tested item and get expected text within the info badge
236
- const testedRadioWrapper =
237
- arrayOfWrappersWithInfoIcon[arrayOfWrappersWithInfoIcon.length - 1]
238
- const valueOfTestedRadioWrapper = testedRadioWrapper
239
- .attributes('data-test-id')
240
- .replace('radioWrapper_', '')
241
- const expectedText = defaultRadioButtonProps.options.find((el) => el.value === valueOfTestedRadioWrapper).infoText
242
- const iconForHover = testedRadioWrapper.find(
243
- '[data-test-id="infoText_trigger"]'
244
- )
245
- await iconForHover.trigger('mouseenter')
246
- expect(testedRadioWrapper.text()).toContain(expectedText)
247
- }),
248
- it('Test the click again after all the manipulations', async () => {
249
- const uncheckedWrapperArray = findRadioWrappersByCriteria([
250
- 'unchecked',
251
- 'active',
252
- ])
253
- const expectedValueOfEmittedEvent = uncheckedWrapperArray[0]
254
- .attributes('data-test-id')
255
- .replace('radioWrapper_', '')
256
- const uncheckedLabelWrapper = uncheckedWrapperArray[0].find('label')
257
- await uncheckedLabelWrapper.trigger('click')
258
- expect(radioButtons.emitted('on-radio-change')).toBeTruthy()
259
- const emittedEvents = radioButtons.emitted('on-radio-change')
260
- expect(emittedEvents).toHaveLength(2) // Check that this is just 2nd emitted event
261
- // Check the payload of the event
262
- expect(emittedEvents[emittedEvents.length - 1]).toEqual([
263
- expectedValueOfEmittedEvent,
264
- ])
265
- await radioButtons.setProps({
266
- selectedOption: expectedValueOfEmittedEvent,
267
- })
268
- })
269
- })
1
+ import { mount, DOMWrapper } from '@vue/test-utils'
2
+ import RadioButton from '@/components/inputs/radioButton'
3
+ import defaultRadioButtonProps from './defaultProps'
4
+ import theme from '@/assets/theme'
5
+
6
+ jest.mock('@/components/icon/iconCache.mjs', () => ({
7
+ // need to mock this due to how jest handles import.meta
8
+ fetchIcon: jest.fn(() => Promise.resolve('mocked-icon-url.svg')),
9
+ }))
10
+ jest.mock('../../../assets/icons/search_icon.png', () => 'search_icon.png')
11
+
12
+ describe('RadioButton.vue', () => {
13
+ const radioButtons = mount(RadioButton, {
14
+ props: defaultRadioButtonProps,
15
+ global: {
16
+ provide: {
17
+ theme,
18
+ },
19
+ },
20
+ })
21
+ function findRadioWrappersByCriteria(criteria) {
22
+ // criteria === ['active', ..., 'hasImage'], can include any number of criteria
23
+ // This function is used for getting a list of
24
+ // RadioWrapper components which matches
25
+ // all the requested criteria (conjunctive filtering).
26
+ // Make sure that criteria don't contradict each other.
27
+ // List of possible criteria =
28
+ // - active || disabled
29
+ // - checked || unchecked
30
+ // - hasInfoIcon
31
+ // - hasImage
32
+
33
+ function getParentRadioWrapper(element) {
34
+ // function is used for getting a parent RadioWrapper component
35
+ const radioWrapper = element.element.closest(
36
+ '[data-test-id^="radioWrapper_"]'
37
+ )
38
+ return radioWrapper ? new DOMWrapper(radioWrapper) : null
39
+ }
40
+
41
+ const elementsWithTestIds = radioButtons.findAll('[data-test-id]')
42
+ let resultsObject = {}
43
+
44
+ criteria.forEach((criterion) => {
45
+ resultsObject[criterion] = []
46
+ if (criterion === 'active' || criterion === 'disabled') {
47
+ const criteriaRelatedElements = elementsWithTestIds.filter((element) =>
48
+ element.attributes('data-test-id').startsWith('radioInput_')
49
+ )
50
+ criteriaRelatedElements.forEach((el) => {
51
+ const element = el.element
52
+ if (criterion === 'active' ? !element.disabled : element.disabled) {
53
+ resultsObject[criterion].push(getParentRadioWrapper(el))
54
+ }
55
+ })
56
+ }
57
+ if (criterion === 'checked' || criterion === 'unchecked') {
58
+ const criteriaRelatedElements = elementsWithTestIds.filter((element) =>
59
+ element.attributes('data-test-id').startsWith('radioInput_')
60
+ )
61
+ criteriaRelatedElements.forEach((el) => {
62
+ const element = el.element
63
+ if (criterion === 'checked' ? element.checked : !element.checked) {
64
+ resultsObject[criterion].push(getParentRadioWrapper(el))
65
+ }
66
+ })
67
+ }
68
+ if (criterion === 'hasInfoIcon') {
69
+ const criteriaRelatedElements = elementsWithTestIds.filter((element) =>
70
+ element.attributes('data-test-id').startsWith('radioInfo_')
71
+ )
72
+ criteriaRelatedElements.forEach((element) => {
73
+ resultsObject[criterion].push(getParentRadioWrapper(element))
74
+ })
75
+ }
76
+ if (criterion === 'hasImage') {
77
+ const criteriaRelatedElements = elementsWithTestIds.filter((element) =>
78
+ element.attributes('data-test-id').startsWith('radioOpenImage_')
79
+ )
80
+ criteriaRelatedElements.forEach((element) => {
81
+ resultsObject[criterion].push(getParentRadioWrapper(element))
82
+ })
83
+ }
84
+ })
85
+
86
+ let resultArray = []
87
+ Object.keys(resultsObject).forEach((criterion, index) => {
88
+ if (index === 0) {
89
+ resultArray = [...resultsObject[criterion]]
90
+ } else {
91
+ resultArray = resultArray.filter((element) =>
92
+ resultsObject[criterion]
93
+ .map((item) => item.attributes('data-test-id'))
94
+ .includes(element.attributes('data-test-id'))
95
+ )
96
+ }
97
+ })
98
+
99
+ return resultArray
100
+ }
101
+
102
+ it('Radio buttons are rendered and emit correct payload on change', async () => {
103
+ //check that all the options have been rendered
104
+ let radioBtnWrappers = radioButtons.findAll('[data-test-id]')
105
+ radioBtnWrappers = radioBtnWrappers.filter((wrapper) =>
106
+ wrapper.attributes('data-test-id').startsWith('radioWrapper_')
107
+ )
108
+ const numberOfOptions = radioButtons.props('options').length
109
+ expect(radioBtnWrappers).toHaveLength(numberOfOptions)
110
+
111
+ // check that the selected element exists and there is only a single copy of it and has correct value
112
+ const checkedWrapperArray = findRadioWrappersByCriteria(['checked'])
113
+ expect(checkedWrapperArray.length).toBe(1)
114
+ const checkedWrapper = checkedWrapperArray[0]
115
+ const checkedRadioInput = checkedWrapper.find('input[type="radio"]')
116
+ const defaultValueFromProps = radioButtons.props('selectedOption')
117
+ expect(checkedRadioInput.attributes('value')).toBe(
118
+ defaultValueFromProps
119
+ )
120
+
121
+ // Log attributes to see what is rendered (commented out just for reference)
122
+ // console.log('checkedRadioInput attributes', checkedRadioInput.attributes())
123
+
124
+ // Test the label
125
+ const labelOfDefaultValue = radioButtons
126
+ .props('options')
127
+ .find((option) => option.value === defaultValueFromProps).label
128
+ expect(checkedWrapper.text()).toContain(labelOfDefaultValue)
129
+
130
+ // Test the click on unselected active element
131
+ const uncheckedWrapperArray = findRadioWrappersByCriteria([
132
+ 'unchecked',
133
+ 'active',
134
+ ])
135
+ const expectedValueOfEmittedEvent = uncheckedWrapperArray[0]
136
+ .attributes('data-test-id')
137
+ .replace('radioWrapper_', '')
138
+ const uncheckedLabelWrapper = uncheckedWrapperArray[0].find('label')
139
+ await uncheckedLabelWrapper.trigger('click')
140
+ expect(radioButtons.emitted('on-radio-change')).toBeTruthy()
141
+ const emittedEvents = radioButtons.emitted('on-radio-change')
142
+ expect(emittedEvents).toHaveLength(1) // Check if the event was emitted exactly once
143
+ // Check the payload of the event
144
+ expect(emittedEvents[emittedEvents.length - 1]).toEqual([
145
+ expectedValueOfEmittedEvent,
146
+ ])
147
+ await radioButtons.setProps({ selectedOption: expectedValueOfEmittedEvent })
148
+ }),
149
+ it('click on disabled element (|| selected element || info icon || image) does not emit anything', async () => {
150
+ // Remember the number of emitted events before triggering clicks
151
+ const initialNumberOfEvents =
152
+ radioButtons.emitted('on-radio-change').length
153
+
154
+ // Test RadioWrapper with disabled element
155
+ const disabledWrapperArray = findRadioWrappersByCriteria(['disabled'])
156
+ const disabledLabelWrapper = disabledWrapperArray[0].find('label')
157
+ await disabledLabelWrapper.trigger('click')
158
+ // Check if we still have the same number of emitted events as at the beginning
159
+ expect(radioButtons.emitted('on-radio-change')).toHaveLength(
160
+ initialNumberOfEvents
161
+ )
162
+
163
+ // Get RadioWrapper with selected element
164
+ const checkedWrapperArray = findRadioWrappersByCriteria(['checked'])
165
+ const checkedLabelWrapper = checkedWrapperArray[0].find('label')
166
+ await checkedLabelWrapper.trigger('click')
167
+ // Check if we still have the same number of emitted events as at the beginning
168
+ expect(radioButtons.emitted('on-radio-change')).toHaveLength(
169
+ initialNumberOfEvents
170
+ )
171
+
172
+ // Get RadioWrapper with info icon
173
+ const arrayOfWrappersWithInfoIcons = findRadioWrappersByCriteria([
174
+ 'active',
175
+ 'unchecked',
176
+ 'hasInfoIcon',
177
+ ])
178
+ const infoIconForClick = arrayOfWrappersWithInfoIcons[0].find(
179
+ '[data-test-id="infoText_trigger"]'
180
+ )
181
+ await infoIconForClick.trigger('click')
182
+ // Check if we still have the same number of emitted events as at the beginning
183
+ expect(radioButtons.emitted('on-radio-change')).toHaveLength(
184
+ initialNumberOfEvents
185
+ )
186
+
187
+ // Get RadioWrapper with image
188
+ const arrayOfWrappersWithImage = findRadioWrappersByCriteria([
189
+ 'active',
190
+ 'unchecked',
191
+ 'hasImage',
192
+ ])
193
+ const testedRadioWrapperWithImage = arrayOfWrappersWithImage[0]
194
+ const openImageWrapperTestId = testedRadioWrapperWithImage
195
+ .attributes('data-test-id')
196
+ .replace('radioWrapper_', 'radioOpenImage_')
197
+ const openImageWrapper = testedRadioWrapperWithImage.find(
198
+ `[data-test-id="${openImageWrapperTestId}"]`
199
+ )
200
+ await openImageWrapper.trigger('click')
201
+ // Check if we still have the same number of emitted events as at the beginning
202
+ expect(radioButtons.emitted('on-radio-change')).toHaveLength(
203
+ initialNumberOfEvents
204
+ )
205
+
206
+ // Since we just clicked on image miniature
207
+ // lets check has the corresponding modal been opened
208
+ // and is the correct image displayed
209
+ const imageModalWrapperTestId = testedRadioWrapperWithImage
210
+ .attributes('data-test-id')
211
+ .replace('radioWrapper_', 'radioModal_')
212
+ const imageModalWrapper = testedRadioWrapperWithImage.find(
213
+ `[data-test-id="${imageModalWrapperTestId}"]`
214
+ )
215
+ expect(imageModalWrapper.attributes('class')).toContain('visible')
216
+ const imageWrapperTestId = testedRadioWrapperWithImage
217
+ .attributes('data-test-id')
218
+ .replace('radioWrapper_', 'radioImage_')
219
+ const imageWrapper = testedRadioWrapperWithImage.find(
220
+ `[data-test-id="${imageWrapperTestId}"]`
221
+ )
222
+ const expectedImageSrc = imageWrapper.attributes('src')
223
+ const modalImageSrc = imageModalWrapper.find('img').attributes('src')
224
+ expect(modalImageSrc).toBe(expectedImageSrc)
225
+ //Close the modal
226
+ radioButtons.find('.visible .close').trigger('click')
227
+ await radioButtons.vm.$nextTick()
228
+ expect(imageModalWrapper.attributes('class')).toContain('hidden')
229
+ }),
230
+ it('test hover on Info Icon', async () => {
231
+ // Get RadioWrapper with Info Icon
232
+ const arrayOfWrappersWithInfoIcon = findRadioWrappersByCriteria([
233
+ 'hasInfoIcon',
234
+ ])
235
+ //Select tested item and get expected text within the info badge
236
+ const testedRadioWrapper =
237
+ arrayOfWrappersWithInfoIcon[arrayOfWrappersWithInfoIcon.length - 1]
238
+ const valueOfTestedRadioWrapper = testedRadioWrapper
239
+ .attributes('data-test-id')
240
+ .replace('radioWrapper_', '')
241
+ const expectedText = defaultRadioButtonProps.options.find((el) => el.value === valueOfTestedRadioWrapper).infoText
242
+ const iconForHover = testedRadioWrapper.find(
243
+ '[data-test-id="infoText_trigger"]'
244
+ )
245
+ await iconForHover.trigger('mouseenter')
246
+ expect(testedRadioWrapper.text()).toContain(expectedText)
247
+ }),
248
+ it('Test the click again after all the manipulations', async () => {
249
+ const uncheckedWrapperArray = findRadioWrappersByCriteria([
250
+ 'unchecked',
251
+ 'active',
252
+ ])
253
+ const expectedValueOfEmittedEvent = uncheckedWrapperArray[0]
254
+ .attributes('data-test-id')
255
+ .replace('radioWrapper_', '')
256
+ const uncheckedLabelWrapper = uncheckedWrapperArray[0].find('label')
257
+ await uncheckedLabelWrapper.trigger('click')
258
+ expect(radioButtons.emitted('on-radio-change')).toBeTruthy()
259
+ const emittedEvents = radioButtons.emitted('on-radio-change')
260
+ expect(emittedEvents).toHaveLength(2) // Check that this is just 2nd emitted event
261
+ // Check the payload of the event
262
+ expect(emittedEvents[emittedEvents.length - 1]).toEqual([
263
+ expectedValueOfEmittedEvent,
264
+ ])
265
+ await radioButtons.setProps({
266
+ selectedOption: expectedValueOfEmittedEvent,
267
+ })
268
+ })
269
+ })
@@ -1,40 +1,40 @@
1
- import SearchInput from './index.vue'
2
-
3
- export default {
4
- title: 'SearchInput',
5
- component: SearchInput,
6
- // argTypes: {},
7
- }
8
-
9
- const Template = (args, { argTypes }) => ({
10
- // Components used in your story `template` are defined in the `components` object
11
- components: { SearchInput },
12
- // The story's `args` need to be mapped into the template through the `setup()` method
13
- props: Object.keys(argTypes),
14
- template: '<search-input v-bind="$props" />',
15
-
16
- // import SearchInput from "@eturnity/eturnity_reusable_components/src/components/inputs/searchInput"
17
- // To use:
18
- // <search-input
19
- // placeholder="Company name"
20
- // :value="companyName"
21
- // :disabled="true"
22
- // inputWidth="250px"
23
- // />
24
- })
25
-
26
- export const Default = Template.bind({})
27
- Default.args = {
28
- placeholder: 'Search...',
29
- disabled: false,
30
- value: '',
31
- inputWidth: '250px',
32
- }
33
-
34
- export const Disabled = Template.bind({})
35
- Disabled.args = {
36
- placeholder: 'Search...',
37
- disabled: true,
38
- value: '',
39
- inputWidth: '250px',
40
- }
1
+ import SearchInput from './index.vue'
2
+
3
+ export default {
4
+ title: 'SearchInput',
5
+ component: SearchInput,
6
+ // argTypes: {},
7
+ }
8
+
9
+ const Template = (args, { argTypes }) => ({
10
+ // Components used in your story `template` are defined in the `components` object
11
+ components: { SearchInput },
12
+ // The story's `args` need to be mapped into the template through the `setup()` method
13
+ props: Object.keys(argTypes),
14
+ template: '<search-input v-bind="$props" />',
15
+
16
+ // import SearchInput from "@eturnity/eturnity_reusable_components/src/components/inputs/searchInput"
17
+ // To use:
18
+ // <search-input
19
+ // placeholder="Company name"
20
+ // :value="companyName"
21
+ // :disabled="true"
22
+ // inputWidth="250px"
23
+ // />
24
+ })
25
+
26
+ export const Default = Template.bind({})
27
+ Default.args = {
28
+ placeholder: 'Search...',
29
+ disabled: false,
30
+ value: '',
31
+ inputWidth: '250px',
32
+ }
33
+
34
+ export const Disabled = Template.bind({})
35
+ Disabled.args = {
36
+ placeholder: 'Search...',
37
+ disabled: true,
38
+ value: '',
39
+ inputWidth: '250px',
40
+ }